:root{--cw:clamp(52px, 13vmin, 120px);--hand-cw:clamp(64px, 17vmin, 150px);--mini-cw:clamp(34px, 8vmin, 72px);--blind-cw:clamp(56px, 16vmin, 130px);--felt:#0c4630;--ink:#eaf5ee;--accent:#f5c542;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}html{-webkit-text-size-adjust:100%}body{overscroll-behavior:none;touch-action:manipulation;color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:#062318;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;position:fixed;inset:0;overflow:hidden}#root{height:100dvh}button{font:inherit;color:inherit;touch-action:manipulation}.screen{min-height:100dvh;padding:max(16px, env(safe-area-inset-top)) 20px max(16px, env(safe-area-inset-bottom));flex-direction:column;justify-content:center;align-items:center;gap:14px;display:flex}.screen.menu{background:linear-gradient(#1e293b 0%,#0f172a 100%)}.logo{--card-w:clamp(46px, 13vw, 66px);height:calc(var(--card-w) * 1.75);padding-top:calc(var(--card-w) * .25);justify-content:center;margin:0 0 6px;display:flex}.logo-card{width:var(--card-w);height:calc(var(--card-w) * 1.4);margin:0 calc(var(--card-w) * -.16);border-radius:calc(var(--card-w) * .12);color:#1a1a1a;font-size:calc(var(--card-w) * .72);font-weight:900;line-height:calc(var(--card-w) * 1.4);text-align:center;transform-origin:50% 260%;transform:rotate(calc(var(--i) * 9deg)) translateY(calc(var(--i) * var(--i) * 1px));animation:.52s cubic-bezier(.2,.8,.2,1) both logo-deal;animation-delay:calc((var(--i) + 2) * 70ms);background:linear-gradient(160deg,#fff 0%,#f1ede6 100%);transition:transform .22s;position:relative;box-shadow:0 6px 16px #00000073,inset 0 0 0 1px #0000000f}.logo-card.red{color:#d6334a}.logo-pip{top:calc(var(--card-w) * .06);left:calc(var(--card-w) * .1);font-size:calc(var(--card-w) * .22);line-height:1;position:absolute}.logo:hover .logo-card{transform:rotate(calc(var(--i) * 13deg)) translateY(calc(var(--i) * var(--i) * 2px - 4px))}@keyframes logo-deal{0%{opacity:0;transform:translateY(40px)rotate(0)scale(.8)}}.logo-aka{color:#fbbf24;text-shadow:0 2px 10px #fbbf244d;margin:0 0 14px;font-family:Marker Felt,Bradley Hand,Comic Sans MS,cursive;font-size:clamp(17px,4.6vw,22px);transform:rotate(-3deg)}.menu .tagline{color:#94a3b8;text-align:center;max-width:340px;margin:0 auto 22px;font-size:clamp(13px,3.6vw,15px);line-height:1.5}.menu-actions{flex-direction:column;gap:14px;width:min(340px,88vw);display:flex}.menu-btn{text-transform:uppercase;letter-spacing:.14em;color:#fff;border:none;border-radius:18px;min-height:62px;font-size:17px;font-weight:800;box-shadow:0 6px 20px #00000059}.menu-btn.btn-ai{color:#201a02;background:linear-gradient(135deg,#fbbf24 0%,#f59e0b 100%)}.menu-btn.btn-online{background:linear-gradient(135deg,#6366f1 0%,#4f46e5 100%)}.menu-btn.btn-hotseat{background:#ffffff12;border:1px solid #ffffff2e}.name-row{gap:8px;width:min(320px,86vw);display:flex}input[type=text]{min-height:46px;color:var(--ink);background:#00000059;border:1px solid #ffffff40;border-radius:12px;flex:1;padding:0 14px;font-size:16px}.btn{cursor:pointer;background:#ffffff14;border:1px solid #ffffff40;border-radius:999px;min-height:48px;padding:10px 18px;transition:transform 80ms,background .15s}.btn:active{transform:scale(.97)}.btn.primary{background:var(--accent);color:#201a02;border-color:#0000;font-weight:700}.btn.primary:disabled,.btn:disabled{opacity:.45}.btn.ghost{background:0 0;border-style:dashed}.btn.small{border-radius:10px;min-height:40px;padding:6px 12px;font-size:13px}.subtle{opacity:.65;font-size:13px}.error-text{color:#ff9d9d;text-align:center;max-width:86vw;font-size:13px}.room-list{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;width:min(360px,90vw);max-height:38dvh;margin:0;padding:0;list-style:none;overflow-y:auto}.room-list li{background:#00000040;border:1px solid #ffffff26;border-radius:12px;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;padding:12px 14px;display:flex}.back-btn{top:max(10px, env(safe-area-inset-top));left:max(10px, env(safe-area-inset-left));z-index:50;position:fixed}.board-root{height:100dvh;padding:max(6px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));flex-direction:column;gap:6px;display:flex;position:relative;overflow:hidden}.table-canvas{pointer-events:none;position:absolute;inset:0}.table-canvas canvas{width:100%!important;height:100%!important}.table-vignette{background:radial-gradient(#0000 55%,#0000008c 100%);position:absolute;inset:0}.hud{z-index:10;justify-content:space-between;align-items:center;gap:10px;min-height:40px;display:flex;position:relative}.pile-info{opacity:.7;white-space:nowrap;font-size:12px}.toast{z-index:20;white-space:nowrap;text-overflow:ellipsis;background:#000000b8;border:1px solid #f5c54280;border-radius:999px;max-width:92vw;padding:8px 16px;animation:.18s toast-in;position:absolute;top:15%;left:50%;overflow:hidden;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;translate:-50% -6px}}.top-band{z-index:10;min-height:calc(var(--mini-cw) * 1.4 * 3 + 26px);justify-content:space-between;align-items:flex-start;gap:6px;display:flex;position:relative}.rail{--cw:var(--mini-cw);flex-direction:column;align-items:center;gap:5px;display:flex}.rail-label{letter-spacing:.04em;opacity:.7;text-align:center;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:10px;overflow:hidden}.rail-pair{position:relative}.rail-empty{width:var(--cw);height:calc(var(--cw) * 1.4);border:1.5px dashed #ffffff26;border-radius:6px}.opp-fan{height:calc(var(--mini-cw) * 1.4);flex:1;align-self:center;position:relative}.opp-fan-card{background:#131313;border:1px solid #f5c54259;border-radius:5px;width:clamp(24px,6vmin,48px);height:calc(1.62*clamp(24px,6vmin,48px));margin:calc(clamp(24px,6vmin,48px)/-1.23457) 0 0 calc(clamp(24px,6vmin,48px)/-2);position:absolute;top:50%;left:50%}.middle-band{z-index:10;flex:1;justify-content:center;align-items:center;gap:clamp(18px,6vw,30px);display:flex;position:relative}.deck-stack{width:var(--cw);height:calc(var(--cw) * 1.4);flex-shrink:0;position:relative}.deck-count{opacity:.75;font-size:12px;position:absolute;bottom:-22px;left:50%;translate:-50%}.pile-area{touch-action:pan-x;flex-direction:column;align-items:center;gap:6px;display:flex}.pile-area.drop-target .pile-stack:after{content:"";border:2px dashed var(--accent);border-radius:10px;animation:.9s infinite drop-glow;position:absolute;inset:-6px}@keyframes drop-glow{50%{opacity:.45}}.pile-stack{width:var(--cw);height:calc(var(--cw) * 1.4);transition:translate .15s;position:relative}.pile-empty{opacity:.6;border:2px dashed #ffffff40;border-radius:8px;place-items:center;font-size:12px;display:grid;position:absolute;inset:0}.pile-count{opacity:.75;font-size:12px}.need-pill{color:var(--accent);background:#0006;border:1px solid #f5c54259;border-radius:999px;padding:4px 10px;font-size:12px;position:absolute;bottom:6px;right:8px}.need-pill b{font-size:14px}.pickup-btn{z-index:10;align-self:center;min-width:min(240px,70vw);position:relative}.bottom-band{z-index:10;flex-direction:column;align-items:center;gap:8px;padding-bottom:2px;display:flex;position:relative}.row{justify-content:center;align-items:flex-end;display:flex}.hand-fan{--cw:var(--hand-cw);min-height:calc(var(--hand-cw) * 1.5)}.fan-slot{touch-action:none;transform:rotate(var(--rot,0deg)) translateY(var(--lift,0px));transition:transform .12s,margin .12s}.fan-slot.raised,.fan-slot.raised:hover{transform:rotate(var(--rot,0deg)) translateY(-14px);z-index:5}.fan-slot.drawn .card{animation:.55s cubic-bezier(.34,1.4,.64,1) card-drawn}@keyframes card-drawn{0%{transform:rotateY(90deg)translateY(-18px)}to{transform:rotateY(0)translateY(0)}}@media (hover:hover) and (pointer:fine){.fan-slot:hover{transform:rotate(calc(var(--rot,0deg) * .4)) translateY(-18px) scale(1.06);z-index:6}.fan-slot:hover+.fan-slot{transform:rotate(calc(var(--rot,0deg) * .7)) translateX(10px)}}.fan-slot.ghosted{opacity:.25}.facedown-row{--cw:var(--blind-cw);min-height:calc(var(--blind-cw) * 1.4);gap:10px}.blind-slot{touch-action:none}.status-line{align-items:center;gap:8px;font-size:clamp(12px,3.4vw,15px);font-weight:600;display:flex}.not-my-turn{filter:saturate(.7)brightness(.85)}.turn-dot{background:#ffffff4d;border-radius:50%;width:9px;height:9px}.turn-dot.mine{background:var(--accent);box-shadow:0 0 10px var(--accent)}.turn-flash{animation:1s turn-pop}@keyframes turn-pop{0%{scale:1}25%{filter:brightness(1.6);scale:1.25}60%{scale:1}}.status-line .turn-dot.mine{animation:1.6s ease-in-out infinite dot-glow}@keyframes dot-glow{50%{box-shadow:0 0 18px var(--accent)}}.drag-layer{z-index:60;pointer-events:none;--cw:var(--hand-cw);filter:drop-shadow(0 14px 18px #0000008c);position:fixed}.drag-layer .card{transition:transform 50ms linear}.flight-layer{z-index:70;pointer-events:none;--cw:var(--hand-cw);position:fixed;inset:0}.fly-card{translate:-50% -50%;transform:rotate(var(--rot,0deg));will-change:transform;backface-visibility:hidden;transition:transform .55s cubic-bezier(.45,.05,.3,1);position:absolute}.fly-card.go{transform:translate(var(--dx), var(--dy)) rotate(var(--rot,0deg)) scale(var(--sc,1))}.fly-card.instant{animation:.3s cubic-bezier(.5,.05,.35,1) forwards fly-move}@keyframes fly-move{0%{transform:rotate(var(--rot,0deg))}to{transform:translate(var(--dx), var(--dy)) rotate(var(--rot,0deg)) scale(var(--sc,1))}}.fly-card .card{cursor:default}.burn-burst{z-index:65;pointer-events:none;position:fixed}.burn-ghost{left:calc(var(--cw) * -.5);top:calc(var(--cw) * -.7);width:var(--cw);height:calc(var(--cw) * 1.4);--cw:clamp(52px, 14vw, 76px);opacity:0;background:repeating-linear-gradient(45deg,#274168 0 6px,#1d3354 6px 12px);border:1px solid #f5c54299;border-radius:8px;animation:.6s ease-out forwards burn-fly;position:absolute}@keyframes burn-fly{0%{opacity:1;transform:rotate(0)translate(0)}to{opacity:0;transform:translate(var(--bx), var(--by)) rotate(var(--br))}}.burn-flash{background:radial-gradient(circle,#f5c542d9,#0000 65%);border-radius:50%;width:140px;height:140px;animation:.5s ease-out forwards flash-out;position:absolute;top:-70px;left:-70px}@keyframes flash-out{0%{opacity:1;scale:.4}to{opacity:0;scale:1.6}}.card{width:var(--cw);height:calc(var(--cw) * 1.4);color:#16181d;cursor:pointer;background:linear-gradient(160deg,#fff,#e8e8e2);border:1px solid #00000073;border-radius:8px;flex-shrink:0;padding:0;position:relative;box-shadow:0 2px 5px #0006}.card.red{color:#c0392b}.card .corner{flex-direction:column;align-items:center;line-height:1;display:flex;position:absolute;top:3px;left:5px}.card .corner.bottom{inset:auto 5px 3px auto;rotate:180deg}.card .corner b{font-size:calc(var(--cw) * .24)}.card .corner i{font-style:normal;font-size:calc(var(--cw) * .2)}.card .pip{font-size:calc(var(--cw) * .42);opacity:.85;place-items:center;display:grid;position:absolute;inset:0}.card.selected{outline:3px solid var(--accent);transform:translateY(-10px);box-shadow:0 6px 14px #00000080}.card.dimmed{filter:brightness(.82)saturate(.85)}.card.glass{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-shadow:none;background:#ffffff29;border-color:#fff6}.card.back{background:repeating-linear-gradient(45deg,#274168 0 6px,#1d3354 6px 12px);border-color:#101b30}.card.back:after{content:"";border:1px solid #ffffff40;border-radius:5px;position:absolute;inset:5px}.setup{z-index:10;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8px;padding:0 16px;display:flex;position:relative}.setup h2{margin:0;font-size:clamp(22px,6vw,32px)}.setup p{max-width:340px;margin:0 0 12px}.setup-label{letter-spacing:.18em;text-transform:uppercase;opacity:.6;margin-top:10px;font-size:11px}.setup-row{--cw:clamp(64px, 19vw, 92px);gap:12px}.setup-row .card.selected{outline-color:#7fd1ff}.setup-slot{touch-action:none;transition:transform .12s}.setup-slot.ghosted{opacity:.25}.setup-slot.picked .card{outline:3px solid #7fd1ff;transform:translateY(-8px)}.setup-row.drop-hint .setup-slot .card{outline-offset:2px;outline:2px dashed #7fd1ffb3}.setup-row.drop-hint{background:#7fd1ff0f;border-radius:10px;padding:6px}.overlay{z-index:40;background:#0000008c;place-items:center;display:grid;position:fixed;inset:0}.overlay-card{text-align:center;background:#10241b;border:1px solid #f5c54266;border-radius:16px;padding:22px 34px}.overlay-card h2{color:var(--accent);margin:0;font-size:clamp(24px,7vw,36px)}.overlay-actions{justify-content:center;gap:10px;margin-top:16px;display:flex}.invite-code{letter-spacing:6px;color:var(--accent);margin:6px 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(28px,8vw,40px)}.toast-warn{color:#ffb4b4;border-color:#ff787899;top:auto;bottom:18%}.chat-panel{z-index:45;background:#0a1a13f5;border:1px solid #f5c54259;border-radius:14px;flex-direction:column;gap:8px;width:min(340px,100vw - 24px);max-height:50dvh;padding:10px;display:flex;position:fixed;bottom:12px;right:12px;box-shadow:0 10px 30px #00000073}.chat-lines{flex-direction:column;flex:1;gap:6px;display:flex;overflow-y:auto}.chat-line{overflow-wrap:anywhere;background:#ffffff14;border-radius:12px;align-self:flex-start;max-width:85%;padding:6px 10px}.chat-line.mine{background:#f5c54238;align-self:flex-end}.top-band.multi{min-height:calc(var(--seat-cw) * 1.4 * 2 + 56px);--seat-cw:clamp(22px, 5.2vmin, 44px)}.seat-row{flex:1;justify-content:center;gap:6px;min-width:0;display:flex}.seat{--cw:var(--seat-cw);background:#0000001f;border:1px solid #ffffff14;border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:6px;min-width:0;max-width:180px;padding:6px 4px 10px;display:flex;position:relative}.seat.out{opacity:.45}.seat-head{align-items:center;gap:4px;max-width:100%;display:flex}.seat-avatar{opacity:.35;border:1.5px solid #0000;border-radius:50%;flex:none;place-items:center;width:22px;height:22px;font-size:12px;line-height:1;transition:opacity .2s,box-shadow .2s;display:inline-grid}.seat-avatar.on{opacity:1;border-color:var(--accent);background:#f5c54226;box-shadow:0 0 8px #f5c542b3}.seat-name{letter-spacing:.04em;opacity:.7;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:600;overflow:hidden}.seat-name.active{opacity:1;color:var(--accent)}.seat-count{text-align:center;background:#ffffff1f;border-radius:8px;flex:none;min-width:18px;padding:1px 5px;font-size:10px;font-weight:700}.seat-fan{height:calc(var(--seat-cw) * .8);justify-content:center;min-width:20px;display:flex}.seat-back{width:calc(var(--seat-cw) * .55);height:calc(var(--seat-cw) * .8);margin-left:calc(var(--seat-cw) * -.38);background:#131313;border:1px solid #f5c5424d;border-radius:3px}.seat-back:first-child{margin-left:0}.seat-table{gap:3px;display:flex}.seat-slot{width:var(--seat-cw);height:calc(var(--seat-cw) * 1.4);position:relative}.seat-out{background:var(--accent);color:#1a1a1a;letter-spacing:.08em;border-radius:6px;padding:2px 6px;font-size:9px;font-weight:800;position:absolute;bottom:-8px}.status-line .seat-avatar{width:20px;height:20px}.player-pick{letter-spacing:.14em;text-transform:uppercase;opacity:.85;justify-content:center;align-items:center;gap:8px;margin-top:-6px;font-size:12px;display:flex}.player-pick span{opacity:.7;margin-right:4px}.player-pick-btn{width:38px;height:30px;color:var(--ink);background:0 0;border:1px solid #ffffff2e;border-radius:15px;font-weight:700}.player-pick-btn.on{border-color:var(--accent);color:var(--accent);background:#f5c54226}.roster{flex-direction:column;gap:6px;width:min(340px,88vw);margin:8px 0;display:flex}.roster-row{background:#ffffff0f;border-radius:10px;align-items:center;gap:8px;padding:8px 12px;display:flex}.roster-row.empty{opacity:.4;background:0 0;border:1px dashed #fff3}.roster-row small{opacity:.6;margin-left:auto}.toast-action{margin-left:10px}.roster-remove{width:24px;height:24px;color:inherit;cursor:pointer;opacity:.7;background:0 0;border:1px solid #ffffff40;border-radius:50%;margin-left:auto;font-size:15px;line-height:1}.roster-remove:hover{opacity:1}.name-field{flex-direction:column;align-items:center;gap:6px;display:flex}.chat-line .chat-from{opacity:.65;margin-bottom:2px;font-size:10px;display:block}