:root{--bg:#050b11;--panel:#0a151e;--panel2:#102230;--cyan:#70e9ff;--text:#f2f8fa;--muted:#99b0bd;--gold:#ffcd73;--red:#ff6478;--purple:#c2a0ff}
body.aftershock{font-family:Arial,Helvetica,sans-serif;color:var(--text)}
body.aftershock button{font-size:14px}
body.aftershock button:focus-visible,body.aftershock input:focus-visible,body.aftershock textarea:focus-visible{outline:3px solid #ffda8a;outline-offset:4px}
body.aftershock button:disabled{opacity:.4;cursor:not-allowed;filter:none}
body.aftershock .overlay{overflow:auto;touch-action:pan-y;padding:24px;background:rgba(2,7,12,.87);backdrop-filter:blur(12px);align-items:safe center}
body.aftershock .panel{border:1px solid #335464;border-radius:16px;padding:28px;background:linear-gradient(135deg,#0d1c27,#070e15);box-shadow:0 24px 100px #000a;max-height:calc(100dvh - 48px);overflow:auto;width:min(94vw,940px);touch-action:pan-y}
body.aftershock .panel.compact{width:min(94vw,460px)}
body.aftershock .panel>p{font-size:16px;line-height:1.55;color:#adc3cd}
body.aftershock .panel h2{font-size:clamp(26px,4vw,38px);letter-spacing:-.02em;line-height:1.06}
body.aftershock .panel h3{font-size:17px}
body.aftershock .eyebrow{font:700 12px/1.4 Arial,sans-serif;letter-spacing:.15em;color:#89b4c3}
body.aftershock .primary,body.aftershock .secondary,body.aftershock .ghost{clip-path:none;border-radius:7px;min-height:46px;font-weight:800;letter-spacing:.07em}
body.aftershock .primary{background:#8eebf8;color:#061920;border:1px solid #a6f4ff;box-shadow:0 5px 30px #45d1ef20}
body.aftershock .secondary{background:#152c3a;border-color:#345369;color:#e9f2f6}
body.aftershock .ghost{background:#ffffff05;border-color:#446072;color:#adc3cf}
body.aftershock .panel.compact>button{display:block;width:100%;margin-top:8px}
body.aftershock .icon-btn{width:44px;height:44px;min-width:44px;border:1px solid #406071;border-radius:7px;background:#07141ed9;font-size:18px}

/* The title screen is the game's launcher. Artwork has its own quiet half of the screen. */
body.aftershock .menu-overlay{padding:22px;background:radial-gradient(ellipse at 65% 30%,#0b3745,#03090e 68%);backdrop-filter:none}
body.aftershock .menu-card{width:min(1320px,100%);max-height:none;padding:0;margin:0;text-align:left;border:1px solid #263f4c;border-radius:0;background:#070f16;box-shadow:0 30px 100px #0008;transform:none;clip-path:none;overflow:hidden}
body.aftershock .menu-overlay::before,body.aftershock .menu-overlay::after,body.aftershock .menu-card::before,body.aftershock .menu-card::after{display:none}
.title-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 28px;border-bottom:1px solid #243643;background:#09131be8}
.studio-mark{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:800;letter-spacing:.12em}
body.aftershock .logo{width:40px;height:40px;border-radius:0;object-fit:contain;filter:none;margin:0}
.studio-sub{display:block;color:#6e8a98;font-size:10px;letter-spacing:.13em;margin-top:5px}
.release-mark{color:#708d9c;letter-spacing:.13em;font-size:11px;display:flex;align-items:center;gap:12px}
.release-mark b{display:inline-grid;place-items:center;border:1px solid #476674;width:31px;height:31px;font-size:14px;color:#accedc}
.title-body{display:grid;grid-template-columns:1.12fr 1fr;position:relative}
.title-content{padding:38px 38px 24px;position:relative;z-index:1}
body.aftershock .title-content>.eyebrow{font-size:11px;color:#8ba9b8;margin:0 0 16px;letter-spacing:.18em}
body.aftershock h1{font-family:Impact,'Arial Black',Arial,sans-serif;font-size:clamp(56px,6.5vw,91px);font-style:italic;letter-spacing:-.025em;line-height:.96;text-shadow:3px 4px 0 #1e4553;margin:0;color:#e9f9fb}
body.aftershock h1 span{color:#99e9f3}
body.aftershock .subtitle{font:800 14px/1.2 Arial,sans-serif;letter-spacing:.68em;color:#f2c782;margin:13px 0 17px;padding:0}
body.aftershock .tagline{font-size:17px;line-height:1.4;color:#a1bac7;margin:0 0 27px;text-align:left;max-width:none;font-weight:400}
body.aftershock fieldset{border:0;padding:0;margin:0 0 19px;min-width:0}
body.aftershock legend{font-size:10px;font-weight:700;letter-spacing:.16em;margin:0 0 10px;color:#718f9f}
.kit-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
body.aftershock .kit-options button{display:flex;flex-direction:column;gap:9px;align-items:flex-start;justify-content:center;min-height:75px;background:#0c1a24;border:1px solid #243d4c;border-radius:4px;color:#88a6b6;font-size:10px;font-weight:800;padding:12px;letter-spacing:.04em}
.kit-options button>span{font-size:27px;line-height:1}
body.aftershock .kit-options button[aria-pressed=true]{background:#12303b;border-color:#83d7e8;color:#adf3fd;box-shadow:inset 0 -3px #78e8ff}
body.aftershock .kit-options button[data-kit=instinct][aria-pressed=true]{background:#30281b;border-color:#f0c276;box-shadow:inset 0 -3px #ffc862;color:#ffe4b5}
body.aftershock .kit-options button[data-kit=void][aria-pressed=true]{background:#241d36;border-color:#bca0ed;box-shadow:inset 0 -3px #c2a0ff;color:#e2d3ff}
#kitDescription{color:#9cb9c8;font-size:13px;line-height:1.4;margin:9px 0 0;min-height:19px}
.mode-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
body.aftershock .mode-options button{background:transparent;border:1px solid #25404f;border-radius:4px;text-align:left;padding:12px 10px;color:#839ba9;display:grid;gap:7px}
.mode-options button small{font-size:8px;font-weight:700;letter-spacing:.08em}
.mode-options button strong{font-size:12px;white-space:nowrap}
.mode-options button span{font-size:11px;color:#95aebb}
body.aftershock .mode-options button[aria-pressed=true]{background:#182d39;border-color:#b8d3df;color:#f5fbff}
.run-config{min-height:40px;margin:-8px 0 13px}
#modeDescription{font-size:13px;line-height:1.35;color:#abc1cc;margin:0 0 5px}
#modeBest{font-size:9px;letter-spacing:.13em;color:#607e8f}
body.aftershock .signal-entry{display:flex;align-items:center;gap:12px;margin:0 0 12px;text-align:left}
body.aftershock .signal-entry label{color:#7595a7;font-size:10px;letter-spacing:.07em;white-space:nowrap}
body.aftershock .signal-entry label small{display:block;color:#678492;font-size:10px;margin-top:3px}
body.aftershock .signal-entry input{width:100%;min-width:0;border-radius:4px;height:37px;min-height:37px;padding:8px 12px;font:600 13px monospace;letter-spacing:.1em;border:1px solid #274552;background:#030c13;color:#c4eef5}
body.aftershock .start-button{font-size:14px;min-height:54px;width:100%;display:block;border-radius:3px;letter-spacing:.13em;position:relative}
body.aftershock .resume-button{width:100%;min-height:33px!important;margin-top:8px;font-size:11px!important;letter-spacing:.06em}
.title-art{position:relative;min-height:600px;overflow:hidden;background:#07121a;border-left:1px solid #203640}
.title-art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:52% 30%;opacity:.93}
.title-art::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#07111b 0%,transparent 34%,transparent 85%,#05111c60),linear-gradient(90deg,#071019 0%,transparent 22%);pointer-events:none}
.art-caption{position:absolute;left:34px;right:30px;bottom:95px;z-index:1;display:grid;gap:5px}
.art-caption>span{font:700 10px/1.4 Arial;letter-spacing:.2em;color:#82a5b7}
.art-caption strong{font:italic 64px/1 Impact,'Arial Black',sans-serif;letter-spacing:.025em;color:#ecfaff}
.career-strip{position:absolute;bottom:25px;left:34px;right:30px;z-index:1}
.career-strip>div:first-child{display:flex;gap:8px;justify-content:space-between;align-items:center}
.career-strip b{font-size:10px;letter-spacing:.08em;color:#9ce9f6}.career-strip small{color:#799aac;font-size:10px}
.career-track{height:4px;margin-top:11px;background:#29424e}.career-track i{display:block;height:100%;background:#8ce9f9;width:0;transition:width .4s}
.title-bottom{border-top:1px solid #29404c;background:#0a151d}
.menu-nav{display:flex;flex-wrap:wrap;align-items:stretch;padding:5px 15px;gap:0}
body.aftershock .menu-nav button{border:0;background:transparent;padding:14px 13px;font-size:10px;letter-spacing:.08em;font-weight:800;color:#a0bac7}
.menu-nav button b{color:#ffe1a0;margin-left:4px}.menu-nav button small{font-size:8px;color:#608592;margin-left:5px}
body.aftershock #shareBtn{margin-left:auto;color:#87e8fa}
.title-status{padding:12px 28px 15px;border-top:1px solid #192f3b;display:flex;justify-content:space-between;align-items:center;gap:20px}
.title-status>span{font-size:9px;letter-spacing:.08em;color:#658795}.title-status b{display:block;font-size:17px;margin-top:6px;color:#d5eaf1;letter-spacing:.1em}
body.aftershock .controls-hint{font-size:10px;line-height:1.65;color:#64818f;text-align:right}
body.aftershock .record-line{display:none}

/* Combat uses stable shapes and restrained colours; menus can scroll independently of the field. */
body.aftershock #hud{background:linear-gradient(#06111bf5,#06111bea 70%,transparent);padding:calc(15px + var(--safe-t)) 20px 18px;gap:16px}
body.aftershock .hud-left{width:min(280px,26vw);gap:9px}
body.aftershock .meter{grid-template-columns:36px 1fr 28px;font-size:11px}
body.aftershock .meter b{font-size:12px}.meter-track{height:7px!important}
body.aftershock .hud-centre{min-width:0;max-width:480px}
body.aftershock .stage-chip{font-size:11px;border-radius:4px;padding:7px 10px;letter-spacing:.04em}
body.aftershock .hud-score span{font-size:22px}
body.aftershock .hud-coins{color:#ffe0a0;border-color:#8c70474f;background:#251b0ba6;font-size:15px;border-radius:5px}
body.aftershock #runCodeHud{display:none}
body.aftershock .district-rail{gap:5px;margin-bottom:5px}
body.aftershock #powerStrip{top:calc(100px + var(--safe-t));max-width:70vw;flex-wrap:wrap;justify-content:center}
body.aftershock .power-pill{font-size:10px;border-radius:4px;background:#07131ae8}
body.aftershock #resonanceHud{top:auto;bottom:calc(30px + var(--safe-b));width:250px;border-radius:4px;padding:8px 12px;background:#07121ef0;gap:8px}
body.aftershock #resonanceHud>span{font-size:10px}
body.aftershock #resonanceHud>small{top:auto;bottom:38px;font-size:10px}
body.aftershock #flowHud{left:20px;top:100px;bottom:auto;border-radius:4px;background:#0a111cde;min-width:90px}
body.aftershock #flowValue{font-size:27px}
body.aftershock .action-cluster{width:225px;height:155px;right:25px;bottom:25px}
body.aftershock .action-btn.zap{width:94px;height:94px;right:0;bottom:0;background:radial-gradient(circle at 30% 25%,#aaf1ff,#267e9a);box-shadow:0 0 20px #61cfff25}
body.aftershock .action-btn.dash{width:73px;height:73px;left:39px;top:0;background:radial-gradient(circle at 30% 25%,#c8b4ed,#51476f);box-shadow:0 0 15px #9678d522}
body.aftershock .action-btn.surge{width:67px;height:67px;left:0;bottom:0;background:conic-gradient(#f1cd87 var(--cooldown,100%),#41382d 0);color:#221a0b;border:3px solid #776749;box-shadow:0 0 15px #ffaa4420}
body.aftershock .action-btn.surge.ready{border-color:#ffe5a6}
body.aftershock .action-btn.surge span{font-size:25px}
body.aftershock .action-btn small{font-size:10px}
body.aftershock .stick-zone{bottom:22px;left:22px;width:150px;height:150px}
body.aftershock .stick-knob{width:52px;height:52px;left:49px;top:49px;background:#447f96;box-shadow:0 0 10px #64cbe633}
body.aftershock .stick-knob,body.aftershock .stick-ring{border-radius:50%}body.aftershock .stick-ring{border-color:#6997a845;background:#09202e55}
body.aftershock #aftershockHud{position:absolute;z-index:10;left:50%;top:calc(137px + var(--safe-t));transform:translateX(-50%);width:min(600px,65vw);text-align:center;pointer-events:none}
.mission-strip{display:flex;gap:18px;justify-content:center;align-items:center;color:#84b1c3;font:700 10px monospace;letter-spacing:.06em}
#threatCount{color:#ff97a3}#elapsedHud{color:#f2d8a8}
#objectiveText{font-size:12px;color:#bed6df;text-shadow:0 1px 7px black;margin:8px 0;line-height:1.4}
#roomReward{font-size:11px;color:#ffe59f}
body.aftershock #bossBar{position:absolute;z-index:12;left:50%;bottom:96px;transform:translateX(-50%);width:min(530px,50vw);pointer-events:none;background:#120c15e8;padding:9px 12px;border:1px solid #97535b}
#bossBar>div:first-child{display:flex;justify-content:space-between;gap:10px;margin-bottom:7px}#bossName{font-size:12px;color:#ffbdbe}#bossPhase{font-size:9px;color:#e3c1c1}.boss-track{height:6px;background:#47232e}.boss-track i{display:block;height:100%;background:#ff7385}
body.aftershock .toast{max-width:90vw;white-space:normal;text-align:center;font-size:12px;border-radius:5px;top:32%;padding:11px 18px;line-height:1.4;background:#07141ef5}
body.aftershock .level-banner{pointer-events:none;top:43%;border-color:#85c9d355;background:linear-gradient(90deg,transparent,#071622ee 20%,#071622ee 80%,transparent);padding:18px 28px}
body.aftershock .level-banner strong{font-size:clamp(23px,4vw,42px)}
body.aftershock .level-banner span{font-size:13px}
body.aftershock .rotate-hint{display:none!important}
.pause-note{display:block;font-size:12px;line-height:1.4;color:#91b0bf;margin:9px 0 15px}
.contract-grid,.supply-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:24px 0}
.contract-card{padding:20px;border:1px solid #365163;background:#10222f;border-radius:8px}
.contract-card p{font-size:14px;color:#9eb9c8;line-height:1.4}.contract-card h3{margin:9px 0}
.contract-card>strong{display:block;font-size:26px;margin:24px 0 12px;color:#e2f2f5}
.contract-card progress{accent-color:#89e5fa;width:100%;height:7px;display:block;margin-bottom:16px}
.contract-card>small{font-size:12px;color:#dfc59e;line-height:1.5;display:block}.contract-card.complete{border-color:#d1ae64}.contract-card.complete>.eyebrow{color:#ffdf94}
body.aftershock .supply-card{display:flex;flex-direction:column;text-align:left;gap:12px;padding:24px;border:1px solid #577185;border-radius:8px;background:#112737;color:#d8eaf1}
.supply-card>span{font-size:34px;color:#a3ecf8}.supply-card strong{font-size:16px}.supply-card small{font-size:14px;line-height:1.5;color:#9ab6c6;flex:1}.supply-card b{color:#f5d294;font-size:15px;margin-top:10px}.panel-footnote{font-size:13px!important}
.how-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin:28px 0}.how-grid article{border-top:1px solid #365263;padding-top:18px}.how-grid kbd{font:12px monospace;color:#91e0f4}.how-grid h3{margin:12px 0}.how-grid p{font-size:15px;line-height:1.6;color:#a7c0cb}
.readability-key{display:flex;flex-wrap:wrap;gap:20px;font-size:12px;font-weight:800;margin:25px 0}.key-volt{color:#8becff}.key-enemy{color:#ff8696}.key-coin{color:#ffdb8a}.key-hazard{color:#b5cdbb}
#reportText{width:100%;padding:18px;background:#030b11;border:1px solid #466979;border-radius:6px;color:#cfe3ee;font:13px/1.6 monospace;resize:vertical;user-select:text}
body.aftershock .save-import{display:block;border:1px solid #3c5f71;padding:14px;text-align:center;font-size:12px;font-weight:700;letter-spacing:.08em;margin-top:10px;border-radius:7px;cursor:pointer}
.save-import input{max-width:100%;margin-top:12px;font-size:13px}
body.aftershock .setting-row,body.aftershock .setting-stack{font-size:14px;line-height:1.4}
body.aftershock .choice-card small,body.aftershock .gear-card small,body.aftershock .upgrade-card small{font-size:14px;line-height:1.45}
body.aftershock .choice-card strong,body.aftershock .upgrade-card strong{font-size:17px}
body.aftershock .stat span{font-size:12px;color:#98b5c4}
body.aftershock .achievement b{font-size:14px}body.aftershock .achievement small{font-size:12px;line-height:1.4}
@media(hover:hover) and (pointer:fine){body.aftershock #touchControls{opacity:.7}.menu-nav button:hover{color:white!important;background:#15303c!important}}
@media(min-width:1000px) and (max-height:860px){.title-content{padding:25px 32px 20px}body.aftershock h1{font-size:72px}body.aftershock .tagline{font-size:15px;margin-bottom:20px}body.aftershock .title-content>.eyebrow{margin-bottom:12px}.title-art{min-height:570px}body.aftershock fieldset{margin-bottom:15px}body.aftershock .kit-options button{min-height:65px}.title-top{padding:10px 25px}.title-status{padding:8px 25px 11px}}
@media(max-width:960px){.title-content{padding:28px 24px 24px}.title-body{grid-template-columns:1.35fr 1fr}.title-art{min-height:580px}.title-top{padding:14px 23px}body.aftershock h1{font-size:clamp(54px,8vw,76px)}.menu-nav{padding:5px 10px}body.aftershock .menu-nav button{padding:12px 10px;font-size:9px}.career-strip>div:first-child{align-items:flex-start;flex-direction:column}}
@media(max-width:640px){
 body.aftershock .menu-overlay{padding:0;display:block}body.aftershock .menu-card{width:100%;border:0;overflow:visible}.title-body{display:block}.title-content{padding:25px 22px 24px}.title-top{padding:12px 22px;position:relative;z-index:2}.studio-mark{font-size:11px}.studio-sub{font-size:8px}.release-mark{font-size:9px}.release-mark b{width:26px;height:26px}
 .title-art{position:absolute;top:0;right:0;bottom:auto;width:65%;height:240px;min-height:0;opacity:.63;border:0;pointer-events:none}.title-art::after{background:linear-gradient(0deg,#070f16,transparent 60%),linear-gradient(90deg,#070f16,transparent)}.title-art>img{object-position:55% 20%;height:100%}.art-caption,.career-strip{display:none}
 body.aftershock .title-content>.eyebrow{font-size:9px;letter-spacing:.09em;margin-bottom:12px}body.aftershock h1{font-size:66px}body.aftershock .subtitle{font-size:12px;letter-spacing:.5em;margin-bottom:14px}body.aftershock .tagline{font-size:14px;margin-bottom:28px;max-width:230px}body.aftershock legend{font-size:10px}
 body.aftershock .kit-options button{font-size:9px;min-height:70px;padding:10px;gap:9px}.kit-options button>span{font-size:24px}.mode-options button strong{font-size:11px}.mode-options button span{font-size:10px}.mode-options button small{font-size:7px}body.aftershock .mode-options button{padding:12px 9px}
 body.aftershock .start-button{min-height:52px;font-size:13px}.menu-nav{display:grid;grid-template-columns:repeat(3,1fr);padding:8px 12px;gap:0}body.aftershock .menu-nav button{font-size:9px;min-height:42px;padding:9px 6px}body.aftershock #shareBtn{grid-column:1/-1;width:100%}.menu-nav button small{display:none}.title-status{padding:12px 20px 20px}.title-status b{font-size:16px}body.aftershock .controls-hint{font-size:9px;max-width:215px}
 body.aftershock .overlay{padding:14px}body.aftershock .panel{padding:22px;max-height:calc(100dvh - 28px);border-radius:12px}body.aftershock .panel h2{font-size:27px}.contract-grid,.supply-grid,.how-grid{grid-template-columns:1fr}.contract-card{display:grid;grid-template-columns:1fr auto;gap:5px}.contract-card>strong{align-self:center}.contract-card progress,.contract-card>small{grid-column:1/-1}.contract-card h3{font-size:16px}.contract-card p{margin-bottom:6px}.how-grid{gap:12px}
 body.aftershock #hud{padding:calc(10px + var(--safe-t)) 13px 20px;grid-template-columns:1fr auto;min-height:110px;gap:5px}body.aftershock .hud-left{width:44vw;gap:7px}body.aftershock .meter{grid-template-columns:32px 1fr 25px;gap:4px;font-size:10px}body.aftershock .meter b{font-size:11px}body.aftershock .hud-centre{top:calc(60px + var(--safe-t));max-width:92vw;width:92vw}body.aftershock .stage-chip{font-size:10px;padding:4px 8px}body.aftershock .hud-score{display:none}body.aftershock .hud-right{gap:7px}body.aftershock .hud-coins{font-size:13px;padding:8px}body.aftershock .icon-btn{min-width:38px;width:38px;height:38px}body.aftershock #fullscreenBtn{display:none}
 body.aftershock #flowHud{left:13px;top:calc(107px + var(--safe-t));padding:5px 8px;min-width:65px}body.aftershock #flowValue{font-size:22px}body.aftershock #powerStrip{top:calc(105px + var(--safe-t));left:auto;right:12px;transform:none;max-width:65vw}body.aftershock .power-pill{font-size:9px}
 body.aftershock #aftershockHud{top:calc(158px + var(--safe-t));width:92vw}.mission-strip{font-size:9px;gap:15px}#objectiveText{font-size:11px;margin:7px 0}#roomReward{font-size:10px}
 body.aftershock .stick-zone{width:128px;height:128px;left:10px;bottom:calc(38px + var(--safe-b))}body.aftershock .stick-knob{width:44px;height:44px;left:42px;top:42px}body.aftershock .action-cluster{width:182px;height:141px;right:13px;bottom:calc(38px + var(--safe-b))}body.aftershock .action-btn.zap{width:80px;height:80px}body.aftershock .action-btn.dash{width:63px;height:63px;left:35px;top:0}body.aftershock .action-btn.surge{width:59px;height:59px;bottom:0;left:0}body.aftershock .action-btn small{font-size:9px}
 body.aftershock #resonanceHud{bottom:calc(9px + var(--safe-b));width:225px;padding:5px 9px}body.aftershock #resonanceHud>small{bottom:28px;font-size:8px}body.aftershock #bossBar{bottom:calc(198px + var(--safe-b));width:88vw;padding:8px 10px}#bossName{font-size:11px}#bossPhase{font-size:8px}
}
@media(max-height:540px) and (orientation:landscape){body.aftershock .menu-overlay{display:block;padding:12px}.title-body{grid-template-columns:1.3fr 1fr}.title-art{min-height:100%}.title-content{padding:22px}body.aftershock #aftershockHud{top:107px;width:55vw}.mission-strip{font-size:9px}#objectiveText{font-size:10px}body.aftershock #powerStrip{top:80px}body.aftershock #flowHud{top:85px}body.aftershock .action-cluster{transform:scale(.8);right:12px;bottom:12px}body.aftershock .stick-zone{transform:scale(.8);bottom:12px;left:12px}body.aftershock #bossBar{bottom:78px;width:43vw}body.aftershock .level-banner{padding:12px 20px;top:50%}body.aftershock .toast{top:37%}}
@media(prefers-reduced-motion:reduce){body.aftershock *{animation:none!important;transition:none!important}}
@media(max-width:640px){body.aftershock .menu-overlay{padding:0}body.aftershock h1{font-size:clamp(42px,14vw,66px);white-space:nowrap}.title-content{padding:24px 18px}.mode-options button strong{font-size:10px}}