/* OnTrail's navy palette. Change these variables to adjust the main colors. */
:root{--navy:#172f55;--blue:#245da8;--muted:#667991;--border:#dce4ef;color:var(--navy);background:#f0f4f9}
header{background:var(--navy);border-color:#244369}
.brand{color:#fff}.brand-logo{width:48px;height:48px;object-fit:contain;margin-right:8px;padding:5px;background:#fff;border-radius:50%;flex-shrink:0}
.logo{background:#284971;color:#d7e8ff}
[hidden]{display:none!important}
.tag{color:#afc3df}.local{color:#cfdef2}.local i,.live-dot{background:#6296d6}
.eyebrow,.intro p:last-child{color:#657b98}
.quiet{border-color:#cfdced;background:#f8faff;color:#294e7c}
.panel,.stats,.map-panel{background:#fcfdff}
h2{color:#7a8ca5}h2 span{color:var(--navy)}
.section-title>span,.segmented{background:#e8eef7}
.drop{border-color:#a9bfdc;background:#f2f6fc}.drop.drag{background:#dceafa}
.drop small,.file small{color:#697f9c}.upload{color:#587aa6}
.textbutton{color:#34659e}.file{background:#f1f5fb;color:#34577f}
.file.active{border-color:#96b5de;background:#e5eefb}
.settings label{color:#647b97}output{color:#204b83}
input[type=range],input[type=checkbox]{accent-color:var(--blue)}
.ends{color:#71849d}.hint,.privacy{color:#647994}
.segmented button{color:#607896}.segmented button.active{color:var(--navy)}
.stats span{color:#647b97}.stats .accent strong{color:var(--blue)}
.map-wrap{background:#e9eff7}.map-controls{box-shadow:0 2px 12px #172f5515}
.map-controls button{border-color:#ccd9eb;background:#fafdff;color:var(--navy)}
.legend{box-shadow:0 2px 12px #172f5510}.result{background:var(--blue)}
.scale{border-color:#5c7393}.mapfooter{color:#657b96}.mapfooter a{color:#315d94}
.primary{background:var(--navy);color:#f4f8ff}.primary:hover{background:#244b7e}
#status{color:#365f94}#warnings{color:#956520}
.stop-row{color:#5e7593}.stop-row button{background:#e9f0fa;color:#305d94}
.stop-row span:last-child{color:#345c8a}
#empty>span{color:#8ea8c9}#empty h2{color:#4f6d96}#empty p{color:#687e9c}
footer{color:#6d819c}button:focus-visible,a:focus-visible{outline-color:#6a9bdd}
.privacy{padding:14px;border:1px solid var(--border);border-radius:9px;background:#e8eff9;font-size:11px;line-height:1.7}
.privacy strong{display:block;color:var(--navy);margin-bottom:5px;font-size:12px}
.privacy small{display:block;margin-top:8px;font-size:10px}
@media(max-width:760px){.brand{font-size:17px;gap:5px}.brand-logo{width:36px;height:36px;padding:4px}header{gap:12px}}