/* V5: real geography and a city-to-city route explorer. */
.route-planner {display:grid;grid-template-columns:1.05fr 1fr 42px 1fr auto;align-items:center;gap:21px;padding:25px 27px;background:#112635;border:1px solid #63809040;margin:10px 0 24px}
.planner-intro>span {display:block;color:#8aa7b8;font-size:8px;letter-spacing:.13em}
.planner-intro>strong {display:block;font:500 22px/1.3 var(--heading);letter-spacing:-.04em;margin-top:7px;color:#edf2e7}
.planner-field {display:flex;flex-direction:column;gap:7px;min-width:0}
.planner-field>span {font-size:10px;color:#8ea9b9}
.route-planner select,.route-check-panel select {appearance:auto;min-width:0;width:100%;border:0;border-bottom:1px solid #6783917a;padding:8px 0 10px;color:#edf2e7;background:#112635;border-radius:0;font:400 15px/1.5 var(--body);color-scheme:dark;cursor:pointer}
.route-planner select:focus-visible,.route-check-panel select:focus-visible {outline:2px solid #f48d5c;outline-offset:4px}
.route-planner select:disabled {color:#88a0ac;cursor:wait}
.route-swap {width:41px;height:41px;display:grid;place-items:center;border:1px solid #7c99a955;border-radius:50%;background:transparent;color:#bed1db;font:400 22px/1 var(--body);margin-top:14px;transition:color .25s,background .25s,transform .3s}
.route-swap:hover {color:#ff976c;background:#ff7a3910;transform:rotate(180deg)}
.route-plan {display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:51px;padding:12px 18px;background:#ff8555;color:#102430;font-size:12px;white-space:nowrap;transition:background .25s}
.route-plan>span:last-child {font-size:23px}
.route-plan:hover {background:#ffa579}
.route-plan:disabled {opacity:.45;cursor:wait}
.route-workspace {display:grid;grid-template-columns:285px minmax(0,1fr);gap:23px;align-items:start;min-width:0}
.route-options {position:sticky;top:153px;min-width:0;padding:24px 21px;background:#0b1b29;border:1px solid #7b99a632;max-height:calc(100svh - 180px);overflow:auto;scrollbar-width:thin;scrollbar-color:#3f5c6d transparent}
.route-options-heading .eyebrow {font-size:7px;letter-spacing:.13em;color:#8da8b9}
.route-options-heading h3 {font:500 23px/1.2 var(--heading);letter-spacing:-.045em;margin-top:12px;color:#e4ede9}
.route-alternatives {display:flex;flex-direction:column;gap:9px;margin-top:23px}
.route-alternatives>button,.route-alternative {width:100%;min-width:0;position:relative;display:flex;flex-direction:column;align-items:stretch;gap:7px;text-align:left;color:#cadce4;border:1px solid #7e9baa45;padding:14px 13px;background:#102534;font:400 11px/1.65 var(--body);transition:background .25s,border-color .25s}
.route-alternatives>button:hover {border-color:#789cae;background:#143044}
.route-alternatives>button[aria-pressed=true],.route-alternatives>button.is-active,.route-alternative.is-active {background:#143143;border-color:#f58c5e;box-shadow:inset 3px 0 #f58c5e;color:#f0eee4}
.route-alternatives strong,.route-alternative strong {font:600 17px/1.3 var(--heading);letter-spacing:-.025em;color:inherit}
.route-alternatives small {font-size:10px;color:#91abb9;line-height:1.6}
.route-alternatives .route-alt-distance,.route-alternatives .route-option-distance,.route-alternative .distance {font:600 italic 26px/1 var(--display);color:#ff9b73}
#route-planner-status {grid-column:1/-1;color:#f4b28e;font-size:12px;line-height:1.7}
#route-planner-status:empty {display:none}
.route-loading {font-size:11px;color:#9eb4c2;line-height:1.8}
.route-stops-panel {border-top:1px solid #7a99ac30;margin-top:24px;padding-top:21px}
.route-stops-panel h4 {font:500 12px/1.6 var(--body);color:#b6cbd7}
.route-stops {display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.route-stops>span,.route-stop {border:1px solid #748f9f34;padding:4px 7px;color:#9db7c7;font-size:9px;line-height:1.7}
.route-stops>button {border:1px solid #748f9f34;padding:4px 7px;background:transparent;color:#b3ccd9;font-size:10px;line-height:1.7}
.route-check-panel {margin-top:23px;padding-top:19px;border-top:1px solid #7a99ac30}
.route-check-panel>label {display:block;font-size:12px;line-height:1.6;color:#cbdce3;margin-bottom:12px}
.route-check-panel select {font-size:12px;background:#0b1b29}
.route-check-panel>button {width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:41px;background:#173c54;color:#d2e1e6;font:400 10px/1.6 var(--body);padding:9px 12px;margin-top:13px;border:1px solid #6a9ab255}
.route-check-panel>button:hover {background:#1c4f6d}
.route-check-panel>button:disabled {opacity:.4}
#route-check-result {font-size:11px;line-height:1.8;color:#f5b18e;margin-top:12px;min-height:0}
#route-check-result:empty {display:none}
.route-planner-note {font-size:9px;line-height:1.9;color:#7897a8;margin-top:24px}
.cinematic .route-experience {min-width:0;scroll-margin-top:40px}
.cinematic .route-experience .map-tools {gap:13px;padding:17px 19px}
.cinematic .route-experience .map-tools .route-data-tag {font-size:7px;letter-spacing:.1em}
.cinematic .route-experience .map-view-controls {gap:6px}
.cinematic .route-experience .map-tools button {font-size:9px;min-height:38px;padding:8px 10px;white-space:nowrap}
.map-layer-tools {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;background:#0c1e2b;border-bottom:1px solid #6d91a536}
.map-style-controls,.map-camera-controls {display:flex;gap:4px;align-items:center}
.map-layer-tools button {min-height:32px;background:transparent;padding:6px 10px;border:1px solid #789bac3a;font-size:9px;color:#95b2c4;transition:color .2s,border-color .2s,background .2s}
.map-layer-tools button[aria-pressed=true] {color:#e8f1ec;background:#234b61;border-color:#7aabc266}
.map-layer-tools button:hover {color:#e9f2f0;border-color:#a6b8c378}
.satellite-vintage {font:500 6px/1.6 var(--body);letter-spacing:.09em;color:#7696a8}
.cinematic .route-experience #europe-map {height:clamp(420px,calc(100svh - 350px),650px);position:relative;isolation:isolate}
#satellite-map {position:absolute;inset:0;z-index:1;width:100%;height:100%;opacity:0;pointer-events:none;background:#09131c}
#europe-map.is-satellite #satellite-map {opacity:1;pointer-events:auto}
#europe-map.is-satellite>#europe-3d,#europe-map.is-satellite>svg {display:none!important}
#satellite-map .maplibregl-canvas {outline:0}
#satellite-map .maplibregl-ctrl-attrib {background:#071725db;color:#b6c6ce;font:9px/1.5 var(--body);max-width:100%;padding:3px 5px}
#satellite-map .maplibregl-ctrl-attrib a {color:#dce7e9}
#satellite-map .maplibregl-ctrl-group {background:#092335ee;border:1px solid #7093a466;box-shadow:0 4px 12px #0003}
#satellite-map .maplibregl-ctrl-group button {background:transparent;border-color:#6a8e9c55}
#satellite-map .maplibregl-ctrl-group button>span {filter:invert(1)}
#satellite-map .maplibregl-ctrl-scale {background:#071725b8;color:#dce6e7;border-color:#a8c4d1;font-size:9px}
#europe-map.is-satellite .map-hud {z-index:4;pointer-events:none;bottom:45px;left:19px}
#europe-map.is-satellite .map-hud .route-detail {padding:13px 16px;background:#071a29df;max-width:330px;backdrop-filter:blur(12px)}
#europe-map.is-satellite .map-hud .route-detail-label {font-size:6px}
#europe-map.is-satellite .map-hud .route-detail strong {font-size:23px;margin-top:8px}
#europe-map.is-satellite .map-hud #route-distance {font-size:34px;margin-top:7px}
#europe-map.is-satellite .map-coordinate {z-index:4;top:14px;right:55px;color:#cdd9d9;text-shadow:0 1px 4px #000}
.map-coordinate>b {font:inherit}
.map-playback {display:grid;grid-template-columns:auto minmax(40px,1fr) 38px auto 47px;align-items:center;gap:13px;background:#102534;border-top:1px solid #7899aa30;padding:13px 18px;color:#9fb8c5}
.map-playback>label {font-size:9px;white-space:nowrap}
.map-playback output {font:500 10px/1.5 var(--body);font-variant-numeric:tabular-nums;color:#e9eadd;text-align:right}
.map-playback input[type=range] {width:100%;min-width:0;accent-color:#f9915e;cursor:ew-resize;margin:0}
.map-playback select {min-width:0;color:#dbe8eb;background:#0e2433;border:1px solid #6b91a45c;min-height:28px;font:400 10px/1.4 var(--body);padding:3px;color-scheme:dark}
.cinematic .routes .route-content {column-gap:70px}
.cinematic .routes .route-content h2 {font-size:clamp(42px,4.6vw,67px)}
.cinematic .route-introduction {max-width:420px}
.cinematic .route-introduction .route-description {font-size:12px}
.cinematic .route-footer {grid-template-columns:minmax(0,.7fr) minmax(0,1fr)}
.map-unavailable-note {position:absolute;z-index:5;left:20px;right:20px;top:20px;background:#102b3eed;padding:12px 15px;color:#dce6e9;font-size:11px;line-height:1.7}
@media(max-width:1180px) {
  .route-planner {grid-template-columns:1fr 38px 1fr auto;gap:16px;padding:20px}
  .planner-intro {display:none}
  .route-workspace {grid-template-columns:245px minmax(0,1fr);gap:16px}
  .route-options {padding:21px 17px}
  .cinematic .route-experience .map-tools {align-items:flex-start;gap:10px;flex-direction:column;padding:13px 14px}
  .map-layer-tools {gap:9px;padding:10px 13px;flex-wrap:wrap}
  .satellite-vintage {order:3;width:100%;text-align:right}
  .map-playback {grid-template-columns:auto minmax(40px,1fr) 34px 43px;gap:10px;padding:11px 12px}
  .map-playback .route-speed-label {display:none}
}
@media(max-width:900px) {
  .route-workspace {grid-template-columns:210px minmax(0,1fr);gap:13px}
  .route-options-heading h3 {font-size:21px}
  .route-alternatives>button {padding:12px 10px}
  .route-alternatives strong {font-size:15px}
  .cinematic .route-experience .map-view-controls {gap:5px;flex-wrap:wrap}
}
@media(max-width:700px) {
  .route-planner {grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);gap:16px 12px;padding:18px 16px;margin-top:0;margin-bottom:17px}
  .planner-field>span {font-size:10px}
  .route-planner select {font-size:13px;padding-block:8px 10px;max-width:100%}
  .route-swap {width:33px;height:33px;font-size:21px;margin-top:12px}
  .route-plan {grid-column:1/-1;min-height:43px;padding:8px 14px;font-size:11px}
  .route-workspace {display:flex;flex-direction:column;gap:17px}
  .route-options {position:relative;top:auto;width:100%;max-height:none;overflow:visible;display:grid;grid-template-columns:1fr 1fr;gap:0 16px;padding:19px 16px}
  .route-options-heading {grid-column:1/-1}
  .route-options-heading h3 {font-size:23px;margin-top:9px}
  .route-alternatives {grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-top:16px}
  .route-alternatives>button {padding:11px 10px;font-size:10px}
  .route-alternatives strong {font-size:16px}
  .route-alternatives small {font-size:9px}
  .route-stops-panel {margin-top:19px;padding-top:16px}
  .route-check-panel {margin-top:19px;padding-top:16px}
  .route-check-panel>label {font-size:10px;margin-bottom:8px;min-height:32px}
  .route-check-panel select {font-size:11px}
  .route-check-panel>button {font-size:9px;min-height:36px;margin-top:9px;padding:7px 9px}
  #route-check-result {font-size:10px;line-height:1.7}
  .route-planner-note {grid-column:1/-1;margin-top:17px;font-size:9px}
  .route-stops>span {font-size:8px}
  .cinematic .route-experience {width:100%;scroll-margin-top:50px}
  .cinematic .route-experience .map-tools {flex-direction:column;gap:11px;padding:12px}
  .cinematic .route-experience .map-view-controls {width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  .cinematic .route-experience .map-tools button {font-size:8px;padding:7px 5px;min-height:37px;gap:5px}
  .map-layer-tools {padding:9px 11px;gap:8px}
  .map-layer-tools button {font-size:8px;padding:6px 8px;min-height:30px}
  .satellite-vintage {order:3;width:100%;font-size:6px;text-align:left}
  .cinematic .route-experience #europe-map {height:420px}
  #europe-map.is-satellite .map-hud {left:12px;right:12px;bottom:39px;gap:7px}
  #europe-map.is-satellite .map-hud .route-detail {padding:11px 13px;max-width:230px}
  #europe-map.is-satellite .map-hud .route-detail strong {font-size:19px;margin-top:5px}
  #europe-map.is-satellite .map-hud #route-distance {font-size:29px;margin-top:6px}
  #europe-map.is-satellite .map-coordinate {right:49px;font-size:6px;top:12px}
  .map-playback {grid-template-columns:auto minmax(45px,1fr) 31px 40px;gap:8px;padding:11px}
  .map-playback>label {font-size:8px}
  .map-playback output {font-size:9px}
  #satellite-map .maplibregl-ctrl-attrib {font-size:7px}
  .cinematic .route-footer {grid-template-columns:1fr}
}
.motion-paused .route-planner button,.motion-paused .route-alternatives button,.motion-paused .map-layer-tools button {transition:none}
@media(prefers-reduced-motion:reduce) {.route-planner button,.route-alternatives button,.map-layer-tools button {transition:none}}