:root{--felt: #14532d;--felt-dark: #052e16;--ink: #f8fafc;--muted: #cbd5e1;--gold: #fbbf24;--card-white: #fffdf7;--red: #b91c1c;--black: #111827;--safe-b: env(safe-area-inset-bottom, 0px);--safe-t: env(safe-area-inset-top, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;height:100%}body{font-family:Segoe UI,system-ui,sans-serif;background:var(--felt-dark);color:var(--ink);line-height:1.35}button,input,select{font:inherit}button{cursor:pointer;min-height:44px;min-width:44px;padding:.45rem .75rem;border:1px solid #334155;background:#1e293b;color:#fff;border-radius:8px}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:#1d4ed8;border-color:#1e3a8a}button.ghost{background:transparent;min-height:36px;font-size:.85rem}input,select{min-height:44px;padding:.4rem .6rem;border-radius:8px;border:1px solid #475569;background:#0f172a;color:#fff}.banner{background:#7f1d1d;padding:.6rem .8rem;border-radius:8px}.banner--float{margin:0 .75rem}.muted,.hand-hint{color:var(--muted)}.kicker{margin:0;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;color:#bbf7d0}h1{margin:.15rem 0 0;font-size:1.15rem}.lobby{min-height:100dvh;padding:calc(1rem + var(--safe-t)) calc(1rem + var(--safe-r)) calc(1rem + var(--safe-b)) calc(1rem + var(--safe-l));display:grid;place-items:center;background:radial-gradient(circle at 50% 20%,#166534 0%,transparent 45%),var(--felt-dark)}.lobby-card{width:min(420px,100%);background:#0f172acc;border:1px solid #334155;border-radius:16px;padding:1.25rem;display:grid;gap:.75rem}.field,.or{display:grid;gap:.35rem}.or{text-align:center;color:var(--muted);font-size:.85rem}.join-row{display:flex;gap:.5rem}.join-row input{flex:1}.table-app{height:100dvh;display:flex;flex-direction:column;padding:var(--safe-t) var(--safe-r) var(--safe-b) var(--safe-l);overflow:hidden}.table-top{display:flex;justify-content:space-between;gap:.75rem;padding:.5rem .75rem;background:#052e16ee;align-items:center}.table-top__meta{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;justify-content:flex-end}.dir{padding:.25rem .55rem;border-radius:999px;background:#064e3b;font-size:.85rem}.felt{min-height:0;flex:1;overflow:auto;background:radial-gradient(ellipse at center,#15803d 0%,var(--felt) 62%,var(--felt-dark) 100%);display:flex;flex-direction:column;gap:.5rem;padding:.5rem}.opponents{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap}.opponents--compact{gap:.35rem}.seat{background:#052e1688;border:2px solid transparent;border-radius:12px;padding:.4rem .5rem;min-width:7.5rem;text-align:center}.seat--turn{border-color:var(--gold);box-shadow:0 0 0 2px #fbbf2466}.seat--compact{min-width:5.5rem;padding:.3rem}.seat__meta{display:flex;justify-content:center;gap:.35rem;align-items:center}.dot{width:.55rem;height:.55rem;border-radius:50%;display:inline-block}.dot--on{background:#4ade80}.dot--off{background:#f87171}.seat__backs{display:flex;justify-content:center;min-height:2.4rem;margin:.25rem 0}.seat__backs .playing-card--mini+.playing-card--mini{margin-left:-.85rem}.seat__stats{display:flex;flex-direction:column;font-size:.78rem;color:#d1fae5}.seat__turn,.seat__penalty,.seat__host,.you-turn{font-size:.75rem;color:var(--gold)}.center{display:flex;justify-content:center;align-items:center;gap:1.25rem;flex:1;min-height:5rem}.pile{display:flex;flex-direction:column;align-items:center;gap:.3rem;background:transparent;border:0;color:inherit;min-width:auto}.pile--draw:disabled{opacity:.7}.pile--discard{position:relative;width:5.6rem}.discard-second{position:absolute;left:-1.1rem;top:.35rem;transform:rotate(-8deg);opacity:.92;z-index:0}.pile--discard .playing-card--pile{position:relative;z-index:1}.pile-empty{width:4.6rem;height:6.4rem;border:2px dashed #86efac66;border-radius:8px;display:grid;place-items:center;font-size:.8rem}.penalty-banner,.finish-line,.late-calls{background:#7f1d1dcc;border-radius:10px;padding:.45rem .65rem;display:flex;flex-wrap:wrap;gap:.45rem;font-size:.9rem}.finish-line{background:#1e3a8acc}.hand-dock{background:#022c22f2;padding:.35rem .5rem .15rem;flex:0 0 auto}.hand-dock__status{display:flex;justify-content:space-between;font-size:.85rem;padding:0 .25rem .25rem}.hand-scroller{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding:.85rem .5rem .35rem;touch-action:pan-x pan-y}.hand-fan{display:flex;align-items:flex-end;width:max-content;padding-left:.4rem;user-select:none;-webkit-user-select:none}.hand-slot{flex:0 0 auto;touch-action:none;cursor:grab;transition:margin .16s ease}.hand-slot+.hand-slot{margin-left:-1.6rem}.hand-fan--dragging .hand-slot{cursor:grabbing}.hand-gap{flex:0 0 2.6rem;width:2.6rem;align-self:stretch;pointer-events:none;transition:width .16s ease,flex-basis .16s ease}.hand-ghost{position:fixed;z-index:40;pointer-events:none;opacity:.68;filter:drop-shadow(0 14px 18px #0009);transform:scale(1.08)}.playing-card--lifted{transform:translateY(-.35rem) rotate(-2deg)}.play-tray{border-top:1px solid #14532d;padding:.4rem .25rem .15rem}.play-tray__title,.hand-hint{margin:0 0 .3rem;font-size:.82rem}.play-tray__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3rem;max-height:28vh;overflow:auto}.play-tray__item{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center}.play-tray__idx{font-weight:700;min-width:1.2rem}.play-tray__actions,.action-bar,.late-calls__row{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.action-bar{padding:.4rem .5rem;background:#02150f;justify-content:stretch}.action-bar button{flex:1 1 auto}.chip{display:inline-flex;gap:.3rem;align-items:center;min-height:40px}.debug-wrap{padding:.25rem .5rem .4rem;background:#02150f}.debug{font-size:.78rem;white-space:pre-wrap;overflow:auto;max-height:18vh;margin:.35rem 0 0}.playing-card{position:relative;border:0;padding:0;background:transparent;min-width:0;min-height:0;color:inherit}.playing-card--hand{width:4.4rem;height:6.15rem}.playing-card--pile{width:4.6rem;height:6.4rem}.playing-card--mini{width:1.7rem;height:2.35rem}.playing-card--button{transition:transform .12s ease}.playing-card--selected{transform:translateY(-.7rem);z-index:2;filter:drop-shadow(0 6px 8px #0008)}.playing-card--selected:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border:2px solid #38bdf8;border-radius:10px;pointer-events:none}.playing-card__face,.playing-card__back{width:100%;height:100%;border-radius:8px;border:1px solid #cbd5e1;background:var(--card-white);box-shadow:0 4px 8px #0005;position:relative;overflow:hidden}.playing-card__back{background:#0f3d4c;border-color:#155e75}.playing-card__back-inner{position:absolute;top:6%;right:6%;bottom:6%;left:6%;border:2px solid #67e8f9;border-radius:5px;background:repeating-linear-gradient(45deg,#134e4a 0,#134e4a 6px,#0f766e 6px,#0f766e 12px);display:grid;place-items:center}.playing-card__back-mark{color:#ecfeff;font-weight:800;font-size:1.1em;text-shadow:0 1px 2px #042f2e}.playing-card__face{color:var(--black)}.playing-card--red .playing-card__face{color:var(--red)}.playing-card__corner{position:absolute;display:flex;flex-direction:column;align-items:center;line-height:1;font-size:.72em}.playing-card__corner b{font-size:1.15em}.playing-card__corner--tl{top:4%;left:6%}.playing-card__corner--br{bottom:4%;right:6%;transform:rotate(180deg)}.playing-card__pip{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:1.7em}.playing-card__pip>*{grid-area:1 / 1}.playing-card__wild-tab{position:absolute;top:0;right:0;z-index:2;font-size:.5em;font-weight:800;letter-spacing:.03em;line-height:1;padding:.22em .38em .26em;background:#ca8a04;color:#fffbeb;border-bottom-left-radius:.4rem}.card-id{display:flex;align-items:baseline;gap:.12em;line-height:1}.card-id__printed{position:relative;opacity:.38;font-weight:600}.card-id__printed:after{content:"";position:absolute;left:-12%;right:-12%;top:46%;border-top:.12em solid currentColor;transform:rotate(-22deg)}.card-id__effective{font-weight:800;font-size:1.08em}.suit--red{color:var(--red)}.suit--black{color:var(--black)}.playing-card__pip-suit--muted{opacity:.22;transform:scale(1.05)}.playing-card__pip-suit--effective{font-size:1.05em;text-shadow:0 1px 0 #fff8,0 4px 8px #0004;z-index:1}.playing-card__rank-badge{z-index:2;font-weight:800;font-size:.85em;line-height:1;padding:.12em .22em;border-radius:.28em;background:#fffdf6ee;border:1px solid #cbd5e1;box-shadow:0 3px 6px #0004;transform:translateY(.85em)}.playing-card__rank-badge--ghost{transform:translateY(1.15em);font-size:.62em}.playing-card__portrait--muted{opacity:.28}.playing-card--mini.playing-card--wild .playing-card__pip,.playing-card--mini.playing-card--wild .playing-card__corner--br{display:grid}.playing-card--mini.playing-card--wild .playing-card__pip{top:28%;right:8%;bottom:8%;left:8%;font-size:1.15em}.playing-card--mini .playing-card__wild-tab{font-size:.42em;padding:.12em .22em}.playing-card--mini .playing-card__rank-badge{transform:none;font-size:.72em}.playing-card--mini .card-id__printed{font-size:.85em}.playing-card__pip:has(.face-portrait){top:16%;right:12%;bottom:18%;left:12%;font-size:1em}.face-portrait,.face-portrait__svg{width:100%;height:100%;display:block}.face-portrait__skin{fill:#f8e4c8;stroke:#7c2d12;stroke-width:1.4}.face-portrait__hair,.face-portrait__beard{fill:#1e293b}.playing-card--red .face-portrait__hair,.playing-card--red .face-portrait__beard{fill:#7f1d1d}.face-portrait__hat,.face-portrait__crown{fill:#ca8a04;stroke:#713f12;stroke-width:1.2}.face-portrait__feather,.face-portrait__profile,.face-portrait__mouth{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.face-portrait__eye{fill:#f8fafc;stroke:#0f172a;stroke-width:1}.face-portrait__pupil{fill:#0f172a}.face-portrait__jewel{fill:#38bdf8}.face-portrait__suit-mark{font-size:14px;fill:currentColor;opacity:.35}.face-portrait--one-eyed .face-portrait__profile{stroke-width:2}.pile--drop-armed{border-radius:12px;box-shadow:0 0 0 2px #fde68a88,0 0 18px #facc1588}.pile--drop-hover{transform:translateY(-.35rem) scale(1.05);box-shadow:0 0 0 3px #fde047,0 12px 24px #0006}.pile--drop-landed{animation:discard-land .4s ease}.hand-ghost--over-discard{opacity:.55}@keyframes discard-land{0%{transform:scale(1.08)}55%{transform:scale(.96)}to{transform:scale(1)}}.playing-card--mini .playing-card__pip,.playing-card--mini .playing-card__corner--br{display:none}.playing-card--mini .playing-card__corner{font-size:.62em}.playing-card__caption{position:absolute;left:0;right:0;bottom:-1.1rem;font-size:.7rem;color:#d1fae5}.lobby-wait{text-align:center;max-width:16rem}@media (min-width: 900px){.playing-card--hand{width:5.2rem;height:7.25rem}.hand-slot+.hand-slot{margin-left:-2.1rem}.table-app{max-width:1100px;margin:0 auto}}@media (max-width: 640px){.table-top{flex-direction:column;align-items:stretch}.table-top__meta{justify-content:stretch}.table-top__meta button{flex:1}.play-tray__list{max-height:22vh}}@media (prefers-reduced-motion: reduce){.hand-slot,.hand-gap,.hand-ghost,.playing-card--lifted,.playing-card--selected{transition:none}.hand-ghost,.pile--drop-hover,.pile--drop-landed{transform:none;animation:none}}@media (orientation: landscape) and (max-height: 500px){.playing-card--hand{width:3.4rem;height:4.75rem}.center{min-height:5.5rem;gap:.7rem}.play-tray__list{max-height:16vh}}