/* Indaba Foundation — signature illustrations (src/site/blocks/signature.mjs, behaviour in /js/signature.js).
   Same tokens as site.css. Each illustration has its own visual logic: a braid (weave), an organic network (ripple),
   a river of money (economics), a landscape gaining layers (node), an architecture in tiers (network), a ten-year strip
   (capital) and nested frames zooming out (journey). Complete at rest; motion only under html.motion. */

.blk:is(.blk--lenses,.blk--weave,.blk--ripple,.blk--economics,.blk--node,.blk--network,.blk--capital,.blk--horizon,.blk--partners,.blk--cycle){
  --sig-f:var(--sage-deep);--sig-t:var(--ink);--sig-c:#c99418;--sig-sys:var(--mineral);--sig-line:rgba(47,45,43,.18);--sig-rule:var(--rule-strong)}
.tone-dark:is(.blk--lenses,.blk--weave,.blk--ripple,.blk--economics,.blk--node,.blk--network,.blk--capital,.blk--horizon,.blk--partners,.blk--cycle){
  --sig-f:#a9bdb4;--sig-t:var(--on-dark);--sig-c:#e0b04a;--sig-sys:#c9bb95;--sig-line:rgba(247,247,242,.17)}

/* shared head and caveat */
:is(.b-lenses,.b-weave,.b-ripple,.b-economics,.b-node,.b-network,.b-capital,.b-horizon,.b-partners,.b-cycle,.b-curve,.b-transition) [class$="__title"]:is(h2){font-size:var(--fs-h2);letter-spacing:-.025em;line-height:1.06;max-width:18ch}
:is(.b-lenses,.b-weave,.b-ripple,.b-economics,.b-node,.b-network,.b-capital,.b-horizon,.b-partners,.b-cycle,.b-curve,.b-transition) [class$="__head"]{max-width:46rem;margin-bottom:clamp(2rem,4vw,3.5rem)}
:is(.b-lenses,.b-weave,.b-ripple,.b-economics,.b-node,.b-network,.b-capital,.b-horizon,.b-partners,.b-cycle,.b-curve,.b-transition) [class$="__head"]>p:not(.eyebrow){margin:1rem 0 0;color:var(--ink)}
:is(.b-lenses,.b-weave,.b-ripple,.b-economics,.b-node,.b-network,.b-capital,.b-horizon,.b-partners,.b-cycle,.b-curve,.b-transition) [class$="__lede"]{font-size:var(--fs-lede);line-height:1.5}
:is(.b-lenses,.b-weave,.b-ripple,.b-economics,.b-node,.b-network,.b-capital,.b-horizon,.b-partners,.b-cycle,.b-curve,.b-transition) [class$="__caveat"]{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;margin:2rem 0 0;max-width:52rem;font-size:var(--fs-small);line-height:1.55;color:var(--soft)}
:is(.b-lenses,.b-weave,.b-ripple,.b-economics,.b-node,.b-network,.b-capital,.b-horizon,.b-partners,.b-cycle,.b-curve,.b-transition) [class$="__caveat"] .badge{flex:none}
.sig-mono{font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}

/* ------------------------------------------------------------------ lenses: two beginnings + what to look for */
.pair{display:grid;gap:1.25rem;align-items:center}
.pair__side{margin:0;position:relative}
.pair__side .pic,.pair__side .ph{border-radius:var(--r-card);overflow:hidden;--frame:.8}
.pair__side .pic img{aspect-ratio:4/5;object-fit:cover;width:100%}
.pair__side figcaption{margin-top:.75rem;font-size:var(--fs-small);color:var(--soft);line-height:1.5}
.pair__label{display:block;font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin-bottom:.25rem}
.pair__mid{text-align:center;padding:1rem 0}
.pair__statement{font:400 var(--fs-quote)/1.12 var(--serif);letter-spacing:-.02em;color:var(--ink-strong);margin:0 auto;max-width:14ch;text-wrap:balance}
.pair__body{margin:1rem auto 0;max-width:24rem;font-size:var(--fs-small);color:var(--soft)}
.pair__note{margin:1.5rem 0 0;font-size:var(--fs-small);color:var(--soft);max-width:46rem}
@media (min-width:56rem){.pair{grid-template-columns:minmax(0,1fr) minmax(14rem,.8fr) minmax(0,1fr);gap:2rem}.pair__side--b{transform:translateY(3rem)}.pair__mid{padding:0}}
.lens{margin-top:clamp(4rem,8vw,7rem)}
.lens__heading{font-size:var(--fs-h3);letter-spacing:-.02em;max-width:22ch;margin-bottom:1.5rem}
.lens__tabs{display:flex;gap:.5rem;overflow-x:auto;scrollbar-width:none;padding-bottom:.25rem;margin:0 calc(var(--gutter) * -1) 1.5rem;padding-inline:var(--gutter);scroll-snap-type:x proximity}
.lens__tabs::-webkit-scrollbar{display:none}
.lens__tab{flex:none;display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border:1px solid var(--rule-strong);border-radius:100vw;font-size:.9375rem;color:var(--ink);scroll-snap-align:start;transition:background .3s var(--ease),color .3s var(--ease),border-color .3s}
.lens__tab[aria-selected="true"]{background:var(--dark);color:var(--on-dark);border-color:var(--dark)}
.lens__n{font:400 .6875rem/1 var(--mono);opacity:.6}
.lens__panels{display:grid;gap:3rem}
.lens__panel{display:grid;gap:1.5rem;align-items:center}
.lens__panel[hidden]{display:none}
.lens__media{margin:0}
.lens__media .pic,.lens__media .ph{border-radius:var(--r-card);overflow:hidden}
.lens__media .pic img{aspect-ratio:4/3;object-fit:cover;width:100%}
.lens__media figcaption{margin-top:.6rem;font-size:.8125rem;color:var(--soft)}
.lens__kicker{font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin:0 0 .75rem}
.lens__title{font-size:var(--fs-h3);letter-spacing:-.02em;max-width:16ch}
.lens__dl{margin:1.5rem 0 0;display:grid;gap:1.1rem}
.lens__dl div{border-top:1px solid var(--rule-strong);padding-top:.8rem}
.lens__dl dt{font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
.lens__dl dd{margin:.35rem 0 0;line-height:1.55}
.lens__module{margin:1.25rem 0 0;font-size:var(--fs-small);color:var(--soft)}
@media (min-width:56rem){.lens__panel{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem)}.lens__tabs{flex-wrap:wrap;overflow:visible;margin-inline:0;padding-inline:0}}
html.motion .is-live .lens__panel:not([hidden]) .lens__media{animation:sig-rise .8s var(--ease) both}
html.motion .is-live .lens__panel:not([hidden]) .lens__text{animation:sig-rise .8s .08s var(--ease) both}
@keyframes sig-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes sig-fade{from{opacity:0}to{opacity:1}}

/* ------------------------------------------------------------------ weave: five strands, one knot */
.weave{display:grid;gap:1.5rem;align-items:stretch}
.weave__list{list-style:none;margin:0;padding:0;display:grid;gap:0;order:2}
.weave__item{border-top:1px solid var(--rule-strong)}
.weave__item:last-child{border-bottom:1px solid var(--rule-strong)}
.weave__btn{display:flex;align-items:center;gap:.9rem;width:100%;text-align:left;padding:1rem 0;font:400 clamp(1.35rem,1.1rem + .8vw,1.85rem)/1.15 var(--serif);letter-spacing:-.015em;color:var(--ink-strong)}
.weave__dot{flex:none;width:.7rem;height:.7rem;border-radius:100vw;background:currentColor}
.weave__dot--0{color:var(--sage-deep)}.weave__dot--1{color:#2f2d2b}.weave__dot--2{color:#c99418}.weave__dot--3{color:var(--mineral)}.weave__dot--4{color:#c4643f}
.weave__detail{padding:0 0 1.25rem 1.6rem;max-width:34rem}
.weave__detail p{margin:0;line-height:1.6}
.weave__enables{margin-top:.75rem!important;font-size:var(--fs-small);color:var(--soft)}
.weave__enables span{font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin-right:.35rem}
.is-live .weave__detail{display:none}
.is-live .weave__item.is-on .weave__detail{display:block;animation:sig-fade .5s var(--ease) both}
.is-live .weave__item:not(.is-on) .weave__btn{color:var(--soft)}
.weave__art{position:relative;order:1;min-height:11rem}
.weave__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.weave__strand{fill:none;stroke-width:2;stroke-linecap:round;transition:stroke-width .5s var(--ease),opacity .5s var(--ease)}
.weave__strand--0{stroke:var(--sage-deep)}.weave__strand--1{stroke:#2f2d2b}.weave__strand--2{stroke:#c99418}.weave__strand--3{stroke:var(--mineral)}.weave__strand--4{stroke:#c4643f}
.is-live .weave__strand{opacity:.28}
.is-live .weave__strand.is-on{opacity:1;stroke-width:3.5}
.weave__knot{position:absolute;right:0;top:50%;transform:translate(0,-50%);margin:0;display:flex;align-items:center;justify-content:center;width:clamp(6.5rem,12vw,9.5rem);aspect-ratio:1;border-radius:100vw;background:var(--dark);color:var(--on-dark);text-align:center;padding:1rem;font:400 clamp(1rem,.9rem + .4vw,1.25rem)/1.15 var(--serif);box-shadow:0 0 0 8px var(--bg)}
.tone-paper .weave__knot{box-shadow:0 0 0 8px var(--paper)}
.weave__knot span{max-width:9ch}
html.motion .is-live .weave__strand{stroke-dasharray:1400;stroke-dashoffset:0;animation:sig-draw 2.4s var(--ease) both}
@keyframes sig-draw{from{stroke-dashoffset:1400}to{stroke-dashoffset:0}}
@media (min-width:56rem){
  .weave{grid-template-columns:minmax(16rem,.8fr) minmax(0,1.4fr);gap:0}
  .weave__list{order:0;grid-template-rows:repeat(5,minmax(4.6rem,auto))}
  .weave__item{display:flex;flex-direction:column;justify-content:center}
  .weave__art{min-height:0;order:0;margin-right:calc(clamp(6.5rem,12vw,9.5rem) / 2)}
  .weave__knot{transform:translate(50%,-50%)}
  .is-live .weave__item.is-on .weave__detail{position:absolute;left:0;top:calc(100% + 1.5rem);width:min(34rem,100%);padding:0}
  .weave__list{position:relative}
  .b-weave .weave{margin-bottom:8rem}
}

/* ------------------------------------------------------------------ ripple: the power of one facilitator */
.rp{display:grid;gap:2rem}
.rp__stage{margin:0;position:relative}
.rp__canvas{display:block;width:100%;aspect-ratio:1;height:auto}
.is-live .rp__chain{display:none}
.rp__chain{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.rp__chain li{display:grid;gap:.15rem;border-top:1px solid var(--rule-strong);padding-top:.75rem}
.rp__chain-v{font:400 var(--fs-stat)/1 var(--serif);letter-spacing:-.03em}
.rp__chain-l{font-size:var(--fs-small);color:var(--soft)}
html:not(.js) .rp__canvas,.b-ripple:not(.is-live) .rp__canvas{display:none}
.rp__legend{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;margin-top:1rem;font:400 .6875rem/1.4 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--soft)}
.b-ripple:not(.is-live) .rp__legend{display:none}
.rp__key{display:inline-flex;align-items:center;gap:.45rem}
.rp__key::before{content:"";width:.6rem;height:.6rem;border-radius:100vw;background:currentColor}
.rp__key--f::before{background:var(--sig-f);box-shadow:0 0 0 3px color-mix(in srgb,var(--sig-f) 25%,transparent)}
.rp__key--t::before{background:var(--sig-t);width:.4rem;height:.4rem}
.rp__key--c::before{background:var(--sig-c);width:.32rem;height:.32rem}
.rp__scale{flex-basis:100%;text-transform:none;letter-spacing:.02em}
.rp__panel{display:grid;gap:1.25rem;align-content:start}
.b-ripple:not(.is-live) .rp__set,.b-ripple:not(.is-live) .rp__assume,.b-ripple:not(.is-live) .rp__summary{display:none}
.rp__set{border:0;margin:0;padding:0;min-width:0}
.rp__set legend{font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft);padding:0;margin-bottom:.6rem}
.rp__pills{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.rp__pill{position:relative;cursor:pointer}
.rp__pill input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.rp__pill span{display:inline-flex;align-items:center;min-height:2.5rem;padding:.45rem 1rem;border:1px solid var(--sig-line);border-radius:100vw;font-size:.9375rem;transition:background .25s,color .25s,border-color .25s}
.rp__pill input:checked+span{background:var(--sig-t);color:var(--dark);border-color:var(--sig-t)}
.tone-ivory .rp__pill input:checked+span,.tone-paper .rp__pill input:checked+span{color:var(--on-dark)}
.rp__pill input:focus-visible+span{outline:2px solid var(--sage);outline-offset:2px}
.rp__custom input{width:4.6rem;min-height:2.5rem;padding:.4rem .7rem;border:1px solid var(--sig-line);border-radius:100vw;background:transparent;color:inherit;font:inherit}
.rp__outs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem 1rem;margin:.5rem 0 0}
.rp__out{border-top:1px solid var(--sig-line);padding-top:.75rem;display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:.4rem}
.rp__out dt{font-size:.8125rem;line-height:1.4;color:var(--soft)}
.rp__out dd{margin:0;font:400 clamp(2rem,1.6rem + 1.6vw,3rem)/1 var(--serif);letter-spacing:-.03em;font-variant-numeric:lining-nums tabular-nums;color:var(--ink-strong)}
.rp__out--childrenNow dd{color:var(--sig-c)}
.rp__summary{margin:0;font-size:var(--fs-small);line-height:1.55;color:var(--soft)}
.rp__assume summary{cursor:pointer;font-size:var(--fs-small);text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:1px}
.rp__fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.75rem 1rem;margin-top:1rem}
.rp__field{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.4rem;font-size:.8125rem;color:var(--soft)}
.rp__field input{width:4.4rem;padding:.35rem .5rem;border:1px solid var(--sig-line);border-radius:var(--r-sm);background:transparent;color:inherit;font:inherit;text-align:right}
.rp__field i{font-style:normal}
.rp__note{font-size:.8125rem;color:var(--soft);margin:1rem 0 0}
.rp__table{margin-top:2.5rem;font-size:var(--fs-small)}
.rp__table summary{cursor:pointer;text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:1px}
.rp__table table{border-collapse:collapse;width:100%;margin-top:1rem;font-variant-numeric:tabular-nums}
.rp__table caption{text-align:left;color:var(--soft);padding-bottom:.5rem}
.rp__table :is(th,td){padding:.45rem .6rem;border-bottom:1px solid var(--sig-line);text-align:right;white-space:nowrap}
.rp__table th[scope="row"],.rp__table thead th:first-child{text-align:left}
@media (min-width:64rem){.rp{grid-template-columns:minmax(0,1.25fr) minmax(20rem,.9fr);gap:clamp(2rem,5vw,5rem);align-items:start}.rp__stage{position:sticky;top:calc(var(--bar-top) + var(--header) + 1rem)}}

/* ------------------------------------------------------------------ economics: the river of a costed plan */
.eco{display:grid;gap:3rem}
.eco__total{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0 0 1rem;padding-bottom:.75rem;border-bottom:1px solid var(--ink)}
.eco__total span{font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
.eco__total strong{font:400 var(--fs-stat)/1 var(--serif);letter-spacing:-.03em}
.eco-river{list-style:none;margin:0;padding:0;display:grid;gap:.15rem}
.eco-river__line{display:grid;grid-template-columns:4.6rem minmax(0,1fr);grid-template-areas:"amt name" "bar bar" "body body";gap:.2rem .75rem;padding:.55rem 0}
.eco-river__bar{grid-area:bar;display:block;height:.55rem;width:calc(var(--w) * 100%);min-width:.55rem;border-radius:100vw;background:var(--sig-sys);transform-origin:left;transition:opacity .4s}
.eco-river__line--delivery .eco-river__bar{background:var(--sig-c)}
.eco-river__line--buffer .eco-river__bar{background:var(--soft)}
.eco-river__amt{grid-area:amt;font:400 .8125rem/1.4 var(--mono);font-variant-numeric:tabular-nums;color:var(--ink)}
.eco-river__name{grid-area:name;font-size:.9375rem;line-height:1.35;color:var(--ink-strong)}
.eco-river__body{grid-area:body;font-size:.8125rem;line-height:1.45;color:var(--soft)}
.is-delivery-only .eco-river__line:not(.eco-river__line--delivery){opacity:.32}
html.motion .b-economics .eco-river__bar{animation:sig-grow 1.4s var(--ease) both}
@keyframes sig-grow{from{transform:scaleX(0)}to{transform:none}}
.eco-flow{list-style:none;margin:0;padding:0;display:grid;gap:0}
.eco-flow__step{display:grid;gap:.25rem;padding:1rem 0 1rem 1.6rem;position:relative;border-left:1px solid var(--sig-line);margin-left:.35rem}
.eco-flow__step::before{content:"";position:absolute;left:-.36rem;top:1.45rem;width:.7rem;height:.7rem;border-radius:100vw;background:var(--sig-c)}
.eco-flow__step:first-child::before{background:var(--sig-t)}
.eco-flow__v{font:400 var(--fs-stat)/1 var(--serif);letter-spacing:-.03em;font-variant-numeric:lining-nums tabular-nums;color:var(--ink-strong)}
.eco-flow__l{font-size:var(--fs-small);color:var(--soft);max-width:28rem}
.eco-units{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:2rem 0 0}
.eco-unit{border-top:1px solid var(--ink);padding-top:.75rem;display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:.35rem}
.eco-unit dt{font-size:.8125rem;line-height:1.35;color:var(--soft)}
.eco-unit dd{margin:0;font:400 clamp(1.5rem,1.2rem + 1.2vw,2.25rem)/1 var(--serif);letter-spacing:-.02em;font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.eco-unit:last-child dd{color:var(--sig-c)}
.eco-scale{margin-top:2.25rem;padding-top:1.75rem}
.eco-scale__track{position:relative;height:.5rem;border-radius:100vw;background:var(--sig-line)}
.eco-scale__band{position:absolute;top:0;bottom:0;left:calc(var(--lo) * 100%);width:calc((var(--hi) - var(--lo)) * 100%);background:color-mix(in srgb,var(--sig-c) 35%,transparent);border-radius:100vw}
.eco-scale__band span{position:absolute;bottom:calc(100% + .5rem);left:0;white-space:nowrap;font:400 .6875rem/1.3 var(--mono);letter-spacing:.04em;color:var(--soft)}
.eco-scale__mark{position:absolute;top:50%;left:calc(var(--v) * 100%);width:1rem;height:1rem;margin:-.5rem 0 0 -.5rem;border-radius:100vw;background:var(--sig-c);box-shadow:0 0 0 4px var(--bg);transition:left .6s var(--ease)}
.tone-paper .eco-scale__mark{box-shadow:0 0 0 4px var(--paper)}
.tone-dark .eco-scale__mark{box-shadow:0 0 0 4px var(--dark)}
.eco-scale__mark span{position:absolute;top:calc(100% + .5rem);left:50%;transform:translateX(-50%);font:400 .8125rem/1 var(--mono);white-space:nowrap;color:var(--ink-strong)}
.eco-scale__ticks{position:relative;height:1.2rem;margin-top:1.9rem}
.eco-scale__ticks span{position:absolute;left:calc(var(--t) * 100%);transform:translateX(-50%);font:400 .625rem/1 var(--mono);color:var(--soft)}
.eco-scale__ticks span:first-child{transform:none}.eco-scale__ticks span:last-child{transform:translateX(-100%)}
.eco-ctl{display:grid;gap:1rem;margin-top:2rem;padding:1.25rem;border:1px solid var(--sig-line);border-radius:var(--r)}
.eco-ctl[hidden]{display:none}
.eco-ctl__toggle{display:flex;gap:.6rem;align-items:center;font-size:.9375rem;cursor:pointer}
.eco-ctl__toggle input{width:1.1rem;height:1.1rem;accent-color:var(--sage-deep)}
.eco-ctl__range{display:grid;gap:.4rem;font-size:.875rem;color:var(--soft)}
.eco-ctl__range output{font:400 .875rem/1 var(--mono);color:var(--ink-strong);margin-left:.4rem}
.eco-ctl__range input{width:100%;accent-color:var(--sage-deep)}
.eco__live{margin:1rem 0 0;font-size:.8125rem;line-height:1.5;color:var(--soft)}
.eco__notes{margin:2.5rem 0 0;padding:0;list-style:none;display:grid;gap:.6rem;max-width:52rem;font-size:var(--fs-small);color:var(--soft);line-height:1.55}
.eco__notes li{padding-left:1.1rem;position:relative}
.eco__notes li::before{content:"";position:absolute;left:0;top:.65em;width:.4rem;height:1px;background:currentColor}
@media (max-width:30rem){.eco-units{grid-template-columns:1fr}.eco-unit{flex-direction:row-reverse;justify-content:space-between;align-items:baseline}}
@media (min-width:64rem){.eco{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(3rem,6vw,6rem)}}

/* ------------------------------------------------------------------ node: a region gaining layers */
.nd-tabs{display:flex;gap:.25rem;margin-bottom:1.5rem;border-bottom:1px solid var(--rule-strong);overflow-x:auto;scrollbar-width:none}
.nd-tab{flex:1 0 auto;display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;padding:.75rem .75rem .9rem 0;font:400 clamp(1.15rem,1rem + .6vw,1.5rem)/1.1 var(--serif);color:var(--soft);position:relative;text-align:left}
.nd-tab::after{content:"";position:absolute;left:0;right:.5rem;bottom:-1px;height:2px;background:var(--ink-strong);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.nd-tab[aria-selected="true"],.nd-tab.is-past{color:var(--ink-strong)}
.nd-tab[aria-selected="true"]::after{transform:none}
.nd-tab.is-past::after{transform:none;background:var(--sage)}
.nd-tab__n{font:400 .6875rem/1 var(--mono);letter-spacing:.06em}
.nd-grid{display:grid;gap:2rem}
.nd-art{margin:0;position:relative;border-radius:var(--r-card);background:var(--surface-light);overflow:hidden}
.tone-paper .nd-art{background:var(--bg)}
.nd-svg{display:block;width:100%;height:auto}
.nd-hub{fill:var(--dark)}
.nd-hub--next{fill:none;stroke:var(--dark);stroke-width:1.5;stroke-dasharray:3 3}
.nd-hub-ring{fill:none;stroke:var(--sig-f);stroke-width:1;opacity:.6}
.nd-lead{fill:#c4643f}
.nd-fac{fill:var(--sig-f)}
.nd-centre path{fill:var(--bg);stroke:var(--ink);stroke-width:1.3;stroke-linejoin:round}
.nd-path{fill:none;stroke:var(--sig-line);stroke-width:1.2}
.nd-traveller{fill:var(--sig-c)}
.nd-qa{fill:none;stroke:var(--sig-f);stroke-width:1.2;stroke-dasharray:2 6;stroke-linecap:round}
.nd-partner{fill:none;stroke:var(--mineral);stroke-width:1.6}
.nd-bridge{fill:none;stroke:var(--ink);stroke-width:1.2;stroke-dasharray:4 5}
.nd-layer{transition:opacity .9s var(--ease)}
.nd-label{position:absolute;transform:translate(-50%,-50%);font:400 .625rem/1.25 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ink);background:color-mix(in srgb,var(--surface-light) 88%,transparent);padding:.2rem .4rem;border-radius:4px;white-space:nowrap;transition:opacity .9s var(--ease)}
.tone-paper .nd-label{background:color-mix(in srgb,var(--bg) 88%,transparent)}
.is-live .nd-art[data-show="1"] :is(.nd-layer,.nd-label):is([data-layer="2"],[data-layer="3"],[data-layer="4"]),
.is-live .nd-art[data-show="2"] :is(.nd-layer,.nd-label):is([data-layer="3"],[data-layer="4"]),
.is-live .nd-art[data-show="3"] :is(.nd-layer,.nd-label)[data-layer="4"]{opacity:.22} /* what comes later stays legible: a plan, not an empty card */
.is-live .nd-art[data-show="1"] .nd-label:is([data-layer="2"],[data-layer="3"],[data-layer="4"]),.is-live .nd-art[data-show="2"] .nd-label:is([data-layer="3"],[data-layer="4"]),.is-live .nd-art[data-show="3"] .nd-label[data-layer="4"]{opacity:0}
.nd-stage[hidden]{display:none}
.b-node:not(.is-live) .nd-stages{display:grid;gap:2rem}
.nd-stage__n{font:400 .6875rem/1 var(--mono);letter-spacing:.06em;color:var(--soft);margin:0 0 .5rem}
.nd-stage__title{font-size:var(--fs-h3);letter-spacing:-.02em}
.nd-stage p{line-height:1.6}
.nd-stage__label{font:400 .6875rem/1.4 var(--mono)!important;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin:1.25rem 0 .5rem}
.nd-stage__criteria{margin:0 0 1.25rem;padding:0;list-style:none;display:grid;gap:.45rem}
.nd-stage__criteria li{padding-left:1.4rem;position:relative;font-size:.9375rem;line-height:1.5}
.nd-stage__criteria li::before{content:"";position:absolute;left:0;top:.42em;width:.75rem;height:.75rem;border:1px solid var(--sage-deep);border-radius:3px}
html.motion .is-live .nd-stage:not([hidden]){animation:sig-rise .7s var(--ease) both}
@media (max-width:40rem){.nd-label{font-size:.5625rem;padding:.12rem .3rem}}
.nd-label--w{transform:translate(-100%,-50%)}.nd-label--e{transform:translate(0,-50%)}
/* one chip for the whole model: the caveat under the stages carries it once the stages show one at a time */
.b-node.is-live .nd-stage>.badge--model{display:none}
@media (min-width:64rem){.nd-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}}

/* ------------------------------------------------------------------ network: an architecture in tiers */
.nw{display:grid;gap:2.5rem}
.nw-tiers{list-style:none;margin:0;padding:0;display:grid;gap:0;position:relative}
.nw-tier{position:relative;padding:1.5rem 0 1.75rem;border-top:1px solid var(--ink);transition:background .5s var(--ease)}
.nw-tier::before{content:"";position:absolute;left:0;top:-1px;height:3px;width:0;background:var(--sage-deep);transition:width .6s var(--ease)}
.nw-tier.is-lit::before{width:100%}
.nw-tier__kicker{font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin:0 0 .35rem}
.nw-tier__title{font-size:clamp(1.4rem,1.2rem + .7vw,1.9rem);letter-spacing:-.015em}
.nw-tier__body{margin:.5rem 0 0;font-size:var(--fs-small);color:var(--soft);max-width:36rem}
.nw-units{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.nw-unit{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .8rem;border:1px solid var(--rule-strong);border-radius:var(--r-sm);font-size:.875rem;background:var(--surface-light)}
.tone-paper .nw-unit{background:var(--bg)}
.nw-unit--future{border-style:dashed;background:transparent!important;color:var(--soft)}
.nw-unit__mark{width:.5rem;height:.5rem;border-radius:2px;background:var(--ink)}
.nw-tier--regions .nw-unit__mark{border-radius:100vw;background:var(--sig-f)}
.nw-tier--local .nw-unit__mark{border-radius:100vw;background:var(--sig-c)}
.nw-unit--future .nw-unit__mark{background:transparent;border:1px dashed currentColor}
.nw-unit__note{font:400 .625rem/1.2 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--soft)}
.nw-tier.is-lit .nw-unit{border-color:var(--sage-deep)}
.nw-tiers .nw-tier+.nw-tier::after{content:"";position:absolute;left:1.25rem;top:-1.5rem;height:1.5rem;border-left:1px dashed var(--ink)}
.nw-fns{display:grid;gap:1.75rem;align-content:start}
.nw-filter{display:flex;flex-wrap:wrap;gap:.4rem}
.nw-filter[hidden]{display:none}
.nw-filter__btn{display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .9rem;border:1px solid var(--rule-strong);border-radius:100vw;font-size:.875rem}
.nw-filter__btn[aria-pressed="true"]{background:var(--dark);color:var(--on-dark);border-color:var(--dark)}
.nw-home{display:inline-block;width:.6rem;height:.6rem;flex:none}
.nw-home--central{background:var(--ink);border-radius:2px}
.nw-home--shared{background:linear-gradient(90deg,var(--ink) 50%,var(--sig-f) 50%);border-radius:100vw}
.nw-home--local{background:var(--sig-c);border-radius:100vw}
.nw-filter__btn[aria-pressed="true"] .nw-home--central{background:var(--on-dark)}
.nw-group__title{display:flex;align-items:center;gap:.6rem;font:400 .75rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-strong)}
.nw-group__body{margin:.4rem 0 .75rem;font-size:var(--fs-small);color:var(--soft)}
.nw-fn-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.nw-fn{padding:.35rem .75rem;border:1px solid var(--rule-strong);border-radius:100vw;font-size:.8125rem;line-height:1.3;transition:background .25s,color .25s,opacity .3s}
.nw-fn[aria-pressed="true"]{background:var(--sage-deep);color:var(--on-dark);border-color:var(--sage-deep)}
.b-network:not(.is-live) .nw-fn{cursor:default}
.b-network[data-home] .nw-group:not([data-home]){opacity:1}
.b-network[data-home="central"] .nw-group:not([data-home="central"]),.b-network[data-home="shared"] .nw-group:not([data-home="shared"]),.b-network[data-home="local"] .nw-group:not([data-home="local"]){opacity:.35}
@media (min-width:64rem){.nw{grid-template-columns:minmax(0,1.3fr) minmax(18rem,.9fr);gap:clamp(2.5rem,5vw,5rem);align-items:start}}

/* ------------------------------------------------------------------ capital: what the money leaves behind */
.cap-toggle{display:inline-grid;grid-template-columns:repeat(2,minmax(0,auto));padding:.25rem;border:1px solid var(--rule-strong);border-radius:100vw;margin-bottom:2rem}
@media (max-width:40rem){.cap-toggle{display:grid;grid-template-columns:1fr 1fr;width:100%;border-radius:var(--r)}.cap-toggle__btn{border-radius:calc(var(--r) - 4px);font-size:.875rem;line-height:1.25;padding:.6rem .7rem}}
.cap-toggle[hidden]{display:none}
.cap-toggle__btn{padding:.55rem 1.1rem;border-radius:100vw;font-size:.9375rem;transition:background .3s,color .3s}
.cap-toggle__btn[aria-pressed="true"]{background:var(--dark);color:var(--on-dark)}
.tone-dark .cap-toggle__btn[aria-pressed="true"]{background:var(--on-dark);color:var(--dark)}
.cap{margin:0;--name:minmax(0,1fr)}
.cap-years{display:grid;grid-template-columns:var(--name) repeat(10,minmax(0,1fr));gap:0;font:400 .625rem/1 var(--mono);color:var(--soft);padding-bottom:.6rem;border-bottom:1px solid var(--sig-line)}
.cap-years span{text-align:center}
.cap-years .is-funded{color:var(--ink-strong)}
.cap-rows{list-style:none;margin:0;padding:0}
.cap-row{display:grid;grid-template-columns:var(--name) repeat(10,minmax(0,1fr));grid-template-areas:"name name name name name name name name name name name" "track track track track track track track track track track track" "asset asset asset asset asset asset asset asset asset asset asset";padding:.9rem 0;border-bottom:1px solid var(--sig-line);gap:.4rem 0}
.cap-row__name{grid-area:name;font-size:.9375rem;line-height:1.35;color:var(--ink-strong);display:flex;gap:.75rem;align-items:baseline}
.cap-row__amt{font:400 .75rem/1 var(--mono);color:var(--soft);min-width:4.2rem}
.cap-row__track{grid-area:track;position:relative;height:.75rem}
.cap-row__fund,.cap-row__keep{position:absolute;top:0;bottom:0;border-radius:100vw;transition:opacity .6s var(--ease),transform 1.2s var(--ease)}
.cap-row__fund{left:0;width:calc(var(--funded) / var(--years) * 100% - 3px);background:var(--sig-t);transform-origin:left}
.cap-row--systems .cap-row__fund{background:var(--sig-sys)}
.cap-row__keep{left:calc(var(--funded) / var(--years) * 100%);width:calc((var(--persist) - var(--funded)) / var(--years) * 100%);background:linear-gradient(90deg,var(--sig-f),color-mix(in srgb,var(--sig-f) 8%,transparent));transform-origin:left}
.cap-row--delivery .cap-row__keep{background:linear-gradient(90deg,var(--sig-c),color-mix(in srgb,var(--sig-c) 8%,transparent))}
.cap-row__asset{grid-area:asset;margin:0;font-size:.8125rem;line-height:1.45;color:var(--soft)}
.cap-row__asset span{font:400 .625rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin-right:.3rem}
.cap[data-mode="delivery"] .cap-row--systems{opacity:.28}
.cap[data-mode="delivery"] .cap-row--systems .cap-row__fund,.cap[data-mode="delivery"] .cap-row--systems .cap-row__keep{transform:scaleX(0)}
.cap.is-waiting .cap-row__fund,.cap.is-waiting .cap-row__keep{transform:scaleX(0)}
.cap-row:nth-child(2) :is(.cap-row__fund,.cap-row__keep){transition-delay:.08s}.cap-row:nth-child(3) :is(.cap-row__fund,.cap-row__keep){transition-delay:.16s}.cap-row:nth-child(4) :is(.cap-row__fund,.cap-row__keep){transition-delay:.24s}.cap-row:nth-child(5) :is(.cap-row__fund,.cap-row__keep){transition-delay:.32s}.cap-row:nth-child(6) :is(.cap-row__fund,.cap-row__keep){transition-delay:.4s}.cap-row:nth-child(7) :is(.cap-row__fund,.cap-row__keep){transition-delay:.48s}
.cap__legend{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin-top:1rem;font:400 .6875rem/1.4 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--soft)}
.cap-key{display:inline-flex;align-items:center;gap:.45rem}
.cap-key::before{content:"";width:1.4rem;height:.45rem;border-radius:100vw}
.cap-key--fund::before{background:var(--sig-t)}
.cap-key--keep::before{background:linear-gradient(90deg,var(--sig-f),transparent)}
.b-capital__message{margin:2.5rem 0 0;font:400 var(--fs-quote)/1.15 var(--serif);letter-spacing:-.02em;max-width:26ch;color:var(--ink-strong)}
@media (min-width:56rem){.cap{--name:minmax(17rem,2.4fr)}.cap-row{grid-template-areas:"name track track track track track track track track track track" "name asset asset asset asset asset asset asset asset asset asset";align-items:center}.cap-row__name{padding-right:1.5rem}.cap-years{grid-template-columns:var(--name) repeat(10,minmax(0,1fr))}}
@media (max-width:55.99rem){.cap-years{grid-template-columns:repeat(10,minmax(0,1fr))}.cap-years>span:first-child{display:none}}

/* ------------------------------------------------------------------ horizon: nested frames, zooming out */
.hz{display:grid;gap:2rem}
.hz-art{margin:0;position:relative;aspect-ratio:1;border-radius:var(--r-card);overflow:hidden;background:var(--dark);--zoom:9}
.hz-svg{position:absolute;inset:0;width:100%;height:100%}
.hz-pt{fill:rgba(247,247,242,.62)}
.hz-pt--open{fill:none;stroke:rgba(247,247,242,.45);stroke-width:1;vector-effect:non-scaling-stroke}
.hz-frame{fill:none;stroke:rgba(247,247,242,.28);stroke-width:1}
.hz-frame--documented,.hz-frame--records,.hz-frame--independent{stroke:rgba(247,247,242,.7)}
.hz-frame--proposal,.hz-frame--model{stroke-dasharray:4 4}
.hz-frame--future{stroke-dasharray:1.5 5;stroke-linecap:round}
.hz-frame.is-on{stroke:#e0b04a;stroke-width:1.6}
.hz-frame.is-in{stroke:rgba(247,247,242,.5)}
.hz-origin{fill:#e0b04a}
.hz-tag{position:absolute;left:1.25rem;bottom:1.1rem;font:400 .6875rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--on-dark);opacity:0;transition:opacity .6s var(--ease)}
.b-horizon:not(.is-live) .hz-tag:first-of-type,.hz-art[data-active="0"] .hz-tag[data-i="0"],.hz-art[data-active="1"] .hz-tag[data-i="1"],.hz-art[data-active="2"] .hz-tag[data-i="2"],.hz-art[data-active="3"] .hz-tag[data-i="3"],.hz-art[data-active="4"] .hz-tag[data-i="4"],.hz-art[data-active="5"] .hz-tag[data-i="5"]{opacity:1}
.hz-steps{list-style:none;margin:0;padding:0;display:grid}
.hz-step{border-top:1px solid var(--rule-strong)}
.hz-step:last-child{border-bottom:1px solid var(--rule-strong)}
.hz-step__btn{display:grid;grid-template-columns:2.2rem minmax(0,1fr);grid-template-areas:"n scale" "n title";gap:.1rem .5rem;width:100%;text-align:left;padding:.95rem 0}
.hz-step__n{grid-area:n;font:400 .6875rem/1.9 var(--mono);color:var(--soft)}
.hz-step__scale{grid-area:scale;font:400 .625rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
.hz-step__title{grid-area:title;font:400 clamp(1.3rem,1.1rem + .7vw,1.75rem)/1.12 var(--serif);letter-spacing:-.015em;color:var(--ink-strong)}
.hz-step__body{padding:0 0 1.25rem 2.7rem}
.hz-step__body p{margin:0 0 .75rem;line-height:1.6;max-width:34rem}
.is-live .hz-step:not(.is-on) .hz-step__body{display:none}
.is-live .hz-step:not(.is-on) .hz-step__title{color:var(--soft)}
html.motion .is-live .hz-step.is-on .hz-step__body{animation:sig-rise .6s var(--ease) both}
.hz-targets{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--ink)}
.hz-targets__title{font-size:var(--fs-h3)}
.hz-targets__list{display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:1.25rem;margin:1.25rem 0 0}
.hz-targets__list dt{font-size:var(--fs-small);color:var(--soft)}
.hz-targets__list dd{margin:.25rem 0 0;font:400 var(--fs-stat)/1 var(--serif)}
.hz-targets__owner,.hz-targets__note{font-size:.8125rem;color:var(--soft);margin:.4rem 0 0}
@media (min-width:56rem){.hz{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2.5rem,5vw,5rem);align-items:start}.hz-art{position:sticky;top:calc(var(--bar-top) + var(--header) + 1.5rem)}}

/* ------------------------------------------------------------------ partner ledger */
.pl{display:grid;gap:0;border-top:1px solid var(--ink)}
.pl-group{display:grid;gap:1rem;padding:1.5rem 0;border-bottom:1px solid var(--rule-strong)}
.pl-group__title{font-size:clamp(1.3rem,1.15rem + .6vw,1.7rem);letter-spacing:-.015em}
.pl-group__body{margin:.4rem 0 0;font-size:var(--fs-small);color:var(--soft);max-width:28rem}
.pl-list{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.pl-item{display:grid;gap:.35rem;justify-items:start}
.pl-item__name{margin:0;font-size:1.0625rem;color:var(--ink-strong);font-weight:400}
.pl-item__role{margin:0;font-size:var(--fs-small);color:var(--soft);line-height:1.5;max-width:34rem}
.b-partners__note{margin:1.5rem 0 0;font-size:var(--fs-small);color:var(--soft);max-width:52rem}
@media (min-width:56rem){.pl-group{grid-template-columns:minmax(14rem,1fr) minmax(0,2fr);gap:2rem}.pl-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 2rem}}

@media (prefers-reduced-motion:reduce){.nd-layer,.nd-label,.cap-row__fund,.cap-row__keep,.eco-scale__mark{transition:none!important}.nd-traveller{display:none}}
@media print{.rp__canvas,.nd-tabs,.nw-filter,.cap-toggle{display:none!important}.rp__chain{display:grid!important}}

/* ------------------------------------------------------------------ review corrections (30 Oct 2026) */
/* capital: what the plan reaches, beside the closing line */
.cap-close{display:grid;gap:2.5rem;margin-top:3rem;align-items:start}
.cap-close .b-capital__message{margin:0}
.cap-reach__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:0}
.cap-reach__list div{border-top:1px solid var(--ink);padding-top:.75rem;display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:.35rem}
.cap-reach__list dt{font-size:.875rem;line-height:1.4;color:var(--soft)}
.cap-reach__list dd{margin:0;font:400 clamp(1.6rem,1.2rem + 1.4vw,2.5rem)/1 var(--serif);letter-spacing:-.02em;font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.cap-reach__unit dd{color:var(--sig-c)}
.cap-reach__note{margin:1.75rem 0 0;font-size:.875rem;line-height:1.55;color:var(--soft)}
.cap-reach .eco-scale{margin-top:1.75rem}
@media (max-width:30rem){.cap-reach__list{grid-template-columns:1fr}.cap-reach__list div{flex-direction:row-reverse;justify-content:space-between;align-items:baseline}}
@media (min-width:64rem){.cap-close{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(3rem,6vw,6rem)}}
/* partners: a compact strip of four */
.pl{border-top:1px solid var(--ink)}
.pl-group{display:block;padding:1.25rem 0;border-bottom:1px solid var(--rule-strong)}
.pl-group__title{font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin-bottom:.6rem}
.pl-list{display:grid;gap:1rem;grid-template-columns:1fr}
@media (min-width:56rem){.pl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 2rem}.pl-group{border-bottom:0;padding-top:1.25rem}.pl-list{grid-template-columns:1fr}}
/* horizon: named frames */
.hz-name{fill:rgba(247,247,242,.55);font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase}
.hz-art[data-active] .hz-name{transition:fill .6s var(--ease)}
.hz-tag{display:none}
/* network: the drawing */
.nw-side{display:grid;gap:1.75rem;align-content:start}
.nw-art{margin:0;border-radius:var(--r-card);background:var(--surface-light);padding:1rem}
.tone-paper .nw-art{background:var(--bg)}
.nw-svg{display:block;width:100%;height:auto}
.nw-link{stroke:var(--sig-line);stroke-width:1.2;fill:none}
.nw-link--up{stroke:var(--ink);stroke-dasharray:3 4}
.nw-dot{fill:var(--sig-c)}
.nw-dot--open{fill:none;stroke:var(--sig-c);stroke-width:1.2}
.nw-node{fill:var(--sig-f)}
.nw-node--open{fill:none;stroke:var(--sig-f);stroke-width:1.5;stroke-dasharray:3 3}
.nw-centre{fill:var(--dark)}
[data-tier-art]{transition:opacity .45s var(--ease)}
.has-lit [data-tier-art]:not(.is-lit){opacity:.15}
@media (min-width:64rem){.nw{grid-template-columns:minmax(18rem,.95fr) minmax(0,1.2fr)}.nw-side{position:sticky;top:calc(var(--bar-top) + var(--header) + 1rem)}}
/* ripple: the custom count appears only when chosen */
.rp__custom{display:none}
.rp__pills:has(input[value="custom"]:checked) .rp__custom{display:inline-block}
html:not(.js) .rp__custom{display:inline-block}
/* node: criteria are conditions, not checkboxes */
.nd-stage__criteria li::before{top:.7em;width:.55rem;height:1px;border:0;border-radius:0;background:var(--sage-deep)}
@media (max-width:40rem){.nd-label{font-size:.625rem}.nd-label--wide{display:none}}
/* lenses: tabs keep the page gutter */
@media (max-width:55.99rem){.lens__tabs{margin-inline:0;padding-inline:0;scroll-padding-inline:0}}

/* ------------------------------------------------------------------ cycle: the Indaba system as one loop (31 Oct 2026)
   Four stations around the adult and the child; arcs carry the direction of travel, a single light moves round the loop.
   The chosen station's arc and spokes take ink; the rest stay as quiet rules. All panels are visible without JavaScript. */
.b-cycle__head{max-width:46rem}
.b-cycle__lede{margin:1.25rem 0 0;font:300 var(--fs-lede)/1.5 var(--sans);color:var(--soft)}
.cy{margin-top:var(--space-5)}
.cy-grid{display:grid;gap:var(--space-4);align-items:center}
@media (min-width:56rem){.cy-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2.5rem,6vw,6rem)}}
.cy-art{position:relative;margin:0 auto;width:100%;max-width:34rem;aspect-ratio:1}
.cy-svg{display:block;width:100%;height:100%;overflow:visible}
.cy-orbit{fill:none;stroke:var(--sig-line);stroke-width:1;stroke-dasharray:1 7;stroke-linecap:round}
.cy-arc{fill:none;stroke:var(--sig-line);stroke-width:2;stroke-linecap:round;transition:stroke var(--t-std) var(--ease-circ),stroke-width var(--t-std) var(--ease)}
.cy-arrow{fill:none;stroke:var(--sig-line);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:stroke var(--t-std) var(--ease-circ)}
.cy-spoke{fill:none;stroke:var(--sig-line);stroke-width:1.5;stroke-dasharray:2 6;stroke-linecap:round;transition:stroke var(--t-std) var(--ease-circ)}
.cy-centre{fill:var(--dark)}
.cy-centre-ring{fill:none;stroke:var(--sig-line);stroke-width:1}
.cy-station__halo{fill:var(--bg-depth);stroke:var(--sig-line);stroke-width:1;transition:r var(--t-std) var(--ease),stroke var(--t-std) var(--ease-circ)}
.tone-ivory .cy-station__halo{fill:var(--bg)}
.cy-station__dot{fill:var(--sig-f);transition:r var(--t-std) var(--ease),fill var(--t-std) var(--ease-circ)}
.cy-light{fill:var(--sig-c);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--sig-c) 70%,transparent))}
/* without JS, or before a station is chosen, the whole loop is drawn in ink */
.cy-art:not(.is-live) :is(.cy-arc,.cy-arrow){stroke:var(--ink)}
.cy-art.is-live [data-arc].is-on{stroke:var(--ink-strong)}
.cy-art.is-live .cy-arc.is-on{stroke-width:3}
.cy-art.is-live .cy-spoke.is-on{stroke:var(--sig-c)}
.cy-art.is-live .cy-station.is-on .cy-station__halo{r:26;stroke:var(--ink-strong)}
.cy-art.is-live .cy-station.is-on .cy-station__dot{r:11;fill:var(--sig-c)}
.cy-art__centre{position:absolute;left:50%;top:50%;width:22%;translate:-50% -50%;margin:0;text-align:center;font:400 clamp(.8rem,.6rem + .9vw,1.2rem)/1.15 var(--serif);color:var(--on-dark)}
.cy-label{position:absolute;display:flex;flex-direction:column;gap:.2rem;width:max-content;max-width:12rem;font:400 clamp(1.05rem,.9rem + .5vw,1.35rem)/1.1 var(--serif);color:var(--ink-strong);transition:opacity var(--t-std) var(--ease-circ)}
.cy-label__org{font:400 .625rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
/* stations sit on the diagonals (NW, NE, SE, SW); each label takes the open corner beyond its station */
.cy-label--nw,.cy-label--sw{right:calc(100% - var(--x) - .75rem);align-items:flex-end;text-align:right}
.cy-label--ne,.cy-label--se{left:calc(var(--x) - .75rem)}
.cy-label--nw,.cy-label--ne{bottom:calc(100% - var(--y) + 2rem)}
.cy-label--sw,.cy-label--se{top:calc(var(--y) + 2rem)}
.cy-art.is-live .cy-label:not(.is-on){opacity:.5}
.cy-tabs{display:flex;gap:.25rem;margin-bottom:var(--space-3);border-bottom:1px solid var(--rule-strong);overflow-x:auto;scrollbar-width:none}
.cy-tabs::-webkit-scrollbar{display:none}
.cy-tab{flex:1 0 auto;display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;padding:.75rem .9rem .9rem 0;min-height:44px;font:400 clamp(1.05rem,.95rem + .45vw,1.35rem)/1.1 var(--serif);color:var(--soft);position:relative;text-align:left;transition:color var(--t-micro) var(--ease-circ)}
.cy-tab:hover{color:var(--ink-strong)}
.cy-tab__n{font:400 .625rem/1 var(--mono);letter-spacing:.06em}
.cy-tab::after{content:"";position:absolute;left:0;right:.6rem;bottom:-1px;height:2px;background:var(--ink-strong);transform:scaleX(0);transform-origin:left;transition:transform var(--t-reveal) var(--ease)}
.cy-tab[aria-selected="true"]{color:var(--ink-strong)}
.cy-tab[aria-selected="true"]::after{transform:none}
.cy-panels{display:grid;gap:var(--space-4)}
.cy-panel{max-width:32rem}
.cy-panel[hidden]{display:none}
.cy.is-live .cy-panels{display:block}
.cy.is-live .cy-panel:not([hidden]){animation:cy-in var(--t-reveal) var(--ease) both}
@keyframes cy-in{from{opacity:0;translate:0 10px}}
.cy-panel__n{margin:0 0 .6rem;font:400 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
.cy-panel__title{font-size:var(--fs-h3);letter-spacing:-.02em;margin-bottom:1rem}
.cy-panel p{line-height:1.6}
.cy-panel .itemlink{margin-top:.75rem}
.b-cycle__caveat{margin:var(--space-4) 0 0;max-width:46rem;font-size:.85rem;color:var(--soft)}
@media (max-width:599px){
  .cy-label{font-size:.95rem;width:auto}
  .cy-label--nw,.cy-label--sw{max-width:calc(var(--x) + .75rem)}
  .cy-label--ne,.cy-label--se{max-width:calc(100% - var(--x) + .75rem)}
  .cy-label__org{display:none}
  .cy-art{max-width:22rem;margin-block:3rem}
}
@media (prefers-reduced-motion:reduce){.cy-light{display:none}}
/* the scale's end labels sit inside the track's ends rather than centred over them (no clipping at the column edges) */
.eco-scale__ticks span:first-child{transform:none}
.eco-scale__ticks span:last-child{transform:translateX(-100%)}

/* horizon, played by scroll (signature.js). Pin: on a screen tall enough the figure and the list hold still and each step
   takes a stretch of scroll before the page moves on. Flow: where they cannot both fit, the drawing sticks above or beside
   the list, every step stays open, and the one crossing the reading line is lit. Reduced motion keeps choose-to-open. */
.b-horizon.is-pin .hz{position:sticky;top:calc(var(--bar-top) + var(--header) + 1.5rem)}
.b-horizon.is-pin .hz-art{position:relative;top:auto;width:min(100%,calc(100svh - var(--bar-top) - var(--header) - 3rem));justify-self:center}
.b-horizon.is-pin .hz-step__btn{cursor:pointer}
.b-horizon.is-flow .hz-step .hz-step__body{display:block}
.b-horizon.is-flow .hz-step{transition:opacity .45s var(--ease)}
.b-horizon.is-flow .hz-step:not(.is-on){opacity:.42}
.b-horizon.is-flow .hz-step:not(.is-on) .hz-step__title{color:var(--ink-strong)}
.hz-progress{display:none}
.b-horizon.is-pin .hz-progress{display:flex;gap:.35rem;margin-top:1.25rem}
.hz-progress span{height:2px;flex:1;background:var(--rule-strong);overflow:hidden}
.hz-progress span::after{content:"";display:block;height:100%;background:var(--ink-strong);transform-origin:0 50%;transform:scaleX(var(--p,0))}
@media (max-width:55.99rem){
  .b-horizon.is-flow .hz-art{position:sticky;top:calc(var(--bar-top) + var(--header) + .5rem);z-index:2;width:min(100%,40svh);justify-self:center;box-shadow:0 0 0 .75rem var(--sec-bg,var(--bg))}
  .b-horizon.is-flow .hz-step{min-height:34svh}
  .b-horizon.is-flow .hz-step:last-child{min-height:0}
}

/* ------------------------------------------------------------------ why the early years: the return curve (1 Nov 2026)
   A dark panel: head (title | lede and body), the drawing over a darkened street still, then sourced figures. */
.b-curve__head,.b-transition__head{display:grid;gap:1.25rem 3rem;margin-bottom:clamp(1.75rem,3vw,2.75rem)}
@media (min-width:64rem){.b-curve__head,.b-transition__head{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:end}}
.b-curve__head .eyebrow,.b-transition__head .eyebrow{margin-bottom:1rem}
.b-curve__lede{margin:0 0 1rem;font:400 clamp(1.25rem,1.1rem + .5vw,1.55rem)/1.3 var(--serif);color:var(--on-dark);text-wrap:pretty}
.b-curve__head p:not(.eyebrow):not(.b-curve__lede){margin:0;max-width:38em;font-size:var(--fs-small);line-height:1.6;color:var(--on-dark-soft)}
.cv{position:relative;margin:0;display:grid;gap:.75rem;padding:clamp(1rem,3vw,2.25rem) clamp(.75rem,3vw,2.25rem) clamp(1rem,2vw,1.5rem);border-radius:var(--r-card);overflow:hidden;isolation:isolate}
.cv-photo{position:absolute;inset:0;z-index:-2;max-width:none;height:100%}
.cv-photo img{width:100%;height:100%;object-fit:cover;border-radius:0;filter:saturate(.75)}
.cv--photo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(30,28,27,.78),rgba(30,28,27,.62) 45%,rgba(30,28,27,.86))}
.cv .rights-tag{display:none}
.cv-svg{display:block;width:100%;max-width:62rem;height:auto;margin-inline:auto;overflow:visible}
.cv-caption{text-align:center;font-size:.8125rem;line-height:1.45;color:var(--on-dark-soft)}
.cv-axis{fill:none;stroke:rgba(247,247,242,.42);stroke-width:1.25}
.cv-div{stroke:rgba(247,247,242,.14);stroke-width:1;stroke-dasharray:2 6}
.cv-ylabel,.cv-stage{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;fill:rgba(247,247,242,.66)}
.cv-stage{text-anchor:middle}
.cv-line{fill:none;stroke:#efe4cc;stroke-width:3;stroke-linecap:round}
.cv-glow{fill:none;stroke:rgba(239,228,204,.14);stroke-width:12;stroke-linecap:round}
.cv-note rect{fill:none;stroke:rgba(247,247,242,.42);stroke-width:1.25}
.cv-note--best rect{fill:rgba(155,141,105,.28);stroke:var(--mineral)}
.cv-note--most rect{stroke-dasharray:4 5}
.cv-note text{font-family:var(--mono);font-size:14px;letter-spacing:.1em;text-transform:uppercase;text-anchor:middle;fill:var(--on-dark)}
.cv-flower ellipse{opacity:.62;mix-blend-mode:screen}
.cv-bloom{transform-box:fill-box;transform-origin:center}
.cv-facts{display:grid;gap:1.25rem;margin:clamp(1.75rem,3vw,2.5rem) 0 0}
@media (min-width:48rem){.cv-facts{grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:2rem}.cv-facts[data-count="2"]{--n:2}.cv-facts[data-count="3"]{--n:3}}
.cv-facts>div{display:grid;align-content:start;gap:.35rem;padding-top:1rem;border-top:1px solid var(--rule-on-dark)}
.cv-facts dt{font:400 var(--fs-eyebrow)/1.4 var(--mono);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--mineral)}
.cv-facts dd{margin:0;font-size:var(--fs-small);line-height:1.5;color:var(--on-dark-soft);text-wrap:pretty}
.cv-facts .cv-fact__value{font:400 clamp(2.4rem,1.9rem + 1.8vw,3.4rem)/1 var(--serif);color:var(--on-dark)}
.cv-facts .cv-fact__src .source{color:rgba(247,247,242,.55)}
/* motion: the line draws, the early years fill, the flowers open where the curve reaches them, then the notes */
@media (prefers-reduced-motion:no-preference){
  .cv.is-waiting .cv-line{stroke-dasharray:1;stroke-dashoffset:1}
  .cv .cv-line{stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 2.2s cubic-bezier(.65,0,.35,1) .2s}
  .cv :is(.cv-glow,.cv-area){transition:opacity 1.2s ease 1.4s}
  .cv .cv-bloom{transition:transform 1.6s var(--ease),opacity .8s ease}
  .cv .cv-flower--1 .cv-bloom{transition-delay:.7s}.cv .cv-flower--2 .cv-bloom{transition-delay:1.5s}.cv .cv-flower--3 .cv-bloom{transition-delay:2s}
  .cv :is(.cv-note,.cv-stage){transition:opacity .9s ease 2.3s}.cv .cv-note--most{transition-delay:2.6s}
  .cv.is-waiting :is(.cv-glow,.cv-area,.cv-note,.cv-stage,.cv-bloom){opacity:0}
  .cv.is-waiting .cv-bloom{transform:scale(.2) rotate(-70deg)}
  .cv.is-live .cv-bloom{animation:cv-breathe 9s ease-in-out 3.6s infinite}
  .cv.is-live .cv-flower--2 .cv-bloom{animation-delay:4.6s}.cv.is-live .cv-flower--3 .cv-bloom{animation-delay:5.4s}
}
@keyframes cv-breathe{0%,100%{rotate:0deg}50%{rotate:9deg}}
/* phones: the in-drawing labels would be about 4px, so HTML ones carry the same words */
.cv-keys,.cv-stages{display:none}
@media (max-width:47.99rem){
  .cv-svg :is(.cv-note,.cv-stage,.cv-ylabel){display:none}
  .cv-keys{display:flex;flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none}
  .cv-keys li{padding:.35rem .75rem;border:1px solid rgba(247,247,242,.42);border-radius:100vw;font:400 .6875rem/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--on-dark)}
  .cv-keys li:first-child{border-color:var(--mineral);background:rgba(155,141,105,.28)}
  .cv-keys li:last-child{border-style:dashed}
  .cv-stages{display:grid;grid-template-columns:180fr 156fr 268fr 224fr;margin:-.25rem 3.75% 0 10%;padding:0;list-style:none}
  .cv-stages li{font:400 .625rem/1.3 var(--mono);letter-spacing:.04em;text-transform:uppercase;text-align:center;color:rgba(247,247,242,.66)}
}

/* ------------------------------------------------------------------ accelerating the transition (1 Nov 2026)
   A linen stage. Still by default; live (is-live, signature.js) its track is about two and a half screens tall and the
   frame holds under the header while the dots rise. Reduced motion: a Today / The transition switch. */
.b-transition__lede{margin:0 0 1.1rem;max-width:38em;color:var(--ink);line-height:1.6;text-wrap:pretty}
.b-transition__pull{margin:0;max-width:30em;padding-left:1rem;border-left:2px solid var(--mineral);font:italic 400 clamp(1.15rem,1.05rem + .4vw,1.4rem)/1.35 var(--serif);color:var(--ink-strong);text-wrap:pretty}
.tr-frame{padding-block:clamp(.5rem,2vw,1.5rem)}
.tr-stage{position:relative;display:grid;gap:.75rem;margin:0;padding:clamp(1rem,3vw,2rem) clamp(.75rem,3vw,2.5rem);border-radius:var(--r-card);background:var(--bg)}
.tone-ivory .tr-stage{background:var(--surface-light)}
.tr-scale{margin:0;text-align:center;font:400 clamp(1.1rem,1rem + .4vw,1.35rem)/1.3 var(--serif);color:var(--ink)}
.tr-svg{display:block;width:100%;height:auto;overflow:visible}
.tr-flower ellipse{opacity:.72;mix-blend-mode:multiply}
.tr-base{stroke:var(--rule-strong);stroke-width:1}
.tr-chev{fill:none;stroke:var(--soft);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.tr-level{font-family:var(--serif);font-size:21px;text-anchor:middle;fill:var(--ink-strong)}
.tr-dot{fill:#c4b9aa}.tr-dot--l1{fill:var(--mineral)}.tr-dot--l2{fill:var(--sage)}.tr-dot--l3{fill:#3f564f}
.tr-tag{transition:transform .7s cubic-bezier(.65,0,.35,1),opacity .4s ease}
.tr-tag text{font-family:var(--mono);font-size:13px;letter-spacing:.1em;text-transform:uppercase;text-anchor:middle;fill:var(--soft)}
.tr-states{display:grid}
.tr-state{grid-area:1/1;margin:0;text-align:center;font-size:var(--fs-small);line-height:1.5;color:var(--ink);transition:opacity .35s ease;text-wrap:balance}
.tr-state__k{margin-right:.5rem;font:400 var(--fs-eyebrow)/1 var(--mono);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--sage-deep)}
.b-transition:not(.is-js) .tr-states{gap:.4rem}.b-transition:not(.is-js) .tr-state{grid-area:auto}
.b-transition.is-js .tr-state--next{opacity:0}
.b-transition[data-state="next"] .tr-state--now{opacity:0}.b-transition[data-state="next"] .tr-state--next{opacity:1}
.tr-caption{text-align:center;font-size:.78rem;line-height:1.45;color:var(--soft);text-wrap:balance}
.b-transition__close{margin:clamp(1.5rem,3vw,2.5rem) auto 0;max-width:34em;text-align:center;font:400 clamp(1.3rem,1.15rem + .6vw,1.75rem)/1.3 var(--serif);color:var(--ink-strong);text-wrap:balance}
.tr-switch{display:flex;justify-content:center;gap:.25rem;margin:0 auto;padding:.25rem;border-radius:100vw;background:var(--surface)}
.tr-switch button{min-height:2.75rem;padding:0 1.1rem;border:0;border-radius:100vw;background:transparent;font:inherit;font-size:var(--fs-small);color:var(--ink);cursor:pointer}
.tr-switch button[aria-pressed="true"]{background:var(--surface-light);color:var(--ink-strong)}
.tr-switch button:focus-visible{outline:2px solid var(--ink-strong);outline-offset:2px}
.b-transition.is-live .tr-track{height:250vh;height:250svh}
.b-transition.is-live .tr-frame{position:sticky;top:calc(var(--bar-top) + var(--header) + .75rem);display:grid;align-content:center;min-height:calc(100svh - var(--bar-top) - var(--header) - 1.5rem)}
.b-transition.is-live .tr-stage{width:100%;max-width:calc((100svh - 17rem) * 2.4 + 5rem);margin-inline:auto}
/* rows (narrow stages): levels stacked with Excellent on top, so children visibly rise */
.tr-svg.is-rows .tr-level{text-anchor:start;font-size:19px}
.tr-svg.is-rows :is(.tr-chev,.tr-base){display:none}
.tr-svg.is-rows .tr-tag text{text-anchor:end;font-size:11px}
.tr-svg.is-rows .tr-dot{r:5.5px}
@media print{.b-transition.is-live .tr-track{height:auto}.b-transition.is-live .tr-frame{position:static;min-height:0}}

/* ---------------------------------------------------------------- looking ahead: four in ten of the world's youngest children, 2050 */
.b-continent__head{max-width:60rem}
.af-stage{display:grid;gap:clamp(.75rem,2vw,1.25rem);margin:clamp(2.5rem,5vw,4rem) 0 0;padding:clamp(1.25rem,3vw,2.5rem) clamp(.75rem,3vw,2.5rem);border-radius:var(--r-card);background:var(--bg)}
.af-scale{margin:0;text-align:center;font:400 clamp(1.1rem,1rem + .4vw,1.35rem)/1.3 var(--serif);color:var(--ink)}
.af-svg{display:block;width:100%;max-width:58rem;height:auto;margin-inline:auto;overflow:visible}
.af-land{fill:#d6a12a;fill-opacity:.1;stroke:var(--ink-strong);stroke-opacity:.5;stroke-width:1.25;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.af-dot{fill:#c4b9aa}
.af-dot--africa{fill:#d6a12a}
.af-keys{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem clamp(1.5rem,5vw,4rem);margin:0;padding:0;list-style:none}
.af-key{display:flex;align-items:baseline;gap:.6rem;color:var(--ink)}
.af-key::before{content:"";flex:none;align-self:center;width:.7rem;height:.7rem;border-radius:50%;background:#c4b9aa}
.af-key--africa::before{background:#d6a12a}
.af-key__n{font:400 clamp(2rem,1.5rem + 1.6vw,2.9rem)/1 var(--serif);letter-spacing:-.02em;color:var(--ink-strong);font-variant-numeric:tabular-nums lining-nums;min-width:2ch;text-align:right}
.af-caption{max-width:44rem;margin-inline:auto;text-align:center;font-size:.78rem;line-height:1.45;color:var(--soft);text-wrap:balance}
.af-caption .source{display:block;margin-top:.25rem}
.af-replay{justify-self:center;margin:0;padding:.35rem .9rem;border:1px solid var(--rule-strong);border-radius:999px;background:none;font:inherit;font-size:.8rem;color:var(--soft);cursor:pointer;transition:opacity var(--t-std,.4s) var(--ease,ease),color var(--t-micro,.2s),border-color var(--t-micro,.2s)}
.af-replay:hover{color:var(--ink-strong);border-color:var(--ink-strong)}
.af-replay:focus-visible{outline:2px solid var(--ink-strong);outline-offset:2px}
.b-continent:not(.is-done) .af-replay{opacity:0;pointer-events:none}
.b-continent.is-js .af-land{stroke-dasharray:1 1}
.b-continent.is-js .af-key{transition:opacity .7s var(--ease,ease)}
@media print{.af-replay{display:none}}
@media (max-width:40rem){.af-keys{flex-direction:column;align-items:flex-start;width:fit-content;margin-inline:auto}}

/* control system (site.css): 10px frames and actions, 7px segments */
.lens__tab,.rp__pill span,.rp__custom input,.nw-filter__btn{border-radius:var(--r-ctl,10px)}
.cap-toggle,.tr-switch{border-radius:var(--r-ctl,10px)}
.cap-toggle__btn,.tr-switch button{border-radius:var(--r-seg,7px)}