:root{font-family:"Helvetica Neue",Helvetica,Arial,"PingFang SC",sans-serif;color:#343333;background:#f6f5f0;font-synthesis:none;font-weight:400}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit;color:inherit}button,select{cursor:pointer}button{border:0;background:transparent;padding:9px;line-height:1}button:hover{background:#e9e9e1}button:focus-visible,select:focus-visible,input:focus-visible,[role=button]:focus-visible{outline:2px solid #343333;outline-offset:5px}button:disabled{opacity:.35;cursor:default}[hidden]{display:none!important}h1,h2,h3,p{margin:0}small{font-size:11px}.world-shell{position:relative;min-height:100svh;overflow:hidden;padding-bottom:50px}.map-top{position:absolute;top:30px;left:36px;right:36px;display:flex;align-items:center;justify-content:space-between;z-index:3;gap:18px}.identity{display:flex;align-items:baseline;gap:16px}.wordmark{font-size:20px;font-weight:700;letter-spacing:-.8px}h1{font-size:14px;font-weight:500}.read-only{font-size:11px;border-left:1px solid #c8c8c0;padding-left:16px}.source-controls{display:flex;align-items:center;gap:10px;font-size:13px}.source-label{color:#74746c;font-size:11px}select{background:transparent;border:0;border-bottom:1px solid #bdbdb4;border-radius:0;padding:6px 22px 6px 3px;max-width:150px}.source-controls button{font-size:25px;padding:3px 7px}.provenance{position:absolute;top:80px;left:36px;right:36px;display:flex;gap:14px;align-items:center;font-size:11px;color:#6f716c;z-index:2}.provenance #mode-badge{font-weight:700;color:#343333}.provenance #freshness{margin-left:auto}.map-viewport{width:100%;height:calc(100svh - 150px);min-height:530px;margin-top:76px;display:flex;align-items:center;justify-content:center;overflow:auto}.map-viewport svg{display:block;width:100%;height:100%;max-height:900px;min-width:640px}.river{fill:none;stroke:#c4dde6;stroke-width:42;stroke-linecap:round;stroke-linejoin:round}.route{fill:none;stroke-width:7;stroke-linejoin:round;stroke-linecap:round}.route.inactive{stroke:#dcdcd4;stroke-width:5}.station{cursor:pointer}.station .node{fill:#f6f5f0;stroke:#343333;stroke-width:3.5}.station .hit{fill:transparent;stroke:none}.station .ring{fill:none;stroke:transparent;stroke-width:1.5}.station:hover .ring,.station:focus .ring,.station.selected .ring{stroke:#343333}.station text{fill:#4d4e48;text-anchor:middle;pointer-events:none;font-size:12px}.station .station-sub{fill:#93958e;font-size:8px;letter-spacing:1.4px}.station .quantity{font-size:11px;font-weight:700;fill:#343333;text-anchor:start}.station.unvisited .node{stroke:#9c9e94}.station.unvisited text{fill:#8a8c83}.train{cursor:pointer}.train rect.body{stroke:#f6f5f0;stroke-width:2}.train .train-hit{fill:transparent;stroke:transparent}.train:focus .train-hit,.train:hover .train-hit{stroke:#343333;stroke-width:1}.empty-map{position:absolute;left:6%;top:23%;display:flex;flex-direction:column;gap:10px;pointer-events:none}.empty-map strong{font-size:25px;font-weight:500}.empty-map span{font-size:12px;color:#7b7d73}.notice{position:absolute;bottom:150px;left:36px;max-width:650px;font-size:12px;line-height:1.7;color:#6b6e65;padding-right:20px}.map-bottom{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 36px 24px}.bottom-left{display:flex;align-items:center;gap:18px}.register-button{display:flex;align-items:center;gap:8px;font-size:21px;font-weight:500}.register-button small{font-size:11px;font-weight:400}.bottom-left #fit{font-size:27px}.line-legend{display:flex;gap:24px;align-items:center}.line-legend button{display:flex;align-items:center;gap:7px;padding:4px;font-size:12px}.line-legend svg{overflow:visible}.line-legend button[aria-pressed=true]{outline:1px solid #343333;outline-offset:4px}.boundary{text-align:right;font-size:10px;color:#898b80;line-height:1.7}.map-caption{display:flex;justify-content:space-between;gap:10px;margin:0 36px;font-size:10px;color:#85877d;line-height:1.7}.inspector{position:absolute;z-index:5;right:32px;top:120px;width:318px;max-height:calc(100svh - 200px);overflow:auto;background:#f6f5f0f5;border-left:2px solid #343333;padding:24px 22px 20px}.close{position:absolute;right:5px;top:4px;font-size:24px}.detail-eyebrow{font-size:10px;letter-spacing:1.8px;color:#85877d;margin:0 0 12px}.inspector h2{font-size:23px;font-weight:500;margin:0 0 10px}.inspector p{font-size:12px;line-height:1.8;color:#6c7065;margin:8px 0 18px}.stats{display:flex;gap:28px;margin:22px 0}.stats b{font-size:28px;display:block;font-weight:400}.stats span{font-size:10px;color:#777a70}dl{font-size:12px;margin:18px 0}dt{color:#8a8d81;font-size:10px;margin-top:14px}dd{margin:5px 0;overflow-wrap:anywhere;line-height:1.5}.mono{font-family:monospace;font-size:10px}.task-link{display:block;text-align:left;border-top:1px solid #dddfd5;width:100%;padding:15px 0;line-height:1.6;font-size:12px}.task-link small{color:#828679;display:block;overflow-wrap:anywhere}.inspector h3{font-size:12px;font-weight:500;margin:24px 0 8px}.event-list{list-style:none;padding:0;margin:10px 0}.event-list li{border-left:2px solid #d5d9ce;padding:0 0 18px 13px;margin-left:4px;line-height:1.6;font-size:11px}.event-list time{display:block;color:#929686;font-size:10px}.event-list code{display:block;font-size:8px;overflow-wrap:anywhere;color:#929686}.event-list .event-status{color:#7b8071;font-size:10px}.replay{display:flex;align-items:center;gap:20px;width:480px;max-width:calc(100% - 72px);margin:0 auto 20px}.replay-track{flex:1}.replay-track div{display:flex;justify-content:space-between;font-size:10px;gap:12px}.replay-track strong{font-weight:500}.replay-track input{width:100%;margin:12px 0 0;accent-color:#343333;height:12px}.replay #play{font-size:19px}.replay #restart{font-size:11px}.world-shell:has(.replay:not([hidden])) .notice{bottom:217px}.register-panel{position:absolute;left:36px;bottom:130px;width:360px;max-height:65svh;overflow:auto;padding:22px;background:#f6f5f0fa;border-left:2px solid #343333;z-index:6}.register-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.register-heading h2{font-size:20px;font-weight:500}.register-heading button{font-size:22px}.register-panel label{font-size:11px}.register-panel .empty-list{font-size:12px;color:#828678;padding:25px 0;line-height:1.8}.error #mode-badge{color:#b85e36}@media(min-width:1500px){.map-viewport{padding:0 8%}}@media(max-width:760px){.map-top{left:20px;right:20px;top:22px;gap:8px}.wordmark{font-size:17px}.identity{gap:8px}h1{font-size:11px}.read-only{padding-left:8px;font-size:10px}.source-label{display:none}.source-controls{gap:3px;font-size:11px}.provenance{left:20px;right:20px;top:65px;flex-wrap:wrap;gap:5px 10px;font-size:10px}.provenance #freshness{flex-basis:100%;margin:0}.map-viewport{height:calc(100svh - 170px);min-height:480px;justify-content:flex-start;margin-top:100px}.map-viewport svg{min-width:730px;height:100%}.empty-map{left:22px;top:145px}.empty-map strong{font-size:22px}.empty-map span{font-size:11px}.notice{left:20px;bottom:163px;font-size:11px;max-width:90%}.map-bottom{margin:0 20px 18px;gap:12px;flex-wrap:wrap}.line-legend{gap:12px;order:3;width:100%;justify-content:center}.line-legend button{font-size:11px}.line-legend svg{width:25px;height:25px}.bottom-left{gap:15px}.boundary{font-size:9px}.map-caption{margin:0 20px;font-size:9px;flex-direction:column;gap:2px}.inspector{top:auto;right:12px;left:12px;bottom:175px;width:auto;max-height:55svh;padding:20px}.register-panel{left:12px;right:12px;width:auto;bottom:175px;max-height:55svh}.replay{max-width:calc(100% - 40px);gap:10px;margin-bottom:16px}.world-shell:has(.replay:not([hidden])) .notice{bottom:230px}.world-shell{padding-bottom:24px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Keep the map and its few controls within one screen, including replay mode. */
.world-shell{height:100svh;min-height:600px;display:flex;flex-direction:column;padding-bottom:0}.map-viewport{flex:1;height:auto;min-height:0;margin-top:110px}.map-viewport svg{max-height:none}.notice,.world-shell:has(.replay:not([hidden])) .notice{position:static;flex:none;margin:0 36px 14px;max-width:calc(100% - 72px);padding:0}.map-bottom{flex:none;margin-bottom:14px}.replay{flex:none;margin-bottom:14px}.map-caption{flex:none;margin-bottom:18px}.inspector{background:#f6f5f0}.register-panel{background:#f6f5f0}@media(max-width:760px){.map-viewport{margin-top:110px}.notice,.world-shell:has(.replay:not([hidden])) .notice{margin:0 20px 10px;max-width:calc(100% - 40px)}.map-bottom{margin-bottom:12px}.map-caption{margin-bottom:15px}.inspector{bottom:190px;max-height:55svh}.register-panel{bottom:190px}}

/* Phone overview first; magnification is optional and stays inside the map. */
.world-shell{padding-bottom:env(safe-area-inset-bottom,0px)}
.map-top{top:calc(30px + env(safe-area-inset-top,0px))}
.provenance{top:calc(80px + env(safe-area-inset-top,0px))}
.map-viewport{margin-top:calc(110px + env(safe-area-inset-top,0px))}
.map-viewport.map-zoom{justify-content:flex-start}
.map-viewport.map-zoom svg{flex:none;width:150%;min-width:850px}
.source-controls button,#fit,#play,#restart,.close{min-width:44px;min-height:44px}
@media(max-width:760px){
 .map-top{top:calc(12px + env(safe-area-inset-top,0px))}
 .provenance{top:calc(60px + env(safe-area-inset-top,0px))}
 .map-viewport{margin-top:calc(104px + env(safe-area-inset-top,0px))}
 .map-viewport svg{min-width:0;flex:none;width:100%}
 .station text{font-size:23px}
 .station .station-sub{display:none}
 .station .quantity{font-size:21px}
 .map-zoom .station text{font-size:14px}
 .empty-map{top:calc(123px + env(safe-area-inset-top,0px))}
 .inspector,.register-panel{position:fixed;bottom:0;left:0;right:0;width:auto;max-height:min(68dvh,560px);border:0;border-top:2px solid #343333;padding:20px 20px calc(20px + env(safe-area-inset-bottom,0px));overscroll-behavior:contain}
 .inspector .close{right:10px}
 .line-legend button{min-height:44px}
}
@media(orientation:landscape) and (max-height:500px){
 .world-shell{min-height:390px;padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
 .map-top{top:4px;left:calc(18px + env(safe-area-inset-left,0px));right:calc(18px + env(safe-area-inset-right,0px))}
 .provenance{top:48px;left:calc(18px + env(safe-area-inset-left,0px));right:calc(18px + env(safe-area-inset-right,0px))}
 .map-viewport{margin-top:68px}
 .map-viewport svg{min-width:0}
 .map-bottom,.replay,.notice,.world-shell:has(.replay:not([hidden])) .notice{margin-bottom:3px}
 .map-caption{display:none}
 .inspector{top:72px;max-height:calc(100dvh - 92px)}
 .empty-map{top:90px}
}

/* On phones the inspector occupies its own space below the map. */
@media (max-width:760px) {
 .inspector { position:relative; inset:auto; flex:0 1 32dvh; min-height:0;
   max-height:32dvh; overflow:auto; padding-bottom:12px; }
 .world-shell:has(.inspector:not([hidden])) .empty-map { display:none; }
}
