:root{--bg:#fbf8f3;--fg:#1d1a16;--muted:#5d564c;--card:#fff;--border:#e3dccf;--accent:#c4510b;--link:#a1420a;
--s0:#8a8a8a;--s1:#2f9e44;--s2:#82b300;--s3:#e8a400;--s4:#e8590c;--s5:#c92a2a}
@media (prefers-color-scheme:dark){:root{--bg:#15130f;--fg:#efe9df;--muted:#b4ab9d;--card:#211e19;--border:#3a342b;--accent:#ff8a3d;--link:#ffa463}}
*{box-sizing:border-box}
body{margin:0;font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--fg);padding:0 12px 40px;max-width:1100px;margin-inline:auto}
a{color:var(--link)}
header h1{font-size:1.5rem;margin:16px 0 4px}
.sub{color:var(--muted);margin:4px 0}
.warn{background:color-mix(in srgb,var(--accent) 15%,transparent);border-left:4px solid var(--accent);padding:8px 10px;border-radius:6px}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin:14px 0}
h2{font-size:1.2rem;margin:18px 0 8px}
.card h2{margin-top:2px}
.small{font-size:.85rem;color:var(--muted)}
.filters{display:flex;flex-wrap:wrap;gap:10px}
fieldset{border:1px solid var(--border);border-radius:8px;padding:6px 10px;margin:0;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
legend{font-weight:600;font-size:.9rem;padding:0 4px}
label{white-space:nowrap}
select,button{font:inherit}
select{padding:4px;border-radius:6px;background:var(--card);color:var(--fg);border:1px solid var(--border)}
#map{height:min(60vh,520px);border-radius:10px;margin-top:8px;border:1px solid var(--border)}
.dot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:4px;vertical-align:-1px}
.s0{background:var(--s0)}.s1{background:var(--s1)}.s2{background:var(--s2)}.s3{background:var(--s3)}.s4{background:var(--s4)}.s5{background:var(--s5)}
#routebar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
#routebar p{flex-basis:100%;margin:0}
button{background:var(--accent);color:#fff;border:0;border-radius:8px;padding:8px 14px;font-weight:600;cursor:pointer}
button:disabled{opacity:.45;cursor:not-allowed}
button.ghost{background:transparent;color:var(--fg);border:1px solid var(--border)}
#routecount{font-weight:600}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.haunt{background:var(--card);border:1px solid var(--border);border-left:6px solid var(--s0);border-radius:10px;padding:10px 12px}
.haunt h3{margin:0 0 4px;font-size:1.05rem}
.haunt .meta{font-size:.9rem;margin:3px 0}
.haunt .links{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:6px;font-size:.92rem}
.haunt .links a{font-weight:600}
.badge{display:inline-block;font-size:.75rem;font-weight:700;padding:1px 7px;border-radius:999px;color:#fff;margin-right:4px;vertical-align:1px}
.badge.free{background:#2b8a3e}.badge.paid{background:#5f3dc4}.badge.unc{background:#868e96}
.haunt.hidden{display:none}
.count{font-weight:400;color:var(--muted);font-size:.95rem}
.pin{width:18px;height:18px;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.4)}
.pin.free{border-radius:50%}.pin.paid{border-radius:3px}
.pin.sel{outline:3px solid #1c7ed6;outline-offset:1px}
.startpin{font-size:22px;line-height:22px;text-align:center;color:#1c7ed6;text-shadow:0 0 3px #fff,0 0 3px #fff}
.leaflet-popup-content{font-size:.9rem;line-height:1.35}
.leaflet-popup-content h4{margin:0 0 4px;font-size:1rem}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--card);color:var(--fg)}
.leaflet-container a.leaflet-popup-close-button{color:var(--muted)}
footer{margin-top:28px;color:var(--muted);font-size:.85rem}
