:root{--bg:#050711;--panel:rgba(12,16,34,.82);--line:rgba(255,255,255,.10);--cyan:#19d8ff;--red:#ff3155;--gold:#ffc533;--muted:#8e9ac2;--white:#f5f8ff}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Arial;color:var(--white);touch-action:none;user-select:none}#game{position:fixed;inset:0;width:100vw;height:100vh;background:#050711}.screen{position:fixed;inset:0;display:none;padding:28px;background:radial-gradient(circle at 15% 30%,rgba(25,216,255,.14),transparent 32%),radial-gradient(circle at 85% 35%,rgba(255,49,85,.15),transparent 34%),linear-gradient(135deg,#050711,#0a0d1f 52%,#050711);z-index:5}.screen.active{display:block}.hidden{display:none!important}.scanlines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.03),rgba(255,255,255,.03) 1px,transparent 1px,transparent 5px);opacity:.35;pointer-events:none}.hero-shell{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(760px,92vw);padding:48px 34px;text-align:center;border:1px solid var(--line);border-radius:34px;background:rgba(8,11,27,.78);box-shadow:0 24px 90px rgba(0,0,0,.55),0 0 60px rgba(25,216,255,.10)}.eyebrow{margin:0 0 10px;color:var(--cyan);font-weight:800;letter-spacing:.22em}.hero-shell h1{font-size:clamp(64px,14vw,148px);line-height:.82;margin:0;background:linear-gradient(90deg,var(--cyan),var(--white),var(--red));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 40px rgba(255,255,255,.12)}.subtitle{font-size:20px;color:var(--muted)}button{border:0;color:var(--white);font:800 13px/1 Inter,system-ui;letter-spacing:.04em;border-radius:16px;background:#151b35;box-shadow:inset 0 0 0 1px var(--line),0 8px 22px rgba(0,0,0,.28);cursor:pointer}button:active{transform:translateY(2px)}.primary,.fight{padding:18px 34px;color:#210b00;background:linear-gradient(180deg,#ffd05e,#ff7b1a);box-shadow:inset 0 -5px 0 rgba(80,25,0,.45),0 18px 34px rgba(255,103,20,.28)}.hint{font-size:13px;color:#6f789c}.select-header{height:76px;display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;gap:16px}.select-header span{justify-self:center;padding:12px 18px;border-radius:999px;background:rgba(255,255,255,.06);color:var(--cyan);font-size:12px;font-weight:900}.select-header span:last-child{color:var(--gold)}.select-header h2{text-align:center;font-size:36px;margin:0;letter-spacing:.05em}.select-grid{height:calc(100vh - 210px);display:grid;grid-template-columns:minmax(240px,330px) minmax(330px,1fr) minmax(240px,330px);gap:22px}.fighter-card,.versus-card,.select-footer{border:1px solid var(--line);border-radius:30px;background:var(--panel);box-shadow:0 20px 60px rgba(0,0,0,.38);overflow:hidden}.fighter-card{position:relative;padding:20px;text-align:center}.fighter-card:before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--accent,var(--cyan))}.role{display:inline-flex;padding:10px 16px;border-radius:999px;background:#060817;color:var(--accent,var(--cyan));font-size:12px;font-weight:900}.portrait{height:52%;margin:18px 0;border-radius:24px;background:radial-gradient(circle at 50% 30%,var(--accent),transparent 35%),linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));position:relative;overflow:hidden}.portrait:after{content:"";position:absolute;inset:15% 28%;border-radius:45% 45% 38% 38%;background:linear-gradient(180deg,rgba(255,255,255,.90),rgba(255,255,255,.28));filter:drop-shadow(0 0 28px var(--accent));clip-path:polygon(50% 0,72% 14%,76% 40%,92% 57%,78% 100%,50% 78%,22% 100%,8% 57%,24% 40%,28% 14%)}.fighter-card h3{font-size:46px;margin:10px 0 4px}.fighter-card p{margin:6px 0;color:var(--muted)}.versus-card{padding:22px;display:grid;grid-template-rows:auto auto 1fr 1fr}.vs{text-align:center;font-size:72px;font-weight:1000;color:var(--gold);line-height:1}.bio{text-align:center;color:var(--muted);padding:0 20px}.bio h3{font-size:28px;color:var(--white);margin:4px 0}.stats{align-self:end;display:grid;gap:9px}.stat{display:grid;grid-template-columns:70px 1fr 30px;align-items:center;gap:10px;color:var(--muted);font-size:12px;font-weight:900}.track{height:12px;border-radius:999px;background:#060817;overflow:hidden}.fill{height:100%;border-radius:999px;background:var(--c)}.moves{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:start}.move{padding:12px;border-radius:16px;background:rgba(255,255,255,.055);border:1px solid var(--line)}.move b{color:var(--gold)}.move small{display:block;color:var(--muted);margin-top:4px}.select-footer{height:98px;margin-top:20px;padding:16px;display:flex;gap:18px;align-items:center}.roster{display:flex;gap:10px;flex:1;flex-wrap:wrap}.roster button,.options button{height:52px;padding:0 16px}.roster button.selected,.stage.selected,.diff.selected{box-shadow:inset 0 0 0 2px var(--gold),0 0 28px rgba(255,197,51,.16);color:var(--gold)}.options{display:flex;gap:9px;align-items:center}.fight{height:58px;font-size:20px}.fight-ui{position:fixed;inset:0;z-index:3;pointer-events:none}.hud{position:absolute;top:20px;width:min(38vw,430px)}.top-left{left:24px}.top-right{right:24px;text-align:right}.name{font-weight:1000;letter-spacing:.08em;margin-bottom:7px;text-shadow:0 2px 10px #000}.bar{height:18px;border-radius:999px;background:rgba(0,0,0,.45);overflow:hidden;border:1px solid var(--line);margin:6px 0}.bar i{display:block;height:100%;width:100%;transition:width .18s ease}.hp i{background:linear-gradient(90deg,#30ff75,#ffe15c,#ff3155)}.ki{height:10px}.ki i{background:linear-gradient(90deg,#19d8ff,#7d5cff)}.guard{height:7px}.guard i{background:linear-gradient(90deg,#ffffff,#72f7ff)}.top-right .bar i{margin-left:auto}.round-box{position:absolute;top:18px;left:50%;transform:translateX(-50%);text-align:center;padding:10px 30px;border-radius:22px;background:rgba(0,0,0,.38);border:1px solid var(--line)}#roundText{font-size:12px;color:var(--gold);font-weight:900}#timer{font-size:34px;font-weight:1000}.toast{position:absolute;left:50%;top:35%;transform:translate(-50%,-50%) scale(.96);font-size:56px;font-weight:1000;color:var(--white);text-shadow:0 0 30px var(--gold),0 3px 20px #000;opacity:0;transition:opacity .18s,transform .18s;letter-spacing:.04em}.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.toast.ko{font-size:clamp(58px,12vw,138px);color:#fff;text-shadow:0 0 20px var(--red),0 0 55px var(--gold),0 12px 40px #000}.toast.round{font-size:clamp(42px,8vw,96px);color:var(--gold)}.toast.small{font-size:32px;color:var(--cyan)}.back{pointer-events:auto;position:absolute;right:18px;bottom:18px;height:42px;padding:0 16px;background:rgba(0,0,0,.35)}.back.restart{right:104px}.back.pause{right:210px}.pips{display:flex;gap:6px;margin:0 0 8px}.top-right .pips{justify-content:flex-end}.pips i{display:block;width:22px;height:8px;border-radius:999px;background:rgba(255,255,255,.13);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}.pips i.on{background:var(--gold);box-shadow:0 0 16px rgba(255,197,51,.7)}.combo{position:absolute;left:42px;top:156px;font-weight:1000;font-size:34px;color:var(--gold);text-shadow:0 0 22px rgba(255,197,51,.7),0 4px 18px #000;opacity:0;transform:translateX(-12px);transition:opacity .12s,transform .12s}.combo.show{opacity:1;transform:translateX(0)}.combo.cpu{left:auto;right:42px;color:var(--red);text-align:right;text-shadow:0 0 22px rgba(255,49,85,.7),0 4px 18px #000}.touch{position:fixed;left:0;right:0;bottom:14px;z-index:4;display:flex;justify-content:space-between;padding:0 18px;pointer-events:none}.touch button{pointer-events:auto;width:58px;height:58px;border-radius:50%;background:rgba(10,13,29,.72);backdrop-filter:blur(8px);font-size:18px}.dpad,.buttons{display:flex;gap:10px;align-items:center}.buttons .super{background:linear-gradient(180deg,#ffd05e,#ff7b1a);color:#210b00}@media (max-width:850px){.combo{top:112px;left:14px;font-size:25px}.combo.cpu{right:14px}.back.pause{right:184px}.back.restart{right:96px}.screen{padding:14px}.select-header{height:58px;grid-template-columns:1fr}.select-header span{display:none}.select-header h2{font-size:24px}.select-grid{height:calc(100vh - 184px);grid-template-columns:1fr 1fr;gap:10px}.versus-card{grid-column:1/3;grid-row:2;padding:12px;grid-template-rows:auto auto}.vs{font-size:38px}.stats,.moves{display:none}.fighter-card{padding:12px;border-radius:22px}.portrait{height:42%}.fighter-card h3{font-size:30px}.select-footer{height:106px;margin-top:10px;padding:10px;display:block}.roster{margin-bottom:8px}.roster button,.options button{height:38px;padding:0 10px;font-size:11px}.options{overflow-x:auto}.hud{width:40vw;top:10px}.top-left{left:10px}.top-right{right:10px}.round-box{top:8px;padding:7px 18px}#timer{font-size:24px}.touch{display:flex}.touch button{width:50px;height:50px}.dpad{max-width:165px;flex-wrap:wrap}.buttons{max-width:185px;flex-wrap:wrap;justify-content:flex-end}.hero-shell{padding:32px 20px}.subtitle{font-size:16px}}