/* Final 2.1's pill field, standing on the page instead of inside a window.
   The drawer keeps its route, focus and fallback contracts; what changed is
   that the surface it used to sit on is gone. The ground is a translucent
   field only as large as the chapters it carries, feathered out until the
   page resumes on its own terms. Nothing draws a border around navigation. */
:root {
  /* The composition axis is measured in the controller, which is the one
     place the pill canvas and the DOM hit areas can agree on it. */
  /* The aperture holds the column shut until the ground beneath it is at full
     strength, so a chapter is never drawn onto a veil that has begun to give
     way. These stops therefore start below the field's own feather, not at the
     viewport edge. */
  --chapter-menu-fade-a:15%;
  --chapter-menu-fade-b:19%;
  --chapter-menu-fade-c:25%;
  --chapter-menu-veil:.79;
  /* The translucent field's reach. It feathers sideways, where the page lies
     open on both sides of the centerd column, and eases away above and below
     it. The aperture, not the ground, is what keeps a chapter off a weakened
     veil: it stays shut through the first --chapter-menu-field-top of the
     height, by which point the ground is carrying. */
  --chapter-menu-field-x:clamp(300px,28vw,460px);
  --chapter-menu-field-y:clamp(320px,62vh,620px);
  --chapter-menu-field-top:12%;
}

/* The scrim stays what it always was: an invisible full-viewport close
   control under the field. It paints nothing now; the ground belongs to the
   field itself, which is the only layer that knows where the column stands.
   Normalized here because each chapter authored its own scrim rules. */
body:has(.chapter-pill-menu) :is(.drawer-scrim,.mhc-drawer-scrim) {
  position:fixed;z-index:1040;inset:0;padding:0;border:0;border-radius:0;
  background:none;backdrop-filter:none;-webkit-backdrop-filter:none;
  opacity:0;visibility:hidden;pointer-events:none;cursor:pointer;
  transition:opacity .2s ease,visibility 0s linear .4s;
}
body:has(.chapter-pill-menu):is(.drawer-open,.mhc-nav-open) :is(.drawer-scrim,.mhc-drawer-scrim) {
  opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s;
}

/* The rail keeps its own plane above the field and loses its chrome, so the
   close control is the only lit object left at the page edge. */
body:has(.chapter-pill-menu):is(.drawer-open,.mhc-nav-open) :is(.archive-rail,.mhc-archive-rail) {
  background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
}
body:has(.chapter-pill-menu) :is(#menu-toggle,#mhc-menu-toggle) {
  transform:none;
}
body:has(.chapter-pill-menu):is(.drawer-open,.mhc-nav-open) :is(#menu-toggle,#mhc-menu-toggle):not(.is-home-ready,.is-complete) :is(.menu-icon--menu,.mhc-menu-icon--menu) {
  opacity:0;transform:rotate(12deg) scale(1.12);filter:blur(3px);
}
body:has(.chapter-pill-menu):is(.drawer-open,.mhc-nav-open) :is(#menu-toggle,#mhc-menu-toggle):not(.is-home-ready,.is-complete) :is(.menu-icon--close,.mhc-menu-icon--close) {
  opacity:1;transform:none;filter:blur(0);
}

/* No window: no border, no radius, no plate, no shadow, no blur. The layer
   spans the page so the column can stand anywhere on it, but what it paints is
   a translucent field centerd on the column and on the page's own middle,
   reaching only as far as the chapters and then feathering away. The page is
   dimmed where the reading happens and untouched everywhere else. */
:is(.chapter-drawer,.mhc-chapter-drawer).chapter-pill-menu {
  --menu-ink:var(--mhc-ink);
  position:fixed;z-index:1050;
  /* left/right rather than 100vw: a fixed box sizes to the initial containing
     block, so a visible scrollbar cannot push the composition axis off. */
  top:0;left:0;right:0;bottom:auto;
  width:auto;height:100dvh;max-height:none;
  padding:0;border:0;border-radius:0;box-shadow:none;background:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  overflow:hidden;clip-path:none;transform:none;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s ease,visibility 0s linear .5s;
}
body:is(.drawer-open,.mhc-nav-open) :is(.chapter-drawer,.mhc-chapter-drawer).chapter-pill-menu {
  opacity:1;visibility:visible;pointer-events:auto;
  /* The shell's own open state re-applies its iris at a higher specificity than
     the base rule here. Left in place it clips the field to a 900px circle from
     the rail, which silently removes the right of the page. The reveal is the
     scrim's now; the field itself is never clipped. */
  clip-path:none;
  transition:opacity .44s var(--elastic-ease,cubic-bezier(.16,1,.3,1)) .14s,visibility 0s linear 0s;
}
/* The ground is its own layer, behind the column and in front of the page.
   One ellipse, falling away on every side: a straight-edged profile would be
   the window this revision exists to remove, however soft its edges. */
.chapter-pill-menu::before {
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(
    ellipse var(--chapter-menu-field-x) var(--chapter-menu-field-y)
      at var(--menu-axis,50%) 50%,
    rgba(var(--mhc-ground-rgb),var(--chapter-menu-veil)) 0,
    rgba(var(--mhc-ground-rgb),var(--chapter-menu-veil)) 45%,
    rgba(var(--mhc-ground-rgb),calc(var(--chapter-menu-veil) * .55)) 72%,
    rgba(var(--mhc-ground-rgb),calc(var(--chapter-menu-veil) * .18)) 88%,
    rgba(var(--mhc-ground-rgb),0) 100%);
}
.chapter-pill-menu :is(.drawer-inner,.mhc-drawer-inner) {
  z-index:1;
  position:relative;width:100%;height:100%;min-height:0;padding:0;display:block;
}
.chapter-pill-menu :is(.drawer-head,.mhc-drawer-head,.drawer-foot,.mhc-drawer-foot) {display:none}
.chapter-pill-scroll {
  position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;
  overscroll-behavior:contain;scroll-snap-type:y mandatory;scrollbar-width:none;
  touch-action:pan-y;overflow-anchor:none;
}
.chapter-pill-scroll::-webkit-scrollbar {display:none}
.chapter-pill-track {position:relative;height:var(--menu-track-height)}
.chapter-pill-stop {position:absolute;left:0;width:1px;height:var(--menu-stage-height);scroll-snap-align:start;pointer-events:none}
.chapter-pill-stage {
  position:sticky;top:0;width:100%;height:var(--menu-stage-height);overflow:hidden;
  /* The canvas and its actual links share exactly the same aperture. With no
     window edge to crop against, the column has to be gone well before the
     viewport edge: a linear ramp still leaves a legible word cut in half, so
     most of the dissolve happens in the first tenth of the fade. */
  mask-image:linear-gradient(to bottom,
    transparent 0,
    transparent var(--chapter-menu-field-top),
    rgba(0,0,0,.07) var(--chapter-menu-fade-a),
    rgba(0,0,0,.4) var(--chapter-menu-fade-b),
    #000 var(--chapter-menu-fade-c),
    #000 calc(100% - var(--chapter-menu-fade-c)),
    rgba(0,0,0,.4) calc(100% - var(--chapter-menu-fade-b)),
    rgba(0,0,0,.07) calc(100% - var(--chapter-menu-fade-a)),
    transparent calc(100% - var(--chapter-menu-field-top)),
    transparent 100%);
}
.chapter-pill-canvas {position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.chapter-pill-menu :is(.chapter-list,.mhc-chapter-list) {
  position:absolute;inset:0;margin:0;padding:0;list-style:none;counter-reset:none;
}
.chapter-pill-menu :is(.chapter-list,.mhc-chapter-list)>li {
  position:absolute;left:0;top:0;margin:0;padding:0;border:0;will-change:transform;
}
.chapter-pill-menu :is(.chapter-list,.mhc-chapter-list) a {
  position:relative;display:block;min-height:0;margin:0;padding:0;border:0;
  overflow:visible;background:none!important;box-shadow:none!important;
  color:var(--menu-ink)!important;isolation:auto;text-decoration:none;
}
.chapter-pill-menu :is(.chapter-list,.mhc-chapter-list) a::before,
.chapter-pill-menu :is(.chapter-list,.mhc-chapter-list) a::after {display:none}
.chapter-pill-menu .pill-object {
  position:absolute;left:50%;top:50%;display:block;z-index:2;
  width:max(44px,calc(var(--pill-width) + 24px));height:max(44px,calc(var(--pill-height) + 24px));
  transform:translate3d(calc(-50% + var(--pill-float-x,0px)),calc(-50% + var(--pill-float-y,0px)),0);
}
.chapter-pill-menu :is(.chapter-copy,.mhc-chapter-copy) {
  position:absolute;left:50%;top:calc(50% + var(--pill-height) / 2 + var(--menu-gap,8px));
  display:flex;align-items:baseline;gap:calc(8px + var(--menu-spot,0) * 4px);width:max-content;
  padding:7px 6px;margin:0;opacity:var(--menu-label,1);
  transform:translate3d(calc(-50% + var(--anchor-float-x,0px)),0,0);
  transition:none;pointer-events:auto;
}
/* Size carries the depth, so the receding entries stay legible rather than
   dissolving into the veil: the dimmest title still holds its contrast. */
.chapter-pill-menu :is(.chapter-index,.mhc-chapter-number) {
  position:static;display:inline;width:auto;flex:none;padding:0;margin:0;
  color:inherit;
  font:400 calc(var(--menu-mark,10px) + var(--menu-spot,0) * 3px)/1.2 var(--mono,'Geist Mono',monospace);
  letter-spacing:.06em;
}
.chapter-pill-menu :is(.chapter-title,.mhc-chapter-title) {
  display:inline-block;
  font:300 calc(var(--menu-title,15px) + var(--menu-spot,0) * var(--menu-title-lift,13px))/1.12 var(--sans,Helvetica,Arial,sans-serif);
  letter-spacing:-.04em;white-space:nowrap;transform:none!important;
  transition:color .18s ease;
}
.chapter-pill-menu :is(.chapter-subtitle,.mhc-chapter-subtitle) {display:none!important}
.chapter-pill-menu a[aria-current="page"] :is(.chapter-copy,.mhc-chapter-copy)::before {
  content:"";align-self:center;flex:none;
  width:calc(5px + var(--menu-spot,0) * 2px);height:calc(5px + var(--menu-spot,0) * 2px);
  border-radius:50%;background:var(--chapter-ink,var(--menu-ink));
}
.chapter-pill-menu a:is(:hover,:focus-visible) :is(.chapter-copy,.mhc-chapter-copy) {opacity:1}
.chapter-pill-menu a:focus-visible {outline:none}
/* A drawn rule, not a box-shadow: a shadow promotes the copy to its own
   composited layer and the layer paints an opaque plate over the blurred
   ground, which is a window by another name. */
.chapter-pill-menu a:focus-visible :is(.chapter-copy,.mhc-chapter-copy) {outline:none}
.chapter-pill-menu a:focus-visible :is(.chapter-copy,.mhc-chapter-copy)::after {
  content:"";position:absolute;left:6px;right:6px;bottom:1px;height:2px;
  background:var(--chapter-ink,var(--menu-ink));
}
@media(forced-colors:active) {
  .chapter-pill-menu a:focus-visible :is(.chapter-copy,.mhc-chapter-copy) {outline:2px solid CanvasText;outline-offset:3px}
}
.chapter-pill-menu a.is-spotlit :is(.chapter-title,.mhc-chapter-title) {color:var(--chapter-ink,var(--menu-ink))}

/* The position scale keeps the page's right edge, answering the archive rail
   on the left. Its hairline is the axis the eight ticks are read against. */
.chapter-pill-position {
  position:absolute;z-index:3;
  right:clamp(14px,1.9vw,34px);top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;gap:0;pointer-events:none;
}
.chapter-pill-position::before {
  content:"";position:absolute;left:50%;top:9px;bottom:9px;width:1px;
  background:color-mix(in srgb,var(--menu-ink) 15%,transparent);transform:translateX(-50%);
}
.chapter-pill-position button {
  position:relative;display:grid;place-items:center;width:44px;height:38px;padding:0;
  border:0;background:transparent;color:var(--menu-ink);cursor:pointer;pointer-events:auto;
}
.chapter-pill-position button::before {
  content:"";width:6px;height:calc(6px + var(--dot-spot,0) * 34px);border-radius:var(--elastic-pill,999px);
  background:color-mix(in srgb,var(--menu-ink) 38%,transparent);
}
.chapter-pill-position button.is-current::before {background:var(--chapter-ink,var(--menu-ink))}
.chapter-pill-position button:focus-visible {outline:2px solid var(--chapter-ink,var(--menu-ink));outline-offset:-4px;border-radius:var(--elastic-pill,999px)}

@media(max-width:700px) {
  :root {--chapter-menu-field-top:8%;--chapter-menu-fade-a:11%;--chapter-menu-fade-b:15%;--chapter-menu-fade-c:21%}
  .chapter-pill-position {right:8px}
  .chapter-pill-position button {width:36px;height:32px}
  .chapter-pill-position button::before {height:calc(5px + var(--dot-spot,0) * 26px)}
}
@media(max-height:480px) {
  .chapter-pill-position button {height:26px}
  .chapter-pill-position button::before {height:calc(5px + var(--dot-spot,0) * 18px)}
}
@media(prefers-reduced-motion:reduce) {
  body:has(.chapter-pill-menu) :is(.drawer-scrim,.mhc-drawer-scrim) {
    clip-path:none;transition:opacity .01ms linear,visibility 0s linear .01ms;
  }
  body:has(.chapter-pill-menu):is(.drawer-open,.mhc-nav-open) :is(.drawer-scrim,.mhc-drawer-scrim) {clip-path:none}
  :is(.chapter-drawer,.mhc-chapter-drawer).chapter-pill-menu,
  body:is(.drawer-open,.mhc-nav-open) :is(.chapter-drawer,.mhc-chapter-drawer).chapter-pill-menu {
    transition:opacity .01ms linear,visibility 0s linear;
  }
  .chapter-pill-menu :is(.chapter-list,.mhc-chapter-list)>li {will-change:auto}
}
@media print {.chapter-pill-menu {display:none!important}}

/* ===========================================================================
   The leaf · desktop, since 28 September
   ---------------------------------------------------------------------------
   The chapter index opens as a leaf of the menu bar's own glass, hung from
   the room well that opened it: beneath the bar along the top edge, beside it
   at either side, above it at the foot. The controller measures where the
   well stands at the moment of opening and writes the leaf's corner and the
   clip it unfolds through; the shell's drawer rules, an iris struck from a
   column that no longer holds the control, are answered property for
   property here, because eight chapters author the drawer in two class
   vocabularies and the shell's open state carries a higher weight than the
   rule that draws the leaf.
   =========================================================================== */
:is(.chapter-drawer,.mhc-chapter-drawer).chapter-leaf-menu{
  position:fixed!important;
  z-index:1050!important;
  inset:auto!important;
  left:var(--menu-leaf-left,50%)!important;
  top:var(--menu-leaf-top,58px)!important;
  width:min(520px,calc(100vw - 24px))!important;
  height:auto!important;
  max-width:none!important;
  max-height:var(--way-panel-height,calc(100svh - 84px))!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  border:0!important;
  border-radius:20px!important;
  background:transparent!important;
  color:var(--mhc-ink)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  clip-path:none!important;
  transform:none!important;
  opacity:1;
  visibility:hidden;
  pointer-events:none;
  transition:visibility 0s linear .5s!important;
}
body:is(.drawer-open,.mhc-nav-open) :is(.chapter-drawer,.mhc-chapter-drawer).chapter-leaf-menu{
  clip-path:none!important;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s!important;
}
/* Chrome can drop the page behind a backdrop-filter animated with clip-path.
   Keep the rounded glass on an unclipped layer; only the contents unfold.
   The drawer itself stays opaque to avoid making it another backdrop root. */
:is(.chapter-drawer,.mhc-chapter-drawer).chapter-leaf-menu::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  border-radius:inherit;
  background:var(--elastic-capsule-surface);
  box-shadow:var(--elastic-capsule-shadow);
  backdrop-filter:var(--elastic-capsule-blur);
  -webkit-backdrop-filter:var(--elastic-capsule-blur);
  pointer-events:none;
  opacity:0;
  transition:opacity .16s ease;
}
body:is(.drawer-open,.mhc-nav-open) .chapter-leaf-menu::before{
  opacity:1;
  transition-duration:.12s;
}
.chapter-leaf-menu :is(.drawer-inner,.mhc-drawer-inner){
  position:static!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:inherit;
  border-radius:inherit;
  margin:0!important;
  padding:0!important;
  display:block!important;
  overflow:auto!important;
  overscroll-behavior:contain;
  clip-path:var(--menu-leaf-closed,inset(0 0 100% 0 round 20px));
  opacity:0;
  transition:clip-path .48s var(--elastic-ease,cubic-bezier(.16,1,.3,1)),opacity .16s ease;
}
body:is(.drawer-open,.mhc-nav-open) .chapter-leaf-menu :is(.drawer-inner,.mhc-drawer-inner){
  clip-path:inset(0 round 20px);
  opacity:1;
  transition-duration:.48s,.12s;
}
.chapter-leaf-menu :is(.drawer-head,.mhc-drawer-head,.drawer-foot,.mhc-drawer-foot,.drawer-close,.mhc-drawer-close,.mhc-drawer-context){display:none!important}
.chapter-leaf{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  gap:0 22px;
  padding:20px 22px 22px 14px;
}
.chapter-leaf-head{
  grid-column:1/-1;
  padding:0 0 14px 12px;
  /* The .72 ink step is the floor for small type over a chapter field, and
     the leaf's glass transmits the field. */
  color:color-mix(in srgb,var(--mhc-ink) 72%,transparent);
  font:500 var(--mhc-type-2xs,10px)/1.3 var(--mono,"Geist Mono",ui-monospace,monospace);
  letter-spacing:.1em;
  text-transform:uppercase;
}
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list){display:grid!important;gap:2px;margin:0!important;padding:0!important;list-style:none!important;counter-reset:none}
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list)>li{margin:0!important;padding:0!important;border:0!important}
.chapter-leaf-menu li[data-menu-role="companion"]:nth-child(3),
.chapter-leaf-menu li[data-menu-role="entrance"]{margin-bottom:8px!important}
/* The index keeps the landing's type sizes and quieter companions. Weight
   marks the current room; spacing keeps Timeline separate from the readings. */
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a{
  --name-size:var(--mhc-type-xl,17px);
  --name-ink:74%;
  --mark-ink:50%;
  position:relative;
  display:grid!important;
  grid-template-columns:calc(var(--name-size) * 1.9) max-content;
  align-items:baseline;
  gap:0!important;
  margin:0!important;
  padding:8px 12px!important;
  min-height:36px!important;
  border:0!important;
  border-radius:var(--elastic-pill,999px)!important;
  overflow:visible!important;
  background:none!important;
  box-shadow:none!important;
  color:var(--mhc-ink)!important;
  isolation:auto;
  text-decoration:none;
  outline:none;
  opacity:0;
  translate:0 .42em;
  transition:opacity .12s ease,translate .2s ease;
  -webkit-tap-highlight-color:transparent;
}
body:is(.drawer-open,.mhc-nav-open) .chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a{
  opacity:1;
  translate:0 0;
  transition:opacity .36s ease calc(var(--i,0) * 26ms + 150ms),translate .56s var(--elastic-ease,cubic-bezier(.16,1,.3,1)) calc(var(--i,0) * 26ms + 150ms);
}
.chapter-leaf-menu li[data-menu-role="companion"]>a{--name-ink:62%;--name-weight:360}
.chapter-leaf-menu li>a[aria-current="page"]{--name-ink:100%;--name-weight:600}
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a::before,
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a::after{display:none!important}
.chapter-leaf-menu :is(.chapter-index,.mhc-chapter-number){
  position:static!important;
  display:block!important;
  grid-column:1;
  width:auto!important;
  margin:0!important;
  padding:0 calc(var(--name-size) * .62) 0 0!important;
  text-align:right;
  color:color-mix(in srgb,var(--mhc-ink) var(--mark-ink),transparent)!important;
  font:600 var(--name-size)/1.16 var(--mono,"Geist Mono",ui-monospace,monospace)!important;
  letter-spacing:.005em!important;
  transition:color .25s ease;
}
.chapter-leaf-menu :is(.chapter-copy,.mhc-chapter-copy){display:block;grid-column:2;padding:0!important;transition:none}
.chapter-leaf-menu :is(.chapter-title,.mhc-chapter-title){
  display:block;
  color:color-mix(in srgb,var(--mhc-ink) var(--name-ink),transparent)!important;
  font:var(--name-weight,400) var(--name-size)/1.16 var(--sans,Helvetica,"Helvetica Neue",Arial,sans-serif)!important;
  letter-spacing:-.032em!important;
  white-space:nowrap;
  transform:none!important;
  transition:color .25s ease;
}
.chapter-leaf-menu :is(.chapter-subtitle,.mhc-chapter-subtitle){display:none!important}
/* The archive's link affordance, as the landing draws it on a row: the
   chapter's field at fifteen per cent, a hairline and a two-pixel lift. */
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a>.menu-row-ground{
  position:absolute;
  z-index:-1;
  inset:0;
  border:1px solid transparent;
  border-radius:999px;
  background:color-mix(in srgb,var(--chapter-color,var(--mhc-accent)) 15%,transparent);
  opacity:0;
  transition:opacity .25s ease,border-color .25s ease;
  pointer-events:none;
}
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a:is(:hover,:focus-visible){--name-ink:100%;--mark-ink:78%;transform:none;transition:color .25s ease}
/* Under Lumen the row keeps its ground and hairline, and the light falls
   inside the ground in the chapter's own color. */
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a{--mhc-lumen-hover:keep;--mhc-lumen-tint:var(--chapter-color,var(--mhc-accent))}
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a:is(:hover,:focus-visible)>.menu-row-ground{opacity:1;border-color:color-mix(in srgb,var(--mhc-ink) 16%,transparent)}
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a:focus-visible>.menu-row-ground{border-color:color-mix(in srgb,var(--mhc-ink) 42%,transparent)}
.chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list):has(a:hover) a:not(:hover):not(:focus-visible){--name-ink:40%;--mark-ink:30%}
.chapter-leaf-menu li:is(.active,.is-current)>a :is(.chapter-index,.mhc-chapter-number)::before{
  content:"";
  position:absolute;
  left:4px;
  top:50%;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--chapter-ink,var(--mhc-ink));
  transform:translateY(-50%);
}
/* The specimen: the pointed room's medication turning over its brief. */
.chapter-leaf-specimen{
  display:grid;
  grid-template-rows:minmax(118px,1fr) auto;
  align-content:stretch;
  gap:20px;
  padding:0 0 8px 18px;
  border-left:1px solid color-mix(in srgb,var(--mhc-ink) 12%,transparent);
}
.chapter-leaf-stage{position:relative;height:100%;min-height:118px}
.chapter-leaf-pill-name{
  position:absolute;top:18%;left:0;right:0;margin:0;padding:0 4px;
  color:color-mix(in srgb,var(--mhc-ink) 78%,transparent);
  font:500 var(--mhc-type-xs,11px)/1.4 var(--mono,"Geist Mono",ui-monospace,monospace);
  text-align:center;
}
.chapter-leaf-specimen.is-still .chapter-leaf-stage{height:24px}
.chapter-leaf-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.chapter-leaf-specimen.is-still .chapter-leaf-canvas{display:none}
.chapter-leaf-copy{display:grid;gap:4px;padding:0 4px;transition:opacity .16s ease,translate .3s var(--elastic-ease,cubic-bezier(.16,1,.3,1))}
.chapter-leaf-copy.is-changing{opacity:0;translate:0 4px}
.chapter-leaf-mark{color:var(--chapter-ink,var(--mhc-accent-ink));font:600 var(--mhc-type-2xs,10px)/1.3 var(--mono,"Geist Mono",ui-monospace,monospace);letter-spacing:.085em;text-transform:uppercase}
.chapter-leaf-name{color:var(--mhc-ink);font:400 var(--mhc-type-xl,17px)/1.16 var(--sans,Helvetica,"Helvetica Neue",Arial,sans-serif);letter-spacing:-.032em}
.chapter-leaf-brief{margin:2px 0 0;color:color-mix(in srgb,var(--mhc-ink) 78%,transparent);font:400 var(--mhc-type-md,13px)/1.42 var(--sans,Helvetica,"Helvetica Neue",Arial,sans-serif);letter-spacing:-.005em}
/* The scrim is still the page's close control: an invisible full-viewport
   layer under the leaf, normalized here because each chapter authored its own. */
body:has(.chapter-leaf-menu) :is(.drawer-scrim,.mhc-drawer-scrim){
  position:fixed!important;z-index:980!important;inset:0!important;padding:0!important;border:0!important;border-radius:0!important;
  background:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;clip-path:none!important;
  opacity:0;visibility:hidden;pointer-events:none;cursor:pointer;
  transition:opacity .2s ease,visibility 0s linear .4s!important;
}
body:has(.chapter-leaf-menu):is(.drawer-open,.mhc-nav-open) :is(.drawer-scrim,.mhc-drawer-scrim){
  opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s!important;
}
@media(max-width:560px){
  .chapter-leaf{grid-template-columns:minmax(0,1fr)}
  .chapter-leaf-specimen{display:none}
  .chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a{min-height:44px!important}
}
@media(prefers-reduced-motion:reduce){
  :is(.chapter-drawer,.mhc-chapter-drawer).chapter-leaf-menu,
  body:is(.drawer-open,.mhc-nav-open) :is(.chapter-drawer,.mhc-chapter-drawer).chapter-leaf-menu{transition:visibility 0s linear!important}
  .chapter-leaf-menu::before,
  .chapter-leaf-menu :is(.drawer-inner,.mhc-drawer-inner){transition-duration:.01ms!important;clip-path:none!important}
  .chapter-leaf-menu :is(.chapter-list,.mhc-chapter-list) a,.chapter-leaf-copy{transition-duration:.01ms!important;transition-delay:0s!important}
}
@media print{.chapter-leaf-menu{display:none!important}}