/* Shared module geometry; no content is clipped on short laptop screens. */
body{height:auto;min-height:100dvh;display:block;overflow:auto}
.shell{height:auto;min-height:100dvh}.rail{height:auto;min-height:100dvh}
main{height:auto;display:block;padding-bottom:14px}header{height:70px}.title-row{margin:16px 0 22px}
.dashboard{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,27%);align-items:start;gap:16px}
.left-column{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto;gap:14px;min-width:0}.subsystems{display:contents}
#powerPanel,#accessCard,#repelCard{display:grid;grid-template-rows:22px 48px 64px 160px 52px 52px 42px;gap:0;padding:15px 12px;margin:0;min-width:0;min-height:0;align-content:start}
#powerPanel{grid-column:1;grid-row:1}#accessCard{grid-column:2;grid-row:1}#repelCard{grid-column:3;grid-row:1}
.subsystem .card-top{display:flex;align-items:center;justify-content:space-between;margin:0}.subsystem .card-number{font-size:12px;line-height:1.3;margin:0}
#powerPanel>h2,#accessCard>h2,#repelCard>h2{display:flex;align-items:center;margin:0!important;padding:0!important;border:0!important;font-size:18px!important;line-height:1.3!important}
#powerPanel>p,#accessCard>p,#repelCard>p{display:block!important;margin:6px 0 10px!important;padding:0!important;min-height:0;font:13px/1.45 Arial,Helvetica,sans-serif!important;color:#a8b8b2}
/* One shared frame for the three module illustrations. */
.subsystem>.module-visual{position:relative;display:grid;place-items:center;align-self:stretch;grid-row:4;gap:0;margin:0;padding:0;min-height:0;height:100%;max-height:none;border:1px solid #354740;border-radius:5px;background:radial-gradient(ellipse at center,#263b323b,#0b1414);overflow:hidden}
#powerPanel .battery-visual{width:135px;min-width:135px;flex:0 0 auto}#powerPanel .battery-outline{width:126px;height:47px;padding:4px}#powerPanel .battery-outline:after{top:13px;height:17px;right:-8px;width:5px}#powerPanel .battery-value{top:7px;width:126px}#powerPanel .battery-value strong{font-size:26px}#powerPanel .battery-value span{font-size:13px}#powerPanel .battery-lines{inset:4px}
#powerPanel .battery-visual>.micro,#powerPanel .power-meta{display:none}#powerPanel .power-info{position:absolute;bottom:8px;left:0;width:100%;min-width:0;text-align:center}#powerPanel .power-info .eyebrow{font-size:9px;line-height:1.4}#powerPanel .extinction{font-size:19px!important;line-height:1.1;margin:2px 0 0}
.subsystem .module-idle-visual .hero-doors{width:115px;height:94px;margin:0}.subsystem .module-idle-visual .hero-wave{width:80px;height:80px;margin:0}
#powerPanel>.line-status,#accessCard>.line-status,#repelCard>.line-status{margin:0;padding:9px 0;display:flex;align-items:center;justify-content:space-between;gap:7px;flex-wrap:nowrap;font-size:10px;line-height:1.45;border-top:0;border-bottom:1px solid var(--border)}
.subsystem>.button{width:100%;margin:6px 0 0!important;padding:7px!important;min-height:0!important;font-size:12px!important;line-height:1.3;justify-content:center}
.subsystem>.dependency{display:flex;align-items:center;margin:0!important;font:11px/1.4 var(--mono)!important;min-height:0}
.system-active .module-idle-visual,.system-active .battery-content{border-color:#4b946d!important}.system-active>h2{color:#79ffbb!important}
.surveillance-panel{grid-column:1/-1;grid-row:2;min-width:0}.surveillance-panel .panel-heading{padding:12px 14px;display:flex;justify-content:space-between;gap:12px}.surveillance-panel h2{font-size:14px}.camera-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px}.camera-view{margin:0;border:1px solid #40534a;border-radius:3px;overflow:hidden;background:#0a1510}.camera-view canvas{display:block;width:100%;aspect-ratio:3/2;height:auto}
.right-column{display:block}.perimeter-panel{height:auto;min-height:0}.briefing{display:none}#perimeter.perimeter-visual{width:min(100%,270px);height:auto;aspect-ratio:1;flex:none;min-height:0;max-height:none;overflow:visible}#zombieRadar{width:100%;height:auto;aspect-ratio:1}.perimeter-caption p{display:block}
.start-bar{position:sticky;bottom:0}footer{margin-top:18px;min-height:27px}.operation-history{margin-top:20px}.operation-history summary{cursor:pointer;color:#b9c8bd}.operation-history .log-list{max-height:160px;overflow:auto}
@media(max-width:1200px){.camera-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1050px){.dashboard{grid-template-columns:1fr}.right-column{grid-row:2}.perimeter-panel{max-width:100%}.camera-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:700px){.left-column{grid-template-columns:1fr}#powerPanel,#accessCard,#repelCard{grid-column:1;grid-row:auto;grid-template-rows:22px 44px 52px 160px 48px 48px 38px}.surveillance-panel{grid-row:auto}.camera-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.surveillance-panel .micro{display:none}}
.left-column{grid-column:1;grid-row:1}.right-column{grid-column:2;grid-row:1}#perimeter.perimeter-visual{container-type:normal}
@media(max-width:1050px){.left-column{grid-column:1;grid-row:1}.right-column{grid-column:1;grid-row:2}}

/* Explicit rows keep every frame aligned, including completed modules. */
.subsystem>.card-top{grid-row:1}.subsystem>h2{grid-row:2}.subsystem>p{grid-row:3}
.subsystem>.line-status{grid-row:5}.subsystem>.button{grid-row:6}.subsystem>.dependency{grid-row:7}
#powerPanel>.module-visual>.battery-visual{width:135px;min-width:0;margin:0;transform:none;align-self:center;justify-self:center}
#powerPanel>.module-visual>.power-info{transform:none}
#powerPanel.system-active>p,#accessCard.system-active>p,#repelCard.system-active>p{visibility:hidden}
#powerPanel.system-active>h2,#accessCard.system-active>h2,#repelCard.system-active>h2{border-bottom:1px solid var(--border)!important}
#powerPanel>.module-visual,#accessCard>.module-visual,#repelCard>.module-visual{margin:0;min-height:0;max-height:none;border-width:1px;border-radius:5px;background:radial-gradient(ellipse at center,#263b323b,#0b1414)}
#resetBtn,#resetYes{background:#52e9a2;color:#09261a;border:1px solid #76ffc0;justify-content:center}
#adminSummary{font-size:16px;line-height:1.6}
@media(min-width:1100px){.dashboard{grid-template-columns:repeat(4,minmax(0,1fr))}.left-column{grid-column:1/span 3}.right-column{grid-column:4}}

.camera-view figcaption{font:800 clamp(16px,1.6vw,24px)/1.3 system-ui,sans-serif;color:#e6f6ed;padding:12px 10px;min-height:62px;background:#14231e;border-bottom:1px solid #40534a;display:flex;align-items:center}

/* v2.10: single-line feed labels and full-height radar column. */
.camera-view{container-type:inline-size}
.camera-view figcaption{font-size:clamp(9px,5.4cqw,14px);font-weight:700;line-height:1.2;white-space:nowrap;min-height:38px;padding:10px 7px;letter-spacing:0}
.dashboard{align-items:stretch}
.right-column{display:flex;min-width:0}
.perimeter-panel{display:flex;flex-direction:column;width:100%;height:auto;flex:1}
#perimeter.perimeter-visual{width:calc(100% - 24px);max-width:360px;margin:20px auto 8px}
.perimeter-caption{padding:18px 16px}
.perimeter-panel .checklist{margin-top:auto;padding:12px 16px 18px}
.perimeter-panel .checklist div{padding:19px 0;line-height:1.5;gap:8px;flex-wrap:wrap}
.perimeter-panel .checklist b{margin-left:auto}
@media(max-width:1050px){.right-column{display:block}.perimeter-panel .checklist div{padding:14px 0}}

/* v2.11: breathe below the visuals; identical controls and status columns. */
#powerPanel,#accessCard,#repelCard{grid-template-rows:22px 48px 64px 160px 94px 52px 42px}
#powerPanel>.line-status,#accessCard>.line-status,#repelCard>.line-status{padding:43px 0 13px}
.perimeter-panel .checklist div{display:grid;grid-template-columns:20px minmax(0,1fr) 84px;align-items:center;column-gap:8px;min-height:64px;padding:16px 0;font-size:12px}
.perimeter-panel .checklist .system-name{font:inherit;color:var(--text);text-align:left;line-height:1.4}
.perimeter-panel .checklist b{width:84px;margin:0;text-align:right;font-size:10px;line-height:1.4;white-space:nowrap}
@media(max-width:700px){#powerPanel,#accessCard,#repelCard{grid-template-rows:22px 44px 52px 160px 90px 48px 38px}}

#failureDialog{border:2px solid #ec5555;background:linear-gradient(145deg,#341718,#170e12);box-shadow:0 0 60px #e22a2a44}#failureDialog h2{font-size:30px;font-weight:800;color:#ff7676}#failureDialog p{line-height:1.6}.failure-symbol{display:grid;place-items:center;width:62px;height:62px;border:2px solid #ff6969;border-radius:50%;font-size:40px;color:#ff6969;margin:20px auto}.failure-threat{color:#ff9292;font-size:19px;font-weight:bold}.mission-failed #alertStrip{border-color:#ee5555;background:#4a171c}.mission-failed #alertTitle,.mission-failed #alertTag,.mission-failed #footerState{color:#ff8989}.mission-failed .perimeter-panel{border-color:#d94a4a}.mission-failed #perimeterTitle{color:#ff7373}.mission-failed #failureDialog::backdrop{background:#180004cf}

/* Explicit cells override the old two-column checklist at every viewport. */
.perimeter-panel .checklist>div>span:first-child{grid-column:1;grid-row:1;align-self:center}
.perimeter-panel .checklist>div>.system-name{grid-column:2;grid-row:1;min-width:0;overflow-wrap:normal;word-break:normal}
.perimeter-panel .checklist>div>b{grid-column:3;grid-row:1;align-self:center}

/* Shared title family and weight; camera labels stay on one line. */
.camera-view figcaption{font-family:Arial,Helvetica,sans-serif;font-weight:700;letter-spacing:0;line-height:1.3}

/* John's receiver, with a real audio waveform. The slot holds its place during transmission. */
.title-row{gap:20px;flex-wrap:wrap}.radio-slot{width:282px;flex:0 0 282px;min-height:101px;margin-left:auto}
.radio-console{padding:10px 12px;border:1px solid #52604a;border-radius:7px;background:linear-gradient(140deg,#273029,#111c18);box-shadow:inset 0 1px #8c9c7044,0 5px 18px #0005;color:#b2c6ad;font-family:var(--mono)}
.radio-head,.radio-foot{display:flex;justify-content:space-between;align-items:center;gap:9px}.radio-head strong{font-size:12px;letter-spacing:2px}.radio-head>span{font-size:21px;letter-spacing:1px;color:#d4f9b6}.radio-head small{font-size:9px}.radio-head i{display:inline-block;width:6px;height:6px;background:#58745a;border-radius:50%;margin-right:6px}
.radio-console canvas{display:block;width:100%;height:35px;border:1px solid #3d5846;margin:6px 0}.radio-foot{font-size:9px;letter-spacing:.5px}.radio-console.is-speaking{position:fixed;top:14px;right:20px;width:282px;z-index:1100;border-color:#9ac975;box-shadow:0 0 22px #89dd6225,0 6px 25px #000a}.is-speaking .radio-head i{background:#d2ff92;box-shadow:0 0 7px #a9ff74}.is-speaking #radioState{color:#d2ff92}
@media(max-width:1050px){.radio-slot{order:3;width:100%;flex-basis:100%;margin:0}.radio-console{max-width:400px;margin:auto}.title-row{row-gap:14px}.radio-console.is-speaking{right:12px;margin:0;max-width:calc(100vw - 24px)}}

/* Unified console header: identity, mission timing and radio share one aligned row. */
header.control-header{display:block;height:auto;min-height:0;padding:0;margin:0 0 22px;border:1px solid #3e5049;border-radius:8px;background:linear-gradient(120deg,#1c2a26d9,#111c1bd9);overflow:hidden}
.control-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 20px;border-bottom:1px solid #3e5049}
.control-top .wordmark{font-size:20px;line-height:1.2}.control-top .wordmark span{font-size:8px;letter-spacing:1.6px;margin-top:5px}
.control-top .header-right{display:flex;align-items:center;gap:20px}.control-top #wallClock{font-size:20px;font-variant-numeric:tabular-nums}
.control-grid{display:grid;grid-template-columns:minmax(0,1fr) 190px minmax(250px,300px);gap:24px;align-items:center;padding:20px}
.post-identity{min-width:0}.post-identity h1{font:700 clamp(24px,2.5vw,36px)/1.15 Arial,Helvetica,sans-serif;margin:0 0 10px;letter-spacing:-.8px}.post-identity p{margin:0;font:11px/1.6 var(--mono);letter-spacing:1.1px;color:#a6b7af;overflow-wrap:anywhere}
.control-grid .session-box{margin:0;padding:0 20px;border-left:1px solid #3e5049;min-width:0;text-align:left;display:flex;flex-direction:column;gap:5px}.control-grid .session-box .eyebrow{font-size:9px;display:flex;flex-wrap:wrap;gap:5px}.control-grid #missionTime{font-size:36px;line-height:1.1;letter-spacing:1px}.control-grid #missionHint{font-size:10px}
.control-header .radio-console,.control-header .radio-console.is-speaking{position:static;width:100%;max-width:none;margin:0;box-sizing:border-box}.control-header .radio-head strong{font-size:10px;letter-spacing:.7px}.control-header .radio-head>span{font-size:18px;white-space:nowrap}
.camera-view figcaption{font:700 clamp(11px,5.4cqw,16px)/1.3 Arial,Helvetica,sans-serif;text-transform:none}
@media(max-width:1050px){.control-grid{grid-template-columns:minmax(0,1fr) 180px}.control-header .radio-console{grid-column:1/-1}.control-header .radio-console canvas{height:30px}.control-top .online{font-size:9px}}
@media(max-width:550px){.control-top{padding:14px;gap:10px}.control-top .wordmark{font-size:17px}.control-top .wordmark span{font-size:6px;letter-spacing:.7px}.control-top .online{display:none}.control-top #wallClock{font-size:17px}.control-grid{padding:14px;gap:16px;grid-template-columns:minmax(0,1fr) 118px}.control-grid .session-box{padding-left:14px;padding-right:0}.control-grid #missionTime{font-size:29px}.post-identity h1{font-size:24px}.post-identity p{font-size:9px;letter-spacing:.5px}}
@media(max-width:420px){.control-grid{grid-template-columns:minmax(0,1fr)}.control-grid .session-box{border-left:0;border-top:1px solid #3e5049;padding:12px 0 0;display:grid;grid-template-columns:1fr auto;align-items:center}.control-grid .session-box .eyebrow{align-items:flex-start}.control-grid #missionTime{grid-column:2;grid-row:1/3}.control-top .wordmark{font-size:14px;letter-spacing:1px}.control-top .wordmark span{max-width:125px;line-height:1.5}.control-top #wallClock{font-size:15px}}

/* v2.20: compact identity and timing, with readable hardware references. */
.control-grid.compact-header{grid-template-columns:minmax(0,1fr) 300px 250px;gap:18px;padding:16px 18px}
.identity-group{display:flex;align-items:center;gap:18px;min-width:0}
.identity-group .wordmark{font-size:17px;letter-spacing:2px;flex-shrink:0}
.identity-group .wordmark span{font-size:6px;letter-spacing:.6px;max-width:165px;line-height:1.5}
.identity-group .post-identity{border-left:1px solid #52645b;padding-left:18px}
.identity-group h1{font-size:24px;margin-bottom:7px}
.identity-group p{font-size:10px;letter-spacing:.5px}
.compact-header .session-box{align-items:flex-start;padding:0 0 0 18px}
.timing-line{display:flex;align-items:center;gap:12px;white-space:nowrap}
.compact-header #wallClock{font-size:21px;font-variant-numeric:tabular-nums}
.compact-header #missionTime{font-size:29px}
.time-separator{color:#778e82}
.session-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;color:#81988a}
.compact-header .online{display:inline;font-size:8px;letter-spacing:.3px}
.compact-header #missionHint{font-size:9px}
.rail .vertical-label{font-size:10px;color:#9aafa4;letter-spacing:1.5px}
footer{font-size:10px;color:#92a99b}footer b{color:#acbfaf}
@media(max-width:1250px){.control-grid.compact-header{grid-template-columns:minmax(0,1fr) 280px}.compact-header .radio-console{grid-column:1/-1}.identity-group{gap:12px}.identity-group .post-identity{padding-left:12px}}
@media(max-width:850px){.control-grid.compact-header{grid-template-columns:1fr}.compact-header .session-box{border-left:0;border-top:1px solid #3e5049;padding:12px 0 0}.identity-group h1{font-size:22px}}
@media(max-width:450px){.identity-group{flex-wrap:wrap}.identity-group .post-identity{border-left:0;padding-left:0}.compact-header .session-box{display:flex}.timing-line{gap:10px}}

/* The prepared mission starts only from this deliberate play action. */
.mission-play{display:inline-grid;place-items:center;flex:0 0 34px;width:34px;height:34px;min-height:0;padding:0;border:1px solid #82edb0;border-radius:5px;background:#194b35;color:#baffd6;font-size:17px;line-height:1;cursor:pointer;box-shadow:0 0 12px #5cffa522}
.mission-play[hidden]{display:none}.mission-play:hover{background:#286c4d}.mission-play:focus-visible{outline:2px solid #d2ffdf;outline-offset:3px}
@media(max-width:450px){.timing-line{gap:7px}.compact-header #wallClock{font-size:18px}.compact-header #missionTime{font-size:26px}.mission-play{width:32px;height:32px;flex-basis:32px}}
.compact-header .timing-line{gap:8px}
/* More readable branding without changing the compact header hierarchy. */
.identity-group .wordmark{font-size:23px;letter-spacing:2px;line-height:1.15}
.identity-group .wordmark span{font-size:9px;line-height:1.5;letter-spacing:.6px;max-width:190px;color:#b8c9bf;margin-top:7px;font-weight:500}
@media(max-width:550px){.identity-group{flex-wrap:wrap}.identity-group .wordmark{font-size:22px}.identity-group .wordmark span{font-size:9px}.identity-group .post-identity{border-left:0;padding-left:0}}