:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#101923;color:#edf3f8}*{box-sizing:border-box}body{margin:0;min-height:100svh;display:flex;flex-direction:column}header{padding:22px 28px;display:flex;justify-content:space-between;gap:18px;align-items:center;border-bottom:1px solid #334454}h1{font-size:32px;letter-spacing:.04em;margin:0}header p{margin:5px 0 0;color:#b9c9d6;font-size:15px}button,select{font:inherit;color:inherit;border:1px solid #526878;background:#1d2d3b;border-radius:7px;min-height:44px;padding:9px 13px}button{cursor:pointer}button:hover{background:#2c4355}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #f2cb79;outline-offset:3px}main{display:flex;flex-direction:column;flex:1;min-height:0}.journey-controls{padding:18px 28px;display:flex;gap:18px 30px;align-items:center;flex-wrap:wrap}label{display:flex;flex-direction:column;gap:7px;font-size:13px;color:#c0d1dd}select{min-width:245px}.journey-summary{display:flex;flex-direction:column;gap:6px;min-width:185px}.journey-summary span{color:#b9c9d6;font-size:14px}.playback{display:flex;align-items:center;gap:12px;flex:1;min-width:320px}.playback label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}input[type=range]{flex:1;min-width:80px;accent-color:#edc773;cursor:pointer}output{font-size:14px;font-variant-numeric:tabular-nums;min-width:95px}.map-section{position:relative;flex:1;min-height:430px}#map{position:absolute;inset:0;background:#263743}.leaflet-tile{filter:invert(.9) hue-rotate(175deg) saturate(.6) brightness(.8)}.map-key{position:absolute;bottom:22px;left:14px;z-index:500;margin:0;background:#101923ed;border:1px solid #526878;border-radius:7px;padding:9px 12px;font-size:12px;display:flex;gap:9px;align-items:center}.map-key i{height:3px;width:18px;background:#edc773}.map-key b{height:10px;width:10px;border-radius:50%;background:#fff;border:2px solid #edc773}.leaflet-control-attribution{background:#101923dd!important;color:#b9c9d6!important}.leaflet-control-attribution a{color:#d9e7f1!important}@media(max-width:650px){header{padding:15px 18px}header p{max-width:225px;font-size:13px}h1{font-size:27px}#reset{font-size:12px;padding:8px 10px}.journey-controls{padding:14px 18px;gap:13px;display:grid;grid-template-columns:minmax(0,1fr) auto}.journey-controls>label{min-width:0}select{min-width:0;width:100%;font-size:13px}.journey-summary{min-width:0;text-align:right}.journey-summary strong{font-size:13px}.journey-summary span{font-size:11px}.playback{grid-column:1/-1;min-width:0;gap:10px}output{font-size:12px;min-width:83px}.map-section{min-height:430px;flex:1}.map-key{font-size:11px;bottom:24px;left:10px}}
/* Explicit track styling stays visible in both browser engines. */
input[type=range]{appearance:none;-webkit-appearance:none;height:6px;border-radius:4px;background:#71818a}input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:4px;background:#71818a}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:17px;height:17px;margin-top:-5px;border-radius:50%;background:#edc773;border:2px solid #edc773}input[type=range]::-moz-range-track{height:6px;border-radius:4px;background:#71818a}input[type=range]::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:#edc773;border:1px solid #edc773}