*{box-sizing:border-box}body{margin:0;background:#f2f2ef;color:#262825;font-family:Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #888;outline-offset:4px}.concepts{padding:22px 38px;display:flex;gap:20px;justify-content:space-between;align-items:center;border-bottom:1px solid #d9dbd6;font-size:11px;letter-spacing:2px}.concepts small{font-size:9px;color:#7a7d76;letter-spacing:1px}.concepts div{display:flex;gap:5px}.concepts button{border:0;padding:12px 16px;background:transparent;color:#73766e;border-radius:4px;font-size:12px;letter-spacing:0}.concepts button[aria-pressed=true]{background:#272a26;color:white}main{--bg:#fff;--text:#252824;--muted:#767b72;--surface:#fff;--line:#dedfdc;--pin:#fff;--shadow:0 10px 30px #1c221b15;background:var(--bg);color:var(--text);padding:46px 48px 0;min-height:800px}header{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:32px}h1{font:normal clamp(38px,4.7vw,75px)/.99 Georgia,serif;letter-spacing:-2.7px;margin:0}header p{font-size:14px;line-height:1.8;color:var(--muted);margin-right:30px}header p span{display:inline-block;font-size:11px;margin-top:12px}#filters{display:flex;gap:9px;margin-bottom:20px;flex-wrap:wrap}#filters button{border:1px solid var(--line);border-radius:24px;padding:12px 19px;background:transparent;color:var(--text);display:flex;align-items:center;gap:10px;font-size:12px;white-space:nowrap}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}#filters button[aria-pressed=true]{background:var(--text);color:var(--bg);border-color:var(--text)}.viewport{height:560px;position:relative;overflow:hidden;background:#e8e9e7;border-radius:8px;isolation:isolate;touch-action:none}#map{position:absolute;width:100%;height:100%;transform-origin:50% 50%;cursor:grab}#map.dragging{cursor:grabbing}#tiles{position:absolute;inset:0;filter:grayscale(1);opacity:.9}#tiles img{position:absolute;user-select:none;pointer-events:none}.label{position:absolute;transform:translate(-50%,-50%);font-size:12px;color:#777d75;white-space:nowrap;pointer-events:none;text-shadow:0 1px 3px white,0 -1px 3px white}.label.city{font:29px Georgia,serif;color:#3e433c}.label.river{font:italic 14px Georgia,serif}.pin{position:absolute;transform:translate(-50%,-50%);width:38px;height:38px;border:1px solid #d6d9d2;border-radius:50%;background:var(--pin);color:var(--text);box-shadow:0 3px 12px #1b24191b;display:grid;place-items:center;padding:8px;z-index:2;transition:box-shadow .18s,background .18s}.pin:hover,.pin.selected{z-index:5;background:var(--text);color:var(--bg);box-shadow:0 0 0 5px #77777725}.pin:after{content:attr(data-title);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--surface);color:var(--text);padding:7px 10px;border-radius:4px;white-space:nowrap;font-size:11px;box-shadow:var(--shadow);display:none}.pin:hover:after{display:block}.pin.home{width:77px;height:77px;background:#282c27;color:white;border:5px solid white;box-shadow:0 0 0 1px #5f655e33,0 8px 24px #202b2330;z-index:4}.pin.home svg{width:49px;height:49px;stroke-width:1.3}.home-label{position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%);background:var(--surface);color:var(--text);font:19px Georgia,serif;white-space:nowrap;padding:9px 17px;border-radius:3px;box-shadow:var(--shadow)}.home-label small{display:block;font:8px Arial,sans-serif;letter-spacing:2px;margin-bottom:5px}.pin.home:after{display:none}.pin .number{display:none}#popup{position:absolute;z-index:8;bottom:56px;left:25px;background:var(--surface);color:var(--text);width:320px;padding:26px;border-radius:5px;box-shadow:0 12px 40px #1112;border:1px solid var(--line)}#popup[hidden]{display:none}#popup .close{position:absolute;right:10px;top:8px;background:none;border:0;color:var(--muted);font-size:23px;padding:3px 8px}#popup .type{font-size:9px;letter-spacing:1.8px;text-transform:uppercase;color:var(--muted)}#popup h3{font:25px/1.15 Georgia,serif;margin:16px 0 12px}#popup p{font-size:12px;line-height:1.65;color:var(--muted);margin:0 0 20px}#popup a{font-size:11px;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:5px;color:var(--text)}.compass{position:absolute;right:25px;top:22px;text-align:center;font-size:10px;color:var(--text)}.compass span{display:block;font-size:28px}.zoom{position:absolute;right:21px;bottom:57px;display:flex;flex-direction:column;border-radius:6px;overflow:hidden;box-shadow:var(--shadow)}.zoom button{background:var(--surface);color:var(--text);border:0;border-bottom:1px solid var(--line);width:38px;height:38px;font-size:23px}.zoom button:disabled{opacity:.45;cursor:default}.map-caption{position:absolute;bottom:21px;left:25px;font-size:9px;letter-spacing:1.7px;color:var(--text);pointer-events:none}.map-caption span{margin-left:20px;letter-spacing:0;color:var(--muted)}.credits{position:absolute;right:8px;bottom:5px;background:var(--surface);color:var(--muted);font-size:9px;padding:3px 5px}.credits a{color:inherit}footer{display:flex;align-items:center;justify-content:space-between;font-size:11px;padding:23px 0;color:var(--muted)}footer i{margin-left:30px;font-size:20px;font-style:normal}.note{font-size:11px;text-align:center;padding:10px 20px;color:#85877f;line-height:1.6}aside{display:none}.night{--bg:#242724;--surface:#30342f;--text:#f2f3ed;--muted:#a5aaa1;--line:#50554c;--pin:#343932}.night .viewport{background:#262c28}.night #tiles{filter:grayscale(1) invert(1);opacity:.30}.night .label{color:#9ca498;text-shadow:0 1px 3px #252a23}.night .label.city{color:#cad0c6}.night .pin{border-color:#858d7d}.night .pin.home{background:#f1f2e9;color:#30362c;border-color:#676d61}.night header{margin-bottom:35px}.night h1{font-size:clamp(38px,4.7vw,70px)}.night .viewport{border:1px solid #42483d}.guide header{display:none}.guide{padding-top:36px}.guide .layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:32px}.guide aside{display:block}.guide aside h2{font:49px/.98 Georgia,serif;letter-spacing:-1.6px;margin:10px 0 22px}.guide aside p{font-size:12px;line-height:1.8;color:var(--muted);margin-bottom:25px}.guide #filters{gap:6px;min-height:48px}.guide #filters button{padding:10px 12px;font-size:11px}.guide #filters button svg{width:15px;height:15px}.guide .viewport{height:670px;border-radius:0}.guide #list{height:505px;overflow:auto;scrollbar-width:thin}.list-row{width:100%;display:flex;gap:15px;text-align:left;padding:16px 8px 16px 0;background:none;border:0;border-top:1px solid var(--line);color:var(--text)}.list-row b{font:17px Georgia,serif;color:var(--muted);min-width:24px}.list-row strong{font-size:13px;font-weight:400;display:block;margin-bottom:5px}.list-row small{font-size:10px;color:var(--muted);line-height:1.5;display:block}.list-row:hover,.list-row.selected{background:#f0f1ed}.guide .pin:not(.home) svg{display:none}.guide .pin .number{display:block;font-size:11px}.guide .pin:not(.home){width:31px;height:31px;padding:4px}.guide .pin.home{width:65px;height:65px}.guide .pin.home svg{width:40px;height:40px}.guide .home-label{font-size:16px}.guide #popup{width:285px}.guide footer{padding-top:24px}@media(min-width:1600px){main{padding-left:max(48px,calc((100vw - 1536px)/2));padding-right:max(48px,calc((100vw - 1536px)/2))}}@media(max-width:900px){.concepts{padding:16px 20px;display:block}.concepts>span{display:block;margin-bottom:12px}.concepts button{padding:10px}.concepts div{justify-content:space-between}main{padding:32px 20px 0}header{display:block}h1{font-size:48px;letter-spacing:-2px}header p{font-size:12px;margin-top:22px}header p span{margin-top:5px}.viewport{height:540px}#filters{gap:7px}#filters button{padding:10px 12px;font-size:11px}#filters button svg{width:17px;height:17px}.guide .layout{display:block}.guide aside h2{font-size:45px}.guide aside p{margin-bottom:18px}.guide #list{display:none}.guide .viewport{height:540px}.guide #filters{margin-top:22px}.guide .home-label{font-size:14px}footer{gap:20px;font-size:10px}.compass{right:14px}.map-caption span{display:none}#popup{left:12px;bottom:44px;width:min(290px,calc(100% - 70px));padding:20px}.zoom{right:12px}.home-label{font-size:15px;padding:8px 11px}.pin.home{width:63px;height:63px}.pin.home svg{width:39px;height:39px}.label{font-size:10px}.label.city{font-size:24px}.pin{width:32px;height:32px;padding:6px}.pin svg{width:18px;height:18px}.note{font-size:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
#labels{display:none}#tiles{opacity:.68;filter:grayscale(1) contrast(.72) brightness(1.16)}.night #tiles{filter:grayscale(1) invert(1) contrast(.85);opacity:.6}.night{position:relative}.night header p{max-width:280px}.guide .pin:not(.home){background:#30342e;color:#fff}.guide .pin.selected{background:white;color:#30342e}.guide #popup{bottom:65px}.pin[data-id="4"]{margin-left:-17px;margin-top:-9px}.pin[data-id="2"]{margin-left:12px;margin-top:8px}.pin[data-id="8"]{margin-top:16px}.pin[data-id="12"]{margin-top:-12px}.pin[data-id="0"]{margin-left:-14px;margin-top:-7px}.pin[data-id="9"]{margin-left:12px;margin-top:12px}
@media(max-width:900px){.viewport,.guide .viewport{height:480px}.map-caption{left:14px}.home-label{font-size:13px}.home-label small{font-size:7px;letter-spacing:1px}.guide #list{display:block;height:180px;overflow:auto;margin-bottom:22px}.note{margin-top:0}.pin{width:36px;height:36px}}
.viewport{overflow:clip}
@media(min-width:901px){.viewport{height:600px}.guide .viewport{height:670px}}
@media(max-width:900px){.home-label{transform:translateX(-75%)}.compass{right:auto;left:15px;top:15px}.compass span{font-size:24px}}

/* Selected design: graphite, with prominent geographic labels. */
body{background:#242724}
#labels{display:block;position:absolute;inset:0;pointer-events:none}
.night .label.city{font:42px/1 Georgia,serif;letter-spacing:.4px;color:#f3f4ec;text-shadow:0 2px 7px #20251f,0 0 15px #20251f;background:#2b302bd9;padding:5px 10px;border-radius:5px}
.road-name{position:absolute;transform:translate(-50%,-50%);font:600 30px/1.1 Arial,sans-serif;letter-spacing:2.5px;color:#f3f4ec;background:#303630;padding:7px 11px;border-radius:4px;white-space:nowrap;box-shadow:0 0 7px #282e28}
.note{color:#a5aaa1}
@media(max-width:900px){.night .label.city{font-size:32px}.road-name{font-size:25px;letter-spacing:2px;padding:6px 9px}}

/* Embedded full-width map */
html,body{height:100%;overflow:hidden}main.night{padding:20px 0 0;min-height:0;height:100%;background:#292b29}#filters{padding:0 4%;margin-bottom:16px}.viewport{height:calc(100vh - 88px)!important;border-radius:0!important;width:100%;touch-action:pan-y}#popup{max-width:calc(100% - 70px)}@media(max-width:700px){#filters{gap:7px;padding:0 16px}#filters button{padding:9px 12px;font-size:11px}.viewport{height:calc(100vh - 148px)!important}}

/* Match the landing page forest-green palette. */
html,body,main.night{background:#101c14}
.night{--bg:#101c14;--surface:#1d2b21;--text:#f5f4ef;--muted:#bac5b6;--line:#465b43;--pin:#243a29}
.night .viewport{background:#14251a;border-color:#465b43}
.night #tiles{filter:grayscale(1) invert(1) sepia(.3) hue-rotate(65deg) saturate(1.2) contrast(.85)}
.night .label.city{background:#1d2b21e6;text-shadow:0 2px 4px #101c14}
.night .road-name{background:#1d2b21;color:#f5f4ef}

/* Brighter green infrastructure map. */
html,body,main.night{background:#809f62}
.night{--bg:#809f62;--surface:#edf3e5;--text:#243822;--muted:#506647;--line:#a3bc8a;--pin:#426d38}
.night .viewport{background:#b5d590;border-color:#93b877}
.night #tiles{filter:sepia(.2) saturate(1.7) hue-rotate(12deg) brightness(1.02);opacity:.88}
.night .label.city,.night .road-name{background:#edf4dfeb;color:#294322;text-shadow:none;box-shadow:none}
.night .pin{background:#426d38;color:white;border-color:#e2efcd}
.night .pin.rail{background:#f3f7e9;color:#305f28;border:2px solid #426d38}
.night .pin.selected{background:#c5e689;color:#243822}
