/* Desktop game HUD. Scoped so the archive keeps its atlas layout. */
.game-ui{--hud-dark:#101d62;--hud-paper:#ffffff;--hud-mint:#e2f4ff;--hud-accent:#ffdf00}
/* One continuous hovering bar: .topbar itself now carries the card (background/border/shadow), and both
   children sit inside it without their own competing chip shapes. .brand stays as a slightly raised
   segment at the left end rather than a separate floating pill. */
.game-ui .topbar{position:fixed;top:20px;left:24px;right:24px;gap:12px;padding:6px;background:#101d62e8;border:1px solid #8fac9670;border-radius:12px;box-shadow:0 4px 16px #101d6220}
.game-ui .brand{background:var(--hud-dark);color:var(--hud-paper);border-color:#101d62;border-radius:8px;box-shadow:none;padding:10px 14px;font-size:20px}
.game-ui .brand-arrow{color:var(--hud-accent);border-color:#4a98d0}.game-ui .brand-note{display:none}
.game-ui .top-actions{padding:0;background:transparent;border:0;box-shadow:none;gap:7px}
.game-ui .icon-button{width:36px;height:36px;border:1px solid #4a98d0;border-radius:6px;background:#075ca8;color:#ffffff;box-shadow:none;font-size:16px}
.game-ui .icon-button:hover,.game-ui .history-link:hover{background:#075ca8}.game-ui .icon-button[aria-pressed=false]{opacity:.55;background:#075ca8;color:#c5edff}
.game-ui .history-link{background:transparent;color:#ffffff;border:0;padding:8px;font-size:11px}.game-ui .edition{color:#c5edff;font-size:8px;margin:0 8px;letter-spacing:1px}
.game-ui .intro{left:48px;top:145px;width:365px}.game-ui .intro h1{font-size:76px;line-height:.9;letter-spacing:-1px;text-shadow:2px 3px #ffffff}
.game-ui .intro .eyebrow{display:inline-block;background:#101d62;color:#c5edff;padding:8px 12px;transform:rotate(-2deg);font-size:9px}.game-ui .intro .live-dot{background:#ffdf00}
.game-ui .intro-copy{font-size:13px;line-height:1.8;color:#153974}.game-ui .route-form{padding:0 18px 18px;background:#fffffff5;border:2px solid #101d62;border-radius:12px 3px 12px 3px;box-shadow:6px 7px 0 #101d6230}
.mission-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #b2c3a7;margin-bottom:6px;padding:13px 0;font:bold 11px 'IBM Plex Mono',monospace;color:#153974}.mission-heading small{font-size:8px;background:#e2f4ff;padding:4px}
.game-ui .field{padding-top:13px;padding-bottom:13px}.game-ui .field select,.game-ui .field-search input{font-size:14px}.game-ui #swap{top:105px;right:19px;background:#ffdf00;border:2px solid #101d62;width:30px;height:30px;border-radius:50%}
/* Search combobox fields (Task 6, docs/plans/2026-09-08-current-area-journeys.md), replacing the old
   fixed-option <select>s. .field-search is the positioning root for its floating listbox. */
.game-ui .field-search{position:relative}
.game-ui .field-search input{display:block;width:100%;border:0;background:transparent;font-weight:700;outline-offset:1px;cursor:text;padding:0 18px 0 0;font-family:inherit}
.game-ui .field-search input::placeholder{color:#8891a6;font-weight:600}
.game-ui .field-search input:disabled{cursor:wait}
.game-ui .search-list{position:absolute;left:-2px;right:-2px;top:calc(100% + 6px);z-index:5;margin:0;padding:4px;list-style:none;background:#ffffff;border:2px solid #101d62;border-radius:8px;box-shadow:0 8px 20px #101d6230;max-height:224px;overflow-y:auto}
.game-ui .search-list[hidden]{display:none}
.game-ui .search-list li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:8px 10px;border-radius:5px;cursor:pointer;font-size:12px;color:#153974}
.game-ui .search-list li:hover,.game-ui .search-list li.active{background:#e2f4ff}
.game-ui .search-list .search-sub{flex-shrink:0;font-size:9px;color:#516585;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}
.game-ui .route-message{margin:0 2px 8px;font-size:10px;font-weight:700;line-height:1.5;color:#9b3b1f}
.game-ui .route-message:empty{display:none}
.game-ui .primary{background:#ffdf00;color:#101d62;font-weight:700;border:2px solid #101d62;box-shadow:0 4px 0 #101d62;border-radius:5px;font-size:14px;min-height:46px}
.game-ui .primary:hover{background:#ffdf00;transform:translateY(-1px)}.game-ui .intro-footnote{font-size:9px;letter-spacing:1.5px}
.game-ui .minimap-card{right:24px;top:102px;width:178px;border:3px solid #101d62;border-radius:10px;box-shadow:0 5px 0 #101d6240;padding:10px;background:#ffffff}
.game-ui .mini-heading,.game-ui .mini-footer{font-size:8px}.game-ui #minimap{border-radius:3px}.game-ui .district-chip{right:45px;top:288px;font-size:8px;border-radius:0 0 6px 6px;background:#101d62;color:#ffffff;padding:5px 12px}
.game-ui .weather-panel{top:323px;right:24px;width:178px;border:1px solid #4a98d0;border-radius:8px;background:#101d62f2;color:#ffffff;box-shadow:0 4px 0 #101d6230;font-size:11px}
.game-ui .weather-panel summary{padding:10px;font-size:10px;min-height:36px}.game-ui .weather-panel[open]{width:300px;max-height:calc(100vh - 355px);background:#ffffff;color:#101d62;border:2px solid #101d62}
.environment-heading{font:700 18px 'Barlow Condensed',sans-serif;padding:7px 0 10px}.environment-heading small{display:block;font:11px 'IBM Plex Sans',sans-serif;margin-top:4px;color:#516585}
.game-ui .weather-options{padding:0 14px 14px}.game-ui .weather-options select{border-radius:4px;padding:9px}.game-ui .activity-section,.game-ui .air-section{padding-top:12px;margin-top:12px}
.game-ui .journey-card{left:24px;top:108px;bottom:auto;width:280px;padding:16px 18px;background:#101d62f2;border:1px solid #4a98d0;border-left:5px solid #ffdf00;border-radius:3px 10px 10px 3px;box-shadow:0 6px 18px #101d6228;min-height:0}
.game-ui .journey-card h2{font-size:27px;margin:10px 0 5px}.game-ui .journey-card p{font-size:11px}.game-ui .card-eyebrow{font-size:9px;letter-spacing:.7px}.game-ui .journey-progress{margin:15px 0 10px;height:6px;border-radius:8px;background:#075ca8}.game-ui .journey-progress>div{background:#ffdf00;border-radius:8px}
.game-ui .journey-bottom{font-size:12px}.game-ui .text-button{font-size:10px;padding-top:13px}.game-ui .card-eyebrow>span{background:#ffdf00;color:#101d62;padding:3px 6px}
.game-ui .turn-card{right:24px;bottom:151px;top:auto;width:280px;min-height:0;padding:16px;background:#fffffff5;border:2px solid #101d62;border-radius:10px;box-shadow:0 5px 0 #101d6230}
.game-ui .turn-main{gap:12px;margin-top:12px}.game-ui .turn-main>span{width:52px;height:52px;font-size:38px;background:#075ca8;color:#ffffff;border:0;border-radius:8px}.game-ui .turn-main h2{font-size:30px;line-height:1}.game-ui .turn-card>p{font-size:12px;margin:10px 0;min-height:0}.game-ui .turn-footer{margin-top:12px;padding-top:10px}.game-ui .turn-footer button{font-size:9px;padding:7px;border-radius:4px}
.game-ui .playback{bottom:48px;width:580px;padding:11px 15px;background:#101d62f5;color:#ffffff;border:1px solid #4a98d0;border-radius:12px;box-shadow:0 5px 0 #101d6240;gap:12px}
.game-ui .play-button{width:42px;height:42px;border-radius:8px;background:#ffdf00;color:#101d62;font-size:20px;border:0}.game-ui .control-small{color:#c5edff}.game-ui .scrubber>div{color:#c5edff;font-size:8px}.game-ui .scrubber input{accent-color:#ffdf00}.game-ui .speed-button,.game-ui .camera-button{background:#075ca8;color:#ffffff;border:1px solid #4a98d0;border-radius:5px}
.game-ui .keyboard-hint{bottom:22px;color:#ffffff;background:#101d62d9;border-radius:4px;padding:4px 10px;font-size:9px}.game-ui kbd{background:#075ca8;color:#ffffff;border-color:#4a98d0}
.game-ui .toast{top:109px;left:50%;max-width:calc(100vw - 680px);background:#101d62e6;border:1px solid #4a98d0;color:#ffffff;box-shadow:none;border-radius:20px;padding:8px 18px;font-size:10px}
.game-ui .scene-caption{display:none}.game-ui .footer{bottom:3px;left:24px;right:24px;font-size:8px}.game-ui .footer-tag{background:#ffffffb0;font-size:6px}.game-ui .footer a,.game-ui #data-button{background:#ffffffc9;padding:2px 4px;border-radius:2px;font-size:8px}
.game-ui.arrived .turn-card{border-color:#699c58;background:#e3f1ca}.game-ui.arrived .toast{background:#ffdf00;color:#101d62}
.game-ui #pause-dialog{width:430px;padding:30px;border:2px solid #101d62;border-radius:14px;background:#ffffff;box-shadow:10px 12px 0 #101d6255}
.game-ui #pause-dialog h2{font-size:48px;margin:17px 0 12px;line-height:1}.game-ui #pause-dialog p{font-size:13px}.game-ui #pause-dialog::backdrop{background:#101d62aa;backdrop-filter:blur(4px)}.pause-actions{display:grid;gap:12px;margin:25px 0}.pause-actions button{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border:1px solid #4a98d0;border-radius:5px;background:#e2f4ff;color:#153974;font-weight:600}.pause-actions button.primary{background:#ffdf00;border:2px solid #101d62}.game-ui #pause-dialog small{font-size:10px;color:#516585}
@media(min-width:761px) and (max-height:780px){.game-ui .intro{top:112px}.game-ui .intro h1{font-size:62px;margin:17px 0}.game-ui .intro-copy{font-size:11px;margin-bottom:16px}.game-ui .intro-footnote{margin-top:13px}.game-ui .route-summary{padding:12px 0}.game-ui .turn-card{bottom:143px}}
@media(min-width:761px) and (max-width:1200px){.game-ui .edition{display:none}.game-ui .journey-card{width:245px}.game-ui .turn-card{width:250px}.game-ui .toast{max-width:calc(100vw - 590px)}.game-ui .playback{width:530px}}
/* .game-ui selectors outrank the base @media(max-width:760px) rules regardless of source order, so every
   playback control was pushed off a phone-width viewport with nothing narrower than 530px available. This
   restores just enough width for #play/#reset/#speed/#camera to stay reachable; it is not a mobile redesign. */
@media(max-width:760px){.game-ui .playback{width:calc(100% - 34px);gap:8px;padding:10px 12px}}

/* Environment controls occupy the former minimap space. */
.game-ui .weather-panel{top:102px}
.game-ui .weather-panel[open]{max-height:calc(100vh - 270px)}

/* Blue/cyan and electric yellow palette inspired by the supplied reference. */
.game-ui{--blue:#006bb5;--ink:#101d62;--yellow:#ffdf00;--muted:#516585;--white:#fff}
.game-ui .brand,.game-ui .top-actions{background:linear-gradient(125deg,#087daf,#101d62 72%,#49317a)}
.game-ui .intro h1,.game-ui .intro h1 em{color:#101d62}.game-ui .intro h1 em{color:#007caf}
.game-ui .sky-wash{background:linear-gradient(90deg,#eaf7fffa,#eaf7ffdc 24%,transparent 48%)}
.game-ui .field select,.game-ui .field-search input,.game-ui .route-summary,.game-ui .intro-footnote{color:#153974}
.game-ui .field>span,.game-ui .field label{color:#516585}
.game-ui .field:before{border-color:#048fca}.game-ui .route-form select{background-color:transparent}
.game-ui .mission-heading{border-color:#b6d5ec}.game-ui .turn-main h2{color:#101d62}
.game-ui .turn-card>p,.game-ui .turn-footer{color:#516585;border-color:#bfd9ee}
.game-ui .map-label{background:#fffffff2;color:#153974;border-color:#5095c4;box-shadow:2px 2px 0 #101d6230}
.game-ui .map-label i{background:#087daf}.game-ui .map-label.landmark{background:#e0f5ff;color:#104a83;border-color:#1598ce}
.game-ui .map-label.endpoint{background:#fff5a6;color:#101d62;border-color:#cfb600}.game-ui .map-label.endpoint i{background:#005db5}
.game-ui dialog{background:#fff;border-color:#101d62}.game-ui dialog h2{color:#101d62}.game-ui dialog p,.game-ui dialog li{color:#516585}
.game-ui .dialog-close{background:#e2f4ff;color:#101d62}
.game-ui button:focus-visible,.game-ui a:focus-visible,.game-ui select:focus-visible,.game-ui input:focus-visible{outline-color:#008dce}
.game-ui .intro h1 span{color:#007caf}.game-ui .intro h1 .title-period{color:#ffdf00}
.game-ui .route-badge{background:#e2f4ff;color:#153974;border-color:#4a98d0}
/* Keep navigation readable when environment settings are expanded. */
.game-ui.exploring .weather-panel[open]{max-height:calc(100vh - 460px)}
.game-ui .weather-panel[open] summary{position:sticky;top:0;z-index:1;background:#fff;border-bottom:1px solid #bfd9ee;color:#101d62}
.game-ui .weather-panel{scrollbar-width:thin;scrollbar-color:#087daf #e2f4ff;overscroll-behavior:contain}