/* Little Grove — bloom path. Lane #17 Bloom: Fredoka 600 / Nunito Sans / IBM Plex Mono. */
:root{
  --bg:#fff3e0; --fg:#2d2a32; --muted:#79737f;
  --accent:#ff7a59; --c3:#3db4c4; --c4:#ffd23f;
  --paper:#fffdf8; --sunwash:#ffe9c4; --mint:#e4f2e9;
  --vu:calc(100vw / 1440);
  --d-fredoka:"Fredoka",sans-serif; --d-body:"Nunito Sans",sans-serif; --d-mono:"IBM Plex Mono",monospace;
  --ease-pop:cubic-bezier(.34,1.66,.5,1); --ease-soft:cubic-bezier(.22,1,.36,1);
  --tear-a:polygon(0 22px, 4% 8px, 9% 20px, 15% 4px, 22% 18px, 28% 6px, 35% 16px, 42% 3px, 50% 15px, 57% 5px, 64% 18px, 71% 7px, 78% 17px, 85% 4px, 92% 14px, 100% 8px, 100% calc(100% - 10px), 94% calc(100% - 22px), 87% calc(100% - 8px), 79% calc(100% - 20px), 71% calc(100% - 6px), 62% calc(100% - 18px), 54% calc(100% - 7px), 46% calc(100% - 19px), 38% calc(100% - 5px), 30% calc(100% - 16px), 22% calc(100% - 6px), 14% calc(100% - 18px), 7% calc(100% - 7px), 0 calc(100% - 15px));
  --tear-b:polygon(0 12px, 5% 20px, 11% 5px, 18% 17px, 25% 4px, 31% 19px, 39% 7px, 47% 16px, 54% 3px, 61% 15px, 68% 6px, 76% 19px, 83% 5px, 90% 16px, 96% 6px, 100% 18px, 100% calc(100% - 16px), 95% calc(100% - 5px), 88% calc(100% - 19px), 80% calc(100% - 7px), 72% calc(100% - 17px), 64% calc(100% - 4px), 55% calc(100% - 15px), 47% calc(100% - 6px), 39% calc(100% - 18px), 31% calc(100% - 8px), 23% calc(100% - 17px), 15% calc(100% - 5px), 8% calc(100% - 14px), 0 calc(100% - 8px));
  --tear-top:polygon(0 16px, 4% 7px, 9% 14px, 15% 3px, 22% 12px, 28% 5px, 35% 12px, 42% 2px, 50% 10px, 57% 4px, 64% 13px, 71% 5px, 78% 12px, 85% 3px, 92% 10px, 100% 6px, 100% 100%, 0 100%);
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none !important}
html{scroll-behavior:auto;background:var(--bg)}
body{
  font-family:var(--d-body);color:var(--fg);background:var(--bg);
  font-size:clamp(15px, 14px + 0.35vw, 19px);line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:clip;
}
html.lock{overflow:hidden}
img,video{max-width:100%;display:block}
a{color:inherit}
b{font-weight:800}

.mono{font-family:var(--d-mono);font-weight:500;font-size:clamp(10.5px, 10px + 0.15vw, 13px);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.eyebrow{margin-bottom:1em}
.skip{position:fixed;left:12px;top:-60px;z-index:99;background:var(--fg);color:var(--paper);padding:10px 18px;border-radius:40px;font-weight:700;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}
.announcer{position:fixed;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.defs{position:absolute;width:0;height:0;overflow:hidden}

/* ————— paper grain (one fixed feTurbulence layer) ————— */
body::after{content:"";position:fixed;inset:0;z-index:80;pointer-events:none;opacity:.075;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)'/%3E%3C/svg%3E");background-size:260px 260px}

/* ————— colour-block washes: torn construction-paper sheets on the cream page ————— */
.ch{isolation:isolate}
.wash::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
.w-butter::before{background:#ffe5b4;clip-path:var(--tear-a)}
.w-mint::before{background:var(--mint);clip-path:var(--tear-b)}
.w-coral::before{background:var(--accent);clip-path:var(--tear-top)}

/* ————— ghost chapter numerals (crayon outline) ————— */
.ghostnum{position:absolute;z-index:0;font-family:var(--d-fredoka);font-weight:600;line-height:.8;color:transparent;-webkit-text-stroke:3px color-mix(in srgb, var(--gh, var(--fg)) 42%, transparent);pointer-events:none;user-select:none;font-size:120px;right:14px;top:10px}
.ch02 .ghostnum{--gh:var(--accent)}
.ch03 .ghostnum{--gh:var(--c3)}
.ch04 .ghostnum{--gh:#e8a800}
.ch05 .ghostnum{--gh:var(--accent)}

/* ————— crayon doodles ————— */
.doodles{position:absolute;inset:0;pointer-events:none;z-index:0;display:none}
.dd{position:absolute;width:44px;height:44px;color:var(--accent);opacity:.55}

/* ————— marker swipe ————— */
.hl{background:linear-gradient(100deg, transparent 0 2%, color-mix(in srgb, var(--c4) 62%, transparent) 6% 94%, transparent 98%);padding:.03em .12em;margin:0 -.04em;border-radius:.16em;color:inherit;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hl-coral{background:linear-gradient(97deg, transparent 0 2%, color-mix(in srgb, var(--accent) 34%, transparent) 5% 95%, transparent 98%)}

/* ————— chrome ————— */
.chrome{position:fixed;inset:0 0 auto 0;z-index:40;display:flex;justify-content:space-between;align-items:center;padding:14px clamp(16px,2.5vw,36px) 34px;pointer-events:none;background:linear-gradient(180deg, var(--bg) 50%, color-mix(in srgb, var(--bg) 55%, transparent) 80%, transparent)}
.chrome>*,.chrome-right>*{pointer-events:auto}
.wordmark{font-family:var(--d-fredoka);font-weight:600;font-size:clamp(19px,1.6vw,24px);letter-spacing:-.01em;text-decoration:none;color:var(--fg)}
.wordmark span{color:var(--accent)}
.chrome-right{display:flex;align-items:center;gap:14px}
.sprout-marker{display:flex;align-items:center;gap:7px;font-family:var(--d-mono);font-size:11px;letter-spacing:.12em;color:var(--fg);background:color-mix(in srgb, var(--paper) 82%, transparent);border:2px solid var(--fg);border-radius:40px;padding:6px 12px}
.sprout-glyph{width:14px;height:19px}
.sprout-glyph path{stroke:var(--fg);stroke-width:2.4;stroke-linecap:round}
.pill{font-family:var(--d-body);font-weight:700;font-size:clamp(13px,1vw,15px);border:2px solid var(--fg);border-radius:40px;padding:8px 18px;background:var(--c4);color:var(--fg);cursor:pointer;transition:transform .25s var(--ease-pop),background .2s}
.pill:hover{transform:rotate(-1.5deg) scale(1.04);background:var(--accent);color:var(--paper)}
.pill:focus-visible,.btn:focus-visible,.ovl-x:focus-visible,.idx a:focus-visible,a:focus-visible{outline:3px solid var(--c3);outline-offset:3px;border-radius:6px}
.pill:focus-visible{border-radius:40px}

/* ————— buttons ————— */
.btn{display:inline-block;font-family:var(--d-body);font-weight:700;font-size:clamp(14px,1.05vw,16px);color:var(--fg);background:transparent;border:2px solid var(--fg);border-radius:40px;padding:.72em 1.5em;text-decoration:none;cursor:pointer;transition:transform .3s var(--ease-pop),background .2s,color .2s}
.btn:hover{transform:translateY(-2px) rotate(-.6deg);background:var(--fg);color:var(--paper)}
.btn-solid{background:var(--accent);border-color:var(--fg);color:var(--fg)}
.btn-solid:hover{background:var(--fg);color:var(--paper)}

/* ————— vine layers ————— */
.vine-layer{position:absolute;inset:0;pointer-events:none;z-index:2}
#vineD,#vineM{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
#vineM{top:110px;height:calc(100% - 110px)}
#vine{stroke:var(--fg);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round}
#vineD.lerping #vine{will-change:stroke-dashoffset}
#vineM path{stroke:var(--fg);stroke-width:3;stroke-linecap:round;opacity:.6}
#tip{opacity:0;transition:opacity .3s}
#vineD.alive #tip{opacity:1}
.tip-bud{fill:var(--accent)}
.tip-glow{fill:var(--accent);opacity:.28;animation:budpulse 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes budpulse{0%,100%{transform:scale(1);opacity:.28}50%{transform:scale(1.06);opacity:.42}}
#tipTrail{display:none}

/* blooms: outer g = position (attribute transform), inner = spring scale via CSS.
   v2: --bs per bloom scales clusters 2-3x; ink outlines make petals read drawn. */
.bloom-inner{transform:scale(0);transform-box:fill-box;transform-origin:center;transition:transform .45s var(--ease-pop)}
.bloom.open .bloom-inner{transform:scale(var(--bs,1))}
.b-coral,.b-teal,.b-sun,.b-ink{--bs:2.15}
.b-leaf{--bs:2.4}
.b-final{--bs:1.55}
.b-s1{--bs:2.5}
.b-s2{--bs:2.2}
#vineD .pt,#vineD .leaf{stroke:var(--fg);stroke-width:1.5}
#vineD .disc{stroke:var(--fg);stroke-width:1.3}
/* spark confetti: fires once per open, transform/opacity only */
.spark{opacity:0;transform-box:fill-box;transform-origin:center;fill:var(--accent)}
.spark.k2,.spark.k6{fill:var(--c4)}
.spark.k4{fill:var(--c3)}
.spark.k3{fill:var(--fg)}
.bloom.open .spark{animation:sparkfly .85s var(--ease-soft) forwards}
.bloom.open .k2{animation-delay:60ms}
.bloom.open .k3{animation-delay:110ms}
.bloom.open .k4{animation-delay:40ms}
.bloom.open .k5{animation-delay:150ms}
.bloom.open .k6{animation-delay:90ms}
.k1{--sx:-74px;--sy:-62px}
.k2{--sx:70px;--sy:-54px}
.k3{--sx:-60px;--sy:68px}
.k4{--sx:82px;--sy:44px}
.k5{--sx:-92px;--sy:-4px}
.k6{--sx:24px;--sy:-92px}
@keyframes sparkfly{0%{transform:translate(0,0) scale(.2);opacity:0}18%{opacity:.95}100%{transform:translate(var(--sx),var(--sy)) scale(1);opacity:0}}
.bloom .pt,.bloom .leaf{transform-box:fill-box;transform-origin:center;transition:transform .4s var(--ease-pop);transform:scale(0)}
.bloom.open .pt,.bloom.open .leaf{transform:scale(1)}
.bloom.open .pt:nth-of-type(2){transition-delay:40ms}
.bloom.open .pt:nth-of-type(3){transition-delay:80ms}
.bloom.open .pt:nth-of-type(4){transition-delay:120ms}
.bloom.open .pt:nth-of-type(5){transition-delay:160ms}
.bloom.open .pt:nth-of-type(6){transition-delay:200ms}
.bloom.open .pt2{transition-delay:240ms}
.bloom.open .leaf{transition-delay:20ms}
.bloom .disc{transition:transform .3s var(--ease-pop) .18s;transform:scale(0);transform-box:fill-box;transform-origin:center}
.bloom.open .disc{transform:scale(1)}
.b-coral .pt{fill:var(--accent)}   .b-coral .disc{fill:var(--c4)}   .b-coral .leaf{fill:var(--c3)}
.b-teal .pt{fill:var(--c3)}        .b-teal .disc{fill:var(--fg)}    .b-teal .leaf{fill:var(--c4)}
.b-sun .pt{fill:var(--c4)}         .b-sun .disc{fill:var(--fg)}     .b-sun .leaf{fill:var(--c3)}
.b-ink .pt{fill:color-mix(in srgb, var(--accent) 70%, var(--c4))}  .b-ink .disc{fill:var(--fg)}     .b-ink .leaf{fill:var(--c3)}
.b-leaf .leaf{fill:var(--c3)}      .b-leaf .disc{fill:var(--fg)}
.b-s1 .pt{fill:var(--accent)}      .b-s1 .pt2{fill:var(--c4)}       .b-s1 .disc{fill:var(--fg)}     .b-s1 .leaf{fill:var(--c3)}
.b-s2 .pt{fill:var(--accent)}      .b-s2 .pt2{fill:var(--c4)}       .b-s2 .disc{fill:var(--fg)}     .b-s2 .leaf{fill:var(--c3)}
/* final flower lives on the coral inversion — paper petals + sun heart pop on coral */
.b-final .pt{fill:var(--paper)}    .b-final .pt2{fill:var(--c4)}    .b-final .disc{fill:var(--fg)}  .b-final .leaf{fill:var(--c3)}
.b-final .spark{fill:var(--paper)} .b-final .spark.k2,.b-final .spark.k6{fill:var(--c4)} .b-final .spark.k3{fill:var(--fg)} .b-final .spark.k4{fill:var(--fg)}
.b-coral-f ellipse{fill:var(--accent)} .b-coral-f .disc{fill:var(--c4)}
.b-teal-f ellipse{fill:var(--c3)}      .b-teal-f .disc{fill:var(--fg)}
.b-sun-f ellipse{fill:var(--c4)}       .b-sun-f .disc{fill:var(--fg)}
.b-ink-f ellipse{fill:color-mix(in srgb, var(--accent) 70%, var(--c4))}  .b-ink-f .disc{fill:var(--fg)}
#vineM .bloom-inner,#vineM .pt,#vineM .leaf,#vineM .disc,#vineM ellipse{transform:none;transition:none}
#vineM .pt,#vineM .leaf,#vineM ellipse{stroke:var(--fg);stroke-width:.9}
/* mobile final flower sits on the coral wash too — same paper recolour via .b-final */

/* ————— shared content ————— */
.ch{position:relative;padding:64px 18px 64px 50px}
main{position:relative}
.mast{font-family:var(--d-fredoka);font-weight:600;letter-spacing:-.01em;line-height:1.02;font-size:clamp(44px, 9.7vw, 150px);max-width:9ch}
.h2{font-family:var(--d-fredoka);font-weight:600;letter-spacing:-.01em;line-height:1.04;font-size:clamp(34px, 5.3vw, 78px)}
.h2s{font-family:var(--d-fredoka);font-weight:600;letter-spacing:-.01em;font-size:clamp(30px, 2.9vw, 42px);line-height:1.05}
.media{position:relative;border-radius:24px;overflow:hidden;border:2px solid var(--fg)}
.media img{width:100%;height:100%;object-fit:cover}
.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s}
.media video.on{opacity:1}
.media figcaption{position:absolute;left:12px;bottom:12px;background:color-mix(in srgb, var(--paper) 88%, transparent);color:var(--fg);padding:5px 12px;border-radius:40px;border:1.5px solid var(--fg);font-size:10px}
/* word rise */
.ltw .w{display:inline-block;overflow:clip;vertical-align:bottom}
.ltw .wi{display:inline-block;transform:translateY(112%);transition:transform .7s var(--ease-soft)}
.ltw.in .wi{transform:translateY(0)}
.ltw .w:nth-child(2) .wi{transition-delay:60ms}.ltw .w:nth-child(3) .wi{transition-delay:120ms}.ltw .w:nth-child(4) .wi{transition-delay:180ms}.ltw .w:nth-child(5) .wi{transition-delay:240ms}.ltw .w:nth-child(6) .wi{transition-delay:300ms}.ltw .w:nth-child(7) .wi{transition-delay:360ms}
/* counts */
.counts{display:grid;gap:28px}
.num{font-family:var(--d-fredoka);font-weight:600;font-size:clamp(56px,6.5vw,96px);font-variant-numeric:tabular-nums;line-height:1}
.count{display:flex;flex-direction:column-reverse;gap:10px}
.count dt{margin-bottom:0}
.c-mid .num{color:var(--accent)}

/* ————— gate ————— */
.ch00{background:linear-gradient(178deg, var(--sunwash) 0%, var(--bg) 46%)}
.gate-sub{max-width:44ch;margin:1.4em 0;font-size:clamp(16px,1.25vw,20px)}
.gate-cta{display:flex;gap:14px;flex-wrap:wrap;margin:1.2em 0 2em}
.scroll-cue{margin-top:2.2em;color:var(--fg)}
.gate-media{aspect-ratio:16/10}

/* ————— manifesto ————— */
.manifesto p{max-width:56ch;margin-bottom:1.1em}
.keyline{font-family:var(--d-fredoka);font-weight:600;font-size:clamp(22px,2.4vw,35px);line-height:1.25;margin:1.2em 0;max-width:24ch}
.keyline em{font-style:normal;color:var(--accent)}
/* taped photos: prints pinned to the page */
.taped{overflow:visible;border:none;border-radius:0}
.taped img{border:2px solid var(--fg);border-radius:24px;height:100%;object-fit:cover}
.taped::before,.taped::after{content:"";position:absolute;z-index:3;width:112px;height:28px;top:10px;opacity:.9;background:color-mix(in srgb, var(--c4) 82%, #fff);clip-path:polygon(2% 0, 98% 0, 100% 16%, 98% 42%, 100% 70%, 97% 100%, 3% 100%, 0 82%, 2% 52%, 0 20%)}
.taped::before{left:-26px;transform:rotate(-45deg)}
.taped::after{right:-26px;transform:rotate(45deg)}
.side-photo{aspect-ratio:3/2;max-width:520px;transform:rotate(1.2deg)}
.scrap-photo{aspect-ratio:16/13;max-width:340px;transform:rotate(-1.6deg)}
.scrap-photo::before,.scrap-photo::after{background:color-mix(in srgb, var(--c3) 52%, #fff)}
/* v2b seam polaroids: snapshots pinned across the chapter tears (fill the runway) */
.seam-photo{max-width:330px;margin:2.2em auto 0;transform:rotate(-2.2deg)}
.sp-a{aspect-ratio:3/2}
.sp-b{aspect-ratio:1/0.97;transform:rotate(2deg)}
.sp-b::before,.sp-b::after{background:color-mix(in srgb, var(--accent) 56%, #fff)}

/* ————— programmes ————— */
.pcard{position:relative;background:var(--paper);border:2px solid var(--fg);border-radius:28px;box-shadow:7px 9px 0 color-mix(in srgb, var(--fg) 14%, transparent);transition:transform .45s var(--ease-pop),box-shadow .3s;transform:rotate(var(--tilt,0deg))}
.pcard-media{aspect-ratio:16/9;overflow:hidden;border-bottom:2px solid var(--fg);border-radius:26px 26px 0 0}
.pcard-media img{width:100%;height:100%;object-fit:cover}
/* washi tape crossing the top corners (scrapbook: card taped to the page) */
.pcard::before,.pcard::after{content:"";position:absolute;z-index:3;width:112px;height:28px;top:10px;opacity:.9;background:var(--tape,color-mix(in srgb, var(--c4) 82%, #fff));clip-path:polygon(2% 0, 98% 0, 100% 16%, 98% 42%, 100% 70%, 97% 100%, 3% 100%, 0 82%, 2% 52%, 0 20%)}
.pcard::before{left:-26px;transform:rotate(-45deg)}
.pcard::after{right:-26px;transform:rotate(45deg)}
.pc-coral{--tape:color-mix(in srgb, var(--c4) 82%, #fff)}
.pc-teal{--tape:color-mix(in srgb, var(--accent) 62%, #fff)}
.pc-sun{--tape:color-mix(in srgb, var(--c3) 58%, #fff)}
.pc-ink{--tape:color-mix(in srgb, var(--c4) 82%, #fff)}
.pcard-body{padding:26px 26px 30px}
.pcard .eyebrow{margin-bottom:.8em}
.pmeta{color:var(--fg);margin:.7em 0 1em;display:inline-block;padding:6px 12px;border:1.5px solid var(--fg);border-radius:40px;background:var(--bg)}
.pdesc{max-width:46ch;margin-bottom:1.4em}
.pc-coral .pmeta{background:color-mix(in srgb, var(--accent) 18%, var(--paper))}
.pc-teal .pmeta{background:color-mix(in srgb, var(--c3) 18%, var(--paper))}
.pc-sun .pmeta{background:color-mix(in srgb, var(--c4) 30%, var(--paper))}
.pc-ink .pmeta{background:color-mix(in srgb, var(--fg) 8%, var(--paper))}

/* ————— grove ————— */
.gr-intro{max-width:40ch;margin:1em 0 1.6em}
.gr-a figcaption{left:14px;right:auto}
.mat{display:none;color:var(--muted);letter-spacing:.22em}
.gr-a,.gr-b,.gr-c{margin-bottom:18px}
.gr-a{aspect-ratio:4/3}
.gr-b{aspect-ratio:16/9}
.gr-c{aspect-ratio:3/2}
.trust{background:var(--paper);border:2px solid var(--fg);border-radius:24px;padding:22px 24px;box-shadow:7px 9px 0 color-mix(in srgb, var(--fg) 14%, transparent)}
.trust-h{color:var(--fg);margin-bottom:1em}
.trust ul{list-style:none}
.trust li{padding:.55em 0;border-top:1.5px dashed color-mix(in srgb, var(--fg) 30%, transparent);letter-spacing:.06em;line-height:1.75}
.trust li:first-child{border-top:0}
.trust b{color:var(--accent);font-weight:500;margin-right:.5em}

/* ————— seasons ————— */
.seasons{list-style:none;display:grid;gap:16px;margin:1.6em 0}
.scard{background:var(--paper);border:2px solid var(--fg);border-radius:24px;padding:22px;transition:transform .4s var(--ease-pop);transform:rotate(var(--st,0deg));box-shadow:4px 6px 0 color-mix(in srgb, var(--fg) 10%, transparent)}
.scard:nth-child(1){--st:-1.1deg}
.scard:nth-child(2){--st:.7deg}
.scard:nth-child(3){--st:-.6deg}
.scard:nth-child(4){--st:1.1deg}
.scard:hover{transform:rotate(calc(var(--st,0deg) - .6deg)) translateY(-3px)}
.scard h3{font-family:var(--d-fredoka);font-weight:600;font-size:clamp(24px,2vw,30px);margin:.35em 0 .3em}
.scard p{font-size:.92em}
.scard .st{color:var(--accent);white-space:nowrap;letter-spacing:.1em}
.scard:nth-child(2) .st{color:var(--c3)}
.scard:nth-child(3) .st{color:color-mix(in srgb, var(--c4) 60%, var(--fg))}
.scard:nth-child(4) .st{color:var(--muted)}

/* ————— enrol / footer (ch08 = the coral inversion, the page's one loud moment) ————— */
.ch08{color:var(--fg)}
.ch08 .en-eb{color:color-mix(in srgb, var(--paper) 72%, var(--accent))}
.ch08 .en-h{color:var(--paper);text-shadow:0 3px 0 color-mix(in srgb, var(--fg) 22%, transparent)}
.ch08 .dd{color:var(--paper);opacity:.6}
.ch08 .foot{border-color:color-mix(in srgb, var(--fg) 65%, var(--accent))}
.ch08 .foot-credit{color:color-mix(in srgb, var(--fg) 78%, var(--accent))}
.cta-card{background:var(--paper);border:2px solid var(--fg);border-radius:28px;padding:clamp(24px,3vw,48px);box-shadow:8px 10px 0 color-mix(in srgb, var(--fg) 30%, transparent);max-width:640px}
.cta-lead{font-size:clamp(17px,1.4vw,21px);max-width:34ch;margin-bottom:1.2em}
.cta-btns{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:1.6em}
.cta-addr{font-style:normal;line-height:2}
.foot{margin-top:70px;display:flex;flex-direction:column;gap:8px;border-top:2px solid var(--fg);padding-top:26px}
.foot-mark{font-family:var(--d-fredoka);font-weight:600;font-size:22px}
.foot a{color:var(--fg)}

/* ————— overlays ————— */
.ovl{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:18px;background:color-mix(in srgb, var(--fg) 42%, transparent)}
.ovl-panel{position:relative;background:var(--paper);border:2.5px solid var(--fg);border-radius:28px;padding:clamp(24px,3.4vw,52px);max-width:660px;width:100%;max-height:86svh;overflow:auto;box-shadow:10px 12px 0 color-mix(in srgb, var(--fg) 20%, transparent)}
.op-coral{border-color:var(--fg);background:linear-gradient(160deg, color-mix(in srgb, var(--accent) 10%, var(--paper)), var(--paper) 55%)}
.op-teal{background:linear-gradient(160deg, color-mix(in srgb, var(--c3) 12%, var(--paper)), var(--paper) 55%)}
.op-sun{background:linear-gradient(160deg, color-mix(in srgb, var(--c4) 20%, var(--paper)), var(--paper) 55%)}
.op-ink{background:linear-gradient(160deg, color-mix(in srgb, var(--fg) 7%, var(--paper)), var(--paper) 55%)}
.ovl-panel h2{font-family:var(--d-fredoka);font-weight:600;font-size:clamp(28px,3vw,44px);margin:.2em 0 .8em;letter-spacing:-.01em}
.ovl-panel h3{margin:1.4em 0 .5em;color:var(--fg)}
.ovl-panel>p{max-width:52ch}
.ovl-x{position:absolute;top:16px;right:16px;width:44px;height:44px;border-radius:40px;border:2px solid var(--fg);background:var(--paper);font-size:24px;font-weight:700;cursor:pointer;line-height:1;transition:transform .3s var(--ease-pop),background .2s;color:var(--fg)}
.ovl-x:hover{transform:rotate(90deg);background:var(--c4)}
.ovl-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;margin:1.2em 0}
.ovl-grid dt{color:var(--muted);font-size:10px;margin-bottom:3px}
.ovl-grid dd{color:var(--fg);font-size:12px;letter-spacing:.1em}
.ovl-panel .btn{margin-top:1.4em}
.trial-table{width:100%;border-collapse:collapse;margin:1em 0}
.trial-table th{text-align:left;font-weight:500;color:var(--muted);font-size:10px;padding:8px 10px;border-bottom:2px solid var(--fg)}
.trial-table td{padding:12px 10px;border-bottom:1.5px dashed color-mix(in srgb, var(--fg) 28%, transparent);font-weight:700}
.trial-table td.mono{font-weight:500}
.ovl-note{color:var(--muted);font-size:.92em;max-width:48ch}
.ovl-addr{margin-top:1.6em}
/* index overlay */
.op-index{max-width:880px;display:grid;grid-template-columns:1fr;gap:8px}
.idx{display:flex;flex-direction:column;margin-top:.6em}
.idx a{display:flex;align-items:center;gap:18px;padding:.62em 10px;text-decoration:none;font-family:var(--d-fredoka);font-weight:600;font-size:clamp(20px,2.2vw,30px);border-radius:16px;border-bottom:1.5px dashed color-mix(in srgb, var(--fg) 25%, transparent);position:relative;transition:background .2s,transform .3s var(--ease-pop)}
.idx a .mono{color:var(--muted);font-size:11px}
.idx a::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--accent);margin-left:auto;transform:scale(0);transition:transform .35s var(--ease-pop)}
.idx a:hover{background:color-mix(in srgb, var(--c4) 26%, transparent);transform:translateX(6px)}
.idx a:hover::after{transform:scale(1)}
.idx-pv{display:none}

/* ————— mobile vine gutter ————— */
#vineD{display:none}
.gate-media,.gr-b{position:relative}

/* ═════════ DESKTOP STAGE (≥1000px, motion ok) ═════════ */
@media (min-width:1000px) and (prefers-reduced-motion: no-preference){
  #vineD{display:block}
  #vineM{display:none}
  body{overflow-x:hidden}
  main{height:calc(var(--vu) * 10780)}
  .ch{position:absolute;left:0;right:0;padding:0}
  .ch>*{position:absolute}
  /* chapter stages (y in vu units, matching the vine viewBox).
     v2b: dead runway cut — stage ≈ content + ≤190vu tail, so no bare viewport ever. */
  .ch00{top:0;height:calc(var(--vu) * 1250)}
  .ch01{top:calc(var(--vu) * 1250);height:calc(var(--vu) * 1360)}
  .ch02{top:calc(var(--vu) * 2610);height:calc(var(--vu) * 1030)}
  .ch03{top:calc(var(--vu) * 3640);height:calc(var(--vu) * 1030)}
  .ch04{top:calc(var(--vu) * 4670);height:calc(var(--vu) * 1030)}
  .ch05{top:calc(var(--vu) * 5700);height:calc(var(--vu) * 1030)}
  .ch06{top:calc(var(--vu) * 6730);height:calc(var(--vu) * 1620)}
  .ch07{top:calc(var(--vu) * 8350);height:calc(var(--vu) * 1330)}
  .ch08{top:calc(var(--vu) * 9680);height:calc(var(--vu) * 1100)}
  /* 00 gate */
  .ch00 .eyebrow{left:calc(var(--vu) * 150);top:calc(var(--vu) * 250)}
  .ch00 .mast{left:calc(var(--vu) * 148);top:calc(var(--vu) * 312);max-width:calc(var(--vu) * 620);font-size:calc(var(--vu) * 104);line-height:1.06}
  .gate-sub{left:calc(var(--vu) * 150);top:calc(var(--vu) * 878);max-width:calc(var(--vu) * 500);margin:0}
  .gate-cta{left:calc(var(--vu) * 150);top:calc(var(--vu) * 1030);margin:0}
  .gate-media{left:calc(var(--vu) * 812);top:calc(var(--vu) * 356);width:calc(var(--vu) * 478);height:calc(var(--vu) * 560);aspect-ratio:auto;border-radius:calc(var(--vu) * 26)}
  .scroll-cue{left:50%;transform:translateX(-50%);top:calc(var(--vu) * 1168);margin:0}
  /* 01 grow */
  .ch01 .eyebrow{left:calc(var(--vu) * 150);top:calc(var(--vu) * 170)}
  .ch01 .h2{left:calc(var(--vu) * 148);top:calc(var(--vu) * 224);max-width:calc(var(--vu) * 760);font-size:calc(var(--vu) * 92)}
  .manifesto{left:calc(var(--vu) * 150);top:calc(var(--vu) * 438);max-width:calc(var(--vu) * 600)}
  .manifesto p{max-width:none}
  .keyline{left:calc(var(--vu) * 170);top:calc(var(--vu) * 700);max-width:calc(var(--vu) * 640);margin:0;font-size:calc(var(--vu) * 40)}
  .side-photo{left:calc(var(--vu) * 900);top:calc(var(--vu) * 310);width:calc(var(--vu) * 356);height:calc(var(--vu) * 600);max-width:none;aspect-ratio:auto}
  .scrap-photo{left:calc(var(--vu) * 170);top:calc(var(--vu) * 986);width:calc(var(--vu) * 320);height:calc(var(--vu) * 300);max-width:none;aspect-ratio:auto}
  /* programmes: card + vine alternation, slight scrapbook tilts */
  .prog .pcard{width:calc(var(--vu) * 560);top:calc(var(--vu) * 150)}
  .ch02 .pcard,.ch04 .pcard{left:calc(var(--vu) * 140)}
  .ch03 .pcard,.ch05 .pcard{left:calc(var(--vu) * 740)}
  .ch02 .pcard{--tilt:-1.4deg}
  .ch03 .pcard{--tilt:1deg}
  .ch04 .pcard{--tilt:-1deg}
  .ch05 .pcard{--tilt:1.2deg}
  .prog .pcard:hover{transform:rotate(calc(var(--tilt,0deg) - .5deg)) translateY(-4px);box-shadow:10px 13px 0 color-mix(in srgb, var(--fg) 18%, transparent)}
  .pcard-media{height:calc(var(--vu) * 360);aspect-ratio:auto;border-radius:calc(var(--vu) * 26) calc(var(--vu) * 26) 0 0}
  .pcard-body{padding:calc(var(--vu) * 24) calc(var(--vu) * 30) calc(var(--vu) * 30)}
  .h2s{font-size:calc(var(--vu) * 52)}
  .pcard::before,.pcard::after{width:calc(var(--vu) * 132);height:calc(var(--vu) * 32);top:calc(var(--vu) * 12)}
  .pcard::before{left:calc(var(--vu) * -32)}
  .pcard::after{right:calc(var(--vu) * -32)}
  .mat{display:block}
  /* seam polaroids straddle the torn edges, clear of vine dives and card corners */
  .sp-a{left:calc(var(--vu) * 170);top:calc(var(--vu) * -10);width:calc(var(--vu) * 350);height:calc(var(--vu) * 250);max-width:none;margin:0;aspect-ratio:auto;transform:rotate(-2.4deg)}
  .sp-b{left:calc(var(--vu) * 950);top:calc(var(--vu) * 520);width:calc(var(--vu) * 300);height:calc(var(--vu) * 250);max-width:none;margin:0;aspect-ratio:auto;transform:rotate(2.2deg)}
  .sp-c{left:calc(var(--vu) * 700);top:calc(var(--vu) * 1050);width:calc(var(--vu) * 250);height:calc(var(--vu) * 200);max-width:none;margin:0;aspect-ratio:auto;transform:rotate(1.8deg)}
  .ch02 .mat{left:calc(var(--vu) * 880);top:calc(var(--vu) * 672);transform:rotate(-4deg)}
  .ch03 .mat{left:calc(var(--vu) * 330);top:calc(var(--vu) * 682);transform:rotate(3deg)}
  .ch04 .mat{left:calc(var(--vu) * 170);top:calc(var(--vu) * 900);transform:rotate(-3deg)}
  .ch05 .mat{left:calc(var(--vu) * 520);top:calc(var(--vu) * -42);transform:rotate(3deg)}
  /* ghost numerals fill the vine's stage */
  .ghostnum{font-size:calc(var(--vu) * 430);-webkit-text-stroke-width:calc(var(--vu) * 4);right:auto;top:auto}
  .ch02 .ghostnum{left:calc(var(--vu) * 800);top:calc(var(--vu) * 300);transform:rotate(-5deg)}
  .ch03 .ghostnum{left:calc(var(--vu) * 140);top:calc(var(--vu) * 300);transform:rotate(4deg)}
  .ch04 .ghostnum{left:calc(var(--vu) * 800);top:calc(var(--vu) * 320);transform:rotate(3deg)}
  .ch05 .ghostnum{left:calc(var(--vu) * 150);top:calc(var(--vu) * 290);transform:rotate(-4deg)}
  /* doodles: paper-scrap accents in the empty air (desktop only) */
  .doodles{display:block;inset:0;left:0;top:0}
  .dd{width:calc(var(--vu) * 54);height:calc(var(--vu) * 54);opacity:.62}
  .ch00 .d1{left:54%;top:62%;color:var(--accent);transform:rotate(14deg)}
  .ch00 .d2{left:8%;top:88%;color:var(--c3);transform:rotate(-10deg);opacity:.45}
  .ch00 .d3{left:93%;top:74%;color:#e8a800;transform:rotate(8deg)}
  .ch01 .d1{left:56%;top:24%;color:var(--accent);transform:rotate(-8deg)}
  .ch01 .d2{left:16%;top:78%;color:#e8a800;transform:rotate(12deg)}
  .ch01 .d3{left:64%;top:66%;color:var(--c3);transform:rotate(-14deg);opacity:.5}
  .ch01 .d4{left:30%;top:65%;color:var(--accent);transform:rotate(9deg)}
  .ch02 .d1{left:88%;top:12%;color:var(--c3);transform:rotate(10deg)}
  .ch02 .d2{left:80%;top:60%;color:var(--accent);transform:rotate(-12deg)}
  .ch03 .d1{left:20%;top:68%;color:var(--accent);transform:rotate(9deg)}
  .ch03 .d2{left:9%;top:12%;color:#2f9aa8;transform:rotate(-11deg)}
  .ch04 .d1{left:88%;top:14%;color:var(--c3);transform:rotate(-9deg)}
  .ch04 .d2{left:57%;top:68%;color:#e8a800;transform:rotate(13deg)}
  .ch05 .d1{left:30%;top:58%;color:var(--accent);transform:rotate(-10deg)}
  .ch05 .d2{left:15%;top:66%;color:var(--c3);transform:rotate(12deg)}
  .ch06 .d1{left:58%;top:16%;color:var(--accent);transform:rotate(11deg)}
  .ch06 .d2{left:10%;top:64%;color:#2f9aa8;transform:rotate(-9deg)}
  .ch07 .d1{left:12%;top:52%;color:var(--accent);transform:rotate(-12deg)}
  .ch07 .d2{left:88%;top:55%;color:#e8a800;transform:rotate(9deg)}
  .ch07 .d3{left:48%;top:60%;color:var(--accent);transform:rotate(-8deg)}
  .ch07 .d4{left:68%;top:84%;color:var(--c3);transform:rotate(12deg)}
  .ch08 .d1{left:16%;top:24%;transform:rotate(12deg)}
  .ch08 .d2{left:80%;top:30%;transform:rotate(-9deg)}
  .ch08 .d3{left:22%;top:62%;transform:rotate(-14deg)}
  .ch08 .d4{left:78%;top:60%;transform:rotate(10deg)}
  /* 06 grove */
  .gr-eb{left:calc(var(--vu) * 880);top:calc(var(--vu) * 96)}
  .gr-h{left:calc(var(--vu) * 878);top:calc(var(--vu) * 148);max-width:calc(var(--vu) * 440);font-size:calc(var(--vu) * 84)}
  .gr-intro{left:calc(var(--vu) * 880);top:calc(var(--vu) * 356);max-width:calc(var(--vu) * 390);margin:0}
  .gr-a{left:calc(var(--vu) * 170);top:calc(var(--vu) * 200);width:calc(var(--vu) * 570);height:calc(var(--vu) * 800);margin:0;aspect-ratio:auto}
  .gr-b{left:calc(var(--vu) * 880);top:calc(var(--vu) * 560);width:calc(var(--vu) * 400);height:calc(var(--vu) * 300);margin:0;aspect-ratio:auto}
  .gr-c{left:calc(var(--vu) * 960);top:calc(var(--vu) * 920);width:calc(var(--vu) * 330);height:calc(var(--vu) * 240);margin:0;aspect-ratio:auto}
  .trust{left:calc(var(--vu) * 880);top:calc(var(--vu) * 1240);width:calc(var(--vu) * 410);padding:calc(var(--vu) * 24)}
  /* 07 seasons */
  .se-eb{left:50%;transform:translateX(-50%);top:calc(var(--vu) * 96)}
  .se-h{left:50%;transform:translateX(-50%);top:calc(var(--vu) * 146);white-space:nowrap;font-size:calc(var(--vu) * 88)}
  .seasons{left:calc(var(--vu) * 150);top:calc(var(--vu) * 430);width:calc(var(--vu) * 1140);grid-template-columns:repeat(4,1fr);gap:calc(var(--vu) * 36);margin:0}
  .scard{padding:calc(var(--vu) * 24)}
  .counts{left:calc(var(--vu) * 150);top:calc(var(--vu) * 1058);width:calc(var(--vu) * 1140);grid-template-columns:repeat(3,1fr);gap:calc(var(--vu) * 40);text-align:center}
  .c-mid dt{max-width:calc(var(--vu) * 172);margin-inline:auto}
  /* 08 enrol */
  .en-eb{left:50%;transform:translateX(-50%);top:calc(var(--vu) * 78)}
  .en-h{left:50%;transform:translateX(calc(-50% - var(--vu) * 52));top:calc(var(--vu) * 128);white-space:nowrap;font-size:calc(var(--vu) * 112)}
  .cta-card{left:calc(var(--vu) * 420);top:calc(var(--vu) * 300);width:calc(var(--vu) * 600);max-width:none;text-align:center;padding-top:calc(var(--vu) * 84)}
  .cta-card .cta-lead{margin-inline:auto}
  .cta-btns{justify-content:center}
  .foot{left:calc(var(--vu) * 150);right:auto;top:calc(var(--vu) * 900);width:calc(var(--vu) * 1140);flex-direction:row;justify-content:space-between;align-items:center;margin:0}
  /* index overlay two-pane */
  .op-index{grid-template-columns:1.15fr .85fr;column-gap:34px;align-items:start}
  .op-index>.eyebrow,.op-index>h2{grid-column:1 / -1}
  .idx-pv{display:block;position:sticky;top:0;border:2px solid var(--fg);border-radius:20px;overflow:hidden;aspect-ratio:3/2;margin-top:.8em}
  .idx-pv img{width:100%;height:100%;object-fit:cover}
}

/* mobile/stack refinements */
@media (max-width:999.5px){
  .ch{max-width:720px;margin-inline:auto}
  .taped::before,.pcard::before{left:-8px}
  .taped::after,.pcard::after{right:-8px}
  .mast{margin:.3em 0 .4em}
  .h2{margin:.2em 0 .5em}
  .h2s{margin:.2em 0}
  .pcard{margin-top:1em}
  .gr-h{margin-bottom:.4em}
  .trust{margin-top:1.4em}
  .counts{margin-top:2.4em}
  .cta-card{margin-top:1em}
  .sprout-marker{display:none}
  .side-photo{margin-top:1.6em}
  .sp-c{display:none}
}
@media (min-width:560px) and (max-width:999.5px){
  .seasons{grid-template-columns:1fr 1fr}
  .counts{grid-template-columns:repeat(3,1fr)}
}

/* reduced motion floor: fully-drawn vine, no risers, no video, no sparks */
@media (prefers-reduced-motion: reduce){
  .media video{display:none}
  .ltw .wi,.ltw .w{transform:none;transition:none}
  .bloom-inner,.bloom .pt,.bloom .leaf,.bloom .disc{transform:none;transition:none}
  .tip-glow{animation:none}
  .pcard,.scard,.btn,.pill,.idx a{transition:none}
  .spark,.bloom.open .spark{animation:none;opacity:0}
}