:root{font-family:"Noto Sans TC","Microsoft JhengHei",sans-serif;color:#233343;background:#f4f5f4;font-synthesis:none}*{box-sizing:border-box}body{margin:0;height:100dvh;overflow:hidden}button,input,a{font:inherit}button,a,input{outline-offset:3px}button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid #247bae}button{cursor:pointer;color:inherit}header{height:79px;background:#fff;border-bottom:1px solid #dbe1e4;display:flex;align-items:center;gap:30px;padding:0 22px}.back{font-size:12px;color:#586874;text-decoration:none}.back b{display:inline-block;background:#243747;color:white;border-radius:3px;font-size:10px;padding:2px 5px;margin-left:6px}.brand{display:flex;align-items:center;gap:12px}.symbol{font-size:39px;line-height:1;color:#247795}h1{font-size:21px;margin:0;font-weight:700;letter-spacing:.06em}.brand p{font-size:9px;letter-spacing:.2em;color:#87929a;margin:5px 0 0}.edition{margin-left:auto;font-size:12px;font-weight:600}.edition span{display:block;font-size:10px;color:#8b969d;font-weight:400;margin-top:5px}main{display:grid;grid-template-columns:235px minmax(0,1fr) 252px;height:calc(100dvh - 79px)}.sidebar,.detail{background:#fff;min-height:0;overflow:auto}.sidebar{display:flex;flex-direction:column;border-right:1px solid #dbe1e4}.side-head{padding:23px 17px 12px}.side-head h2{font-size:15px;margin:0}.side-head p{font-size:11px;color:#87919a;margin:7px 0 18px}.search{display:flex;align-items:center;gap:8px;background:#f3f5f6;border:1px solid #e0e5e8;border-radius:6px;padding:8px 10px}.search input{font-size:12px;min-width:0;border:0;background:none;width:100%;color:#243747}.search input::placeholder{color:#8d969e}.search span{font-size:23px;line-height:16px}.filters{display:flex;gap:4px;padding:0 17px 16px}.filters button{flex:1;border:0;padding:6px;font-size:11px;border-radius:4px;background:#f5f6f6;color:#73838e}.filters button[aria-pressed=true]{background:#263f50;color:#fff}.list-heading{display:flex;justify-content:space-between;padding:10px 17px;border-top:1px solid #edf0f1;font-size:10px;color:#84919b;align-items:center}.list-heading button{border:0;background:none;color:#287ca3;font-size:10px}.route-list{flex:1;min-height:100px;overflow:auto;padding:0 9px}.route-item{width:100%;display:flex;align-items:center;gap:9px;border:1px solid transparent;text-align:left;background:white;padding:10px 7px;border-radius:5px;margin-bottom:2px}.route-item:hover{background:#f2f5f6}.route-item.active{border-color:#c8d7e0;background:#eff5f8}.route-item .badge{display:flex;align-items:center;justify-content:center;width:36px;min-height:28px;padding:3px;background:var(--line);color:#fff;border-radius:5px;font-size:11px;font-weight:700;flex:none}.route-item b{font-size:12px;display:block}.route-item small{font-size:9px;color:#8a959d;display:block;margin-top:3px;max-width:142px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.source-note{padding:14px 17px;border-top:1px solid #e6ebee;font-size:10px;color:#819099;line-height:1.7}.source-note b{color:#4b626f}.source-note p{margin:5px 0}.source-note summary{cursor:pointer;color:#547587}.workspace{display:flex;flex-direction:column;min-width:0;min-height:0}.zone-nav{display:flex;align-items:center;gap:5px;padding:14px 18px;border-bottom:1px solid #e0e5e6;flex-wrap:wrap;background:#fafbfb}.zone-nav button{border:1px solid transparent;background:none;font-size:11px;border-radius:4px;padding:6px 8px;white-space:nowrap}.zone-nav button.active{background:white;border-color:#d6dee2;box-shadow:0 1px 3px #00000006}.zone-nav i{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:5px}.density{margin-left:auto;display:flex;gap:3px;background:#eef1f2;border-radius:5px;padding:3px}.density button{border:0;background:none;font-size:11px;border-radius:4px;padding:4px 9px;color:#6d7c86;white-space:nowrap}.density button[aria-pressed=true]{background:#fff;color:#22384a;font-weight:600;box-shadow:0 1px 3px #1c364212}.map-window{flex:1;min-height:0;position:relative;overflow:hidden;background:#fcfcfa;touch-action:none}.map-window>svg{width:100%;height:100%;display:block;cursor:grab}.map-window.dragging>svg{cursor:grabbing}.map-caption{position:absolute;left:19px;top:14px;pointer-events:none;background:#ffffffd9;padding:8px 11px;border-radius:4px;border:1px solid #e9edee}.map-caption>span{font-size:12px;font-weight:600;display:block}.map-caption small{font-size:9px;color:#829099;display:block;margin-top:3px}.map-controls{position:absolute;bottom:20px;left:18px;display:flex;background:#fff;border:1px solid #dce2e5;box-shadow:0 3px 10px #1c364215;border-radius:6px;overflow:hidden}.map-controls button{width:35px;height:35px;background:white;border:0;border-right:1px solid #e3e7e9;font-size:19px}.map-controls button:last-child{border:0}.map-controls button:hover{background:#f0f5f7}.north{position:absolute;right:20px;top:17px;text-align:center;font-size:22px;color:#7c8f99;pointer-events:none}.north span{display:block;font-size:9px}.mini{position:absolute;right:16px;bottom:17px;background:#ffffffed;border:1px solid #dce2e5;border-radius:6px;width:165px;padding:10px;box-shadow:0 4px 16px #30445509;pointer-events:none}.mini>div{font-size:9px;display:flex;justify-content:space-between;color:#8997a0}.mini b{font-weight:500;color:#526c7b}.mini svg{display:block;width:100%;height:116px;margin-top:5px}.workspace footer{display:flex;justify-content:space-between;gap:10px;padding:10px 17px;font-size:9px;color:#87939c;border-top:1px solid #e1e6e8;background:#fff;flex-wrap:wrap}.workspace footer div{display:flex;align-items:center;gap:5px}.rail-key,.bus-key{width:17px;border-top:4px solid #52667a;margin-left:8px}.bus-key{border-top:3px solid #128eb2}.corridor-key{width:17px;border-top:5px solid var(--corridor);margin-left:8px}.station-key,.shared-key{width:7px;height:7px;border:1px solid #697d86;border-radius:50%;margin-left:7px}.shared-key{width:10px;height:10px;border:2px solid #334b5b}.detail{border-left:1px solid #dbe1e4;padding:23px 19px}.empty-detail>span{display:block;font-size:33px;color:#879ca5;margin:20px 0}.empty-detail h2{font-size:16px;line-height:1.8}.empty-detail p{font-size:12px;color:#8b979e;line-height:1.9}.area-legend{border-top:1px solid #e4e9ec;margin-top:30px;padding-top:12px}.area-legend h3{font-size:10px;color:#8799a5;font-weight:400}.area-legend span{display:block;font-size:11px;color:#647885;padding:6px}.area-legend span:nth-child(2){border-left:3px solid #e5c77d}.area-legend span:nth-child(3){border-left:3px solid #e6aaa0}.area-legend span:nth-child(4){border-left:3px solid #a7c7e5}.area-legend span:nth-child(5){border-left:3px solid #c7b7e0}.area-legend span:nth-child(6){border-left:3px solid #b3ce9f}.empty-detail small{font-size:10px;line-height:1.8;color:#9aa5ad;display:block;margin-top:20px}.detail .kicker{font-size:10px;color:#8b98a0;letter-spacing:.08em}.detail h2{font-size:20px;line-height:1.4;margin:8px 0}.detail .close{float:right;border:0;background:#f2f5f6;border-radius:4px;width:25px;height:25px;font-size:16px}.detail .description{font-size:11px;color:#7d8d98;line-height:1.7}.direction{display:flex;gap:5px;flex-wrap:wrap;margin:15px 0}.direction button{background:#f4f6f7;border:1px solid #e0e6e9;padding:5px 9px;border-radius:4px;font-size:11px}.direction button.active{background:#263f50;color:#fff}.stop-list{padding:8px 0 0;margin:0;list-style:none}.stop-list li{position:relative;padding:0 0 0 12px;margin-left:12px;border-left:3px solid var(--line)}.stop-list button{width:100%;text-align:left;border:0;background:transparent;padding:10px 0 10px 3px;display:flex;gap:10px;align-items:center}.stop-list button:hover{background:#f1f5f7}.stop-list .num{font-size:9px;color:#9aa6ae;width:19px}.stop-list b{font-size:11px;font-weight:500}.stop-list li::before{content:'';position:absolute;left:-5.5px;top:17px;width:8px;height:8px;background:#fff;border:2px solid var(--line);border-radius:50%}.merged-note{font-size:11px;line-height:1.7;color:#5d7280;background:#f4f7f8;border-radius:5px;padding:9px 10px;margin:12px 0}.merged-note b{display:block;color:#39515f;margin-bottom:3px}.merged-note span{display:block;color:#8b979f;margin-top:5px;font-size:10px}.exit-note{font-size:10px;color:#85959f;padding:10px;background:#f5f7f8;border-radius:4px;line-height:1.7}.station-link{border:1px solid #dee6eb;background:#f9fbfc;text-align:left;padding:9px;margin-bottom:7px;display:block;width:100%;font-size:12px;border-radius:5px}.station-link small{display:block;font-size:10px;color:#8998a1;margin-top:3px}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#fcfcfa;font-size:13px;color:#6b808c}#loading[hidden]{display:none}:root{--water:#c3dcea;--water-ink:#54819e;--corridor:#c8d1d7;--road:#e7e2d8;--green:#e6efe0}.zone-fill{opacity:.3}.bm-green{fill:var(--green);stroke:none;fill-rule:nonzero}.bm-face{fill:var(--water);stroke:none;fill-rule:nonzero}.bm-r3,.bm-r2,.bm-r1{fill:none;stroke:var(--road);stroke-linecap:round;stroke-linejoin:round}.bm-r3{stroke-width:.7}.bm-r2{stroke-width:1.3;stroke:#e2dbcf}.bm-r1{stroke-width:2.6;stroke:#d8d0bf}.bm-w3,.bm-w2,.bm-w1{fill:none;stroke:var(--water);stroke-linecap:round;stroke-linejoin:round}.bm-w3{stroke-width:1.1;opacity:.75}.bm-w2{stroke-width:3.4}.bm-w1{stroke-width:8}.bm-admin{fill:none;stroke:#c6bba6;stroke-width:1.3;stroke-dasharray:7 6}.bm-freeway{fill:none;stroke:#c9b99f;stroke-width:2.6;stroke-dasharray:9 7}.bm-freeway-label{font-size:calc(11px / var(--z,1));fill:#a89b80}.zone-label{font-size:calc(23px / var(--z,1));letter-spacing:3px;font-weight:600;fill:#8e958e;opacity:.5;paint-order:stroke;stroke:#fff;stroke-width:calc(4px / var(--z,1))}.water polygon,.water polyline{fill:var(--water);stroke:var(--water)}.water polyline{fill:none}.river-label{font-size:calc(12px / var(--z,1));fill:var(--water-ink);letter-spacing:3px;font-weight:500;pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:calc(2.5px / var(--z,1));opacity:.9}.corridor path{stroke:var(--corridor);stroke-linecap:round;stroke-linejoin:round}.line-hit{cursor:pointer}.station{cursor:pointer}.label{paint-order:stroke;stroke:#fff;stroke-width:5;stroke-linejoin:round;fill:#344550;font-size:14px;font-weight:500;pointer-events:none}.label.rail-label{font-weight:700;fill:#1f3340}.exit-label{font-size:11px;fill:#788d98;paint-order:stroke;stroke:#fff;stroke-width:3;pointer-events:none}.station:hover circle{stroke:#172e3a;stroke-width:3}.empty-list{padding:20px;font-size:12px;color:#80909b}button[hidden]{display:none}
@media(min-width:1650px){main{grid-template-columns:255px minmax(0,1fr) 280px}.mini{width:200px}.mini svg{height:145px}}
@media(max-width:1100px){main{grid-template-columns:210px minmax(0,1fr)}.detail{position:absolute;right:12px;top:149px;bottom:59px;width:240px;box-shadow:0 6px 30px #27425026;border:1px solid #dce3e7;border-radius:8px;display:none;z-index:4}.detail.is-open{display:block}.edition{display:none}.zone-nav{gap:0;padding:10px}.zone-nav button{padding:5px;font-size:10px}.mini{width:130px}.mini svg{height:91px}}
@media(max-width:650px){header{height:65px;padding:0 12px;gap:12px}.back{font-size:0}.back::first-letter{font-size:16px}.back b{font-size:10px}.brand .symbol{display:none}h1{font-size:16px}.brand p{font-size:8px}main{height:calc(100dvh - 65px);grid-template-columns:1fr;grid-template-rows:132px minmax(0,1fr)}.sidebar{border-right:0;display:grid;grid-template-columns:125px 1fr;grid-template-rows:78px 54px;overflow:hidden;border-bottom:1px solid #ddd}.side-head{padding:12px 8px}.side-head h2{font-size:11px}.side-head p{display:none}.search{margin-top:8px;padding:6px}.search input{font-size:10px}.filters{padding:4px 8px;grid-row:2;align-items:center}.filters button{font-size:9px;padding:5px 2px}.list-heading,.source-note{display:none}.route-list{grid-column:2;grid-row:1/3;min-height:0}.route-item{padding:5px}.route-item b{font-size:11px}.route-item small{font-size:9px}.map-caption small{display:none}.map-caption{top:8px;left:8px;padding:6px}.mini{width:108px;bottom:12px;right:9px;padding:7px}.mini svg{height:76px}.zone-nav{padding:6px 5px;gap:1px}.zone-nav button{font-size:9px;padding:4px}.workspace footer{font-size:8px;padding:7px;gap:4px}.map-controls{left:10px;bottom:13px}.map-controls button{height:31px;width:31px}.detail{top:237px;bottom:41px;right:6px;width:min(260px,85vw);padding:16px}.north{top:8px;right:12px;font-size:17px}.zone-label{font-size:24px}}
/* Keep the network dominant; route information opens only after a selection. */
@media(min-width:1101px){main{grid-template-columns:235px minmax(0,1fr)}.detail{position:absolute;right:14px;top:151px;bottom:58px;width:260px;display:none;border:1px solid #dbe3e8;border-radius:8px;box-shadow:0 6px 30px #27425026;z-index:4}.detail.is-open{display:block}}
main:has(.detail.is-open) .mini{visibility:hidden}