.hokm-app{--card-red:#b3202f;--card-ink:#17140f;--card-paper:#f6efdc;max-width:1100px;margin-inline:auto;padding:1rem .8rem 3rem}.hg-menu{display:grid;gap:1.1rem}.hg-mode-grid{display:grid;gap:.9rem}@media (min-width:700px){.hg-mode-grid{grid-template-columns:repeat(2,1fr)}}.hg-mode{text-align:start;display:grid;gap:.35rem;align-content:start;background:linear-gradient(160deg,var(--c-panel-2),var(--c-panel));border:1px solid #c9a24a38;border-radius:var(--r-lg);padding:1.1rem 1.2rem;cursor:pointer;color:var(--c-ivory);transition:transform .12s var(--ease),border-color .15s var(--ease)}.hg-mode:hover{transform:translateY(-2px);border-color:#c9a24a80}.hg-mode h3{margin:0;display:flex;align-items:center;gap:.5rem}.hg-mode p{margin:0;color:var(--c-muted);font-size:var(--fs-sm)}.hg-mode .hg-mode-icon{font-size:1.5rem}.hg-topbar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;justify-content:space-between;margin-bottom:.8rem}.hg-pill{display:inline-flex;align-items:center;gap:.4rem;background:#0000004d;border:1px solid #ffffff1a;border-radius:999px;padding:.35rem .8rem;font-size:var(--fs-xs);color:var(--c-ivory-dim)}.hg-pill strong{color:var(--c-gold-bright)}.hg-iconbtn{min-width:40px;min-height:40px;display:grid;place-items:center;border-radius:10px;border:1px solid #c9a24a59;background:#00000040;color:var(--c-gold-bright);cursor:pointer;font-size:1.1rem}.hg-iconbtn:hover{background:#c9a24a1f}.hg-controls{gap:.4rem}.hg-controls,.hg-scores{display:flex;flex-wrap:wrap}.hg-scores{gap:.6rem}.hg-score{flex:1 1 120px;border-radius:var(--r-md);padding:.5rem .8rem;border:1px solid #ffffff1a;background:#00000047;text-align:center}.hg-score.ns{border-color:#3fae7480}.hg-score.ew{border-color:#c86a6a80}.hg-score .lbl{font-size:var(--fs-xs);color:var(--c-muted)}.hg-score .val{font-size:var(--fs-xl);font-weight:900;color:var(--c-ivory)}.hg-score .sub{font-size:var(--fs-xs);color:var(--c-ivory-dim)}.htable{position:relative;margin-top:.9rem;display:grid;gap:.5rem;grid-template-columns:.8fr 1.6fr .8fr;grid-template-areas:".    north  ." "west center east" ".    south  .";background:radial-gradient(120% 90% at 50% 40%,#14513c 0,#0b3d2e 55%,#072a20 100%);border:10px solid #2a1c12;border-radius:26px;padding:.8rem;box-shadow:inset 0 0 60px #00000073,var(--shadow-2);min-height:440px}.seat-north{grid-area:north}.seat-east{grid-area:east}.seat-west{grid-area:west}.seat-south{grid-area:south}.trick-center{grid-area:center}@media (max-width:760px){.htable{grid-template-columns:1fr 1fr 1fr;grid-template-areas:"west north east" "center center center" "south south south";min-height:auto;gap:.4rem}}.seat{display:flex;flex-direction:column;gap:.3rem;justify-content:center}.seat,.seat-tag{align-items:center}.seat-tag{display:inline-flex;gap:.35rem;padding:.28rem .7rem;border-radius:999px;font-size:var(--fs-xs);font-weight:700;border:1px solid #ffffff24;background:#00000059;color:var(--c-ivory);white-space:nowrap}.seat-tag.team-ns{border-color:#3fae7499}.seat-tag.team-ew{border-color:#c86a6a99}.seat-tag.is-turn{box-shadow:0 0 0 2px var(--c-gold-bright),0 0 14px #e6c76680;animation:turn-pulse 1.3s var(--ease) infinite}.seat-crown{color:var(--c-gold-bright)}.seat-count{font-size:var(--fs-xs);color:var(--c-ivory-dim)}.seat-thinking{font-size:var(--fs-xs);color:var(--c-gold-bright);min-height:1em}@keyframes turn-pulse{50%{box-shadow:0 0 0 2px var(--c-gold-bright),0 0 4px #e6c7664d}}.mini-fan{display:flex}.mini-fan .pcard{margin-inline-start:-22px}.mini-fan .pcard:first-child{margin-inline-start:0}@media (max-width:760px){.mini-fan .pcard{margin-inline-start:-28px}}.trick-center{display:grid;place-items:center;position:relative;min-height:190px}.trick-slots{display:grid;grid-template-columns:repeat(3,1fr);grid-template-areas:".  tn ." "tw . te" ".  ts .";gap:.2rem;align-items:center;justify-items:center}.trick-slot{min-width:46px;min-height:66px}.slot-north{grid-area:tn}.slot-east{grid-area:te}.slot-south{grid-area:ts}.slot-west{grid-area:tw}.trump-chip{position:absolute;inset-block-start:-4px;inset-inline-end:-4px;display:inline-flex;align-items:center;gap:.3rem;background:#00000080;border:1px solid var(--c-gold);color:var(--c-gold-bright);border-radius:999px;padding:.2rem .6rem;font-size:var(--fs-xs);font-weight:800}.trump-chip.red{color:#ff9a9a}.trick-empty{color:var(--c-muted);font-size:var(--fs-sm);text-align:center}.pcard{position:relative;border-radius:9px;background:var(--card-paper);color:var(--card-ink);border:1px solid #00000040;box-shadow:0 2px 5px #00000059;display:grid;-webkit-user-select:none;user-select:none;font-family:Georgia,Times New Roman,serif;overflow:hidden;flex:0 0 auto}.pcard-sm{width:40px;height:58px}.pcard-md{width:58px;height:82px}.pcard-lg{width:72px;height:102px}@media (max-width:480px){.pcard-lg{width:60px;height:86px}}.pcard-red{color:var(--card-red)}.pcard-black{color:var(--card-ink)}.pcard-corner{position:absolute;display:grid;justify-items:center;line-height:1;font-weight:700}.pcard-corner.tl{inset-block-start:4px;inset-inline-start:5px}.pcard-corner.br{inset-block-end:4px;inset-inline-end:5px;transform:rotate(180deg)}.pcard-rank{font-size:.86em}.pcard-sm .pcard-rank{font-size:.7rem}.pcard-suit{font-size:.8em}.pcard-center{place-self:center;font-size:1.9rem}.pcard-lg .pcard-center{font-size:2.4rem}.pcard-sm .pcard-center{font-size:1.2rem}.pcard-center.pcard-face{border:2px double;border-radius:6px;width:62%;height:66%;display:grid;place-items:center}.pcard-back{background:linear-gradient(135deg,#123a2c,#0b2c22);border-color:#c9a24a}.pcard-back-art{position:absolute;inset:4px;border-radius:6px;border:1px solid #c9a24a8c;background-image:repeating-linear-gradient(45deg,#c9a24a2e 0 6px,#0000 6px 12px),repeating-linear-gradient(-45deg,#c9a24a2e 0 6px,#0000 6px 12px)}.pcard-interactive{cursor:pointer;transition:transform .12s var(--ease),box-shadow .12s var(--ease);padding:0}.pcard-playable{box-shadow:0 0 0 2px #3fae74e6,0 4px 10px #0006}.pcard-playable:hover{transform:translateY(-10px)}.pcard-selected{transform:translateY(-14px);box-shadow:0 0 0 3px var(--c-gold-bright),0 8px 16px #00000080}.pcard-disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.35)}.pcard-trump:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 2px #e6c766b3;border-radius:9px;pointer-events:none}.hg-hand-wrap{margin-top:.9rem}.hg-turnmsg{text-align:center;font-weight:700;color:var(--c-ivory);min-height:1.5em;margin-bottom:.5rem}.hg-hand{display:flex;justify-content:center;align-items:flex-end;flex-wrap:wrap;gap:.3rem;padding:.4rem}.hg-hand.fan{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding-bottom:1.2rem}.hg-hand.fan::-webkit-scrollbar{height:6px}.hg-hand.fan::-webkit-scrollbar-thumb{background:#c9a24a66;border-radius:3px}.hg-playbar{display:flex;justify-content:center;gap:.6rem;margin-top:.6rem;flex-wrap:wrap}.trump-choice{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;margin-top:1rem}@media (min-width:480px){.trump-choice{grid-template-columns:repeat(4,1fr)}}.trump-btn{display:grid;place-items:center;gap:.3rem;padding:.9rem .4rem;border-radius:var(--r-md);border:1px solid #c9a24a66;background:#00000040;color:var(--c-ivory);cursor:pointer;font-weight:800;font-size:var(--fs-sm)}.trump-btn .sym{font-size:2rem}.trump-btn.red .sym{color:#ff9a9a}.trump-btn:hover{border-color:var(--c-gold-bright);background:#c9a24a24}.trump-btn .cnt{font-size:var(--fs-xs);color:var(--c-muted)}.hg-banner{text-align:center;padding:.7rem 1rem;border-radius:var(--r-md);border:1px solid #c9a24a66;background:#c9a24a1a;color:var(--c-gold-bright);font-weight:700;margin:.6rem 0}.hg-disclosure{font-size:var(--fs-xs);color:#f0dcae;background:#d9a4411a;border:1px solid #d9a44166;border-radius:var(--r-md);padding:.6rem .9rem;margin-bottom:.6rem}.result-head{text-align:center;margin-bottom:.8rem}.result-emoji{font-size:2.6rem}.result-title{margin:.3rem 0}.result-title.win{color:var(--c-gold-bright)}.result-title.loss{color:var(--c-loss)}.result-msg{color:var(--c-ivory-dim);text-align:center}.result-cta{display:grid;gap:.6rem;margin-top:1.1rem}.result-actions{display:flex;flex-direction:column;gap:.5rem}.hg-setting{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem 0;border-bottom:1px solid #ffffff12}.hg-setting:last-child{border-bottom:none}.hg-setting label{font-weight:600;color:var(--c-ivory);font-size:var(--fs-sm)}.hg-setting .hint{font-size:var(--fs-xs);color:var(--c-muted)}.hg-check,.hg-select{font-family:inherit}.hg-select{background:#0000004d;color:var(--c-ivory);border:1px solid #c9a24a59;border-radius:8px;padding:.4rem .6rem;font-size:var(--fs-sm);min-height:40px}.switch{position:relative;width:46px;height:26px;flex:0 0 auto}.switch input{opacity:0;width:0;height:0}.switch .track{position:absolute;inset:0;background:#ffffff26;border-radius:999px;transition:.2s}.switch .track:before{content:"";position:absolute;height:20px;width:20px;inset-inline-start:3px;top:3px;background:var(--c-ivory);border-radius:50%;transition:.2s}.switch input:checked+.track{background:var(--c-gold-deep)}.switch input:checked+.track:before,[dir=rtl] .switch input:checked+.track:before{transform:translateX(-20px)}.hg-history{display:grid;gap:.4rem}.hg-hrow{display:flex;justify-content:space-between;gap:.6rem;font-size:var(--fs-sm);padding:.5rem .7rem;background:#00000040;border-radius:8px;border:1px solid #ffffff12}.hg-hrow .win{color:var(--c-win);font-weight:700}.hg-hrow .loss{color:var(--c-loss);font-weight:700}