:root{color-scheme:dark;--bg:#101718;--ink:#f0ede2;--muted:#a8afaa;--line:rgba(230,235,221,.19);--accent:#ed713d;--accent-light:#ffa475;--danger:#ed694e;--cyan:#f0ede2;--cyan2:#f0ede2;--mag:#ed713d;--dim:#a8afaa;--disp:Impact,"Arial Narrow","Helvetica Neue",sans-serif;--body:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}
*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--body);-webkit-user-select:none;user-select:none;touch-action:none}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid var(--accent-light);outline-offset:5px}button:disabled{cursor:default}svg{display:block}kbd{font-family:var(--body);font-size:.77em;font-weight:600;white-space:nowrap}.hidden{display:none!important}#wrap{position:fixed;inset:0}canvas{display:block}#vignette{position:fixed;inset:0;z-index:8;pointer-events:none;background:radial-gradient(ellipse at 50% 42%,transparent 30%,rgba(4,9,11,.62) 100%),linear-gradient(180deg,rgba(4,9,11,.28) 0%,transparent 9%,transparent 91%,rgba(4,9,11,.3) 100%)}#scan,#frame{display:none!important}
#mute{padding-inline:16px}body:not([data-state="title"]):not([data-state="paused"]) #mute,body:not([data-state="title"]):not([data-state="paused"]) #soundMenu{display:none}
/* sound menu (2026-09-14): a small sheet under the SOUND button with three switches; effects follow master */
#soundMenu{position:absolute;top:calc(100% + 8px);right:0;width:198px;padding:6px 10px 9px;background:rgba(13,21,23,.96);border:1px solid rgba(231,235,223,.22);box-shadow:0 14px 34px rgba(0,0,0,.5);z-index:46}
#soundMenu[hidden]{display:none}
.system-controls .sound-row{display:flex;align-items:center;justify-content:space-between;width:100%;height:38px;min-width:0;padding:0 2px;background:none;border:0;border-top:1px solid rgba(231,235,223,.1);color:var(--ink);font-size:11px;font-weight:650;letter-spacing:.06em;text-align:left;cursor:pointer}
.system-controls .sound-row:first-child{border-top:0}.system-controls .sound-row:hover{background:none;border-color:rgba(231,235,223,.1);color:#fff}
.sound-row span small{display:block;margin-top:1px;font-size:7px;font-weight:500;letter-spacing:.16em;color:var(--muted)}
.sound-row i{position:relative;width:30px;height:16px;border:1px solid rgba(231,235,223,.35);flex-shrink:0;transition:border-color .15s}
.sound-row i::after{content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;background:#7d8a84;transition:transform .15s,background .15s}
.sound-row[aria-pressed="true"] i{border-color:var(--accent)}.sound-row[aria-pressed="true"] i::after{transform:translateX(14px);background:var(--accent)}
#soundMenu.master-off .sound-row:not([data-sound="master"]){opacity:.42}
.sound-note{margin:6px 0 0;font-size:8px;letter-spacing:.06em;color:var(--muted)}
.system-controls .sound-row:focus-visible{outline:1px solid var(--accent);outline-offset:2px}/* the sound toggle lives on the title only, plus the pause screen so a session can be muted mid-game (2026-09-14) */
.system-controls{position:fixed;z-index:45;top:calc(28px + env(safe-area-inset-top,0px));right:calc(36px + env(safe-area-inset-right,0px));display:flex;align-items:center;gap:7px}.system-controls button{height:33px;min-width:69px;border:1px solid rgba(231,235,223,.22);border-radius:0;background:rgba(13,21,23,.76);color:var(--ink);font-size:10px;font-weight:650;letter-spacing:.1em;transition:background .16s,border-color .16s}.system-controls button:hover{background:#35413f;border-color:var(--ink)}#pauseBtn{padding:0 12px;display:flex;align-items:center;gap:9px}#pauseBtn:first-letter{font-size:15px}
.screen{position:fixed;inset:0;z-index:30}#titleScreen{display:flex;flex-direction:column;padding:28px 36px 20px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;background:linear-gradient(90deg,rgba(9,17,19,.98) 0%,rgba(9,17,19,.91) 26%,rgba(9,17,19,.38) 57%,rgba(9,17,19,.1) 100%),linear-gradient(0deg,rgba(9,17,19,.98) 0%,rgba(9,17,19,.84) 19%,transparent 53%)}.title-header{display:flex;align-items:center;justify-content:space-between;padding-right:calc(150px + env(safe-area-inset-right,0px));min-height:33px;flex-shrink:0}.wordmark{display:flex;align-items:center;gap:11px;font-size:12px;font-weight:750;letter-spacing:.2em}.brand-mark{position:relative;width:19px;height:21px;display:inline-block;border-left:5px solid var(--accent);border-right:5px solid var(--accent);transform:skew(-14deg)}.brand-mark:after{position:absolute;content:"";left:0;right:0;top:8px;height:5px;background:var(--accent)}.edition-note{font-size:9px;letter-spacing:.19em;color:var(--muted)}.title-hero{position:relative;display:flex;align-items:center;flex:1;min-height:0;padding:26px 0 30px}.hero-copy{width:53%;max-width:670px}.eyebrow{display:flex;align-items:center;gap:9px;color:var(--accent-light);font-size:9px;font-weight:700;letter-spacing:.17em}.hero-copy>.eyebrow>span{width:21px;height:1px;background:var(--accent)}.hero-copy>.eyebrow{margin-bottom:17px}.title{font-family:var(--disp);font-size:clamp(96px,min(12vw,16vh),172px);line-height:.805;font-weight:900;letter-spacing:-.025em;color:var(--ink);position:relative;width:max-content}.title>span{display:inline-block}.title>i{position:absolute;right:-.165em;bottom:-.004em;color:var(--accent);font-style:normal}.hero-tagline{margin-top:20px;font-size:17px;font-weight:700;letter-spacing:.12em}.mission-briefing{margin-top:23px;max-width:405px;padding-left:0}.briefing-meta{display:flex;align-items:center;gap:10px;font-size:8px;font-weight:650;letter-spacing:.13em;color:var(--accent-light)}.meta-divider{width:13px;height:1px;background:var(--muted);opacity:.5}.mission-briefing h2{margin-top:8px;font-size:17px;line-height:1.2;font-weight:700;letter-spacing:.05em}.mission-briefing p{font-size:11px;line-height:1.8;color:#afb8b3;margin-top:7px;max-width:365px}.launch-row{display:flex;flex-wrap:wrap;align-items:stretch;gap:13px;margin-top:22px}.launch-row .btn{white-space:nowrap;flex-shrink:0}
.btn[hidden]{display:none}/* the hidden attribute must win over .btn's display (the versus result hides 次のランカーへ and 強化する) */
.btn.go{animation:goPulse 1.5s ease-in-out infinite}@keyframes goPulse{0%,100%{box-shadow:0 0 0 0 rgba(237,113,61,.55)}50%{box-shadow:0 0 0 7px rgba(237,113,61,0)}}
@media(prefers-reduced-motion:reduce){.btn.go{animation:none}}.btn{border:1px solid var(--accent);border-radius:0;background:var(--accent);color:#111b1c;min-height:49px;padding:0 25px;display:inline-flex;align-items:center;justify-content:center;gap:23px;font-size:13px;font-weight:750;letter-spacing:.08em;transition:background .16s,transform .16s,color .16s,border-color .16s;touch-action:manipulation}.btn:hover{background:#fa9367;border-color:#fa9367;transform:translateY(-1px)}.btn:active{transform:translateY(1px)}.btn.ghost{background:transparent;border-color:var(--line);color:var(--ink);font-size:11px;font-weight:550;padding:0 19px;gap:18px}.btn.ghost:hover{background:rgba(235,238,223,.09);border-color:rgba(235,238,223,.5)}.launch-btn{min-width:246px;justify-content:flex-start;padding-left:22px;padding-right:18px;gap:19px}.button-en{font-size:8px;letter-spacing:.13em;opacity:.65;margin-left:auto}.launch-btn svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8}.unit-caption{position:absolute;right:6%;bottom:70px;display:flex;flex-direction:column;align-items:flex-start;color:rgba(241,240,227,.78);pointer-events:none}.unit-caption-rule{width:35px;height:2px;background:var(--accent);margin-bottom:13px}.unit-caption>span:not(.unit-caption-rule){font-size:8px;letter-spacing:.18em}.unit-caption>strong{font-family:var(--disp);font-weight:500;font-size:32px;letter-spacing:.025em;line-height:1.25}.unit-caption>strong>span{color:var(--accent-light);font-size:14px;vertical-align:top;display:inline-block;margin-left:9px;line-height:2}.unit-caption>small{font-size:9px;letter-spacing:.17em;color:#acb6b1;margin-top:4px}
.stage-selection{flex-shrink:0}.section-heading{display:flex;align-items:center;justify-content:space-between;padding:0 0 12px;border-bottom:1px solid var(--line);margin-bottom:10px}.section-heading h2{font-size:9px;font-weight:500;letter-spacing:.07em;color:var(--muted)}.section-heading h2>span{font-size:10px;font-weight:650;letter-spacing:.16em;color:var(--ink);margin-right:13px}.selection-count{font-family:var(--disp);font-size:17px;line-height:1}.selection-count i{font-family:var(--body);font-size:8px;font-style:normal;font-weight:500;letter-spacing:.11em;color:var(--muted);margin-left:5px}.stage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.stage-card{border:1px solid rgba(231,235,223,.19);background:rgba(16,26,28,.8);color:var(--ink);text-align:left;min-width:0;overflow:hidden;position:relative;touch-action:manipulation;transition:border-color .18s,background .18s}.stage-card:after{position:absolute;content:"";left:0;right:0;bottom:0;height:3px;background:transparent;transition:background .18s}.stage-card:hover{border-color:#aab4ac;background:rgba(40,52,51,.92)}.stage-card.selected{border-color:var(--accent);background:rgba(39,43,37,.95)}.stage-card.selected:after{background:var(--accent)}.stage-art{height:clamp(60px,8.3vh,92px);display:block;overflow:hidden;border-bottom:1px solid rgba(231,235,223,.08)}.stage-art svg{width:100%;height:100%;filter:saturate(.65) brightness(.78);transition:filter .22s,transform .5s}.stage-card:hover .stage-art svg{transform:scale(1.04);filter:saturate(.85) brightness(.96)}.stage-card.selected .stage-art svg{filter:saturate(.85) brightness(1.02)}.stage-info{display:flex;align-items:center;gap:12px;padding:12px 13px 10px}.stage-number{align-self:flex-start;font-family:var(--disp);font-size:23px;line-height:1;color:#808f89}.selected .stage-number{color:var(--accent-light)}.stage-titles{min-width:0;display:flex;flex-direction:column;gap:5px}.stage-titles strong{font-family:var(--disp);font-weight:500;letter-spacing:.05em;font-size:18px;line-height:1;white-space:nowrap}.stage-titles>span{font-size:9px;letter-spacing:.1em;color:#b6bfb8}.stage-indicator{margin-left:auto;align-self:flex-start;font-size:16px;line-height:1;color:var(--muted)}.selected .stage-indicator{color:var(--accent-light)}.stage-footer{display:flex;justify-content:flex-end;align-items:center;padding:0 13px 10px;font-size:8px;letter-spacing:.06em;color:#87958e}.stage-status{font-size:7px;letter-spacing:.1em;color:var(--accent-light);opacity:0}.selected .stage-status{opacity:1}.selection-footer{display:flex;align-items:center;gap:22px;padding-top:12px;font-size:8px;letter-spacing:.05em;color:#899990;line-height:1.4}.best-record{font-size:8px;letter-spacing:.1em;color:#bec7bc}.best-record b{margin-left:8px;color:var(--ink);font-weight:500}.amix-credit{margin-left:auto;font-size:7px;letter-spacing:.16em}
/* Combat information stays at the perimeter. */
#hud{position:fixed;inset:0;z-index:10;pointer-events:none;opacity:0;transition:opacity .3s;font-variant-numeric:tabular-nums;text-shadow:0 1px 4px rgba(0,0,0,.55)}#hud.on{opacity:1}.corner{position:absolute}#topleft{top:calc(30px + env(safe-area-inset-top,0px));left:calc(32px + env(safe-area-inset-left,0px));width:285px}.mission-kicker{display:flex;align-items:center;gap:10px;font-size:8px;font-weight:700;letter-spacing:.16em;color:#bbc3bb}.mission-kicker #wave{display:inline-block}.mission-kicker .big{font-size:9px;letter-spacing:.1em;font-family:var(--body)}#missionName{font-family:var(--disp);font-size:24px;font-weight:500;letter-spacing:.06em;margin-top:5px}#objectiveText{font-size:10px;line-height:1.5;margin-top:7px;color:#c4cec4;max-width:285px}.route-track{height:2px;background:rgba(223,235,223,.2);position:relative;max-width:224px;margin-top:16px}#routeFill{height:100%;width:0;background:var(--accent);transition:width .25s}#routeDots{position:absolute;display:flex;justify-content:space-between;inset:-2px 0 auto;height:6px}#routeDots i{display:block;width:6px;height:6px;background:#536760;border:1px solid #a8b6aa;transform:rotate(45deg)}#routeDots i.done,#routeDots i.active{background:var(--accent);border-color:var(--accent-light)}#topright{top:calc(85px + env(safe-area-inset-top,0px));right:calc(36px + env(safe-area-inset-right,0px));text-align:right}#score .label{display:block;font-size:8px;font-weight:600;letter-spacing:.18em;color:#b5c0b8}#score .big{font-family:var(--disp);display:block;font-size:34px;letter-spacing:.03em;margin-top:3px}.kill-stat{margin-top:3px;font-size:9px;color:#bcc7be;letter-spacing:.1em}.kill-stat b{font-size:11px;color:var(--ink);margin-left:8px;font-weight:600}#combo{position:absolute;left:36px;top:calc(190px + env(safe-area-inset-top,0px));opacity:0;transition:opacity .16s}#combo .num{display:inline-block;font-family:var(--disp);font-size:54px;line-height:1;color:var(--ink)}#combo .x{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.12em;margin-left:8px;color:#c9d1c5}#combo.t2 .num,#combo.t2 .x{color:#edb779}#combo.t3 .num,#combo.t3 .x{color:var(--accent-light)}#comboMove{display:block;font-size:9px;letter-spacing:.12em;color:var(--accent-light);margin-top:5px}#bars{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom,0px));left:calc(32px + env(safe-area-inset-left,0px));width:280px}.armor-heading{display:flex;align-items:baseline;justify-content:space-between}.barlab{font-size:8px;font-weight:650;letter-spacing:.16em;color:#c1cdc3}.armor-heading b{font-family:var(--disp);font-size:27px;font-weight:500}.armor-heading small{font-size:9px;color:#b0bfb4}.bar{height:4px;margin-top:6px;background:rgba(8,18,20,.85);overflow:hidden;position:relative}.bar>i{display:block;height:100%;width:100%;transition:width .1s linear}.armor-bar{height:7px;margin-top:3px;background:rgba(7,17,20,.9)}.armor-bar:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),rgba(9,21,24,.65) calc(10% - 1px) 10%)}#hpFill{background:#e3e7d4}#boostFill{background:#91b2b2}#heatFill{background:var(--accent)}.energy-bars{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin-top:12px}.energy-bars .barlab{display:flex;justify-content:space-between;font-size:7px}.energy-bars .barlab>span{font-size:7px;font-weight:400;color:#93a699;letter-spacing:.01em}.combat-guide{position:absolute;right:36px;bottom:30px;display:flex;align-items:center;gap:17px;color:#afbdb2;font-size:9px}.combat-guide span{display:flex;align-items:center;gap:5px}.combat-guide kbd{padding:3px 4px;border:1px solid rgba(229,238,219,.26);color:#dce4d5;font-size:8px}#bossBar{position:absolute;top:calc(32px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);width:min(34vw,440px);display:none}#bossBar .bn{text-align:center;font-size:9px;font-weight:650;letter-spacing:.18em;color:#edc7b2;margin-bottom:7px}#bossBar .bb{height:5px;background:rgba(53,20,16,.8)}#bossFill{display:block;width:100%;height:100%;background:var(--accent);transition:width .15s}
#cross{position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;opacity:.35}#cross i{position:absolute;background:var(--ink)}#cross .v{left:50%;width:1px;height:4px}#cross .vt{top:0}#cross .vb{bottom:0}#cross .h{top:50%;height:1px;width:4px}#cross .hl{left:0}#cross .hr{right:0}#cross .dot{left:50%;top:50%;height:2px;width:2px;margin:-.5px}#reticle{position:absolute;width:76px;height:76px;margin:-38px 0 0 -38px;pointer-events:none;opacity:0;will-change:transform,opacity}#reticle .rSpin{position:absolute;inset:0;will-change:transform}#reticle .rRing{position:absolute;inset:11px;border:1px solid rgba(240,201,161,.18);border-radius:50%}#reticle .rDash{display:none}#reticle b{position:absolute;width:13px;height:13px;border:1.5px solid #f4b87f}#reticle .k1{left:0;top:0;border-bottom:0;border-right:0}#reticle .k2{right:0;top:0;border-bottom:0;border-left:0}#reticle .k3{left:0;bottom:0;border-top:0;border-right:0}#reticle .k4{right:0;bottom:0;border-top:0;border-left:0}#reticle .rFx{position:absolute;inset:0;border:1px solid var(--ink);border-radius:50%;opacity:0}#banner{position:fixed;z-index:20;top:39%;left:0;right:0;pointer-events:none;text-align:center;opacity:0;padding:0 24px}#banner .w{font-family:var(--disp);font-size:clamp(25px,4.8vw,57px);font-weight:500;line-height:1.2;letter-spacing:.075em;color:var(--ink);text-shadow:0 2px 24px rgba(0,0,0,.8)}#banner.warn .w{color:var(--accent-light)}.flash{position:fixed;inset:0;z-index:25;pointer-events:none;background:var(--danger);opacity:0;mix-blend-mode:screen}
/* Menus and results. */
#howModal{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;padding:26px;background:rgba(6,13,16,.83);backdrop-filter:blur(13px);touch-action:pan-y}#howModal.show{display:flex}#howModal .card{position:relative;width:540px;max-width:100%;max-height:calc(100dvh - 52px);overflow-y:auto;padding:34px;background:#172225;border:1px solid rgba(222,231,216,.21);border-top:3px solid var(--accent)}.dialog-heading h2{font-size:25px;font-weight:700;letter-spacing:.04em;margin-top:14px}.dialog-heading p{font-size:11px;line-height:1.9;color:#aab7af;margin-top:12px}.help{margin-top:23px;border-top:1px solid var(--line)}.help-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(227,233,222,.1);font-size:10px}.help-row b{font-size:11px;font-weight:550;color:#e2e7db}.help-row>span{color:#aebdb2}.help kbd,.pause-shell kbd{display:inline-block;padding:3px 5px;border:1px solid rgba(220,232,213,.23);font-size:9px;color:#e8eddf}.tactical-note{margin-top:22px;padding-left:0}.tactical-note>span{color:var(--accent-light);font-size:8px;font-weight:650;letter-spacing:.15em}.tactical-note p{font-size:10px;line-height:1.8;margin-top:6px;color:#b5c1b7}.tactical-note .touch-help{margin-top:9px;color:#90a598}#howClose{margin-top:25px;width:100%}.result-screen{display:flex;align-items:center;justify-content:center;overflow-y:auto;touch-action:pan-y;padding:60px 28px;background:linear-gradient(110deg,rgba(8,17,20,.96),rgba(10,20,24,.85));backdrop-filter:blur(9px)}.result-shell{width:680px;max-width:100%}.result-shell>.eyebrow{margin-bottom:22px}.result-title{font-size:clamp(38px,5.3vw,70px);font-weight:750;line-height:1.2;letter-spacing:-.015em}.result-title>span{color:#a1aea6}.result-subtitle{font-size:12px;color:#a1b3a7;letter-spacing:.05em;margin-top:15px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:32px}.result-stats>div{display:flex;flex-direction:column;gap:7px}.result-stats>div>span{font-size:8px;color:#9dad9f;letter-spacing:.14em}.result-stats b{font-family:var(--disp);font-size:34px;font-weight:500;letter-spacing:.03em}.btnrow{display:flex;flex-direction:column;align-items:stretch;gap:11px;margin-top:31px;max-width:370px}.subrow{display:flex;gap:11px;flex-wrap:wrap}.subrow>.btn{flex:1;padding:0 12px}.clear-heading{display:flex;align-items:center;justify-content:space-between;gap:18px}.result-rank{display:flex;align-items:center;gap:14px}.result-rank>span{font-size:8px;letter-spacing:.13em;color:#a5b7aa}.result-rank>b{font-family:var(--disp);font-size:89px;color:var(--accent-light);font-weight:500;line-height:1}.clear .result-stats{grid-template-columns:1.5fr 1fr 1fr 1fr}.clear .score-result b{color:var(--accent-light)}.pause-shell{width:420px;max-width:100%}.pause-shell h2{font-family:var(--disp);font-size:76px;font-weight:500;letter-spacing:.02em;line-height:1;margin-top:20px}.pause-shell h2>span{display:block;margin-top:15px;font-family:var(--body);font-size:14px;font-weight:550;letter-spacing:.12em}.pause-shell>p{margin-top:23px;font-size:11px;line-height:1.8;color:#a2b3a7}.pause-shell .btnrow{max-width:none}.pause-shell>small{display:block;margin-top:23px;font-size:9px;color:#9cac9f}.pause-shell>small kbd{margin-right:7px}
/* Touch controls. */
#touch{position:fixed;inset:0;z-index:15;display:none;pointer-events:none}#stick{position:absolute;left:0;bottom:0;width:46%;height:58%;pointer-events:auto;touch-action:none}.stick-hint{position:absolute;left:58px;bottom:145px;display:flex;align-items:center;flex-direction:column;gap:11px;opacity:.32}.stick-hint>i{width:56px;height:56px;display:block;border:1px solid #c7d6c5;border-radius:50%;position:relative}.stick-hint>i:after{content:"";position:absolute;width:12px;height:12px;left:21px;top:21px;border:1px solid #c7d6c5;border-radius:50%}.stick-hint>span{font-size:7px;letter-spacing:.2em;color:#c7d6c5}#stickBase{position:absolute;display:none;width:100px;height:100px;margin:-50px 0 0 -50px;border:1px solid rgba(224,235,218,.4);border-radius:50%;background:rgba(14,29,34,.16)}#stickKnob{position:absolute;display:none;width:42px;height:42px;margin:-21px 0 0 -21px;border:1px solid #d1ddcb;border-radius:50%;background:rgba(230,234,210,.27)}.tbtn{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:71px;height:71px;border:1px solid rgba(218,230,211,.45);border-radius:50%;pointer-events:auto;touch-action:none;background:rgba(13,28,34,.57);color:#e4e8da;backdrop-filter:blur(3px)}.tbtn svg{height:25px;width:25px;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;fill:none}.tbtn span{font-size:9px;font-weight:600;letter-spacing:.08em}.tbtn:active,.tbtn.active{background:rgba(234,123,75,.45);border-color:var(--accent-light)}#bSlash{right:calc(23px + env(safe-area-inset-right,0px));bottom:calc(152px + env(safe-area-inset-bottom,0px));width:83px;height:83px;border-color:rgba(235,158,105,.8);color:#ffd0aa;background:rgba(87,51,35,.48)}#bSlash svg{width:29px;height:29px}#bShot{right:calc(106px + env(safe-area-inset-right,0px));bottom:calc(97px + env(safe-area-inset-bottom,0px))}#bBoost{right:calc(26px + env(safe-area-inset-right,0px));bottom:calc(70px + env(safe-area-inset-bottom,0px));width:64px;height:64px}#bBurst{right:calc(28px + env(safe-area-inset-right,0px));bottom:calc(247px + env(safe-area-inset-bottom,0px));width:52px;height:52px;color:#dcb893;border-color:rgba(220,165,109,.32);background:rgba(39,38,31,.62)}#bBurst svg{width:19px;height:19px}#bBurst span{font-size:8px}#bBurst.ready{background:var(--accent);color:#111b1c;border-color:#ffc493}body:has(#touch[style*="block"]) .combat-guide{display:none}
@media(min-width:1600px) and (min-height:850px){#titleScreen{padding:36px 52px 27px}.title-header{min-height:33px}.title-hero{padding:35px 0 43px}.hero-copy>.eyebrow{font-size:10px;margin-bottom:23px}.hero-tagline{font-size:20px;margin-top:25px}.mission-briefing{margin-top:27px}.mission-briefing h2{font-size:20px}.mission-briefing p{font-size:12px}.launch-row{margin-top:26px}.launch-btn{height:56px;min-width:273px}.stage-art{height:100px}.stage-info{padding:15px 16px 13px}.stage-titles strong{font-size:22px}.stage-number{font-size:28px}.stage-titles>span{font-size:10px}.stage-footer{padding:0 16px 14px;font-size:9px}.section-heading{padding-bottom:15px;margin-bottom:13px}.selection-footer{padding-top:15px}.system-controls{right:52px;top:36px}}
@media(max-height:760px) and (min-width:901px){#titleScreen{padding:20px 30px 15px}.title-header{min-height:30px}.title-hero{padding:18px 0 21px}.title{font-size:clamp(90px,15vh,114px)}.hero-copy>.eyebrow{margin-bottom:12px}.hero-tagline{font-size:15px;margin-top:17px}.mission-briefing{margin-top:15px}.mission-briefing h2{font-size:15px}.mission-briefing p{font-size:10px;margin-top:5px;line-height:1.6;max-width:355px}.launch-row{margin-top:17px}.btn{min-height:44px}.stage-art{height:57px}.stage-info{padding:9px 11px 8px}.stage-titles strong{font-size:16px}.stage-titles>span{font-size:8px}.stage-footer{padding:0 11px 8px}.stage-number{font-size:21px}.section-heading{padding-bottom:9px;margin-bottom:8px}.selection-footer{padding-top:9px}.unit-caption{bottom:43px}.system-controls{top:20px;right:30px}}
@media(max-width:1050px){.stage-grid{gap:8px}.stage-info{gap:9px;padding-left:10px;padding-right:10px}.stage-titles strong{font-size:16px}.stage-number{font-size:21px}.stage-footer{padding-left:10px;padding-right:10px}.stage-status{font-size:6px}.unit-caption{right:3%}.hero-copy{width:59%}.edition-note{display:none}.hero-tagline{font-size:16px}.combat-guide{gap:11px;font-size:8px}#bossBar{top:108px;width:38vw}#topleft{width:255px}#objectiveText{font-size:9px}}
@media(max-width:700px){#titleScreen{padding:calc(20px + env(safe-area-inset-top,0px)) 21px calc(16px + env(safe-area-inset-bottom,0px));background:linear-gradient(90deg,rgba(9,17,19,.91),rgba(9,17,19,.42)),linear-gradient(0deg,rgba(9,17,19,.98) 0%,rgba(9,17,19,.93) 32%,rgba(9,17,19,.25) 70%)}.system-controls{top:calc(20px + env(safe-area-inset-top,0px));right:calc(20px + env(safe-area-inset-right,0px));gap:5px}.system-controls button{height:29px;min-width:61px;font-size:8px}.title-header{min-height:29px;padding-right:75px}.wordmark{font-size:10px;letter-spacing:.13em;gap:9px}.brand-mark{width:15px;height:17px;border-width:4px}.brand-mark:after{height:4px;top:6px}.title-hero{flex:1 0 auto;min-height:420px;align-items:center;padding:29px 0 26px}.hero-copy{width:100%;max-width:460px}.hero-copy>.eyebrow{font-size:8px;letter-spacing:.09em;margin-bottom:16px}.title{font-size:clamp(86px,24.5vw,147px);line-height:.81}.hero-tagline{font-size:13px;margin-top:18px;letter-spacing:.075em}.mission-briefing{margin-top:21px;max-width:350px;padding-left:12px}.briefing-meta{font-size:7px;gap:7px}.mission-briefing h2{font-size:15px;margin-top:7px}.mission-briefing p{font-size:10px;line-height:1.75;max-width:307px;margin-top:6px}.launch-row{margin-top:19px;gap:8px}.launch-btn{flex:1;min-width:0;max-width:254px;padding-left:17px;padding-right:15px;gap:12px;min-height:48px;font-size:12px}.button-en{font-size:7px}.launch-row .ghost{font-size:10px;padding:0 13px;gap:10px}.unit-caption{display:none}.section-heading{padding-bottom:10px;margin-bottom:9px}.section-heading h2{font-size:8px}.section-heading h2>span{font-size:8px;letter-spacing:.09em;margin-right:8px}.selection-count{font-size:15px}.selection-count i{font-size:6px}.stage-grid{display:flex;overflow-x:auto;overflow-y:hidden;gap:9px;padding:4px 3px 10px;margin:-4px -3px -3px;scroll-snap-type:x proximity;scroll-padding-left:3px;touch-action:pan-x;scrollbar-width:thin;scrollbar-color:#78877b transparent}.stage-card{flex:0 0 211px;scroll-snap-align:start}.stage-card:focus-visible{outline-offset:1px}.stage-art{height:69px}.stage-info{padding:10px 11px 9px;gap:10px}.stage-number{font-size:22px}.stage-titles strong{font-size:18px}.stage-titles>span{font-size:8px}.stage-footer{padding:0 11px 11px}.stage-status{font-size:6px}.selection-footer{gap:0;justify-content:space-between;padding-top:10px;flex-wrap:wrap;row-gap:7px;font-size:7px}.best-record{font-size:7px}.selection-footer>span:nth-child(2){font-size:7px}.amix-credit{display:none}#topleft{left:16px;top:calc(21px + env(safe-area-inset-top,0px));width:215px}.mission-kicker{font-size:6px;letter-spacing:.08em;gap:7px}.mission-kicker .big{font-size:7px}#missionName{font-size:18px;letter-spacing:.04em;margin-top:4px}#objectiveText{font-size:8px;margin-top:6px;max-width:210px}.route-track{width:174px;margin-top:12px}#hud #topright.corner{position:fixed;top:auto;bottom:calc(100px + env(safe-area-inset-bottom,0px));left:17px;right:auto;width:auto;text-align:left;display:flex;align-items:baseline;gap:12px}#score{display:flex;align-items:baseline;gap:7px}#score .big{font-size:22px;margin-top:0}#score .label{font-size:7px}.kill-stat{margin-top:0}#score .label{font-size:6px}#score .big{font-size:26px}.kill-stat{font-size:7px}.kill-stat b{font-size:9px;margin-left:4px}#combo{left:17px;top:calc(132px + env(safe-area-inset-top,0px))}#combo .num{font-size:37px}#combo .x{font-size:8px;margin-left:6px}#comboMove{font-size:8px}#bossBar{top:calc(110px + env(safe-area-inset-top,0px));width:calc(100vw - 38px)}#bossBar .bn{font-size:7px;margin-bottom:5px}#bossBar .bb{height:4px}#bars{left:17px;bottom:calc(20px + env(safe-area-inset-bottom,0px));width:166px}.armor-heading b{font-size:24px}.armor-heading small{font-size:7px}.barlab{font-size:7px}.energy-bars{gap:11px;margin-top:10px}.energy-bars .barlab{font-size:6px;letter-spacing:.08em}.energy-bars .barlab>span{font-size:6px}.energy-bars .barlab>span:not(#heatValue){display:none}.combat-guide{display:none}#banner{top:39%;padding:0 15px}#banner .w{font-size:26px;letter-spacing:.03em}#pauseBtn{min-width:44px;width:44px;height:44px;padding:0;justify-content:center;font-size:14px}#pauseBtn>span{display:none}.result-screen{padding:74px 24px 35px;align-items:center}.result-shell>.eyebrow{font-size:8px;margin-bottom:20px}.result-title{font-size:40px}.result-subtitle{font-size:10px;line-height:1.7}.result-stats{gap:10px;margin-top:25px;padding:22px 0}.result-stats>div>span{font-size:7px;letter-spacing:.08em}.result-stats b{font-size:27px}.clear .result-stats{grid-template-columns:repeat(2,1fr);row-gap:23px}.result-rank{gap:8px}.result-rank>span{font-size:7px}.result-rank>b{font-size:69px}.clear .result-title{font-size:37px}.btnrow{max-width:none;margin-top:26px;gap:9px}.btnrow .btn{min-height:49px}.subrow{gap:9px}.subrow .btn{font-size:10px}.pause-shell h2{font-size:66px}.pause-shell h2>span{font-size:12px}.pause-shell>p{font-size:10px}#howModal{padding:18px}#howModal .card{padding:24px 20px;max-height:calc(100dvh - 36px)}.dialog-heading h2{font-size:23px}.dialog-heading p{font-size:10px}.help-row{padding:10px 0;gap:8px;font-size:9px}.help-row b{font-size:10px}.help kbd{font-size:8px;padding:3px 4px}.tactical-note p{font-size:9px}.stick-hint{left:54px;bottom:160px}#bSlash{right:17px;bottom:calc(151px + env(safe-area-inset-bottom,0px));width:77px;height:77px}#bShot{right:96px;bottom:calc(97px + env(safe-area-inset-bottom,0px));width:64px;height:64px}#bBoost{right:23px;bottom:calc(72px + env(safe-area-inset-bottom,0px));width:59px;height:59px}#bBurst{right:26px;bottom:calc(239px + env(safe-area-inset-bottom,0px));width:49px;height:49px}.tbtn span{font-size:8px}}
@media(max-width:380px){#titleScreen{padding-left:17px;padding-right:17px}.title-hero{min-height:405px}.hero-tagline{font-size:12px}.title{font-size:25vw}.launch-btn{gap:8px;padding-left:12px;padding-right:10px;font-size:11px}.launch-row .ghost{padding:0 11px;font-size:9px}.button-en{font-size:6px}.launch-btn svg{width:17px}.selection-footer>span:nth-child(2){font-size:6px}.clear .result-title{font-size:32px}.help-row>span{font-size:8px}.help-row b{font-size:9px}.help kbd{font-size:7px}.system-controls{right:17px}}
@media(max-height:530px) and (orientation:landscape){#titleScreen{padding:16px 24px 13px}.title-header{min-height:26px}.system-controls{top:16px;right:24px}.title-hero{flex:0 0 auto;min-height:260px;align-items:flex-start;padding:19px 0 22px}.hero-copy{width:100%;max-width:none;position:relative;padding-left:0}.hero-copy>.eyebrow{font-size:7px;margin-bottom:13px}.title{font-size:91px}.hero-tagline{font-size:11px;margin-top:13px}.mission-briefing{position:absolute;left:45%;top:29px;margin-top:0;max-width:47%;padding-left:12px}.mission-briefing h2{font-size:15px}.mission-briefing p{font-size:10px}.launch-row{position:absolute;left:45%;right:0;top:150px;margin-top:0;gap:9px}.launch-btn{min-width:0;max-width:225px;flex:1;font-size:11px;padding:0 13px;gap:9px;min-height:42px}.launch-row .ghost{font-size:9px;padding:0 12px}.button-en{font-size:6px}.unit-caption{display:none}.stage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible;padding:0;margin:0;gap:8px}.stage-card{width:auto;min-width:0}.stage-art{height:54px}.stage-info{gap:7px;padding:8px}.stage-number{font-size:19px}.stage-titles strong{font-size:14px;letter-spacing:.02em}.stage-titles>span{font-size:7px}.stage-indicator{font-size:12px}.stage-footer{padding:0 8px 9px}.stage-status{display:none}.section-heading{padding-bottom:8px;margin-bottom:8px}.selection-footer{padding-top:10px;font-size:7px}.selection-footer>span:nth-child(2){font-size:7px}.amix-credit{display:block}.screen.result-screen{padding-top:60px;align-items:flex-start}.result-shell{max-width:570px}.result-shell>.eyebrow{margin-bottom:13px}.result-title{font-size:35px}.result-subtitle{margin-top:10px;font-size:10px}.result-stats{margin-top:18px;padding:17px 0}.result-stats b{font-size:28px}.btnrow{margin-top:20px;max-width:340px;gap:8px}.clear .result-stats{grid-template-columns:1.5fr 1fr 1fr 1fr}.clear-heading{max-width:480px}.result-rank>b{font-size:66px}.pause-shell h2{font-size:58px;margin-top:12px}.pause-shell h2>span{display:inline;margin-left:17px;vertical-align:middle}.pause-shell>p{margin-top:16px;font-size:10px}.pause-shell .btnrow{margin-top:21px}.pause-shell>small{margin-top:17px}#topleft{top:17px;left:22px;width:250px}#missionName{font-size:17px}#objectiveText{font-size:8px}.route-track{margin-top:10px;width:175px}#topright{top:59px;right:24px}#score .big{font-size:25px}#combo{top:116px;left:24px}#combo .num{font-size:31px}#combo .x{font-size:8px}#bars{bottom:17px;left:22px;width:205px}.armor-heading b{font-size:23px}.energy-bars{margin-top:8px}#bossBar{top:18px;width:32vw}#bossBar .bn{font-size:7px}#banner{top:38%}#banner .w{font-size:29px}.combat-guide{display:none}.stick-hint{left:82px;bottom:113px}.stick-hint>i{width:48px;height:48px}.stick-hint>i:after{left:17px;top:17px}#bSlash{right:28px;bottom:119px;width:66px;height:66px}#bShot{right:103px;bottom:74px;width:59px;height:59px}#bBoost{right:31px;bottom:49px;width:56px;height:56px}#bBurst{right:107px;bottom:151px;width:47px;height:47px}.tbtn svg{width:22px;height:22px}.tbtn span{font-size:7px}#bSlash svg{height:25px;width:25px}#pauseBtn>span{display:none}#pauseBtn{min-width:30px;padding:0 8px}#howModal .card{max-height:calc(100dvh - 32px)}#howModal{padding:16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* Battle controls remain usable on touch screens and by keyboard. */
#hud{visibility:hidden}#hud.on{visibility:visible}
#stickBase,#stickKnob{position:fixed}
#bossParts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-top:9px;pointer-events:auto}
#bossParts button{position:relative;display:flex;align-items:center;justify-content:center;min-height:44px;min-width:0;padding:7px 6px 10px;border:1px solid rgba(224,198,166,.27);border-radius:0;background:rgba(17,29,31,.89);color:#d9dfd1;font-size:9px;font-weight:600;letter-spacing:.04em;overflow:hidden;touch-action:manipulation;transition:background .16s,border-color .16s,color .16s}
#bossParts button>span{position:relative;z-index:1;text-align:center;line-height:1.35}#bossParts button>i{position:absolute;bottom:0;left:0;display:block;height:3px;width:100%;background:#9aaa99;transition:width .15s}
#bossParts button:hover{background:rgba(68,66,49,.94);border-color:var(--accent-light)}#bossParts button.targeted{border-color:var(--accent);color:#ffe1ba;background:rgba(73,48,35,.92)}#bossParts button.targeted>i{background:var(--accent)}#bossParts button.broken{color:#829186;border-color:rgba(177,195,174,.15);background:rgba(14,24,28,.76)}#bossParts button.broken>span{text-decoration:line-through;text-decoration-color:#87988a}#bossParts button.broken>i{background:#526956}
#bTarget{right:calc(117px + env(safe-area-inset-right,0px));bottom:calc(213px + env(safe-area-inset-bottom,0px));width:50px;height:50px;background:rgba(24,40,43,.69);color:#c4d0c0;border-color:rgba(197,214,190,.38)}#bTarget svg{width:21px;height:21px}#bTarget span{font-size:8px}
#comboMove{position:absolute;left:50%;bottom:calc(112px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:block;width:max-content;max-width:calc(100vw - 48px);padding:7px 12px;margin:0;background:rgba(11,25,29,.77);color:#f5ceab;font-size:10px;font-weight:600;line-height:1.6;letter-spacing:.06em;text-align:center;white-space:normal;text-shadow:0 1px 3px #152021}
#comboMove:empty{display:none}
.startup-error{position:fixed;left:50%;bottom:calc(27px + env(safe-area-inset-bottom,0px));z-index:100;transform:translateX(-50%);width:min(540px,calc(100vw - 40px));padding:19px 22px;border:1px solid #dc8156;background:#242c28;color:#f1d5bc;font-size:12px;line-height:1.8;box-shadow:0 12px 50px rgba(0,0,0,.4);user-select:text;touch-action:pan-y}
.btn:disabled{background:#586159;border-color:#586159;color:#a8b4a4;transform:none}
@media(max-width:700px){#bossParts{gap:6px;margin-top:8px}#bossParts button{min-height:44px;font-size:8px;padding:6px 4px 9px}#bossBar{top:calc(121px + env(safe-area-inset-top,0px))}#hud:has(#bossBar[style*="block"]) #combo{top:calc(204px + env(safe-area-inset-top,0px))}#bTarget{right:calc(102px + env(safe-area-inset-right,0px));bottom:calc(207px + env(safe-area-inset-bottom,0px));width:48px;height:48px}#bTarget svg{width:20px;height:20px}#bTarget span{font-size:7px}#comboMove{bottom:calc(310px + env(safe-area-inset-bottom,0px));max-width:calc(100vw - 44px);padding:6px 10px;font-size:9px;letter-spacing:.03em}.startup-error{bottom:calc(20px + env(safe-area-inset-bottom,0px));padding:15px 17px;font-size:11px}}
@media(max-height:530px) and (orientation:landscape){#bossBar{top:calc(16px + env(safe-area-inset-top,0px));width:32vw}#bossParts{gap:4px;margin-top:6px}#bossParts button{min-height:44px;font-size:7px;padding:5px 3px 8px}#hud:has(#bossBar[style*="block"]) #combo{top:116px}#bTarget{right:calc(178px + env(safe-area-inset-right,0px));bottom:calc(110px + env(safe-area-inset-bottom,0px));width:46px;height:46px}#bTarget span{font-size:7px}#bTarget svg{width:19px;height:19px}#comboMove{bottom:calc(104px + env(safe-area-inset-bottom,0px));max-width:38vw;font-size:8px;padding:5px 8px}.startup-error{bottom:16px;max-width:65vw;padding:12px 17px;font-size:10px}}
@media(pointer:coarse){.system-controls button{min-height:44px;min-width:44px}.system-controls{top:calc(14px + env(safe-area-inset-top,0px))}.system-controls #mute{min-width:61px}.title-header{min-height:38px}.stage-card{touch-action:pan-x}}

html,body{touch-action:auto}#wrap,#touch{touch-action:none}#titleScreen{touch-action:auto}.stage-grid{touch-action:pan-x pan-y}.stage-status{visibility:hidden}.selected .stage-status{visibility:visible}
#midbossBar{position:fixed;left:50%;top:32px;transform:translateX(-50%);width:300px;z-index:11;display:none;pointer-events:none}#midbossBar.on{display:block}#midbossName{display:block;color:#ffe0b8;font-size:11px;font-weight:650;letter-spacing:.09em;text-align:center;text-shadow:0 1px 4px #101d22}#midbossBar>div{height:5px;background:#15212c;margin-top:4px}#midbossFill{height:100%;display:block;background:#ddae77;transition:width .15s}
@media(max-width:700px){#midbossBar{top:123px;width:calc(100vw - 42px)}#midbossName{font-size:9px}}@media(max-height:530px) and (orientation:landscape){#midbossBar{top:21px;width:32vw}#midbossName{font-size:8px}}
/* Campaign previews and the ranged combat readout. */
.stage-card.locked{background:rgba(14,22,24,.92);border-color:rgba(183,198,183,.14)}
/* a locked operation has no picture yet: the card shows a dark monitor (grid, scanlines, NO DATA) instead of the sector art */
.stage-card.locked .stage-art svg{display:none}
.stage-card.locked .stage-art{position:relative;background:repeating-linear-gradient(180deg,rgba(0,0,0,0) 0 2px,rgba(0,0,0,.16) 2px 3px),linear-gradient(90deg,rgba(145,172,153,.09) 1px,rgba(0,0,0,0) 1px) 0 0/22px 22px,linear-gradient(180deg,rgba(145,172,153,.09) 1px,rgba(0,0,0,0) 1px) 0 0/22px 22px,radial-gradient(ellipse at 50% 60%,rgba(70,110,110,.22),rgba(0,0,0,0) 70%) #0e191b}
.stage-card.locked .stage-art:before{content:"NO DATA";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:8px;letter-spacing:.22em;color:#6f8078;font-family:var(--disp);font-weight:600;padding:5px 9px;border:1px solid rgba(145,172,153,.22)}

.stage-card.locked .stage-number,.stage-card.locked .stage-indicator{color:#6e7d74}.stage-card.locked .stage-titles strong{color:#a5afa4}.stage-card.locked .stage-titles>span{color:#75867a}
.stage-card.locked .stage-status{display:inline-flex;align-items:center;gap:5px;visibility:visible;opacity:1;color:#a2aea0;font-size:7px;letter-spacing:.08em}
.stage-card.locked .stage-status:before{content:"";display:block;position:relative;width:6px;height:6px;margin-top:2px;border:1px solid currentColor;box-shadow:0 -3px 0 -1px #172325,0 -3px 0 0 currentColor;opacity:.75}
.stage-card.locked:hover{background:rgba(32,42,41,.94);border-color:#788477}.stage-card.locked:hover .stage-art:before{color:#93a59a}.stage-card.locked.selected{border-color:#b4805e;background:rgba(37,39,32,.95)}.stage-card.locked.selected:after{background:#a37e5d}.stage-card.locked.selected .stage-art svg{filter:saturate(.22) brightness(.63)}
#laserChargeHud{position:absolute;left:50%;bottom:calc(110px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);width:210px;max-width:calc(100vw - 50px);visibility:hidden;opacity:0;pointer-events:none;transition:opacity .12s;color:#f5cc9e;text-align:left;font-variant-numeric:tabular-nums}
#laserChargeHud.charging{visibility:visible;opacity:1}#laserChargeHud>span{display:block;font-size:8px;font-weight:650;line-height:1.5;letter-spacing:.12em;text-shadow:0 1px 4px #091a20}.laser-charge-track{position:relative;height:4px;margin-top:7px;background:rgba(15,26,29,.9);border-bottom:1px solid rgba(200,190,148,.2)}.laser-charge-track>i{display:block;height:100%;width:0;background:#edb579;transition:width .07s linear}#laserChargeHud.ready .laser-charge-track>i{background:#f7e6b1}
#comboMove{bottom:calc(153px + env(safe-area-inset-bottom,0px))}
#missionRadio{position:absolute;left:calc(32px + env(safe-area-inset-left,0px));bottom:calc(148px + env(safe-area-inset-bottom,0px));width:280px;max-width:calc(100vw - 48px);padding:11px 13px 11px 12px;background:linear-gradient(90deg,rgba(12,25,29,.89),rgba(12,25,29,.55));pointer-events:none;visibility:hidden;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s;color:#d4dfd0;text-shadow:0 1px 3px rgba(0,0,0,.55)}
#missionRadio.on{visibility:visible;opacity:1;transform:translateY(0)}#missionRadio>span{display:block;color:#e6bb8e;font-size:8px;font-weight:650;letter-spacing:.14em;line-height:1.5}#missionRadio>p{font-size:11px;font-weight:450;line-height:1.8;margin-top:6px;overflow-wrap:anywhere}
@media(max-width:700px){.stage-card.locked .stage-status{font-size:6px;gap:4px}#laserChargeHud{bottom:calc(310px + env(safe-area-inset-bottom,0px));width:194px}#laserChargeHud>span{font-size:7px;letter-spacing:.09em}.laser-charge-track{margin-top:6px;height:4px}#comboMove{bottom:calc(347px + env(safe-area-inset-bottom,0px))}#missionRadio{left:17px;top:calc(258px + env(safe-area-inset-top,0px));bottom:auto;width:215px;padding:9px 11px 10px}#missionRadio>span{font-size:7px;letter-spacing:.11em}#missionRadio>p{font-size:9px;line-height:1.75;margin-top:5px}}
@media(max-height:530px) and (orientation:landscape){.stage-card.locked .stage-status{display:inline-flex;font-size:5px;letter-spacing:.04em;gap:3px}.stage-card.locked .stage-status:before{width:5px;height:5px}#laserChargeHud{bottom:calc(66px + env(safe-area-inset-bottom,0px));width:180px;max-width:31vw}#laserChargeHud>span{font-size:7px;letter-spacing:.08em}.laser-charge-track{margin-top:5px;height:3px}#comboMove{bottom:calc(104px + env(safe-area-inset-bottom,0px))}#missionRadio{left:calc(22px + env(safe-area-inset-left,0px));top:calc(161px + env(safe-area-inset-top,0px));bottom:auto;width:221px;max-width:29vw;padding:8px 10px}#missionRadio>span{font-size:6px}#missionRadio>p{font-size:9px;line-height:1.65;margin-top:4px}}

.btn:disabled{background:#42483f;border-color:#606b5d;color:#bac1b2;transform:none}

#banner{top:22%;padding:0 20px}#banner .w{display:inline-block;max-width:90vw;background:rgba(15,23,25,.67);padding:10px 18px;font-size:clamp(19px,2.5vw,34px);line-height:1.3}#bSlash.melee-mode{border-color:#a0e3ca;color:#d6fff1;background:rgba(27,67,58,.85)}

.banner-en{display:block;font-family:var(--disp);font-size:1em;letter-spacing:.07em}.banner-ja{display:block;font-family:var(--body);font-size:.36em;font-weight:550;letter-spacing:.14em;margin-top:7px}#banner .w{padding:11px 22px 13px}#banner.warn .banner-ja{color:#f0d6b5}

/* Information is composed with type, spacing and quiet rules. */
.mission-briefing{padding-left:0}.tactical-note{border-top:1px solid var(--line);padding-top:15px}#comboMove{background:none;text-shadow:0 2px 4px #101b1e,0 0 12px #101b1e}#missionRadio{padding:11px 0;background:none}#missionRadio>span{display:block;padding-bottom:7px;border-bottom:1px solid rgba(211,222,207,.3)}#missionRadio>p{text-shadow:0 2px 3px #111b1e,0 0 12px #111b1e}#banner .w{background:none;text-shadow:0 2px 4px #121d1f,0 0 20px #121d1f}#howModal .card{border-top-width:1px}#bShot.ready{border-color:#f0bd80;color:#ffddb3;box-shadow:0 0 0 3px rgba(226,174,111,.16)}
@media(pointer:coarse){.stage-card,.stage-grid{touch-action:pan-x pan-y}.system-controls button{min-height:44px}}
@media(pointer:coarse) and (max-height:530px) and (orientation:landscape){.launch-row .btn{min-height:44px}}
@media(max-width:700px) and (orientation:portrait){#banner{top:calc(220px + env(safe-area-inset-top,0px))}}

#cinematicOverlay{position:fixed;inset:0;z-index:22;pointer-events:none;visibility:hidden}.cinematic #cinematicOverlay{visibility:visible}.cinematic-letterbox{position:absolute;left:0;right:0;height:8vh;background:#080c0d;transform:scaleY(0);transition:transform .25s}.cinematic-letterbox.top{top:0;transform-origin:top}.cinematic-letterbox.bottom{bottom:0;transform-origin:bottom}.cinematic .cinematic-letterbox{transform:scaleY(1)}.cinematic #hud,.cinematic #touch,.cinematic #banner,.cinematic #midbossBar{visibility:hidden}#cineTitle{position:absolute;left:7%;bottom:14%;color:#f0e8d8;text-shadow:0 2px 4px #101b1e,0 0 20px #101b1e;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s}#cineTitle.on{opacity:1;transform:translateY(0)}#cineTitle small{display:block;font-size:9px;letter-spacing:.17em;margin-bottom:12px;color:#dfbb94}#cineTitle strong{display:block;font-family:var(--disp);font-size:clamp(38px,5.6vw,84px);line-height:1;letter-spacing:.05em;font-weight:500}#cineTitle>span{display:block;font-size:13px;letter-spacing:.25em;margin-top:12px}#skipCine{position:absolute;right:5%;bottom:2vh;min-height:44px;padding:8px 10px;border:0;background:none;color:#cbd4c8;font-size:10px;letter-spacing:.16em;pointer-events:auto}#skipCine[hidden]{display:none}#skipCine{transition:opacity .3s}#skipCine.wait{opacity:0;pointer-events:none}#skipCine>span{font-size:8px;letter-spacing:.05em;margin-left:9px}
@media(max-width:700px){#cineTitle{left:7%;bottom:18%}#cineTitle strong{font-size:clamp(35px,9vw,57px)}#cineTitle small{font-size:7px;letter-spacing:.08em}#cineTitle>span{font-size:11px}.cinematic-letterbox{height:9vh}}

.cinematic #missionRadio{visibility:hidden!important}#heatFill{background:#9daea0}.heat-warning #heatFill{background:#dfa160}.overheated #heatFill{background:#ec694e}.overheated #heatValue{color:#ff997a}.tbtn.overheated{color:#b18f80;border-color:#b4775a;background:rgba(52,37,31,.8)}

.boss-heading{display:flex;align-items:center;justify-content:space-between;gap:9px}.boss-heading .bn{margin:0!important}#bossHpValue{font-size:10px;font-variant-numeric:tabular-nums;letter-spacing:.04em;white-space:nowrap;color:#f0deca}#midbossHpValue{display:block;text-align:right;line-height:1.1;margin-top:3px;font-size:10px;color:#ebdcc7;font-variant-numeric:tabular-nums}#midbossName{font-size:10px}.boss-heading+#bossParts{margin-top:7px}@media(max-width:700px){#bossHpValue,#midbossHpValue{font-size:9px}}

#bossBar .bn>span{display:block;font-family:var(--disp);font-size:15px;letter-spacing:.09em}#bossBar .bn>small{display:block;font-size:8px;letter-spacing:.1em;margin-top:3px;color:#bfc6b8}@media(max-width:700px){#bossBar .bn>span{font-size:13px}#bossBar .bn>small{font-size:7px}}

#signalLoss{position:fixed;inset:0;z-index:24;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#080e10;color:#d8c6b9;opacity:0;pointer-events:none}#signalLoss strong{font-family:var(--disp);font-size:clamp(28px,5vw,58px);font-weight:500;letter-spacing:.12em}#signalLoss span{font-size:11px;letter-spacing:.2em;margin-top:12px}.signal-loss #wrap{animation:signalTear .15s steps(2) 3;filter:saturate(.2)}.signal-loss #signalLoss{background:repeating-linear-gradient(0deg,#080e10 0px,#080e10 3px,#101819 4px,#080e10 5px)}@keyframes signalTear{0%,100%{transform:translateX(0)}25%{transform:translateX(4px)}60%{transform:translateX(-6px)}80%{transform:translateX(2px)}}@media(prefers-reduced-motion:reduce){.signal-loss #wrap{animation:none}}

body[data-state="play"] #hud{z-index:16}

/* ---- boost rush, perfect evade, lock feedback, HARD toggle, boot-up (2026-09) ---- */
#speedLines{position:fixed;inset:0;z-index:9;pointer-events:none;opacity:0;transition:opacity .14s;mix-blend-mode:screen;background:repeating-conic-gradient(from 3deg at 50% 50%,rgba(255,255,255,0) 0deg,rgba(255,255,255,0) 8.2deg,rgba(235,247,255,.42) 8.45deg,rgba(255,255,255,0) 8.7deg);-webkit-mask:radial-gradient(ellipse at 50% 50%,transparent 42%,#000 86%);mask:radial-gradient(ellipse at 50% 50%,transparent 42%,#000 86%)}
#evadeCall{position:absolute;left:50%;top:40%;transform:translate(-50%,-100%);opacity:0;pointer-events:none;text-align:center;color:#eafcff;text-shadow:0 0 14px rgba(120,220,255,.9),0 2px 4px #06161a}
#evadeCall b{display:block;font-family:var(--disp);font-size:clamp(22px,3.2vw,40px);letter-spacing:.14em;line-height:1}
#evadeCall span{display:block;font-size:9px;letter-spacing:.2em;margin-top:6px;color:#bff1ff}
#evadeCall.on{animation:evadeCall .9s cubic-bezier(.2,.9,.2,1) both}
@keyframes evadeCall{0%{opacity:0;transform:translate(-50%,-100%) scale(1.9)}12%{opacity:1;transform:translate(-50%,-100%) scale(1)}70%{opacity:1;transform:translate(-50%,-118%) scale(1)}100%{opacity:0;transform:translate(-50%,-135%) scale(1.04)}}
#reticle b{border-width:2px}
#reticle .rRing{border:1px dashed rgba(255,200,160,.5);animation:retSpin 6s linear infinite}
@keyframes retSpin{to{transform:rotate(360deg)}}
#reticle .rFx{border-width:2px;border-color:#ffd9b8}
.heading-tools{display:flex;align-items:center;gap:14px}
.hard-toggle{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:5px 11px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted);font-family:var(--body);font-size:10px;font-weight:700;letter-spacing:.14em;cursor:pointer}
.hard-toggle small{font-size:9px;font-weight:500;letter-spacing:.05em}
.hard-toggle[aria-pressed="true"]{border-color:var(--accent);background:rgba(237,113,61,.18);color:#ffd2b3}
.hard-toggle[hidden]{display:none}
body.hard #missionName:after{content:" / HARD";color:var(--accent-light);font-size:.62em;letter-spacing:.14em}
#hud.boot .bar i{animation:hudBoot 1s cubic-bezier(.2,.8,.2,1) both;animation-delay:.35s}
#hud.boot #topleft,#hud.boot #topright,#hud.boot #bars,#hud.boot .combat-guide{animation:hudIn .62s cubic-bezier(.2,.9,.2,1) both,hudFlicker .5s steps(2,end) both}
#hud.boot #topright{animation-delay:.14s}#hud.boot #bars{animation-delay:.3s}#hud.boot .combat-guide{animation-delay:.42s}
#hud.boot .corner{position:relative}
#hud.boot .corner:after{content:"";position:absolute;left:-6px;right:-6px;top:-4px;bottom:-4px;border:1px solid rgba(240,237,226,.55);pointer-events:none;animation:hudFrame .9s ease-out both}
#hud.boot #topright:after{animation-delay:.14s}
#hud.boot:before{content:"";position:fixed;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,rgba(240,237,226,.75),transparent);animation:hudScan .75s cubic-bezier(.2,.8,.2,1) both;pointer-events:none}
@keyframes hudBoot{from{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
@keyframes hudIn{from{opacity:0;clip-path:inset(0 100% 0 0);transform:translateX(-10px)}60%{clip-path:inset(0 0 0 0)}to{opacity:1;clip-path:inset(0 0 0 0);transform:none}}
@keyframes hudFlicker{0%{opacity:.2}25%{opacity:.9}50%{opacity:.35}75%{opacity:1}100%{opacity:1}}
@keyframes hudFrame{0%{opacity:0;transform:scale(1.06)}30%{opacity:1}100%{opacity:0;transform:scale(1)}}
@keyframes hudScan{from{transform:translateY(0);opacity:1}to{transform:translateY(100vh);opacity:0}}
#bossBar.reveal button{animation:partIn .42s cubic-bezier(.2,.9,.2,1) both}
#bossBar.reveal button:nth-child(2){animation-delay:.16s}#bossBar.reveal button:nth-child(3){animation-delay:.32s}#bossBar.reveal button:nth-child(4){animation-delay:.48s}
@keyframes partIn{0%{opacity:0;transform:translateY(8px);border-color:#ffe1ba;background:rgba(237,113,61,.5)}60%{opacity:1;border-color:#ffe1ba;background:rgba(237,113,61,.35)}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){#speedLines{display:none}#evadeCall.on{animation-duration:.5s}#reticle .rRing{animation:none}#hud.boot .bar i,#hud.boot #topleft,#hud.boot #topright,#hud.boot #bars,#hud.boot .combat-guide,#hud.boot .corner:after,#hud.boot:before,#bossBar.reveal button{animation:none}}
/* The lock ring sits on the target, so no fixed center crosshair (2026-09) */
#cross{display:none}
/* No radial speed lines: the camera is third-person, so a first-person
   focus cue reads wrong. The FOV kick and the short blur stay. (2026-09-08) */
#speedLines{display:none}
/* More air above the result buttons */
.result-screen .btnrow{margin-top:44px}
@media (max-width:700px){.result-screen .btnrow{margin-top:34px}}
/* Damage vignette and critical-armor pulse (2026-09-08) */
#hurtVignette{position:fixed;inset:0;z-index:24;pointer-events:none;opacity:0;background:radial-gradient(ellipse farthest-side at 50% 50%,rgba(255,60,80,0) 52%,rgba(255,60,80,.6) 84%,rgba(210,25,55,.95) 100%)}
#lowArmor{position:fixed;inset:0;z-index:23;pointer-events:none;opacity:0;background:radial-gradient(ellipse farthest-side at 50% 50%,rgba(255,50,70,0) 62%,rgba(255,50,70,.55) 100%);transition:opacity .4s}
#lowArmor.on{opacity:1;animation:lowArmorPulse 1.4s ease-in-out infinite}
@keyframes lowArmorPulse{0%,100%{opacity:.35}50%{opacity:.9}}
body[data-state="paused"] #lowArmor,body[data-state="over"] #lowArmor,body[data-state="clear"] #lowArmor{opacity:0;animation:none}
@media (prefers-reduced-motion:reduce){#lowArmor.on{animation:none;opacity:.5}}
/* ARENA mode (2026-09-09) */
.arena-btn small{font-size:9px;letter-spacing:.08em;margin-left:6px;color:var(--muted)}
body.arena .route-track,body.arena .mission-kicker,body.arena .combat-guide{display:none}
body.arena #midbossBar{top:26px;width:340px}
/* #midbossBar>div (the HP bar rule) outranks a bare id, so the gauges row is addressed through its parent; the BOOST/HEAT captions hang 11px above the 3px bars, so 18px leaves a 7px gap under the HP bar. */
#midbossBar>#rivalGauges{display:flex;align-items:center;gap:10px;margin-top:18px;height:auto;background:none}
#midbossBar>#rivalGauges[hidden]{display:none}
#rivalGauges>span{flex:1;position:relative;height:3px;background:rgba(8,18,20,.85)}
#rivalGauges>span small{position:absolute;left:0;top:-11px;font-size:7px;letter-spacing:.14em;color:var(--muted)}
#rivalGauges>span i{display:block;height:100%;background:#9fd9d0;transition:width .08s linear}
#rivalGauges>span:nth-child(2) i{background:#f0a86a}
#rivalGauges.overheated>span:nth-child(2) i{background:#ff5a4a}
#rivalGauges b{font-size:8px;letter-spacing:.14em;color:var(--accent-light);min-width:52px;text-align:right}
/* ARENA lobby and result (2026-09-09) */
.arena-shell{width:720px;max-width:100%}
.arena-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:26px}
.arena-card{display:flex;flex-direction:column;gap:12px;min-height:150px;padding:14px;border:1px solid rgba(231,235,223,.19);background:rgba(16,26,28,.8);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .18s,background .18s}
.arena-card.selected{border-color:var(--accent);background:rgba(39,43,37,.95)}
.arena-card.cleared .arena-card-info b{color:#9fd9d0}
.arena-card{--card-op:1}.arena-card.locked{--card-op:.45;opacity:var(--card-op);cursor:default}
.arena-card:disabled{pointer-events:none}
.arena-swatch{display:block;height:44px;background:linear-gradient(135deg,var(--armor) 0 62%,var(--accent) 62% 70%,var(--armor) 70%)}
.arena-card-info{display:flex;flex-direction:column;gap:5px}
.arena-card-info small{font-size:9px;letter-spacing:.16em;color:var(--accent-light)}
.arena-card-info strong{font-family:var(--disp);font-size:22px;font-weight:500;letter-spacing:.05em}
.arena-card-info em{font-style:normal;font-size:10px;color:var(--muted)}
.arena-card-info b{font-size:9px;letter-spacing:.14em;color:var(--muted)}
.arena-record{margin-top:16px;font-size:10px;letter-spacing:.12em;color:var(--muted)}
#arenaNextBtn[hidden]{display:none}
@media (max-width:700px){.arena-cards{grid-template-columns:1fr 1fr}.arena-card{min-height:0}}
/* Keep the three launch buttons on one line down to 701px: the hero cannot grow, so a wrapped row would slide under the operation cards. */
@media(max-width:1040px) and (min-width:701px){.launch-row{gap:10px}.launch-btn{min-width:200px;padding-left:16px;padding-right:14px;gap:12px}.launch-row .ghost{padding:0 12px;font-size:10px;gap:9px}}
@media(max-width:860px) and (min-width:701px){.hero-copy{width:60%}.launch-btn{min-width:180px;font-size:12px}.arena-btn small{display:none}}
/* ---- ARENA 第2段（2026-09-09）: ladder lobby, upgrades, pre-fight intro, edge indicator, rewards ---- */
.arena-shell{width:760px}
.arena-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.arena-wallet{display:flex;flex-direction:column;align-items:flex-end;gap:4px;padding:12px 16px;border:1px solid var(--line);min-width:150px}
.arena-wallet small{font-size:9px;letter-spacing:.18em;color:var(--muted)}
.arena-wallet b{font-family:var(--disp);font-size:34px;font-weight:500;letter-spacing:.03em;line-height:1}
.arena-wallet em{font-style:normal;font-size:10px;color:var(--accent-light);letter-spacing:.1em;min-height:12px}
.arena-ladder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:22px}
.arena-card{display:flex;flex-direction:row;align-items:center;gap:12px;min-height:0;padding:10px 12px;--ranker:var(--accent)}
.arena-card:hover:not(:disabled){border-color:rgba(231,235,223,.45)}
.arena-card.selected{border-color:var(--ranker)}
.arena-card.champion.selected{box-shadow:inset 0 0 0 1px var(--ranker)}
.arena-card.locked{--card-op:.42}
.arena-emblem{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:40px;height:40px;color:var(--ranker,var(--accent))}
.arena-emblem svg{width:100%;height:100%;display:block}
.arena-emblem.unknown{color:rgba(240,237,226,.22)}
.arena-emblem.big{width:84px;height:84px}
.arena-emblem.intro{width:112px;height:112px}
.arena-emblem.result{width:64px;height:64px}
.arena-emblem.next{width:48px;height:48px}
.arena-card-info{gap:3px;min-width:0}
.arena-card-info strong{font-size:20px;line-height:1.05}
.arena-focus{display:flex;gap:18px;align-items:center;margin-top:14px;padding:16px 18px;border:1px solid var(--line);background:rgba(12,20,22,.7)}
.arena-focus-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.arena-focus-text small{font-size:9px;letter-spacing:.18em;color:var(--accent-light)}
.arena-focus-text strong{font-family:var(--disp);font-size:34px;font-weight:500;letter-spacing:.05em;line-height:1}
.arena-focus-text p{margin:0;font-size:12px;line-height:1.7;color:#c9d1cb}
.arena-reward-preview{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:6px}
.arena-reward-preview span{display:flex;flex-direction:column;gap:2px}
.arena-reward-preview small{font-size:9px;letter-spacing:.14em;color:var(--muted)}
.arena-reward-preview b{font-family:var(--disp);font-size:20px;font-weight:500;letter-spacing:.03em}
.arena-upgrades{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}
.arena-upgrades-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.arena-upgrades-head small{font-size:9px;letter-spacing:.18em;color:var(--accent-light);font-weight:700}
.arena-upgrades-head em{font-style:normal;font-size:10px;color:var(--muted)}
.arena-upgrade{display:grid;grid-template-columns:110px 96px 1fr auto;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid rgba(230,235,221,.1)}
.arena-upgrade-label{display:flex;flex-direction:column;gap:2px}
.arena-upgrade-label b{font-size:13px;letter-spacing:.06em}
.arena-upgrade-label small{font-size:9px;letter-spacing:.14em;color:var(--muted)}
.arena-pips{display:flex;gap:4px}
.arena-pips i{display:block;width:14px;height:8px;background:rgba(240,237,226,.14)}
.arena-pips i.on{background:var(--accent)}
.arena-upgrade em{font-style:normal;font-size:10px;color:var(--muted);line-height:1.6}
.arena-upgrade .btn.small{min-height:36px;padding:0 14px;font-size:10px;gap:8px;white-space:nowrap}
.arena-upgrade.maxed .btn.small{border-style:dashed}
#arenaIntro{position:fixed;inset:0;z-index:34;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;pointer-events:none;--ranker:var(--accent);background:linear-gradient(90deg,rgba(6,12,14,0) 0%,rgba(6,12,14,.62) 30%,rgba(6,12,14,.62) 70%,rgba(6,12,14,0) 100%)}
#arenaIntro[hidden]{display:none}
#arenaIntro.fight{background:none}
/* versus: the intro card carries no emblem (the generic mark was small and said nothing); the pilot's name and frame stand alone */
body.versus #arenaIntroEmblem{display:none}body.versus .intro-card{padding:22px 40px}
#arenaIntro.fight .intro-card{opacity:0;transform:translateX(40px);transition:opacity .25s,transform .25s}
.intro-card{display:flex;align-items:center;gap:22px;padding:18px 30px;border:1px solid rgba(240,237,226,.35);background:rgba(10,18,20,.86);opacity:0;transform:translateX(60px)}
.intro-card.in{animation:introIn .45s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes introIn{to{opacity:1;transform:none}}
.intro-text{display:flex;flex-direction:column;gap:6px;max-width:420px}
.intro-text small{font-size:10px;letter-spacing:.2em;color:var(--accent-light);font-weight:700}
.intro-text strong{font-family:var(--disp);font-size:56px;font-weight:500;letter-spacing:.05em;line-height:1}
.intro-text em{display:none}
.intro-count{font-family:var(--disp);font-size:120px;font-weight:500;letter-spacing:.06em;color:var(--ink);line-height:1;min-height:120px;opacity:0}
.intro-count.pop{animation:countPop .62s cubic-bezier(.1,.9,.2,1) forwards}
@keyframes countPop{0%{opacity:0;transform:scale(1.9)}18%{opacity:1;transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:scale(.92)}}
#arenaIntro.fight .intro-count{color:var(--accent);font-size:140px}
#arenaEdge{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px;margin-top:6px;font-size:8px;letter-spacing:.16em;color:var(--muted)}
#arenaEdge[hidden]{display:none}
#arenaEdge i{display:block;position:relative;height:5px;background:rgba(240,90,90,.55);overflow:hidden}
#arenaEdge i::before{content:"";position:absolute;inset:0;width:var(--edge,50%);background:#f0ede2;transition:width .25s}
#arenaEdge b{min-width:30px;text-align:right;color:var(--ink);font-size:9px}
#arenaEdge b[data-edge="up"]{color:#bff2e2}#arenaEdge b[data-edge="down"]{color:#ff9d8a}
.arena-rewards{margin-top:20px;display:flex;flex-direction:column;gap:2px}
.reward{display:flex;justify-content:space-between;align-items:baseline;padding:7px 0;border-bottom:1px solid rgba(230,235,221,.1);opacity:0;animation:rewardIn .35s ease-out forwards}
@keyframes rewardIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.reward span{font-size:11px;letter-spacing:.08em;color:#c9d1cb}
.reward b{font-family:var(--disp);font-size:22px;font-weight:500;letter-spacing:.03em}
.reward.total{border-bottom:0;border-top:1px solid var(--line);margin-top:4px}
.reward.total b{font-size:34px;color:var(--accent-light)}
.reward.wallet span{color:var(--muted)}.reward.wallet b{font-size:26px}
.arena-next{display:flex;align-items:center;gap:16px;margin-top:18px;padding:14px 16px;border:1px solid var(--line);background:rgba(12,20,22,.7)}
.arena-next>div{display:flex;flex-direction:column;gap:4px}
.arena-next small{font-size:9px;letter-spacing:.18em;color:var(--accent-light);font-weight:700}
.arena-next strong{font-family:var(--disp);font-size:26px;font-weight:500;letter-spacing:.05em;line-height:1}
.arena-next em{font-style:normal;font-size:11px;color:#c9d1cb;line-height:1.6}
@media (max-width:700px){.arena-head{flex-direction:column}.arena-wallet{min-width:0;width:100%;flex-direction:row;align-items:baseline;gap:12px}.arena-ladder{gap:6px}.arena-card{flex-direction:column;align-items:flex-start;gap:8px;padding:9px}.arena-emblem{width:30px;height:30px}.arena-card-info strong{font-size:16px}.arena-focus{flex-direction:column}.arena-upgrade{grid-template-columns:1fr auto;grid-template-areas:"label btn" "pips btn" "desc desc"}.arena-upgrade-label{grid-area:label}.arena-pips{grid-area:pips}.arena-upgrade em{grid-area:desc}.arena-upgrade .btn.small{grid-area:btn}.intro-card{margin:0 16px}.intro-text strong{font-size:38px}.arena-emblem.intro{width:72px;height:72px}.intro-count{font-size:84px;min-height:84px}#arenaIntro.fight .intro-count{font-size:96px}}
/* ARENA on phones: the rival bar and edge row sit below the mission name, narrower than the screen so SCORE stays clear. */
@media(max-width:700px){body.arena #midbossBar{top:64px;width:min(300px,64vw)}body.arena #objectiveText{display:none}}
/* ARENA screens can be taller than the viewport: start at the top instead of centring (a centred flex child clips its top). */
.screen.arena-lobby,.screen.arena-result{align-items:flex-start;padding-top:56px}
/* Phones: keep the archive link clear of the SOUND ON button; in landscape keep STRIKE off the briefing column. */
@media(max-width:700px){.title-header{padding-right:calc(114px + env(safe-area-inset-right,0px))}}
@media(max-height:530px) and (orientation:landscape){.title{font-size:84px}.mission-briefing,.launch-row{left:52%}.mission-briefing{max-width:46%}}
/* Title footer: creator credit above navigation; keep the existing type size. */
.selection-footer .amix-credit{display:block;flex-shrink:0}
.selection-footer .credit-creator,.selection-footer .credit-nav{display:block;white-space:nowrap}
.selection-footer .credit-nav{margin-top:4px}
.amix-credit a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(240,237,226,.28);padding-bottom:1px}
.amix-credit a:hover{color:var(--ink);border-bottom-color:var(--accent)}
@media(max-width:700px){.amix-credit{display:block;width:100%;margin-left:0;font-size:8px;letter-spacing:.06em}}
body.bg .screen,body.bg #hud,body.bg .system-controls,body.bg #touch,body.bg #banner,body.bg #midbossBar,body.bg #bossBar,body.bg #missionRadio,body.bg #reticle,body.bg #pauseBtn,body.bg #howModal,body.bg #archiveModal,body.bg #frame,body.bg #arenaIntro{display:none!important}
/* ---- ARENA versus (2026-09-10): setup, room lobby, consent ---- */
.vs-row{display:flex;align-items:center;gap:12px;margin-top:22px}
.vs-label{font-size:10px;letter-spacing:.18em;color:var(--accent-light);font-weight:700}
#vsName,#vsCode{min-height:44px;padding:0 14px;border:1px solid var(--line);background:rgba(9,17,19,.6);color:var(--ink);font-size:14px;letter-spacing:.06em;font-family:var(--body)}
#vsCode{width:120px;text-transform:uppercase;letter-spacing:.24em;font-family:var(--disp);font-size:18px}
.vs-frames{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px}
/* Frame choice in the briefing (campaign) and the arena lobby: the same cards as versus, plus each frame's own upgrade levels. */
.briefing-frames-head{display:flex;align-items:baseline;gap:10px;margin-top:22px;font-size:9px;letter-spacing:.16em;color:var(--accent-light)}.briefing-frames-head small{font-size:9px;letter-spacing:.06em;color:var(--muted)}
.briefing-frames{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:8px 0 18px}.frame-pick{padding:11px 12px;gap:6px}
.frame-bars{display:flex;flex-direction:column;gap:5px;margin-top:4px}.frame-bar{display:grid;grid-template-columns:26px 1fr;align-items:center;gap:8px}.frame-bar b{font-size:8.5px;font-weight:600;letter-spacing:.08em;color:#aebdb2}.frame-bar i{display:block;height:5px;background:rgba(240,237,226,.12)}.frame-bar u{display:block;height:100%;background:var(--ranker);text-decoration:none}
.arena-frames{display:flex;gap:6px;margin:10px 0 6px}.arena-frame{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 12px;border:1px solid var(--line);background:rgba(16,26,28,.6);color:var(--ink);text-align:left;cursor:pointer;--ranker:var(--accent)}.arena-frame b{font-size:12px;font-weight:650}.arena-frame small{font-size:8px;letter-spacing:.12em;color:var(--muted)}.arena-frame.selected{border-color:var(--ranker);background:rgba(39,43,37,.95)}.arena-frame.selected small{color:var(--ranker)}
@media(max-width:700px){.briefing-frames{gap:6px}.frame-pick{padding:9px 8px}.frame-pick strong{font-size:11px;letter-spacing:0;white-space:nowrap}.frame-bar{grid-template-columns:22px 1fr;gap:5px}.frame-bar b{font-size:7.5px}.arena-frames{flex-direction:column}}
.vs-frame{display:flex;flex-direction:column;gap:6px;padding:14px;border:1px solid var(--line);background:rgba(16,26,28,.8);color:var(--ink);text-align:left;cursor:pointer;--ranker:var(--accent)}
.vs-frame.selected{border-color:var(--ranker);background:rgba(39,43,37,.95)}
.vs-frame small{font-size:9px;letter-spacing:.18em;color:var(--ranker)}
.vs-frame strong{font-size:16px;letter-spacing:.04em}
.vs-frame em{font-style:normal;font-size:11px;color:var(--muted);line-height:1.6}
.vs-stats{display:flex;gap:10px;margin-top:4px}
.vs-stats i{font-style:normal;font-size:9px;letter-spacing:.1em;color:#c9d1cb}
.vs-frame.small{padding:9px 12px;gap:2px}
.vs-frames-lobby{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.vs-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:18px}
.vs-join{display:flex;gap:8px;align-items:center}
.vs-status{margin:12px 0 0;font-size:11px;letter-spacing:.06em;color:var(--accent-light);min-height:16px;overflow-wrap:anywhere}
.vs-code-box{display:flex;align-items:center;gap:16px;margin-top:22px;padding:14px 18px;border:1px solid var(--line);background:rgba(12,20,22,.7)}
.vs-code-box small{font-size:9px;letter-spacing:.18em;color:var(--muted)}
.vs-code-box b{font-family:var(--disp);font-size:36px;letter-spacing:.22em;font-weight:500}
.vs-players{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.vs-player{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid var(--line);background:rgba(16,26,28,.8);--ranker:var(--accent)}
.vs-player small{font-size:9px;letter-spacing:.18em;color:var(--ranker)}
.vs-player strong{font-family:var(--disp);font-size:22px;font-weight:500;letter-spacing:.05em}
.vs-player em{font-style:normal;font-size:11px;color:var(--muted)}
.vs-player b{font-size:9px;letter-spacing:.14em;color:#bff2e2}
#vsConsent{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(6,13,16,.86)}
#vsConsent[hidden]{display:none}
.vs-consent-card{width:min(560px,100%);padding:28px 30px;border:1px solid var(--line);background:#152225;color:var(--ink)}
.vs-consent-card h3{margin:0 0 10px;font-size:20px}
.vs-consent-card p{margin:0;font-size:12px;line-height:1.8;color:#c9d1cb}
.vs-check{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:12px}
.vs-check input{width:18px;height:18px}
@media (max-width:700px){.vs-frames,.vs-frames-lobby{grid-template-columns:1fr}.vs-players{grid-template-columns:1fr}.vs-code-box{flex-wrap:wrap}.vs-code-box b{font-size:28px}}
body.versus #pauseBtn{display:none}
/* Monitor feed: the title's live scene is watched through a screen. Scanlines, corner falloff and a thin
   tear that crosses now and then; sits over the canvas and under the title sheet. Off outside the title. */
#feedVeil{position:fixed;inset:0;z-index:20;pointer-events:none;opacity:0;transition:opacity .6s;background:repeating-linear-gradient(180deg,rgba(0,0,0,.085) 0 1px,transparent 1px 3px),radial-gradient(ellipse 78% 68% at 50% 50%,transparent 60%,rgba(4,9,11,.5) 100%)}
body[data-state="title"] #feedVeil{opacity:1}
/* a locked operation selected: the feed is a weak signal (heavier scanlines, darker edges, the tear passes more often; grain and colour are handled in the shader) */
body[data-intel="none"] #feedVeil{background:repeating-linear-gradient(180deg,rgba(0,0,0,.15) 0 1px,transparent 1px 3px),radial-gradient(ellipse 72% 62% at 50% 50%,transparent 52%,rgba(4,9,11,.66) 100%)}
body[data-intel="none"] #feedVeil::after{animation-duration:4.5s}
#feedVeil::after{content:"";position:absolute;left:0;right:0;top:-3%;height:2.2%;background:linear-gradient(180deg,transparent,rgba(190,235,245,.09) 45%,rgba(255,255,255,.14) 50%,rgba(190,235,245,.09) 55%,transparent);opacity:0;animation:feedTear 11s linear infinite}
@keyframes feedTear{0%,86%{opacity:0;top:-3%}87%{opacity:1;top:-3%}96%{opacity:1;top:103%}96.1%,100%{opacity:0;top:103%}}
@media(prefers-reduced-motion:reduce){#feedVeil::after{animation:none}}
/* Arena pause: no campaign retry and no field archive; the sheet offers resume or forfeit. */
body.arena #pauseRetryBtn,body.arena #pauseArchiveBtn{display:none}
/* ---- Interface polish (2026-09-10): screen entrances, title boot, selection sweep, lobby states ---- */
@keyframes screenIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.screen.enter{animation:screenIn .32s cubic-bezier(.2,.7,.2,1) both}
#titleScreen.enter{animation-duration:.2s}
@keyframes riseIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes titleReveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -10% 0 0)}}
/* Logo (img/zone-logo.svg) in place of the text: same responsive box (1.61em = two lines of the old type). Entrance = wire draw, then fill. */
.title.has-logo{animation:none!important;clip-path:none}
.title.has-logo .title-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.title-logo{display:block;height:1.61em;width:auto;max-width:100%;overflow:visible}
@media(max-width:700px){.title-logo{width:100%;height:auto}}
.title-logo path{fill:#fff;stroke:#fff;stroke-width:.5;stroke-linejoin:round;stroke-linecap:round;fill-opacity:1;stroke-opacity:0;paint-order:stroke}   /* the logo is pure white, not the warm ink of the UI (owner, 2026-09-14) */
.title-logo path.dot{fill:var(--accent);stroke:var(--accent)}
/* logo-wait: injected while the boot card is still up, invisible until bootDone() starts the entrance (logo-in is dropped again 2.6 s after each entrance, so it cannot be the gate) */
.title.logo-wait .title-logo path{fill-opacity:0;stroke-opacity:0}
.title.logo-in .title-logo path{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);fill-opacity:0;stroke-opacity:1;animation:logoWire .8s cubic-bezier(.35,.6,.2,1) both,logoSolid .5s ease-out both;animation-delay:calc(.1s + var(--i)*.055s),calc(.78s + var(--i)*.055s)}
.title.logo-in .title-logo path.dot{animation-delay:calc(.1s + var(--i)*.055s),calc(.86s + var(--i)*.055s)}
@keyframes logoWire{0%{stroke-dashoffset:var(--len);filter:drop-shadow(0 0 3px rgba(190,240,255,.85))}70%{filter:drop-shadow(0 0 3px rgba(190,240,255,.85))}100%{stroke-dashoffset:0;filter:drop-shadow(0 0 1px rgba(190,240,255,.5))}}
@keyframes logoSolid{0%{fill-opacity:0;stroke-opacity:1}45%{fill-opacity:1;stroke-opacity:1;filter:brightness(1.9) drop-shadow(0 0 6px rgba(255,255,255,.6))}100%{fill-opacity:1;stroke-opacity:0;filter:none}}
@media(prefers-reduced-motion:reduce){.title.logo-in .title-logo path{animation:logoSolid .5s ease-out both;animation-delay:0s;stroke-dasharray:none;stroke-dashoffset:0}}
@keyframes dotPop{0%{opacity:0;transform:scale(0)}60%{opacity:1;transform:scale(1.3)}100%{opacity:1;transform:scale(1)}}
@keyframes ruleGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
#titleScreen.boot .title-header{animation:riseIn .5s .05s both}
#titleScreen.boot .title{animation:titleReveal .7s .15s cubic-bezier(.2,.8,.2,1) both}
#titleScreen.boot .title>i{animation:dotPop .4s .85s both}
#titleScreen.boot .hero-tagline{animation:riseIn .5s .55s both}
#titleScreen.boot .mission-briefing{animation:riseIn .5s .68s both}
#titleScreen.boot .launch-row{animation:riseIn .5s .8s both}
#titleScreen.boot .unit-caption{animation:riseIn .6s .9s both}
#titleScreen.boot .unit-caption-rule{transform-origin:left;animation:ruleGrow .5s 1.15s both}
#titleScreen.boot .section-heading{animation:riseIn .45s .6s both}
#titleScreen.boot .stage-card{animation:riseIn .5s .7s both}
#titleScreen.boot .stage-card:nth-child(2){animation-delay:.78s}
#titleScreen.boot .stage-card:nth-child(3){animation-delay:.86s}
#titleScreen.boot .stage-card:nth-child(4){animation-delay:.94s}
#titleScreen.boot .selection-footer{animation:riseIn .5s 1.05s both}
.stage-card{transition:border-color .18s,background .18s,transform .18s}
.stage-card:hover:not(.locked){transform:translateY(-2px)}
.stage-art{position:relative}
@keyframes cardSweep{from{transform:translateX(-130%) skewX(-14deg)}to{transform:translateX(260%) skewX(-14deg)}}
.stage-card.just .stage-art:after{content:"";position:absolute;top:0;bottom:0;left:0;width:42%;background:linear-gradient(90deg,transparent,rgba(255,228,196,.32),transparent);animation:cardSweep .75s ease-out both;pointer-events:none}
@keyframes softBlink{0%,100%{opacity:.3}50%{opacity:1}}
.stage-card.selected:not(.locked) .stage-status:before{content:"";display:inline-block;width:5px;height:5px;margin-right:6px;background:var(--accent);vertical-align:1px;animation:softBlink 1.4s ease-in-out infinite}
.launch-btn svg{transition:transform .2s}.launch-btn:hover svg{transform:translateX(4px)}
.stage-indicator{transition:transform .2s}.stage-card:hover .stage-indicator{transform:translate(2px,-2px)}
/* arena lobby */
@keyframes cardIn{from{opacity:0;transform:translateY(10px)}to{opacity:var(--card-op,1);transform:none}} /* locked cards settle at their dimmed opacity instead of brightening to 1 and dropping when .enter is removed */
#arenaScreen.enter .arena-card{animation:cardIn .45s both}
#arenaScreen.enter .arena-card:nth-child(2){animation-delay:.04s}#arenaScreen.enter .arena-card:nth-child(3){animation-delay:.08s}#arenaScreen.enter .arena-card:nth-child(4){animation-delay:.12s}#arenaScreen.enter .arena-card:nth-child(5){animation-delay:.16s}#arenaScreen.enter .arena-card:nth-child(6){animation-delay:.2s}#arenaScreen.enter .arena-card:nth-child(7){animation-delay:.24s}#arenaScreen.enter .arena-card:nth-child(8){animation-delay:.28s}#arenaScreen.enter .arena-card:nth-child(9){animation-delay:.32s}
.arena-card{transition:border-color .18s,background .18s,transform .18s}
.arena-card:hover:not(:disabled){transform:translateY(-1px)}
.arena-emblem svg{transition:transform .25s}.arena-card:hover:not(:disabled) .arena-emblem svg{transform:scale(1.08)}
@keyframes emblemIn{from{opacity:0;transform:scale(.7) rotate(-6deg)}to{opacity:1;transform:none}}
.arena-focus .arena-emblem.big svg,#arenaIntroEmblem svg{animation:emblemIn .45s cubic-bezier(.2,.8,.2,1) both}
/* versus lobby */
@keyframes attention{0%,100%{border-color:var(--line);background:transparent;color:var(--ink)}50%{border-color:var(--accent-light);background:rgba(237,113,61,.18);color:#ffd9c2}}
.vs-code-box.waiting #vsCopyBtn:not(.copied){animation:attention 1.5s ease-in-out infinite}
#vsCopyBtn.copied{border-color:#9fe8d0;color:#9fe8d0;background:rgba(159,232,208,.08)}
@keyframes codeIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.vs-code-box b i{display:inline-block;font-style:normal;animation:codeIn .35s both;animation-delay:calc(var(--i,0)*.07s)}
.vs-player{position:relative;overflow:hidden;transition:border-color .2s,background .2s}
.vs-player.waiting{border-style:dashed;border-color:rgba(231,235,223,.32);background:rgba(16,26,28,.5)}
.vs-player.waiting strong{display:flex;align-items:center;color:var(--muted);font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.14em}
@keyframes slotScan{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.vs-player.waiting:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(255,164,117,.11) 50%,transparent 100%);animation:slotScan 2.4s linear infinite;pointer-events:none}
.dots{display:inline-flex;gap:3px;margin-left:7px}.dots i{width:4px;height:4px;background:currentColor;opacity:.25;animation:dotBlink 1.2s infinite}.dots i:nth-child(2){animation-delay:.2s}.dots i:nth-child(3){animation-delay:.4s}
@keyframes dotBlink{0%,100%{opacity:.25}40%{opacity:1}}
@keyframes arrive{0%{border-color:#fff;background:rgba(255,255,255,.22)}100%{border-color:var(--line);background:rgba(16,26,28,.8)}}
.vs-player.arrived{animation:arrive 1s ease-out both}
.vs-player.ready b:before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;background:#9fe8d0;vertical-align:0}
.vs-status.live:before{content:"";display:inline-block;width:6px;height:6px;margin-right:8px;background:var(--accent-light);vertical-align:0;animation:softBlink 1s ease-in-out infinite}
.vs-frame{transition:border-color .18s,background .18s,transform .18s}.vs-frame:hover{border-color:rgba(231,235,223,.45);transform:translateY(-1px)}
@keyframes modalIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
#vsConsent .vs-consent-card{animation:modalIn .3s cubic-bezier(.2,.8,.2,1) both}
.vs-player{min-height:106px}
@keyframes tagIn{from{opacity:0;letter-spacing:.34em}to{opacity:1;letter-spacing:.12em}}
#titleScreen.boot .hero-tagline{animation:tagIn .8s .5s cubic-bezier(.2,.8,.2,1) both}
#howModal.show .card{animation:modalIn .3s cubic-bezier(.2,.8,.2,1) both}
/* The low-armour vignette belongs to combat only; every menu state hides it (arena result/lobby, versus, title, briefing). */
body:not([data-state="play"]) #lowArmor,body:not([data-state="play"]) #hurtVignette{opacity:0!important;animation:none}
/* Phones (2026-09-10): the MOVE hint shows for a few seconds at each start, then leaves the thumb area alone. */
.stick-hint{opacity:0;transition:opacity .6s}
#stick.hint .stick-hint{opacity:.32}
/* A boost tap with an empty gauge: the gauge and the button answer so the press is never silent. */
@keyframes gaugeDenied{0%,100%{box-shadow:none}30%{box-shadow:0 0 0 1px #ffb59a inset}}
.bar.denied{animation:gaugeDenied .32s ease-out}
.tbtn.denied{border-color:rgba(255,181,154,.8)}
/* ---- Boot card (2026-09-10): the first load and the cut into a mission wear the same HUD-style card.
   Corner brackets all round, a rail that sweeps until the data is in, and three status lines that take turns. ---- */
#boot{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;background:#0b1214;color:#f0ede2;transition:opacity .5s}
#boot.done{opacity:0;pointer-events:none}
#boot[hidden]{display:none}
body.bg #boot{display:none}
.boot-card{position:relative;width:min(340px,82vw);padding:26px 28px 24px;display:flex;flex-direction:column;gap:12px}
.boot-card>i{position:absolute;width:14px;height:14px;border:1px solid rgba(230,235,221,.55)}
.boot-card>i.c1{left:0;top:0;border-right:0;border-bottom:0}.boot-card>i.c2{right:0;top:0;border-left:0;border-bottom:0}.boot-card>i.c3{left:0;bottom:0;border-right:0;border-top:0}.boot-card>i.c4{right:0;bottom:0;border-left:0;border-top:0}
.boot-eyebrow{font-size:9px;font-weight:700;letter-spacing:.2em;color:#ffa475}
.boot-mark{font-family:Impact,"Arial Narrow","Helvetica Neue",sans-serif;font-weight:900;font-size:40px;line-height:1;letter-spacing:-.02em;color:#f0ede2}
.boot-mark em{font-style:normal;color:#ed713d}
/* Wide logo (img/zone-logo_2.svg) on the loading card: pure white, orange dot, an outline that keeps circling while we wait. */
.boot-mark{display:block;padding:2px 0}.boot-logo{display:block;width:100%;height:auto;overflow:visible}.boot-logo path{fill:#fff;stroke:#fff;stroke-width:.6;stroke-opacity:0;stroke-dasharray:14 320;animation:bootWire 2.2s linear infinite}.boot-logo path.dot{fill:#ed713d;stroke:#ed713d}
@keyframes bootWire{0%{stroke-dashoffset:0;stroke-opacity:.9}100%{stroke-dashoffset:-334;stroke-opacity:.9}}
@media(prefers-reduced-motion:reduce){.boot-logo path{animation:none}}
.boot-rail{position:relative;height:2px;background:rgba(230,235,221,.14);overflow:hidden;margin-top:4px}
.boot-rail i{position:absolute;left:0;top:0;height:100%;width:38%;background:#ed713d;animation:bootRail 1.4s cubic-bezier(.4,0,.2,1) infinite}
@keyframes bootRail{from{transform:translateX(-110%)}to{transform:translateX(280%)}}
#boot.done .boot-rail i,#pageLoad.done .boot-rail i{animation:none;width:100%;transition:width .3s}
.boot-status{position:relative;height:16px;font-size:10px;letter-spacing:.16em;color:#a8afaa}
.boot-status span{position:absolute;left:0;top:0;white-space:nowrap;opacity:0;animation:bootLine 3.6s ease-in-out infinite}
.boot-status span:nth-child(2){animation-delay:1.2s}.boot-status span:nth-child(3){animation-delay:2.4s}
@keyframes bootLine{0%{opacity:0;transform:translateY(4px)}8%{opacity:1;transform:none}30%{opacity:1}36%{opacity:0;transform:translateY(-3px)}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.boot-rail i{animation:none;width:60%}.boot-status span{animation:none}.boot-status span:first-child{opacity:1}}
#boot.blank .boot-card{display:none}
#boot.blank{transition-duration:.35s}
/* ---- Emblem artwork (2026-09-10): the player's full-colour SVGs. Small marks are <img>; the focus and intro cards inline the SVG. ---- */
.arena-emblem img{width:100%;height:100%;display:block;object-fit:contain}
.arena-emblem svg{overflow:visible}
/* ---- Emblem motion (2026-09-10): each crest is split into a few <img> layers (arena-progress LAYERS) so the
   compositor moves them; the wrapper is clipped to the hexagon so nothing leaves the frame. Big and intro cards only. ---- */
.arena-emblem.layered{position:relative;clip-path:polygon(50% 3.7%,90.1% 26.9%,90.1% 73.1%,50% 96.3%,9.9% 73.1%,9.9% 26.9%)}
.arena-emblem.layered .emb-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;transform-origin:50% 50%;will-change:transform,opacity}
.arena-emblem.layered .emb-glint{position:absolute;inset:0;overflow:hidden;pointer-events:none;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}
.arena-emblem.layered .emb-glint::after{content:"";position:absolute;top:-25%;bottom:-25%;left:-40%;width:26%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.95) 50%,rgba(255,255,255,0));transform:skewX(-22deg) translateX(-100%);will-change:transform}
/* BASALT: the figure may stand proud of the hexagon, so the container clip is lifted for it alone. */
.arena-emblem.layered[data-emblem="basalt"]{clip-path:none}
.arena-focus .arena-emblem.big.layered,#arenaIntroEmblem.layered{animation:emblemIn .45s cubic-bezier(.2,.8,.2,1) both}
/* IRONCLAD: the lis breathes like hot metal, slow and heavy. */
.arena-emblem.big[data-emblem="ironclad"] [data-layer="crest"],.arena-emblem.intro[data-emblem="ironclad"] [data-layer="crest"]{animation:embForge 3.4s ease-in-out infinite}
@keyframes embForge{0%,100%{transform:scale(1.12);filter:brightness(1.5)}55%{transform:scale(1);filter:brightness(1)}}
/* KESTREL: the eagle rides the air inside the frame; the star twinkles. */
.arena-emblem.big[data-emblem="kestrel"] [data-layer="eagle"],.arena-emblem.intro[data-emblem="kestrel"] [data-layer="eagle"]{animation:embHover 2.8s ease-in-out infinite}
.arena-emblem.big[data-emblem="kestrel"] [data-layer="star"],.arena-emblem.intro[data-emblem="kestrel"] [data-layer="star"]{animation:embTwinkle 1.8s ease-in-out infinite}
@keyframes embHover{0%,100%{transform:translateY(-5%) rotate(-2deg)}50%{transform:translateY(1.5%) rotate(1.2deg)}}
@keyframes embTwinkle{0%,100%{opacity:1}50%{opacity:.2}}
/* HALCYON: the kingfisher dips into its dive; the bolt flickers. */
.arena-emblem.big[data-emblem="halcyon"] [data-layer="bird"],.arena-emblem.intro[data-emblem="halcyon"] [data-layer="bird"]{animation:embDive 2.4s ease-in-out infinite}
.arena-emblem.big[data-emblem="halcyon"] [data-layer="bolt"],.arena-emblem.intro[data-emblem="halcyon"] [data-layer="bolt"]{animation:embBolt 2.4s steps(1,end) infinite}
@keyframes embDive{0%,100%{transform:translate(-5%,6%) rotate(-9deg) scale(1.06)}55%{transform:translate(1.5%,-1.5%) rotate(2deg) scale(1)}}
@keyframes embBolt{0%,100%{opacity:1;filter:brightness(1.8)}7%{opacity:.15;filter:brightness(1)}10%{opacity:1;filter:brightness(1.8)}13%{opacity:.3}16%{opacity:1;filter:brightness(1)}52%{opacity:1}55%{opacity:.2;filter:brightness(1.8)}58%{opacity:1;filter:brightness(1)}}
/* BASALT: the figure sits over the red frame (1.07), flexes and trembles at the top of the cycle, then breathes; the sparks jitter. */
.arena-emblem.big[data-emblem="basalt"] [data-layer="figure"],.arena-emblem.intro[data-emblem="basalt"] [data-layer="figure"],.arena-emblem.big[data-emblem="basalt"] [data-layer="sparks"],.arena-emblem.intro[data-emblem="basalt"] [data-layer="sparks"]{transform-origin:50% 81.5%;transform:scale(1.07);animation:embFlex 3s ease-in-out infinite}
.arena-emblem.big[data-emblem="basalt"] [data-layer="sparks"],.arena-emblem.intro[data-emblem="basalt"] [data-layer="sparks"]{animation:embFlex 3s ease-in-out infinite,embSpark .9s steps(2,end) infinite}
@keyframes embFlex{0%{transform:scale(1.24) rotate(-2deg)}3%{transform:scale(1.24) rotate(2deg)}6%{transform:scale(1.24) rotate(-1.6deg)}9%{transform:scale(1.24) rotate(1.2deg)}12%{transform:scale(1.22) rotate(0)}30%{transform:scale(1.07) rotate(0)}65%{transform:scale(1.11) rotate(0)}100%{transform:scale(1.07) rotate(0)}}
@keyframes embSpark{0%,100%{opacity:1;filter:brightness(1.6)}50%{opacity:.2;filter:brightness(1)}}
/* MIRAGE: a slow heat shimmer across the crest; the iris catches light. */
.arena-emblem.big[data-emblem="mirage"] [data-layer="crest"],.arena-emblem.intro[data-emblem="mirage"] [data-layer="crest"],.arena-emblem.big[data-emblem="mirage"] [data-layer="iris"],.arena-emblem.intro[data-emblem="mirage"] [data-layer="iris"]{animation:embShimmer 5s ease-in-out infinite}
.arena-emblem.big[data-emblem="mirage"] [data-layer="iris"],.arena-emblem.intro[data-emblem="mirage"] [data-layer="iris"]{animation:embShimmer 5s ease-in-out infinite,embGlint 3s ease-in-out infinite}
@keyframes embShimmer{0%{transform:skewX(5deg) translateX(2.5%);opacity:.6}30%{transform:skewX(-3deg) translateX(-1.2%);opacity:1}60%,100%{transform:skewX(0) translateX(0);opacity:1}}
@keyframes embGlint{0%{filter:brightness(2.4)}40%,100%{filter:brightness(1)}}
/* LONGBOW: the sunburst flares behind the archer, then breathes. */
.arena-emblem.big[data-emblem="longbow"] [data-layer="rays"],.arena-emblem.intro[data-emblem="longbow"] [data-layer="rays"]{animation:embRays 3.2s ease-in-out infinite}
@keyframes embRays{0%{filter:brightness(2.3);opacity:1;transform:scale(1.1)}22%{filter:brightness(1);opacity:.8;transform:scale(1)}55%{filter:brightness(1.6);opacity:1;transform:scale(1.05)}100%{filter:brightness(1);opacity:.8;transform:scale(1)}}
/* REDLINE: the skull lunges once at the top of the cycle, then sways; the pink band stays on top. */
.arena-emblem.big[data-emblem="redline"] [data-layer="skull"],.arena-emblem.intro[data-emblem="redline"] [data-layer="skull"]{animation:embLunge 3.2s ease-out infinite}
@keyframes embLunge{0%{transform:scale(1.28) translate(0,-4%)}5%{transform:scale(.95) translate(-1.5%,1%)}9%{transform:scale(1.06) translate(1%,0)}14%{transform:scale(1) translate(0,0)}55%{transform:scale(1.03) translate(0,-.6%)}100%{transform:scale(1) translate(0,0)}}
/* VESPER: the crest fades like something half seen; the wings breathe. */
/* VESPER: a streak of light runs across the purple crest (masked by the crest itself), then the wings breathe. */
.arena-emblem.big[data-emblem="vesper"] .emb-glint::after,.arena-emblem.intro[data-emblem="vesper"] .emb-glint::after{animation:embSweep 4.2s cubic-bezier(.4,0,.2,1) infinite}
@keyframes embSweep{0%{transform:skewX(-22deg) translateX(-100%)}28%,100%{transform:skewX(-22deg) translateX(720%)}}
.arena-emblem.big[data-emblem="vesper"] [data-layer="wings"],.arena-emblem.intro[data-emblem="vesper"] [data-layer="wings"]{animation:embPhantom 4.2s ease-in-out infinite,embWings 4.2s ease-in-out infinite}
@keyframes embPhantom{0%{opacity:0}18%{opacity:1}60%{opacity:.35}100%{opacity:1}}
@keyframes embWings{0%{transform:scaleX(1.3) scaleY(1.08)}40%{transform:scaleX(1)}70%{transform:scaleX(1.08)}100%{transform:scaleX(1)}}
/* SOVEREIGN: the dragon is negative space in a black mask over the orange field, so the field and the mask move as one:
   a slow swell and warming, never rotating (a turn would show the corners). */
.arena-emblem.big[data-emblem="sovereign"] [data-layer="dragon"],.arena-emblem.intro[data-emblem="sovereign"] [data-layer="dragon"]{animation:embCoil 4.4s ease-in-out infinite}
@keyframes embCoil{0%{transform:scale(1.16);filter:brightness(1.4)}50%{transform:scale(1);filter:brightness(1)}100%{transform:scale(1.05);filter:brightness(1.12)}}
@media(prefers-reduced-motion:reduce){.arena-emblem .emb-layer,.arena-emblem svg *{animation:none!important}}
/* the locked launch label (作戦 01 クリアで解放) is longer than DEPLOY: let it wrap on phones instead of running into the next button */
@media(max-width:700px){.launch-btn:disabled>span{white-space:normal;line-height:1.3;font-size:11px;text-align:left}}