:root{color-scheme:dark;--bg: #070a12;--panel: #121826;--line: #2a3548;--text: #edf1f7;--muted: #93a0b5;--accent: #ff7a45;--p1: #3ecf8e;--p2: #5b9dff}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Avenir Next,Segoe UI,sans-serif}#app{display:grid;place-items:center}#viewport{position:relative;width:min(100vw,calc(100vh * 16 / 9));aspect-ratio:16 / 9}#game{width:100%;height:100%;display:block;background:#0b1020;touch-action:none}#hud{position:absolute;inset:18px 24px auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;pointer-events:none;text-shadow:0 2px 10px rgba(0,0,0,.55)}#hud .title{letter-spacing:.28em;font-size:12px;color:var(--muted);padding-top:8px}#hud .fighter{display:flex;flex-direction:column;gap:4px}#hud .fighter[data-slot="1"]{text-align:right}#hud .name{font-size:14px;letter-spacing:.06em;text-transform:uppercase}#hud .percent{font-size:42px;font-weight:700;line-height:1}#hud .lives{color:var(--accent);letter-spacing:.12em}#overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#070a129e;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#overlay[data-hidden=true]{display:none}.panel{width:min(560px,calc(100vw - 32px));padding:28px;border:1px solid var(--line);background:var(--panel);border-radius:18px;box-shadow:0 20px 60px #00000059}.panel.lobby{position:relative;width:min(820px,calc(100vw - 32px));min-height:min(520px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);padding:20px;display:grid;grid-template-columns:minmax(240px,1fr) minmax(260px,1fr);grid-template-rows:minmax(0,1fr);gap:20px;overflow:hidden}.lobby-fighter-canvas{position:absolute;pointer-events:none;z-index:3}.eyebrow{margin:0 0 8px;color:var(--accent);letter-spacing:.16em;text-transform:uppercase;font-size:11px}h1,h2{margin:0 0 12px}.blurb,.hint{color:var(--muted);line-height:1.5}label{display:flex;flex-direction:column;gap:8px;margin:0 0 14px;font-size:13px;color:var(--muted)}input,button{font:inherit}.stage-heading{margin:4px 0 8px;color:var(--muted);font-size:12px;letter-spacing:.12em;text-transform:uppercase}.stage-select{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}.stage-select button{min-height:70px;padding:10px;border:1px solid var(--line);background:#0d1320;color:var(--text)}.stage-select button[data-selected=true]{border-color:var(--accent);background:#ff7a4526;box-shadow:inset 0 0 0 1px var(--accent)}.stage-select strong,.stage-select span{display:block}.stage-select strong{font-size:12px}.stage-select span{margin-top:4px;color:var(--muted);font-size:10px}input{padding:12px 14px;border-radius:10px;border:1px solid var(--line);background:#0d1320;color:var(--text)}button{width:100%;padding:12px 16px;border:0;border-radius:10px;background:var(--accent);color:#1a0d08;font-weight:700;cursor:pointer}.hint{margin:16px 0 0;font-size:13px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}button.secondary{background:#243049;color:var(--text)}button.ghost{margin-top:12px;background:transparent;color:var(--muted);border:1px solid var(--line)}.error{margin:12px 0 0;color:#ff8b7a;font-size:13px}.lobby-character{position:relative;z-index:1;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;min-width:0;min-height:0;padding:16px 14px 14px;border:1px solid var(--line);border-radius:14px;background:radial-gradient(circle at 50% 18%,rgba(255,122,69,.16),transparent 46%),#0d1320;overflow:hidden}.character-stage-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background-color:#0d1320;background-image:var(--stage-backdrop, none);background-size:cover;background-position:center;filter:blur(3px) saturate(1.05);opacity:.62;transform:scale(1.04);transition:opacity .28s ease,filter .28s ease}.lobby-character>:not(.character-stage-backdrop){position:relative;z-index:1}.lobby.is-signed-out .character-stage-backdrop{opacity:.34;filter:blur(4px) grayscale(.2) saturate(.85)}.lobby.is-signed-out .lobby-character{background:radial-gradient(circle at 50% 18%,rgba(147,160,181,.1),transparent 46%),#0b1018}.lobby.is-signed-out .lobby-fighter-canvas{opacity:.42;filter:grayscale(.45)}.character-stage{position:relative;display:flex;flex:1;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;width:100%;min-height:0}.character-platform{width:min(58%,180px);height:16px;border-radius:50%;background:#00000059;filter:blur(1px)}.player-card{position:relative;z-index:5;width:100%;margin-top:4px;padding:18px 14px 14px;border:1px solid var(--line);border-top-width:4px;border-top-color:#ff7a45;border-radius:4px 4px 14px 14px;background:linear-gradient(#1c2638,#111827);box-shadow:0 10px 24px #00000047;pointer-events:auto}.player-card>.character-platform{position:absolute;top:-8px;left:50%;width:min(48%,140px);height:14px;transform:translate(-50%);pointer-events:none}.player-card.is-locked{border-top-color:#3a465c;background:repeating-linear-gradient(-55deg,#0f141e59,#0f141e59 10px,#141a268c 10px,#141a268c 20px),#0e1420}.player-card.is-moves{border-top-color:var(--p2)}.player-card h3{margin:0 0 8px;font-size:16px}.player-card .blurb{margin:0;font-size:13px}.character-name{margin:0 0 4px;font-size:15px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.player-stats{margin:0;color:var(--muted);font-size:13px}#edit-avatar{margin-top:10px}.move-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.move-grid button{padding:8px 6px;background:#243049;color:var(--text);font-size:12px;font-weight:700}.move-grid button.is-active{outline:2px solid var(--accent);outline-offset:1px}.move-grid button[data-demo-move=slap]{background:var(--accent);color:#1a0d08}.locker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;max-height:min(28vh,220px);margin:8px 0 16px;overflow:auto}button.is-hit{animation:option-hit .42s ease}.lobby-options{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;min-width:0;min-height:0;padding:12px 8px 12px 4px;overflow:auto}.lobby-options.is-shattering{visibility:hidden}.lobby-options.is-loading{pointer-events:none;opacity:.55;transition:opacity .2s ease}.lobby.is-loading .character-platform{animation:charge-pulse .7s ease-in-out infinite}.shatter-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;pointer-events:none;overflow:visible}.shatter-shard{position:fixed;overflow:hidden;pointer-events:none;transform-origin:center;animation:shard-fall .7s cubic-bezier(.22,.7,.28,1) forwards}.pane{animation:pane-in .38s ease}.option-stack{display:grid;gap:12px;margin-top:20px}.item-card{padding:12px;border:1px solid var(--line);border-radius:12px;background:#0d1320;text-align:left;color:var(--text)}.item-card strong{display:block;margin-bottom:4px}.item-card span{display:block;color:var(--muted);font-size:12px}.item-card[data-equipped=true]{border-color:var(--accent)}@keyframes option-hit{0%{transform:scale(1)}35%{transform:scale(.94);filter:brightness(1.45)}58%{transform:scale(1.05)}to{transform:none}}@keyframes charge-pulse{0%{transform:scale(1);opacity:.7}to{transform:scale(1.08);opacity:1}}@keyframes pane-in{0%{opacity:0;transform:translateY(-14px) scale(.98)}to{opacity:1;transform:none}}@keyframes shard-fall{0%{transform:translate(0) rotate(0);opacity:1;filter:brightness(1.15)}18%{filter:brightness(1.4)}to{transform:translate(var(--tx),var(--ty)) rotate(var(--rot));opacity:0}}@media(max-width:720px){.panel.lobby{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) minmax(0,auto);width:min(440px,calc(100vw - 24px));min-height:0;max-height:calc(100dvh - 24px);overflow:auto}.lobby-character{min-height:min(280px,42dvh)}}@media(max-height:520px){.panel.lobby{height:calc(100dvh - 16px);min-height:0;max-height:calc(100dvh - 16px);width:min(820px,calc(100vw - 16px));padding:12px;gap:12px;grid-template-columns:minmax(180px,1fr) minmax(200px,1.1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.lobby-character{min-height:0;padding:10px 10px 8px}.player-card{padding:12px 12px 10px}.stage-select{margin-bottom:10px}.stage-select button{min-height:44px;padding:6px 8px}.lobby-options{padding:4px 4px 4px 0;justify-content:flex-start}.hint{display:none}}#touch-controls{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:8;pointer-events:none}.touch-cluster{position:absolute;bottom:max(18px,env(safe-area-inset-bottom,0px));pointer-events:auto}.touch-cluster-left{left:max(14px,env(safe-area-inset-left,0px));display:grid;grid-template-columns:64px 58px 64px;grid-template-rows:58px 64px 58px;gap:6px}.touch-cluster-left .touch-btn[data-action=up]{grid-column:2;grid-row:1;width:58px;min-width:58px;height:58px;font-size:22px}.touch-cluster-left .touch-btn[data-action=left]{grid-column:1;grid-row:2;width:64px;min-width:64px;height:64px}.touch-cluster-left .touch-btn[data-action=right]{grid-column:3;grid-row:2;width:64px;min-width:64px;height:64px}.touch-cluster-left .touch-btn[data-action=down]{grid-column:2;grid-row:3;width:58px;min-width:58px;height:58px;font-size:22px}.touch-cluster-right{right:max(14px,env(safe-area-inset-right,0px));display:grid;justify-items:center;gap:10px}button.touch-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:none;width:72px;min-width:72px;height:72px;padding:0;border-radius:999px;border:1px solid rgba(237,241,247,.28);background:#1218266b;color:#edf1f7b8;font:inherit;font-size:28px;font-weight:700;line-height:1;opacity:.72;box-shadow:inset 0 1px #ffffff14;cursor:default;outline:none;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}button.touch-btn span{pointer-events:none}button.touch-btn-jump,button.touch-btn-slap{font-size:12px;letter-spacing:.12em;text-transform:uppercase}button.touch-btn-jump{width:78px;min-width:78px;height:78px}button.touch-btn-slap{background:#ff7a4538;border-color:#ff7a4561;color:#ffd6c4d9}button.touch-btn.is-pressed{opacity:.95;background:#edf1f738;transform:scale(.96)}button.touch-btn-slap.is-pressed{background:#ff7a457a}html.has-touch #overlay[data-hidden=true]~#touch-controls{display:block}@media(any-pointer:coarse),(hover:none),(max-width:820px){#overlay[data-hidden=true]~#touch-controls{display:block}}@media(prefers-reduced-motion:reduce){.pane,.shatter-shard,.lobby.is-loading .character-platform{animation:none}}.lobby.is-versus{grid-template-columns:minmax(0,1fr)}.lobby.is-versus .lobby-character{min-height:min(420px,70dvh)}.lobby.is-versus .lobby-options{display:none!important}.lobby.is-seeking .character-platform{animation:charge-pulse .7s ease-in-out infinite}.slot-chip{display:inline-flex;align-items:center;gap:8px;margin:0 0 12px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);font-size:13px;font-weight:700;color:var(--muted);background:#ffffff0a}.slot-chip[data-slot="0"]{color:#ff9a5c;border-color:#ff9a5c8c;background:#ff7a451f}.slot-chip[data-slot="1"]{color:#7eb6ff;border-color:#7eb6ff8c;background:#5b9dff24}.player-card.is-waiting{border-top-color:#ff7a45;text-align:center}.player-card.is-waiting .platform-cancel{margin-top:14px;width:100%}.versus-cards[hidden]{display:none!important}.versus-cards{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:stretch;margin:8px 0 4px}.versus-card{padding:10px 12px;border:1px solid var(--line);border-top-width:3px;border-radius:10px;background:#111827}.versus-card[data-slot="0"]{border-top-color:#ff7a45}.versus-card[data-slot="1"]{border-top-color:#5b9dff;text-align:right}.versus-card[data-state=waiting],.versus-card[data-state=pending]{opacity:.72}.versus-card[data-state=waiting] .versus-name,.versus-card[data-state=pending] .versus-name{color:var(--muted);font-weight:600;font-style:italic}.versus-slot{display:block;margin-bottom:4px;color:var(--muted);font-size:11px;letter-spacing:.12em;text-transform:uppercase}.versus-name{font-size:14px}.versus-vs{display:grid;place-items:center;color:var(--muted);font-weight:800;letter-spacing:.08em}.countdown-banner{position:absolute;left:50%;top:18%;z-index:4;transform:translate(-50%);min-width:72px;padding:10px 18px;border-radius:16px;background:#070a12c7;border:1px solid rgba(255,255,255,.16);color:#fff;font-size:42px;font-weight:800;text-align:center;pointer-events:none}.countdown-readout{margin:8px 0 0;color:var(--accent);font-size:28px;font-weight:800;letter-spacing:.08em}.preview-slot-toggle{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 14px}.preview-slot-toggle button{padding:10px 8px;background:#243049;color:var(--text);font-size:12px}.preview-slot-toggle button[data-selected=true]{outline:2px solid var(--accent);outline-offset:1px}.preview-slot-toggle button[data-preview-slot="1"][data-selected=true]{outline-color:#5b9dff}@media(max-width:720px){.lobby.is-versus .lobby-character{min-height:min(360px,58dvh)}}