:root{--ink:#fff8ee;--muted:#e5cfb4;--panel:#24160ed1;--panel-edge:#ffd6a040;--accent:#ff6a2b;--accent-2:#ffb347;--card:#f7f4ef;--card-ink:#161616;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--gutter:max(16px, var(--safe-right));color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:#2b1a12;height:100%;margin:0;overflow:hidden}#app{position:fixed;inset:0}#game{cursor:none;width:100%;height:100%;display:block;position:absolute;inset:0}#ui,.hud{pointer-events:none;position:absolute;inset:0}.hud[hidden]{display:none}.scoreboard{top:calc(10px + var(--safe-top));align-items:center;gap:clamp(6px,1.2vw,12px);display:flex;position:absolute;left:50%;transform:translate(-50%)}.hud.no-score .cards{display:none}.score-side{flex-direction:column;align-items:center;gap:4px;display:flex}.flag{aspect-ratio:3/2;object-fit:cover;border-radius:3px;width:clamp(44px,7vw,84px);box-shadow:0 2px 6px #00000073,inset 0 0 0 1px #0003}.player-name{text-shadow:0 1px 3px #000000e6;white-space:nowrap;text-overflow:ellipsis;max-width:22vw;font-size:clamp(10px,1.4vw,13px);font-weight:600;overflow:hidden}.cards{gap:clamp(4px,.8vw,8px);display:flex}.games{top:calc(clamp(70px, 10vw, 110px) + var(--safe-top));text-shadow:0 1px 3px #000;font-size:13px;font-weight:700;position:absolute;left:50%;transform:translate(-50%)}.flip{--w:clamp(42px, 6.2vw, 72px);--h:calc(var(--w) * 1.2);width:var(--w);height:var(--h);perspective:300px;font-weight:800;font-size:calc(var(--h) * .72);font-variant-numeric:tabular-nums;color:var(--card-ink);border-radius:6px;position:relative;box-shadow:0 4px 10px #00000073}.flip-half{background:linear-gradient(#fff, var(--card));backface-visibility:hidden;width:100%;height:50%;position:absolute;left:0;overflow:hidden}.flip-half span{justify-content:center;align-items:center;width:100%;height:200%;line-height:1;display:flex;position:absolute;left:0}.flip-top{transform-origin:bottom;border-bottom:1px solid #00000040;border-radius:6px 6px 0 0;top:0}.flip-top span{top:0}.flip-bottom{transform-origin:top;background:linear-gradient(#ececec,#dcdcdc);border-radius:0 0 6px 6px;bottom:0}.flip-bottom span{bottom:0}.flip-anim-top,.flip-anim-bottom{visibility:hidden}.flip.flipping .flip-anim-top{visibility:visible;animation:.22s ease-in forwards flip-top}.flip.flipping .flip-anim-bottom{visibility:visible;animation:.22s ease-out .2s forwards flip-bottom;transform:rotateX(90deg)}@keyframes flip-top{to{transform:rotateX(-90deg)}}@keyframes flip-bottom{to{transform:rotateX(0)}}.flip-ring{z-index:3;background:linear-gradient(90deg,#888,#ddd,#888);border-radius:3px;width:6px;height:12px;position:absolute;top:-5px}.flip-ring-l{left:22%}.flip-ring-r{right:22%}.hud-controls{top:calc(12px + var(--safe-top));right:var(--gutter);pointer-events:auto;gap:10px;display:flex;position:absolute}.round-btn{cursor:pointer;background:radial-gradient(circle at 35% 30%,#e88b8b,#9b2c2c 70%);border:3px solid #ffffffd9;border-radius:50%;justify-content:center;align-items:center;gap:18%;width:clamp(40px,6vw,58px);height:clamp(40px,6vw,58px);padding:0;display:flex;box-shadow:0 4px 12px #00000080}.pause-bar{background:#fff;border-radius:2px;width:16%;height:46%}.mute-btn{background:radial-gradient(circle at 35% 30%,#8bb5e8,#2c5b9b 70%)}.mute-btn:before{content:"";clip-path:polygon(0 32%,32% 32%,70% 0,70% 100%,32% 68%,0 68%);background:#fff;width:42%;height:42%}.mute-btn.muted:after{content:"";background:#fff;border-radius:2px;width:56%;height:4px;position:absolute;transform:rotate(-45deg)}.mute-btn{position:relative}.banner{letter-spacing:.02em;text-shadow:0 3px #00000059,0 0 18px #0009;white-space:nowrap;text-align:center;font-size:clamp(26px,5.2vw,56px);font-weight:900;position:absolute;top:38%;left:50%;transform:translate(-50%,-50%)}.banner-sub{color:var(--muted);text-shadow:0 1px 4px #000;white-space:nowrap;font-size:clamp(13px,1.9vw,18px);font-weight:600;position:absolute;top:calc(38% + clamp(28px,4.5vw,48px));left:50%;transform:translate(-50%)}.toast{letter-spacing:.02em;opacity:0;text-shadow:0 2px 6px #000000b3;white-space:nowrap;font-size:clamp(18px,3vw,30px);font-style:italic;font-weight:900;transition:opacity .15s,transform .15s;position:absolute;top:24%;left:50%;transform:translate(-50%,10px)scale(.9)}.toast.show{opacity:1;transform:translate(-50%)scale(1)}.toast.top{color:#ff8a5c}.toast.back{color:#7fd3ff}.toast.side{color:#e08cff}.ping{top:calc(clamp(56px, 8vw, 80px) + var(--safe-top));right:var(--gutter);font-variant-numeric:tabular-nums;background:#00000073;border-radius:999px;padding:3px 8px;font-size:13px;font-weight:700;position:absolute}.ping.good{color:#7ee08a}.ping.ok{color:#ffd166}.ping.bad{color:#ff7a6b}.net-status{bottom:calc(18px + env(safe-area-inset-bottom,0px));white-space:nowrap;background:#0009;border-radius:999px;padding:8px 16px;font-weight:700;position:absolute;left:50%;transform:translate(-50%)}.ping[hidden],.net-status[hidden]{display:none}.menus{pointer-events:auto;background:radial-gradient(#00000026,#0000008c);justify-content:center;align-items:center;padding:16px;display:flex;position:absolute;inset:0;overflow-y:auto}.menus[hidden]{display:none}.screen{max-width:100%;animation:.25s ease-out rise}@keyframes rise{0%{opacity:0;transform:translateY(12px)}}.panel{background:var(--panel);border:1px solid var(--panel-edge);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:18px;width:min(460px,100%);max-height:calc(100vh - 32px);padding:clamp(18px,3vw,30px);overflow-y:auto;box-shadow:0 20px 60px #00000080}.panel.wide{width:min(900px,100%)}.panel h2{align-items:center;gap:10px;margin:0 0 8px;font-size:26px;display:flex}.muted{color:var(--muted);margin:4px 0 16px}.main-menu{text-align:center;flex-direction:column;align-items:center;gap:8px;display:flex}.logo{letter-spacing:-.02em;text-shadow:0 4px #7a2c0c,0 10px 30px #0009;margin:0;font-size:clamp(36px,8vw,92px);font-style:italic;font-weight:900}.logo-accent{color:var(--accent-2)}.tagline{color:var(--muted);text-shadow:0 1px 3px #000;margin:0 0 18px;font-weight:600}.menu-buttons{flex-direction:column;gap:12px;width:min(320px,82vw);margin:0 auto;display:flex}.btn{font:inherit;color:var(--ink);cursor:pointer;background:linear-gradient(#5a3a26,#3e2617);border:1px solid #ffffff2e;border-radius:14px;padding:14px 20px;font-size:18px;font-weight:700;transition:transform 80ms;box-shadow:0 4px #22140b}.btn:active{transform:translateY(2px);box-shadow:0 2px #22140b}.btn-primary{background:linear-gradient(#ff8a4c,#e5531a);box-shadow:0 4px #8f2d07}.btn-ghost{box-shadow:none;background:0 0}.btn-small{padding:8px 14px;font-size:14px}.btn-disabled{opacity:.55;cursor:default;flex-direction:column;align-items:center;display:flex}.btn-disabled small{color:var(--muted);font-size:12px;font-weight:500}.row{flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:20px;display:flex}.menu-footer{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin-top:18px;display:flex}.country-chip{font:inherit;color:var(--ink);cursor:pointer;background:#00000059;border:1px solid #fff3;border-radius:999px;align-items:center;gap:8px;padding:6px 14px 6px 8px;font-weight:600;display:flex}.flag-sm{aspect-ratio:3/2;vertical-align:middle;border-radius:2px;width:30px;box-shadow:0 0 0 1px #0000004d}.flag-md{aspect-ratio:3/2;border-radius:3px;width:48px;box-shadow:0 0 0 1px #0000004d}.segmented{background:#0000004d;border-radius:12px;grid-template-columns:repeat(4,1fr);gap:6px;padding:5px;display:grid}.seg{font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:8px;padding:10px 4px;font-weight:700}.seg.active{background:var(--accent);color:#fff}.toggle{cursor:pointer;align-items:center;gap:10px;margin-top:16px;font-weight:600;display:flex}.toggle input{width:22px;height:22px;accent-color:var(--accent)}.set-group{text-align:left;margin-top:16px}.set-group h3{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 6px;font-size:12px;font-weight:700}.set-row{justify-content:space-between;align-items:center;gap:14px;min-height:44px;font-weight:600;display:flex}.set-row.disabled{opacity:.45}.set-slider{flex:1;align-items:center;gap:10px;max-width:260px;display:flex}.set-slider input[type=range]{min-width:0;accent-color:var(--accent);cursor:pointer;flex:1}.set-slider input[type=range]:disabled{cursor:default}.set-value{text-align:right;font-variant-numeric:tabular-nums;min-width:4.2em;color:var(--accent-2)}.switch{cursor:pointer;background:#00000073;border:1px solid #fff3;border-radius:999px;flex:none;width:52px;height:30px;padding:0;transition:background .15s;position:relative}.switch.on{background:var(--accent);border-color:var(--accent)}.switch-knob{background:#fff;border-radius:50%;width:22px;height:22px;transition:transform .15s;position:absolute;top:3px;left:3px}.switch.on .switch-knob{transform:translate(22px)}.set-note{color:var(--muted);margin:2px 0 0;font-size:12px;font-weight:500}.set-version{color:var(--muted);text-align:center;margin:18px 0 0;font-size:12px}.set-version+.set-version{margin-top:4px}.set-version a{color:var(--accent-2)}.country-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;max-height:55vh;padding:4px;display:grid;overflow-y:auto}.country{font:inherit;text-align:left;color:var(--ink);cursor:pointer;background:#0000004d;border:1px solid #0000;border-radius:10px;align-items:center;gap:8px;padding:6px;font-size:13px;font-weight:600;display:flex}.country.active{border-color:var(--accent-2)}.world-map{border-radius:12px;width:100%;height:auto;display:block;box-shadow:inset 0 0 0 1px #ffffff1a}.stop-head h3{margin:14px 0 0}.rounds{flex-direction:column;gap:6px;margin:8px 0 0;padding:0;list-style:none;display:flex}.round{background:#00000047;border-radius:10px;grid-template-columns:110px 34px 1fr auto 24px;align-items:center;gap:8px;padding:8px 10px;display:grid}.round.next{outline:2px solid var(--accent)}.round.locked{opacity:.55}.round.won .round-state{color:#6be37a}.round-name{color:var(--accent-2);font-weight:700}.opp-name{font-weight:700}.opp-meta{color:var(--muted);font-size:13px}.overlay{text-align:center}.result h2{justify-content:center;font-size:34px}.result.won h2{color:#ffd23f}.final-score{margin:6px 0;font-size:44px;font-weight:900}@media (max-width:600px){.round{grid-template-columns:1fr 34px auto}.round .opp-meta,.round .round-state{display:none}.round-name{grid-column:1/-1}}@media (max-width:640px){.scoreboard{left:var(--gutter);transform:none}.hud-controls{flex-direction:column}.player-name{max-width:28vw}.games{left:var(--gutter);transform:none}}@media (pointer:coarse){#game{cursor:default}}.stats-panel{top:calc(10px + var(--safe-top));left:var(--gutter);z-index:20;color:#e9f5e8;pointer-events:none;width:270px;max-width:calc(100vw - 32px);font:11px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;position:absolute}.stats-toggle{pointer-events:auto;color:#b6ffb0;cursor:pointer;background:#000000b3;border:1px solid #b6ffb059;border-radius:6px 6px 0 0;padding:5px 9px;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.stats-panel[hidden]{display:none}.stats-panel.collapsed .stats-toggle{border-radius:6px}.stats-body{background:#000000b8;border:1px solid #b6ffb040;border-radius:0 8px 8px;max-height:calc(100vh - 80px);padding:6px 10px 8px;overflow:hidden}.stats-panel.collapsed .stats-body{display:none}.stats-section{color:#b6ffb0;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid #b6ffb033;margin-top:6px;font-size:10px;font-weight:700}.stats-section:first-child{margin-top:0}.stats-row{justify-content:space-between;gap:10px;display:flex}.stats-key{color:#9fb3a0;white-space:nowrap}.stats-val{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.stats-val.good{color:#7ee08a}.stats-val.ok{color:#ffd166}.stats-val.bad{color:#ff7a6b}@media (max-width:640px){.stats-panel{top:auto;bottom:calc(10px + env(safe-area-inset-bottom,0px));width:240px;font-size:10px}}.field{flex-direction:column;gap:6px;margin:8px 0 16px;font-weight:600;display:flex}.text-input{font:inherit;color:var(--ink);background:#00000059;border:1px solid #fff3;border-radius:10px;min-width:0;padding:10px 12px;font-weight:700}.text-input.small{width:80px;padding:6px 8px}.code-input{letter-spacing:.3em;text-transform:uppercase;text-align:center;flex:1;font-size:20px}.join-row{margin-top:14px;gap:10px;width:min(320px,82vw);margin-inline:auto;display:flex}.room-code{letter-spacing:.25em;text-align:center;color:var(--accent-2);-webkit-user-select:all;user-select:all;margin:8px 0 12px;font-size:clamp(36px,8vw,56px);font-weight:900}.row.center{justify-content:center}.pulse{animation:1.4s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.45}}.error-text{color:#ff8a7a;font-weight:700}.dev-panel{color:var(--muted);margin-top:16px;font-size:13px}.dev-fields{flex-wrap:wrap;gap:10px;margin-top:8px;display:flex}.dev-field{flex-direction:column;gap:4px;display:flex}.account-bar{border:1px solid var(--panel-edge);background:#0000004d;border-radius:12px;flex-wrap:wrap;align-items:center;gap:10px;margin:4px 0 14px;padding:10px 12px;display:flex}.account-name{font-weight:700}.account-rating{color:var(--accent-2);font-weight:700}.account-bar .btn{margin-left:auto}.account-bar .btn+.btn{margin-left:8px}.account-chip{min-width:0;max-width:300px}.account-chip .rank-badge{flex-shrink:0;overflow:visible}.account-chip span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.auth-body{flex-direction:column;gap:12px;margin:8px 0 4px;display:flex}.google-signin{flex-direction:column;align-items:center;gap:8px;margin:8px 0 0;display:flex}.google-button{min-height:44px}.auth-or{margin:0}.rating-line{color:var(--accent-2);margin:2px 0 6px;font-weight:700}.leaderboard{max-height:46vh;margin:6px 0 14px;overflow-y:auto}.rank-list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.rank-row{background:#00000040;border-radius:8px;grid-template-columns:2ch 30px 1fr auto auto auto auto;align-items:center;gap:10px;padding:7px 10px;display:grid}.rank-row.me{outline:1px solid var(--accent);background:#ff6a2b38}.rank-pos{color:var(--muted);text-align:right;font-weight:700}.rank-name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.rank-wl{color:var(--muted);font-variant-numeric:tabular-nums}.rank-rating{color:var(--accent-2);font-variant-numeric:tabular-nums;font-weight:700}.rank-level{color:var(--accent-2);white-space:nowrap;font-size:12px;font-weight:700}.player-level{color:var(--accent-2);text-shadow:0 1px 3px #000000e6;white-space:nowrap;font-size:clamp(9px,1.2vw,11px);font-weight:800}.player-level[hidden]{display:none}.chip-lines{flex-direction:column;gap:3px;min-width:0;display:flex}.xp-meter{align-items:center;gap:6px;font-size:11px;display:flex}.account-chip .xp-meter span{overflow:visible}.level-badge{color:#1c120b;background:var(--accent-2);white-space:nowrap;border-radius:999px;padding:0 6px;font-weight:800}.xp-bar{background:#ffffff2e;border-radius:999px;flex:56px;min-width:40px;max-width:120px;height:6px;overflow:hidden}.xp-fill{border-radius:inherit;background:linear-gradient(90deg, var(--accent), var(--accent-2));height:100%}.xp-label{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}.xp-resets{color:var(--accent-2);white-space:nowrap;font-weight:800}.level-panel{border:1px solid var(--panel-edge);background:#0000004d;border-radius:12px;flex-direction:column;gap:10px;margin:-4px 0 14px;padding:10px 12px;display:flex}.level-panel .xp-meter{font-size:13px}.level-panel .xp-bar{max-width:none;height:8px}.reset-confirm p{color:var(--muted);margin:0 0 4px;font-size:13px}.reset-confirm .row{margin-top:8px}.xp-line{color:var(--accent-2);margin:2px 0 6px;font-weight:800}.xp-line.none{color:var(--muted);font-weight:600}.xp-line[hidden]{display:none}.level-toast{top:calc(18% + var(--safe-top));z-index:10;color:#1c120b;background:linear-gradient(135deg, var(--accent-2), var(--accent));white-space:nowrap;pointer-events:none;opacity:0;border-radius:999px;padding:8px 18px;font-size:clamp(16px,2.6vw,24px);font-style:italic;font-weight:900;transition:opacity .2s,transform .2s;position:absolute;left:50%;transform:translate(-50%,10px)scale(.9);box-shadow:0 6px 20px #00000073}.level-toast.show{opacity:1;transform:translate(-50%)scale(1)}@media (max-width:640px){.rank-row{grid-template-columns:2ch 30px 1fr auto auto;gap:8px}.rank-wl,.rank-row .rank-badge{display:none}}.rank-badge{letter-spacing:.04em;text-transform:uppercase;vertical-align:middle;color:#1c120b;background:#c9a27a;border-radius:999px;padding:1px 8px;font-size:11px;font-weight:800;display:inline-block}.rank-bronze{background:#c98a52}.rank-silver{background:#cfd6dc}.rank-gold{background:#ffcf4a}.rank-platinum{background:#7fe0d0}.rank-diamond{background:#8fb8ff}.rank-master{color:#fff;background:linear-gradient(135deg,#b24bf3,#ff6a2b)}.placement-note{color:var(--accent-2);font-size:12px;font-weight:700}.search-stats{grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0;display:grid}.search-stat{background:#0000004d;border-radius:10px;flex-direction:column;gap:2px;padding:8px 10px;display:flex}.search-label{color:var(--muted);font-size:11px}.search-value{font-variant-numeric:tabular-nums;font-size:18px}.search-note{color:var(--accent-2);margin:8px 0;font-size:13px}.search-offer{border:1px solid var(--accent-2);background:#ffb34714;border-radius:12px;margin-top:10px;padding:12px}.search-offer p{margin:0 0 10px}@media (max-width:420px){.search-stats{grid-template-columns:1fr}}.search-sub{color:var(--muted);font-size:11px}.menus:has(.looks-menu){background:linear-gradient(90deg,#0000 40%,#00000073);justify-content:flex-end}.looks-menu{--tier:#b9a58f;width:min(420px,100%);max-height:calc(100vh - 32px);flex-direction:column;gap:10px;max-height:calc(100dvh - 32px);display:flex;overflow:hidden}.looks-head{align-items:center;gap:10px;display:flex}.looks-head h2{margin:0 auto 0 0}.looks-resets{color:var(--accent-2);font-size:13px;font-weight:800}.looks-tabs{background:#0000004d;border-radius:12px;grid-template-columns:repeat(4,1fr);gap:4px;padding:4px;display:grid}.looks-tab{font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:9px;padding:8px 4px;font-size:14px;font-weight:700}.looks-tab.active{color:#1c120b;background:var(--accent-2)}.looks-grid{grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px;min-height:0;padding:2px;display:grid;overflow-y:auto}.tier-common{--tier:#b9a58f}.tier-rare{--tier:#4aa8ff}.tier-epic{--tier:#b65cff}.tier-legendary{--tier:#ffb020}.tier-mythic{--tier:#ff3d6e}.look-card{font:inherit;color:var(--ink);text-align:left;border:2px solid var(--tier);background:linear-gradient(160deg, color-mix(in srgb, var(--tier) 26%, transparent), #00000059);cursor:pointer;border-radius:12px;flex-direction:column;align-items:flex-start;gap:2px;min-height:74px;padding:8px 10px;transition:transform 80ms;display:flex}.look-card.tier-mythic{box-shadow:0 0 12px #ff3d6e8c}.look-card:active{transform:scale(.97)}.look-card.selected{outline:3px solid var(--ink);outline-offset:1px}.look-card.locked .look-name{opacity:.8}.look-tier{letter-spacing:.06em;text-transform:uppercase;color:var(--tier);font-size:10px;font-weight:800}.look-name{font-size:15px;font-weight:800}.look-status{color:var(--muted);margin-top:auto;font-size:12px;font-weight:600}.look-card.equipped .look-status{color:#7be08a}.look-detail{border-left:4px solid var(--tier);background:#0000004d;border-radius:10px;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 12px;display:flex}.look-detail-head{flex-direction:column;flex:140px;display:flex}.look-detail-head strong{font-size:17px}.look-price{margin:0;font-weight:800}.look-note{color:var(--muted);flex-basis:100%;margin:0;font-size:13px}.look-equipped{color:#7be08a;font-weight:800}.look-detail .btn:disabled{opacity:.5;cursor:default}.look-detail .reset-confirm,.look-detail .error-text{flex-basis:100%;margin:0}@media (max-width:640px){.menus:has(.looks-menu){background:linear-gradient(#0000 35%,#00000073);align-items:flex-end;padding:8px}.looks-menu{width:100%;max-height:44vh;gap:8px;max-height:44dvh;padding:14px}.looks-grid{grid-template-columns:repeat(3,1fr)}.looks-head h2{font-size:20px}.look-card{min-height:58px;padding:5px 8px}.look-name{font-size:14px}}