:root{--bg:#070b18;--panel:#101831;--panel-2:#172247;--line:#26346a;--text:#e6ebff;--muted:#8f9bc7;--accent:#38e8a5;--accent-ink:#04261a;--danger:#ff5d6c;--warn:#fbbf24;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0;overflow-x:hidden}body{background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;overscroll-behavior:none;overflow-x:hidden}button,input{font:inherit;color:inherit}h1,h3,h4,p{margin:0}.btn{border:1px solid var(--line);background:var(--panel-2);cursor:pointer;border-radius:12px;padding:12px 18px;font-weight:700;transition:transform 80ms,background .15s,border-color .15s}.btn:hover:not(:disabled){border-color:var(--accent)}.btn:active:not(:disabled){transform:translateY(1px)scale(.99)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.ghost{background:0 0}.btn.small{padding:8px 12px;font-size:14px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.field{gap:6px;display:grid}.field span,.label{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:12px}input{border:1px solid var(--line);background:#0a1126;border-radius:10px;width:100%;min-width:0;padding:12px 14px}.hint{color:var(--muted);font-size:13px}.error{color:var(--danger);font-size:14px}.home{background:radial-gradient(800px 500px at 50% -10%, #38e8a524, transparent 70%), linear-gradient(transparent 31px, #26346a59 32px) 0 0 / 32px 32px, linear-gradient(90deg, transparent 31px, #26346a59 32px) 0 0 / 32px 32px, var(--bg);place-items:center;min-height:100%;padding:24px 16px;display:grid}.home-card{background:var(--panel);border:1px solid var(--line);border-radius:20px;gap:16px;width:min(420px,100%);padding:28px;display:grid}.logo{font-family:var(--mono);letter-spacing:-.04em;font-size:clamp(44px,12vw,64px);line-height:1}.logo span{color:var(--accent)}.tagline{color:var(--muted)}.or{text-align:center;color:var(--muted);font-size:13px}.join{grid-template-columns:1fr auto;gap:8px;display:grid}.join input{font-family:var(--mono);letter-spacing:.3em;text-transform:uppercase;text-align:center;font-weight:700}.lobby{align-content:start;gap:16px;max-width:1180px;min-height:100%;margin:0 auto;padding:16px;display:grid}.lobby-head{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.lobby-head>div{margin-right:auto;display:grid}.code{font-family:var(--mono);letter-spacing:.18em;color:var(--accent);font-size:36px;line-height:1}.lobby-body{grid-template-columns:minmax(280px,360px) 1fr;align-items:start;gap:16px;display:grid}.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;gap:14px;min-width:0;padding:16px;display:grid}.panel h3 small{color:var(--muted);font-weight:500}.players{gap:8px;margin:0;padding:0;list-style:none;display:grid}.players li{background:#0b1228;border:1px solid #0000;border-radius:12px;align-items:center;gap:10px;padding:8px;display:flex}.players li.ready{border-color:#38e8a580}.who{min-width:0;margin-right:auto;display:grid}.who strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.who span{font-size:13px;font-weight:700}.tag{background:var(--panel-2);color:var(--muted);border-radius:99px;padding:2px 8px;font-size:11px}.state{color:var(--muted);white-space:nowrap;font-size:12px}.state.ok{color:var(--accent);font-weight:700}.actions{gap:8px;display:grid}.actions.row{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;display:flex}.setup{border:0;gap:14px;min-width:0;margin:0;padding:0;display:grid}.setup:disabled{opacity:.55}.classes{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.class{text-align:left;border:2px solid var(--line);cursor:pointer;background:#0b1228;border-radius:12px;gap:4px;padding:10px;display:grid}.class strong{color:var(--c)}.class span{color:var(--muted);font-size:12px}.class.on{border-color:var(--c);background:color-mix(in srgb, var(--c) 14%, #0b1228)}.editor{grid-template-columns:190px 1fr;align-items:start;gap:16px;display:grid}.preview{background:radial-gradient(circle at 50% 60%,#1c2a5c,#0b1228);border-radius:14px;place-items:center;padding:10px;display:grid;position:sticky;top:12px}.editor-options{gap:8px;min-width:0;display:grid}.editor-options h4{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:4px;font-size:12px}.head-grid{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:6px;display:grid}.head{cursor:pointer;background:#0b1228;border:2px solid #0000;border-radius:12px;place-items:center;padding:2px;display:grid}.head.on{border-color:var(--accent)}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{border:1px solid var(--line);cursor:pointer;background:#0b1228;border-radius:99px;padding:6px 12px;font-size:14px}.chip.on{border-color:var(--accent);color:var(--accent)}.swatch{border:2px solid var(--line);cursor:pointer;border-radius:50%;width:30px;height:30px}.swatch.on{box-shadow:0 0 0 2px var(--accent);border-color:#fff}.chip:disabled,.swatch:disabled{opacity:.35;cursor:not-allowed}.bob{animation:1.1s ease-in-out infinite bob}@keyframes bob{50%{transform:translateY(-5px)rotate(-1.5deg)}}.overlay{z-index:20;background:#070b18d1;place-items:center;display:grid;position:fixed;inset:0}.count{font-family:var(--mono);color:var(--accent);font-size:160px;font-weight:900;animation:1s ease-out infinite pop}@keyframes pop{0%{opacity:.2;transform:scale(1.5)}to{opacity:1;transform:scale(1)}}.game{touch-action:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:hidden}.viewport{position:absolute;inset:0}.viewport canvas{cursor:crosshair;display:block}.hud{pointer-events:none;padding:max(10px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));font-size:14px;position:absolute;inset:0}.hud.loading{color:var(--muted);place-items:center;display:grid}.bar{border:1px solid var(--line);background:#070b18d9;border-radius:99px;height:14px;overflow:hidden}.bar i{border-radius:99px;height:100%;transition:width .12s linear;display:block}.bar.thin{height:7px}.top{top:max(10px, env(safe-area-inset-top));text-align:center;gap:6px;width:min(460px,62vw);display:grid;position:absolute;left:50%;transform:translate(-50%)}.wave{font-family:var(--mono);letter-spacing:.08em;font-weight:800}.core,.boss{background:#101831c7;border-radius:12px;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:6px 10px;font-size:12px;font-weight:700;display:grid}.boss{color:#fecaca;grid-template-columns:auto 1fr}.boss em{font-style:normal}.break{color:var(--warn);font-weight:700}.allies{top:max(10px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));gap:6px;width:min(150px,26vw);margin:0;padding:0;list-style:none;display:grid;position:absolute}.allies li{background:#101831c7;border-radius:10px;gap:3px;padding:5px 8px;font-size:12px;font-weight:700;display:grid}.allies span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.allies li.down{opacity:.45}.banner{text-align:center;border:1px solid var(--accent);background:#070b18db;border-radius:14px;gap:4px;max-width:90vw;padding:12px 22px;animation:.25s ease-out banner;display:grid;position:absolute;top:84px;left:50%;transform:translate(-50%)}.banner strong{font-family:var(--mono);font-size:clamp(20px,5vw,30px)}.banner span{color:var(--accent);font-weight:700}@keyframes banner{0%{opacity:0;transform:translate(-50%)scale(.8)}}.respawn{text-align:center;border:1px solid var(--danger);background:#3c0a14d9;border-radius:14px;gap:4px;padding:14px 24px;display:grid;position:absolute;top:24%;left:50%;transform:translate(-50%,-50%)}.respawn strong{font-size:20px}.me{left:50%;bottom:max(14px, env(safe-area-inset-bottom));background:#101831c7;border-radius:12px;grid-template-columns:auto 1fr auto;align-items:center;gap:4px 8px;width:min(280px,44vw);padding:8px 10px;font-size:12px;font-weight:700;display:grid;position:absolute;transform:translate(-50%)}.me .thin{grid-column:1/-1}.super{right:max(16px, env(safe-area-inset-right));bottom:max(16px, env(safe-area-inset-bottom));pointer-events:auto;cursor:pointer;text-align:center;width:104px;height:104px;color:var(--text);background:radial-gradient(circle, #101831 58%, transparent 60%), conic-gradient(var(--c) var(--p), #26346a 0);border:0;border-radius:50%;place-content:center;gap:2px;display:grid;position:absolute}.super strong{max-width:80px;font-size:12px;line-height:1.1}.super span{font-family:var(--mono);color:var(--muted);font-size:12px}.super.ready{animation:.7s ease-in-out infinite alternate glow}.super.ready span{color:var(--c);font-weight:800}.attack{display:none}@keyframes glow{to{box-shadow:0 0 26px var(--c);transform:scale(1.06)}}@media (pointer:coarse),(max-width:800px){.attack{right:max(20px, env(safe-area-inset-right));bottom:max(20px, env(safe-area-inset-bottom));color:#fff;cursor:pointer;pointer-events:auto;text-align:center;-webkit-user-select:none;user-select:none;touch-action:none;z-index:20;background:radial-gradient(circle,#f43f5e 30%,#be123c 100%);border:3px solid #ffffff73;border-radius:50%;place-content:center;width:84px;height:84px;transition:transform 80ms,filter 80ms;display:grid;position:absolute;box-shadow:0 4px 18px #f43f5e8c,inset 0 2px 4px #fff6}.attack:active{filter:brightness(1.25);transform:scale(.92);box-shadow:0 2px 10px #f43f5ecc}.attack .icon{filter:drop-shadow(0 2px 4px #0006);font-size:24px;line-height:1}.attack strong{letter-spacing:.6px;text-shadow:0 1px 3px #0009;font-size:11px;font-weight:900}.super{right:max(26px, env(safe-area-inset-right));bottom:max(116px, env(safe-area-inset-bottom));z-index:20;width:72px;height:72px}.super strong{font-size:11px}}.keys{left:max(12px, env(safe-area-inset-left));bottom:max(12px, env(safe-area-inset-bottom));color:var(--muted);max-width:30vw;font-size:12px;position:absolute}.stick-base{pointer-events:none;z-index:5;background:#ffffff14;border:2px solid #ffffff59;border-radius:50%;width:112px;height:112px;margin:-56px 0 0 -56px;position:fixed}.stick-knob{opacity:.85;border-radius:50%;width:52px;height:52px;margin:-26px 0 0 -26px;position:absolute;top:50%;left:50%}.conn{z-index:50;text-align:center;background:var(--warn);color:#1f1300;padding:8px;font-weight:700;position:fixed;top:0;left:0;right:0}.mute{right:max(10px, env(safe-area-inset-right));top:max(10px, env(safe-area-inset-top));z-index:30;border:1px solid var(--line);color:var(--muted);cursor:pointer;background:#101831d9;border-radius:99px;padding:6px 10px;font-size:12px;position:fixed}.mute[aria-pressed=false]{color:var(--text)}.lobby-head{padding-right:120px}.result{text-align:center;box-sizing:border-box;flex-direction:column;justify-content:safe center;align-items:center;gap:20px;width:100%;max-width:860px;min-height:100vh;margin:0 auto;padding:32px 16px 48px;display:flex}.result h1{font-family:var(--mono);letter-spacing:-.03em;margin:0;font-size:clamp(28px,7vw,56px);line-height:1.1}.result.win h1{color:var(--accent)}.result.lose h1{color:var(--danger)}.sub{color:var(--muted);max-width:580px;margin:0 auto}.summary{grid-template-columns:repeat(3,1fr);gap:12px;width:100%;max-width:580px;margin:0 auto;display:grid}.summary div{background:var(--panel);border:1px solid var(--line);border-radius:14px;gap:2px;padding:12px;display:grid}.summary b{font-family:var(--mono);font-size:24px}.summary span{color:var(--muted);font-size:12px}.killed{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:6px 14px;max-width:620px;margin:0 auto;padding:0;font-size:14px;list-style:none;display:flex}.killed b{color:var(--text)}.ranking-wrap{-webkit-overflow-scrolling:touch;background:var(--panel);border:1px solid var(--line);box-sizing:border-box;border-radius:14px;width:100%;max-width:860px;margin:0 auto;overflow-x:auto}.ranking{border-collapse:collapse;text-align:right;font-variant-numeric:tabular-nums;background:0 0;width:100%}.ranking th{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap;padding:10px 8px;font-size:11px}.ranking td{border-top:1px solid var(--line);white-space:nowrap;padding:8px 10px}.ranking th:nth-child(2),.ranking td.player{text-align:left}.ranking td.player{align-items:center;gap:10px;min-width:180px;display:flex}.ranking td.player>div{flex-direction:column;align-items:flex-start;min-width:0;display:flex}.ranking td.player strong{white-space:nowrap}.ranking td.player span{white-space:nowrap;font-size:12px;font-weight:700}.ranking tr.mine{background:#38e8a514}.ranking .total{font-family:var(--mono);font-size:18px;font-weight:800}.badges{flex-wrap:wrap;gap:4px;margin-top:3px;display:flex}.badges em{background:var(--panel-2);color:var(--text);white-space:nowrap;border-radius:99px;padding:2px 8px;font-size:11px;font-style:normal}.badges .mvp{background:var(--warn);color:#1f1300;font-weight:800}.actions.row{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;width:100%;max-width:580px;margin:0 auto;display:flex}@media (max-width:860px){.lobby-body{grid-template-columns:1fr}.classes{grid-template-columns:repeat(2,1fr)}.editor{grid-template-columns:1fr}.preview{position:static}.ranking th:nth-child(n+3):not(:last-child),.ranking td:nth-child(n+3):not(:last-child),.keys{display:none}}@media (max-width:480px){.summary{gap:8px}.summary div{padding:8px 6px}.summary b{font-size:20px}.summary span{font-size:11px;line-height:1.2}}@media (prefers-reduced-motion:reduce){.bob,.count,.super.ready,.banner{animation:none}}@media (max-height:500px){.banner{gap:0;padding:6px 14px;top:62px}.banner strong{font-size:17px}.banner span{font-size:12px}.me{width:min(220px,34vw);padding:5px 8px}}.head-cell{justify-items:center;gap:2px;display:grid}.link{color:var(--muted);cursor:pointer;background:0 0;border:0;padding:2px;font-size:11px;text-decoration:underline}.modal{z-index:50;background:#040710d1;place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow-y:auto}.modal-card{background:var(--panel);border:1px solid var(--line);border-radius:20px;align-content:start;gap:14px;width:min(560px,100%);max-height:calc(100dvh - 32px);padding:22px;display:grid;overflow-y:auto}.modal-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.modal-head h2{margin:0;font-size:20px}.steps{color:var(--muted);flex-wrap:wrap;gap:6px 14px;margin:0;font-size:12px;display:flex}.steps .on{color:var(--accent);font-weight:700}.steps .past{color:var(--text)}.guide{gap:12px;display:grid}.guide ol{gap:6px;margin:0;padding-left:20px;display:grid}.prompt{resize:vertical;width:100%;font:12px/1.5 var(--mono);color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px}.row{flex-wrap:wrap;gap:10px;display:flex}.row.end{justify-content:flex-end}.drop{min-height:160px;color:var(--muted);background:var(--bg);border:2px dashed var(--line);cursor:pointer;border-radius:14px;place-items:center;padding:10px;display:grid}.drop img{object-fit:contain;max-width:100%;max-height:220px}.terms{background:var(--bg);border:1px solid var(--line);border-radius:10px;max-height:240px;padding:12px;font-size:13px;line-height:1.5;overflow-y:auto}.terms p{margin:0 0 10px}.check{align-items:flex-start;gap:10px;font-size:14px;line-height:1.4;display:flex}.check input,input[type=checkbox],input[type=radio]{width:18px;height:18px;accent-color:var(--accent);flex:none;margin:1px 0 0;padding:0}.drop.over{border-color:var(--accent);background:var(--panel-2)}fieldset.field{border:0;margin:0;padding:0}.codebox{background:var(--bg);border:1px solid var(--line);border-radius:12px;justify-items:start;gap:6px;padding:12px;display:grid}.codebox code{font:700 18px var(--mono);letter-spacing:.04em;word-break:break-all;-webkit-user-select:all;user-select:all}.adjust{justify-items:center;gap:10px;display:grid}.adjust .field,.adjust .chips{width:100%}.adjust-canvas{aspect-ratio:1;background:var(--bg);border:1px solid var(--line);border-radius:14px;width:min(300px,100%);height:auto}input[type=range]{accent-color:var(--accent);padding:0}a.btn{color:inherit;text-decoration:none;display:inline-block}a.btn.primary{color:var(--accent-ink)}.account{flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:13px;display:flex}.cell-actions{gap:6px;display:flex}.tabs{background:#ffffff0a;border-radius:10px;gap:4px;margin-bottom:12px;padding:3px;display:flex}.tab{color:inherit;font:inherit;cursor:pointer;opacity:.7;background:0 0;border:0;border-radius:8px;flex:1;padding:8px 10px;font-weight:600}.tab.on{color:#00e6a0;opacity:1;background:#00e6a029}.cari-block{border-bottom:1px solid #ffffff0f;flex-direction:column;gap:8px;margin-bottom:14px;padding-bottom:14px;display:flex}.cari-block:last-of-type{border-bottom:0}.cari-block h5{letter-spacing:.08em;text-transform:uppercase;opacity:.6;margin:0;font-size:11px}.cari-block .join{margin:0}.cari-block .account{margin-top:4px}.my-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.my-item{background:#0b1228;border:2px solid #0000;border-radius:12px;gap:8px;padding:8px;display:grid}.my-item.on{border-color:var(--accent)}.my-pick{color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:12px;padding:0;display:flex}.my-thumb{background:#ffffff0a;border-radius:10px;flex:none;place-items:center;width:56px;height:56px;display:grid}.my-name{gap:2px;min-width:0;display:grid}.my-name strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.my-name small{color:var(--muted);font-size:12px}.my-actions{flex-wrap:wrap;gap:6px;display:flex}.mini{color:inherit;font:inherit;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff24;border-radius:8px;padding:5px 10px;font-size:12px}.mini:hover{background:#ffffff1a}.mini.danger{color:#ff7a7a;border-color:#ff7a7a59}.consent-banner{left:12px;right:12px;bottom:max(12px, env(safe-area-inset-bottom));z-index:50;border:1px solid var(--line);background:#101831f7;border-radius:14px;max-width:520px;margin:0 auto;padding:14px;position:fixed;box-shadow:0 8px 30px #00000080}.consent-banner p{margin:0 0 10px;font-size:13px;line-height:1.45}.consent-banner .row{justify-content:flex-end;gap:8px;display:flex}