[hidden]{display:none!important}
body[data-flow] #title-screen{display:flex;padding:24px;background:linear-gradient(90deg,#061012d9,#08131988),url('assets/forest-background.png') center/cover;align-items:center;justify-content:center;text-align:center}
body[data-flow] #title-screen .title-copy{width:auto;max-width:90%;padding:0;position:static;margin:auto}
body[data-flow] #title-screen h1{font-size:clamp(36px,5vw,74px)}body[data-flow] #title-screen h1 span{font-size:.52em;padding-left:0}
body[data-flow] #title-screen .primary-button{margin:42px auto 0;min-width:230px;justify-content:center}
body[data-flow] #title-screen .title-version{margin-top:25px;color:#9db0a7;font-size:11px;letter-spacing:2px}
body[data-flow]:not([data-flow=COMBAT]):not([data-flow=RESULT]):not([data-flow=DEFEAT]) .footer .controls,
body[data-flow]:not([data-flow=COMBAT]):not([data-flow=RESULT]):not([data-flow=DEFEAT]) .top-center,
body[data-flow]:not([data-flow=COMBAT]):not([data-flow=RESULT]):not([data-flow=DEFEAT]) #help-button{visibility:hidden}
body[data-flow]:not([data-flow=COMBAT]):not([data-flow=RESULT]):not([data-flow=DEFEAT]) .edge-label{display:none}
#main-flow{position:absolute;inset:0;pointer-events:none;z-index:35;color:#e9e8dd;font-family:inherit}
#main-flow button{cursor:pointer;font:inherit;color:inherit}#main-flow button:focus-visible{outline:2px solid #cff5e5;outline-offset:4px}
#main-flow>section{pointer-events:auto}#hub-screen{position:absolute;inset:0;background:#080d10}
#hub-frame{width:100%;height:100%;border:0;display:block}#hub-loading{position:absolute;inset:0;display:grid;place-items:center;color:#cfbd8d}
.hub-status{position:absolute;top:16px;left:20px;display:flex;gap:16px;font-size:12px;background:#0b151be0;border:1px solid #9ca88d66;padding:9px 14px;pointer-events:none}
.hub-status span:first-child{color:#dac390}
#world-map{position:absolute;inset:0;display:flex;flex-direction:column;background:#060e13}
.map-toolbar{display:flex;align-items:center;gap:14px;min-height:50px;padding:8px 20px;background:#101b20;border-bottom:1px solid #3a5158;font-size:13px}
.map-toolbar button,.flow-actions>button:not(.primary-button){border:1px solid #60737a;background:#17262a;padding:7px 16px}
.map-toolbar>span:first-of-type{color:#e7d4a3;letter-spacing:3px}.map-current{margin-left:auto;color:#c0d0ca}.map-toolbar kbd{font-size:10px;margin-left:6px}
.map-space{flex:1;min-height:0;display:grid;place-items:center;position:relative;container-type:size;overflow:hidden}
#map-art{position:relative;width:min(100cqw,177.68544cqh);aspect-ratio:1672/941;max-width:100%;max-height:100%}
#map-image{width:100%;height:100%;display:block;object-fit:contain}#map-hotspots{position:absolute;inset:0}
.map-node{position:absolute;transform:translate(-50%,-50%);border:2px solid transparent;border-radius:50%;background:transparent;min-width:24px;padding:0;transition:box-shadow .15s,background .15s}
.map-node:hover,.map-node[aria-pressed=true]{background:#9cecd225;border-color:#b8ffe1;box-shadow:0 0 18px #8fffce99,inset 0 0 12px #a8f7d866}
.map-node:disabled{background:#05070cd9;border-color:#6b7183;cursor:not-allowed!important}.map-node[data-status=locked]:after{content:'🔒'}
.node-completed{position:absolute;right:-6px;bottom:-3px;font-size:12px;border-radius:50%;background:#244b3d;border:1px solid #a7e7bb;padding:1px 4px;color:#caffcf}
#map-art-back{position:absolute;right:1.7%;top:2%;width:6.6%;height:4.5%;background:transparent;border:0}
#map-loading{position:absolute;color:#d7c498}.map-help{font-size:11px;text-align:center;letter-spacing:1px;margin:0;padding:10px;color:#94ada9}
.flow-overlay{position:absolute;inset:0;background:#030910bb;backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px;z-index:5}
.flow-card{width:min(480px,100%);max-height:100%;overflow:auto;padding:30px;background:linear-gradient(135deg,#19292b,#111821);border:1px solid #918766;box-shadow:0 20px 80px #0009}
.flow-card>small{color:#c9b780;letter-spacing:3px;font-size:11px}.flow-card h2{font-weight:400;letter-spacing:4px;font-size:28px;margin:14px 0 24px}
.strategy-options{display:grid;gap:12px}.strategy-options button{padding:18px;text-align:left;border:1px solid #596869;background:#0f191dbb;display:grid;gap:9px}.strategy-options strong{font-size:17px;font-weight:500}.strategy-options span{font-size:12px;color:#a4b3af}
.strategy-options button[aria-pressed=true]{border-color:#e2cb8b;background:#453d244d;box-shadow:inset 3px 0 #dec489}
.flow-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px;margin-top:26px}.flow-actions .primary-button{margin:0;min-height:42px;padding:10px 28px}
#departure-details{display:grid;grid-template-columns:95px 1fr;gap:17px;font-size:15px}#departure-details dt{color:#9caea8}#departure-details dd{margin:0;color:#f0dfb1}#departure-status{font-size:12px;color:#b5cac0}
#flow-fade{position:absolute;inset:0;pointer-events:none;background:#04080b;opacity:0}#flow-fade.fade{animation:flow-fade .35s ease-out}@keyframes flow-fade{from{opacity:.8}to{opacity:0}}
#flow-debug{position:absolute;right:10px;top:10px;z-index:80;max-width:255px;background:#03080eea;border:1px solid #766e50;padding:10px;color:#c1caca;font:10px monospace}#flow-debug button{font:10px sans-serif;margin:3px;padding:4px}#flow-debug pre{font-size:9px}
body[data-flow=MAP] #flow-debug,body[data-flow=MAP_CONFIRM] #flow-debug{opacity:.65;top:auto;bottom:0}
#modal .modal-actions{flex-wrap:wrap}
@media(max-width:650px){.map-toolbar{padding:6px 8px;gap:6px;font-size:11px}.map-toolbar button{padding:6px 9px}.map-current{font-size:10px}.map-help{font-size:9px}.hub-status{font-size:10px;gap:8px;padding:7px;left:8px;top:8px}.flow-card{padding:22px}.map-node{min-width:20px}}

body[data-flow-debug=true] .map-node{border-color:#ffd78388}body[data-flow=TITLE] #loading{display:none}

#main-flow .primary-button{color:#172d27}

#flow-debug.folded{width:auto}#flow-debug.folded>:not(#debug-collapse){display:none}#debug-collapse{float:right}

.merchant-open .hub-status{display:none}
body:has(.merchant-open) #flow-debug{display:none}

/* A physical map unfolds inside the viewport; chapter edges remain directly reachable. */
#map-prev,#map-next{position:absolute;top:50%;z-index:3;width:54px;height:86px;padding:0;font-size:42px;background:#0b1b20ed;border:1px solid #c3ae78;box-shadow:0 3px 20px #0009}
#map-prev{left:12px}#map-next{right:12px}#map-prev:disabled,#map-next:disabled{opacity:.3;cursor:default}

.map-mist{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;image-rendering:pixelated}
#map-selection{color:#e6d39e;margin-right:10px}
#journey-loading{position:absolute;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;color:#e9ddba;background:radial-gradient(ellipse at 50% 45%,#25434488,transparent 60%),linear-gradient(140deg,#0b171d,#081117 65%,#182727);font-family:inherit;outline:0;animation:journey-arrive .3s ease-out}
#journey-loading:before,#journey-loading:after{content:'';position:absolute;inset:18px;border:1px solid #a894624f;pointer-events:none}#journey-loading:after{inset:-40%;border:0;background:repeating-linear-gradient(155deg,transparent 0 110px,#89b1ad08 140px,transparent 250px);animation:journey-mist 9s linear infinite}
#journey-loading>*{z-index:1}.journey-compass{color:#d8c68f;font-size:76px;line-height:1;text-shadow:0 0 30px #c5d8ac55}#journey-loading small{font-size:10px;letter-spacing:6px;color:#9eb7b5;margin:20px 0 4px}#journey-loading h2{font-size:clamp(24px,3.4vw,46px);letter-spacing:.25em;font-weight:400;margin:12px 0}.journey-destination{font-size:15px;letter-spacing:3px;color:#c4b58c}.journey-track{width:min(640px,76%);margin-top:22px}.journey-bar{height:22px;padding:4px;border:1px solid #c9b783;background:#050d13;box-shadow:0 0 0 3px #17272c}.journey-bar i{display:block;height:100%;background:repeating-linear-gradient(90deg,#a4c9bb 0 13px,#668c86 13px 15px,transparent 15px 18px);box-shadow:0 0 14px #99e0cc44}.journey-track canvas{display:block;width:100%;height:auto;image-rendering:pixelated;border-bottom:1px solid #758e7955}.journey-status{font-size:12px;letter-spacing:2px;color:#c5d7d0}.journey-tip{margin-top:16px;font-size:11px;color:#91a5a3;letter-spacing:2px}
@keyframes journey-arrive{from{opacity:0}to{opacity:1}}@keyframes journey-mist{from{transform:translateX(-8%)}to{transform:translateX(8%)}}
@media(max-width:650px){#map-prev,#map-next{width:34px;height:66px;font-size:30px}#map-prev{left:4px}#map-next{right:4px}.map-help{letter-spacing:0}.journey-compass{font-size:42px}#journey-loading small{margin-top:10px}.journey-track{margin-top:8px}.journey-tip{margin-top:6px;font-size:9px}}
@media(prefers-reduced-motion:reduce){#journey-loading,#journey-loading:after{animation:none}}

/* Continuous map frame; cover the baked stepped header rules with adjacent map texture. */
#map-frame{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
