:root{--bg:#0f3d2e;--felt:#14543f;--ink:#f4f1e8;--muted:#a9c7b9;--card:#fbf9f3;--red:#c0392b;--black:#1d1d1f;--accent:#f1c40f;--bad:#e74c3c;--good:#2ecc71}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}button{font:inherit;cursor:pointer;background:var(--accent);color:#222;border:0;border-radius:8px;padding:8px 14px;font-weight:600}button:disabled{opacity:.4;cursor:default}button.ghost{color:var(--ink);border:1px solid var(--muted);background:0 0}.app{flex-direction:column;gap:14px;max-width:980px;min-height:100vh;margin:0 auto;padding:16px;display:flex}h1{margin:0;font-size:1.4rem}.top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.panel{background:var(--felt);border-radius:14px;padding:14px}.setup{flex-direction:column;gap:14px;max-width:420px;margin:8vh auto;display:flex}.setup label{justify-content:space-between;align-items:center;gap:10px;display:flex}.setup input[type=number],.setup select{border:0;border-radius:6px;width:90px;padding:6px}.seats{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.seat{text-align:center;background:#00000040;border:2px solid #0000;border-radius:12px;min-width:120px;padding:8px 12px}.seat.turn{border-color:var(--accent)}.seat.out{opacity:.45}.seat .name{font-weight:700}.seat .meta{color:var(--muted);font-size:.8rem}.seat .pts.pos{color:var(--good)}.seat .pts.neg{color:var(--bad)}.center{background:var(--felt);border-radius:14px;flex-direction:column;gap:10px;min-height:190px;padding:14px;display:flex}.trickrow{flex-wrap:wrap;align-items:flex-end;gap:14px;min-height:100px;display:flex}.played{color:var(--muted);flex-direction:column;align-items:center;gap:4px;font-size:.75rem;display:flex}.played.win .card{box-shadow:0 0 0 3px var(--accent)}.status{color:var(--muted);font-size:.9rem}.hand{flex-wrap:wrap;justify-content:center;gap:8px;padding:8px 0;display:flex}.card{background:var(--card);-webkit-user-select:none;user-select:none;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;width:64px;height:92px;font-size:1.5rem;font-weight:700;transition:transform .1s;display:flex;box-shadow:0 2px 4px #0006}.card.small{width:46px;height:66px;font-size:1.05rem}.card.red{color:var(--red)}.card.black{color:var(--black)}.card.back{background:repeating-linear-gradient(45deg,#2c5aa0,#2c5aa0 6px,#23497f 6px 12px)}.card.playable{cursor:pointer}.card.playable:hover{transform:translateY(-6px)}.card.selected{box-shadow:0 0 0 3px var(--accent);transform:translateY(-12px)}.card.dim{opacity:.45}.card .s{font-size:1.2em;line-height:1}.actions{justify-content:center;align-items:center;gap:8px;min-height:40px;display:flex}.banner{text-align:center;background:#00000059;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:12px;display:flex}.banner h2{margin:0}.rules-note{color:var(--muted);font-size:.8rem}.seat{min-width:150px}.placed{flex-wrap:wrap;justify-content:center;gap:4px;margin-top:6px;display:flex}.pc{color:var(--muted);flex-direction:column;align-items:center;font-size:.65rem;display:flex}.pc.won .card{box-shadow:0 0 0 2px var(--accent)}.pc .card.small{width:34px;height:48px;font-size:.8rem}.seat.turn{animation:1.2s infinite pulse}.yourturn{background:var(--good);color:#062;border-radius:10px;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 14px;animation:1.2s infinite pulse;display:flex}.yourturn strong{letter-spacing:.05em;font-size:1.2rem}.yourturn .timer{background:#00000040;border-radius:6px;flex:140px;height:10px;overflow:hidden}.yourturn .bar{background:#fff;height:100%;transition:width .2s linear}.yourturn .secs{text-align:right;min-width:60px;font-weight:700}@keyframes pulse{0%,to{box-shadow:0 0 #f1c40f00}50%{box-shadow:0 0 0 4px #f1c40f8c}}.pc.unplayed{opacity:.8;border-left:1px dashed var(--muted);padding-left:4px}.crown{color:var(--accent);font-size:.75rem}.lose{color:var(--muted);font-size:.7rem;font-weight:500}.played.loser .card{opacity:.55}.showdown{flex-direction:column;gap:12px;display:flex}.showdown .round{background:var(--felt);border:2px solid var(--accent);border-radius:14px;padding:12px}.showdown .rtitle{margin-bottom:8px;font-weight:700}.showdown .reason{color:var(--accent);margin-top:8px;font-weight:600}.youtag{color:#fff;letter-spacing:.05em;background:#4da3ff;border-radius:10px;padding:1px 8px;font-size:.7rem}.played.mine .card{outline-offset:2px;outline:3px solid #4da3ff}.handnote{text-align:center;background:#1d4f8f;border-radius:10px;padding:10px 14px;font-weight:600}button,.card{touch-action:manipulation}@media (hover:none){.card.playable:hover{transform:none}}@media (width<=640px){.app{gap:10px;padding:10px}h1{font-size:1.1rem}.setup{margin:3vh auto}.seats{gap:6px}.seat{flex:calc(50% - 6px);min-width:0;padding:6px 8px}.seat .name{font-size:.9rem}.seat .meta{font-size:.7rem}.card{width:46px;height:68px;font-size:1.15rem}.card.small{width:34px;height:50px;font-size:.9rem}.pc .card.small{width:28px;height:40px;font-size:.75rem}.trickrow{gap:8px}.center{min-height:0;padding:10px}.hand{z-index:5;background:var(--bg);padding:8px 0 calc(8px + env(safe-area-inset-bottom));box-shadow:0 -6px 10px var(--bg);flex-wrap:nowrap;gap:6px;position:sticky;bottom:0}.handnote{padding:8px 10px;font-size:.85rem}.actions{flex-wrap:wrap}}.result{border:3px solid var(--muted);text-align:center;background:#0b2b20;border-radius:14px;flex-direction:column;align-items:center;gap:10px;padding:16px;display:flex}.result.won{border-color:var(--good)}.result.lost{border-color:var(--bad)}.result h2{margin:0;font-size:1.6rem}.result p{max-width:560px;margin:0;line-height:1.4}.pointsTable{border-collapse:collapse;min-width:180px}.pointsTable td{text-align:left;padding:3px 12px}.pointsTable td:last-child{text-align:right;font-weight:700}.pointsTable tr.me td{background:#ffffff1a}.pointsTable .pos{color:var(--good)}.pointsTable .neg{color:var(--bad)}.resultActions{gap:8px;display:flex}.setup h3{margin:6px 0 0;font-size:1rem}.setup input[type=text]{border:0;border-radius:6px;width:150px;padding:6px}.code{letter-spacing:.15em;color:var(--accent);background:#00000059;border-radius:8px;padding:2px 10px}.lobbySeats{flex-direction:column;gap:6px;display:flex}.lobbySeat{background:#00000040;border-radius:8px;justify-content:space-between;padding:8px 12px;display:flex}.lobbySeat.empty{opacity:.6}.error{background:var(--bad);color:#fff;border-radius:8px;padding:8px 12px}.toast{background:var(--bad);color:#fff;z-index:20;cursor:pointer;border-radius:8px;padding:8px 14px;position:fixed;top:10px;left:50%;transform:translate(-50%)}button.small{padding:2px 10px;font-size:.85rem}.hostPanel{background:var(--felt);border-radius:10px;padding:8px 12px}.hostPanel summary{cursor:pointer;font-weight:600}.hostPanel .lobbySeat{align-items:center;margin-top:6px}.invite{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.invite.big{flex-direction:column;align-items:stretch}.inviteBar{justify-content:flex-end;display:flex}.redealHands{flex-direction:column;gap:8px;width:100%;display:flex}.redealRow{text-align:left;background:#ffffff0f;border-radius:10px;padding:6px 10px}.redealRow.auto{outline:2px solid var(--accent)}.redealRow.mine .who{color:#4da3ff}.redealRow .who{font-size:.85rem;font-weight:700}.redealRow .trickrow{gap:4px;min-height:0;margin-top:4px}.seg{background:#0000004d;border-radius:8px;flex-shrink:0;display:flex;overflow:hidden}.seg button{color:inherit;cursor:pointer;background:0 0;border:0;border-radius:0;padding:7px 12px;font-size:.9rem}.seg button.on{background:var(--accent);color:#111;font-weight:700}.finding{text-align:center;align-items:center}.spinner{border:5px solid #fff3;border-top-color:var(--accent);border-radius:50%;width:44px;height:44px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=640px){.app{gap:6px;min-height:100dvh;padding:8px}.top{flex-wrap:nowrap}.top h1{white-space:nowrap;text-overflow:ellipsis;font-size:1rem;overflow:hidden}.top .status{display:none}.top button{padding:4px 10px}.seats{grid-template-columns:repeat(2,1fr);gap:4px;display:grid}.seats.n5,.seats.n6,.seats.n3{grid-template-columns:repeat(3,1fr)}.seat{border-radius:8px;min-width:0;padding:4px 5px}.seat .name{white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;overflow:hidden}.seat .turnmark{display:none}.seat .meta,.seat .pts{font-size:.65rem;display:inline}.seat .pts:before{content:" · ";color:var(--muted)}.placed{gap:2px;margin-top:3px}.pc{font-size:.5rem}.pc .card.small{border-radius:4px;width:20px;height:28px;font-size:.6rem}.center{border-radius:10px;gap:4px;padding:6px 8px}.trickrow{gap:6px;min-height:0}.played{gap:2px;font-size:.62rem}.played .card{width:36px;height:52px;font-size:.95rem}.youtag{padding:0 6px;font-size:.6rem}.status{font-size:.8rem}.handnote{padding:6px 8px;font-size:.75rem}.hand{padding-top:4px}.card{width:44px;height:64px}}@media (width<=640px) and (height<=640px){.card{width:40px;height:58px;font-size:1.05rem}.played .card{width:32px;height:46px}.pc .card.small{width:18px;height:25px}}.seat .count{align-items:center;gap:6px;margin:4px 0;display:flex}.seat .count .timer{background:#00000059;border-radius:6px;flex:1;height:10px;overflow:hidden}.seat .count .bar{background:var(--accent);height:100%;transition:width .2s linear}.mystatus{color:#062;background:var(--good);border-radius:8px;padding:6px 10px;font-weight:700}.seat .elig{border-radius:10px;margin-top:2px;padding:1px 8px;font-size:.72rem;font-weight:700;display:inline-block}.seat .elig.yes{background:var(--good);color:#062}.seat .elig.no{color:var(--muted);background:#00000059}@media (width<=640px){.seat .elig{padding:0 5px;font-size:.6rem}}.center{background:0 0;align-items:center;gap:6px;min-height:0;padding:0}.seat{padding:12px 14px}.seat .name{font-size:1.1rem}.seat .meta{font-size:.9rem}.seat .pts{font-size:.95rem;font-weight:700}.seat .elig{padding:2px 10px;font-size:.85rem}.curplay{justify-content:center;align-items:center;min-height:130px;margin:8px 0 4px;display:flex}.curplay .card,.curplay .cardslot{width:84px;height:120px;font-size:2rem}.curplay .cardslot{border:2px dashed #ffffff2e;border-radius:8px}.curplay .played{font-size:.85rem}@media (width<=640px){.seat{padding:6px 7px}.seat .name{font-size:.95rem}.seat .meta,.seat .pts{font-size:.75rem}.seat .elig{padding:1px 6px;font-size:.7rem}.curplay{min-height:76px;margin:4px 0 2px}.curplay .card,.curplay .cardslot{width:50px;height:72px;font-size:1.3rem}.curplay .played{font-size:.65rem}}.seat{position:relative}.seat .wintag{color:#062;background:var(--good);border-radius:8px;margin-bottom:4px;padding:2px 8px;font-size:.9rem;font-weight:800}.seat.winner{border-color:var(--good)}.endbar{flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:96px;padding:8px 0;display:flex}.endbar .resultActions{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.center .status{min-height:1.4em}@media (width<=640px){.endbar{background:var(--bg);min-height:84px;position:sticky;bottom:0}.seat .wintag{padding:1px 5px;font-size:.75rem}}.myseat{justify-content:center;display:flex}.myseat .seat{min-width:220px}@media (width<=640px){.seats.o1{grid-template-columns:1fr}.seats.o2{grid-template-columns:repeat(2,1fr)}.seats.o3,.seats.o5{grid-template-columns:repeat(3,1fr)}.seats.o4{grid-template-columns:repeat(2,1fr)}.myseat .seat{width:60%;min-width:0}}.seat .wintag{min-height:1.5em;padding-top:0;padding-bottom:0;line-height:1.5em}.seat .count{min-height:12px}.center .status{white-space:nowrap;text-overflow:ellipsis;max-width:100%;height:1.5em;line-height:1.5em;overflow:hidden}.center .status.last{height:1.3em;font-size:.8rem;line-height:1.3em}.seat .name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.seat .meta,.seat .pts,.seat .elig{white-space:nowrap}.seat .placed{align-content:flex-start;min-height:60px}.hand{align-items:center;min-height:100px}@media (width<=640px){.center .status{font-size:.75rem}.seat .placed{min-height:34px}.hand{min-height:70px}}.mybar{justify-content:center;align-items:center;gap:10px;display:flex}.mybar.out{opacity:.5}.mybar .card,.mybar .cardslot{width:46px;height:66px;font-size:1.2rem}.mybar .cardslot{border:2px dashed #ffffff2e;border-radius:6px}.mybar .played .card{outline:none}.mybar .mininfo{flex-direction:column;flex:0 260px;gap:4px;min-width:150px;display:flex}.mybar .count{min-height:10px}.mybar .count .timer{background:#00000059;border-radius:6px;height:10px;overflow:hidden}.mybar .count .bar{background:var(--accent);height:100%;transition:width .2s linear}.mybar .mline{white-space:nowrap;flex-wrap:nowrap;align-items:center;gap:8px;font-size:.85rem;display:flex}.mybar .elig{border-radius:10px;padding:1px 6px;font-size:.7rem;font-weight:700}.mybar .elig.yes{background:var(--good);color:#062}.mybar .elig.no{color:var(--muted);background:#00000059}.mybar .pts.pos{color:var(--good)}.mybar .pts.neg{color:var(--bad)}.mybar.winner .mline b{color:var(--good)}@media (width<=640px){.app{gap:4px;height:100dvh;min-height:0;padding:6px;overflow:hidden}.seats{gap:4px}.seat{padding:3px 4px}.seat .name{font-size:.78rem}.seat .wintag{min-height:1.3em;font-size:.65rem;line-height:1.3em}.seat .count{min-height:6px;margin:1px 0}.seat .count .timer{height:6px}.seat .meta,.seat .pts{font-size:.62rem}.seat .elig{width:fit-content;margin:1px auto;padding:0 5px;font-size:.58rem;display:block}.curplay{min-height:58px;margin:2px 0 0}.curplay .card,.curplay .cardslot{width:38px;height:54px;font-size:1.05rem}.curplay .played{gap:0;font-size:.55rem}.seat .placed{min-height:0;margin-top:2px}.center{flex:none;gap:2px}.center .status{font-size:.7rem}.mybar .card,.mybar .cardslot{width:38px;height:54px}.hand{min-height:0;padding:2px 0 calc(2px + env(safe-area-inset-bottom))}.hand .card{width:42px;height:60px}.endbar{gap:2px;min-height:0;padding:2px 0}}.mychips{align-items:flex-start;gap:3px;min-height:40px;display:flex}.mychips .pc .card.small{width:26px;height:37px;font-size:.75rem}.mybar .mininfo{flex:0 300px}@media (width<=640px){.mychips{min-height:36px}.mychips .pc .card.small{width:24px;height:34px;font-size:.7rem}}.curplay{flex-direction:column;justify-content:center;height:142px;min-height:0}.curplay .played,.curplay .cardslot{flex:none}.curplay .cardslot{margin-bottom:1.3em}.curplay .played>span{white-space:nowrap;height:1.3em;line-height:1.3em}.seat .placed{flex-wrap:nowrap;align-content:flex-start;height:66px;min-height:0;overflow:hidden}.mychips{height:52px;min-height:0;overflow:hidden}.pc>span{white-space:nowrap;height:1.2em;line-height:1.2em}@media (width<=640px){.curplay{height:70px}.seat .placed{height:40px}.curplay{height:64px;margin:0}.curplay .cardslot{margin-bottom:10px}.curplay .played>span{height:10px;line-height:10px}.seat .placed{height:36px;margin-top:1px}.pc>span{height:8px;line-height:8px}.mychips{height:40px}.seat .meta,.seat .pts{line-height:1.1}}@media (width<=640px) and (height<=700px){.curplay{height:54px}.curplay .card,.curplay .cardslot{width:32px;height:46px;font-size:.9rem}.curplay .cardslot{margin-bottom:8px}.seat .placed{height:30px}.pc .card.small,.mychips .pc .card.small{width:18px;height:25px;font-size:.55rem}.mychips{height:32px}.mybar .card,.mybar .cardslot{width:32px;height:46px}.seat .wintag{min-height:1em;line-height:1em}.hand .card{width:40px;height:56px}}.seat .placed{flex-wrap:nowrap;justify-content:center;overflow:visible}.seat .placed .pc{flex:none}@media (width<=640px){.seat .placed{gap:0}.seat .placed .pc .card.small{box-shadow:0 0 0 1px #00000080}.seat .placed .pc.won .card{box-shadow:0 0 0 2px var(--accent);z-index:1;position:relative}.seat .placed .pc>span{display:none}.seat .placed .pc .card.small{width:16px;height:25px;box-shadow:none;border-radius:3px;font-size:.52rem}.seat .placed .pc.unplayed{border-left:0;margin-left:3px;padding-left:0}.seat .name{font-size:.78rem;display:inline}.seat .meta{margin-left:3px;display:inline}.seat .meta:before{content:"· "}.seat .elig{margin:1px 2px 0 0;display:inline-block}.seat .pts{font-size:.65rem;display:inline}.seat .pts:before{content:""}.seat .wonword{display:none}.seat .count{margin:1px 0}.seat .placed{flex-wrap:wrap;place-content:flex-start center;gap:2px;height:76px;margin-top:2px}.seat .placed .pc+.pc{margin-left:0}.seat .placed .pc .card.small{border-radius:4px;width:28px;height:38px;font-size:.75rem}.seat .placed .pc.won .card{box-shadow:0 0 0 2px var(--accent)}.seat .placed .pc{flex:0 0 30%;justify-content:center;display:flex}.seat .placed .pc.unplayed{margin-left:0}.curplay .card,.curplay .cardslot{width:32px;height:46px}.seat{position:relative}.seat .count{min-height:0;margin:0;position:absolute;top:0;left:6px;right:6px}.seat .count .timer{height:4px}.seat .placed{height:calc(var(--ch) * 2 + 4px)}.curplay{height:calc(var(--cc) + 12px)}.curplay .card,.curplay .cardslot{height:var(--cc);width:calc(var(--cc) * .7);font-size:calc(var(--cc) * .38)}.curplay .cardslot{margin-bottom:10px}.mychips .pc>span{display:none}.mychips{height:calc(var(--ch) * .8)}.app{--ch:clamp(24px, 5.9dvh, 60px);--cc:clamp(40px, 9.2dvh, 96px)}.seat .placed{grid-template-columns:repeat(3,1fr);grid-auto-rows:var(--ch);height:calc(var(--ch) * 2 + 3px);align-content:start;justify-items:center;gap:3px;display:grid}.seat .placed .pc{width:100%;height:var(--ch);flex:none;justify-content:center;margin:0;display:flex}.seat .placed .pc .card.small{height:var(--ch);width:min(100%, calc(var(--ch) * .74));font-size:calc(var(--ch) * .36)}.curplay .card,.curplay .cardslot{width:calc(var(--cc) * .7);max-width:100%}.mychips{height:var(--ch);gap:3px}.mychips .pc .card.small{height:var(--ch);width:calc(var(--ch) * .74);font-size:calc(var(--ch) * .36)}.mybar .mininfo{flex:0 auto;min-width:0}.mybar .card,.mybar .cardslot{height:var(--cc);width:calc(var(--cc) * .7);font-size:calc(var(--cc) * .38)}}