:root{--pitch: #0b3d2e;--pitch-2: #0f4d39;--ink: #14201a;--cream: #f4f1e8;--muted: #9fb8ad;--accent: #f2b705;--good: #2fbf71;--bad: #ff5c5c;--radius: 14px;color-scheme:dark;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:#072a20;color:var(--cream);overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.45}input{font:inherit}h1,h2,h3{margin:0}h3{margin:18px 0 8px;font-size:15px;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}.muted{color:var(--muted)}.small{font-size:13px}.center{text-align:center}.error{color:var(--bad);font-size:14px;margin:6px 0}.row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:12px 0}.row.tight{justify-content:flex-start;margin:0}.screen{max-width:480px;margin:0 auto;min-height:100%;padding:calc(env(safe-area-inset-top) + 12px) 16px calc(env(safe-area-inset-bottom) + 20px);background:radial-gradient(120% 60% at 50% 0%,#135c45 0%,var(--pitch) 60%,#072a20 100%)}.topbar{display:flex;align-items:center;gap:8px;margin-bottom:14px}.topbar h1{flex:1;text-align:center;font-size:19px}.topbar-right{min-width:40px;display:flex;justify-content:flex-end}.icon-btn{width:40px;height:40px;border-radius:50%;border:0;background:#ffffff14;font-size:18px;flex:none}.icon-btn-space{width:40px}.btn{border:0;border-radius:999px;padding:12px 20px;font-weight:700;background:#ffffff1a;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px}.btn.primary{background:var(--accent);color:var(--ink)}.btn.ghost{background:#ffffff14;border:1px solid rgba(255,255,255,.18)}.btn.danger{background:var(--bad);color:#fff}.btn.whatsapp{background:#25d366;color:#06311a}.btn.small{padding:6px 12px;font-size:13px}.btn.wide{width:100%;margin-top:16px;padding:15px;font-size:17px}.link-btn{background:none;border:0;color:var(--accent);font-weight:700;padding:4px 8px}.badge{font-size:10px;font-weight:800;padding:2px 6px;border-radius:6px;background:#ffffff24;letter-spacing:.03em}.badge.bot{background:#4c6ef5;color:#fff}.badge.whistle{background:var(--accent);color:var(--ink)}.badge.away{background:var(--bad);color:#fff}.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 24px);transform:translate(-50%);background:#1d2b25;border:1px solid rgba(255,255,255,.15);padding:10px 16px;border-radius:12px;z-index:80;max-width:calc(100% - 32px);text-align:center;animation:fade 2.6s forwards}@keyframes fade{0%,80%{opacity:1}to{opacity:0}}.offline{position:fixed;top:0;left:0;right:0;background:var(--bad);color:#fff;text-align:center;font-size:13px;padding:calc(env(safe-area-inset-top) + 4px) 8px 4px;z-index:90}.splash{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}.logo{font-size:44px;font-weight:900;letter-spacing:-.02em}.logo span{color:var(--accent)}.logo.big{font-size:56px}.home-top{display:flex;justify-content:space-between;align-items:center}.profile-chip{display:flex;align-items:center;gap:10px;background:none;border:0;text-align:left;padding:0}.profile-chip span{display:flex;flex-direction:column}.profile-chip small{color:var(--muted)}.coins{font-weight:800;background:#00000040;padding:6px 12px;border-radius:999px}.level-bar{height:6px;background:#ffffff1f;border-radius:3px;margin:10px 0 0;overflow:hidden}.level-bar span{display:block;height:100%;background:var(--accent)}.brand{text-align:center;margin:44px 0 30px}.brand p{color:var(--muted);margin:14px 0 0}.brand .demo-note{font-size:12px;background:#00000040;border-radius:10px;padding:6px 10px;margin-top:12px;display:inline-block}.play-btn{width:100%;background:var(--accent);color:var(--ink);border-radius:22px;padding:22px;font-size:30px;font-weight:900;flex-direction:column;box-shadow:0 10px 30px #f2b70540}.play-btn small{font-size:13px;font-weight:600;opacity:.7}.home-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.tile{background:#ffffff12;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:18px 10px;font-weight:700;display:flex;flex-direction:column;align-items:center;gap:6px}.tile span{font-size:28px}.home-foot{display:flex;flex-direction:column;gap:10px}.form{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field-label{font-size:13px;color:var(--muted);font-weight:600}.segmented{display:flex;background:#00000040;border-radius:12px;padding:4px;gap:4px}.segmented button{flex:1;border:0;background:none;padding:9px 4px;border-radius:9px;font-weight:700}.segmented button.on{background:var(--cream);color:var(--ink)}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0;position:relative}.toggle-row>span:first-child{display:flex;flex-direction:column}.toggle-row small{color:var(--muted);font-size:12px}.toggle-row input{position:absolute;opacity:0;pointer-events:none}.toggle{width:48px;height:28px;border-radius:14px;background:#fff3;position:relative;flex:none;transition:background .15s}.toggle:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:left .15s}.toggle-row input:checked+.toggle{background:var(--good)}.toggle-row input:checked+.toggle:after{left:23px}.toggle-row input:focus-visible+.toggle{outline:2px solid var(--accent)}.code-input{text-align:center;font-size:30px;letter-spacing:.3em;font-weight:800;padding:14px;border-radius:var(--radius);border:2px solid rgba(255,255,255,.2);background:#00000040;color:var(--cream);text-transform:uppercase}.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px}.chips button{border:1px solid rgba(255,255,255,.2);background:none;border-radius:999px;padding:7px 12px;white-space:nowrap;font-weight:600}.chips button.on{background:var(--cream);color:var(--ink)}.code-card{background:#00000040;border-radius:var(--radius);padding:16px;text-align:center}.room-code{font-size:40px;font-weight:900;letter-spacing:.18em}.seats{list-style:none;padding:0;margin:16px 0;display:flex;flex-direction:column;gap:8px}.seats li{display:flex;align-items:center;gap:10px;background:#ffffff0f;border-radius:12px;padding:8px 12px;min-height:54px}.seats li.empty{border:1px dashed rgba(255,255,255,.2);background:none}.seat-name{flex:1;font-weight:700}.lobby-settings{text-align:center}.avatar{position:relative;border-radius:50%;background:#ffffff1f;display:flex;align-items:center;justify-content:center;flex:none}.avatar .ring{position:absolute;top:-4px;left:-4px;color:var(--accent);pointer-events:none}.avatar.active{box-shadow:0 0 0 2px #f2b70559}.avatar.frame-armband{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--accent)}.avatar.frame-trophy{box-shadow:0 0 0 3px #d4a017,0 0 12px #d4a017}.card{--c: #8a9a92;position:relative;flex:none;display:flex;flex-direction:column;align-items:stretch;border-radius:11px;overflow:hidden;-webkit-user-select:none;user-select:none;color:var(--ink);background:linear-gradient(180deg,#fffdf6,#efe9d8);box-shadow:0 0 0 2px var(--c),0 6px 14px #00000059;transition:transform .16s cubic-bezier(.2,.8,.3,1.2),box-shadow .16s,opacity .16s,filter .16s;font-size:10px}.card[role=button]{cursor:pointer}.card:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.card-sm{width:54px;height:78px;font-size:7px;border-radius:8px}.card-md{width:80px;height:116px;font-size:10px}.card-lg{width:116px;height:168px;font-size:14px;border-radius:14px}.card .band{display:flex;align-items:center;gap:.35em;padding:.35em .5em;background:var(--c);color:#fff;font-weight:800;font-size:.85em;letter-spacing:.06em;text-transform:uppercase;text-shadow:0 1px 1px rgba(0,0,0,.35);min-height:1.9em}.card .band.neutral{background:#2d3a46}.card .band .sym{font-size:1.15em;line-height:1}.card .band-text{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.card .band-flag{font-size:1.2em;line-height:1;text-shadow:none}.card .art{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;padding:.2em}.card .art svg{width:72%;height:100%;max-height:100%}.card .art .shirt-art{width:76%}.card .big-flag{font-size:3.4em;line-height:1;filter:drop-shadow(0 2px 2px rgba(0,0,0,.3))}.card .name{font-weight:800;text-align:center;line-height:1.08;font-size:1.12em;padding:0 .35em;min-height:2.2em;display:flex;align-items:center;justify-content:center;text-wrap:balance}.card .type{text-align:center;font-size:.72em;text-transform:uppercase;letter-spacing:.1em;font-weight:800;opacity:.6;padding:.25em 0 .5em}.card.kind-league{background:linear-gradient(160deg,color-mix(in srgb,var(--c) 72%,#fff),var(--c));color:#fff}.card.kind-league .name,.card.kind-league .type{text-shadow:0 1px 2px rgba(0,0,0,.35)}.card.kind-champion{background:radial-gradient(circle at 50% 35%,#fff6cf,#e8c35a 75%)}.card.kind-trophy{--c: #c9a227;background:radial-gradient(circle at 50% 35%,#fffaf0,#efe2bb)}.card.kind-coach{--c: #5d6b78;background:linear-gradient(180deg,#f1f4f6,#d9e0e6)}.card.kind-national{--c: #e9e4d4;background:var(--flagbg)}.card.kind-national .name,.card.kind-national .type{background:#ffffffe6;margin:0 .5em;border-radius:5px}.card.kind-national .type{margin-bottom:.45em;padding:.15em 0}.card.kind-action{background:linear-gradient(160deg,color-mix(in srgb,var(--c) 60%,#000),var(--c));color:#fff}.card.kind-action .name,.card.kind-action .type{text-shadow:0 1px 2px rgba(0,0,0,.4)}.card.wild{--c: #111;background:conic-gradient(from 200deg,#e03131,#f2b705,#2f9e44,#1c7ed6,#7048e8,#e03131)}.card.wild .art svg{filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}.card.dim{filter:grayscale(.85) brightness(.55)}.card.selected{transform:translateY(-22px) scale(1.06)!important;box-shadow:0 0 0 3px var(--accent),0 14px 26px #00000080;z-index:5}.card-back{--c: #fff;justify-content:center;align-items:center;color:#fff;background:repeating-linear-gradient(45deg,#0f4d39 0,#0f4d39 8px,#12583f 8px,#12583f 16px)}.card-back .back-mark{width:62%}.card-back .back-count{position:absolute;bottom:5px;right:6px;font-size:1.1em;font-weight:900;background:#00000073;border-radius:6px;padding:0 5px}.card-back.back-stadium{background:radial-gradient(circle at 20% 15%,#fff 0 3px,transparent 4px),radial-gradient(circle at 80% 15%,#fff 0 3px,transparent 4px),linear-gradient(#0b1d3a,#12345e)}.card-back.back-retro{color:#111;background:repeating-linear-gradient(135deg,#ff4fa3 0,#ff4fa3 10px,#33d1ff 10px,#33d1ff 20px,#ffe14d 20px,#ffe14d 30px)}.card-back.back-gold{color:#3b2c00;background:linear-gradient(135deg,#8a6a12,#f7d774,#8a6a12)}@keyframes land{0%{transform:translateY(140px) scale(.55) rotate(-14deg);opacity:0}70%{transform:translateY(-6px) scale(1.04) rotate(2deg);opacity:1}}@keyframes dealt{0%{transform:translate(120px,-260px) scale(.5) rotate(20deg);opacity:0}}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@keyframes pulse-ring{0%{box-shadow:0 0 #f2b705b3}to{box-shadow:0 0 0 14px #f2b70500}}.table{max-width:480px;margin:0 auto;height:100%;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 8px) 8px calc(env(safe-area-inset-bottom) + 6px);position:relative;overflow:hidden}.table.table-grass{background:repeating-linear-gradient(180deg,#116041 0,#116041 44px,#0f5539 44px,#0f5539 88px)}.table.table-dressing{background:linear-gradient(#2b1d14,#3d2a1c 40%,#1f2a44)}.table.table-street{background:radial-gradient(circle at 50% 40%,#4b4f54,#26292c)}.table-swatch{width:52px;height:74px;border-radius:10px}.table-swatch.big{width:160px;height:110px}.table-swatch.table-grass{background:repeating-linear-gradient(180deg,#116041 0,#116041 12px,#0f5539 12px,#0f5539 24px)}.table-swatch.table-dressing{background:linear-gradient(#2b1d14,#3d2a1c 40%,#1f2a44)}.table-swatch.table-street{background:radial-gradient(circle at 50% 40%,#4b4f54,#26292c)}.table-top{display:flex;justify-content:space-between;align-items:center}.room-chip{background:#0000004d;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700}.opponents{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin:6px 0}.opp{position:relative;width:74px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 2px;border-radius:12px}.opp.turn{background:#f2b7052e;box-shadow:inset 0 0 0 1.5px #f2b70599}.badge.count{display:inline-flex;align-items:center;gap:3px;animation:pop .25s}.mini-back{width:8px;height:11px;border-radius:2px;background:repeating-linear-gradient(45deg,#0f4d39 0,#0f4d39 2px,#2d8a63 2px,#2d8a63 4px);box-shadow:0 0 0 1px #fff}.opp.away{opacity:.6}.opp-name{font-size:12px;font-weight:700;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opp-info{display:flex;flex-direction:column;align-items:center;gap:2px;max-width:100%}.opp-meta{display:flex;gap:3px;flex-wrap:wrap;justify-content:center}.bubble{position:absolute;top:-6px;left:50%;transform:translate(-50%,-100%);background:#fff;color:var(--ink);font-size:12px;font-weight:700;padding:4px 8px;border-radius:10px;white-space:nowrap;z-index:20;animation:pop .2s}.bubble.mine{position:fixed;top:auto;bottom:210px;transform:translate(-50%)}@keyframes pop{0%{transform:translate(-50%,-80%) scale(.6);opacity:0}}.centre{flex:1;display:flex;align-items:center;justify-content:center;gap:18px;margin:4px 0;min-height:0}.pile-area{border:3px solid;border-radius:22px;padding:8px 18px;background:radial-gradient(circle at 50% 40%,#ffffff14,#00000038);display:flex;flex-direction:column;align-items:center;gap:6px;transition:border-color .3s;box-shadow:0 0 24px -6px currentColor}.anchor-label{display:flex;flex-direction:column;align-items:center;line-height:1.1}.anchor-label span{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:800}.anchor-label b{font-size:15px}.card.landing{animation:land .5s cubic-bezier(.2,.8,.3,1) both}.pile{position:relative}.pile-top{position:absolute;right:-44px;bottom:-14px;transform:rotate(12deg)}.pile-foot{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700}.colour-dot{width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:12px}.direction{font-size:20px;margin-left:4px}.draw-pile{background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;font-weight:700}.draw-pile.can .card{box-shadow:0 0 0 3px var(--accent),0 4px 10px #0006}.draw-pile:disabled{opacity:1}.playlog{background:#00000047;border-radius:10px;padding:6px 10px;font-size:12px;min-height:58px;margin:4px 0}.log-lines{display:block;width:100%;background:none;border:0;padding:0;text-align:left}.latest{display:flex;align-items:center;gap:6px;background:#fff;color:var(--ink);border-radius:8px;padding:6px 8px;margin:-2px -4px 4px;border-left:5px solid var(--good);font-size:13px;animation:pop2 .2s}.latest.bad{border-left-color:var(--bad)}.latest .muted{color:#667}.latest-text{flex:1}.latest .link-btn{color:#7048e8;flex:none}.playlog .bad,.full-log .bad{color:#ffb3b3}.full-log>div{padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column}@keyframes pop2{0%{transform:scale(.9);opacity:0}}.status{text-align:center;padding:4px 6px 2px;display:flex;flex-direction:column;gap:3px}.status-text{font-weight:800;font-size:15px;display:flex;justify-content:center;align-items:baseline;gap:10px}.status.mine .status-text{font-size:18px;color:var(--accent)}.status-sub{font-size:12px;color:var(--muted)}.timer.low{color:var(--bad)}.timebar{height:5px;border-radius:3px;background:#0000004d;overflow:hidden;margin-top:2px}.timebar span{display:block;height:100%;border-radius:3px;transition:width .25s linear,background .3s}.timer{font-variant-numeric:tabular-nums;color:var(--accent)}.me-bar{display:flex;align-items:center;gap:8px;padding:2px 4px;min-height:46px}.me-name{font-weight:800}.me-actions{margin-left:auto;display:flex;gap:6px}.whistle-btn{background:var(--accent);color:var(--ink);animation:pulse 1s infinite;padding:10px 14px}@keyframes pulse{50%{transform:scale(1.06)}}.hand{display:flex;overflow-x:auto;overflow-y:visible;gap:0;padding:30px 12px 26px;flex:none;justify-content:safe center;scrollbar-width:none}.hand::-webkit-scrollbar{display:none}.hand-slot{flex:none;transform-origin:50% 120%;transition:transform .2s,margin .2s}.hand-slot.new .card{animation:dealt .45s cubic-bezier(.2,.8,.3,1) both}.hand-slot.drawn .card{box-shadow:0 0 0 3px #4c6ef5,0 4px 10px #00000059}.hand-hint{text-align:center;font-size:12px;color:var(--muted);min-height:16px}.emote-tray{position:absolute;top:50px;right:8px;background:#1d2b25;border-radius:12px;padding:6px;display:grid;grid-template-columns:1fr 1fr;gap:4px;z-index:40;box-shadow:0 10px 30px #0006}.emote-tray button{border:0;background:#ffffff14;padding:8px;border-radius:8px;font-size:13px;font-weight:600}.answer-sheet{position:absolute;left:0;right:0;bottom:0;top:18%;background:#fbfaf5;color:var(--ink);border-radius:20px 20px 0 0;padding:12px 12px calc(env(safe-area-inset-bottom) + 12px);z-index:50;display:flex;flex-direction:column;gap:8px;animation:slideup .18s ease-out;box-shadow:0 -10px 30px #0006}@keyframes slideup{0%{transform:translateY(40%);opacity:.5}}.answer-head{display:flex;gap:10px;align-items:center}.answer-head .icon-btn{background:#eee;color:var(--ink)}.answer-q{flex:1}.answer-q .muted{color:#6b7a72}.answer-q .q{font-weight:800;font-size:15px;line-height:1.25}.answer-input{display:flex;align-items:center;gap:8px;background:#fff;border:2px solid #d8d4c6;border-radius:12px;padding:0 12px}.answer-input input{flex:1;border:0;outline:0;padding:12px 0;font-size:17px;background:none;color:var(--ink)}.answer-input .timer{color:#c0392b;font-weight:800}.answer-msg{font-size:13px;color:#c0392b;font-weight:700}.answer-msg.good{color:#1e8e57}.suggestions{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}.suggestions button{width:100%;display:flex;align-items:center;gap:10px;padding:11px 6px;border:0;border-bottom:1px solid #eee;background:none;text-align:left;color:var(--ink)}.suggestions .pname{flex:1;font-weight:700}.suggestions .muted{color:#8a958f}.suggestions .pad{padding:12px 6px}.answer-actions{display:flex;flex-wrap:wrap;gap:6px}.answer-actions .btn.ghost{color:var(--ink);border-color:#ccc;background:#f0eee6;font-size:13px;padding:9px 12px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:flex-end;justify-content:center;z-index:60}.modal{width:100%;max-width:480px;max-height:85%;overflow-y:auto;background:#12382b;border-radius:20px 20px 0 0;padding:16px 16px calc(env(safe-area-inset-bottom) + 16px)}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.modal-head h2{font-size:18px}.colour-picker{display:grid;grid-template-columns:1fr 1fr;gap:10px}.colour-picker button{border:0;border-radius:14px;padding:18px 10px;color:#fff;font-weight:800;display:flex;flex-direction:column;align-items:center;gap:4px;text-shadow:0 1px 2px rgba(0,0,0,.4)}.colour-picker .sym{font-size:24px}.modal.ad{align-self:center;border-radius:20px;text-align:center;margin:16px}.ad-screen{background:#000;border-radius:12px;padding:40px 16px;margin-bottom:14px}.ad-label{font-size:12px;font-weight:800;color:var(--accent);text-transform:uppercase;letter-spacing:.1em}.tutorial-tip{background:#4c6ef5;color:#fff;border-radius:12px;padding:8px 12px;margin:6px 0 0;box-shadow:0 6px 20px #0000004d;font-size:13px}.tutorial-tip p{margin:2px 0;line-height:1.3}.tutorial-tip .link-btn{color:#fff;text-decoration:underline;padding:0}.tut-step{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;opacity:.85}.results h1{font-size:30px;margin:24px 0 16px}.placings,.board{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}.placings li,.board li{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#ffffff0f;border-radius:12px}.placings li.you,.board li.you{background:#f2b7052e}.place{width:26px;height:26px;border-radius:50%;background:var(--cream);color:var(--ink);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px;flex:none}.pn{flex:1;font-weight:700;display:flex;gap:6px;align-items:center}.pts{font-size:13px;color:var(--muted)}.board .gap{justify-content:center;background:none}.rewards{margin:18px 0;padding:14px;background:#00000040;border-radius:var(--radius);display:flex;flex-direction:column;gap:8px;align-items:center;font-size:18px}.levelup{color:var(--accent);font-weight:800}.starter{font-size:13px;background:#f2b70526;padding:8px;border-radius:10px;text-align:center}.celebrate{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:70;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:900;color:var(--accent)}.celebrate.win-confetti{background-image:radial-gradient(circle,#E03131 2px,transparent 3px),radial-gradient(circle,#F2B705 2px,transparent 3px),radial-gradient(circle,#1C7ED6 2px,transparent 3px),radial-gradient(circle,#2F9E44 2px,transparent 3px);background-size:60px 60px,80px 80px,70px 70px,90px 90px;animation:confetti 3s linear forwards}@keyframes confetti{0%{background-position:0 -100px,20px -200px,40px -150px,10px -300px;opacity:1}to{background-position:0 900px,20px 800px,40px 850px,10px 700px;opacity:0}}.celebrate.win-fireworks{background:radial-gradient(circle at 30% 30%,rgba(242,183,5,.6),transparent 20%),radial-gradient(circle at 70% 40%,rgba(224,49,49,.6),transparent 18%),radial-gradient(circle at 50% 70%,rgba(28,126,214,.6),transparent 22%);animation:fade 3s forwards}.celebrate.win-chant{animation:fade 3s forwards;text-shadow:0 2px 10px rgba(0,0,0,.6)}.celebration-swatch{font-size:36px;height:74px;display:flex;align-items:center}.profile-head{display:flex;gap:14px;align-items:center}.profile-head input{background:#00000040;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:var(--cream);padding:6px 8px;font-weight:800;width:170px}.avatar-pick{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.avatar-pick button{width:44px;height:44px;border-radius:50%;border:2px solid transparent;background:#ffffff14;font-size:22px}.avatar-pick button.on{border-color:var(--accent)}.stats-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:8px}.stats-grid div{background:#ffffff0f;border-radius:12px;padding:10px 6px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px}.stats-grid b{font-size:20px}.stats-grid b.sm{font-size:13px}.stats-grid span{font-size:11px;color:var(--muted)}.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.shop-item{background:#ffffff0f;border:2px solid transparent;border-radius:12px;padding:10px 4px;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px;font-weight:700}.shop-item.on{border-color:var(--accent)}.shop-item small{color:var(--muted)}.preview-big{display:flex;justify-content:center;padding:16px}.packs{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pack{display:flex;justify-content:space-between;align-items:center;background:#ffffff0f;padding:10px 12px;border-radius:12px}.list-buttons{display:flex;flex-direction:column;margin-top:10px}.list-buttons>*{text-align:left;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.1);padding:14px 4px;color:var(--cream);text-decoration:none}.danger-text{color:var(--bad)!important}@media (max-height: 700px) and (orientation: portrait){.card-lg{width:88px;height:126px;font-size:11px}.card-md{width:66px;height:94px}.opp{width:66px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.latest .verdict{width:24px;height:24px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-weight:900;color:#fff;background:var(--good)}.latest.bad .verdict{background:var(--bad)}.latest.bad{animation:pop2 .2s,shake .4s .2s}.turn-flash{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);z-index:45;pointer-events:none;font-size:34px;font-weight:900;color:var(--ink);background:var(--accent);padding:10px 26px;border-radius:999px;box-shadow:0 12px 30px #00000073;animation:turnflash 1.1s ease forwards;white-space:nowrap}@keyframes turnflash{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}30%{transform:translate(-50%,-50%) scale(1)}75%{opacity:1}to{opacity:0;transform:translate(-50%,-70%) scale(.96)}}.draw-pile.can .card{animation:pulse-ring 1.4s infinite}.answer-sheet{top:12%;padding-top:0;gap:10px}.sheet-timebar{height:5px;margin:0 -12px;background:#e6e1d2;border-radius:20px 20px 0 0;overflow:hidden}.sheet-timebar span{display:block;height:100%;transition:width .25s linear,background .3s}.answer-head{align-items:flex-start;padding-top:6px}.link-pair{display:flex;align-items:center;gap:4px;flex:none}.link-pair .plus{font-weight:900;font-size:18px;color:#6b7a72}.answer-q .q{font-size:16px}.answer-timer{font-size:12px;font-weight:800;color:#1e8e57;margin-top:4px}.answer-timer.low{color:#c0392b}.answer-input{border-width:2px;padding:0 10px}.answer-input:focus-within{border-color:#1e8e57;box-shadow:0 0 0 3px #1e8e5726}.answer-input.shake{animation:shake .4s;border-color:#c0392b}.search-icon{font-size:20px;color:#8a958f}.answer-input .clear{border:0;background:#e6e1d2;color:var(--ink);width:24px;height:24px;border-radius:50%;font-size:11px}.answer-actions{gap:6px}.chip-btn{border:1px solid #d8d4c6;background:#fff;color:var(--ink);border-radius:999px;padding:7px 12px;font-size:13px;font-weight:700}.chip-btn.safe{background:#e7f6ee;border-color:#9fd8b8;color:#13603a}.suggestions button:disabled{opacity:.45}.used-tag{font-size:11px;font-weight:800;color:#c0392b;background:#fbe4e1;border-radius:6px;padding:2px 6px}.suggestions .pad{line-height:1.4;font-size:13px}.brand{margin:22px 0 18px}.hero{position:relative;height:150px;display:flex;justify-content:center;align-items:center;margin:12px auto 4px}.hero .card{position:absolute;box-shadow:0 10px 24px #0006}.hero .hero-a{transform:translate(-62px) rotate(-10deg);animation:hero-a .7s ease-out both}.hero .hero-b{transform:translate(62px) rotate(10deg);animation:hero-b .7s ease-out .1s both}.hero-link{position:relative;z-index:2;background:var(--accent);color:#1a1a1a;font-weight:800;font-size:13px;padding:6px 12px;border-radius:999px;box-shadow:0 4px 14px #00000059;animation:pop .5s ease-out .5s both;white-space:nowrap}@keyframes hero-a{0%{opacity:0;transform:translate(-20px) rotate(0) translateY(20px)}}@keyframes hero-b{0%{opacity:0;transform:translate(20px) rotate(0) translateY(20px)}}.home-grid .tile{transition:transform .12s ease,background .12s ease}.home-grid .tile:active{transform:scale(.96)}.level-desc{font-size:13px;color:var(--muted);background:#0003;border-radius:10px;padding:8px 12px;margin:4px 0 10px}.result-head{text-align:center;margin:18px 0 14px}.result-head h1{margin:6px 0 4px}.result-head p{margin:0}.result-badge{font-size:56px;line-height:1;animation:pop .6s ease-out both}.placings li{animation:slide-in .35s ease-out both}.placings li.p1{background:linear-gradient(90deg,#f2b70547,#f2b70514)}.placings .place{width:26px;text-align:center;font-weight:800}@keyframes slide-in{0%{opacity:0;transform:translate(-16px)}}.reward-row{display:flex;gap:12px;width:100%}.reward{flex:1;background:#ffffff0f;border-radius:12px;padding:10px;display:flex;flex-direction:column;align-items:center}.reward b{font-size:26px;color:var(--accent)}.reward span{font-size:13px;color:var(--muted)}.hand{gap:8px;padding:30px 14px 8px;scroll-snap-type:x proximity;scroll-padding:0 14px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 14px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 14px),transparent 100%)}.hand-slot{scroll-snap-align:center}.me-count{font-size:12px;color:var(--muted);font-weight:600}.status.flash .status-text{animation:pop .5s ease-out}.status.flash{background:#f2b7051f;border-radius:12px;transition:background .4s}.opponents{gap:8px}.opp{width:auto;min-width:72px;max-width:98px;flex:0 1 98px}.opp-name{white-space:normal;text-align:center;font-size:11.5px;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}.anchor-label span{font-size:11px}.pile-area{padding:10px 16px 8px}.card-back .back-count{bottom:4px;right:4px;font-size:.95em}.chips.grid{display:grid;grid-template-columns:1fr 1fr;overflow:visible}.chips.grid button{text-align:center}.form{gap:18px}.field{gap:8px}.profile-head>div:last-child{flex:1;min-width:0}.profile-head input{width:100%;max-width:220px}.hero{height:178px;align-items:flex-start}.hero .card{top:4px}.hero-link{position:absolute;bottom:0;left:50%;transform:translate(-50%);animation:hero-pill .5s ease-out .5s both}@keyframes hero-pill{0%{opacity:0;transform:translate(-50%) scale(.6)}}.hero:before{content:"";position:absolute;left:50%;top:60px;width:2px;height:90px;background:linear-gradient(transparent,var(--accent));transform:translate(-50%);opacity:.7}@media (max-height: 800px) and (orientation: portrait){.card-lg{width:96px;height:138px;font-size:11.5px}.pile-area{padding:6px 12px;gap:4px}.opponents{margin:2px 0}.playlog{min-height:48px}.status-sub{display:none}}@media (max-height: 700px) and (orientation: portrait){.card-lg{width:84px;height:120px;font-size:10.5px}.pile-top .card-md,.draw-pile .card-md{width:60px;height:86px}}.field-hint{font-size:12px;color:var(--muted)}.league-picker{display:grid;grid-template-columns:1fr 1fr;gap:8px}.league-picker button{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:12px;border:2px solid rgba(255,255,255,.15);background:#0003;color:var(--muted);font-weight:700;text-align:left;transition:background .15s,border-color .15s}.league-picker button.on{border-color:var(--c);background:color-mix(in srgb,var(--c) 30%,transparent);color:var(--cream)}.league-picker button:disabled{opacity:1;cursor:not-allowed}.league-picker .lp-flag{font-size:20px;line-height:1;filter:grayscale(1);opacity:.6}.league-picker button.on .lp-flag{filter:none;opacity:1}.league-picker .lp-name{flex:1;min-width:0}.league-picker .lp-tick{width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-size:12px;flex:none}.league-picker button.on .lp-tick{background:var(--c);border-color:var(--c);color:#fff}.embedded .table{padding-top:8px;padding-bottom:6px}.embedded .screen{padding-top:12px;padding-bottom:20px}.embedded .answer-sheet,.embedded .modal{padding-bottom:12px}.embedded .toast{bottom:24px}.embedded .offline{padding-top:4px}.centre{container-type:size}@container (min-height: 1px){.pile-area .card-lg{--h: clamp(78px, calc(100cqh - 84px) , 168px);height:var(--h);width:calc(var(--h) * 116 / 168);font-size:calc(var(--h) / 12)}.pile-top .card-md,.draw-pile .card-md{--h: clamp(60px, calc((100cqh - 84px)*.69) , 116px);height:var(--h);width:calc(var(--h) * 80 / 116);font-size:calc(var(--h) / 11.6)}.pile-area{max-height:100cqh}}.rotate-prompt{position:fixed;top:0;right:0;bottom:0;left:0;z-index:95;background:radial-gradient(120% 70% at 50% 30%,#135c45,#072a20);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center}.rotate-prompt h2{font-size:22px}.rotate-prompt p{color:var(--muted);max-width:300px;margin:0 0 8px;line-height:1.4}.rotate-phone{width:64px;height:110px;border:4px solid var(--cream);border-radius:14px;position:relative;animation:rotate-phone 2.4s ease-in-out infinite;margin-bottom:16px}.rotate-phone span{position:absolute;left:50%;bottom:6px;width:18px;height:4px;border-radius:2px;background:var(--cream);transform:translate(-50%)}.rotate-phone:before{content:"";position:absolute;top:8px;right:6px;bottom:16px;left:6px;border-radius:4px;background:repeating-linear-gradient(180deg,#116041 0,#116041 10px,#0f5539 10px,#0f5539 20px)}@keyframes rotate-phone{0%,20%{transform:rotate(0)}50%,80%{transform:rotate(-90deg)}to{transform:rotate(0)}}@media (orientation: landscape) and (max-height: 560px){.table{max-width:none;display:grid;column-gap:14px;grid-template-columns:minmax(180px,1fr) min(34vw,300px) minmax(180px,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;padding:6px max(12px,env(safe-area-inset-right)) 2px max(12px,env(safe-area-inset-left))}.embedded .table{padding:6px 12px 2px}.table-top{grid-area:1 / 1;align-self:start}.room-chip{font-size:13px;padding:5px 10px}.table-top .icon-btn{width:34px;height:34px;font-size:15px}.opponents{grid-area:2 / 1;display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:4px;margin:6px 0 4px;overflow:hidden}.opp{flex-direction:row;align-items:center;max-width:none;min-width:0;width:auto;flex:none;gap:6px;padding:3px 4px;text-align:left}.opp>div:not(.avatar):not(.bubble){min-width:0}.opp-name{text-align:left;-webkit-line-clamp:2;font-size:12px;line-height:1.1;overflow-wrap:normal;word-break:normal}.opp-info{align-items:flex-start;min-width:0}.opp-meta{justify-content:flex-start;flex-wrap:nowrap}.opp .badge{font-size:9px;padding:1px 4px}.me-bar{grid-area:3 / 1;min-height:0;padding:0;flex-wrap:wrap;gap:6px}.me-name{font-size:14px;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.me-actions .btn{padding:6px 12px;font-size:13px}.centre{grid-area:1 / 2 / 4 / 3;margin:0;gap:12px}.tutorial-tip{grid-area:1 / 3;margin:0 0 4px;font-size:12px}.playlog{grid-area:1 / 3 / 3 / 4;margin:0 0 4px;min-height:0;overflow-y:auto}.table:has(.tutorial-tip) .playlog{grid-row:2}.status{grid-area:3 / 3;padding:2px 0 0}.anchor-label span{white-space:nowrap;font-size:9.5px;letter-spacing:.1em}.pile-area{padding:6px 10px}.latest{font-size:12px;padding:5px 7px;gap:5px;flex-wrap:wrap}.latest .verdict{width:20px;height:20px;font-size:12px}.latest-text{flex:1 1 120px;line-height:1.25}.latest .link-btn{font-size:12px;margin-left:auto}.playlog{font-size:11.5px;padding:6px 8px}.status-sub{display:none}.status-text,.status.mine .status-text{font-size:15px}.hand{grid-area:4 / 1 / 5 / 4;padding:16px 8px 4px;gap:6px}.hand .card-md{width:70px;height:101px;font-size:8.8px}.hand .card.selected{transform:translateY(-12px) scale(1.04)!important}.hand-hint{display:none}.answer-sheet,html.keyboard .answer-sheet,html.typing .answer-sheet{top:var(--vv-top, 0px);height:var(--vv-h, 100%);max-width:none;border-radius:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto auto auto auto minmax(0,1fr);align-content:start;column-gap:16px;row-gap:8px;animation:fadein .15s ease-out;padding:0 max(12px,env(safe-area-inset-right)) 6px max(12px,env(safe-area-inset-left))}.answer-sheet>*{grid-column:1}.answer-sheet>.sheet-timebar{grid-column:1 / -1;grid-row:1;margin:0 -16px;border-radius:0}.answer-sheet>.suggestions{grid-column:2;grid-row:2 / -1;min-height:0;overflow-y:auto}.suggestions button{padding:8px 6px}.answer-sheet .q{font-size:15px}.screen{max-width:760px;padding:10px max(16px,env(safe-area-inset-right)) 14px max(16px,env(safe-area-inset-left))}.home{display:grid;grid-template-columns:1fr 1fr;column-gap:24px;align-content:start}.home>.home-top,.home>.level-bar,.home>.toast{grid-column:1 / -1}.home>.brand{grid-column:1;grid-row:3 / span 4;margin:6px 0 0}.home>.play-btn,.home>.home-grid,.home>.home-foot{grid-column:2}.home>.play-btn{margin-top:10px;padding:14px;font-size:26px}.home-grid{margin:10px 0;gap:8px}.home-grid .tile{padding:10px}.hero{height:150px}.results .placings,.results .rewards{max-width:520px;margin-left:auto;margin-right:auto}}html.in-game,html.in-game body{overflow:hidden;overscroll-behavior:none}html.in-game body{position:fixed;top:0;right:0;bottom:0;left:0}.answer-sheet{position:fixed;left:0;right:0;max-width:480px;margin:0 auto;top:calc(var(--vv-top, 0px) + var(--vv-h, 100vh) * .16);bottom:auto;height:calc(var(--vv-h, 100vh) * .84)}html.keyboard .answer-sheet,html.typing .answer-sheet{top:var(--vv-top, 0px);height:var(--vv-h, 100%);border-radius:0;animation:none;padding-bottom:8px}html.typing .answer-sheet .link-pair{display:none}html.typing .answer-head{padding-top:4px;align-items:center}html.typing .answer-q .q{font-size:14px;line-height:1.25}html.typing .answer-actions .chip-btn{padding:5px 10px;font-size:12px}@keyframes fadein{0%{opacity:0}}@media (orientation: landscape) and (max-height: 560px){.answer-sheet{top:var(--vv-top, 0px);height:var(--vv-h, 100%);max-width:none;border-radius:0;animation:fadein .15s ease-out}}.placings-note{text-align:center;font-size:12px;color:var(--muted);margin:0 0 8px}.placings .pts{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;margin-left:auto}.placings .pts b{color:#ff9b9b;font-size:16px}.placings .pts small{color:var(--muted);font-size:11px}.placings .pts.won{color:var(--accent);font-weight:800}.brand .demo-note a{color:var(--accent);font-weight:700}.howto-btn{width:100%;display:flex;align-items:center;gap:12px;text-align:left;margin-bottom:12px;padding:12px 16px;border-radius:18px;background:#ffffff12;border:1.5px solid rgba(255,255,255,.18);color:var(--cream);font-size:22px}.howto-btn .howto-icon{font-size:28px;line-height:1}.howto-btn .howto-text{flex:1;display:flex;flex-direction:column;gap:2px}.howto-btn b{font-size:17px}.howto-btn small{font-size:13px;color:var(--muted);font-weight:500}.howto-btn.new{background:#4c6ef5;border-color:#7b93ff;box-shadow:0 8px 26px #4c6ef566;animation:howto-glow 2.2s ease-in-out infinite}.howto-btn.new small{color:#ffffffd9}@keyframes howto-glow{50%{box-shadow:0 8px 34px #4c6ef5bf}}@media (orientation: landscape) and (max-height: 560px){.home>.howto-btn{grid-column:2;margin:10px 0 0;padding:8px 14px}.home>.play-btn{margin-top:8px}}