:root{--bg:#f5f8f5;--paper:#fff;--ink:#173c2e;--pine:#103f30;--green:#29805a;--mint:#bbef95;--line:#e0ebe2;--muted:#738d7d;--orange:#9e6d31;--shadow:0 15px 55px #18392610}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;color:var(--ink);background:var(--bg);font:14px/1.65 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin-top:0}
button,input,select{font:inherit}
button{cursor:pointer}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #a9d4b3;outline-offset:2px}
a{text-decoration:none;color:inherit}
svg{width:21px;height:21px;flex-shrink:0}
.icons{position:absolute;width:0;height:0;overflow:hidden}
.wrap{max-width:1160px;margin:0 auto;padding:0 25px}
.header{position:relative;z-index:10;height:76px;border-bottom:1px solid #e8ede6;background:#f9fbf8}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:840;letter-spacing:-.7px;line-height:1}
.brand-mark{height:40px;width:40px;display:grid;place-items:center;color:#c5f899;background:#133c2f;border-radius:13px;transform:rotate(-5deg)}
.brand-mark svg{height:23px;width:23px}
.brand small{display:block;margin-top:6px;color:#759781;font-size:8px;font-weight:800;letter-spacing:2.3px;font-family:"Segoe UI",sans-serif}
.desktop-nav{display:flex;gap:30px;align-items:center;color:#688a76;font-size:13px;font-weight:700}
.desktop-nav a:hover{color:#236443}
.header-badge{display:inline-flex;gap:9px;align-items:center;padding:7px 11px;background:#eaf4e9;color:#3a7555;border:1px solid #dcebd9;border-radius:20px;font-size:11px;font-weight:770;white-space:nowrap}
.status-dot,.time-led{width:7px;height:7px;border-radius:50%;background:#43a66a;display:inline-block;box-shadow:0 0 0 3px #d5e9d7}
.hero{background:linear-gradient(145deg,#eff7eb,#e4efe8 80%,#eaf2e6);position:relative;overflow:hidden}
.hero-grid{padding-top:68px;padding-bottom:66px;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(390px,.9fr);gap:64px;align-items:center}
.hero-copy{min-width:0}
.eyebrow{display:block;color:#3b9665;letter-spacing:.35px;font-size:12px;font-weight:770}
.small-star{font-size:18px;color:#75b87e;vertical-align:-1px;margin-right:5px}
.hero h1{margin:17px 0 23px;font-size:clamp(42px,4.6vw,59px);font-weight:850;letter-spacing:-2.4px;line-height:1.18}
.hero h1 em{font-style:normal;color:#34865d}
.hero-copy>p{font-size:16px;line-height:1.9;color:#6a8875;max-width:550px;margin-bottom:32px}
.hero-facts{display:flex;flex-wrap:wrap;gap:13px 23px;color:#558369;font-size:12px;font-weight:710}
.hero-facts span{display:inline-flex;align-items:center;gap:7px}
.hero-facts svg{height:17px;width:17px;color:#4c9770}
.finder-panel{background:#fff;border:1px solid #e0e9df;border-radius:24px;padding:27px;box-shadow:0 25px 77px #24483321}
.finder-title{display:flex;align-items:center;justify-content:space-between;margin:1px 0 17px;font-size:18px;font-weight:830;letter-spacing:-.35px}
.finder-icon{height:34px;width:34px;border-radius:11px;background:#ecf7e8;color:#469165;display:grid;place-items:center}
.finder-icon svg{height:18px;width:18px}
.gps-button{border:0;border-radius:13px;background:var(--pine);color:#fff;font-weight:780;font-size:15px;display:flex;align-items:center;justify-content:flex-start;gap:11px;width:100%;padding:15px}
.gps-button svg{height:20px;width:20px;color:#baf295}
.gps-button .right-arrow{margin-left:auto;color:#fff}
.gps-button:hover{background:#226246}
.gps-button:disabled{opacity:.6;cursor:wait}
.or-line{display:flex;align-items:center;gap:14px;color:#a3b3a5;font-size:11px;margin:23px 0 16px}
.or-line:before,.or-line:after{content:"";height:1px;background:#e7ede7;flex:1}
.input-label{display:block;margin-bottom:8px;font-size:12px;color:#738a78;font-weight:700}
.place-input{display:flex;align-items:center;gap:10px;border:1px solid #dfe9df;background:#f7faf7;border-radius:12px;padding:5px 5px 5px 13px;min-height:54px}
.place-input>svg{color:#649979;width:19px;height:19px}
.place-input input{min-width:0;flex:1;border:0;background:transparent;outline:none!important;color:#22523a;font-size:13px}
.place-input input::placeholder{color:#a1b1a5}
.place-input button{background:#e5f2e6;color:#2e7752;font-size:12px;font-weight:760;padding:11px 12px;white-space:nowrap;border:0;border-radius:9px}
.place-input button:disabled{opacity:.55;cursor:wait}
.place-candidates{padding:9px 0;display:flex;flex-direction:column;gap:4px}
.place-candidates[hidden]{display:none}
.place-option{border:1px solid #e3ece3;background:#fff;border-radius:10px;text-align:left;padding:9px 10px;font-size:12px;color:#427356;display:flex;align-items:center;gap:8px}
.place-option:hover{background:#f0f8ef}
.place-option svg{width:15px;height:15px;color:#559069}
.finder-options{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:18px 0 15px}
.finder-options label{font-size:12px;font-weight:750;color:#647c6c}
.finder-options select{border:1px solid #e1e9e0;border-radius:9px;padding:7px 11px;background:#f9fbf8;font-size:12px;color:#3b6a50}
.selected-place{border-radius:11px;padding:10px 12px;display:flex;align-items:center;gap:10px;background:#f0f5ef;color:#688b73;font-size:12px}
.place-indicator{height:9px;width:9px;background:#a4bbaa;border-radius:50%;flex-shrink:0}
.selected-place.selected{background:#edf7e7;color:#347452}
.selected-place.selected .place-indicator{background:#51ad70}
.privacy-description{font-size:10px;line-height:1.7;color:#9bafa0;margin:12px 0 0}
.time-band{background:#fff;border-bottom:1px solid #e6ede6}
.time-inner{padding-top:17px;padding-bottom:17px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.time-inner>div{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.time-inner>div>span:nth-child(2){font-size:12px;font-weight:750;color:#6d8a73}
#beijingClock{font:800 23px/1 "Segoe UI",sans-serif;letter-spacing:1px;color:#286d4e;font-variant-numeric:tabular-nums}
#beijingDate{font-size:12px;color:#98aca0}
.time-band-right{display:flex;align-items:center;gap:10px;color:#658971;font-size:12px}
.time-band-right svg{height:17px;width:17px}
.time-band-right small{font-size:10px;color:#9eaea2}
.search-area{padding-top:76px;padding-bottom:49px}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:25px}
.overline{font:850 10px/1.4 "Segoe UI",sans-serif;letter-spacing:2px;color:#6aab77}
.section-heading h2{margin:7px 0 8px;font-size:34px;letter-spacing:-1.1px;line-height:1.25}
.section-heading p{color:#90a395;font-size:13px;margin:0}
.result-count{border:1px solid #d6e8d6;background:#eaf5e8;border-radius:40px;padding:8px 13px;font-size:12px;color:#45815b;font-weight:780;white-space:nowrap}
.filter-toolbar{padding:20px;background:#fff;border:1px solid #e1ebe1;border-radius:18px;box-shadow:var(--shadow);scroll-margin-top:70px}
.filter-prompt{font-size:13px;color:#5d8069;font-weight:800;display:flex;align-items:center;gap:9px;margin-bottom:14px}
.filter-prompt svg{width:17px;height:17px;color:#5d9c70}
.filter-chips{display:flex;flex-wrap:wrap;gap:8px}
.filter-chips button{display:inline-flex;align-items:center;gap:7px;border:1px solid #dfe9df;background:#f8faf7;border-radius:25px;padding:10px 13px;color:#72907a;font-size:12px;font-weight:720;white-space:nowrap}
.filter-chips button svg{width:15px;height:15px}
.filter-chips button.active{background:#1d5a43;border-color:#1d5a43;color:#fff}
.filter-chips button:hover{border-color:#91b99d}
.filter-disclaimer{margin:13px 0 0;color:#91a899;font-size:11px;line-height:1.7}
.status-line{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:24px 0 16px}
.status-line>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.status-line strong{font-size:15px;display:flex;align-items:center;gap:6px}
.status-line strong .status-dot{height:6px;width:6px}
.status-line small{font-size:11px;color:#91a79a}
.status-line button{display:flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid #dbe9dd;background:#fff;border-radius:10px;font-size:12px;color:#4d8662;font-weight:700;white-space:nowrap}
.status-line button:disabled{opacity:.4;cursor:default}
.status-line button svg{height:14px;width:14px}
.station-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.blank-state{grid-column:1/-1;text-align:center;padding:53px 22px;background:#fff;border:1px dashed #d7e5d6;border-radius:19px}
.blank-icon{display:grid;place-items:center;width:59px;height:59px;margin:0 auto 20px;background:#eaf5e8;color:#60a17a;border-radius:19px}
.blank-icon svg{width:27px;height:27px}
.blank-state h3{font-size:20px;margin:0 0 8px}
.blank-state p{font-size:13px;color:#89a091;max-width:490px;margin:0 auto;line-height:1.8}
.station-card{background:#fff;border:1px solid #e2eae0;border-radius:18px;padding:20px;box-shadow:0 9px 35px #1d452b12}
.station-card-top{display:flex;justify-content:space-between;align-items:start;gap:10px;margin-bottom:12px}
.operator-pill{font-size:10px;font-weight:760;border-radius:7px;background:#eaf3ec;color:#3d855c;padding:5px 8px}
.operator-pill.source-osm{background:#f1f3ee;color:#778c72}
.mall-pill{font-size:10px;color:#9d7a42;background:#faf4e7;border-radius:7px;padding:5px 8px}
.station-card h3{font-size:17px;margin:0 0 5px;font-weight:810;line-height:1.45}
.station-card .address{color:#90a295;font-size:11px;min-height:32px;margin-bottom:10px;line-height:1.6}
.station-features{display:flex;flex-wrap:wrap;gap:9px 12px;padding:11px 0;border-top:1px solid #edf2ec}
.station-features span{font-size:11px;color:#7a9180}
.station-features strong{font-weight:750;color:#467b56}
.station-price-line{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#f6f9f4;padding:12px;border-radius:10px}
.station-price-line>span{color:#819783;font-size:11px}
.station-price-line strong{color:#ae8048;font-size:14px}
.station-price-line strong.known{color:#2e8155}
.parking-hint{font-size:11px;line-height:1.6;color:#90a395;margin:12px 0 0}
.station-actions{display:flex;gap:8px;margin-top:14px}
.station-actions button,.station-actions a{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;border-radius:10px;padding:10px;border:1px solid #d9e7da;background:#eef6ed;color:#407c56;font-size:12px;font-weight:740}
.station-actions a{background:#fff;color:#598a65}
.station-actions svg{height:14px;width:14px}
.results-tail{font-size:11px;text-align:center;margin-top:18px;color:#98ab9d}
.map-escape{margin-top:20px;margin-bottom:75px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:#173f31;border-radius:22px;color:white;padding:27px}
.map-left{display:flex;align-items:center;gap:15px;min-width:0}
.map-icon{height:48px;width:48px;display:grid;place-items:center;background:#ffffff17;border:1px solid #ffffff28;border-radius:14px;flex-shrink:0;color:#c2ef99}
.map-icon svg{width:23px;height:23px}
.map-left h3{font-size:18px;margin:0 0 5px}
.map-left p{font-size:12px;color:#bdd3c3;line-height:1.6;margin:0}
.map-actions{display:flex;flex-shrink:0;gap:8px}
.map-actions button{border:1px solid #b0d99f;padding:10px 13px;border-radius:10px;font-size:12px;font-weight:760;background:#b8e69e;color:#1b4c31}
.map-actions button+button{background:transparent;color:#fff;border-color:#ffffff75}
.explain{padding:70px 0 82px;background:#fff;border-top:1px solid #e6ede4}
.explainer-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.explainer-cards article{border-radius:17px;border:1px solid #e7ece5;background:#f9fbf8;padding:24px}
.explain-icon{display:grid;place-items:center;width:40px;height:40px;color:#4f9870;background:#eaf4e8;border-radius:12px;margin-bottom:22px}
.explainer-cards h3{font-size:16px;margin-bottom:10px}
.explainer-cards p{font-size:12px;line-height:1.85;color:#83978a;margin:0}
.data-credit{font-size:11px;line-height:1.75;color:#a0b0a4;margin:25px 0 0}
.footer{background:#123b2e;color:#fff;padding:29px 0}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:18px}
.footer-inner>div{display:flex;flex-direction:column}
.footer strong{font-size:19px}
.footer span{font-family:"Segoe UI",sans-serif;letter-spacing:1px;color:#a9c7af;font-size:9px}
.footer p{font-size:11px;color:#adcfb3;margin:0}
.footer a{font-size:12px;color:#b9e4b8;white-space:nowrap}
.mobile-nav{display:none}
.station-dialog{border:0;border-radius:22px;width:min(560px,calc(100% - 30px));max-height:88vh;padding:0;box-shadow:0 27px 90px #061b106b;color:var(--ink)}
.station-dialog::backdrop{background:#0f2b1c99;backdrop-filter:blur(3px)}
.dialog-handle{height:5px;width:44px;background:#dce8df;margin:10px auto 0;border-radius:6px}
.dialog-head{padding:18px 22px;display:flex;align-items:start;justify-content:space-between;gap:12px}
.dialog-head small{font:800 10px "Segoe UI",sans-serif;letter-spacing:1.6px;color:#8bab90}
.dialog-head h2{font-size:22px;line-height:1.4;margin:5px 0 0}
.dialog-head button{border:0;display:grid;place-items:center;background:#eff6ed;color:#3b7953;width:35px;height:35px;border-radius:50%}
.dialog-head button svg{width:17px;height:17px}
.dialog-content{padding:0 22px 12px;max-height:calc(88vh - 178px);overflow:auto}
.detail-row{display:flex;gap:14px;justify-content:space-between;padding:11px 0;border-bottom:1px solid #ecf1eb;line-height:1.7;font-size:12px}
.detail-row span{color:#8ba091;flex:0 0 30%}
.detail-row strong{font-weight:700;color:#2f6248;text-align:right;overflow-wrap:anywhere}
.detail-highlight{background:#fff8e7;color:#92703c;border-radius:10px;font-size:11px;line-height:1.7;padding:12px;margin:8px 0 16px}
.detail-section-title{font-size:14px;margin:18px 0 6px}
.tariff-table{border-collapse:collapse;width:100%;font-size:11px}
.tariff-table th,.tariff-table td{border-bottom:1px solid #edf1eb;padding:9px 4px;text-align:right}
.tariff-table th:first-child,.tariff-table td:first-child{text-align:left}
.tariff-table th{color:#92a697}
.tariff-table td{color:#447c57}
.dialog-foot{padding:15px 22px 22px;border-top:1px solid #edf0ec}
.dialog-foot button{width:100%;background:#174c38;color:#fff;border:0;border-radius:10px;padding:12px;font-weight:740}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:30;max-width:calc(100% - 30px);background:#163d30;color:#fff;padding:11px 16px;border-radius:12px;box-shadow:0 12px 35px #122b224d;font-size:12px;text-align:center}
[hidden]{display:none!important}
@media(max-width:1000px){.hero-grid{gap:30px;grid-template-columns:minmax(0,1fr) minmax(345px,.92fr)}.hero h1{font-size:44px}.station-results{grid-template-columns:1fr}}
@media(max-width:800px){.wrap{padding:0 20px}.desktop-nav{display:none}.hero-grid{grid-template-columns:1fr;gap:22px;padding-top:45px;padding-bottom:38px}.hero h1{font-size:44px}.finder-panel{max-width:100%}.hero-facts{margin-bottom:5px}.time-inner{flex-wrap:wrap}.map-escape{flex-direction:column;align-items:stretch}.map-actions{justify-content:flex-start}.explainer-cards{grid-template-columns:1fr}}
@media(max-width:500px){
 .header{height:64px}.wrap{padding-left:16px;padding-right:16px}.header-inner{gap:10px}.brand{font-size:19px}.brand-mark{height:35px;width:35px;border-radius:11px}.brand-mark svg{height:21px;width:21px}
 .brand small{font-size:7px;letter-spacing:1.7px}.header-badge{font-size:10px;padding:6px 8px}
 .hero-grid{padding-top:35px;padding-bottom:29px;gap:20px}.eyebrow{font-size:11px}.hero h1{font-size:39px;letter-spacing:-1.6px;margin:13px 0 17px}.hero-copy>p{font-size:13px;line-height:1.8;margin-bottom:17px}.hero-facts{gap:9px 15px;font-size:10px}.hero-facts svg{width:15px;height:15px}
 .finder-panel{padding:18px;border-radius:18px}.finder-title{font-size:16px}.gps-button{padding:13px;font-size:13px}.or-line{margin:15px 0 12px}.place-input{min-height:48px;gap:5px;padding-left:10px}.place-input input{font-size:12px}.place-input button{font-size:11px;padding:10px 8px}.finder-options{margin:14px 0}.privacy-description{font-size:10px}
 .time-inner{padding-top:13px;padding-bottom:13px;gap:6px}.time-inner>div{gap:8px}#beijingClock{font-size:20px}#beijingDate{font-size:11px}.time-band-right{font-size:10px}.time-band-right small{font-size:9px}
 .search-area{padding-top:46px;padding-bottom:28px}.section-heading{align-items:start;gap:9px;margin-bottom:17px}.section-heading h2{font-size:26px}.section-heading p{font-size:11px}.result-count{padding:6px 9px;font-size:10px}
 .filter-toolbar{padding:14px;border-radius:15px}.filter-prompt{font-size:12px}.filter-chips{gap:7px}.filter-chips button{font-size:11px;padding:9px 11px}.filter-disclaimer{font-size:10px}
 .station-results{gap:10px}.status-line{margin:20px 0 13px}.status-line strong{font-size:13px}.status-line small{font-size:10px}.status-line button{padding:8px 9px;font-size:11px}.station-card{padding:16px}.station-card h3{font-size:16px}.station-features{gap:7px 10px}.map-escape{padding:18px;border-radius:17px;margin-bottom:49px}.map-left{gap:10px}.map-icon{height:43px;width:43px}.map-left h3{font-size:15px}.map-left p{font-size:11px}.map-actions{width:100%}.map-actions button{flex:1;padding:11px 7px;font-size:11px}
 .explain{padding:52px 0 65px}.explainer-cards{gap:10px}.explainer-cards article{padding:18px}.explain-icon{margin-bottom:12px}.explainer-cards h3{font-size:15px}.footer-inner{flex-direction:column;align-items:flex-start;gap:5px}.footer{padding-bottom:105px}
 .mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:15;background:#fffffff5;border-top:1px solid #e5ece4;backdrop-filter:blur(15px);padding:9px 8px calc(8px + env(safe-area-inset-bottom));justify-content:space-around;box-shadow:0 -8px 22px #173d280a}
 .mobile-nav a{display:flex;align-items:center;flex-direction:column;gap:2px;color:#889d8d;font-weight:760;font-size:10px;min-width:57px}.mobile-nav svg{height:20px;width:20px}.mobile-nav a:hover{color:#278052}
 .station-dialog{width:100%;max-height:90vh;position:fixed;bottom:0;margin:0;border-radius:23px 23px 0 0}.dialog-head{padding:13px 18px}.dialog-content{padding:0 18px 10px;max-height:calc(90vh - 186px)}.dialog-foot{padding:13px 18px calc(14px + env(safe-area-inset-bottom))}.toast{bottom:90px}
}
@media(max-width:355px){.hero h1{font-size:35px}.time-inner>div>span:nth-child(2){font-size:11px}.filter-chips button{padding:8px 9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.external-place-search{border:1px solid #cce3d0;background:#ecf7ed;color:#2c7652;border-radius:10px;padding:11px 12px;font-size:12px;font-weight:750;width:100%;margin-top:7px}
.embedded-section{padding-bottom:65px}
.embed-panel{background:#fff;border:1px solid #dbe8dd;border-radius:19px;padding:18px;box-shadow:0 12px 42px #18392612}
.embed-intro{display:flex;align-items:center;gap:13px}
.embed-icon{height:44px;width:44px;border-radius:12px;background:#e6f3e7;color:#388962;display:grid;place-items:center;flex-shrink:0}
.embed-intro>div{flex:1;min-width:0}.embed-intro strong{font-size:15px}.embed-intro p{font-size:11px;color:#7b9783;margin:4px 0 0}
.embed-intro button{border:0;background:#184d38;color:#fff;border-radius:10px;padding:11px 14px;font-weight:750;font-size:12px}
.embed-frame-host{margin-top:15px;border-radius:12px;overflow:hidden;background:#f1f5f0;border:1px solid #e0eae0;min-height:430px}
.embed-frame-host iframe{display:block;width:100%;height:490px;border:0}
.embed-attribution{font-size:11px;color:#8da594;margin:12px 0 0}
.embed-attribution a{text-decoration:underline}
@media(max-width:500px){.embed-intro{flex-wrap:wrap}.embed-intro button{width:100%}.embed-frame-host iframe{height:475px}}

.embed-loading-notice{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 13px;background:#f7faf5;color:#728a77;font-size:11px;flex-wrap:wrap}
.embed-loading-notice a{color:#266d4d;font-weight:760;text-decoration:underline}

/* A clearly actionable no-provider state, instead of a large inert error panel */
.fallback-actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:11px;margin:24px auto 8px;max-width:680px}
.fallback-actions button{border:1px solid #cbe3cf;border-radius:13px;min-height:49px;padding:12px 18px;font-size:13px;font-weight:780}
.fallback-primary{background:#164d39;color:#fff;border-color:#164d39!important;box-shadow:0 9px 24px #1a563326}
.fallback-secondary{background:#edf7eb;color:#286647}
.fallback-note{margin:13px auto 0!important;max-width:620px!important;font-size:11px!important;color:#947346!important}
@media(max-width:520px){.fallback-actions{flex-direction:column;align-items:stretch;margin-top:21px}.fallback-actions button{width:100%}}