/* home-v24 PAPER preview: colours mapped by ../../build_paper.py (paper_rgb) from /home-assets-2026-10-10/night/v13.css */
/* home-v18 night: colours mapped by build.py (night_rgb) from ../v13.css */
/* home-v13 hero drawing: strokes draw themselves once (v13d), fills ink in (v13i), one warm light travels (v13t). */
.v13-bloom{display:block;overflow:visible}
.v13-bloom .v13d{stroke-dasharray:1 1;stroke-dashoffset:1}
.v13-bloom .v13i{opacity:0}
.v13-bloom .v13t{stroke-dasharray:.08 .92;stroke-dashoffset:.08;opacity:0}
.v13-bloom.go .v13d{animation:v13-draw var(--u) cubic-bezier(.45,.05,.3,1) var(--d) forwards}
.v13-bloom.go .v13i{animation:v13-ink var(--u) ease var(--d) forwards}
.v13-bloom.go .v13t{animation:v13-travel var(--u) cubic-bezier(.5,0,.3,1) var(--d) forwards}
@keyframes v13-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes v13-ink{from{opacity:0}to{opacity:1}}
@keyframes v13-travel{0%{opacity:0;stroke-dashoffset:.08}12%{opacity:.75}85%{opacity:.75}100%{opacity:0;stroke-dashoffset:-.92}}
/* at rest: reduced motion, review stills, no script */
.v13-bloom.v13-done .v13d,html:not(.js) .v13-bloom .v13d{animation:none;stroke-dasharray:none;stroke-dashoffset:0}
.v13-bloom.v13-done .v13i,html:not(.js) .v13-bloom .v13i{animation:none;opacity:1}
.v13-bloom.v13-done .v13t,html:not(.js) .v13-bloom .v13t{display:none}
@media (prefers-reduced-motion: reduce){ .v13-bloom .v13d{animation:none!important;stroke-dasharray:none;stroke-dashoffset:0} .v13-bloom .v13i{animation:none!important;opacity:1} .v13-bloom .v13t{display:none} }

/* ---------- the hero drawing in place ---------- */
.v13-art{position:absolute;left:680px;top:92px;width:min(580px,calc(50vw - 132px));pointer-events:none;z-index:0;
  background:radial-gradient(closest-side,rgba(248,245,239,.92),rgba(248,245,239,.75) 60%,rgba(248,245,239,0))}
.v13-art svg{width:100%;height:auto}
.v13-art-inline{display:none}
@media (max-width:1199px){
  .v13-art{display:none}
  .v13-art-inline{display:block;width:min(100%,330px);margin:14px auto 4px;background:radial-gradient(closest-side,rgba(248,245,239,.9),rgba(248,245,239,0))}
  .v13-art-inline svg{width:100%;height:auto}
}
/* Fig. II moves below the first screen, beside "Ask the example", so the drawing leads the first screen alone */
@media (min-width:1400px){ #nbhero{top:930px!important;transform:none!important} }

/* ---------- calmer ---------- */
.a6-hero-instr{display:none!important}                         /* the gear-train plate beside the headline */
html .m3i-gb,html .m3i-fl,html #program .m3i-fl,html #what .m3i-fl,html #begin .m3i-fl{display:none!important}  /* margin blooms and buds */
.m3i-sheet{opacity:.62}                                         /* the paper sheet's arcs, strands and clusters */
/* one eyebrow style: the page serif in small caps, umber, instead of spaced mono */
html .m-label,html .a7d-kicker,html .a7d-kicker a{font-family:'EB Garamond',Garamond,Georgia,serif!important;font-variant:small-caps;
  text-transform:lowercase;letter-spacing:.06em!important;font-size:1.0625rem!important;font-weight:500!important;color:#735233!important}
@media (max-width:699px){ html .m-label,html .a7d-kicker,html .a7d-kicker a{font-size:.9375rem!important} }
html .a7d-kicker a{text-decoration:none}
html .a7d-kicker a:hover{text-decoration:underline;text-underline-offset:3px}
/* boxed tags lose their boxes */
html .m3j-tag,html .m3-status{border:0!important;background:none!important;padding-left:0!important;padding-right:0!important;
  font-family:'EB Garamond',Garamond,Georgia,serif!important;font-variant:small-caps;text-transform:lowercase;letter-spacing:.05em!important}

/* ---------- buttons ---------- */
/* A (used): a fine umber hairline on paper, the page serif, modest padding, small radius */
html[data-btn] .m-btn.m-btn-primary,html.m3n-topdark .topbar .m-btn.m-btn-primary{
  font-family:'EB Garamond',Garamond,Georgia,serif!important;font-weight:500!important;font-size:1.0625rem!important;line-height:1.2!important;
  letter-spacing:.01em!important;min-height:40px!important;padding:0 16px!important;border-radius:2px!important;
  background:#f8f5ef!important;color:#47382a!important;border:1px solid #906031!important;box-shadow:none!important;
  transition:background-color .2s ease,border-color .2s ease}
html[data-btn] .m-btn.m-btn-primary:hover,html[data-btn] .m-btn.m-btn-primary:focus-visible{background:#ece9e3!important;border-color:#533f2e!important;color:#372d24!important}
html[data-btn] .topbar .nav .m-btn.m-btn-primary{min-height:36px!important;padding:0 14px!important;font-size:1rem!important}
/* B (review only, ?btn=b): a quiet umber fill, small caps */
html[data-btn="b"] .m-btn.m-btn-primary{background:#735233!important;color:#f8f5ef!important;border-color:#735233!important;
  font-variant:small-caps;text-transform:lowercase;letter-spacing:.06em!important}
html[data-btn="b"] .m-btn.m-btn-primary:hover,html[data-btn="b"] .m-btn.m-btn-primary:focus-visible{background:#533f2e!important;border-color:#533f2e!important;color:#f8f5ef!important}
/* the secondary link beside it, in the same serif and size */
html[data-btn] .m-hero-actions .m-link{font-family:'EB Garamond',Garamond,Georgia,serif!important;font-size:1.0625rem!important;font-weight:500!important;
  color:#735233!important;text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:4px!important;
  text-decoration-color:rgba(144,96,49,.55)!important;min-height:40px}
html[data-btn] .m-hero-actions{gap:22px!important;align-items:center}
@media (max-width:899px){
  html[data-btn] .m-hero-actions{align-items:flex-start;gap:6px!important}
  html[data-btn] .m-hero-actions .m-btn.m-btn-primary{min-height:44px!important;width:auto!important;padding:0 18px!important}
  html[data-btn] .m-hero-actions .m-link{min-height:44px}
}