:root{--ink:#183e3b;--muted:#81958a;--sage:#72978a;--line:#e6ebe2;--accent:#d47b55;--paper:#fbfcf8;--bg:#eff3e9;font-family:Inter,"Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;color:var(--ink);font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,.map-viewport:focus-visible{outline:3px solid #d99065;outline-offset:3px}[hidden]{display:none!important}.app-shell{display:grid;grid-template-columns:350px minmax(0,1fr);height:100dvh;min-height:640px;overflow:hidden}.sidebar{background:#fcfdfa;border-right:1px solid #e4eae1;padding:25px 25px 18px;display:flex;flex-direction:column;min-height:0;z-index:2}.brand{display:flex;gap:12px;align-items:center}.brand-mark{position:relative;width:43px;height:43px;background:#285b4c;border-radius:14px;display:grid;place-items:center;color:#fff;font-family:Georgia,serif;font-size:26px}.brand-mark:after{content:"✦";position:absolute;right:-4px;top:-7px;color:#d89065;font:15px sans-serif}.brand-mark i{position:absolute;width:17px;height:3px;background:#e9c591;bottom:8px;border-radius:4px}.brand-kicker{font-size:9px;font-weight:800;letter-spacing:.13em;color:#719487}.brand h1{font-size:17px;letter-spacing:.035em;margin:4px 0 0}.brand h1 span{font-size:9px;margin-left:7px;border:1px solid #c1d5cb;color:#6c9587;border-radius:5px;padding:2px 4px;vertical-align:2px}.intro{padding:34px 0 25px}.eyebrow,.map-kicker,.dialog-kicker{font-size:10px;font-weight:800;letter-spacing:.15em;color:#77988b}.eyebrow span{display:inline-block;width:16px;height:2px;background:#d68258;vertical-align:3px;margin-right:6px}.intro h2{font-size:27px;letter-spacing:.04em;line-height:1.38;margin:12px 0 9px}.intro h2 span{color:#d3865e}.intro p{font-size:12px;line-height:1.8;color:#8a9c93;margin:0}.tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line);margin-bottom:22px}.tab{padding:0 0 13px;border:0;background:transparent;font-size:13px;font-weight:700;color:#91a49a;position:relative}.tab span{font-size:17px;margin-right:3px}.tab.active{color:#275b4e}.tab.active:after{content:"";height:3px;background:#457e6d;border-radius:4px;position:absolute;bottom:-1px;left:15%;right:15%}.panel{min-height:0;display:flex;flex-direction:column}.field-label{font-size:13px;font-weight:750;margin:0 0 10px}.search-wrap{border:1px solid #dfe8de;background:#f7faf5;border-radius:11px;display:flex;align-items:center;height:46px;padding:0 12px;gap:9px}.search-wrap:focus-within{border-color:#79a590;box-shadow:0 0 0 3px #e3f0e7}.search-wrap svg{width:18px;fill:none;stroke:#789389;stroke-width:1.8;stroke-linecap:round}.search-wrap input{width:100%;min-width:0;background:none;border:0;outline:0;color:#274a41;font-size:12px}.search-wrap input::placeholder{color:#a1b0a7}.search-wrap kbd{border:1px solid #dce7de;border-radius:4px;color:#9aada0;padding:0 5px;font-size:11px}.section-line{display:flex;justify-content:space-between;align-items:center;margin:22px 0 9px;font-size:12px;font-weight:750}.section-line span:last-child{font-size:10px;font-weight:500;color:#a0b1a6}.place-list{overflow-y:auto;overscroll-behavior:contain;padding-right:3px;min-height:0;scrollbar-width:thin;scrollbar-color:#d4e2d7 transparent}.place-item{width:100%;display:flex;align-items:center;gap:11px;padding:9px 8px;border:0;border-radius:10px;text-align:left;background:transparent;color:var(--ink)}.place-item:hover,.place-item.selected{background:#edf5ed}.place-icon{width:33px;height:33px;flex:none;border-radius:10px;display:grid;place-items:center;background:#e3efe5;color:#558b72;font-weight:800;font-size:11px}.place-item[data-kind="service"] .place-icon{background:#e4edf0;color:#688c98}.place-item[data-kind="sport"] .place-icon{background:#f7e9df;color:#c47e5f}.place-copy{min-width:0;flex:1}.place-copy strong{font-size:12px;display:block}.place-copy small{font-size:10px;color:#9aaca2;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}.place-arrow{color:#b7c8bd;font-size:15px}.empty-state{font-size:12px;line-height:1.7;color:#8a9d92}.sidebar-bottom{margin-top:auto;padding-top:16px;border-top:1px solid #edf1ea}.mini-legend{display:flex;gap:9px;justify-content:space-between;white-space:nowrap;font-size:9px;color:#879c90}.legend-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:4px}.legend-dot.teaching{background:#8dbba0}.legend-dot.service{background:#95b6c4}.legend-dot.sports{background:#cf927a}.sidebar-bottom>a{display:block;text-decoration:none;color:#5c897b;font-size:11px;font-weight:700;margin-top:15px}.sidebar-bottom a span{float:right}.sidebar-bottom>p{color:#b2bfb5;font-size:9px;margin:8px 0 0}.route-intro{display:flex;gap:12px;align-items:center;background:#f0f7ef;border-radius:12px;padding:13px;margin-bottom:21px}.route-icon{background:#d8eadc;color:#4e8b71;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;font-size:20px}.route-intro strong{font-size:12px}.route-intro p{color:#89a093;font-size:10px;margin:4px 0 0}.route-fields{position:relative;padding-left:20px}.route-fields label{display:block;font-size:11px;font-weight:700;margin:0 0 7px}.route-line{position:absolute;left:3px;top:9px;bottom:28px;border-left:1px dashed #bdcec3}.dot{position:absolute;left:0;width:8px;height:8px;border-radius:50%;background:#74a28d;margin-top:4px;box-shadow:0 0 0 3px #edf5ec}.dot.end{background:#d98c65}.route-fields select{appearance:none;background:#f8faf6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%237c998a' stroke-width='1.3' d='m2 4 4 4 4-4'/%3E%3C/svg%3E") no-repeat right 13px center;border:1px solid #dfe8de;border-radius:10px;width:100%;height:42px;color:#345f51;font-size:12px;padding:0 30px 0 12px;margin:0 0 17px}.swap{position:absolute;right:11px;top:55px;border:1px solid #dfebe0;background:white;color:#709a88;border-radius:50%;width:28px;height:28px;z-index:1}.primary-button{border:0;border-radius:10px;background:#315f50;color:white;height:45px;font-size:12px;font-weight:750;letter-spacing:.03em}.primary-button:hover{background:#224b3d}.primary-button span{float:right;margin-right:14px}.route-result{margin-top:18px}.route-placeholder{color:#9caca2;font-size:11px;line-height:1.7}.route-summary{border-top:1px solid #edf1ea;padding-top:15px}.route-summary strong{font-size:13px}.route-summary p{font-size:11px;color:#718d7e;line-height:1.7}.route-steps{list-style:none;padding:0;margin:12px 0;color:#638373;font-size:11px;line-height:1.9}.route-steps li:before{content:"•";color:#d38a63;margin-right:8px}.clear-route{align-self:flex-start;border:0;background:transparent;color:#8b9e91;font-size:11px;text-decoration:underline;padding:8px 0}.map-area{min-width:0;min-height:0;display:flex;flex-direction:column;padding:30px 34px 14px;background:#f0f4eb}.map-header{display:flex;justify-content:space-between;align-items:center;padding:0 1px 22px}.map-kicker span{color:#d7976f;margin-left:6px}.map-header h2{font-size:21px;margin:8px 0 4px;letter-spacing:.02em}.map-header p{font-size:11px;color:#93a79a;margin:0}.reset-button{color:#4d7c6b;border:1px solid #dbe7da;border-radius:10px;background:#fcfdfa;padding:10px 13px;font-size:11px;font-weight:700}.reset-button span{font-size:16px;margin-right:5px}.map-viewport{position:relative;overflow:hidden;flex:1;min-height:0;border-radius:20px;border:1px solid #dce8db;background:radial-gradient(ellipse at 50% 39%,#f7fbf0 0%,#eaf2e4 70%,#e5eee0 100%);touch-action:none;user-select:none}.map-viewport.dragging{cursor:grabbing}.map-viewport canvas,.map-labels{position:absolute;inset:0;width:100%;height:100%}.map-labels{pointer-events:none}.map-label{position:absolute;transform:translate(-50%,-110%);white-space:nowrap;pointer-events:auto;background:rgba(255,255,250,.95);color:#365e51;border:1px solid rgba(180,203,184,.85);border-radius:7px;box-shadow:0 3px 10px #4f6e5720;padding:5px 8px;font-size:10px;font-weight:800;transition:background .15s,transform .15s}.map-label:hover,.map-label.selected{background:#315f50;color:white;z-index:10;transform:translate(-50%,-115%) scale(1.06);border-color:#315f50}.map-label:after{content:"";position:absolute;width:6px;height:6px;bottom:-4px;left:calc(50% - 3px);background:inherit;border-right:1px solid #b4cbb8;border-bottom:1px solid #b4cbb8;transform:rotate(45deg)}.map-label .map-num{color:#87aa99;margin-right:5px;font-size:9px}.map-label.selected .map-num{color:#cce6d7}.map-label.dimmed{opacity:.32}.map-label.match{background:#e6a77d;color:#fff;border-color:#d18a5f;opacity:1}.map-label.match .map-num{color:#fff}.map-controls{position:absolute;right:19px;bottom:55px;display:flex;flex-direction:column;border:1px solid #dce8dd;border-radius:12px;background:#fffefa;box-shadow:0 4px 16px #54745a12;padding:4px}.map-controls button{border:0;background:transparent;width:34px;height:31px;color:#537a68;font-size:19px;border-radius:7px}.map-controls button:hover{background:#eef5eb}.map-controls div{height:1px;background:#e7eee5;margin:3px 5px}.compass{position:absolute;right:19px;top:19px;width:78px;height:78px;border-radius:50%;border:1px solid #dae7d8;background:#fffffbed;box-shadow:0 4px 16px #54745a12;color:#6f9080}.compass:before{content:"";position:absolute;inset:15px;border:1px solid #e4ede3;border-radius:50%}.compass-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#8eaa98;font-size:15px}.direction{position:absolute;font-size:9px;font-weight:800;transform:translate(-50%,-50%)}.direction.north{color:#cb7755}.compass i{position:absolute;left:50%;top:50%;width:3px;height:17px;background:linear-gradient(#d58260 0 50%,#87a999 50%);transform-origin:center;transform:translate(-50%,-50%);border-radius:5px;pointer-events:none}.map-hint{position:absolute;left:20px;top:20px;border-radius:9px;background:#ffffffc9;border:1px solid #e2ebe1;color:#789587;font-size:10px;padding:9px 11px}.map-hint span{font-size:14px;margin-right:5px}.map-hint b{padding:0 4px;color:#bdcdc1}.map-footer{position:absolute;bottom:17px;left:20px;right:20px;display:flex;justify-content:space-between;pointer-events:none;color:#8ea69a;font-size:9px;font-weight:700;letter-spacing:.1em}.map-footer i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#8ab399;margin-right:6px}.disclaimer{font-size:10px;color:#9daf9f;padding:11px 2px 0}.disclaimer button{border:0;background:transparent;color:#789989;font-size:10px;text-decoration:underline;padding:0 2px}.selection-card{position:absolute;left:20px;bottom:49px;width:230px;background:#fffefa;border:1px solid #dce9dc;border-radius:13px;padding:15px;box-shadow:0 8px 24px #466b5220}.selection-card>button:first-child{position:absolute;right:10px;top:7px;background:transparent;border:0;color:#91aa9a;font-size:20px}.selection-type{font-size:9px;color:#94ad9d;letter-spacing:.1em;font-weight:800}.selection-card h3{font-size:15px;margin:8px 0 6px}.selection-card p{font-size:11px;line-height:1.6;color:#8da297;margin:0 0 12px}.selection-card #use-destination{border:0;border-radius:7px;background:#e9f3e9;color:#4f816b;padding:8px 10px;font-size:10px;font-weight:750;width:100%;text-align:left}.selection-card #use-destination span{float:right}dialog{border:0;border-radius:18px;max-width:440px;padding:28px;color:var(--ink);box-shadow:0 20px 80px #274b3d40}dialog::backdrop{background:#203c3280}dialog h2{font-size:20px}dialog p{font-size:13px;line-height:1.9;color:#6e8879}dialog a{font-size:12px;color:#568b74}.dialog-close{position:absolute;right:15px;top:11px;border:0;background:none;font-size:22px;color:#8ca598}
.panel{flex:1}#route-panel{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#d4e2d7 transparent}#route-panel>*{flex-shrink:0}.sidebar-bottom{flex-shrink:0}.mini-legend{justify-content:flex-start;flex-wrap:wrap;column-gap:11px;row-gap:7px}.legend-line{display:inline-block;width:10px;height:3px;vertical-align:2px;margin-right:4px;border-radius:2px}.legend-line.passage{background:#a9c9bb}.legend-line.route{background:#dc815e}.map-hint .hint-icon{font-size:14px;margin-right:5px}.map-hint .hint-desktop,.map-hint .hint-touch{font-size:inherit;margin:0}.map-hint .hint-touch{display:none}.map-label.route-start,.map-label.route-end{color:white;opacity:1;z-index:15!important}.map-label.route-start{background:#528b73;border-color:#528b73}.map-label.route-end{background:#d67856;border-color:#d67856}.map-label.route-start .map-num,.map-label.route-end .map-num{color:#fff}.map-label.route-start:before,.map-label.route-end:before{display:inline-block;background:#ffffff55;border-radius:50%;width:14px;height:14px;line-height:14px;text-align:center;margin-right:4px;font-size:9px}.map-label.route-start:before{content:'A'}.map-label.route-end:before{content:'B'}
@media(max-height:800px) and (min-width:761px){.sidebar{padding-top:18px}.intro{padding:20px 0 17px}.intro h2{font-size:23px}.tabs{margin-bottom:15px}.section-line{margin-top:15px}.place-item{padding:7px 8px}.map-area{padding-top:23px}.map-header{padding-bottom:15px}}
@media(max-width:760px){.app-shell{display:flex;flex-direction:column;height:auto;min-height:100dvh;overflow:visible}.sidebar{padding:14px 16px 12px;border:0}.brand-mark{width:37px;height:37px;border-radius:12px;font-size:22px}.brand h1{font-size:15px}.brand-kicker{font-size:8px}.intro,.sidebar-bottom{display:none}.tabs{margin:15px 0 13px}.tab{padding-bottom:9px}.panel{max-height:none}.place-list{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;padding:0 0 4px}.place-item{min-width:128px;width:auto;padding:7px;background:#f3f8f1}.place-icon{width:29px;height:29px}.place-copy small,.place-arrow{display:none}.section-line{margin:12px 0 7px}.section-line span:last-child{font-size:9px}.search-wrap{height:42px}.route-intro{margin-bottom:12px}.route-fields select{height:38px;margin-bottom:13px}.route-result{margin-top:10px}.map-area{padding:8px 12px 12px}.map-header{padding:4px 2px 11px}.map-header h2{font-size:16px;margin:4px 0}.map-header p,.map-kicker{display:none}.reset-button{padding:7px 9px;font-size:10px}.map-viewport{height:61vh;min-height:430px;flex:none;border-radius:15px}.map-hint{top:11px;left:11px;font-size:9px;padding:7px}.compass{top:11px;right:11px;width:66px;height:66px}.map-controls{right:11px;bottom:42px}.map-footer{bottom:12px;left:12px;right:12px;font-size:8px}.map-label{font-size:9px;padding:4px 6px}.selection-card{left:10px;bottom:37px;width:200px;padding:12px}.disclaimer{font-size:9px;line-height:1.6}.route-steps{margin:6px 0}.route-summary{padding-top:8px}.route-intro p{margin-top:2px}}
@media(max-width:760px){.panel{flex:none}#route-panel{overflow:visible}.sidebar-bottom{display:block;margin-top:10px;padding-top:9px}.sidebar-bottom>a{margin-top:8px}.sidebar-bottom>p{display:none}.map-hint .hint-desktop{display:none}.map-hint .hint-touch{display:inline}}
@media(max-width:410px){.map-label{font-size:8px;padding:3px 5px}.map-label .map-num{display:none}.map-viewport{min-height:410px}.map-hint{font-size:8px}.map-footer span:last-child{display:none}}