@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700&display=swap');
:root{--ink:#171d19;--gold:#d2af70;--muted:#8a938b;--line:#343b32}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:#f6f5ee;font-family:'Noto Sans TC',sans-serif;font-size:14px}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}header{height:82px;padding:0 30px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:22px;background:#131813}.brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:600;letter-spacing:3px}.brand small{display:block;font-size:9px;letter-spacing:2.2px;color:var(--gold);margin-top:4px}.seal{border:1px solid var(--gold);color:var(--gold);width:43px;height:43px;display:grid;place-items:center;font-family:serif;font-size:28px}.beta{font-size:12px;color:#aeb6ab;border:1px solid var(--line);padding:7px 11px;border-radius:30px}.call{margin-left:auto;font-size:13px;color:var(--gold)}main{display:grid;grid-template-columns:390px 1fr;height:calc(100dvh - 82px)}aside{overflow-y:auto;background:#191f1a}.intro{padding:27px 25px 18px}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--gold);margin:0 0 12px}h1{font-size:29px;letter-spacing:1px;font-weight:500;margin:0 0 10px}.intro>p:last-child{font-size:12px;color:#a8b0a5;line-height:1.8;margin:0}.controls{padding:0 25px 20px;border-bottom:1px solid var(--line)}button{border:0;border-radius:6px;min-height:44px;transition:background .2s}button:focus-visible,a:focus-visible{outline:3px solid #e9c888;outline-offset:3px}.primary{background:var(--gold);color:#172017;width:100%;font-weight:700;letter-spacing:.5px}.primary:hover{background:#e5c58f}.primary:disabled{opacity:.6;cursor:wait}.hint{font-size:11px;color:#a6b1a2;line-height:1.8;margin:10px 0 14px}.fieldrow{display:flex;gap:12px;margin-top:12px;align-items:end}.fieldrow>*{flex:1;min-width:0}label{display:block;color:#b6beb1;font-size:11px}select,input{width:100%;background:#232b23;color:#f0eee5;border:1px solid #424b3c;border-radius:5px;padding:11px 10px;min-height:42px;margin-top:7px;outline:none}select:focus,input:focus{border-color:var(--gold)}.search{margin-top:13px}.secondary{background:#2a3329;color:var(--gold);border:1px solid #47503e;padding:8px 10px;font-size:12px}.secondary:hover{background:#354130}.result-head{padding:19px 25px 12px}.result-head>div{display:flex;justify-content:space-between;align-items:center}.result-head strong{font-size:17px;font-weight:500}.result-head span{color:var(--gold);font-size:11px}.result-head p{font-size:11px;color:#a4af9e;line-height:1.7;margin-bottom:6px}progress{width:100%;height:3px;accent-color:var(--gold)}#results{padding:0 16px 8px}.case{width:100%;text-align:left;color:#efeee6;background:#222a22;border:1px solid #394135;border-radius:8px;padding:16px;margin:8px 0;display:block;min-height:unset}.case:hover,.case.active{border-color:var(--gold);background:#2d362a}.case-top{display:flex;justify-content:space-between;align-items:center;gap:8px}.tag{font-size:10px;color:#d7bd8c;background:#3b3c2d;border-radius:3px;padding:3px 6px}.distance{font-size:11px;color:#adb9a7}.address{font-size:14px;line-height:1.7;display:block;margin:10px 0 12px;font-weight:500}.price{color:#e0bd7e;font-size:23px;font-weight:600;letter-spacing:.5px}.price small{font-size:10px;font-weight:400;margin-left:5px}.date{font-size:11px;color:#b5bfb0;margin-top:7px}.empty{padding:22px 10px;line-height:2;color:#b2bbaa;font-size:13px}details{margin:0 25px 20px;border-top:1px solid var(--line);padding-top:16px}summary{color:#ccb488;cursor:pointer;font-size:12px}footer{border-top:1px solid var(--line);padding:20px 25px 30px;color:#939e8e;font-size:10px;line-height:1.9}footer a{color:var(--gold)}.map-section{position:relative;min-width:0;min-height:400px;background:#dedfd4}#map{height:100%;width:100%;position:absolute;inset:0}.map-top{position:absolute;z-index:600;left:20px;top:18px;pointer-events:none}.map-top>span{background:#172017ed;border:1px solid #54604c;box-shadow:0 2px 8px #0002;color:#eee9da;padding:10px 14px;display:block;border-radius:5px;font-size:11px}.map-top i{display:inline-block;width:8px;height:8px;background:var(--gold);border-radius:50%;margin-right:5px}.blue-dot{color:#5a9ce9}.map-tools{position:absolute;z-index:600;right:18px;top:18px;display:flex;gap:8px}.map-tools button{background:#19231bed;color:#f3eddc;box-shadow:0 2px 9px #0002;border:1px solid #56634e;padding:10px 14px}.map-tools button:first-child{font-size:24px;line-height:1}.map-note{position:absolute;z-index:600;bottom:28px;left:50%;transform:translateX(-50%);background:#172017ed;color:#f1eddf;border-radius:24px;padding:9px 17px;font-size:11px;white-space:nowrap;pointer-events:none}.leaflet-container{font-family:'Noto Sans TC',sans-serif;color:#20291f}.leaflet-control-zoom{border:0!important;box-shadow:0 2px 8px #0002!important}.leaflet-control-zoom a{background:#f5f2e8!important;color:#263023!important}.leaflet-popup-content-wrapper{border-radius:10px;background:#19231b;color:#f6f0e2;box-shadow:0 8px 32px #0004}.leaflet-popup-tip{background:#19231b}.leaflet-popup-content{margin:18px;width:260px!important;line-height:1.7}.leaflet-popup-content h2{font-size:15px;font-weight:500;line-height:1.7;margin:9px 0}.leaflet-popup-content p{margin:6px 0;font-size:12px}.leaflet-popup-content a{display:inline-block;color:#172017;background:var(--gold);padding:8px 12px;border-radius:4px;margin:8px 6px 0 0;font-size:12px;font-weight:600}.leaflet-popup-close-button{color:#d2bc91!important}.pin{background:var(--gold);color:#1c251b;border:2px solid #fff3d0;box-shadow:0 3px 9px #0005;border-radius:15px;padding:4px 8px;font-size:11px;font-weight:700;white-space:nowrap;width:max-content;min-width:42px;text-align:center;position:relative}.pin:after{content:'';position:absolute;bottom:-6px;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid var(--gold)}.pin-wrap{background:none;border:0}.popup-case+.popup-case{border-top:1px solid #48513d;padding-top:15px;margin-top:15px}.unlocated-item{font-size:12px;border-bottom:1px solid var(--line);padding:12px 0;line-height:1.8}.unlocated-item a{display:block;color:var(--gold)}#retry{margin-top:12px;width:100%}.leaflet-control-attribution{font-size:10px!important;max-width:100%;background:#f9f7eddf!important}.leaflet-bottom.leaflet-right{max-width:100%}
@media(min-width:1500px){main{grid-template-columns:430px 1fr}.intro,.controls,.result-head{padding-left:30px;padding-right:30px}}
@media(max-width:760px){header{height:66px;padding:0 15px;gap:10px}.brand{font-size:18px;letter-spacing:2px;gap:8px}.brand small{font-size:7px;letter-spacing:1.3px}.seal{width:34px;height:34px;font-size:24px}.beta{margin-left:auto;padding:5px 8px;font-size:10px}.call{display:none}main{display:flex;flex-direction:column;height:auto}aside{display:contents}.intro{padding:18px 18px 12px;order:0}.intro h1{font-size:25px;margin:0}.eyebrow{font-size:8px;margin-bottom:7px}.intro>p:last-child{display:none}.controls{padding:0 18px 16px;order:1}.primary{min-height:43px}.hint{margin:7px 0;font-size:10px}.fieldrow{margin-top:9px;gap:10px}.search{margin-top:9px}select,input{min-height:39px;padding:8px;margin-top:4px}.controls .search{display:inline-block;width:100%}.map-section{height:53dvh;min-height:350px;order:2}.map-top{left:12px;top:12px}.map-top>span{font-size:9px;padding:9px}.map-tools{right:12px;top:54px;gap:6px;flex-direction:column;align-items:flex-end}.map-tools button{min-height:38px;padding:7px 10px;font-size:11px}.map-tools button:first-child{width:40px}.map-note{font-size:10px;padding:8px 12px;bottom:24px;max-width:95%;white-space:normal;text-align:center}.result-head{order:3;padding:17px 18px 7px}#results{order:4;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 12px 15px}.case{padding:12px;margin:0}.address{font-size:12px;margin:9px 0}.price{font-size:21px}.case-top{flex-wrap:wrap;gap:4px}.date{font-size:10px}#unlocated{order:5;margin:5px 18px 18px}footer{order:6;padding:15px 18px}.leaflet-popup-content{width:230px!important}.empty{grid-column:1/-1}.leaflet-control-zoom{margin-bottom:40px!important}}

.car-marker div{font-size:32px;background:white;border:3px solid #3586de;border-radius:50%;width:44px;height:44px;display:grid;place-items:center;box-shadow:0 2px 12px #0005}.town-label{background:#fff9;border:0;box-shadow:none;color:#714268;font-weight:bold;font-size:13px;padding:1px 4px;pointer-events:none}

.install-box{padding:12px 24px;border-bottom:1px solid #c7af70}.install-box button{width:100%}dialog{max-width:440px;width:calc(100% - 48px);border:1px solid #a78b4b;border-radius:16px;padding:24px;background:#fffdf6;color:#20251f;line-height:1.8}dialog::backdrop{background:#0009}dialog button{cursor:pointer}

.popup-toolbar{position:static;background:transparent;padding:14px 0 0;clear:both}.popup-dismiss{display:block;width:100%;min-height:48px;border:1px solid #96722d;border-radius:10px;background:#20251f;color:#ffe0a0;font-size:16px;font-weight:700;cursor:pointer;touch-action:manipulation}.leaflet-container a.leaflet-popup-close-button{width:44px;height:44px;font-size:26px;line-height:44px}.leaflet-popup-content{margin-top:18px}.north-indicator{position:absolute;left:12px;top:55px;z-index:500;pointer-events:none;display:flex;flex-direction:column;align-items:center;background:#fffef4;border:1px solid #a78b4b;border-radius:8px;padding:6px 10px;color:#20251f;font-size:13px;box-shadow:0 2px 6px #0002}.north-indicator strong{font-size:20px;line-height:22px}

.city-links{margin:20px 0}.city-links h2{font-size:20px}.city-link-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.city-link-grid a{padding:10px 4px;text-align:center;color:#d4b76e;border:1px solid #62553b;border-radius:8px;text-decoration:none}.city-link-grid a:focus,.city-link-grid a:hover{background:#353322}

.city-link-grid a.selected{background:#d4b76e;color:#141714;font-weight:700}.map-section{scroll-margin-top:12px}

/* Keep the location control explicit and easy to tap on phones. */
#map-locate{width:auto;min-width:112px;min-height:44px;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 14px;font-size:16px;white-space:nowrap}
#map-locate span{font-size:24px;line-height:1}
