*{box-sizing:border-box}
:root{
  --bg:#f5f2eb; --paper:#fff; --ink:#292723; --muted:#8a857d;
  --green:#2d7563; --green-soft:#dff2ec; --line:#ddd7cc; --gold:#9a7337;
  --trail:#b4c92d; --road:#cfcac2; --road2:#dbd6ce;
}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:Pretendard,"Noto Sans KR",system-ui,sans-serif}
.topbar{height:62px;background:#fff;border-bottom:1px solid #e9e3d8;display:flex;justify-content:space-between;align-items:center;padding:0 max(24px,calc((100vw - 1420px)/2))}
.topbar .brand{display:flex;gap:12px;align-items:baseline}
.topbar span{font-size:12px;color:var(--muted)}
.topbar nav{display:flex;gap:16px}
.topbar a{text-decoration:none;color:var(--green);font-weight:800;font-size:13px}
.shell{width:min(1420px,calc(100% - 36px));margin:auto}
.head{padding:28px 0 18px}
.eyebrow{margin:0 0 8px;color:var(--gold);font-size:12px;letter-spacing:.21em;font-weight:900}
.head h1{margin:0;font-size:48px;letter-spacing:-.05em}
.head p:not(.eyebrow){margin-top:10px;color:var(--muted)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:18px;padding-bottom:24px}
.map-card,.side{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 8px 24px rgba(0,0,0,.04)}
.map-card{padding:14px 14px 10px}
.mini-toolbar{display:flex;align-items:center;gap:10px;padding:6px 6px 12px}
.badge{display:inline-block;background:#e8f1ed;color:var(--green);font-size:11px;font-weight:900;padding:6px 9px;border-radius:999px}
.guide-hint{font-size:12px;color:var(--muted)}
.map{width:100%;height:auto;border:1px solid #ebe5db;border-radius:16px;background:#fcfbf9}
.bg{fill:#fcfbf9}
.region{fill:#8c867d;font-size:24px;font-weight:800}
.region.strong{fill:#4a453d}
.boundary{fill:none;stroke:#d3cec5;stroke-width:2.2;stroke-dasharray:8 7}
.road{fill:none;stroke-linecap:round}
.road.main{stroke:var(--road);stroke-width:5.5}
.road.minor{stroke:var(--road2);stroke-width:3.5}
.road.connector{stroke:#d4d0c8;stroke-width:2.5}
.roadname{fill:#aca59b;font-size:14px;font-weight:800}
.roadname.small{font-size:12px}
.roadname.vertical{writing-mode:vertical-rl}
.mountain{fill:#e9f0e2;stroke:#95ad74;stroke-width:2}
.mountain.small{fill:#edf4e8}
.mountain.tiny{fill:#eff5eb}
.mountainname{fill:#6d8158;font-size:22px;font-weight:900;text-anchor:middle}
.mountainname.tiny{font-size:13px}
.station rect{fill:#555}
.station text{font-size:14px;font-weight:800;fill:#504d48}
.lines .line-num{fill:#fff;font-size:11px;font-weight:900;text-anchor:middle}
.lines .line-num.small{font-size:10px}
.line1{fill:#0d47a1}
.line2{fill:#2ca64a}
.line4{fill:#3f51b5}
.linesl{fill:#c278d8}
.trail{fill:none;stroke:var(--trail);stroke-width:6;stroke-linecap:round}
.trailname{fill:#7d8826;font-size:13px;font-weight:900}
.temple-marker{cursor:pointer}
.temple-marker circle{fill:var(--green-soft);stroke:#4b9a83;stroke-width:2}
.temple-marker text.num{fill:#266d5c;font-size:14px;font-weight:900;text-anchor:middle;dominant-baseline:middle}
.temple-marker text.name{fill:#333;font-size:15px;font-weight:900}
.temple-marker.active circle{fill:#4b9a83}
.temple-marker.active text.num{fill:#fff}
.temple-marker.active text.name{fill:#216352}
.temple-label-bg{fill:#fffdfa;stroke:#d7ceb9;stroke-width:1.3}
.legend{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:10px 6px 6px;font-size:12px;color:#7a746b}
.legend span{display:inline-flex;align-items:center;gap:7px}
.dot{display:inline-block;width:11px;height:11px;border-radius:50%}
.dot.temple{background:var(--green-soft);border:2px solid #4b9a83}
.dot.station{background:#555;border-radius:3px}
.line{display:inline-block;width:22px;height:0;border-top:4px solid #ccc}
.line.road{border-color:var(--road)}
.line.trail{border-color:var(--trail)}
.line.boundary{border-top-width:2px;border-color:#d3cec5;border-top-style:dashed}
.footnote{border-top:1px solid #efe9df;padding:8px 4px 0;font-size:11px;color:#9a958d}
.side{padding:14px;display:flex;flex-direction:column;gap:14px}
.list,.detail{border:1px solid var(--line);border-radius:16px;background:#fff}
.list{padding:14px}
.list-head{display:flex;justify-content:space-between;align-items:center;margin:0 0 8px}
.list-head h3{margin:0}
.count{font-size:12px;color:var(--muted);font-weight:800}
.item{width:100%;border:0;background:transparent;text-align:left;padding:11px 6px;border-top:1px solid #efebe3;cursor:pointer;border-radius:10px}
.item:first-of-type{border-top:0}
.item b{display:block;font-size:15px}
.item span{font-size:12px;color:var(--muted)}
.item.active{background:#f6faf8}
.item.active b{color:var(--green)}
.detail{padding:14px;min-height:450px}
.empty{height:100%;display:grid;place-content:center;text-align:center;color:var(--muted)}
.empty span{font-size:46px;color:var(--green)}
.tag{display:inline-block;background:#e8f1ed;color:var(--green);font-size:11px;font-weight:900;padding:6px 8px;border-radius:999px}
.detail h2{font-size:30px;margin:10px 0 4px;letter-spacing:-.03em}
.sub{color:var(--gold);font-weight:900;margin-bottom:10px}
.acc{border-top:1px solid #eee8de}
.acc:first-of-type{border-top:0}
.acc summary{list-style:none;cursor:pointer;padding:12px 0;font-weight:900;display:flex;justify-content:space-between;align-items:center}
.acc summary::-webkit-details-marker{display:none}
.acc summary span{font-size:12px;color:var(--muted);font-weight:700}
.acc[open] summary{color:var(--green)}
.acc-body{padding:0 0 10px}
.row{padding:7px 0;border-top:1px solid #f1ece4}
.row:first-child{border-top:0}
.row small{display:block;color:#9a9389;margin-bottom:3px}
.row b{font-size:14px}
.bus-routes{display:flex;flex-wrap:wrap;gap:6px;padding-top:4px}
.bus-routes em{font-style:normal;font-size:11px;font-weight:900;padding:5px 7px;background:#f1efe8;border-radius:999px;color:#5b554d}
.actions{display:grid;gap:8px;margin-top:12px}
.actions a{text-decoration:none;text-align:center;padding:11px;border-radius:10px;font-weight:900}
.actions .primary{background:var(--green);color:#fff}
.actions .secondary{background:#efebe3;color:#4d463d}
.note{font-size:11px;color:#9b958c;line-height:1.5;padding-top:6px}
@media(max-width:1020px){
  .layout{grid-template-columns:1fr}
  .head h1{font-size:38px}
}

/* v14 navigation model: map + list only, temple opens dedicated detail page */
.layout{grid-template-columns:minmax(0,1fr) 350px!important}.detail{display:none!important}.side{align-self:start}.list{min-height:100%}