:root{color-scheme:dark;--ink:#10131e;--panel:#1b2030;--lime:#d4ff63;--muted:#929aae}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:#f4f6ff;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background-image:radial-gradient(ellipse at 90% 10%,#233037 0,transparent 45%)}main{max-width:600px;margin:auto;padding:calc(18px + env(safe-area-inset-top)) 22px calc(20px + env(safe-area-inset-bottom))}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}header a{font-weight:900;letter-spacing:1px;color:white;text-decoration:none}header a span{color:var(--lime);margin-left:5px}button{border:1px solid #3a4255;background:#22283a;color:white;border-radius:12px;padding:15px 18px;font:inherit;font-weight:700;cursor:pointer;min-height:48px;touch-action:manipulation}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #8ce4ff;outline-offset:3px}header button{font-size:12px;padding:8px 14px}.eyebrow{font-size:11px;letter-spacing:3px;color:var(--lime);font-weight:800}h1{font-size:clamp(46px,11vw,70px);line-height:1.08;letter-spacing:-3px;margin:22px 0 0;font-style:italic}h1 em{color:var(--lime);font-style:inherit}h1 small{display:block;font-size:10px;letter-spacing:4px;color:var(--muted);margin-top:16px;font-style:normal}.hero{height:220px;position:relative;display:grid;place-items:center;overflow:hidden}.hero-top{width:130px;height:130px;border:16px double #d4ff63;border-radius:32%;transform:rotate(25deg);box-shadow:0 0 65px #d4ff6333,inset 0 0 25px #d4ff6344;display:grid;place-items:center;font-size:70px;color:var(--lime);animation:rotate 10s linear infinite;background:#273334}.orbit{position:absolute;width:300px;height:150px;border:1px solid #4a565a;border-radius:50%;transform:rotate(-20deg)}.hero span{position:absolute;bottom:8px;font-size:8px;letter-spacing:3px;color:var(--muted)}@keyframes rotate{to{transform:rotate(385deg)}}.menu-line{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin:20px 0 14px}.primary{background:var(--lime);color:var(--ink);border:0;width:100%;font-size:17px;display:flex;justify-content:space-between;align-items:center}.wide{width:100%;margin-top:12px}details{margin-top:24px;border-top:1px solid #343b4c;padding-top:18px;font-size:13px;color:var(--muted)}details p{line-height:1.9}.foot{font-size:10px;text-align:center;color:var(--muted);margin-top:24px;line-height:1.7}h2{font-size:36px;margin:18px 0 24px}h3{font-size:14px;margin-top:25px}#models{display:grid;gap:10px}.model{text-align:left;display:flex;justify-content:space-between;align-items:center}.model span{font-size:11px;color:var(--muted)}.selected{border-color:var(--lime);background:#2d3833}#colors{display:flex;gap:14px}#colors button{width:50px;border-radius:50%;border:3px solid transparent}#colors .selected{border-color:white}#stats,#saveStatus{font-size:13px;color:var(--muted);line-height:1.8}#level{color:var(--lime)}.battle-head{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1px}.battle-head button{font-size:12px;padding:8px}.hud{display:flex;align-items:center;gap:16px;margin:24px 0}.hud>div{flex:1;min-width:0}.hud b{font-size:10px;display:block;margin-bottom:8px}.hud strong{font-size:32px;font-variant-numeric:tabular-nums}meter{width:100%;height:12px;display:block}meter::-webkit-meter-bar{background:#303647;border:none}meter::-webkit-meter-optimum-value{background:var(--lime)}.hud>div:last-child meter::-webkit-meter-optimum-value{background:#ff6b89}.arena{position:relative;aspect-ratio:1;touch-action:none}canvas{width:100%;height:100%;display:block;touch-action:none}#announcement{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;font-size:44px;font-weight:900;color:var(--lime);text-shadow:0 3px 25px #000}.controls{display:flex;align-items:center;gap:20px;margin-top:20px}.controls p{flex:1;font-size:12px;color:var(--muted);line-height:1.8}.controls button{width:48%;min-height:66px}#overlay{position:fixed;inset:0;background:#080b16cc;z-index:5;display:grid;place-items:center;padding:24px;backdrop-filter:blur(10px)}#overlay[hidden],[hidden]{display:none!important}.modal{max-width:400px;width:100%;background:var(--panel);border:1px solid #454e5f;border-radius:24px;padding:30px}.modal p{color:var(--muted);line-height:1.8}.modal .primary{margin-top:14px}@media(max-height:740px){header{margin-bottom:18px}.hero{height:170px}.hud{margin:12px 0}.controls{margin-top:8px}.foot{margin-top:14px}}@media(prefers-reduced-motion:reduce){.hero-top{animation:none}}


/* Spectator edition 03 */
main{max-width:540px}h1{font-size:clamp(34px,9vw,60px);letter-spacing:-2px}
.collection-panel{margin-top:20px;border-top:1px solid #343b4c;padding-top:4px}.collection-panel h3{margin:12px 0;font-size:11px;letter-spacing:2px;color:#a8b5bf}#collection{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.crest{border:1px solid #333c4c;border-radius:7px;padding:8px 4px;text-align:center;font-size:10px;color:#697385}.crest.earned{color:#e6ff9c;border-color:#788c44;background:#293329}.bond{color:var(--lime);font-size:12px;line-height:1.7}.skill-strip{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #343b4c;font-size:10px;color:var(--lime)}.skill-strip span:last-child{color:#ff93ac;text-align:right}.controls{margin-top:4px}.controls p{margin:6px 0}.hud b{font-size:9px}.model{gap:12px}.model span{max-width:55%;line-height:1.6;font-size:10px}
@media(max-width:420px){main{padding-left:18px;padding-right:18px}header{margin-bottom:20px}.hero{height:150px}.hero-top{width:100px;height:100px;font-size:50px;border-width:12px}.menu-line{margin-top:12px}.foot{margin-top:12px}.hud{gap:10px}h2{font-size:30px}}