:root{
  --ground:#E8ECEC; --surface:#F8FAFA; --surface-2:#DCE3E4; --surface-3:#D0D9DB;
  --ink:#131A1D; --ink-2:#3F4E54; --ink-3:#6D7E85;
  --line:#C1CCCF; --line-2:#A7B5B9;
  --orange:#BC4526; --teal:#2B5A66; --amber:#8A6210;
  --c-house:#D9541F; --c-work:#1F7F8C; --c-event:#A5761B;
  --c-fun:#3E8A54; --c-food:#B33C63; --c-night:#5B54B8; --c-avoid:#7C8487;
}
@media (prefers-color-scheme: dark){
  :root{
    --ground:#0D1315; --surface:#151D20; --surface-2:#1D272B; --surface-3:#263337;
    --ink:#E6ECEE; --ink-2:#A8B7BC; --ink-3:#7A8B91;
    --line:#2A373C; --line-2:#3A4A50;
    --orange:#E67B57; --teal:#79AEBC; --amber:#C99C3E;
    --c-house:#F0794A; --c-work:#4FB4C4; --c-event:#D6A445;
    --c-fun:#5FB878; --c-food:#E0688F; --c-night:#8E86E8; --c-avoid:#959DA1;
  }
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:"Newsreader",Georgia,serif; font-size:17px; line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
:focus-visible{outline:2px solid var(--orange); outline-offset:3px}
.wrap{max-width:1240px; margin:0 auto; padding:0 22px 96px}

/* masthead */
.mast{padding:52px 0 26px; border-bottom:1px solid var(--line)}
.eyebrow{font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--orange); margin:0 0 16px}
.mast h1{
  font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 122,'wght' 850;
  font-size:clamp(2.5rem,10vw,6.6rem); line-height:.86; letter-spacing:-.02em;
  text-transform:uppercase; margin:0;
}
.mast h1 em{font-style:normal; color:var(--orange)}
.mast .sub{margin:20px 0 0; max-width:64ch; font-size:1.15rem; color:var(--ink-2)}
.strip{display:flex; flex-wrap:wrap; margin-top:28px; border-top:1px solid var(--line); border-left:1px solid var(--line)}
.strip div{flex:1 1 120px; padding:11px 13px; border-right:1px solid var(--line); border-bottom:1px solid var(--line)}
.strip dt{font-family:"IBM Plex Mono",monospace; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); margin:0 0 3px}
.strip dd{margin:0; font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 110,'wght' 700; font-size:1rem; font-variant-numeric:tabular-nums}

/* layout */
.cols{display:grid; grid-template-columns:1fr; gap:0}
@media(min-width:1040px){.cols{grid-template-columns:186px 1fr; gap:52px; align-items:start}}
nav.rail{display:none}
@media(min-width:1040px){nav.rail{display:block; position:sticky; top:20px; padding-top:40px; max-height:calc(100vh - 40px); overflow-y:auto}}
.rail ol{list-style:none; margin:0; padding:0}
.rail a{
  display:grid; grid-template-columns:2rem 1fr; gap:5px; align-items:baseline; text-decoration:none;
  color:var(--ink-3); padding:5px 0; border-top:1px solid var(--line);
  font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 94,'wght' 600;
  font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; line-height:1.25;
}
.rail a span:first-child{font-family:"IBM Plex Mono",monospace; font-size:.66rem}
.rail a:hover{color:var(--ink)}
.rail a.on,.rail a.on span:first-child{color:var(--orange)}
.rail .grp{font-family:"IBM Plex Mono",monospace; font-size:.6rem; letter-spacing:.16em; color:var(--orange); text-transform:uppercase; padding:16px 0 4px}
main{min-width:0; padding-top:10px}

/* sections */
section{padding:50px 0 8px; scroll-margin-top:16px}
.plate{display:flex; align-items:flex-end; gap:14px; flex-wrap:wrap; border-top:3px solid var(--ink); padding-top:11px; margin-bottom:24px}
.plate .num{font-family:"IBM Plex Mono",monospace; font-size:.78rem; font-weight:600; color:var(--orange); padding-bottom:.4em}
.plate h2{font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 118,'wght' 800; font-size:clamp(1.5rem,4.2vw,2.4rem); line-height:.95; letter-spacing:-.015em; text-transform:uppercase; margin:0; flex:1 1 auto}
.plate .kicker{font-family:"IBM Plex Mono",monospace; font-size:.66rem; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3); padding-bottom:.5em}
main p{max-width:68ch; margin:0 0 17px}
main p.lead{font-size:1.14rem; color:var(--ink-2)}
h3{font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 106,'wght' 750; font-size:1rem; letter-spacing:.06em; text-transform:uppercase; margin:36px 0 11px}
h4{font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 100,'wght' 700; font-size:.84rem; letter-spacing:.05em; text-transform:uppercase; margin:0 0 8px; color:var(--teal)}
main ul{max-width:68ch; margin:0 0 17px; padding-left:1.1em}
main ul li{margin-bottom:6px}
main ul li::marker{color:var(--orange)}
strong{font-weight:600; color:var(--ink)}
a{color:var(--ink); text-decoration:underline; text-decoration-color:var(--orange); text-underline-offset:3px}
a:hover{color:var(--orange)}
code{font-family:"IBM Plex Mono",monospace; font-size:.85em; background:var(--surface-2); padding:.1em .35em; border-radius:3px}

/* tables */
.tw{overflow-x:auto; margin:0 0 22px; border:1px solid var(--line); background:var(--surface)}
table{border-collapse:collapse; width:100%; min-width:640px; font-size:.9rem}
th{text-align:left; font-family:"IBM Plex Mono",monospace; font-weight:600; font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3); padding:10px 13px; border-bottom:1px solid var(--line-2); background:var(--surface-2); white-space:nowrap}
td{padding:10px 13px; border-bottom:1px solid var(--line); vertical-align:top; line-height:1.45}
tr:last-child td{border-bottom:0}
td:first-child{font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 100,'wght' 700; font-size:.8rem; letter-spacing:.03em; text-transform:uppercase; white-space:nowrap; color:var(--ink)}
td.num,th.num{font-family:"IBM Plex Mono",monospace; font-variant-numeric:tabular-nums; white-space:nowrap}
td.w{white-space:normal}

/* callouts */
.note{border-left:3px solid var(--orange); background:var(--surface); padding:13px 17px; margin:0 0 21px; max-width:72ch}
.note.warn{border-left-color:var(--amber)}
.note.calm{border-left-color:var(--teal)}
.note .tag{display:block; font-family:"IBM Plex Mono",monospace; font-size:.61rem; letter-spacing:.15em; text-transform:uppercase; color:var(--orange); margin-bottom:6px}
.note.warn .tag{color:var(--amber)}
.note.calm .tag{color:var(--teal)}
.note p{margin:0; max-width:none; font-size:.97rem}
.note p+p{margin-top:9px}

/* cards */
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(238px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin:0 0 23px}
.cards>div{background:var(--surface); padding:15px 17px}
.cards p{margin:0; font-size:.92rem; color:var(--ink-2); max-width:none}
.cards .n{font-family:"IBM Plex Mono",monospace; font-size:.61rem; letter-spacing:.14em; color:var(--ink-3); display:block; margin-bottom:7px}

/* timeline */
.tl{margin:0 0 25px; border-top:1px solid var(--line-2)}
.tl .row{display:grid; grid-template-columns:4.4rem 1fr; gap:15px; padding:12px 0; border-bottom:1px solid var(--line)}
.tl .t{font-family:"IBM Plex Mono",monospace; font-size:.8rem; font-weight:600; color:var(--orange); font-variant-numeric:tabular-nums; padding-top:.15em}
.tl .b b{display:block; font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 104,'wght' 700; font-size:.9rem; letter-spacing:.02em; text-transform:uppercase; margin-bottom:3px}
.tl .b span{font-size:.96rem; color:var(--ink-2)}
.tl .row.peak .t{color:var(--teal)}

/* map */
#mapwrap{border:1px solid var(--line); background:var(--surface); margin:0 0 14px}
#map{height:600px; width:100%; background:var(--surface-2)}
@media(max-width:700px){#map{height:460px}}
.mapbar{display:flex; flex-wrap:wrap; gap:6px; padding:10px 11px; border-bottom:1px solid var(--line); align-items:center}
.mapbar .sep{width:1px; height:20px; background:var(--line-2); margin:0 4px}
button.mb{
  font-family:"IBM Plex Mono",monospace; font-size:.68rem; letter-spacing:.06em; text-transform:uppercase;
  background:var(--surface-2); color:var(--ink-2); border:1px solid var(--line-2);
  padding:5px 10px; cursor:pointer; border-radius:2px;
}
button.mb:hover{color:var(--ink)}
button.mb.on{background:var(--ink); color:var(--ground); border-color:var(--ink)}
button.mb.city{font-variation-settings:'wght' 700}
button.mb .dot{display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:5px; vertical-align:middle}
.leaflet-popup-content-wrapper{border-radius:3px; background:var(--surface); color:var(--ink)}
.leaflet-popup-tip{background:var(--surface)}
.leaflet-popup-content{margin:13px 15px; font-family:"Newsreader",Georgia,serif; font-size:.93rem; line-height:1.5; width:280px !important}
.pop-cat{font-family:"IBM Plex Mono",monospace; font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:5px}
.pop-name{font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 106,'wght' 780; font-size:1rem; text-transform:uppercase; letter-spacing:.02em; margin-bottom:7px; line-height:1.15; color:var(--ink)}
.pop-desc{margin:0 0 7px; color:var(--ink-2)}
.pop-bg{margin:0 0 8px; font-size:.85rem; color:var(--ink-3); border-left:2px solid var(--line-2); padding-left:8px}
.pop-link{font-family:"IBM Plex Mono",monospace; font-size:.72rem; word-break:break-all}
.legend{display:flex; flex-wrap:wrap; gap:13px; font-family:"IBM Plex Mono",monospace; font-size:.66rem; color:var(--ink-3); margin-bottom:22px}
.legend span{display:inline-flex; align-items:center; gap:5px}
.legend i{width:9px; height:9px; border-radius:50%}

/* misc */
.pillrow{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 19px}
.pill{font-family:"IBM Plex Mono",monospace; font-size:.67rem; border:1px solid var(--line-2); padding:3px 9px; border-radius:999px; color:var(--ink-2); background:var(--surface)}
.pill.hot{border-color:var(--orange); color:var(--orange)}
.split{display:grid; grid-template-columns:1fr; gap:24px}
@media(min-width:760px){.split{grid-template-columns:1fr 1fr; gap:34px}}
.split>div>:last-child{margin-bottom:0}
.tells{display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin:0 0 23px}
@media(min-width:700px){.tells{grid-template-columns:1fr 1fr}}
.tells>div{background:var(--surface); padding:15px 17px}
.tells ul{margin:0; padding-left:1.05em; max-width:none}
.tells li{font-size:.91rem; color:var(--ink-2); margin-bottom:5px}
.tells .no li::marker{color:var(--amber)}
.tells .yes li::marker{color:var(--teal)}
.big-quote{font-size:1.3rem; line-height:1.4; max-width:30ch; border-top:3px solid var(--orange); padding-top:13px; margin:0 0 23px; font-family:"Archivo",sans-serif; font-variation-settings:'wdth' 104,'wght' 620}
.check{list-style:none; padding-left:0; max-width:68ch}
.check li{display:grid; grid-template-columns:1.5rem 1fr; gap:8px; align-items:baseline; border-bottom:1px solid var(--line); padding:8px 0; margin:0}
.check li::before{content:""; width:12px; height:12px; border:1.5px solid var(--line-2); display:inline-block; position:relative; top:1px}
.script{background:var(--surface); border:1px solid var(--line); padding:15px 17px; margin:0 0 21px; max-width:72ch; font-size:.96rem}
.script b{display:block; font-family:"IBM Plex Mono",monospace; font-size:.61rem; letter-spacing:.14em; text-transform:uppercase; color:var(--teal); margin-bottom:7px; font-weight:600}
.script p{margin:0 0 9px; max-width:none}
.script p:last-child{margin-bottom:0}
footer{margin-top:66px; padding-top:20px; border-top:3px solid var(--ink); font-family:"IBM Plex Mono",monospace; font-size:.69rem; letter-spacing:.05em; color:var(--ink-3); line-height:1.8}

/* ---------- shared additions ---------- */
.sitenav{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--line);margin:22px 0 0;background:var(--surface)}
.sitenav a{
  flex:1 1 auto;padding:9px 16px;text-decoration:none;color:var(--ink-3);
  font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;
  border-right:1px solid var(--line);text-align:center;
}
.sitenav a:last-child{border-right:0}
.sitenav a:hover{color:var(--ink);background:var(--surface-2)}
.sitenav a.here{background:var(--ink);color:var(--ground)}
.matrix td:first-child{white-space:normal}
.matrix .pick{background:var(--surface-2)}
.matrix .pick td:first-child{color:var(--orange)}
.score{font-family:"IBM Plex Mono",monospace;font-size:.8rem;letter-spacing:.08em;white-space:nowrap}
.score b{font-weight:600;color:var(--ink)}