/* Atmosphr colour treatment; the classic viewer grid and control order stay intact. */
:root{color-scheme:dark;--viewer-bg:#17191d;--viewer-panel:#1d2025;--viewer-raised:#252930;--viewer-ink:#eceef2;--viewer-muted:#acb3bf;--viewer-line:rgba(255,255,255,.13);--viewer-accent:#f5cd62;--viewer-active:rgba(200,159,13,.14)}
body{background:#101216;color:var(--viewer-ink);font-family:"Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.page{background:var(--viewer-bg);box-shadow:none;border-inline:1px solid var(--viewer-line)}
a{color:#c7d0dc;text-underline-offset:3px}a:hover{color:var(--viewer-accent)}
header{background:var(--viewer-panel);border-bottom:1px solid var(--viewer-line);padding-block:20px}
header nav{gap:8px 20px}header nav a{display:inline-flex;align-items:center;min-height:36px;text-decoration:none;color:var(--viewer-muted)}
.brand{display:block;flex:none;font-weight:500;line-height:1.2}
.viewer-wordmark{display:block;position:relative;overflow:hidden;width:184px;aspect-ratio:1700 / 390}
.viewer-wordmark img{position:absolute;width:127.764706%;max-width:none;height:auto;left:-14.117647%;top:-41.025641%}
.brand small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--viewer-muted);margin-top:8px}
.breadcrumb,.fine,.keyboard-help,.local-intro,.timeline-labels{color:var(--viewer-muted)}
h1{font-weight:500;letter-spacing:-.025em;font-size:25px;margin:12px 0}
h2{background:var(--viewer-raised);color:var(--viewer-ink);border-bottom:1px solid var(--viewer-line);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:9px 8px}
.toolbar,.ranges{background:var(--viewer-panel);border-color:var(--viewer-line);padding:6px;gap:6px}
.toolbar{border-radius:6px 6px 0 0}.toolbar a{display:inline-flex;align-items:center;min-height:32px;text-decoration:none}.toolbar strong{color:var(--viewer-accent);font-weight:500}
.ranges{border-radius:0 0 6px 6px}.ranges strong{color:var(--viewer-muted);font-weight:500}
button,select{border:1px solid var(--viewer-line);border-radius:5px;background:var(--viewer-raised);color:var(--viewer-ink);min-height:38px}
button:hover{background:#30353d;border-color:#737a85}button:disabled{opacity:.45}
.ranges button{border:1px solid transparent;text-decoration:none;background:transparent;color:var(--viewer-muted);font-weight:500}
.ranges button[aria-pressed=true],button[aria-pressed=true]{background:var(--viewer-active);color:var(--viewer-accent);border-color:#b79a48;box-shadow:inset 0 0 0 1px rgba(245,205,98,.2)}
.controls #play{background:var(--viewer-active);color:var(--viewer-accent);border-color:#b79a48;font-weight:600}
.workspace{border-color:var(--viewer-line);background:var(--viewer-line);gap:3px}
.radar-panel{background:var(--viewer-bg)}.controls{background:var(--viewer-panel)}.information{background:#1b1e23}
.source{background:#252930;color:var(--viewer-muted);padding:6px 8px;font-weight:400}
.time{background:#17191d;border:1px solid var(--viewer-line);border-radius:5px;color:var(--viewer-muted);padding:12px 4px;margin:7px 5px}
.time time{color:var(--viewer-accent);font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}.time strong{font-weight:400;font-size:12px}
.controls input{accent-color:var(--viewer-accent)}.controls select{padding:5px;color:var(--viewer-ink)}.controls option{background:var(--viewer-panel)}
.controls input[type=range]{min-height:24px}.controls label,.controls output{color:var(--viewer-muted)}
.controls p,.information p{color:var(--viewer-muted);line-height:1.65}.controls label:has(input[type=checkbox]){display:flex;align-items:center;gap:6px;min-height:32px}
.legend{padding:10px 8px;color:var(--viewer-muted)}.legend strong{font-weight:500;color:var(--viewer-ink)}.scale{border-color:#717984;border-radius:2px}
.age-badge{color:#aed9c6;background:rgba(74,135,108,.13);border-color:rgba(130,186,158,.32);border-radius:5px;font-variant-numeric:tabular-nums}
.age-badge.stale{color:#f5cd62;background:var(--viewer-active);border-color:#8c7438}
.nearby-location{border-color:var(--viewer-line);padding:11px 4px}.nearby-location strong{font-weight:500}.nearby-location span{color:var(--viewer-muted)}.nearby-location:hover{background:var(--viewer-raised)}
.location-link{background:var(--viewer-panel);border-color:var(--viewer-line);border-radius:5px;font-weight:500}
footer{background:var(--viewer-panel);border-color:var(--viewer-line);color:var(--viewer-muted);line-height:1.7}
.skip{background:var(--viewer-panel);color:var(--viewer-ink)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--viewer-accent);outline-offset:3px}
#map:focus-visible{outline:2px solid var(--viewer-accent);outline-offset:-3px}
/* Map labels keep a light ground for the existing colour basemap. */
.leaflet-container{color:#222;color-scheme:light}.leaflet-control-attribution{background:rgba(255,255,255,.85);color:#39424d}.leaflet-control-attribution a{color:#245480}
@media(max-width:580px){
 .page{border:0}.viewer-wordmark{width:152px}header nav{gap:6px 16px;margin-top:12px}
 h1{font-size:22px}button,.controls .buttons button,select{min-height:44px}
 .ranges button{min-width:58px}.toolbar a{min-height:38px}
 .controls label:has(input[type=checkbox]){min-height:40px}
 .information h2,.controls h2{padding-block:11px}
}
