/* Family Stories section, 10 Oct 2026. Builds on styles.css tokens (graphite, ochre, verdigris, Newsreader / Public Sans / Plex Mono).
   Adds one new family of tokens: sepia, used only for old-photo placeholders and the book preview. */
:root{
  --sep-a:#DCC8A2; --sep-b:#A3835A; --sep-fg:#58402A; --sep-md:#8A6A45; --sep-lt:#E9DABB; --sep-edge:#F5EEDD; --sep-ink:#2A2218;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--sep-a:#BFA77D; --sep-b:#80633F; --sep-lt:#D6C4A0}}
:root[data-theme="dark"]{--sep-a:#BFA77D; --sep-b:#80633F; --sep-lt:#D6C4A0}
.o-s1{stop-color:var(--sep-a)} .o-s2{stop-color:var(--sep-b)}
.o-fg{fill:var(--sep-fg)} .o-md{fill:var(--sep-md)} .o-lt{fill:var(--sep-lt)}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ic{width:1.15em;height:1.15em;flex:none;display:inline-block}
.ic--l{width:34px;height:34px;color:var(--ochre);margin-bottom:.7rem}
.ic--xl{width:46px;height:46px;color:var(--ochre)}
.btn .ic{width:20px;height:20px}
.btn--big{min-height:56px;padding:.8rem 1.7rem;font-size:1.08rem}
.btn--sm{min-height:44px;padding:.45rem 1rem;font-size:.92rem}
.btn--danger:hover{border-color:var(--rust);color:var(--rust);background:transparent}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.hint{font-size:.88rem;color:var(--ink-3);margin:.3rem 0 0}
.field .lbl{display:block;font-weight:600;font-size:.95rem;margin-bottom:.35rem}
.field input[type=text]::placeholder,.field textarea::placeholder{color:var(--ink-3);opacity:1}

/* sample marker */
.samplebar{display:flex;flex-wrap:wrap;gap:.5rem .8rem;align-items:center;margin:0;font:500 .82rem/1.5 var(--f-m);color:var(--ink-2);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:.7rem 0}

/* badges and chips: type is always text + icon, never colour alone */
.badge{display:inline-flex;align-items:center;gap:.35rem;font:600 .74rem/1 var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-radius:999px;padding:.38rem .65rem .38rem .5rem}
.badge .ic{width:15px;height:15px;color:var(--ochre)}
.chips2{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:0 0 1rem}
.chips2__l{font:600 .74rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-right:.3rem}
.chip{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:.3rem .95rem .3rem .8rem;border:1px solid var(--rule);border-radius:999px;background:var(--surface);color:var(--ink);text-decoration:none;font:500 .94rem/1.2 var(--f-b);transition:border-color .18s,background .18s}
.chip .ic{width:17px;height:17px;color:var(--ochre)}
.chip:hover{border-color:var(--ink-3);background:var(--surface-2);color:var(--ink)}
.chip.is-cur{border-color:var(--ochre);box-shadow:inset 0 0 0 1px var(--ochre)}

/* old-photo placeholders: sepia prints with an edge, abstract shapes, no faces */
.old{background:var(--sep-edge);padding:8px;border-radius:3px;box-shadow:0 1px 2px rgba(20,14,6,.25),0 10px 22px -14px rgba(20,14,6,.55);position:relative}
.old svg{width:100%;height:auto;display:block;border-radius:1px}
.old--flat{padding:0;border-radius:0;box-shadow:none}
.oldfig{margin:0}
.oldfig .cap{margin-top:.5rem}
.ph-fb{position:absolute;inset:0;background:var(--surface-2)}
.ph-fb svg{width:100%;height:100%;display:block}
.ph:has(.ph-fb)::after{display:none}

/* teaser (home + how it works) */
.stories-teaser h2 em{color:var(--ochre);font-style:italic}
.stories-teaser .prose p{font-size:1.05rem}

/* stories.html */
.session{padding-bottom:clamp(2rem,4vw,3rem)}
.sesscard{background:var(--surface);border:1px solid var(--rule);border-radius:14px;box-shadow:var(--lift);overflow:hidden}
.sesscard__head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 1.5rem;align-items:center;padding:.9rem clamp(1.1rem,3vw,2rem);background:var(--surface-2);border-bottom:1px solid var(--rule)}
.sesscard__when{margin:0;display:flex;gap:.5rem;align-items:center;font:600 .92rem/1.3 var(--f-m);color:var(--ink)}
.sesscard__when .ic{color:var(--ochre)}
.sesscard__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0}
.sesscard__grid>div{padding:clamp(1.2rem,3vw,2rem)}
.sesscard__side{border-left:1px solid var(--rule)}
.sesscard h2{font-size:clamp(1.6rem,1.6vw + 1rem,2.3rem);margin-bottom:.8rem}
.sesscard__lede{color:var(--ink-2);margin-bottom:1rem}
.sesscard__qs{margin:0;padding:0;list-style:none;display:grid;gap:.55rem}
.sesscard__qs li{position:relative;padding-left:1.4rem;color:var(--ink);font:italic 400 1.1rem/1.45 var(--f-d)}
.sesscard__qs li::before{content:"";position:absolute;left:0;top:.7em;width:.8rem;border-top:2px solid var(--ochre)}
.sesscard__who{font-size:.98rem;color:var(--ink-2);margin:0 0 .8rem}
.sesscard__who b{color:var(--ink)}
.sesscard__btns{display:grid;gap:.6rem;margin-top:1.2rem}
.fbar{display:grid;gap:1rem;margin-bottom:1.4rem}
.fbar__types{display:flex;flex-wrap:wrap;gap:.5rem}
.seg2{appearance:none;display:inline-flex;align-items:center;gap:.45rem;min-height:44px;padding:.4rem 1rem;border:1.5px solid var(--rule);border-radius:999px;background:var(--surface);color:var(--ink-2);font:600 .94rem/1.2 var(--f-b);cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.seg2 .ic{width:17px;height:17px;color:var(--ochre)}
.seg2:hover{border-color:var(--ink-3);color:var(--ink)}
.seg2[aria-pressed="true"]{border-color:var(--verdigris);background:color-mix(in srgb,var(--verdigris) 12%,var(--surface));color:var(--ink);box-shadow:inset 0 0 0 1px var(--verdigris)}
.fbar__sel{display:grid;grid-template-columns:repeat(auto-fit,minmax(9.5rem,1fr));gap:.8rem;align-items:end}
.fbar__sel .btn{min-height:48px}
.fbar__count{font:500 .85rem/1.4 var(--f-m);color:var(--ink-2);margin:0}
.sgrid-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));gap:1.2rem}
.scard{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--rule);border-radius:12px;overflow:hidden;transition:border-color .2s,transform .22s var(--ease),box-shadow .2s}
.scard:hover,.scard:focus-within{border-color:var(--ink-3);transform:translateY(-2px);box-shadow:var(--lift)}
.scard[hidden]{display:none}
.scard__thumb{position:relative;background:var(--surface-2);padding:10px 10px 0}
.scard__thumb .old{padding:6px}
.scard__badge{position:absolute;left:20px;top:20px}
.dur{position:absolute;right:20px;bottom:10px;background:rgba(17,20,22,.86);color:#F0EEE8;font:600 .74rem/1 var(--f-m);padding:.34rem .5rem;border-radius:5px}
.playdot{position:absolute;left:50%;top:50%;transform:translate(-50%,-60%);width:52px;height:52px;border-radius:50%;background:rgba(17,20,22,.78);color:#F0EEE8;display:grid;place-items:center}
.playdot .ic{width:22px;height:22px;margin-left:3px}
.scard__body{padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.scard h3{font-size:1.4rem;line-height:1.18}
.scard h3 a{color:var(--ink);text-decoration:none}
.scard h3 a::after{content:"";position:absolute;inset:0}
.scard h3 a:hover{color:var(--ink);text-decoration:underline;text-decoration-thickness:1.5px}
.scard__by{margin:0;font:500 .78rem/1.4 var(--f-m);color:var(--ink-3)}
.scard__blurb{margin:.2rem 0 0;font-size:.98rem;line-height:1.5;color:var(--ink-2)}
.scard__meta{margin:auto 0 0;padding-top:.6rem;display:flex;flex-wrap:wrap;gap:.3rem .5rem;font:500 .74rem/1.3 var(--f-m);color:var(--ink-2)}
.scard__meta span+span::before{content:"\00b7";margin-right:.5rem;color:var(--ink-3)}
.empty{text-align:center;border:1.5px dashed var(--ink-3);border-radius:12px;padding:2.2rem 1.2rem;background:var(--surface);color:var(--ink-2)}
.empty .ic{width:34px;height:34px;color:var(--ochre);margin:0 auto .6rem}
.empty h3{font-size:1.6rem;margin-bottom:.4rem;color:var(--ink)}
.empty p{margin:0 0 1rem}
.empty--sm{padding:1.2rem;text-align:left}
.empty--sm p{margin:0}
.feat .ic,.privacy-grid .ic{width:28px;height:28px;color:var(--ochre);margin-bottom:.6rem}
@media (min-width:901px){
  .feat.feat--4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .feat.feat--4>div{padding:1.5rem 1.4rem 1.8rem 0;border-left:0}
  .feat.feat--4>div+div{padding-left:1.4rem;border-left:1px solid var(--rule)}
}
.privacy-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1100px){.privacy-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.privacy-grid--4{grid-template-columns:1fr}.feat.feat--4{grid-template-columns:1fr}}

/* story.html */
.storypage{padding-top:clamp(1.6rem,4vw,3rem)}
.story[hidden],.person[hidden],.place[hidden]{display:none}
.story__head{margin:1.2rem 0 clamp(1.4rem,3vw,2.2rem)}
.story__head h1{font-size:clamp(2.2rem,3.8vw + .6rem,3.8rem);line-height:1.05;letter-spacing:-.02em;max-width:22ch;margin-bottom:.9rem}
.story__head .eyebrow{display:flex;align-items:center;gap:.4rem}
.story__by{color:var(--ink-2);margin:0 0 1rem;font-size:1.02rem}
.story__split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(1.2rem,3vw,3rem);align-items:start}
.mediacol{position:relative;display:grid;gap:1rem}
@media (min-width:1000px) and (min-height:640px){.mediacol{position:sticky;top:calc(var(--hdr) + 14px)}}
@media (max-width:999px){.story__split{grid-template-columns:1fr}}
.player{display:grid;gap:.9rem}
.vframe{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:var(--surface-2);border:1px solid var(--rule)}
.vframe picture,.vframe img{width:100%;height:100%;object-fit:cover}
.vframe::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,20,22,0) 55%,rgba(17,20,22,.72));pointer-events:none}
.vframe__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:76px;height:76px;border-radius:50%;border:2px solid rgba(240,238,232,.9);background:rgba(17,20,22,.66);color:#F0EEE8;display:grid;place-items:center;cursor:pointer;transition:transform .18s var(--ease),background .18s}
.vframe__play:hover{background:rgba(17,20,22,.84);transform:translate(-50%,-50%) scale(1.04)}
.vframe__play .ic{width:30px;height:30px;margin-left:4px}
.vframe.is-playing .vframe__play{opacity:.0;pointer-events:none}
.vframe__tag{position:absolute;left:.8rem;bottom:.6rem;z-index:2;margin:0;font:600 .74rem/1.3 var(--f-m);color:#F0EEE8}
.photoframe{padding:0}
.player__box{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:1rem 1rem .8rem;box-shadow:var(--lift)}
.wave{position:relative;height:76px;cursor:pointer;border-radius:6px;touch-action:none;--p:0%}
.wave__base,.wave__on{position:absolute;inset:0;display:flex;align-items:center;gap:2px}
.wave__base{color:color-mix(in srgb,var(--ink-3) 50%,transparent)}
.wave__on{color:var(--ochre);clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.wave i{flex:1;min-width:2px;border-radius:2px;background:currentColor}
.player__row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.5rem}
.t-now,.t-dur{font:600 .9rem/1 var(--f-m);color:var(--ink-2);min-width:3.2rem;font-variant-numeric:tabular-nums}
.t-dur{text-align:right}
.player__ctl{display:flex;align-items:center;gap:.3rem}
.ibtn{appearance:none;width:48px;height:48px;border-radius:50%;border:1px solid transparent;background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background .18s,border-color .18s,transform .18s var(--ease)}
.ibtn:hover{background:var(--surface-2);border-color:var(--rule)}
.ibtn:active{transform:scale(.96)}
.ibtn .ic{width:24px;height:24px}
.ibtn--play{width:60px;height:60px;background:var(--verdigris);color:var(--btn-ink);border-color:var(--verdigris)}
.ibtn--play:hover{background:var(--verdigris-d);border-color:var(--verdigris-d)}
.ibtn--play .ic{width:26px;height:26px}
.ibtn--play .ic path[d^="M7 4.5"]{transform:translateX(1.5px)}
.ibtn--txt{font:600 .9rem/1 var(--f-m);width:52px;border-radius:999px;border-color:var(--rule)}
.player__note{margin:.3rem 0 0;font:500 .76rem/1.45 var(--f-m);color:var(--ink-3)}

.tr{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:1rem clamp(.9rem,2vw,1.4rem) 1rem}
.tr__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1rem;margin-bottom:.6rem}
.tr__bar h2{font-size:1.7rem}
.tr__tools{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center}
.sw{display:inline-flex;align-items:center;gap:.5rem;font-size:.92rem;color:var(--ink-2);min-height:44px;cursor:pointer}
.sw input{width:20px;height:20px;accent-color:var(--verdigris)}
.tr__note{font-size:.9rem;line-height:1.5;color:var(--ink-2);margin:0 0 .8rem;padding:.65rem .8rem;background:var(--surface-2);border-radius:8px;border-left:3px solid var(--ochre)}
.tr__list{list-style:none;margin:0;padding:0;max-height:min(560px,70vh);overflow-y:auto;border-top:1px solid var(--rule-soft);scroll-behavior:auto}
.tl{display:grid;grid-template-columns:4.4rem minmax(0,1fr);gap:.4rem .6rem;padding:.35rem .5rem .35rem .3rem;border-left:3px solid transparent;border-bottom:1px solid var(--rule-soft);transition:background .25s,border-color .25s}
.tl__t{appearance:none;background:transparent;border:0;cursor:pointer;min-height:44px;font:600 .88rem/1 var(--f-m);color:var(--verdigris);text-align:left;padding:0 .3rem;text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:1px;border-radius:4px}
.tl__t:hover{color:var(--verdigris-d);text-decoration-thickness:2px}
.tl__x{margin:0;padding:.65rem 0;font:400 1.12rem/1.6 var(--f-d);color:var(--ink)}
.tl.is-now{border-left-color:var(--ochre);background:color-mix(in srgb,var(--ochre) 12%,var(--surface))}
.is-editing .tl__x,.is-editing .paper{outline:1.5px dashed var(--ink-3);outline-offset:2px;border-radius:6px;padding-left:.5rem;padding-right:.5rem;background:var(--paper)}
.is-editing .tl__x:focus,.is-editing .paper p:focus{outline:3px solid var(--ochre)}
.tr__status{min-height:1.3em;margin:.6rem 0 0;font:500 .8rem/1.4 var(--f-m);color:var(--ink-2)}
.paper{padding:.2rem .2rem 0}
.paper p{font:400 1.2rem/1.75 var(--f-d);color:var(--ink);max-width:62ch}
.paper p:first-child::first-letter{font-size:3.2em;float:left;line-height:.82;padding:.08em .1em 0 0;color:var(--ochre)}
.story__cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;margin-top:clamp(1.6rem,4vw,3rem)}
@media (max-width:999px){.story__cards{grid-template-columns:1fr}}
.mcard{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:1.2rem 1.3rem;display:flex;flex-direction:column;gap:.9rem;align-content:start}
.mcard h2{font-size:1.45rem}
.mcard__small{margin:0;font-size:.94rem;color:var(--ink-2)}
.mcard__btns{display:flex;flex-wrap:wrap;gap:.6rem}
.miniphotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.8rem}
.miniphotos .cap{font-size:.74rem}
.consent{display:flex;gap:.6rem;margin:0;font-size:.98rem;color:var(--ink)}
.consent .ic{color:var(--verdigris);margin-top:.2rem;width:20px;height:20px}
.vis{border:0;padding:0;margin:0;display:grid;gap:.6rem;min-width:0}
.vrow{display:flex;gap:.8rem;align-items:flex-start;border:1.5px solid var(--rule);border-radius:10px;padding:.8rem .95rem;background:var(--paper);cursor:pointer;min-height:48px}
.vrow input{margin-top:.3rem;width:20px;height:20px;accent-color:var(--verdigris);flex:none}
.vrow b{display:block;font-weight:600}
.vrow span span{font-size:.92rem;color:var(--ink-2)}
.vrow:has(input:checked){border-color:var(--verdigris);background:color-mix(in srgb,var(--verdigris) 9%,var(--surface))}
.vis__people{padding:.2rem .4rem .4rem 2.2rem}
.vis__checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:.1rem .8rem}
.vis__checks .check{min-height:44px;align-items:center}
.vis__out{margin:.2rem 0 0;font-size:.92rem;color:var(--ink-2);padding:.6rem .8rem;border-radius:8px;background:var(--surface-2);border-left:3px solid var(--verdigris)}
.vis__out.warn{border-left-color:var(--rust);color:var(--ink)}
.vis__out .ic{width:16px;height:16px;vertical-align:-3px;margin-right:.3rem}

/* person-stories.html */
.phead2{margin:1.2rem 0 1.4rem}
.phead2__row{display:flex;flex-wrap:wrap;gap:1.4rem;align-items:center}
.phead2 h1{font-size:clamp(2.6rem,4.8vw + .6rem,4.6rem);line-height:1.02;letter-spacing:-.02em}
.phead2__meta{margin:.4rem 0 1rem;color:var(--ink-2)}
.phead2__btns{display:flex;flex-wrap:wrap;gap:.7rem;margin:0}
.mono-avatar{width:104px;height:104px;border-radius:50%;background:linear-gradient(150deg,var(--sep-md),var(--sep-fg));display:grid;place-items:center;box-shadow:0 0 0 4px var(--sep-edge),0 10px 24px -14px rgba(20,14,6,.6);flex:none}
.mono-avatar span{font:italic 400 3.4rem/1 var(--f-d);color:var(--sep-edge)}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:1.6rem 0 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.stats div{padding:.9rem 1rem .9rem 0}
.stats div+div{padding-left:1rem;border-left:1px solid var(--rule)}
.stats dt{font:600 .74rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.stats dd{margin:.1rem 0 0;font:400 2.4rem/1 var(--f-d);color:var(--ink)}
.blk{margin-top:clamp(2rem,4vw,3.4rem)}
.blk h2{font-size:clamp(1.7rem,1.6vw + 1rem,2.3rem);margin-bottom:1rem}
.blk__lede{color:var(--ink-2);max-width:60ch;margin:-.4rem 0 1.2rem}
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:1.2rem}
.ask{margin-top:clamp(2rem,4vw,3.4rem);background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:clamp(1.2rem,3vw,2rem);border-top:3px solid var(--ochre)}
.ask h2{font-size:clamp(1.7rem,1.6vw + 1rem,2.3rem);margin-bottom:.4rem}
.ask__lede{color:var(--ink-2);margin-bottom:1rem;max-width:60ch}
.ask__list{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.ask__list li{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;justify-content:space-between;border:1px solid var(--rule);background:var(--paper);border-radius:10px;padding:.7rem 1rem}
.ask__list li>span{font:italic 400 1.15rem/1.4 var(--f-d);flex:1 1 18rem}

/* place.html */
.placehead{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(1.5rem,4vw,4rem);align-items:start;margin:1.2rem 0 0}
.placehead h1{font-size:clamp(2.8rem,5vw + .6rem,5rem);line-height:1;letter-spacing:-.025em;margin-bottom:1rem}
.lead2 p{font-size:1.1rem;color:var(--ink-2);max-width:58ch}
.lead2 em{color:var(--ink);font-style:italic}
@media (max-width:900px){.placehead{grid-template-columns:1fr}}
.tl2{list-style:none;margin:0;padding:0;border-left:3px solid var(--ochre);margin-left:.4rem}
.tl2__row{position:relative;display:grid;grid-template-columns:6.2rem minmax(0,1fr);gap:.4rem 1.2rem;padding:.2rem 0 1.4rem 1.4rem}
.tl2__row::before{content:"";position:absolute;left:-.62rem;top:.78rem;width:.9rem;height:.9rem;border-radius:50%;background:var(--paper);border:3px solid var(--ochre)}
.tl2__row.is-gap::before{border-style:dashed;border-color:var(--ink-3)}
.tl2__d{font:italic 400 1.9rem/1.2 var(--f-d);color:var(--ochre);margin:0}
.tl2__items{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.tl2__items a{display:flex;flex-wrap:wrap;gap:.4rem .8rem;align-items:center;border:1px solid var(--rule);background:var(--surface);border-radius:10px;padding:.55rem .9rem;text-decoration:none;color:var(--ink);min-height:48px;transition:border-color .18s}
.tl2__items a:hover{border-color:var(--ink-3)}
.tli__t{font:400 1.2rem/1.25 var(--f-d)}
.tli__by{font:500 .78rem/1.3 var(--f-m);color:var(--ink-3);margin-left:auto}
.tl2__gap{margin:0;padding:.7rem 0;font:500 .86rem/1.4 var(--f-m);color:var(--ink-3)}
.tl2__nat{margin:.7rem 0 0;font-size:.95rem;color:var(--ink-2);border-left:3px solid var(--ink-3);padding:.2rem 0 .2rem .8rem}
.tl2__nat .mono{font-weight:600;color:var(--ink)}
@media (max-width:560px){.tl2__row{grid-template-columns:1fr}.tli__by{margin-left:0}}

/* photos.html */
.updo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.2rem,3vw,2.4rem);align-items:start}
@media (max-width:900px){.updo{grid-template-columns:1fr}}
.drop{display:grid;min-height:300px;border:2px dashed var(--ink-3);border-radius:14px;background:var(--surface);padding:1.5rem;transition:border-color .2s,background .2s}
.drop--s{min-height:240px}
.drop__in{display:grid;justify-items:center;align-content:center;gap:.4rem;text-align:center}
.drop__t{font:400 1.7rem/1.2 var(--f-d);margin:.4rem 0 0}
.drop__s{margin:0 0 1rem;color:var(--ink-2);max-width:34ch;font-size:.98rem}
.drop.is-over{border-color:var(--verdigris);background:color-mix(in srgb,var(--verdigris) 9%,var(--surface))}
.drop label.btn{cursor:pointer;position:relative}
.drop label.btn:focus-within{outline:3px solid var(--ochre);outline-offset:3px}
.tray{margin-top:1rem}
.tray__empty{margin:0;font-size:.95rem;color:var(--ink-2);padding:.8rem 1rem;border:1px dashed var(--rule);border-radius:10px}
.tray__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.7rem}
.tray__list li{border:1px solid var(--rule);border-radius:8px;overflow:hidden;background:var(--surface);font:500 .74rem/1.3 var(--f-m);color:var(--ink-2)}
.tray__list img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.tray__list .fi{display:grid;place-items:center;aspect-ratio:4/3;background:var(--surface-2);color:var(--ochre)}
.tray__list .fi .ic{width:32px;height:32px}
.tray__list span.nm{display:block;padding:.4rem .5rem;word-break:break-all}
.bulk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;margin-top:clamp(1.6rem,3vw,2.4rem)}
.bulk>div{border-top:2px solid var(--ochre);padding-top:.8rem}
.bulk .ic{width:26px;height:26px;color:var(--ochre);margin-bottom:.4rem}
.bulk h3{font-size:1.35rem;margin-bottom:.3rem}
.bulk p{margin:0;color:var(--ink-2);font-size:.98rem}
@media (max-width:900px){.bulk{grid-template-columns:1fr}}
.tips{list-style:none;margin:0;padding:0;counter-reset:tp;display:grid;gap:.4rem}
.tips li{counter-increment:tp;position:relative;padding:.7rem 0 .7rem 3rem;border-bottom:1px solid var(--rule);color:var(--ink-2);font-size:1.02rem}
.tips li::before{content:counter(tp);position:absolute;left:0;top:.6rem;width:2rem;height:2rem;border-radius:50%;border:1.5px solid var(--ochre);display:grid;place-items:center;font:600 .85rem/1 var(--f-m);color:var(--ochre)}
.tips b{color:var(--ink)}
.tagger{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(1.2rem,3vw,2.6rem);align-items:start}
@media (max-width:900px){.tagger{grid-template-columns:1fr}}
.tagger__photo{position:relative;border-radius:6px;overflow:hidden;box-shadow:0 10px 26px -16px rgba(20,14,6,.6);border:8px solid var(--sep-edge);background:var(--sep-edge)}
.tagger__panel{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:1.2rem 1.3rem;display:grid;gap:.9rem}
.tagger__panel h3{font-size:1.7rem}
.tag-dot{position:absolute;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;border:0;background:transparent;cursor:pointer;display:grid;place-items:center;padding:0}
.tag-dot .ring{position:absolute;inset:7px;border-radius:50%;border:2.5px solid #F5EEDD;background:rgba(17,20,22,.5);transition:background .2s,border-color .2s}
.tag-dot span{position:relative;font:700 .8rem/1 var(--f-m);color:#F5EEDD}
.tag-dot[aria-pressed="true"] .ring{background:var(--ochre);border-color:#F5EEDD}
.tag-dot[aria-pressed="true"] span{color:#17110A}
.tag-dot.is-done .ring{background:var(--verdigris)}
.tag-dot.is-done span{color:#fff}
.tag-dot[aria-pressed="true"].is-done .ring{background:var(--ochre)}
.tag-dot:focus-visible{outline:3px solid var(--ochre);outline-offset:2px;border-radius:50%}
@keyframes ringpulse{0%{box-shadow:0 0 0 0 rgba(245,238,221,.85)}100%{box-shadow:0 0 0 16px rgba(245,238,221,0)}}
.tagger.pulse-fallback .tag-dot .ring{animation:ringpulse 1.1s ease-out 2}
.tagged{font:600 .74rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin:.2rem 0 0}
.tagged__list{list-style:none;margin:0;padding:0;display:grid;gap:.3rem;font-size:.98rem;color:var(--ink)}
.tagged__list li{display:flex;gap:.6rem;align-items:center}
.tagged__list li b{font:600 .8rem/1 var(--f-m);color:var(--ochre);min-width:4.2rem}
.tagged__list .is-empty{color:var(--ink-2)}
.rec{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1rem}
.rec__btn{appearance:none;display:inline-flex;align-items:center;gap:.5rem;min-height:56px;padding:.6rem 1.4rem;border-radius:999px;border:1.5px solid var(--verdigris);background:var(--verdigris);color:var(--btn-ink);font:600 1.02rem/1 var(--f-b);cursor:pointer;transition:background .18s,transform .18s var(--ease)}
.rec__btn:hover{background:var(--verdigris-d);border-color:var(--verdigris-d)}
.rec__btn .ic{width:22px;height:22px}
.rec__btn[aria-pressed="true"]{background:var(--rust);border-color:var(--rust);color:#fff}
.rec--c .rec__btn{min-height:48px;padding:.4rem 1.1rem}
.rec__meter{display:flex;align-items:center;gap:2px;height:40px;flex:1 1 8rem;min-width:7rem;color:color-mix(in srgb,var(--ink-3) 50%,transparent)}
.rec__meter i{flex:1;height:20%;border-radius:2px;background:currentColor;transition:height .12s linear}
.rec.is-live .rec__meter{color:var(--rust)}
.rec__time{font:600 1rem/1 var(--f-m);color:var(--ink);font-variant-numeric:tabular-nums;min-width:3rem}
.rec__hint{margin-top:.6rem}
.albtool{margin-bottom:1rem}
.album{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:1.4rem 1.2rem}
.album[hidden]{display:none}
.albc{margin:.6rem 0 0;display:grid;gap:.15rem;font-size:.92rem;color:var(--ink-2)}
.albc b{color:var(--ink);font-weight:600}
.albc span{font:500 .76rem/1.3 var(--f-m);color:var(--ink-3)}
.tagstate{display:inline-flex;align-items:center;gap:.3rem}
.tagstate .ic{width:14px;height:14px;color:var(--verdigris)}
.tagstate.is-yes{color:var(--ink-2)!important}
.shoebox{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.2rem,4vw,3rem);align-items:center;border:1.5px dashed var(--ink-3);border-radius:14px;padding:clamp(1rem,3vw,2rem);background:var(--surface)}
.shoebox[hidden]{display:none}
@media (max-width:900px){.shoebox{grid-template-columns:1fr}}

/* record.html */
.methods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;margin-top:1.6rem}
.method{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:1.4rem 1.4rem 1.5rem}
.method h2{font-size:2rem;margin-bottom:.5rem}
.method__s{color:var(--ink-2);font-size:1rem}
.method ol{margin:0;padding-left:1.2rem;color:var(--ink-2);font-size:.98rem}
.method li{margin:.4rem 0}
@media (max-width:900px){.methods{grid-template-columns:1fr}}
.say{margin-top:1.4rem;border-left:3px solid var(--ochre);background:var(--surface);border-radius:0 10px 10px 0;padding:.9rem 1.1rem}
.say__l{font:600 .74rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ochre);margin:0 0 .3rem}
.say p:last-child{margin:0;font:italic 400 1.15rem/1.55 var(--f-d)}
.recpanel{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:1.3rem;box-shadow:var(--lift)}
.wa{margin-top:1.2rem;border:1px solid var(--rule);border-radius:10px;padding:1rem 1.2rem;background:var(--surface)}
.wa h3{font-size:1.35rem;margin-bottom:.4rem}
.wa ol{margin:0;padding-left:1.2rem;color:var(--ink-2);font-size:.98rem}
.wa li{margin:.35rem 0}
.ckgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
@media (max-width:900px){.ckgrid{grid-template-columns:1fr}}
.ck{border:1px solid var(--rule);border-radius:12px;background:var(--surface);padding:1rem 1.2rem 1.1rem;margin:0;min-width:0}
.ck legend{font:600 .78rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ochre);padding:0 .4rem}
.ck .check{margin:.2rem 0;padding:.35rem 0;align-items:flex-start;color:var(--ink)}
.ckcount{margin:1rem 0 0;font:600 .88rem/1.3 var(--f-m);color:var(--ink-2)}
.kitcard{margin-top:1.6rem;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:1.4rem;align-items:center;border:1px solid var(--rule);background:var(--paper);border-radius:14px;padding:clamp(1.2rem,3vw,2rem)}
.kitcard h3{font-size:1.7rem;margin-bottom:.4rem}
.kitcard p{margin:0;color:var(--ink-2);max-width:56ch}
.kitcard .btn{width:100%}
@media (max-width:900px){.kitcard{grid-template-columns:1fr}}

/* keepsake.html */
.bk{display:grid;grid-template-columns:minmax(0,1fr) 21rem;gap:clamp(1.4rem,3vw,2.6rem);align-items:start;margin-top:1.6rem}
.bk__steps{list-style:none;margin:0;padding:0;display:grid;gap:1.2rem}
.bkstep{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:1.3rem 1.4rem 1.4rem}
.bkstep h2{font-size:1.6rem;margin-bottom:.9rem;display:flex;gap:.7rem;align-items:center}
.bkstep .n{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:50%;border:1.5px solid var(--ochre);color:var(--ochre);font:600 .9rem/1 var(--f-m);flex:none}
.opt2{display:grid;gap:.6rem}
.bk__stories{display:grid;gap:.1rem;max-height:22rem;overflow:auto;padding-right:.4rem}
.bk__stories .check{align-items:center;min-height:44px;color:var(--ink)}
.bk__stories .check[hidden]{display:none}
.bk__stories i{font-size:.86rem;color:var(--ink-3);font-style:normal;font-family:var(--f-m)}
.spread{display:grid;grid-template-columns:1fr 1fr;border:1px solid #CDBF9F;border-radius:6px;overflow:hidden;background:#FBF6EA;color:var(--sep-ink);box-shadow:var(--lift)}
.spread__l{padding:1.1rem 1rem 1.2rem 1.1rem;border-right:1px solid #DCCFB2;background:linear-gradient(90deg,#FBF6EA 80%,#F0E7D2)}
.spread__l .old{box-shadow:0 6px 14px -10px rgba(20,14,6,.6)}
.spread__cap{margin:.6rem 0 0;font:italic 400 .88rem/1.4 var(--f-d)}
.spread__r{padding:1.3rem 1.3rem 1.2rem;background:linear-gradient(270deg,#FBF6EA 80%,#F0E7D2)}
.spread__k{font:600 .7rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:#7A5A2E;margin:0 0 .5rem}
.spread__h{font:400 1.5rem/1.15 var(--f-d);margin:0 0 .6rem}
.spread__t{font:400 1rem/1.6 var(--f-d);margin:0 0 .8rem}
.spread__f{font:500 .7rem/1.3 var(--f-m);color:#6B5638;margin:0}
.bk__sum{position:sticky;top:calc(var(--hdr) + 14px);background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:1.3rem;box-shadow:var(--lift)}
.bk__sum h2{font-size:1.7rem;margin-bottom:.8rem}
.bk__sum dl{margin:0 0 1rem}
.bk__sum dl div{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0;border-bottom:1px solid var(--rule-soft)}
.bk__sum dt{font:600 .74rem/1.6 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.bk__sum dd{margin:0;font-weight:600;text-align:right}
.bk__price{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 .5rem;font:600 .74rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.bk__price b{font:italic 400 1.6rem/1.1 var(--f-d);letter-spacing:0;text-transform:none;color:var(--ochre)}
.bk__small{font-size:.9rem;color:var(--ink-2)}
.bk__sum .btn{width:100%}
@media (max-width:999px){.bk{grid-template-columns:1fr}.bk__sum{position:static}}
@media (max-width:560px){.spread{grid-template-columns:1fr}.spread__l{border-right:0;border-bottom:1px solid #DCCFB2}.sesscard__side{border-left:0;border-top:1px solid var(--rule)}}
@media (max-width:900px){.sesscard__grid{grid-template-columns:1fr}.sesscard__side{border-left:0;border-top:1px solid var(--rule)}}

@media (prefers-reduced-motion:reduce){
  .scard,.scard:hover{transform:none}
  .tl,.ibtn,.vframe__play{transition:none}
  .rec__meter i{transition:none}
}
@media print{.scard{break-inside:avoid}}

/* ---- additions 10 Oct (later): subnav, dates, timeline, threads, donate ---- */
.subnav{background:var(--surface);border-bottom:1px solid var(--rule)}
.subnav .wrap{display:flex;align-items:center;gap:1rem}
.subnav__l{font:600 .72rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
.subnav__in{display:flex;gap:.1rem;overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.subnav a{flex:none;display:inline-flex;align-items:center;min-height:48px;padding:.4rem .85rem;color:var(--ink-2);text-decoration:none;font-weight:500;font-size:.94rem;white-space:nowrap}
.subnav a:hover{color:var(--ink);background:var(--surface-2)}
.subnav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -3px 0 var(--ochre);font-weight:600}
@media (max-width:640px){.subnav__l{display:none}}
.fb-tag{position:absolute;left:.7rem;bottom:.6rem;font:600 .7rem/1 var(--f-m);letter-spacing:.06em;text-transform:uppercase;background:var(--paper);color:var(--ink-2);border:1px solid var(--rule);border-radius:4px;padding:.3rem .45rem}
.form--wide{max-width:none}
.datefield__row{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:.6rem}
@media (max-width:480px){.datefield__row{grid-template-columns:1fr}}
.chips-row{display:flex;flex-wrap:wrap;gap:.5rem}
.chips-row .seg2{font-weight:500;font-size:.9rem;text-align:left}

/* timeline */
.tlx__note{margin:1rem 0 1.4rem;font-size:.98rem;color:var(--ink-2);max-width:70ch}
.tlx__note b{color:var(--ink)}
.tlf{display:grid;grid-template-columns:minmax(0,18rem) auto;gap:1rem 2rem;align-items:end;margin-bottom:1.6rem}
.tlf__k{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.2rem 1.4rem;align-items:center}
.tlf__k legend{padding:0;margin-bottom:.2rem}
.tlf .fbar__count{grid-column:1/-1}
@media (max-width:640px){.tlf{grid-template-columns:1fr}}
.tlx{list-style:none;margin:0;padding:0;border-left:3px solid var(--ochre);margin-left:.4rem}
.tlx__row{position:relative;display:grid;grid-template-columns:7rem minmax(0,1fr);gap:.3rem 1.2rem;padding:.2rem 0 2rem 1.4rem}
.tlx__row::before{content:"";position:absolute;left:-.62rem;top:.85rem;width:.9rem;height:.9rem;border-radius:50%;background:var(--paper);border:3px solid var(--ochre)}
.tlx__row.is-gap::before{border-style:dashed;border-color:var(--ink-3)}
.tlx__row[hidden]{display:none}
.tlx__d{font:italic 400 2rem/1.2 var(--f-d);color:var(--ochre);margin:0}
.tlx__items{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:1rem}
.tlx__i[hidden]{display:none}
.tlx__i a{display:grid;gap:.4rem;height:100%;align-content:start;text-decoration:none;color:var(--ink);background:var(--surface);border:1px solid var(--rule);border-radius:10px;padding:.7rem;transition:border-color .18s}
.tlx__i a:hover{border-color:var(--ink-3);color:var(--ink)}
.tlx__photo a{padding:.5rem .5rem .8rem}
.tlx__photo .old{padding:5px}
.tlx__photo a>.tlx__t,.tlx__photo a>.tlx__m{padding:0 .3rem}
.tlx__story a>.badge{justify-self:start}
.tlx__t{font:400 1.2rem/1.25 var(--f-d)}
.tlx__m{font:500 .76rem/1.4 var(--f-m);color:var(--ink-3)}
.tlx__event{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.3rem 1rem;align-items:baseline;border:1.5px dashed var(--ochre);border-radius:10px;padding:.7rem 1rem;background:color-mix(in srgb,var(--ochre) 7%,var(--paper))}
.tlx__yr{font:600 1.1rem/1 var(--f-m);color:var(--ochre)}
.tlx__gap{margin:0;padding:.6rem 0;font:500 .86rem/1.4 var(--f-m);color:var(--ink-3)}
.tlx__gap[hidden]{display:none}
@media (max-width:640px){.tlx__row{grid-template-columns:1fr}}

/* threads */
.thread-start{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(1.2rem,3vw,3rem);align-items:start;border:1px solid var(--rule);background:var(--surface);border-radius:14px;padding:clamp(1.2rem,3vw,2rem);box-shadow:var(--lift);margin-top:1.4rem}
@media (max-width:900px){.thread-start{grid-template-columns:1fr}}
.replies{list-style:none;margin:0;padding:0;display:grid;gap:1.2rem;max-width:56rem}
.reply{background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:1.1rem 1.2rem 1.2rem;display:grid;gap:.9rem}
.reply__who{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center}
.reply__who>div:nth-child(2){flex:1 1 14rem;min-width:0}
.reply__n,.reply__t{margin:0}
.reply__n b{font-size:1.1rem}
.reply__p{display:inline-flex;align-items:center;gap:.3rem;color:var(--ink-2);font-size:.95rem;margin-left:.4rem}
.reply__p .ic,.reply__t .ic{width:16px;height:16px;color:var(--ochre)}
.reply__t{display:flex;align-items:center;gap:.4rem;font:500 .8rem/1.4 var(--f-m);color:var(--ink-2)}
.reply__b{margin:0;display:flex;flex-wrap:wrap;gap:.4rem}
.reply__x{margin:0;font:400 1.15rem/1.6 var(--f-d);color:var(--ink);max-width:62ch}
.reply .player{max-width:36rem}
.reply .player__note,.reply .t-dur+*{display:none}
.reply .oldfig{max-width:16rem}
.reply .ibtn[data-skip]{display:none}
.mono-avatar--s{width:52px;height:52px;box-shadow:0 0 0 3px var(--sep-edge)}
.mono-avatar--s span{font-size:1.7rem}
.fwd{display:inline-flex;align-items:center;gap:.35rem;font:600 .74rem/1 var(--f-m);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);border:1px dashed var(--ink-3);border-radius:999px;padding:.38rem .65rem .38rem .5rem}
.fwd .ic{width:14px;height:14px;color:var(--ochre)}
.share{margin-top:1.2rem;border:1px solid var(--rule);border-radius:10px;padding:1rem 1.2rem;background:var(--surface)}
.share h3{font-size:1.35rem;margin-bottom:.4rem}
.share ol{margin:0;padding-left:1.2rem;color:var(--ink-2);font-size:.98rem}
.share li{margin:.35rem 0}
.notif{border:0;padding:0;margin:1.2rem 0 0;display:grid;gap:.5rem}
.notif .check{align-items:flex-start;color:var(--ink-2);padding:.3rem 0}
.notif .check b{color:var(--ink);display:block}
.notifcard{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:1rem 1.2rem;box-shadow:var(--lift);max-width:26rem}
.notifcard p{margin:0}
.notifcard__l{font:600 .7rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:.5rem!important}
.notifcard__h{font:400 1.3rem/1.25 var(--f-d)}
.notifcard__b{margin-top:.4rem!important;font-size:.95rem;color:var(--ink-2)}
.callgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}
@media (max-width:900px){.callgrid{grid-template-columns:1fr}}
.callcard{border:1px solid var(--rule);background:var(--surface);border-radius:14px;padding:1.3rem 1.4rem}
.callcard--yes{border-top:3px solid var(--verdigris)}
.callcard:not(.callcard--yes){border-top:3px solid var(--rust)}
.callcard h3{font-size:1.6rem;display:flex;align-items:center;gap:.5rem;margin-bottom:.7rem}
.callcard h3 .ic{width:24px;height:24px}
.callcard--yes h3 .ic{color:var(--verdigris)}
.callcard:not(.callcard--yes) h3 .ic{color:var(--rust)}
.callcard ol,.callcard ul{margin:0;padding-left:1.2rem;color:var(--ink-2)}
.callcard li{margin:.5rem 0}
.callcard b{color:var(--ink)}
.circle{margin-top:1.4rem;border:2px dashed var(--ink-3);border-radius:14px;padding:1.2rem 1.4rem;background:var(--paper)}
.circle__l{font:600 .74rem/1.3 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--ochre);margin:0 0 .3rem}
.circle h3{font-size:1.5rem;margin-bottom:.4rem}
.circle p:last-child{margin:0;color:var(--ink-2);max-width:62ch}

/* donate */
.giveg{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(1.4rem,4vw,3.5rem);align-items:start;margin-top:1.6rem}
@media (max-width:900px){.giveg{grid-template-columns:1fr}}
.tick{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
.tick li{display:flex;gap:.7rem;align-items:flex-start;padding:.55rem 0;border-bottom:1px solid var(--rule);color:var(--ink)}
.tick .ic{width:20px;height:20px;color:var(--verdigris);margin-top:.25rem}
.givecard{background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:clamp(1.2rem,3vw,1.8rem);box-shadow:var(--lift);border-top:3px solid var(--ochre)}
.givecard h2{font-size:1.8rem;margin-bottom:1rem}
.amts-set{border:0;padding:0;margin:0}
.amts-set legend{padding:0}
.amts{display:flex;flex-wrap:wrap;gap:.5rem}
.amt{position:relative;display:inline-flex;align-items:center;min-height:48px;padding:.4rem 1.1rem;border:1.5px solid var(--rule);border-radius:999px;background:var(--paper);color:var(--ink);font-weight:600;cursor:pointer}
.amt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer}
.amt:has(input:checked){border-color:var(--verdigris);background:color-mix(in srgb,var(--verdigris) 12%,var(--surface));box-shadow:inset 0 0 0 1px var(--verdigris)}
.amt:has(input:focus-visible){outline:3px solid var(--ochre);outline-offset:2px}
.story__split>*,.mediacol>*,.player,.player__box{min-width:0}
@media (max-width:560px){
  .player__row{flex-wrap:wrap}
  .player__ctl{order:3;flex:1 0 100%;justify-content:center;margin-top:.2rem}
  .t-dur{margin-left:auto}
}