:root{--bg: #080b13;--surface: #111828;--raised: #182135;--line: #232f4a;--line-soft: #1b2740;--text: #e8eefb;--muted: #8493b0;--faint: #5d6b87;--accent: #4ade80;--accent-2: #38bdf8;--danger: #fb7185;--warn: #fbbf24;--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 24px;--r1: 8px;--r2: 12px;--r3: 16px;--r4: 999px;--shadow: 0 10px 30px -12px rgba(0, 0, 0, .7);--ring: 0 0 0 1px rgba(255, 255, 255, .06) inset;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:gg sans,Inter,system-ui,-apple-system,Segoe UI,sans-serif;font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased;touch-action:none;overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer;border:none;background:none}button:disabled{cursor:not-allowed}:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}#app{display:grid;grid-template-columns:1fr 272px;height:100%;gap:var(--s3);padding:var(--s3)}#stage{position:relative;display:grid;place-items:center;min-width:0;border-radius:var(--r3);border:1px solid var(--line-soft);background:radial-gradient(120% 90% at 50% 0%,#1a2540 0%,transparent 60%),var(--surface);box-shadow:var(--shadow);overflow:hidden}#board{display:block;max-width:100%;max-height:100%;border-radius:var(--r1)}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#080b13db;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:opacity .25s ease;z-index:5}.overlay.hidden{opacity:0;pointer-events:none}.overlay-card{width:min(360px,100%);padding:var(--s5);text-align:center;animation:card-in .3s cubic-bezier(.2,.9,.3,1)}.overlay-card h1{font-size:30px;font-weight:800;letter-spacing:-.025em;margin-bottom:var(--s4);background:linear-gradient(96deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.overlay-card p{margin-top:var(--s4);min-height:20px;font-size:12.5px;color:var(--faint)}.overlay-card p.error{color:var(--danger);font-weight:600}.loader{margin:0 auto var(--s3);width:150px}.loader svg{width:100%;height:auto;overflow:visible}.loader path{fill:none;stroke-linecap:round;stroke-width:7}.loader-track{stroke:#ffffff0d}.loader-snake{stroke:var(--accent);stroke-dasharray:46 210;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--accent) 55%,transparent));animation:slither 2.2s cubic-bezier(.6,0,.4,1) infinite}@keyframes slither{0%{stroke-dashoffset:256;stroke:var(--accent)}50%{stroke:var(--accent-2)}to{stroke-dashoffset:0;stroke:var(--accent)}}.stages{list-style:none;display:inline-flex;flex-direction:column;gap:9px;text-align:left}.stages li{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:500;color:var(--faint);transition:color .25s ease}.stages i{width:15px;height:15px;flex-shrink:0;position:relative;border-radius:50%;border:2px solid var(--line);transition:border-color .25s ease,background .25s ease}.stages li.active{color:var(--text);font-weight:600}.stages li.active i{border-color:var(--accent);border-right-color:transparent;animation:spin .7s linear infinite}.stages li.done{color:var(--muted)}.stages li.done i{border-color:var(--accent);background:var(--accent)}.stages li.done i:after{content:"";position:absolute;left:3.5px;top:.5px;width:4px;height:8px;border:solid #052012;border-width:0 2px 2px 0;transform:rotate(43deg)}@keyframes spin{to{transform:rotate(360deg)}}#toasts{position:absolute;left:50%;bottom:var(--s4);transform:translate(-50%);display:flex;flex-direction:column-reverse;align-items:center;gap:var(--s1);pointer-events:none;z-index:4;width:max-content;max-width:92%}.toast{padding:7px 16px;font-size:13px;font-weight:600;border-radius:var(--r4);background:#0c1220f0;border:1px solid currentColor;box-shadow:0 6px 20px -8px #000c;white-space:nowrap;animation:toast-in .22s cubic-bezier(.2,.9,.3,1),toast-out .35s ease 2.3s forwards}@keyframes toast-in{0%{opacity:0;transform:translateY(10px) scale(.96)}}@keyframes toast-out{to{opacity:0;transform:translateY(-6px)}}#sidebar{display:flex;flex-direction:column;gap:var(--s3);min-height:0;padding:var(--s3);border-radius:var(--r3);border:1px solid var(--line-soft);background:var(--surface);box-shadow:var(--shadow)}.panel-head{display:flex;align-items:center;gap:var(--s2);padding-bottom:var(--s3);border-bottom:1px solid var(--line-soft)}#phase{flex:1;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--faint)}#timer{font-size:22px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}#open-lobby{width:30px;height:30px;display:grid;place-items:center;border-radius:var(--r1);border:1px solid var(--line);background:var(--raised);color:var(--muted);transition:color .15s,border-color .15s}#open-lobby:hover{color:var(--text);border-color:var(--accent)}#scoreboard{list-style:none;display:flex;flex-direction:column;gap:var(--s1);overflow-y:auto;flex:1;min-height:0}.row{display:grid;grid-template-columns:3px 1fr auto;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r1);background:var(--raised);font-size:13px;transition:opacity .2s ease;overflow:hidden}.row.me{box-shadow:inset 0 0 0 1px #ffffff29}.row.dead{opacity:.4}.row .chip{width:3px;height:22px;border-radius:var(--r4)}.row .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row .sub{display:block;font-size:10.5px;font-weight:500;color:var(--faint)}.row .score{font-weight:800;font-variant-numeric:tabular-nums}.effects{display:flex;flex-wrap:wrap;gap:var(--s1);min-height:24px}.badge{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;font-size:11px;font-weight:700;border-radius:var(--r4);border:1px solid currentColor;background:color-mix(in srgb,currentColor 12%,transparent)}#legend{border-top:1px solid var(--line-soft);padding-top:var(--s3);display:grid;grid-template-columns:1fr 1fr;gap:3px var(--s2);font-size:11px}#legend span{display:flex;align-items:center;gap:5px}.legend-head{grid-column:1 / -1;margin-top:6px;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--faint)}.legend-head:first-child{margin-top:0}.lobby{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:var(--s3);background:#060910eb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow-y:auto}.lobby.hidden{display:none}.lobby-card{width:min(920px,100%);max-height:100%;display:flex;flex-direction:column;gap:var(--s4);padding:var(--s5);border-radius:20px;border:1px solid var(--line);background:linear-gradient(180deg,#141d31 0%,var(--surface) 42%);box-shadow:0 24px 60px -20px #000000d9;overflow:hidden;animation:card-in .25s cubic-bezier(.2,.9,.3,1)}@keyframes card-in{0%{opacity:0;transform:translateY(10px) scale(.99)}}.lobby-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s4)}.lobby-head h1{font-size:27px;font-weight:800;letter-spacing:-.025em;background:linear-gradient(96deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.lobby-head .sub{margin-top:3px;font-size:12.5px;color:var(--muted);display:flex;align-items:center;flex-wrap:wrap;gap:6px}.xpbar{margin-top:10px;width:240px;max-width:100%;height:5px;border-radius:var(--r4);background:var(--raised);overflow:hidden}.xpbar span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .4s ease}.wallet{display:flex;gap:var(--s2);flex-shrink:0}.wallet div{min-width:92px;padding:10px var(--s3);text-align:right;border-radius:var(--r2);border:1px solid var(--line-soft);background:var(--raised)}.wallet b{display:block;font-size:19px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.wallet span{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--faint)}.mode-badge{padding:2px 9px;border-radius:var(--r4);font-size:10.5px;font-weight:700;color:var(--warn);background:color-mix(in srgb,var(--warn) 16%,transparent)}.mode-badge.plain{color:var(--muted);background:#8493b029}.tabs{display:flex;gap:var(--s1);padding:var(--s1);border-radius:var(--r2);background:#080c1599;border:1px solid var(--line-soft)}.tab{flex:1;padding:9px var(--s3);border-radius:var(--r1);font-size:13px;font-weight:600;color:var(--muted);transition:background .15s,color .15s}.tab:hover{color:var(--text);background:#ffffff0a}.tab.on{color:var(--text);background:var(--raised);box-shadow:var(--ring),0 2px 8px -4px #0009}.lobby-body{display:grid;gap:var(--s3);overflow-y:auto;min-height:0;padding-right:var(--s1);margin-right:calc(var(--s1) * -1)}.lobby-body.single{grid-template-columns:1fr}.panel h2{display:flex;align-items:center;gap:var(--s2);margin-bottom:var(--s2);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--faint)}.panel h2.spaced{margin-top:var(--s5)}.panel .hint{margin-bottom:var(--s3);font-size:12px;line-height:1.5;color:var(--muted)}.panel .hint b{color:var(--text)}.grouphead{margin:var(--s4) 0 var(--s2);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--faint)}.tag{padding:3px 9px;border-radius:var(--r4);font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:none}.tag.self{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}.tag.global{background:color-mix(in srgb,var(--danger) 16%,transparent);color:var(--danger)}.tag.curve{background:#a78bfa2e;color:#a78bfa}.tag.grow{background:#22d3ee29;color:#22d3ee}.menu{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3)}.menu .tile.primary{grid-column:1 / -1;flex-direction:row;align-items:center;gap:var(--s4);padding:var(--s4) var(--s5)}.menu .tile.primary .tile-icon{margin:0;font-size:30px}.menu .tile.primary b{font-size:17px}.menu .tile.primary:after{content:"→";margin-left:auto;font-size:20px;color:var(--accent);transition:transform .18s ease}.menu .tile.primary:hover:after{transform:translate(4px)}.menu .tile.primary>div{display:flex;flex-direction:column;gap:1px}.tile{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:var(--s4);border-radius:var(--r2);border:1px solid var(--line-soft);background:var(--raised);text-align:left;transition:transform .15s,border-color .15s,background .15s}.tile:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 10px 24px -14px color-mix(in srgb,var(--accent) 80%,transparent)}.tile:active{transform:translateY(0)}.tile.primary{border-color:color-mix(in srgb,var(--accent) 45%,transparent);background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 14%,transparent),color-mix(in srgb,var(--accent-2) 8%,transparent)),var(--raised)}.tile-icon{font-size:24px;line-height:1.1;margin-bottom:6px}.tile b{font-size:15px;font-weight:700;letter-spacing:-.01em}.tile span:not(.tile-icon){font-size:11.5px;line-height:1.45;color:var(--muted)}.modechoice{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s2)}.lobbylist{list-style:none;display:flex;flex-direction:column;gap:var(--s2);margin-bottom:var(--s3)}.lobbylist li{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:var(--s3) var(--s4);border-radius:var(--r2);border:1px solid var(--line-soft);background:var(--raised);transition:border-color .15s}.lobbylist li:hover{border-color:var(--line)}.lobbylist b{font-size:14px;font-weight:700}.lobbylist .sub{display:block;margin-top:2px;font-size:11.5px;color:var(--muted)}.play{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:12px var(--s5);border-radius:var(--r2);font-size:15px;font-weight:700;letter-spacing:-.01em;color:#052012;background:linear-gradient(96deg,var(--accent),var(--accent-2));box-shadow:0 8px 22px -10px color-mix(in srgb,var(--accent) 70%,transparent);transition:filter .15s,transform .12s}.play:hover:not(:disabled){filter:brightness(1.07);transform:translateY(-1px)}.play:active:not(:disabled){transform:translateY(0)}.play span{font-size:10.5px;font-weight:600;opacity:.72}.play.wide{width:100%}.play.secondary{color:var(--text);background:var(--raised);border:1px solid var(--line);box-shadow:none}.play.ghost{padding:11px var(--s4);font-size:13px;color:var(--muted);background:none;border:1px solid var(--line);box-shadow:none}.play.ghost:hover{color:var(--text);border-color:var(--muted)}.play:disabled{opacity:.5;color:var(--muted);background:var(--raised);box-shadow:none}.linkbtn{padding:var(--s2) 0;font-size:12.5px;color:var(--muted);transition:color .15s}.linkbtn:hover{color:var(--text)}.buy{padding:7px var(--s3);border-radius:var(--r1);border:1px solid var(--line);background:var(--raised);font-size:12px;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums;transition:border-color .15s,color .15s}.buy:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.buy:disabled{opacity:.35}.items{list-style:none;display:flex;flex-direction:column;gap:6px}.item{display:grid;grid-template-columns:34px 1fr auto;gap:var(--s3);align-items:center;padding:10px var(--s3);border-radius:var(--r2);background:var(--raised);border:1px solid transparent;border-left:3px solid var(--accent);transition:background .15s,border-color .15s}.item.equipped{background:color-mix(in srgb,var(--accent) 12%,var(--raised));border-color:color-mix(in srgb,var(--accent) 30%,transparent);border-left-color:var(--accent)}.item .icon{font-size:21px;text-align:center}.item .info b{font-size:13.5px;font-weight:700}.item .info .sub{display:block;font-size:11px;line-height:1.4;color:var(--muted)}.item .lvl{display:block;margin-top:3px;font-size:10.5px;font-weight:700;color:var(--accent)}.item .lvl em{font-style:normal;font-weight:600;color:var(--faint);margin-left:6px}.item .lvl em.warn{color:var(--warn)}.item .actions{display:flex;flex-direction:column;gap:var(--s1);align-items:stretch}.equip{padding:6px var(--s3);border-radius:var(--r1);border:1px solid var(--line);background:transparent;font-size:11.5px;font-weight:700;color:var(--muted);white-space:nowrap;transition:color .15s,border-color .15s,background .15s}.equip:hover:not(:disabled){color:var(--text);border-color:var(--muted)}.equip.on{color:#052012;background:var(--accent);border-color:transparent}.equip:disabled{opacity:.3}.ranking{list-style:none;display:flex;flex-direction:column;gap:5px}.ranking li{display:grid;grid-template-columns:26px 1fr auto;gap:var(--s3);align-items:center;padding:10px var(--s3);border-radius:var(--r2);background:var(--raised);font-size:13px}.ranking li.me{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 45%,transparent)}.ranking li.empty{display:block;padding:var(--s5);text-align:center;color:var(--faint);background:none;border:1px dashed var(--line)}.ranking .pos{font-size:12px;font-weight:800;text-align:center;color:var(--faint);font-variant-numeric:tabular-nums}.ranking li:nth-child(1) .pos{color:#fbbf24}.ranking li:nth-child(2) .pos{color:#cbd5e1}.ranking li:nth-child(3) .pos{color:#d97706}.ranking .who{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ranking .sub{display:block;font-size:10.5px;font-weight:500;color:var(--faint)}.ranking .pts{font-weight:800;font-variant-numeric:tabular-nums}.yourank{margin-top:var(--s3);font-size:12px;color:var(--muted)}.yourank b{color:var(--text)}.members{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-bottom:var(--s3)}.members li{display:flex;align-items:center;gap:6px;padding:7px var(--s3);border-radius:var(--r4);border:1px solid var(--line-soft);background:var(--raised);font-size:13px;font-weight:600}.members li.me{border-color:color-mix(in srgb,var(--accent) 55%,transparent)}.crown{font-size:12px}.last-results{display:flex;flex-wrap:wrap;gap:5px var(--s4);padding:var(--s3);margin-bottom:var(--s3);border-radius:var(--r2);border:1px solid var(--line-soft);background:#080c1580;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.last-results b{width:100%;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--faint)}.waiting-note{margin-bottom:var(--s3);font-size:12.5px;font-weight:600;color:var(--warn)}.hall-actions{display:flex;align-items:center;gap:var(--s2);margin-top:var(--s4);padding-top:var(--s4);border-top:1px solid var(--line-soft)}.hall-actions .play:not(.ghost){margin-left:auto}.dpad{display:none}@media(max-width:780px),(max-height:560px){#app{grid-template-columns:1fr;grid-template-rows:1fr auto;gap:var(--s2);padding:var(--s2)}#sidebar{flex-direction:row;align-items:center;gap:var(--s3);max-height:84px;padding:var(--s2) var(--s3)}.panel-head{flex-direction:column;gap:0;padding:0;border:none;align-items:flex-start}#phase{font-size:9px}#timer{font-size:18px}#open-lobby{position:absolute;top:var(--s3);right:var(--s3);z-index:6}#scoreboard{flex-direction:row;overflow-x:auto;overflow-y:hidden}.row{min-width:132px;flex-shrink:0}#legend,.effects{display:none}.lobby{padding:var(--s2)}.lobby-card{padding:var(--s4);gap:var(--s3);border-radius:var(--r3)}.lobby-head{flex-direction:column;gap:var(--s3)}.lobby-head h1{font-size:22px}.menu{grid-template-columns:1fr}.menu .tile.primary{padding:var(--s4)}.wallet{width:100%}.wallet div{flex:1}.xpbar{width:100%}.tabs{position:sticky;top:0;z-index:2}.tab{padding:8px 6px;font-size:12px}.hall-actions{flex-wrap:wrap}.hall-actions .play:not(.ghost){flex:1}.dpad{position:absolute;right:var(--s3);bottom:96px;display:grid;grid-template-columns:repeat(3,52px);grid-template-rows:repeat(2,52px);gap:6px;z-index:6}.dpad button{border-radius:var(--r2);border:1px solid var(--line);background:#182135e6;color:var(--text);font-size:16px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dpad button:active{background:var(--accent);color:#052012}.dpad [data-dir=up]{grid-column:2;grid-row:1}.dpad [data-dir=left]{grid-column:1;grid-row:2}.dpad [data-dir=down]{grid-column:2;grid-row:2}.dpad [data-dir=right]{grid-column:3;grid-row:2}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}*{scrollbar-width:thin;scrollbar-color:var(--line) transparent}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-thumb{background:var(--line);border-radius:var(--r4)}*::-webkit-scrollbar-track{background:transparent}