:root{
  /* surfaces */
  --paper:#f5eddd;
  --paper-2:#efe4cf;
  --paper-edge:#e4d6ba;
  --cream:#fbf6ec;
  /* ink */
  --ink:#2b211c;
  --ink-soft:#5a4f47;
  /* brand */
  --green:#3f6a48;
  --green-deep:#33573b;
  --brick:#9c3b2e;
  --brick-deep:#7c2c22;
  --saffron:#e0a52e;
  --walnut:#6b4c3b;
  --moss:#7a8c5e;
  /* accent is themed per movement (Roots = green, Routes = terracotta) */
  --accent:var(--green);
  --accent-deep:var(--green-deep);
  --accent-soft:rgba(63,106,72,.12);
  /* misc */
  --line:rgba(43,33,28,.14);
  --shadow:0 1px 2px rgba(43,33,28,.06), 0 16px 44px -24px rgba(43,33,28,.5);
  --wrap:1140px;
  --measure:64ch;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Fraunces", Georgia, "Times New Roman", serif;
  font-size:19px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{background:var(--brick);color:var(--cream);}
img{max-width:100%;}

a{color:var(--brick-deep);text-decoration-color:rgba(124,44,34,.35);text-underline-offset:3px;}
a:hover{text-decoration-color:var(--brick-deep);}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 28px;}
.narrow{max-width:760px;}

h1,h2,h3,h4{font-family:"Fraunces", Georgia, serif;font-weight:700;line-height:1.08;letter-spacing:-.015em;margin:0;}

.eyebrow{
  font-family:"Inter", system-ui, sans-serif;
  text-transform:uppercase;letter-spacing:.18em;font-size:.74rem;font-weight:600;
  color:var(--accent);margin:0;
}
.lead{font-size:clamp(1.12rem,2.1vw,1.4rem);color:var(--ink);}
.serif-italic{font-family:"Fraunces",serif;font-style:italic;font-weight:400;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.5em;
  font-family:"Inter",system-ui,sans-serif;font-size:.95rem;font-weight:600;letter-spacing:.01em;
  padding:.8em 1.45em;border-radius:999px;text-decoration:none;cursor:pointer;border:1px solid transparent;
  transition:transform .12s ease, background .15s ease, box-shadow .15s ease, color .15s ease, border-color .15s ease;
}
.btn-primary{background:var(--accent);color:var(--cream);box-shadow:0 10px 24px -12px rgba(43,33,28,.7);}
.btn-primary:hover{background:var(--accent-deep);transform:translateY(-1px);}
.btn-outline{background:transparent;color:var(--ink);border-color:var(--line);}
.btn-outline:hover{border-color:var(--ink);transform:translateY(-1px);}
.btn-light{background:var(--cream);color:var(--ink);}
.btn-light:hover{transform:translateY(-1px);box-shadow:var(--shadow);}
/* outline buttons on dark / accent bands */
.band-ink .btn-outline,.band-accent .btn-outline{color:var(--cream);border-color:rgba(251,246,236,.4);}
.band-ink .btn-outline:hover,.band-accent .btn-outline:hover{border-color:var(--cream);}
.band-accent .btn-primary{background:var(--cream);color:var(--ink);}
.band-accent .btn-primary:hover{background:#fff;}

/* ---------- Header ---------- */
header.site{
  position:sticky;top:0;z-index:60;
  background:rgba(245,237,221,.86);
  backdrop-filter:saturate(140%) blur(8px);-webkit-backdrop-filter:saturate(140%) blur(8px);
  border-bottom:2px solid var(--green);
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;padding-top:12px;padding-bottom:12px;}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;}
.wordmark{display:block;height:26px;width:auto;}
.nav-links{display:flex;align-items:center;gap:1.5rem;font-family:"Inter",system-ui,sans-serif;font-size:.92rem;font-weight:500;}
.nav-links a{color:var(--ink-soft);text-decoration:none;}
.nav-links a:hover{color:var(--green);}
.nav-cta{display:flex;align-items:center;gap:.8rem;}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:6px 8px;font-size:1.45rem;
  line-height:1;color:var(--ink);border-radius:8px;}
.nav-toggle:hover{background:var(--paper-2);}
@media(max-width:820px){
  .nav-toggle{display:inline-flex;align-items:center;}
  .nav-links{position:absolute;top:100%;left:0;right:0;z-index:70;display:none;
    flex-direction:column;align-items:stretch;gap:0;background:var(--cream);
    border-top:1px solid var(--paper-edge);border-bottom:1px solid var(--paper-edge);
    box-shadow:var(--shadow);padding:6px 0;}
  .nav-links.open{display:flex;}
  .nav-links a{padding:13px 28px;font-size:1.02rem;}
  .nav-links a:hover{background:var(--paper-2);color:var(--green);}
}

/* ---------- Sections ---------- */
section{padding:84px 0;}
.section-head{max-width:var(--measure);margin:0 0 34px;}
.section-head h2{font-size:clamp(1.9rem,4vw,2.9rem);margin-top:.35em;}
.section-head .intro{color:var(--ink-soft);margin:.7em 0 0;font-size:1.12rem;}
.kicker-italic{font-family:"Fraunces",serif;font-style:italic;font-weight:400;color:var(--ink-soft);font-size:1.2rem;}

.band-paper{background:linear-gradient(180deg,var(--cream),var(--paper-2));border-top:1px solid var(--paper-edge);border-bottom:1px solid var(--paper-edge);}
.band-ink{background:var(--ink);color:var(--cream);}
.band-ink .eyebrow{color:var(--saffron);}
.band-ink h2,.band-ink h3{color:var(--cream);}
.band-ink p{color:#e7ddcf;}
.band-accent{background:var(--accent);color:var(--cream);}
.band-accent .eyebrow{color:var(--cream);opacity:.85;}
.band-accent h2{color:var(--cream);}
.band-accent p{color:rgba(251,246,236,.92);}

.prose p{max-width:var(--measure);}
.prose p+p{margin-top:1rem;}
.mini-title{font-family:"Fraunces",serif;font-weight:700;font-size:clamp(1.45rem,2.6vw,1.85rem);line-height:1.15;color:var(--accent);margin:0 0 .6rem;}

/* ---------- Hero ---------- */
.hero{padding:64px 0 0;overflow:hidden;}
.hero-grid{display:grid;gap:34px;align-items:center;}
@media(min-width:900px){.hero-grid{grid-template-columns:1.05fr .95fr;gap:54px;}}
.hero h1{font-size:clamp(2.7rem,6.6vw,4.6rem);letter-spacing:-.025em;margin-top:.3em;}
.hero h1 .alt{font-style:italic;font-weight:400;color:var(--green);}
.hero .lead{margin:1em 0 0;max-width:40ch;color:var(--ink);}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem;}
.hero-note{margin-top:1.5rem;font-family:"Inter",sans-serif;font-size:.82rem;letter-spacing:.03em;color:var(--ink-soft);}
.hero-img{border-radius:18px;overflow:hidden;border:1px solid var(--paper-edge);box-shadow:var(--shadow);aspect-ratio:1.45/1;}
.hero-img img{width:100%;height:100%;object-fit:cover;display:block;}
.hero-cap{font-family:"Inter",sans-serif;font-size:.78rem;color:var(--ink-soft);margin:.6rem 2px 0;}

/* fine-grained rooftop band */
.skyline{display:block;width:100%;height:auto;margin-top:56px;}

/* ---------- Two-path cards ---------- */
.paths{display:grid;gap:18px;grid-template-columns:1fr;margin-top:8px;}
@media(min-width:720px){.paths{grid-template-columns:1fr 1fr;}}
.path{background:var(--cream);border:1px solid var(--paper-edge);border-radius:18px;padding:30px;box-shadow:var(--shadow);border-top:5px solid var(--pcol);}
.path.roots{--pcol:var(--green);}
.path.routes{--pcol:var(--brick);}
.path .ptag{font-family:"Inter",sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--pcol);}
.path h3{font-size:1.5rem;margin:.45rem 0 .5rem;}
.path p{margin:0;color:var(--ink-soft);font-size:1.04rem;}

/* ---------- Stats ---------- */
.stats{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));}
.stat{background:var(--cream);border:1px solid var(--paper-edge);border-radius:14px;padding:24px;box-shadow:var(--shadow);}
.stat .big{font-family:"Fraunces",serif;font-weight:700;font-size:2.5rem;line-height:1;color:var(--accent);}
.stat .lbl{font-family:"Inter",sans-serif;font-size:.92rem;color:var(--ink-soft);margin-top:.5rem;}
.stat .src{font-family:"Inter",sans-serif;font-size:.72rem;color:var(--ink-soft);opacity:.75;margin-top:.5rem;}

/* ---------- Bar comparison ---------- */
.bars{display:grid;gap:16px;background:var(--cream);border:1px solid var(--paper-edge);border-radius:16px;padding:26px 28px;box-shadow:var(--shadow);}
.bar-row{display:grid;grid-template-columns:130px 1fr 52px;align-items:center;gap:14px;font-family:"Inter",sans-serif;font-size:.92rem;}
.bar-row .who{color:var(--ink);font-weight:500;}
.bar-track{display:block;height:16px;background:var(--paper-2);border:1px solid var(--paper-edge);border-radius:999px;overflow:hidden;}
.bar-fill{display:block;height:100%;border-radius:999px;background:var(--accent);}
.bar-fill.muted{background:var(--walnut);opacity:.55;}
.bar-row .val{font-weight:600;color:var(--ink);text-align:right;}
.bars .caption{grid-column:1/-1;font-size:.78rem;color:var(--ink-soft);margin-top:2px;}

/* ---------- Figures ---------- */
.figure{margin:40px 0 0;}
.figure img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--paper-edge);box-shadow:var(--shadow);}
.figure figcaption,.cap{margin:.8rem auto 0;font-family:"Inter",sans-serif;font-size:.86rem;line-height:1.5;color:var(--ink-soft);max-width:70ch;}
.band-ink .figure figcaption,.band-ink .cap{color:#c9bcab;}
.illus{font-family:"Inter",sans-serif;font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);opacity:.8;}

/* ---------- Builders row (photo + cartoon side by side) ---------- */
.builders-row{display:grid;gap:24px;grid-template-columns:1fr;align-items:start;margin:40px 0 0;}
.builders-row .figure{margin:0;}
.builders-row .figure.cartoon img{background:#fff;object-fit:contain;}
/* On desktop, the two images share an equal-height row (subgrid) so their
   bottom edges line up; the portrait cartoon is letterboxed on cream. */
@media(min-width:760px){
  .builders-row{grid-template-columns:1.55fr 1fr;grid-template-rows:1fr auto;}
  .builders-row .figure{display:grid;grid-row:1 / span 2;grid-template-rows:subgrid;}
  .builders-row .figure img{height:100%;object-fit:cover;}
  .builders-row .figure.cartoon img{object-fit:contain;}
}

/* ---------- Duo (side by side) & Trio ---------- */
.duo{display:grid;gap:16px;grid-template-columns:1fr;}
@media(min-width:760px){.duo{grid-template-columns:1fr 1fr;}}
.trio{display:grid;gap:16px;grid-template-columns:1fr;}
@media(min-width:820px){.trio{grid-template-columns:repeat(3,1fr);}}
.shot{margin:0;position:relative;}
.shot img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--paper-edge);box-shadow:var(--shadow);aspect-ratio:1.5/1;object-fit:cover;}
.shot figcaption{font-family:"Inter",sans-serif;font-size:.84rem;color:var(--ink-soft);margin-top:.6rem;}
.shot .tag{position:absolute;top:12px;left:12px;font-family:"Inter",sans-serif;font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--cream);background:rgba(43,33,28,.8);padding:.38em .8em;border-radius:999px;}
.shot .tag.good{background:var(--green);}
.shot .tag.bad{background:var(--brick);}

/* ---------- Before/After slider ---------- */
.cmp-wrap{margin:36px 0 0;}
.cmp{--pos:50%;position:relative;width:100%;aspect-ratio:1.45/1;border-radius:16px;overflow:hidden;border:1px solid var(--paper-edge);box-shadow:var(--shadow);background:var(--paper-2);user-select:none;touch-action:pan-y;}
.cmp-pane{position:absolute;inset:0;}
.cmp-pane img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
/* the "before" layer (and its label) is clipped to the left of the divider, so a
   pill is masked away as the divider sweeps over it */
.cmp-pane.before{clip-path:inset(0 calc(100% - var(--pos)) 0 0);z-index:1;}
.cmp-line{position:absolute;top:0;bottom:0;left:var(--pos);width:3px;background:var(--cream);transform:translateX(-1.5px);pointer-events:none;box-shadow:0 0 0 1px rgba(43,33,28,.25);z-index:3;}
.cmp-grip{position:absolute;top:50%;left:var(--pos);width:46px;height:46px;border-radius:50%;background:var(--cream);color:var(--ink);transform:translate(-50%,-50%);display:grid;place-items:center;pointer-events:none;box-shadow:var(--shadow);font-size:1rem;z-index:3;transition:transform .3s ease, box-shadow .3s ease;}
.cmp.nudging .cmp-grip{transform:translate(-50%,-50%) scale(1.16);box-shadow:0 6px 18px -6px rgba(43,33,28,.6);}
.cmp-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:4;}
.cmp-range:focus-visible{outline:3px solid var(--saffron);outline-offset:-3px;border-radius:16px;}
.cmp-tag{position:absolute;bottom:14px;font-family:"Inter",sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--cream);padding:.42em .9em;border-radius:999px;pointer-events:none;}
.cmp-tag.now{left:14px;background:rgba(43,33,28,.82);}
.cmp-tag.after{right:14px;background:var(--green);}
@media(prefers-reduced-motion:reduce){.cmp-grip{transition:none;}}
.cmp-hint{font-family:"Inter",sans-serif;font-size:.8rem;color:var(--ink-soft);text-align:center;margin-top:.7rem;}

/* "This is Station Street": landscape wipe whose heading name swaps per side */
.ss-block{margin-top:0;}
.ss-block + .section-head{margin-top:72px;}   /* space before the secondary "100 West" block */
.ss-name{display:inline-block;transform-origin:left center;color:var(--green);
  transition:opacity .28s ease, transform .28s ease;}
.ss-name.is-now{color:#8f897c;}               /* "100 W" reads as the muted present */
.ss-name.swapping{opacity:0;transform:translateY(.18em) scale(.96);}
@media(prefers-reduced-motion:reduce){.ss-name{transition:none;}}

/* ---------- Movement (act) accents ---------- */
.movement-roots{--accent:var(--green);--accent-deep:var(--green-deep);--accent-soft:rgba(63,106,72,.12);}
.movement-routes{--accent:var(--brick);--accent-deep:var(--brick-deep);--accent-soft:rgba(156,59,46,.12);}

/* ---------- Act divider ---------- */
.act{padding:70px 0;}
.act .wrap{display:grid;gap:18px;}
@media(min-width:760px){.act .wrap{grid-template-columns:auto 1fr;gap:36px;align-items:start;}}
.act-num{font-family:"Fraunces",serif;font-weight:700;font-size:clamp(3.4rem,9vw,6rem);line-height:.8;color:var(--accent);}
.act-label{font-family:"Inter",sans-serif;font-weight:600;letter-spacing:.22em;text-transform:uppercase;font-size:.82rem;color:var(--accent);margin:0 0 .2em;}
.act-title{font-size:clamp(2rem,4.6vw,3.2rem);}
.act-def{font-family:"Fraunces",serif;font-style:italic;font-weight:400;color:#d8cebf;font-size:1.18rem;margin:.7em 0 0;max-width:48ch;}

/* ---------- Pull quote ---------- */
.pull{margin:56px auto 0;max-width:36rem;text-align:center;}
/* sections that end on a centered pull quote: trim bottom so the quote isn't
   left floating above the doubled section padding */
#speeding{padding-bottom:52px;}
#built-by-provo{padding-bottom:52px;}
.pull p{font-family:"Fraunces",serif;font-style:italic;font-weight:400;font-size:clamp(1.7rem,4vw,2.6rem);line-height:1.16;letter-spacing:-.01em;margin:0;}
.pull p em{font-style:italic;color:var(--accent);}
.pull .by{font-family:"Inter",sans-serif;font-style:normal;font-size:.84rem;letter-spacing:.04em;color:var(--ink-soft);margin-top:1rem;display:block;}

/* ---------- Spectrum cards ---------- */
.spectrum{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media(min-width:920px){.spectrum{grid-template-columns:repeat(4,minmax(0,1fr));}}
.scale{position:relative;display:flex;flex-direction:column;background:var(--cream);border:1px solid var(--paper-edge);border-radius:16px;padding:26px 22px 28px;box-shadow:var(--shadow);transition:transform .15s ease, box-shadow .15s ease;}
.scale:hover{transform:translateY(-3px);box-shadow:0 1px 2px rgba(43,33,28,.06), 0 24px 52px -28px rgba(43,33,28,.55);}
.scale-badge{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:var(--accent-soft);color:var(--accent);margin-bottom:18px;}
.scale-icon{width:34px;height:30px;display:block;color:var(--accent);}
.scale .num{font-family:"Inter",sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.18em;color:var(--accent);opacity:.6;}
.scale h3{font-size:1.18rem;line-height:1.2;margin:.4rem 0 .5rem;min-height:2.4em;}
.scale .per{font-family:"Inter",sans-serif;font-size:.8rem;font-weight:600;line-height:1.35;letter-spacing:.01em;color:var(--saffron);margin:0;min-height:2.7em;}
.scale p{font-size:.95rem;line-height:1.5;color:var(--ink-soft);margin:.7rem 0 0;}
.dial-rail{height:6px;border-radius:999px;background:linear-gradient(90deg,var(--saffron),var(--green));margin:26px 0 6px;}
.dial-foot{font-family:"Inter",sans-serif;font-size:.82rem;color:var(--ink-soft);text-align:center;}

/* ---------- Benefit checklist ---------- */
.benefits{display:grid;gap:14px;grid-template-columns:1fr;margin-top:8px;}
@media(min-width:680px){.benefits{grid-template-columns:1fr 1fr;}}
.benefit{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;}
.benefit .ck{flex:none;width:30px;height:30px;border-radius:50%;background:rgba(251,246,236,.12);color:var(--saffron);display:grid;place-items:center;}
.benefit b{font-weight:600;}
.benefit span{color:#e7ddcf;}

/* ---------- University Avenue race animation ---------- */
.race{margin:0;background:var(--cream);border:1px solid var(--paper-edge);border-radius:18px;padding:30px;box-shadow:var(--shadow);}
.race-row + .race-row{margin-top:26px;}
.race-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:12px;}
.race-name{display:flex;align-items:center;gap:.55rem;font-family:"Inter",sans-serif;font-weight:600;font-size:.95rem;color:var(--ink);}
.race-key{width:12px;height:12px;border-radius:50%;flex:none;}
.race-key.real{background:var(--brick);}
.race-key.smooth{background:var(--green);}
/* Fraunces has no tabular figures, so reserve a fixed box and left-align the
   time; the digits anchor at a stable left edge and the clock can't jump. */
.race-clock{font-family:"Fraunces",serif;font-weight:700;font-size:1.5rem;line-height:1;color:var(--brick);
  display:inline-block;min-width:3.7em;text-align:left;}
.race-clock.smooth{color:var(--green);}
.race-clock.done::after{content:" \2713";font-size:.9rem;}
.race-track{position:relative;height:56px;border-radius:12px;background:var(--paper-2);border:1px solid var(--paper-edge);overflow:hidden;}
.race-rule{position:absolute;left:14px;right:14px;top:50%;height:0;border-top:2px dashed rgba(43,33,28,.22);transform:translateY(-50%);}
.mark{position:absolute;top:50%;transform:translate(-50%,-50%);}
.mark.light{width:3px;height:36px;top:12px;transform:translateX(-50%);background:var(--brick);opacity:.6;border-radius:2px;}
.mark.light::before{content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%);width:9px;height:9px;border-radius:50%;background:var(--brick);}
.mark.light.go,.mark.light.go::before{background:var(--green);}
.mark.round{width:18px;height:18px;border-radius:50%;border:3px solid var(--green);opacity:.7;background:var(--cream);}
.race-finish{position:absolute;right:10px;top:8px;bottom:8px;width:0;border-left:3px dotted rgba(43,33,28,.45);}
.race-dot{position:absolute;top:50%;left:0;width:22px;height:22px;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 2px 6px rgba(43,33,28,.35);z-index:2;}
.race-dot.real{background:var(--brick);}
.race-dot.smooth{background:var(--green);}
.race-dot::after{content:"";position:absolute;inset:-5px;border-radius:50%;background:inherit;opacity:.22;}
.race-foot{font-family:"Inter",sans-serif;font-size:.82rem;color:var(--ink-soft);margin:.7rem 2px 0;}
.race-cap{font-family:"Inter",sans-serif;font-size:.82rem;color:var(--ink-soft);margin:20px 0 0;}

/* ---- City-wide traffic heat map (full-bleed basemap + left text/dial overlay) ---- */
#traffic-map{position:relative;overflow:hidden;padding:0;background:#0b0a09;min-height:clamp(600px,92vh,940px);}
.heat-map{position:absolute;inset:0;z-index:1;background:#0b0a09;pointer-events:none;}
.heat-map .leaflet-tile{filter:brightness(1.18) contrast(1.04) saturate(.92);} /* lift the dim surroundings into view */
.heat-map .leaflet-control-container{display:none;}
.heat-streets{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none;}
.heat-scrim{position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(90deg,rgba(9,7,6,.94) 0%,rgba(9,7,6,.66) 28%,rgba(9,7,6,.16) 46%,rgba(9,7,6,0) 58%);}

/* left overlay: heading up top, dial below; aligned to the site content column */
.heat-panel{position:absolute;inset:0;z-index:4;width:100%;max-width:var(--wrap);margin:0 auto;
  display:flex;flex-direction:column;justify-content:flex-start;
  gap:clamp(34px,6vh,76px);padding:clamp(128px,19vh,216px) 28px clamp(36px,6vh,64px);
  pointer-events:none;}
.heat-head{max-width:30rem;}
.heat-head .eyebrow{color:var(--saffron);text-shadow:0 1px 6px rgba(0,0,0,.9);margin-bottom:1.5em;}
.heat-head h2{color:var(--cream);max-width:18ch;text-shadow:0 2px 12px rgba(0,0,0,.9),0 1px 3px rgba(0,0,0,.8);}
.heat-head .intro{color:#ece3d6;max-width:44ch;margin-top:.7em;text-shadow:0 1px 8px rgba(0,0,0,.95),0 1px 2px rgba(0,0,0,.85);}

.heat-ui{max-width:460px;}
.heat-control{display:flex;align-items:center;gap:18px;width:100%;}
.heat-end{font-family:"Inter",sans-serif;font-weight:600;font-size:.82rem;white-space:nowrap;letter-spacing:.01em;
  text-shadow:0 1px 4px rgba(0,0,0,.8);}
.heat-end.now{color:#f0c873;}
.heat-end.after{color:#a9e0af;}
.heat-range{-webkit-appearance:none;appearance:none;flex:1;height:8px;border-radius:6px;margin:0;cursor:ew-resize;
  pointer-events:auto;background:linear-gradient(90deg,#ff5a36,#9c3b2e 26%,#e0a52e 56%,#7a8c5e 80%,#3f6a48);
  box-shadow:inset 0 1px 3px rgba(0,0,0,.5),0 1px 0 rgba(255,255,255,.06);}
.heat-range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;
  background:var(--cream);border:3px solid var(--green);box-shadow:0 2px 8px rgba(0,0,0,.6);cursor:ew-resize;}
.heat-range::-moz-range-thumb{width:24px;height:24px;border:3px solid var(--green);border-radius:50%;
  background:var(--cream);box-shadow:0 2px 8px rgba(0,0,0,.6);cursor:ew-resize;}
.heat-range:focus-visible{outline:3px solid var(--saffron);outline-offset:3px;}
.heat-readout{font-family:"Fraunces",serif;font-weight:700;font-size:1.15rem;font-variant-numeric:tabular-nums;
  color:var(--cream);text-align:center;margin:16px 0 0;text-shadow:0 1px 6px rgba(0,0,0,.8);}
.heat-readout span{transition:color .2s ease;}
.heat-foot{font-family:"Inter",sans-serif;font-size:.76rem;color:#cfc1b0;margin:44px 0 0;max-width:46ch;line-height:1.55;
  text-shadow:0 1px 4px rgba(0,0,0,.85);}
.heat-foot em{font-style:italic;color:#e3d6c4;}
.heat-foot .illus{color:#b3a695;}

@media(max-width:860px){
  #traffic-map{min-height:clamp(880px,132vh,1220px);}
  .heat-scrim{background:linear-gradient(180deg,rgba(9,7,6,.92) 0%,rgba(9,7,6,.5) 22%,rgba(9,7,6,.12) 42%,rgba(9,7,6,.12) 66%,rgba(9,7,6,.55) 82%,rgba(9,7,6,.94) 100%);}
  .heat-panel{max-width:none;justify-content:space-between;
    padding:clamp(84px,12vh,112px) 20px clamp(28px,5vh,40px);gap:24px;}
  .heat-head h2{max-width:none;}
  .heat-ui{max-width:none;}
}
@media(max-width:480px){
  .heat-head h2{font-size:1.6rem;}
  .heat-head .intro{font-size:.95rem;}
  .heat-end{font-size:.76rem;}
  .heat-readout{font-size:1.05rem;}
  .heat-foot{font-size:.72rem;}
}

/* On narrow screens stack the name over the clock so the counting time can't
   reflow the (long) row label and make it jump between one and two lines. */
@media(max-width:560px){
  .race-head{flex-direction:column;align-items:flex-start;gap:2px;margin-bottom:10px;}
}
@media(max-width:520px){
  .race{padding:22px 18px;}
  .race-clock{font-size:1.3rem;}
  .race-name{font-size:.86rem;}
}

/* ---------- CTA form & share ---------- */
.cta-grid{display:grid;gap:38px;grid-template-columns:1fr;}
@media(min-width:860px){.cta-grid{grid-template-columns:1.05fr .95fr;gap:60px;align-items:center;}}
.signup{background:rgba(251,246,236,.08);border:1px solid rgba(251,246,236,.18);border-radius:18px;padding:30px;}
.signup-pitch{font-family:"Fraunces",serif;font-size:1.18rem;line-height:1.45;color:var(--cream);margin:0 0 18px;}
.signup-cta{width:100%;justify-content:center;font-size:1.05rem;padding:.95em 1.4em;}
.signup .field{display:grid;gap:12px;}
.signup .row2{display:grid;gap:12px;grid-template-columns:1fr;}
@media(min-width:520px){.signup .row2{grid-template-columns:1fr 1fr;}}
.signup input{
  width:100%;font-family:"Inter",sans-serif;font-size:1rem;
  padding:.82em 1em;border-radius:12px;border:1px solid rgba(251,246,236,.2);
  background:rgba(251,246,236,.96);color:var(--ink);
}
.signup input:focus{outline:2px solid var(--saffron);outline-offset:1px;}
.signup .btn{justify-content:center;}
.signup .fine{font-family:"Inter",sans-serif;font-size:.8rem;color:#bdae9c;margin:14px 0 0;}
.signup .ok{font-family:"Inter",sans-serif;font-size:.95rem;color:#d8e4c2;margin:14px 0 0;display:none;}
.signup.sent .ok{display:block;}
.signup.sent .field,.signup.sent .fine{display:none;}

.share{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.share .btn{font-size:.88rem;padding:.62em 1.05em;}
.contact-line{font-family:"Inter",sans-serif;font-size:1rem;color:#e7ddcf;margin-top:1.4rem;}
.contact-line a{color:#f3c98a;text-decoration-color:rgba(243,201,138,.4);}

/* ---------- Footer ---------- */
footer.site{padding:46px 0;border-top:1px solid var(--line);background:var(--paper);}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:18px;align-items:center;font-family:"Inter",sans-serif;font-size:.86rem;color:var(--ink-soft);}
.foot .wordmark{height:22px;}

/* ---------- Mobile refinements ---------- */
@media(max-width:640px){
  body{font-size:18px;}
  .wrap{padding:0 20px;}
  section{padding:52px 0;}
  .act{padding:44px 0;}
  .hero{padding-top:36px;}
  .hero-grid{gap:24px;}
  .hero h1{font-size:2.5rem;}
  .hero .lead{font-size:1.18rem;}
  .hero-actions{flex-direction:column;align-items:stretch;gap:.6rem;margin-top:1.5rem;}
  .hero-actions .btn{justify-content:center;}
  .section-head{margin-bottom:24px;}
  .section-head h2{font-size:1.85rem;}
  .section-head .intro{font-size:1.05rem;}
  .act .wrap{gap:8px;}
  .act-num{font-size:3rem;}
  .act-def{font-size:1.06rem;}
  .figure{margin-top:26px;}
  .figure figcaption,.cap,.cmp-hint{font-size:.82rem;}
  .cmp-wrap{margin-top:24px;}
  .pull{margin:38px auto 0;}
  .stat{padding:20px;}
  .scale{padding:20px 16px 22px;}
  .scale-badge{width:50px;height:50px;margin-bottom:12px;}
  .scale h3{font-size:1.08rem;min-height:0;}
  .scale .per{min-height:0;margin-top:.35rem;}
  .scale p{margin-top:.55rem;}
  .bars{padding:22px 18px;}
  .bar-row{grid-template-columns:96px 1fr 40px;gap:10px;font-size:.84rem;}
  .signup{padding:24px;}
  .share .btn{flex:1 1 auto;justify-content:center;}
  .nav{gap:.75rem;padding-top:14px;padding-bottom:14px;}
  .nav-cta .btn{white-space:nowrap;padding:.6em 1.1em;font-size:.86rem;}
  .wordmark{height:24px;}
}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}

/* ===================== STORY COLLECTOR (/stories/) ===================== */
.stories-intro{padding:clamp(28px,5vw,56px) 0 clamp(12px,2vw,20px);}
.stories-intro h1{font-size:clamp(2rem,5vw,3rem);margin:.1em 0 0;}
.stories-intro .lead{margin:.6em 0 0;max-width:60ch;color:var(--ink-soft);}
.stories-wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px clamp(48px,7vw,80px);}
.idea-form.stories-form{max-width:560px;margin:0 auto;position:static;}
.story-form-h{font-family:"Fraunces",serif;font-weight:700;font-size:1.2rem;color:var(--ink);margin:0 0 14px;}
.stories-feed{margin-top:clamp(36px,5vw,56px);}
.stories-count{font-family:"Inter",sans-serif;font-weight:600;font-size:.95rem;color:var(--ink-soft);text-align:center;margin:0 0 22px;}
.story-wall{column-gap:20px;column-count:1;}
@media(min-width:760px){.story-wall{column-count:2;}}
/* testimonial-style card: header band (quote mark + topic) -> quote -> attribution */
.story-card{break-inside:avoid;-webkit-column-break-inside:avoid;background:var(--cream);
  border:1px solid var(--paper-edge);border-radius:14px;margin:0 0 20px;box-shadow:var(--shadow);overflow:hidden;}
.story-head{display:flex;align-items:flex-start;gap:9px;padding:13px 20px;border-bottom:1px solid var(--paper-edge);}
.story-qmark{font-family:"Fraunces",serif;font-weight:700;font-size:1.7rem;line-height:.7;color:var(--green);}
.story-topic-h{font-family:"Inter",sans-serif;font-weight:600;font-size:.72rem;text-transform:uppercase;
  letter-spacing:.07em;color:var(--green-deep);padding-top:3px;}
.story-card blockquote{margin:0;padding:16px 20px 4px;font-family:"Fraunces",serif;font-size:1.12rem;
  line-height:1.5;color:var(--ink);}
.story-card figcaption{padding:8px 20px 16px;font-family:"Inter",sans-serif;font-size:.82rem;color:var(--ink-soft);}
.story-by{font-weight:600;color:var(--ink);}
.story-hood{font-weight:400;color:var(--ink-soft);}

/* ===================== COMMUNITY IDEA MAP (/map/) ===================== */
.map-page{background:var(--paper);}
.ideamap-intro{padding:clamp(28px,5vw,52px) 0 clamp(14px,2vw,22px);}
.ideamap-intro h1{font-size:clamp(2rem,5vw,3.2rem);margin:.1em 0 0;}
.ideamap-intro .lead{margin:.6em 0 0;max-width:60ch;color:var(--ink-soft);}

.ideamap-shell{max-width:var(--wrap);margin:0 auto;padding:0 28px clamp(40px,6vw,72px);
  display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(20px,3vw,40px);align-items:start;}
.ideamap{position:relative;z-index:0;border-radius:16px;overflow:hidden;border:1px solid var(--paper-edge);
  box-shadow:var(--shadow);background:#e7e3da;}
.ideamap-canvas{width:100%;height:clamp(440px,68vh,720px);background:#e7e3da;}
.ideamap-hint{position:absolute;left:50%;top:14px;transform:translateX(-50%);z-index:500;pointer-events:none;
  font-family:"Inter",sans-serif;font-size:.82rem;font-weight:600;color:var(--cream);
  background:rgba(12,10,8,.72);backdrop-filter:blur(3px);padding:7px 13px;border-radius:20px;
  box-shadow:0 2px 8px rgba(0,0,0,.4);max-width:88%;text-align:center;transition:background .2s ease, opacity .45s ease;}
.ideamap-hint.warn{background:rgba(156,59,46,.92);}
.ideamap-hint.gone{opacity:0;}
.ideamap-counts{position:absolute;left:12px;bottom:10px;z-index:500;pointer-events:none;
  font-family:"Inter",sans-serif;font-size:.76rem;font-weight:600;color:var(--cream);
  background:rgba(12,10,8,.66);padding:5px 11px;border-radius:14px;}

/* the draggable "drop" pin */
.idea-pin span{display:block;width:18px;height:18px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);
  margin:4px;background:var(--saffron);border:2.5px solid var(--cream);box-shadow:0 3px 6px rgba(0,0,0,.5);}

/* special "I wish this was…" pins — a photo thumbnail marker so they stand out + invite a tap */
.wish-map-pin{position:relative;width:46px;height:46px;border-radius:50%;overflow:visible;cursor:pointer;
  transition:transform .14s ease;}
/* !important: Leaflet's ".leaflet-container .leaflet-marker-pane img{width:auto}" otherwise
   wins on specificity and stretches the photo into an oval */
.wish-map-pin img{width:46px!important;height:46px!important;border-radius:50%;object-fit:cover;display:block;
  box-sizing:border-box;border:3px solid var(--brick);box-shadow:0 3px 9px rgba(0,0,0,.5);background:var(--paper-2);}
.wish-map-pin:hover{transform:scale(1.08);}
.wish-map-badge{position:absolute;right:-3px;bottom:-3px;width:20px;height:20px;border-radius:50%;
  background:var(--brick);color:var(--cream);border:2px solid var(--cream);
  display:flex;align-items:center;justify-content:center;font-size:11px;line-height:1;font-weight:700;}
/* compact (photo-less) wish marker — shown for lower-ranked wish pins in a crowded viewport.
   Both variants live inside ONE marker element; .is-compact on the wrapper picks which shows
   (a CSS toggle, never a DOM swap — swapping nodes mid-tap loses the click to the map). */
.wish-map-dot{display:none;width:30px;height:30px;margin:8px;border-radius:50%;box-sizing:border-box;cursor:pointer;
  background:var(--cream);border:2px solid var(--brick);box-shadow:0 2px 7px rgba(0,0,0,.4);
  align-items:center;justify-content:center;transition:transform .14s ease;}
.wish-map-dot span{color:var(--brick);font-size:15px;line-height:1;font-weight:700;}
.wish-map-dot:hover{transform:scale(1.12);}
.wish-map-pin-wrap.is-compact .wish-map-pin{display:none;}
.wish-map-pin-wrap.is-compact .wish-map-dot{display:flex;}
/* wish popup */
.wish-pop-wrap .leaflet-popup-content-wrapper{border-radius:16px;overflow:hidden;padding:0;box-shadow:0 12px 40px -12px rgba(43,33,28,.55);}
.wish-pop-wrap .leaflet-popup-content{margin:0;width:250px!important;}
.wish-pop-img{width:100%;height:120px;object-fit:cover;display:block;background:var(--paper-2);}
.wish-pop-body{padding:12px 15px 15px;}
.wish-pop-eyebrow{font-family:"Inter",sans-serif;font-size:.68rem;font-weight:600;text-transform:uppercase;
  letter-spacing:.12em;color:var(--brick);}
.wish-pop-title{display:block;font-family:"Fraunces",serif;font-size:1.15rem;line-height:1.2;color:var(--ink);margin:3px 0 0;}
.wish-pop-prompt{font-family:"Inter",sans-serif;font-size:.84rem;color:var(--ink-soft);margin:6px 0 12px;line-height:1.4;}
/* scoped under .leaflet-container so our colors beat Leaflet's ".leaflet-container a" link-blue */
.leaflet-container a.wish-pop-cta{display:inline-flex;align-items:center;gap:6px;font-family:"Inter",sans-serif;
  font-weight:600;font-size:.86rem;color:var(--cream);background:var(--green);border-radius:9px;
  padding:9px 14px;text-decoration:none;}
.leaflet-container a.wish-pop-cta:hover{background:var(--green-deep);color:var(--cream);text-decoration:none;}
/* Leaflet's default popup × sits on the photo — restyle it as a small glass chip */
.wish-pop-wrap a.leaflet-popup-close-button{top:8px;right:8px;width:26px;height:26px;border-radius:50%;
  background:rgba(43,33,28,.55);color:var(--cream);font-size:16px;line-height:26px;text-align:center;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:0;}
.wish-pop-wrap a.leaflet-popup-close-button:hover{background:rgba(43,33,28,.75);color:#fff;}

/* form */
.idea-form{background:var(--cream);border:1px solid var(--paper-edge);border-radius:16px;
  padding:clamp(20px,2.4vw,30px);box-shadow:var(--shadow);position:sticky;top:90px;}
.idea-form-loc{font-family:"Inter",sans-serif;font-size:.85rem;color:var(--ink-soft);margin:0 0 16px;
  padding:10px 12px;border-radius:10px;background:var(--paper-2);border:1px dashed var(--paper-edge);}
.idea-form-loc.set{color:var(--green-deep);border-style:solid;border-color:rgba(63,106,72,.4);background:rgba(63,106,72,.08);}
.idea-field{display:block;margin:0 0 14px;}
.idea-field>span{display:block;font-family:"Inter",sans-serif;font-weight:600;font-size:.82rem;color:var(--ink);margin:0 0 5px;}
.idea-field>span em{font-style:normal;font-weight:400;color:var(--ink-soft);}
.idea-field input,.idea-field select,.idea-field textarea{width:100%;font-family:"Inter",sans-serif;font-size:1rem;
  padding:.7em .85em;border-radius:11px;border:1px solid var(--paper-edge);background:#fff;color:var(--ink);}
.idea-field textarea{resize:vertical;line-height:1.45;}
.idea-field input:focus,.idea-field select:focus,.idea-field textarea:focus{outline:2px solid var(--saffron);outline-offset:1px;border-color:var(--saffron);}
.idea-count{display:block;text-align:right;font-family:"Inter",sans-serif;font-size:.72rem;color:var(--ink-soft);margin-top:3px;}
.idea-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.idea-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.idea-submit{width:100%;justify-content:center;margin-top:4px;}
.idea-submit:disabled{opacity:.5;cursor:not-allowed;}
.idea-note{font-family:"Inter",sans-serif;font-size:.78rem;color:var(--ink-soft);margin:12px 0 0;line-height:1.5;}
.idea-note.ok{color:var(--green-deep);font-weight:600;}
.idea-note.err{color:var(--brick-deep);font-weight:600;}

/* council-comment generator (shown after a successful submit) */
.idea-council{margin-top:18px;padding-top:18px;border-top:1px solid var(--paper-edge);}
.idea-council-h{font-family:"Fraunces",serif;font-weight:700;font-size:1.15rem;color:var(--brick-deep);margin:0;}
.idea-council-p{font-family:"Inter",sans-serif;font-size:.88rem;color:var(--ink-soft);margin:.4em 0 14px;line-height:1.5;}
.idea-council-btn{width:100%;justify-content:center;}
.idea-council-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px;}
.idea-council-row .btn{justify-content:center;}
.idea-council-note{font-family:"Inter",sans-serif;font-size:.74rem;color:var(--ink-soft);margin:12px 0 0;}
@media(max-width:380px){ .idea-council-row{grid-template-columns:1fr;} }

/* optional email ask (shown after submit) */
.idea-email{margin-top:18px;padding-top:18px;border-top:1px solid var(--paper-edge);}
.idea-email-h{font-family:"Fraunces",serif;font-weight:700;font-size:1.15rem;color:var(--green-deep);margin:0;}
.idea-email-p{font-family:"Inter",sans-serif;font-size:.88rem;color:var(--ink-soft);margin:.4em 0 12px;line-height:1.5;}
.idea-email-row{display:flex;gap:8px;}
.idea-email-row input{flex:1;min-width:0;width:100%;font-family:"Inter",sans-serif;font-size:1rem;
  padding:.7em .85em;border-radius:11px;border:1px solid var(--paper-edge);background:#fff;color:var(--ink);}
.idea-email-row input:focus{outline:2px solid var(--saffron);outline-offset:1px;border-color:var(--saffron);}
.idea-email-row .btn{width:auto;white-space:nowrap;}
.idea-email-note{font-family:"Inter",sans-serif;font-size:.74rem;color:var(--ink-soft);margin:10px 0 0;}
.idea-email-skip{background:none;border:0;padding:0;font:inherit;font-size:.74rem;color:var(--green-deep);
  text-decoration:underline;cursor:pointer;}
@media(max-width:380px){ .idea-email-row{flex-direction:column;} .idea-email-row .btn{width:100%;justify-content:center;} }

/* popups */
.idea-pop b{font-family:"Inter",sans-serif;font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;color:var(--green-deep);}
.idea-pop p{font-family:"Fraunces",serif;font-size:1rem;margin:.3em 0 .2em;color:var(--ink);}
.idea-pop span{font-family:"Inter",sans-serif;font-size:.78rem;color:var(--ink-soft);}
.leaflet-popup-content{margin:12px 14px;}
.pop-plus{margin-top:9px;}
.pop-plus-btn,.pop-name-go{font-family:"Inter",sans-serif;font-weight:600;font-size:.8rem;color:#fff;
  background:var(--green);border:0;border-radius:8px;padding:6px 11px;cursor:pointer;}
.pop-plus-btn:hover,.pop-name-go:hover{background:var(--green-deep);}
.pop-voted{font-family:"Inter",sans-serif;font-weight:600;font-size:.82rem;color:var(--green-deep);}
.pop-name{font-family:"Inter",sans-serif;font-size:.85rem;padding:.4em .5em;border:1px solid var(--paper-edge);
  border-radius:7px;width:8.5em;}
.pop-err{display:block;color:var(--brick-deep);font-size:.72rem;margin-top:4px;}
/* +1 / share actions row */
.pop-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:9px;}
.pop-row .pop-plus{margin-top:0;}
.pop-share{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  padding:0;border:1px solid var(--paper-edge);border-radius:8px;background:#fff;color:var(--green-deep);cursor:pointer;}
.pop-share:hover{background:var(--paper-2);}
.pop-share.ok{color:var(--green);border-color:var(--green);}
.pop-share svg{width:16px;height:16px;display:block;}
/* replies in popups */
.pop-replies{margin-top:10px;border-top:1px solid var(--paper-edge);padding-top:8px;}
.pop-reply{margin:0 0 7px;}
.pop-reply p{font-family:"Fraunces",serif;font-size:.92rem;margin:0;color:var(--ink);line-height:1.35;}
.pop-reply span{font-family:"Inter",sans-serif;font-size:.72rem;color:var(--ink-soft);}
.pop-reply-loading{font-family:"Inter",sans-serif;font-size:.74rem;color:var(--ink-soft);margin:0;}
.pop-reply-toggle{font-family:"Inter",sans-serif;font-weight:600;font-size:.78rem;color:var(--green-deep);
  background:none;border:0;padding:4px 0;cursor:pointer;}
.pop-reply-toggle:hover{text-decoration:underline;}
.pop-reply-form{display:flex;flex-direction:column;gap:6px;margin-top:6px;}
.pop-reply-name,.pop-reply-body{font-family:"Inter",sans-serif;font-size:.85rem;padding:.45em .55em;
  border:1px solid var(--paper-edge);border-radius:7px;width:100%;background:#fff;color:var(--ink);}
.pop-reply-body{resize:vertical;line-height:1.4;}
.pop-reply-name:focus,.pop-reply-body:focus{outline:2px solid var(--saffron);outline-offset:1px;border-color:var(--saffron);}
.pop-reply-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.pop-reply-send{font-family:"Inter",sans-serif;font-weight:600;font-size:.8rem;color:#fff;background:var(--green);
  border:0;border-radius:8px;padding:6px 11px;cursor:pointer;}
.pop-reply-send:hover{background:var(--green-deep);}
.pop-reply-send:disabled{opacity:.6;cursor:default;}
.pop-reply-note{font-family:"Inter",sans-serif;font-size:.7rem;color:var(--ink-soft);}
.pop-reply-note.err{color:var(--brick-deep);}
.pop-reply-ok{font-family:"Inter",sans-serif;font-size:.78rem;font-weight:600;color:var(--green-deep);margin:6px 0 0;}

/* mobile bottom sheet — replaces the pin balloon on small screens (JS opens it only there).
   Reuses the .idea-pop / .pop-* content markup verbatim; this is just the container. */
.map-sheet-backdrop{position:fixed;inset:0;z-index:1200;background:rgba(28,22,17,.34);
  opacity:0;pointer-events:none;transition:opacity .25s ease;}
.map-sheet-backdrop.open{opacity:1;pointer-events:auto;}
.map-sheet{position:fixed;left:0;right:0;bottom:0;z-index:1201;background:var(--cream);
  border-radius:18px 18px 0 0;border-top:1px solid var(--paper-edge);
  box-shadow:0 -14px 34px -18px rgba(43,33,28,.55);
  max-height:80vh;display:flex;flex-direction:column;
  transform:translateY(100%);transition:transform .28s cubic-bezier(.32,.72,0,1);
  padding-bottom:env(safe-area-inset-bottom);}
.map-sheet.open{transform:translateY(0);}
/* generous touch targets: a wide invisible grab zone with a small visible bar centred,
   and a 44px close button (Apple's minimum) — the visuals stay subtle, the hit areas don't */
.map-sheet-grab{flex:0 0 auto;width:100%;max-width:170px;height:30px;margin:0 auto;
  display:flex;align-items:center;justify-content:center;cursor:grab;touch-action:none;}
.map-sheet-grab::before{content:"";display:block;width:46px;height:5px;border-radius:3px;background:#d8c8a8;}
.map-sheet-close{position:absolute;top:6px;right:8px;width:44px;height:44px;border:1px solid var(--paper-edge);
  border-radius:50%;background:var(--paper-2);color:var(--ink-soft);font-size:21px;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;z-index:2;}
.map-sheet-close:hover{background:var(--paper-edge);color:var(--ink);}
.map-sheet-body{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  padding:4px 20px 22px;}
.map-sheet-body .idea-pop p{font-size:1.08rem;}
/* iOS Safari force-zooms the page when focusing an input under 16px (it ignores
   maximum-scale). Keep the sheet's reply/name fields at 16px so tapping Reply
   doesn't jerk the whole page in. */
.map-sheet-body .pop-reply-name,
.map-sheet-body .pop-reply-body,
.map-sheet-body .pop-name{font-size:16px;}
/* a wish pin shown in the sheet (its CTA is otherwise styled only inside .leaflet-container) */
.map-sheet-body .wish-pop-img{height:150px;border-radius:12px;}
.map-sheet-body .wish-pop-body{padding:12px 0 2px;}
.map-sheet-body .wish-pop-title{font-size:1.4rem;}
.map-sheet-body .wish-pop-prompt{font-size:.95rem;margin:6px 0 14px;}
.map-sheet-body a.wish-pop-cta{display:inline-flex;align-items:center;gap:6px;font-family:"Inter",sans-serif;
  font-weight:600;font-size:.98rem;color:var(--cream);background:var(--green);border-radius:11px;
  padding:13px 20px;text-decoration:none;}
.map-sheet-body a.wish-pop-cta:hover{background:var(--green-deep);color:var(--cream);text-decoration:none;}
@media(prefers-reduced-motion:reduce){.map-sheet{transition:none;}.map-sheet-backdrop{transition:none;}}
@media(min-width:641px){.map-sheet,.map-sheet-backdrop{display:none!important;}}

/* latest-pins feed below the map */
.idea-feed{padding:6px 0 30px;}
.idea-feed h2{font-family:"Fraunces",serif;font-weight:600;font-size:clamp(1.5rem,3.4vw,2rem);margin:.15em 0 1em;color:var(--ink);}
.feed-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:16px;}
.feed-card{position:relative;background:var(--cream);border:1px solid var(--paper-edge);border-radius:16px;
  padding:18px 18px 16px;box-shadow:0 1px 2px rgba(43,33,28,.05),0 14px 30px -22px rgba(43,33,28,.5);
  display:flex;flex-direction:column;overflow:hidden;}
.feed-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c,var(--green));}
.feed-cat{align-self:flex-start;font-family:"Inter",sans-serif;font-weight:600;font-size:.66rem;text-transform:uppercase;
  letter-spacing:.06em;color:#fff;background:var(--c,var(--green));padding:3px 9px;border-radius:999px;}
.feed-idea{font-family:"Fraunces",serif;font-size:1.08rem;line-height:1.42;color:var(--ink);margin:.6em 0 .55em;}
.feed-who{font-family:"Inter",sans-serif;font-size:.8rem;color:var(--ink-soft);margin:auto 0 0;}
.feed-plus{position:absolute;right:14px;bottom:14px;font-family:"Inter",sans-serif;font-size:.78rem;font-weight:600;color:var(--green-deep);}
.feed-card.has-plus .feed-who{padding-right:46px;}

.ideamap-foot{border-top:1px solid var(--paper-edge);padding:24px 0 40px;}
.ideamap-foot a{color:var(--brick-deep);font-family:"Inter",sans-serif;font-weight:600;font-size:.9rem;text-decoration:none;}
.ideamap-foot a:hover{text-decoration:underline;}
.ideamap-foot .fine{font-family:"Inter",sans-serif;font-size:.74rem;color:var(--ink-soft);margin:.5em 0 0;}

@media(max-width:820px){
  .ideamap-shell{grid-template-columns:1fr;}
  .idea-form{position:static;}
}
@media(max-width:480px){
  .ideamap-shell{padding-left:20px;padding-right:20px;}
  .ideamap-canvas{height:62vh;}
  .idea-row{grid-template-columns:1fr;}
}