/* Touch layout: the controls sit below the scene in portrait. */
#map-toolbar[hidden],.at-title #map-toolbar,body:has(.playing) #map-toolbar{display:none!important}
body:not(:has(.playing)){overflow-y:auto;min-height:100svh;height:auto}
html,body{touch-action:pan-x pan-y}button,a{touch-action:pan-x pan-y}
.touch-controls button,.touch-controls button *{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important;touch-action:none!important;-webkit-tap-highlight-color:transparent}.touch-controls button *{pointer-events:none}
html{-webkit-touch-callout:none}.game-shell,.game-shell *,img,canvas,.touch-controls,.touch-controls *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none}.map-node[hidden]{display:none!important}
.emenda-button{display:block!important;background:#ffe264!important;color:#122345!important;border:3px solid #122345!important;box-shadow:3px 3px #080f21!important;border-radius:5px!important;padding:12px 16px!important;min-height:48px;font:700 18px/1.25 'VT323',monospace!important;text-align:center;text-decoration:none!important;cursor:pointer}
.emenda-button:hover,.emenda-button:focus-visible{background:#fff3b2!important;outline:3px solid #fff!important;outline-offset:2px}
.phase-card .emenda-button{margin-top:8px;width:100%}.center>.emenda-button{margin:16px auto 0;width:100%}
@media(max-width:900px),(pointer:coarse){
 html,body{max-width:100%;overflow-x:clip}
 header{height:auto;min-height:0;flex-wrap:wrap;padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left));gap:10px}
 .brand{font-size:clamp(10px,2.8vw,14px);margin-right:auto}.brand small{font-size:10px;letter-spacing:2px}
 header>.icon-button{margin:0;width:44px;height:44px;flex:0 0 44px}
 .top-stats{order:3;width:100%;gap:10px;justify-content:space-between}.top-stats strong{font-size:12px}.top-stats small{font-size:10px}.city-stat{width:135px}.city-stat strong{font-size:12px}.city-stat small{font-size:8px}
 main{padding:8px 8px 0;width:100%;max-width:100%}.game-shell{margin:0;min-height:0;aspect-ratio:3/2;overflow:visible}
 main>.phase-card{position:relative;inset:auto;width:100%;margin:12px 0 0;min-height:0;display:grid;grid-template-columns:1fr;gap:8px;padding:14px}
 main>.phase-card>*{grid-column:1!important;grid-row:auto!important}main>.phase-card h2{font-size:13px;line-height:1.5}main>.phase-card p{font-size:17px;line-height:1.3}main>.phase-card .eyebrow{font-size:13px}main>.phase-card .primary{font-size:12px;min-height:48px;padding:12px}main>.phase-card .emenda-button{margin:0}
 .map-node{width:44px;height:44px;border-width:4px;display:grid;place-items:center}.node-number{font-size:12px;line-height:1}.map-node .node-name{display:none}.map-node.active .node-name{display:block;font-size:13px;top:44px;max-width:120px;white-space:normal}.map-node:hover .node-name{max-width:120px;white-space:normal}
 .map-note{top:5px;right:5px}.map-note button{min-height:40px;font-size:12px;padding:6px 8px}
 .at-title main>.phase-card{display:none}.at-title .game-shell{margin:0;min-height:min(600px,calc(100svh - 135px));aspect-ratio:3/4!important;overflow:hidden}.title-screen{padding:20px 12px;gap:12px}.title-logo h1{font-size:clamp(21px,5.4vw,36px)}.title-logo small{font-size:14px;letter-spacing:1px}.title-menu button{min-height:48px;font-size:22px}.title-save{font-size:17px}
 .game-shell.playing{height:auto;min-height:0;aspect-ratio:auto;overflow:hidden;margin:0;border-radius:0;isolation:isolate}
 .game-shell.playing canvas{position:relative;display:block;width:100%;height:auto;aspect-ratio:1/1;touch-action:none}
 .platform-hud{padding:8px;gap:6px;align-items:flex-start;z-index:5}.platform-hud>div:first-child{min-width:0;flex:1}.platform-hud>div:first-child span{max-width:180px;font-size:9px;line-height:1.5;overflow-wrap:anywhere}.platform-hud strong{font-size:17px;letter-spacing:1px}.hud-center{flex-direction:column;align-items:flex-end;gap:6px}.hud-center span:first-child{font-size:10px;white-space:nowrap}.hud-center span:last-child{font-size:11px;max-width:100px;text-align:right}.platform-hud .icon-button{width:44px;height:44px;flex:0 0 44px;font-size:22px}
 .touch-controls{position:relative;inset:auto;display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;min-height:112px;padding:14px max(12px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#122345;border-top:2px solid #4c6690;z-index:6;touch-action:none;-webkit-user-select:none;user-select:none}
 .touch-controls>div{gap:10px;align-items:center}.touch-controls button{width:clamp(56px,15vw,76px);height:clamp(62px,16vw,78px);min-width:56px;min-height:62px;border:3px solid #edf4ff;border-radius:15px;background:#2b517c;font-size:24px;touch-action:none;-webkit-touch-callout:none;user-select:none}
 .touch-controls small{font:13px/1.2 'VT323',monospace;letter-spacing:0;margin-top:4px}.touch-controls #jump{background:#cf4b48;color:white}.touch-controls #run{width:52px;min-width:52px;height:56px;min-height:56px;background:#2f6c82;font-size:19px}.touch-controls button.pressed{background:#ffe264!important;color:#122345;transform:translateY(3px)}
 .tutorial{bottom:126px;max-width:92%;width:max-content;padding:8px 10px;font-size:15px;line-height:1.2;z-index:4}.control-strip{font-size:15px;line-height:1.4}.desktop-keys{display:none}
 dialog{width:calc(100% - 24px);max-width:600px;max-height:calc(100dvh - 32px);overflow:auto;padding:48px 16px 20px;overscroll-behavior:contain}dialog .close{width:44px;height:44px;top:7px;right:7px}dialog h2{font-size:15px;overflow-wrap:anywhere}dialog p{font-size:18px}.detail-grid{grid-template-columns:1fr;gap:14px}.detail-grid strong{overflow-wrap:anywhere}.button-row{gap:10px}.primary,.secondary,.text-button,.place-list button{min-height:44px}.funding-reveal h3{font-size:13px;line-height:1.5;overflow-wrap:anywhere}
 footer{gap:10px;padding:16px;font-size:11px;flex-wrap:wrap}
}
@media(orientation:landscape) and (max-height:600px){
 body:has(.playing){overflow:hidden;overscroll-behavior:none}body:has(.playing) header,body:has(.playing) footer,body:has(.playing) .control-strip{display:none}body:has(.playing) main{padding:0}
 .game-shell.playing{height:100dvh;width:100%;border:0;aspect-ratio:auto}.game-shell.playing canvas{width:100%;height:100%;aspect-ratio:auto}
 .touch-controls{position:absolute;inset:auto 0 0;min-height:0;border:0;background:transparent;padding:8px max(18px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}.touch-controls button{width:64px;height:62px;min-height:62px}.touch-controls #run{width:52px;height:52px;min-height:52px}.tutorial{bottom:80px;max-width:65%;font-size:14px}
 .platform-hud{padding:7px max(12px,env(safe-area-inset-right)) 7px max(12px,env(safe-area-inset-left))}.platform-hud>div:first-child span{max-width:none;font-size:9px}.hud-center{flex-direction:row;gap:14px}.hud-center span:last-child{max-width:none}.platform-hud strong{font-size:14px;margin-top:0}
 .at-title .game-shell{aspect-ratio:16/9!important;min-height:370px}.title-logo h1{margin:12px 0}.title-screen{gap:7px}.title-menu{gap:5px}
}
@media(max-width:360px){.touch-controls{gap:6px;padding-left:8px;padding-right:8px}.touch-controls>div{gap:6px}.touch-controls button{width:56px;min-width:56px}.touch-controls #run{width:46px;min-width:46px}.hud-center span:first-child{font-size:9px}.platform-hud>div:first-child span{font-size:8px}}
.tutorial{top:var(--notice-top,90px)!important;bottom:auto!important;max-width:88%;z-index:7}.completion-actions{display:grid;gap:12px}.completion-actions .emenda-button{margin:0!important}
@media(max-width:900px),(pointer:coarse){
 dialog{max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:8px 14px 16px;scrollbar-width:thin;scrollbar-color:#ffe264 #203e63}
 .dialog-toolbar{position:sticky;top:-8px;z-index:10;display:flex;justify-content:flex-end;padding:4px 0;background:#142b4b}
 dialog .dialog-toolbar .close{position:static;float:none;margin:0;width:44px;height:44px;flex:none}
 .completion-panel{display:grid;gap:12px;text-align:left}.completion-heading{text-align:center}.completion-heading .celebration{font-size:28px;line-height:1}.completion-heading h2{font-size:14px;line-height:1.5;margin:8px 0 0}.completion-heading .eyebrow{font-size:12px}
 .completion-panel .completion-story{font:15px/1.45 system-ui,sans-serif;margin:0}.completion-panel .funding-reveal{padding:13px;border-width:2px;margin:0}.completion-panel .funding-reveal h3{font:700 19px/1.25 system-ui,sans-serif;letter-spacing:0;margin:8px 0}.completion-panel .funding-reveal>strong{font:700 23px/1.2 system-ui,sans-serif;margin:8px 0}.completion-panel .funding-reveal>span{font:13px/1.35 system-ui,sans-serif}.completion-panel .funding-reveal p{font:14px/1.4 system-ui,sans-serif;margin:10px 0}.completion-panel .funding-reveal a{display:inline-block;font:700 14px/1.4 system-ui,sans-serif;padding:8px 0;min-height:36px}
 .completion-panel .score-grid{margin:0;gap:8px}.completion-panel .score-grid>div{padding:12px;text-align:center}.completion-panel .score-grid strong{font-size:18px}.completion-panel .score-grid small{font-size:15px}.completion-actions{gap:10px}.completion-actions button{width:100%;min-height:48px}.completion-panel>.place-credit{font:12px/1.4 system-ui,sans-serif!important;margin:0}
 .tutorial{font-size:15px;line-height:1.25;max-width:94%;padding:8px 10px}
}
@media(orientation:landscape) and (max-height:600px){
 dialog{max-width:850px;width:calc(100% - 32px)}.completion-panel{grid-template-columns:1fr 1fr;gap:10px 16px}.completion-heading{grid-column:1/-1}.completion-heading .celebration{display:none}.completion-heading h2{font-size:13px;margin:5px 0}.completion-panel .completion-story{grid-column:1;font-size:13px}.completion-panel .funding-reveal{grid-column:2;grid-row:2/5}.completion-panel .score-grid,.completion-actions{grid-column:1}.completion-panel>.place-credit{grid-column:1/-1}.completion-panel .funding-reveal h3{font-size:17px}.completion-panel .funding-reveal>strong{font-size:20px}.tutorial{font-size:14px}
}
.emenda-button{background:#46d5dc!important;color:#092939!important;border-color:#0b3b50!important;box-shadow:3px 3px #061c2d!important}.emenda-button:hover,.emenda-button:focus-visible{background:#a6f7f2!important}
.map-tools{position:absolute;left:14px;top:14px;z-index:5;display:flex;gap:6px}.map-tools button{min-width:44px;min-height:44px;padding:6px 10px;border:2px solid #fff2bb;background:#142b4b;color:#fff1ba;font:19px 'VT323',monospace;cursor:pointer}.game-shell:not(.playing){touch-action:none;cursor:grab;overflow:hidden}.game-shell.dragging-map{cursor:grabbing}.playing .map-tools,.at-title .map-tools{display:none}
@media(max-width:900px),(pointer:coarse){.map-tools{top:auto;bottom:6px;left:6px;gap:4px}.map-tools button{font-size:15px;min-width:40px;min-height:40px;padding:4px 8px}}

.game-shell:not(.playing),.game-shell:not(.playing) canvas,.game-shell:not(.playing) #map-nodes,.at-title .title-screen{touch-action:pan-y}.title-screen{overflow-y:auto;justify-content:safe center}.map-tools button,.map-node{touch-action:pan-y}
/* Mobile overworld: artwork, navigation and selected chapter in distinct rows. */
@media(max-width:900px),(pointer:coarse){
 body:not(.at-title):not(:has(.playing)) main{padding:12px;max-width:100%;display:flex;flex-direction:column;gap:0}
 body:not(.at-title):not(:has(.playing)) header{padding:12px;gap:10px;border-bottom:1px solid #2b405e}
 body:not(.at-title):not(:has(.playing)) .top-stats{display:grid;grid-template-columns:1fr .8fr 1.15fr;gap:8px}
 body:not(.at-title):not(:has(.playing)) .top-stats>span{padding:9px 8px;background:#192a46;border:1px solid #304563;min-width:0}
 body:not(.at-title):not(:has(.playing)) .top-stats small{font-size:10px;letter-spacing:.4px;white-space:nowrap}
 body:not(.at-title):not(:has(.playing)) .top-stats strong{font-size:12px;margin-top:5px}
 body:not(.at-title):not(:has(.playing)) .city-stat{width:auto;display:flex;flex-direction:column}
 body:not(.at-title):not(:has(.playing)) .city-stat strong{position:static;text-align:left}
 body:not(.at-title):not(:has(.playing)) .city-stat progress{width:100%;margin-top:7px;height:5px}
 body:not(.at-title) .game-shell:not(.playing){border:3px solid #54749b;box-shadow:none;aspect-ratio:4/3;width:100%;margin:0}
 .game-shell:not(.playing) .map-node{width:44px;height:44px;border:0!important;background:transparent!important;box-shadow:none!important;display:grid;place-items:center}
 .game-shell:not(.playing) .map-node .node-number{display:grid;place-items:center;width:28px;height:28px;line-height:1;border:2px solid #122345;border-radius:50%;background:#a28d66!important;box-shadow:0 2px #122345;font-size:11px}
 .game-shell:not(.playing) .map-node.done .node-number{background:#f9e790!important}
 .game-shell:not(.playing) .map-node.active .node-number{width:32px;height:32px;background:#ffe264!important;outline:2px solid white;outline-offset:1px}
 .game-shell:not(.playing) .map-node.active .node-name{top:42px;font-size:13px;padding:4px 8px}
 #map-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#172b47;border:1px solid #3e597c;border-top:0;padding:8px}
 #map-toolbar .map-tools,#map-toolbar .map-note{position:static;inset:auto;margin:0;display:flex;gap:5px;visibility:visible}
 #map-toolbar .map-tools button,#map-toolbar .map-note button{min-height:44px;min-width:36px;padding:6px;border:1px solid #7292b7;box-shadow:none;font:15px/1.1 'VT323',monospace;letter-spacing:0}
 #map-toolbar .map-tools button[data-zoom=fit]{max-width:76px}
 #map-toolbar .map-note button{max-width:100px;color:#d8eeff;background:#24456a}
 main>.phase-card{margin:12px 0 0;padding:16px;border:1px solid #47658a;border-top:3px solid #ffe264;box-shadow:none;background:#192e4d;gap:9px}
 main>.phase-card .eyebrow{font-size:12px;letter-spacing:1px}
 main>.phase-card h2{font-size:14px;line-height:1.5;margin:0}
 main>.phase-card p{font:14px/1.45 system-ui,sans-serif;color:#c1d3e9;margin:0 0 5px}
 main>.phase-card .primary{font-size:11px;min-height:50px;padding:12px;box-shadow:inset 0 -3px #bd922e;border-width:2px}
 main>.phase-card .emenda-button{font-size:18px!important;min-height:46px;padding:10px!important;border-width:1px!important;box-shadow:inset 0 -2px #228c99!important;border-radius:0!important}
 body:not(.at-title):not(:has(.playing)) .control-strip{padding:12px 4px 8px;line-height:1.5;font-size:14px;color:#aabfd8}
 body:not(.at-title):not(:has(.playing)) .control-strip b{font-size:9px;margin-bottom:3px}
 body:not(.at-title):not(:has(.playing)) footer{display:grid;grid-template-columns:1fr 82px;gap:4px 12px;padding:14px 16px;border-top:1px solid #2b405e;align-items:center;margin-top:4px}
 body:not(.at-title):not(:has(.playing)) footer>span{font:10px/1.5 system-ui,sans-serif;margin:0}
 body:not(.at-title):not(:has(.playing)) footer img{grid-column:2;grid-row:1/3;width:82px;height:auto;margin:0}
}
@media(orientation:landscape) and (max-height:600px){
 body:not(.at-title):not(:has(.playing)) main{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,1fr);gap:0 14px;align-items:start}
 body:not(.at-title) .game-shell:not(.playing){grid-column:1;grid-row:1;aspect-ratio:3/2}
 #map-toolbar{grid-column:1;grid-row:2}
 main>.phase-card{grid-column:2;grid-row:1/3;margin:0;height:100%;align-content:center}
 body:not(.at-title):not(:has(.playing)) .control-strip{grid-column:1/-1}
}
.difficulty-picker{text-align:center}.difficulty-picker h2{margin:14px 0 24px}.difficulty-icons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:24px 0}.difficulty-icons button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-height:150px;padding:20px 8px;border:2px solid currentColor;background:#203b59;color:#65e6b0;box-shadow:4px 4px #081426;cursor:pointer;touch-action:pan-y}.difficulty-icons [data-difficulty=normal]{color:#ffe264}.difficulty-icons [data-difficulty=hard]{color:#ff858c}.difficulty-icons .difficulty-symbol{font:52px/1 monospace;text-shadow:3px 3px #0a1a30}.difficulty-icons strong{font:12px/1.4 'Press Start 2P',monospace}.difficulty-icons button:hover,.difficulty-icons button:focus-visible{background:#2c5277;outline:3px solid #fff;outline-offset:3px}.difficulty-picker>.text-button{min-height:44px;padding:10px 24px}.difficulty-icons button:active{transform:translateY(2px)}@media(max-width:600px){.difficulty-picker h2{font-size:13px}.difficulty-icons{gap:8px;margin:20px 0}.difficulty-icons button{min-height:120px;padding:16px 4px;gap:14px;box-shadow:2px 2px #081426}.difficulty-icons .difficulty-symbol{font-size:40px}.difficulty-icons strong{font-size:9px}}@media(orientation:landscape) and (max-height:500px){.difficulty-icons{margin:14px 0}.difficulty-icons button{min-height:104px;padding:12px;gap:10px}.difficulty-icons .difficulty-symbol{font-size:36px}.difficulty-picker h2{margin:6px 0 14px}}
/* Mission inventory stays between the stage name and resource counter. */
.platform-hud{display:grid;grid-template-columns:minmax(180px,1fr) auto auto 44px;gap:20px;align-items:center}
.mission-objectives{text-align:center;min-width:0}.objectives-label{display:block;font:11px/1 'VT323',monospace;letter-spacing:1.5px;color:#c5d9ee;margin-bottom:6px}.objective-slots{display:flex;justify-content:center;gap:7px}.objective-slot{position:relative;display:grid;place-items:center;width:39px;height:37px;background:#0b1930;border:2px solid #60789b;box-shadow:2px 2px #081222;transition:background .15s,border-color .15s}.objective-symbol{font:25px/1 monospace;color:#7c94b1}.objective-mark{position:absolute;right:-4px;bottom:-5px;min-width:14px;height:14px;display:grid;place-items:center;font:11px/1 monospace;background:#294464;color:#c8dbee;border:1px solid #6d8daf}.objective-slot.collected{background:#ffe264;border-color:#fff2b5}.collected .objective-symbol{color:#183a4b}.collected .objective-mark{background:#54d7a1;color:#092f27;border-color:#c2ffe1;font-weight:bold}.platform-hud .hud-center{flex-direction:column;align-items:flex-end;gap:7px}
@media(max-width:600px){
 .platform-hud{grid-template-columns:minmax(0,1fr) auto 44px;gap:6px 10px;padding:8px 10px}
 .platform-hud>div:first-child{grid-column:1/3;grid-row:1}.platform-hud>div:first-child span{max-width:none;font-size:9px}.platform-hud>div:first-child strong{font-size:14px;margin-top:2px}
 .platform-hud #pause{grid-column:3;grid-row:1}.mission-objectives{grid-column:1;grid-row:2;justify-self:start}.objectives-label{text-align:left;font-size:10px;margin-bottom:4px}.objective-slots{gap:6px}.objective-slot{width:32px;height:28px}.objective-symbol{font-size:21px}.objective-mark{font-size:9px;min-width:12px;height:12px;bottom:-3px}
 .platform-hud .hud-center{grid-column:2/4;grid-row:2;gap:5px;align-self:center}.hud-center span:last-child{max-width:none!important}.platform-hud .hud-center span:first-child{font-size:12px}
}
@media(orientation:landscape) and (max-height:600px){
 .platform-hud{grid-template-columns:minmax(160px,1fr) auto auto 44px;gap:12px;align-items:center}.platform-hud>div:first-child,.platform-hud #pause,.mission-objectives,.platform-hud .hud-center{grid-column:auto;grid-row:auto}.objective-slot{width:32px;height:29px}.objective-symbol{font-size:21px}.objectives-label{font-size:10px;margin-bottom:4px}.platform-hud .hud-center{gap:5px}.platform-hud>div:first-child span{font-size:9px}
}
/* Keep stage actions outside the map viewport on every screen size. */
main>.phase-card{position:relative;inset:auto;width:100%;min-width:0;margin-top:12px;z-index:auto}
.at-title main>.phase-card{display:none}
#map-nodes{position:absolute;inset:0;overflow:hidden;pointer-events:none}
#map-nodes .map-node{pointer-events:auto}
@media(min-width:901px) and (pointer:fine){main>.phase-card{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:6px 24px;margin:16px 0 0;padding:20px 24px;box-shadow:none}main>.phase-card .primary{grid-column:2;grid-row:1/3}main>.phase-card .emenda-button{grid-column:2;grid-row:3;margin:0}main>.phase-card h2{margin:0}}
@media(orientation:landscape) and (max-height:600px){main>.phase-card{margin-top:0}}
/* The desktop chapter card overlays the artwork, above the marker layer. */
#map-nodes{z-index:2;isolation:isolate}
.game-shell>.phase-card{z-index:6;background:#14294a;position:absolute;top:auto;left:18px;right:18px;bottom:16px;width:auto;margin:0;isolation:isolate}

/* Phase names are part of their button, including outside its circular marker. */
#map-nodes .map-node .node-name{display:block;pointer-events:auto;cursor:pointer}
#map-nodes .map-node:hover,#map-nodes .map-node:focus-visible{z-index:5}
