.route-player{--motion-wine:#960c22;--motion-coal:#232f31;--motion-gold:#d5b579;--motion-paper:#fbf5e9;color:var(--ink);font-family:var(--sans)}
.route-player #tabs{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 24px}
.route-player #tabs button{font:13px var(--sans);padding:12px 18px;border:1px solid #aeb7aa;background:transparent;color:var(--pine);cursor:pointer}
.route-player #tabs button[aria-selected=true]{background:var(--pine);color:#fff;border-color:var(--pine)}
.route-player .layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:22px;align-items:stretch}
.route-player .map-wrap{min-width:0}
.route-player .stage{position:relative;isolation:isolate;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--motion-paper);border:1px solid #cbbda8}
.route-player .stage>img,.route-player .stage>svg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.route-player .stage #base{z-index:0}.route-player .stage #final{z-index:1;opacity:0}.route-player .stage #drawing{z-index:2;pointer-events:none}
.route-player .stage:fullscreen{background:var(--paper);width:100vw;height:100vh;aspect-ratio:auto}
.route-player .under-map{display:flex;justify-content:space-between;gap:12px;margin:11px 0 15px;font:12px var(--sans);color:#56645b}
.route-player .side{background:var(--motion-coal);color:#eee7da;padding:28px 23px;min-width:0;display:flex;flex-direction:column}
.route-player .chapter-tag{color:var(--motion-gold);font:10px/1.7 var(--sans);letter-spacing:.16em;margin-bottom:17px}
.route-player .side h3{font:400 29px/1.35 var(--serif);margin:0 0 9px;color:#faf0dc;letter-spacing:.06em}
.route-player .subtitle{font:12px/1.8 var(--sans);color:#c6cec8;margin:0 0 25px}
.route-player .motion-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 25px}
.route-player .motion-metric{border:1px solid #495356;padding:16px 12px;min-width:0}
.route-player .motion-metric strong{display:block;font:30px/1.15 Georgia,serif;color:var(--motion-gold)}
.route-player .motion-metric span{display:block;margin-top:8px;font:11px/1.7 var(--sans);color:#d1d9d1}
.route-player .current-leg{border-left:2px solid #aa7479;padding-left:15px;margin-bottom:18px}
.route-player .phase{font:11px/1.8 var(--sans);letter-spacing:.04em;color:var(--motion-gold)}
.route-player .segment-title{font:400 21px/1.6 var(--serif);color:#fff6e4;margin:6px 0 8px}
.route-player .detail{font:13px/1.9 var(--sans);color:#d0d9d2;margin:0}
.route-player .itinerary{list-style:none;margin:0 0 22px;padding:0}
.route-player .itinerary li{border-bottom:1px solid #3d494a}
.route-player .itinerary button{display:flex;align-items:center;gap:9px;width:100%;padding:10px 0;background:none;border:0;text-align:left;font:11px/1.7 var(--sans);color:#aeb9b2;cursor:pointer}
.route-player .itinerary .active button{color:var(--motion-gold)}.route-player .itinerary .passed button{color:#e5e9df}
.route-player .number{display:flex;align-items:center;justify-content:center;flex:0 0 18px;height:18px;border-radius:50%;background:#3e4b4b;color:#d5dbd1;font:10px Georgia}
.route-player .active .number{background:var(--motion-gold);color:#20292b}
.route-player .route-chapter{margin-top:auto;display:flex;justify-content:space-between;gap:10px;text-decoration:none;padding-top:17px;border-top:1px solid #50605b;color:var(--motion-gold);font:12px var(--sans)}
.route-player .controls{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.route-player .controls button,.route-player .controls select{font:12px var(--sans);padding:10px 12px;border:1px solid #aab3a9;background:transparent;color:var(--pine);cursor:pointer}
.route-player .controls #play{background:var(--pine);border-color:var(--pine);color:#fff;min-width:70px}
.route-player .controls button:disabled{opacity:.5;cursor:wait}
.route-player .speed{display:flex;align-items:center;gap:7px;margin-left:auto;font:11px var(--sans);color:#59665d}
.route-player .scrub{display:flex;align-items:center;gap:12px;margin-top:15px}
.route-player .scrub input{width:100%;accent-color:var(--wine);cursor:pointer}
.route-player .time{white-space:nowrap;font:11px var(--sans);font-variant-numeric:tabular-nums;color:#59665d}
.route-player .sequence-setting{display:flex;align-items:center;gap:8px;font:12px var(--sans);margin:17px 0 0;color:#59665d}
.route-player .sequence-setting input{accent-color:var(--pine)}
.route-player .error{color:var(--wine);font:13px var(--sans);padding:14px}
.route-player button:focus-visible,.route-player input:focus-visible,.route-player select:focus-visible,.route-player a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
@media(max-width:1100px){.route-player .layout{grid-template-columns:minmax(0,1fr) 248px;gap:17px}.route-player .side{padding:23px 18px}.route-player .side h3{font-size:24px}.route-player .motion-metric strong{font-size:27px}}
@media(max-width:800px){.route-player .layout{grid-template-columns:1fr}.route-player .side{padding:25px}.route-player .motion-metrics{max-width:350px}.route-player .itinerary{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.route-player .route-chapter{margin-top:10px}.route-player .detail{max-width:620px}}
@media(max-width:520px){.route-player #tabs{gap:6px;margin-bottom:18px}.route-player #tabs button{flex:1;min-width:43%;padding:11px 7px;font-size:12px}.route-player .speed{margin-left:0}.route-player .controls{gap:6px}.route-player .controls button,.route-player .controls select{padding:10px;font-size:11px}.route-player .side{padding:23px 20px}.route-player .itinerary{grid-template-columns:1fr}.route-player .itinerary button{min-height:42px}.route-player .under-map{font-size:10px}}