*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#f4f1ea;color:#2b2b2b}
header{padding:22px 32px;display:flex;align-items:center;justify-content:space-between;background:#1f3a34;color:#fff}
header h1{margin:0;font-size:22px;letter-spacing:.5px}header p{margin:0;opacity:.8;font-size:14px}
.wrap{max-width:1100px;margin:24px auto;padding:0 16px}.map{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.15)}
svg{display:block;width:100%;height:auto}.bld{cursor:pointer;transition:transform .15s,filter .15s;transform-box:fill-box;transform-origin:center}
.bld:hover{filter:brightness(1.08) drop-shadow(0 6px 8px rgba(0,0,0,.35));transform:scale(1.03)}
.tip{position:fixed;z-index:50;display:none;max-width:calc(100vw - 16px);background:#fff;border-radius:12px;padding:14px 16px;min-width:220px;box-shadow:0 8px 24px rgba(0,0,0,.25);font-size:14px;text-decoration:none;color:inherit}
.tip.show{display:block}.tip .arr{position:absolute;width:14px;height:14px;background:#fff;transform:rotate(45deg);left:var(--ax);margin-left:-7px}.tip.up .arr{bottom:-7px}.tip.down .arr{top:-7px}.bld{-webkit-tap-highlight-color:transparent;outline:none}.bld:focus-visible rect{stroke:#1f3a34;stroke-width:4}.tip h3{margin:0 0 4px;font-size:16px}.badge{display:inline-block;background:#2e7d5b;color:#fff;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:600;margin-bottom:8px}
.ex{display:inline-block;background:#fff3cd;color:#8a6d00;border:1px solid #f0d77a;border-radius:6px;padding:1px 6px;font-size:11px;font-weight:700;margin-left:6px;vertical-align:middle}
.tip .go{display:block;margin-top:8px;color:#2e7d5b;font-weight:600}.note{font-size:13px;color:#666;margin-top:12px}
.card{background:#fff;border-radius:16px;padding:32px;box-shadow:0 10px 30px rgba(0,0,0,.08)}.card dl{display:grid;grid-template-columns:200px 1fr;gap:12px 16px;font-size:16px}
.card dt{color:#666}.card dd{margin:0;font-weight:600}.back{display:inline-block;margin-bottom:16px;color:#1f3a34;font-weight:600;text-decoration:none}
.swatch{height:140px;border-radius:12px;margin:16px 0 24px}/*plan*/
.layout{display:grid;grid-template-columns:minmax(0,560px) 1fr;gap:24px;align-items:start}
.panel{position:sticky;top:16px;background:#fff;border-radius:16px;padding:20px;box-shadow:0 10px 30px rgba(0,0,0,.08);font-size:14px}
.panel h2{margin:0 0 6px;font-size:18px}.legend{list-style:none;padding:0;margin:12px 0}.legend li{display:flex;align-items:center;gap:8px;margin:6px 0}
.sw{width:18px;height:14px;border-radius:3px;border:1.5px solid rgba(0,0,0,.35);flex:none}.dir{columns:1;padding:0;list-style:none;margin:8px 0 0}
.dir li{margin:3px 0}.dir a{color:#1f3a34;text-decoration:none}.dir a:hover{text-decoration:underline}.dir .c{font-weight:700;margin-top:10px;color:#555}
svg .num{paint-order:stroke;stroke:#fff;stroke-width:6px;font:800 30px system-ui,sans-serif;fill:#2b2b2b;pointer-events:none}svg .lbl{font:700 10px system-ui,sans-serif;fill:#2f3b33;letter-spacing:.5px}
svg .hwy{font:800 22px system-ui,sans-serif;fill:#8a7d4f;letter-spacing:2px}.map{position:relative;background:#e9ece4}.map img{display:block;width:100%;height:auto}.map .ov{position:absolute;inset:0;width:100%;height:100%}.bld{cursor:pointer}.bld polygon{fill-opacity:.55;stroke-width:4;transition:fill-opacity .15s}.bld.dev polygon{fill-opacity:.35;stroke-dasharray:10 6;stroke:#444}.zbtn{display:none;margin:0 0 10px;border:0;border-radius:999px;padding:10px 16px;background:#1f3a34;color:#fff;font-weight:700;font-size:14px}body.zoomed{overflow:hidden}.zoomed .mapwrap{position:fixed;inset:0;z-index:40;overflow:auto;background:#1f3a34;-webkit-overflow-scrolling:touch}.zoomed .map{width:1800px;max-width:none;border-radius:0}.zoomed .zbtn{position:fixed;top:12px;right:12px;z-index:45;display:block;box-shadow:0 4px 12px rgba(0,0,0,.4)}@media (max-width:820px){.zbtn{display:inline-block}}
.bld:hover polygon,.bld.active polygon{fill-opacity:.85;stroke:#1f3a34;stroke-width:6}
.bld.dim{opacity:.3}.bld.dim:hover,.bld.dim.active{opacity:.9}.bld.sel polygon{fill-opacity:.75;stroke-width:6}.bld.unit polygon{stroke-width:2.5}.bld.unit:hover polygon,.bld.unit.active polygon{stroke-width:4;fill-opacity:.95}.ugrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px;margin:6px 0 14px}.ugrid a{display:block;text-align:center;padding:8px 4px;border-radius:8px;background:#eef3ee;color:#1f3a34;font-weight:600;font-size:13px;text-decoration:none;border:1px solid #cfdccf}.ugrid a:hover{background:#d7e8d9}.units h3{font-size:15px;margin:12px 0 4px}html{scroll-padding-top:72px}.tabs{background:#16302a;position:sticky;top:0;z-index:30;box-shadow:0 2px 8px rgba(0,0,0,.2)}.tabin{max-width:1100px;margin:0 auto;display:flex;gap:4px;overflow-x:auto;padding:8px 16px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.tab{flex:none;display:flex;align-items:center;gap:6px;color:#dfe9e4;text-decoration:none;font-size:14px;font-weight:600;padding:8px 12px;border-radius:999px;white-space:nowrap}.tab:hover{background:rgba(255,255,255,.1)}.tab.on{background:#fff;color:#16302a}.tab .sw{width:12px;height:12px}.shead{display:flex;align-items:center;gap:14px;margin-bottom:16px}.shead h2{margin:0}.sw.big{width:40px;height:40px;border-radius:8px;border-width:3px}.secmap{background:#e9ece4}.map.secmap .ov{overflow:hidden;position:static;height:auto;display:block}.cards{display:grid;gap:14px}.dcard{display:block;background:#fff;border-radius:14px;padding:16px 18px;box-shadow:0 6px 18px rgba(0,0,0,.08);text-decoration:none;color:inherit;border-top:6px solid}.dcard:hover{box-shadow:0 8px 24px rgba(0,0,0,.16)}.dcard h3{margin:8px 0 2px;font-size:17px}.dcard dl{display:grid;grid-template-columns:120px 1fr;gap:4px 10px;font-size:14px;margin:8px 0}.dcard dt{color:#666}.dcard dd{margin:0;font-weight:600}.dcard p{font-size:14px;margin:6px 0}.dcard .go{color:#2e7d5b;font-weight:600;font-size:14px}.bld.hl polygon{fill-opacity:.8;stroke:#c0392b;stroke-width:8}.locator svg{display:block;width:100%;height:auto}.cat{font-size:12px;color:#666;margin:0 0 6px}.tip .own{background:#6b6b6b}
.badge.own{background:#6b6b6b}.src{font-size:12px;color:#777;margin-top:6px}.locator{max-width:240px;border-radius:12px;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.12)}
.sub{display:grid;grid-template-columns:1fr 240px;gap:24px;align-items:start}
@media (max-width:820px){.layout,.sub{grid-template-columns:1fr}.panel{position:static}.locator{max-width:180px}header{padding:16px}}