/* Real local footage; preserve the existing desktop design. */
#journey-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#090d10;filter:none;animation:none;transform:none}
#big-screen{background:#090d10}.screen-shade{pointer-events:none;background:linear-gradient(transparent 64%,#070d1555)}
.screen.playing .screen-title,.screen.playing .screen-disclaimer,.screen.playing .screen-date,.screen.playing #play-preview{opacity:0;pointer-events:none}.screen-title,.screen-disclaimer,.screen-date,#play-preview{transition:opacity .2s}.screen-title{pointer-events:none}.screen-corner{pointer-events:none}
.screen.playing:hover #play-preview,.screen.playing:focus-within #play-preview{opacity:.8;pointer-events:auto}.screen .route-window{max-width:220px}.route-caption{gap:12px}.route-caption b{font-size:11px}
.chapter-buttons{display:flex;gap:8px;flex-wrap:wrap}.chapters{flex-wrap:wrap}.chapter-buttons button[aria-pressed=true]{box-shadow:inset 0 0 0 2px #a6d7ed}
#player-error{padding:14px;color:#f6e8df;background:#50232a;border:1px solid #e2a8b0}
.own-recordings{grid-template-columns:1fr 1fr}.own-recordings button span{display:block}.own-recordings small{display:block;font:10px/1.5 'IBM Plex Mono',monospace;margin-top:4px;color:inherit}.own-recordings button img{height:115px}.recording-frame{opacity:.9}
.area-empty{margin:12px 35px 30px;padding:24px;border:1px solid #65747d;background:#101d25}.area-empty b,.area-empty span{display:block}.area-empty span{margin-top:10px;color:#cad2d7;font-size:13px}
#area .hero-journey[hidden],#area .area-postcard[hidden],.area-empty[hidden]{display:none!important}
@media(max-width:620px){.own-recordings button img{height:105px}.screen .route-window{max-width:150px}.screen .route-window .route-caption{display:block}.screen .route-window .route-caption span{display:none}.route-title{font-size:9px}.route-window small{font-size:8px}.chapter-buttons button{font-size:11px}.area-empty{margin-inline:18px}.screen-title h1{font-size:24px}}

#big-screen .route-window{width:235px;max-width:235px}#journey-map{height:140px!important;background:#e5e8df}#route-content>small{display:block;line-height:1.45;font-size:9px}.endpoint-marker{background:none;border:0}.endpoint-marker span{display:grid;place-items:center;width:24px;height:24px;background:#315b65;color:white;border:2px solid white;border-radius:50%;font:bold 12px Arial;box-shadow:0 1px 4px #0006}.endpoint-b span{background:#985d38}.route-window .leaflet-popup-content{font-size:11px;color:#182931}.route-window .leaflet-control-attribution{font-size:8px}.route-caption b{font-size:10px}
@media(max-width:620px){#big-screen .route-window{width:160px;max-width:160px}#journey-map{height:105px!important}#route-content>small{font-size:8px}}

@media(max-width:620px){#mobile-route-slot .route-window{position:relative;inset:auto;width:100%;max-width:none;transform:none;rotate:none;margin:0;border-radius:0;box-shadow:none}#mobile-route-slot #route-content{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px}#mobile-route-slot #route-content[hidden]{display:none}#mobile-route-slot #journey-map{grid-row:1/3;height:116px!important}#mobile-route-slot .route-caption{display:block;padding:4px}#mobile-route-slot .route-caption b{font-size:11px}#mobile-route-slot #route-content>small{font-size:9px;line-height:1.5;padding:4px}#mobile-route-slot .route-title{font-size:11px;padding:7px 10px}#mobile-route-slot .route-title button{width:24px;height:22px}}
@media(max-width:620px){#mobile-route-slot .route-caption span{display:none}#mobile-route-slot .route-caption b{display:block;line-height:1.4}}

/* The dot is an illustration of playback progress, not a GPS measurement. */
.journey-position{background:none;border:0;transition:transform .3s linear}.journey-position i{display:block;width:14px;height:14px;border-radius:50%;background:#f8dd42;border:3px solid #172c35;box-shadow:0 0 0 3px #fff9}
#area-recordings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:0 35px 30px}#area-recordings[hidden]{display:none}.area-recording{text-align:left;padding:7px;background:#172c36;color:#f1f3ed;border:1px solid #6d919b;box-shadow:3px 3px #0b1218;border-radius:5px;cursor:pointer}.area-recording img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}.area-recording strong{display:block;font-size:16px;padding:4px 5px 8px}.area-recording small{display:block;font:11px monospace;color:#c9e1dc;padding:9px 5px 3px}.area-recording:hover,.area-recording:focus-visible{outline:2px solid #c3dae2;transform:translateY(-2px)}
.discovery-result img{width:52px;height:39px;object-fit:cover;grid-row:1/3;border:1px solid #78939a}.discovery-result:has(img){grid-template-columns:52px 1fr;column-gap:10px}.discovery-result:has(img)>span,.discovery-result:has(img)>small{grid-column:2}
@media(prefers-reduced-motion:reduce){.journey-position{transition:none}}.motion-off .journey-position{transition:none}
@media(max-width:620px){#area-recordings{padding:0 18px 24px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.area-recording strong{font-size:14px}}
