/* ============================================================
   EDIT THESE: search the file for  #REPLACE-LINK  and swap in
   your real URLs (Amazon listings, Whop membership, samples).
   For the email form, replace  action="#REPLACE-FORM-ACTION"
   with the form action URL from your email provider.
   ============================================================ */

:root{
  --night:#12131A;
  --night-2:#171922;
  --night-3:#1D202A;
  --dawn:#EDE8E2;
  --dawn-2:#E4DDD5;
  --ink:#191720;
  --ink-soft:#4A4552;
  --bone:#F2EEE9;
  --bone-dim:rgba(242,238,233,.70);
  --bone-faded:rgba(242,238,233,.55);
  --gold:#E3B173;
  --gold-deep:#9A6C2E;
  --line-dark:rgba(242,238,233,.14);
  --line-light:rgba(25,23,32,.16);

  --display:"Newsreader",Georgia,"Times New Roman",serif;
  --body:"Karla",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;

  --s--1:clamp(.78rem,.75rem + .15vw,.86rem);
  --s-0:clamp(1rem,.96rem + .2vw,1.08rem);
  --s-1:clamp(1.15rem,1.05rem + .5vw,1.4rem);
  --s-2:clamp(1.45rem,1.25rem + 1vw,2rem);
  --s-3:clamp(1.95rem,1.55rem + 2vw,3rem);
  --s-4:clamp(2.5rem,1.75rem + 3.6vw,4.5rem);

  --wrap:min(100% - 2.5rem, 68rem);
  --pad-y:clamp(4rem,10vw,8.5rem);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0;
  background:var(--night);
  color:var(--bone);
  font-family:var(--body);
  font-size:var(--s-0);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
h1,h2,h3{font-family:var(--display);font-weight:300;line-height:1.08;margin:0;letter-spacing:-.015em}
p{margin:0}
a{color:inherit}

.wrap{width:var(--wrap);margin-inline:auto}

.eyebrow{
  font-size:var(--s--1);
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 1.1rem;
}
.tone-light .eyebrow{color:var(--gold-deep)}

.skip{
  position:absolute;left:-999px;top:0;z-index:100;
  background:var(--bone);color:var(--ink);padding:.75rem 1rem;border-radius:2px;
}
.skip:focus{left:.75rem;top:.75rem}

:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}

/* ---------- header ---------- */
.site-head{
  position:sticky;top:0;z-index:50;
  background:rgba(18,19,26,.82);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-dark);
}
.head-in{
  width:var(--wrap);margin-inline:auto;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  min-height:60px;
}
.mark{
  font-family:var(--display);
  font-size:1.05rem;letter-spacing:.01em;text-decoration:none;
  display:flex;align-items:center;gap:.6rem;
}
.mark span{color:var(--bone-dim);font-size:.72rem;font-family:var(--body);letter-spacing:.16em;text-transform:uppercase;display:none}
@media(min-width:44rem){.mark span{display:inline}}
.mark-dot{
  width:9px;height:9px;border-radius:50%;background:var(--gold);flex:none;
  box-shadow:0 0 0 4px rgba(227,177,115,.14);
}
.head-nav{display:flex;align-items:center;gap:1.6rem}
.head-links{display:none;gap:1.6rem}
@media(min-width:52rem){.head-links{display:flex}}
.head-links a{
  font-size:var(--s--1);letter-spacing:.1em;text-transform:uppercase;
  color:var(--bone-dim);text-decoration:none;font-weight:500;
}
.head-links a:hover{color:var(--bone)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  min-height:46px;padding:.7rem 1.35rem;
  font-family:var(--body);font-size:var(--s--1);font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;
  text-decoration:none;border:1px solid transparent;border-radius:999px;
  cursor:pointer;transition:transform .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease;
}
.btn:active{transform:translateY(1px)}
.btn-gold{background:var(--gold);color:#1B1508}
.btn-gold:hover{background:#EFC48D}
.btn-ghost{border-color:var(--line-dark);color:var(--bone)}
.btn-ghost:hover{border-color:var(--bone-faded);background:rgba(242,238,233,.05)}
.btn-ink{background:var(--ink);color:var(--dawn)}
.btn-ink:hover{background:#2C2836}
.btn-outline-ink{border-color:var(--line-light);color:var(--ink)}
.btn-outline-ink:hover{background:rgba(25,23,32,.06)}
.btn-sm{min-height:40px;padding:.5rem 1rem}

/* ---------- section tones ---------- */
.sec{padding-block:var(--pad-y)}
.tone-night{background:var(--night)}
.tone-night-2{background:linear-gradient(180deg,var(--night) 0%,var(--night-2) 55%,var(--night-3) 100%)}
.tone-night-3{background:var(--night-3)}
.tone-light{background:var(--dawn);color:var(--ink)}
.tone-light-2{background:var(--dawn-2);color:var(--ink)}
.tone-break{height:clamp(3rem,8vw,6rem);background:linear-gradient(180deg,var(--night-3) 0%,#4A4450 46%,#A79C9E 74%,var(--dawn) 100%)}

/* ---------- hero ---------- */
.hero{padding-top:clamp(3rem,8vw,5.5rem);padding-bottom:clamp(3.5rem,8vw,6rem);position:relative;overflow:hidden}
.hero::after{
  content:"";position:absolute;inset:auto 50% -55% auto;
  transform:translateX(50%) scale(var(--glow-scale,1));
  width:min(120vw,60rem);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(227,177,115,.10) 0%,rgba(227,177,115,0) 62%);
  opacity:var(--glow,.75);
  transition:opacity var(--phase,4000ms) cubic-bezier(.37,0,.63,1),
             transform var(--phase,4000ms) cubic-bezier(.37,0,.63,1);
  pointer-events:none;
}
.hero-in{position:relative;z-index:1;display:grid;gap:clamp(2.5rem,6vw,4.5rem);align-items:center}
@media(min-width:60rem){.hero-in{grid-template-columns:1.05fr .95fr}}
.hero h1{font-size:var(--s-4);max-width:14ch}
.hero h1 em{font-style:italic;color:var(--gold);font-weight:200}
.hero-sub{margin-top:1.5rem;font-size:var(--s-1);color:var(--bone-dim);max-width:36ch;line-height:1.5}
.hero-note{margin-top:1.6rem;font-size:var(--s--1);color:var(--bone-faded);max-width:34ch}

/* ---------- breath pacer ---------- */
.pacer{display:flex;flex-direction:column;align-items:center;gap:1.5rem}
.pacer-stage{
  width:min(74vw,19rem);aspect-ratio:1;
  display:grid;place-items:center;position:relative;
}
.ring,.orb{position:absolute;border-radius:50%}
.ring{
  inset:0;border:1px solid rgba(242,238,233,.16);
}
.ring::before{
  content:"";position:absolute;inset:14%;border-radius:50%;
  border:1px dashed rgba(242,238,233,.10);
  animation:drift 90s linear infinite;
}

/* the arc is the timer: it fills on the way in, empties on the way out */
.arc{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}
.arc-fill{
  --c:311.02;
  fill:none;stroke:var(--gold);stroke-width:.72;stroke-linecap:round;
  stroke-dasharray:var(--c);stroke-dashoffset:var(--c);
  filter:drop-shadow(0 0 7px rgba(227,177,115,.4));
  transition:stroke-dashoffset var(--phase,4000ms) cubic-bezier(.37,0,.63,1);
}
.arc-fill.is-in{stroke-dashoffset:0}

.orb{
  width:64%;height:64%;
  background:radial-gradient(circle at 46% 42%,rgba(255,230,200,.6),rgba(227,177,115,.34) 44%,rgba(227,177,115,.09) 76%,rgba(227,177,115,0) 100%);
  box-shadow:0 0 70px rgba(227,177,115,.30);
  transform:scale(.58);
  transition:transform var(--phase,4000ms) cubic-bezier(.37,0,.63,1),
             opacity var(--phase,4000ms) ease,
             filter var(--phase,4000ms) ease;
  opacity:.7;
  animation:idle 6.5s ease-in-out infinite;
}
.orb.is-in{transform:scale(1);opacity:1;filter:blur(0)}
.is-running .orb{animation:none;filter:blur(3px)}
.is-running .orb.is-in{filter:blur(0)}

/* one ring leaves on every out-breath */
.ripple{
  position:absolute;inset:18%;border-radius:50%;pointer-events:none;
  border:1px solid rgba(227,177,115,.5);
  animation:ripple 2.8s cubic-bezier(.16,.7,.3,1) forwards;
}

@keyframes idle{0%,100%{transform:scale(.56);opacity:.6}50%{transform:scale(.66);opacity:.82}}
@keyframes ripple{from{transform:scale(.7);opacity:.5}to{transform:scale(1.6);opacity:0}}
@keyframes drift{to{transform:rotate(360deg)}}

.pacer-label{
  position:relative;z-index:2;text-align:center;
  font-family:var(--display);font-size:var(--s-2);font-weight:300;
}
.pacer-label #phase{display:block;transition:opacity .3s ease,transform .3s ease}
.pacer-label #phase.is-swapping{opacity:0;transform:translateY(6px)}
.pacer-count{display:block;font-family:var(--body);font-size:var(--s--1);letter-spacing:.16em;text-transform:uppercase;color:var(--bone-faded);margin-top:.6rem;transition:color .4s ease}
.is-running .pacer-count{color:var(--gold)}
.pacer-controls{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center}

.pacer-foot{position:relative;width:min(34ch,100%);min-height:4.8em}
.pacer-safety,.pacer-milestone{
  position:absolute;inset:0;text-align:center;
  transition:opacity .9s ease,transform .9s ease;
}
.pacer-safety{font-size:var(--s--1);color:var(--bone-faded)}
.pacer-milestone{
  font-family:var(--display);font-size:var(--s-1);line-height:1.35;color:var(--gold);
  opacity:0;transform:translateY(10px);pointer-events:none;
}
.is-milestone .pacer-safety{opacity:0;transform:translateY(-10px)}
.is-milestone .pacer-milestone{opacity:1;transform:none;pointer-events:auto}

/* ---------- method ---------- */
.method-grid{display:grid;gap:clamp(2rem,5vw,4rem)}
@media(min-width:56rem){.method-grid{grid-template-columns:.85fr 1.15fr;align-items:start}}
.method h2{font-size:var(--s-3);max-width:16ch}
.method p + p{margin-top:1.15rem}
.method-body{color:var(--bone-dim);max-width:58ch;font-size:var(--s-1);line-height:1.6}
.treaty{
  margin-top:2.5rem;padding:1.6rem 1.5rem;
  border-left:2px solid var(--gold);
  background:rgba(242,238,233,.035);
  font-family:var(--display);font-size:var(--s-1);line-height:1.4;color:var(--bone);
}
.treaty small{display:block;margin-top:.9rem;font-family:var(--body);font-size:var(--s--1);letter-spacing:.14em;text-transform:uppercase;color:var(--bone-faded)}

/* ---------- books ---------- */
.sec-head{display:grid;gap:1rem;margin-bottom:clamp(2.5rem,6vw,4rem)}
@media(min-width:52rem){.sec-head{grid-template-columns:1fr auto;align-items:end}}
.sec-head h2{font-size:var(--s-3)}
.sec-head p{color:var(--bone-dim);max-width:42ch}
.tone-light .sec-head p{color:var(--ink-soft)}

.book-grid{display:grid;gap:1.1rem;grid-template-columns:1fr}
@media(min-width:62rem){.book-grid{grid-template-columns:repeat(2,1fr)}}
.book{
  display:grid;gap:1.3rem;
  padding:1.6rem 1.5rem 1.5rem;
  background:rgba(242,238,233,.035);
  border:1px solid var(--line-dark);
  border-radius:4px;
  transition:border-color .25s ease,background-color .25s ease;
}
@media(min-width:34rem){.book{grid-template-columns:152px 1fr;gap:1.7rem}}
.book:hover{border-color:rgba(227,177,115,.4);background:rgba(242,238,233,.055)}
.book-body{display:flex;flex-direction:column;gap:.9rem;min-width:0}
.book.is-lead{
  grid-column:1/-1;
  background:linear-gradient(135deg,rgba(227,177,115,.10),rgba(242,238,233,.03) 60%);
  border-color:rgba(227,177,115,.32);
}
@media(min-width:34rem){.book.is-lead{grid-template-columns:212px 1fr;gap:2.1rem}}
@media(min-width:62rem){.book.is-lead{grid-template-columns:262px 1fr;gap:2.8rem;padding:2.4rem 2.2rem}}

/* covers are printed objects: give them an edge, a spine and weight */
.cover{
  position:relative;align-self:start;
  width:100%;max-width:168px;aspect-ratio:5/8;
  background-color:#0C0D11;background-size:cover;background-position:center;
  border-radius:2px 4px 4px 2px;
  box-shadow:0 16px 34px rgba(0,0,0,.55),0 3px 8px rgba(0,0,0,.45);
  transition:transform .45s cubic-bezier(.2,.7,.3,1),box-shadow .45s ease;
}
.book.is-lead .cover{max-width:208px}
@media(min-width:34rem){.cover,.book.is-lead .cover{max-width:none}}
.cover::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:
    linear-gradient(96deg,rgba(255,255,255,.20) 0 1.2%,rgba(0,0,0,.34) 1.6% 3.4%,rgba(255,255,255,.10) 3.8% 9%,rgba(255,255,255,0) 46%),
    linear-gradient(180deg,rgba(255,255,255,.06),rgba(0,0,0,.10));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.09);
}
.book:hover .cover,.book:focus-within .cover{
  transform:translateY(-6px) rotate(-.5deg);
  box-shadow:0 26px 48px rgba(0,0,0,.6),0 4px 10px rgba(0,0,0,.5);
}
.status{
  display:inline-flex;align-items:center;gap:.5rem;align-self:flex-start;
  font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--bone-faded);
}
.status::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--bone-faded)}
.status.out{color:var(--gold)}
.status.out::before{background:var(--gold);box-shadow:0 0 0 3px rgba(227,177,115,.18)}
.book h3{font-size:var(--s-2);max-width:22ch}
.book.is-lead h3{font-size:var(--s-3);max-width:20ch}
.book.is-lead .book-blurb{max-width:52ch;font-size:var(--s-1);line-height:1.55}
.book-sub{font-family:var(--display);font-style:italic;color:var(--bone-dim);font-size:var(--s-0);line-height:1.4}
.book-blurb{color:var(--bone-dim);font-size:var(--s-0);max-width:46ch}
.book-meta{
  margin-top:auto;padding-top:1rem;border-top:1px solid var(--line-dark);
  display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;justify-content:space-between;
}
.book-spec{font-size:var(--s--1);color:var(--bone-faded);letter-spacing:.04em}
.btn-row{display:flex;gap:.6rem;flex-wrap:wrap}
.coming{
  margin-top:clamp(2rem,5vw,3rem);padding:1.6rem 1.5rem;
  border:1px dashed var(--line-dark);border-radius:4px;
  display:grid;gap:1.2rem;align-items:center;
}
@media(min-width:56rem){.coming{grid-template-columns:1fr auto;padding:1.8rem 2rem}}
.coming .eyebrow{margin-bottom:.6rem}
.coming-list{font-family:var(--display);font-size:var(--s-1);color:var(--bone-dim);line-height:1.5}
.coming-list i{font-style:normal;color:var(--gold);padding-inline:.25rem}
.store-line{margin-top:1.75rem;font-size:var(--s--1);letter-spacing:.1em;text-transform:uppercase;font-weight:600}
.store-line a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(227,177,115,.35);padding-bottom:2px}
.store-line a:hover{border-color:var(--gold)}

/* ---------- book chooser ---------- */
.chooser{display:grid;gap:1.1rem;margin-bottom:clamp(1.75rem,4vw,2.5rem)}
.chooser-q{font-family:var(--display);font-size:var(--s-1);color:var(--bone)}
.chip-row{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{
  min-height:42px;padding:.55rem 1rem;
  font-family:var(--body);font-size:var(--s--1);font-weight:600;letter-spacing:.05em;
  color:var(--bone-dim);background:transparent;
  border:1px solid var(--line-dark);border-radius:999px;cursor:pointer;
  transition:color .25s ease,border-color .25s ease,background-color .25s ease,transform .2s ease;
}
.chip:hover{color:var(--bone);border-color:var(--bone-faded)}
.chip:active{transform:translateY(1px)}
.chip[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:#1B1508}
.chooser-out{
  font-family:var(--display);font-size:var(--s-1);line-height:1.45;color:var(--gold);
  max-width:56ch;opacity:0;transform:translateY(6px);
  transition:opacity .5s ease,transform .5s ease;
}
.chooser-out.is-on{opacity:1;transform:none}

.book{transition:border-color .25s ease,background-color .25s ease,opacity .45s ease,filter .45s ease}
#book-grid.is-filtered .book{opacity:.28;filter:saturate(.35)}
#book-grid.is-filtered .book:hover,#book-grid.is-filtered .book:focus-within{opacity:.8;filter:saturate(.9)}
#book-grid.is-filtered .book.is-pick{opacity:1;filter:none}

/* a filtered grid demotes the standing lead and promotes the pick */
.book-grid.is-filtered .book.is-lead{
  grid-column:auto;background:rgba(242,238,233,.035);border-color:var(--line-dark);
}
.book-grid.is-filtered .book.is-lead .cover{max-width:168px}
.book-grid.is-filtered .book.is-pick{
  grid-column:1/-1;order:-1;
  background:linear-gradient(135deg,rgba(227,177,115,.10),rgba(242,238,233,.03) 60%);
  border-color:rgba(227,177,115,.32);
}
.book-grid.is-filtered .book.is-pick .cover{max-width:208px}
.book-grid.is-filtered .book.is-lead h3{font-size:var(--s-2);max-width:22ch}
.book-grid.is-filtered .book.is-lead .book-blurb{font-size:var(--s-0);max-width:46ch;line-height:1.65}
.book-grid.is-filtered .book.is-pick h3{font-size:var(--s-3);max-width:20ch}
.book-grid.is-filtered .book.is-pick .book-blurb{font-size:var(--s-1);max-width:52ch;line-height:1.55}
@media(min-width:34rem){
  .book-grid.is-filtered .book.is-lead{grid-template-columns:152px 1fr;gap:1.7rem;padding:1.6rem 1.5rem 1.5rem}
  .book-grid.is-filtered .book.is-lead .cover,
  .book-grid.is-filtered .book.is-pick .cover{max-width:none}
  .book-grid.is-filtered .book.is-pick{grid-template-columns:212px 1fr;gap:2.1rem}
}
@media(min-width:62rem){
  .book-grid.is-filtered .book.is-pick{grid-template-columns:262px 1fr;gap:2.8rem;padding:2.4rem 2.2rem}
}

/* ---------- pace control ---------- */
.pace{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center}
.pace-label{font-size:var(--s--1);letter-spacing:.14em;text-transform:uppercase;color:var(--bone-faded)}
.pace-btn{
  min-width:38px;min-height:38px;padding:.3rem .55rem;
  font-family:var(--display);font-size:var(--s-0);color:var(--bone-dim);
  background:transparent;border:1px solid var(--line-dark);border-radius:999px;cursor:pointer;
  transition:color .25s ease,border-color .25s ease,background-color .25s ease;
}
.pace-btn:hover{color:var(--bone);border-color:var(--bone-faded)}
.pace-btn[aria-pressed="true"]{color:var(--gold);border-color:rgba(227,177,115,.55);background:rgba(227,177,115,.10)}

/* ---------- gift / form ---------- */
.gift-in{display:grid;gap:clamp(2rem,5vw,3.5rem)}
@media(min-width:56rem){.gift-in{grid-template-columns:1.1fr .9fr;align-items:center}}
.gift h2{font-size:var(--s-3);max-width:15ch}
.gift p{color:var(--ink-soft);margin-top:1.2rem;max-width:44ch;font-size:var(--s-1);line-height:1.55}
.form{
  background:rgba(255,255,255,.55);
  border:1px solid var(--line-light);
  border-radius:4px;
  padding:clamp(1.5rem,4vw,2.2rem);
}
.form label{display:block;font-size:var(--s--1);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.6rem}
.form input{
  width:100%;min-height:50px;
  padding:.8rem 1rem;
  font-family:var(--body);font-size:var(--s-0);color:var(--ink);
  background:#FBF9F7;border:1px solid var(--line-light);border-radius:3px;
}
.form input::placeholder{color:rgba(25,23,32,.38)}
.form input:focus{border-color:var(--ink)}
.form .btn{width:100%;margin-top:.9rem}
.form-note{margin-top:1rem;font-size:var(--s--1);color:var(--ink-soft);opacity:.8}
.form-msg{margin-top:1rem;font-size:var(--s--1);color:var(--gold-deep);font-weight:600;min-height:1.2em}

/* ---------- membership ---------- */
.member-in{
  display:grid;gap:1.75rem;justify-items:start;
  border:1px solid var(--line-light);border-radius:4px;
  padding:clamp(1.75rem,5vw,3.5rem);
  background:rgba(255,255,255,.4);
}
@media(min-width:60rem){.member-in{grid-template-columns:1fr auto;align-items:center;justify-items:stretch}}
.member h2{font-size:var(--s-2)}
.member p{color:var(--ink-soft);margin-top:.9rem;max-width:52ch}
.member ul{margin:1.2rem 0 0;padding:0;list-style:none;display:grid;gap:.5rem}
.member li{position:relative;padding-left:1.4rem;font-size:var(--s-0);color:var(--ink-soft)}
.member li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--gold-deep);opacity:.65}

/* ---------- about ---------- */
.about-in{display:grid;gap:clamp(1.5rem,4vw,3rem)}
@media(min-width:56rem){.about-in{grid-template-columns:auto 1fr;align-items:start}}
.about h2{font-size:var(--s-2);max-width:12ch}
.about p{color:var(--ink-soft);max-width:60ch;font-size:var(--s-1);line-height:1.6}
.about p + p{margin-top:1.1rem}
.sources{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.sources span{
  font-size:var(--s--1);letter-spacing:.1em;text-transform:uppercase;font-weight:600;
  padding:.35rem .75rem;border:1px solid var(--line-light);border-radius:999px;color:var(--ink-soft);
}

/* ---------- footer ---------- */
.site-foot{background:var(--ink);color:var(--dawn);padding-block:clamp(2.5rem,6vw,4rem)}
.foot-in{display:grid;gap:1.75rem}
@media(min-width:52rem){.foot-in{grid-template-columns:1fr auto;align-items:start}}
.foot-links{display:flex;flex-wrap:wrap;gap:1.25rem}
.foot-links a{font-size:var(--s--1);letter-spacing:.1em;text-transform:uppercase;color:rgba(237,232,226,.66);text-decoration:none;font-weight:500}
.foot-links a:hover{color:var(--dawn)}
.foot-fine{font-size:var(--s--1);color:rgba(237,232,226,.5);max-width:52ch;margin-top:1.25rem;line-height:1.6}
.foot-mark{font-family:var(--display);font-size:var(--s-1)}

/* ---------- reveal ---------- */
.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.js .reveal.is-seen{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none;transition:none}
  .orb,.is-running .orb{animation:none;transition:opacity var(--phase,4000ms) linear;transform:scale(.82);filter:none}
  .orb.is-in,.is-running .orb.is-in{transform:scale(.82);opacity:1;filter:none}
  .ripple{display:none}
  .ring::before{animation:none}
  .hero::after{transition:none;transform:translateX(50%);opacity:.75}
  .pacer-label #phase{transition:none}
  .btn,.book{transition:none}
  .cover{transition:none}
  .book,.chooser-out,.chip{transition:none}
  .book:hover .cover,.book:focus-within .cover{transform:none}
}

/* ============================================================
   COVER ART. Each rule below holds one cover image encoded
   inline, so the page needs no separate image files. To swap a
   cover, replace the url(...) value for that book.
   ============================================================ */
.cv-soothe{background-image:url(../covers/soothe.webp)}
.cv-nervous{background-image:url(../covers/nervous.webp)}
.cv-awakened{background-image:url(../covers/awakened.webp)}
.cv-luminous{background-image:url(../covers/luminous.webp)}
.cv-rest{background-image:url(../covers/rest.webp)}
.cv-spirit{background-image:url(../covers/spirit.webp)}