:root{
  --paper:#f3efe6;--paper2:#ebe5d8;--card:#fffcf7;--ink:#1a1916;--ink2:#3c3a35;--mut:#6b675e;--line:#ddd6c6;--line2:#c9c0ae;
  --red:#b92a14;--red-soft:#c62f17;--link:#0d457c;
  --shadow:0 1px 2px rgba(28,27,25,.04),0 8px 24px rgba(28,27,25,.05);
  --font:"Noto Sans TC",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang TC","Microsoft JhengHei","Heiti TC",sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:16px;line-height:1.75;letter-spacing:.02em;background:var(--paper);color:var(--ink);
  line-break:strict;text-autospace:normal;-webkit-font-smoothing:antialiased;position:relative;min-height:100vh}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(ellipse 90% 55% at 50% -8%,rgba(185,42,20,.07),transparent 55%),
    radial-gradient(circle at 92% 18%,rgba(185,42,20,.045),transparent 28%),
    radial-gradient(circle at 8% 42%,rgba(143,76,0,.04),transparent 32%),
    linear-gradient(180deg,var(--paper) 0%,var(--paper2) 48%,var(--paper) 100%)}
h1,h2,h3{line-height:1.4;letter-spacing:.01em;text-wrap:pretty}
a{color:var(--link);text-underline-offset:.2em}
a:hover{color:var(--ink)}
.wrap{max-width:880px;margin:0 auto;padding:0 20px}
.num{font-variant-numeric:tabular-nums}
header{padding:36px 0 28px;border-bottom:1px solid var(--line)}
.brand-mark{display:inline-flex;align-items:center;gap:10px}
.pulse{width:11px;height:11px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(185,42,20,.45);animation:pulse 2.4s var(--ease) infinite;flex-shrink:0}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(185,42,20,.4)}70%{box-shadow:0 0 0 12px rgba(185,42,20,0)}100%{box-shadow:0 0 0 0 rgba(185,42,20,0)}}
h1{margin:0;font-size:clamp(28px,5vw,36px);font-weight:800}
h1 span{color:var(--red-soft)}
h1 small{display:inline-block;font-size:13px;font-weight:500;color:var(--mut);margin-left:8px;letter-spacing:.08em;vertical-align:middle;transform:translateY(-.15em)}
.sub{margin:4px 0 0;max-width:38em;font-size:16px;color:var(--ink2);text-wrap:pretty}
.site-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.site-nav a{display:inline-flex;align-items:center;padding:6px 12px;border-radius:6px;border:1px solid var(--line2);background:var(--card);color:var(--ink2);text-decoration:none;font-size:14px;font-weight:700;line-height:1.4}
.site-nav a:hover,.site-nav a:focus-visible{border-color:var(--ink);color:var(--ink);background:#fffdf8}
.site-nav a[aria-current="page"]{background:var(--ink);border-color:var(--ink);color:#fff}
h2{font-size:22px;font-weight:800;margin:28px 0 14px}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:12px;background:rgba(235,229,216,.85);border:1px solid var(--line);border-radius:10px}
select,input,button{font:inherit;font-size:15px;letter-spacing:normal;color:var(--ink);background:var(--card);border:1px solid var(--line2);border-radius:6px;padding:8px 10px}
select{padding-right:28px}
.filters select,.filters input{flex:1 1 160px;min-width:0}
.filters select.on,.filters input.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);background:#fffdf8}
select:focus-visible,input:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid var(--link);outline-offset:2px}
#map{height:380px;border:1px solid var(--line);border-radius:10px;background:#e7e2d6;box-shadow:var(--shadow)}
.leaflet-container{font-family:var(--font);background:#e7e2d6}
.pin-marker.leaflet-div-icon{background:transparent;border:0}
.pin-shape{display:block;width:14px;height:14px;margin:2px;border-radius:50%;background:var(--red);box-shadow:0 0 0 2px var(--card),0 1px 4px rgba(28,27,25,.4)}
.map-note{margin:8px 0 0;color:var(--mut);font-size:13px}
.list{display:grid;gap:14px;margin-top:18px}
.place{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 18px 16px;box-shadow:var(--shadow);scroll-margin-top:16px;transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s var(--ease)}
.place:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(28,27,25,.05),0 14px 28px rgba(28,27,25,.07);border-color:var(--line2)}
.place h3{margin:0;font-size:18px;font-weight:700}
.where{margin:2px 0 10px;font-size:14px;color:var(--mut)}
.facts{margin:0;display:grid;gap:4px}
.facts div{display:grid;grid-template-columns:2.6em 1fr;gap:10px}
.facts dt{font-size:14px;font-weight:700;color:var(--mut);padding-top:1px}
.facts dd{margin:0;color:var(--ink2);overflow-wrap:anywhere}
.note{margin:10px 0 0;font-size:14px;color:var(--ink2)}
.foot{margin-top:12px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{font-size:13px;line-height:1.5;padding:2px 8px;border-radius:4px;background:#f0ebe1;color:var(--ink2);letter-spacing:.04em}
.links{display:flex;align-items:center;gap:14px;font-size:15px}
.go{display:inline-block;padding:7px 15px;border-radius:6px;background:var(--ink);color:#fff;text-decoration:none;font-weight:700}
.go:hover{background:#000;color:#fff}
.pin,.src{color:var(--mut);font-size:14px;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:.2em}
.empty{padding:28px;text-align:center;color:var(--mut);background:var(--card);border:1px dashed var(--line2);border-radius:10px}
.empty button{margin-top:10px;font-size:14px;padding:6px 14px;background:var(--ink);border:0;color:#fff;cursor:pointer}
.place{animation:rise .45s var(--ease) both}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .pulse,.place,.place:hover{animation:none!important;transition:none!important;transform:none!important}
}
footer{color:var(--mut);font-size:14px;padding:28px 0 40px;border-top:1px solid var(--line);margin-top:48px}
@media(max-width:700px){
  .wrap{padding:0 16px}
  header{padding:24px 0 20px}
  h1{font-size:26px}
  h1 small{display:block;margin:6px 0 0;font-size:12px;transform:none}
  .sub{font-size:15px}
  .filters{display:grid;grid-template-columns:1fr 1fr;padding:10px}
  .filters input{grid-column:1 / -1}
  #map{height:260px}
  .place{padding:12px 14px 14px}
  .place:hover{transform:none}
  .place h3{font-size:17px}
  .facts div{grid-template-columns:2.4em 1fr;gap:8px}
  .links{margin-left:auto}
}