/**
 * THE ATLAS — nav layout 2. Ported from design-options/atlas-e-placard.html
 * (THE ATLAS · PLACARD, owner-confirmed 2026-08-03; see
 * docs/HANDOVER-2026-08-03-NAV-AND-LOGO.md §1). Loaded ONLY when
 * hpc_nav_layout() === HPC_NAV_LAYOUT_ATLAS (inc/hpc-nav-atlas.php), so it
 * has zero footprint on the shipping nav (layout 1, the default).
 *
 * TOKEN MAPPING — the prototype's own palette (--bg/--panel/--t1/--t2/--t3/
 * --maize/--line/--line-strong/--display/--body/--mono/--ease-settle) is
 * NOT redeclared here. §1 is "tokens only, no new hexes": the plugin
 * already declares the same roles in hpc-header.css's :root
 * (--hpc-bg/--hpc-panel/--hpc-text/--hpc-text-soft/--hpc-text-muted/
 * --hpc-gold/--hpc-line/--hpc-line-strong/--hpc-font-display/
 * --hpc-font-sans/--hpc-font-mono/--ease-out), so every rule below
 * references those instead. The only NEW custom properties this file
 * declares are the ten pillar-accent hexes Amendment 16 licenses
 * ("the accent may hold a plane — nav panel only") — they carry
 * information (which pillar) no existing token can express, and
 * color-mix() derives the eleventh (--p-social) and two structural
 * variants (--atlas-line-heavy, --atlas-shadow) from tokens already
 * declared rather than adding more literal hex.
 *
 * SELECTOR SCOPING — every rule below either starts with `.atlas` (the
 * <details> trigger; NOT `.nav`, which the real theme already owns —
 * templates/hpc-header.php renders `<nav class="nav" id="mainNav">`
 * around the whole masthead nav bar) or is nested under one via a
 * descendant/sibling/:has() combinator, with two exceptions that
 * deliberately reach outside the panel to make CSS-only modality real:
 * `.nav__bar:has(.atlas[open]) .nav__right` and
 * `body:has(.atlas[open]) main`, both against real theme classes/elements
 * (verified by reading — not editing — templates/hpc-header.php).
 * IDs are prefixed `atlas-` throughout (`#atlas-pillar-bio`, not `#p-bio`)
 * for the same reason: bare `#p0`/`#t1` are exactly the kind of generic
 * id a page builder or another plugin is likely to reuse.
 *
 * CLASS NAMING — continues the BEM-ish `atlas__x` convention already
 * committed in hpc-nav-atlas.php (`atlas__trigger`, `atlas__scrim`,
 * `atlas__panel`, `atlas__tabs`, `atlas__tab`, `atlas__rad`, `atlas__body`,
 * `atlas__coll`, `atlas__row`, `atlas__row-name`, `atlas__row-count`).
 * Every class the prototype used bare (`.tab`, `.col`, `.body`, `.back`,
 * `.void`, `.feat`, `.lead`, `.blurb`, `.shelf`) is renamed the same way —
 * those are dangerously generic names to load globally even behind a flag
 * that is off by default; a future admin preview or cutover must not leak
 * `.tab{...}` onto some unrelated `<div class="tab">` elsewhere on the page.
 *
 * KNOWN GAP — the prototype's index-chip image crop (art/chip/*.webp, a
 * 98.8% weight reduction over the full plate) is NOT ported: those crops
 * are new local image assets, and this port does not touch assets/img per
 * the ship-path instructions. The index chips and drill-row thumbnails
 * currently load the full hero_image / remote WP media URL at display
 * size — tracked as the handover's open item #2 ("~2.1 MB of
 * assessment/protocol thumbnails"), not solved here.
 *
 * §2: no backdrop-filter. §5: 13px floor on parsed text. Amendment 6: no
 * JS motion libraries — every animation below is CSS-only and gated behind
 * `@media (prefers-reduced-motion: no-preference)`.
 */

/* Custom properties live on details.atlas, NOT :root — this file loads into
   323 host documents that own their root (AUDIT-2026-08-04 P0-3; gate:
   tests/test_nav_atlas_css_scope.py). Inheritance carries them to every
   descendant exactly as :root did, without exporting names to the host. */
details.atlas {
  /* Amendment 16 — the accent plane, nav-panel-only. Ten pillar hexes,
     carried over unchanged from the owner-confirmed prototype palette
     (design-options/atlas-e-placard.html); --p-social is not an eleventh
     hex, it is color-mix() of two already-declared pillar accents. */
  --p-bio: #73B191;
  --p-decisions: #CCC06F;
  --p-arena: #C47358;
  --p-flow: #60A5FA;
  --p-nutri: #A89F68;
  --p-habits: #96A67A;
  --p-learning: #988CB5;
  --p-identity: #B88892;
  --p-leadership: #8898A0;
  --p-social: color-mix(in srgb, var(--p-flow) 45%, var(--p-leadership));

  /* structural tokens the Atlas layout needs and the shared header
     stylesheet has no equivalent for; each is color-mix()'d or literal
     black/alpha (shadows and masks care only about alpha, not a new hue —
     the family's own build gate enforces exactly this distinction). */
  --atlas-line-heavy: color-mix(in srgb, var(--hpc-text) 26%, transparent);
  --atlas-shadow: rgba(0, 0, 0, .5);
  --atlas-panel-w: 1200px;
  --atlas-col-l: 520px;
}



/* The guest's own floor — was an unscoped *{}, html/body{}, a{} and
   :focus-visible{} reset that repainted every host document it was loaded
   into (and, being pre-hostile-cascade, did not even guarantee the panel
   its own face: a host's later body{} rule beat it). Scoped onto the
   subtree, the panel now carries its typography at 0,1,1 against any bare
   host rule. html/body{margin} is the host's business and is gone. */
details.atlas,details.atlas *{box-sizing:border-box}
details.atlas{color:var(--hpc-text);font-family:var(--hpc-font-sans);line-height:1.5;
     -webkit-font-smoothing:antialiased}
details.atlas a{color:inherit;text-decoration:none}
.hpc-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}
details.atlas :focus-visible{outline:2px solid var(--hpc-gold);outline-offset:2px}

/* ── the Menu control: <details> so it works with scripting off ── */
.atlas{position:static}
.atlas>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:11px;
     min-height:44px;padding:0 2px;font-family:var(--hpc-font-mono);font-size:13px;letter-spacing:.12em;
     text-transform:uppercase;color:var(--hpc-text);position:relative;z-index:46}
/* z-index 46 puts the Menu control above the scrim (45). MEASURED 2026-08-03:
   without it, `document.elementFromPoint()` at the summary's own centre
   returned DIV.atlas__scrim, a real Playwright click was INTERCEPTED, and clicking the
   scrim does nothing because dismiss-on-outside-click would need JS and §10
   requires the page to work without it. Net effect: a mouse user who opened the
   panel could not close it by any click at all — only Escape, which most people
   will not try. The trigger already renders an X when open; it now actually
   receives the click that X promises. */
.atlas>summary::-webkit-details-marker{display:none}
.atlas>summary .atlas__bars{display:inline-flex;flex-direction:column;gap:3.5px;width:16px}
.atlas>summary .atlas__bars i{display:block;height:1.5px;background:currentColor}
/* This was the single transition in the whole stylesheet left outside the
   reduced-motion gate — measured still running at 0.3s under
   prefers-reduced-motion: reduce, while every other motion correctly zeroed. */
@media (prefers-reduced-motion:no-preference){
  /* R1-1 (expert panel M#1): 20ms stagger per bar so the X forms as a
     gesture, not a jump-cut — same spring the panel itself arrives on. */
  .atlas>summary .atlas__bars i{
    transition:transform .32s var(--ease-out),opacity .28s var(--ease-out)}
  .atlas>summary .atlas__bars i:nth-child(1){transition-delay:0s}
  .atlas>summary .atlas__bars i:nth-child(2){transition-delay:.02s}
  .atlas>summary .atlas__bars i:nth-child(3){transition-delay:.04s}
}
.atlas[open]>summary .atlas__bars i:nth-child(1){transform:translateY(5px) rotate(45deg)}
.atlas[open]>summary .atlas__bars i:nth-child(2){opacity:0}
.atlas[open]>summary .atlas__bars i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}


/* Near-opaque on purpose. The modality rule (body:has(.atlas[open]) main)
   hides the page content entirely, so the only thing translucency ever
   revealed was the HOST's body colour — dark on canvas docs, white on
   themed pages once the landlord body{} paint was correctly removed
   (v25.1.0). .72 over white read as a pale void; .94 reads as the same
   near-black plane on every host family. */
.atlas__scrim{position:fixed;inset:0;z-index:45;background:rgba(4,6,13,.94)}
/* The scrim snapped to full 0.72 in the same frame the panel began a 420ms
   ease. Two co-arriving elements on different clocks. */
@media (prefers-reduced-motion:no-preference){
  .atlas[open] .atlas__scrim{animation:scrimin .24s var(--ease-out) both}
  @keyframes scrimin{from{opacity:0}to{opacity:1}}
}

/* ── panel envelope. Owner decision 2+3: never full-bleed, ~1200px, page
   visible either side. No backdrop-filter anywhere (§2 — the glass budget is
   spent on the hero cover and the assessment band).
   `top`/`max-height` are NOT the prototype's own values: the prototype's demo
   masthead was a single 64px bar, but MEASURED against the real
   templates/hpc-header.php + hpc-header.css at desktop widths (1200-1920px),
   `.masthead` + `.nav__bar` together render 119px (43 + 76), not 64. The
   prototype's number would have buried the bottom 55px of the real masthead
   the moment this ships. 120px/32px keeps the same ~32px breathing room below
   the panel that the original top+96px budget implied. ── */
.atlas__panel{position:fixed;z-index:50;top:120px;left:50%;transform:translateX(-50%);
       width:min(var(--atlas-panel-w),calc(100vw - 80px));max-height:calc(100vh - 152px);
       background:var(--hpc-panel);border:1px solid var(--hpc-line-strong);
       box-shadow:0 40px 120px -20px var(--atlas-shadow),0 0 0 1px rgba(0,0,0,.4);
       display:flex;flex-direction:column;overflow:hidden}
@media (prefers-reduced-motion:no-preference){
  .atlas[open] .atlas__panel{animation:pnl .3s var(--ease-out) both}
  @keyframes pnl{from{opacity:0;transform:translateX(-50%) translateY(-10px)}
                 to{opacity:1;transform:translateX(-50%) translateY(0)}}
}

/* ── tab bar ── */
.atlas__tabs{display:flex;align-items:stretch;border-bottom:1px solid var(--hpc-line-strong);flex:none}
.atlas__tab{flex:none;display:inline-flex;align-items:center;gap:9px;min-height:52px;padding:0 22px;
     cursor:pointer;font-family:var(--hpc-font-sans);font-size:14px;font-weight:600;color:var(--hpc-text-muted);
     letter-spacing:-.005em;border-right:1px solid var(--hpc-line);position:relative}
.atlas__tab-count{font-family:var(--hpc-font-mono);font-size:11px;font-weight:500;color:var(--hpc-text-muted);letter-spacing:.06em}

.atlas__tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:transparent}
/* .atlas__holdings was 800px of flex spacer rendering nothing. It now carries the
   holdings the three tabs do not cover — real counts from nav-full.json's
   reference.library.types, never invented. Inert, so §10's touch-target rule
   does not apply; 11px mono is lawful under §5 because every value is data. */
.atlas__holdings{flex:1;display:flex;align-items:center;justify-content:flex-end;gap:18px;
  padding:0 22px;overflow:hidden;font-family:var(--hpc-font-mono);font-size:11px;
  color:var(--hpc-text-muted);letter-spacing:.04em;border-bottom:0;white-space:nowrap}
.tsp-k{text-transform:uppercase;letter-spacing:.12em;opacity:.7}
.tsp-i b{color:var(--hpc-text-soft);font-weight:600}
@media (max-width:1100px){.atlas__holdings{display:none}}
.atlas__rad{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.atlas__rad:focus-visible+.atlas__tab,.atlas__rad:focus-visible+label{outline:2px solid var(--hpc-gold);outline-offset:-2px}
#atlas-tab-pillars:checked~.atlas__tabs .atlas__tab[for=atlas-tab-pillars],
#atlas-tab-assess:checked~.atlas__tabs .atlas__tab[for=atlas-tab-assess],
#atlas-tab-protocols:checked~.atlas__tabs .atlas__tab[for=atlas-tab-protocols]{color:var(--hpc-text)}
#atlas-tab-pillars:checked~.atlas__tabs .atlas__tab[for=atlas-tab-pillars]::after,
#atlas-tab-assess:checked~.atlas__tabs .atlas__tab[for=atlas-tab-assess]::after,
#atlas-tab-protocols:checked~.atlas__tabs .atlas__tab[for=atlas-tab-protocols]::after{background:var(--hpc-text)}
.atlas__coll{display:none;min-height:0;flex:1}
#atlas-tab-pillars:checked~.atlas__body .atlas__coll--pillars,
#atlas-tab-assess:checked~.atlas__body .atlas__coll--assess,
#atlas-tab-protocols:checked~.atlas__body .atlas__coll--protocols{display:flex}
.atlas__body{flex:1;min-height:0;display:flex}

/* ── the two columns ── */
.atlas__col{width:var(--atlas-col-l);flex:none;overflow-y:auto;border-right:1px solid var(--hpc-line-strong)}
/* The shelf scrolls, and now it SAYS so. MEASURED 2026-08-03: content runs
   871-895px into a 749px column, so every pillar is cut by 122-146px — roughly
   a sixth of the shelf, including the whole Featured block — and there was no
   fade, no shadow and no scrollbar to indicate it. The cut read as the end of
   the content. A mask fade on the last 44px turns a silent truncation into an
   affordance; `scrollbar-gutter: stable` stops the column reflowing by the
   scrollbar's width when it appears. Both are free — no new element, no new
   hex, no JS. (This does not FIX the overflow, it stops it lying. The real
   budget question is with the density seat.) */
.atlas__shelf{flex:1;min-width:0;overflow-y:auto;position:relative;
  scrollbar-gutter:stable;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,1) calc(100% - 44px),transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,1) calc(100% - 44px),transparent 100%)}
/* at the very bottom of the scroll there is nothing more to promise, so the
   fade retires rather than dimming the last row for no reason */
.atlas__shelf:has(.atlas__shelf-in:last-child){mask-position:0 0}
@supports (animation-timeline:scroll()){
  @media (prefers-reduced-motion:no-preference){
    .atlas__shelf{animation:shelffade linear both;animation-timeline:scroll(self);
           animation-range:contain 88% contain 100%}
    @keyframes shelffade{
      to{mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 100%,rgba(0,0,0,1) 100%);
         -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 100%,rgba(0,0,0,1) 100%)}}
  }
}
/* the mobile fade overlay's retirement (see the <=900px block) */
@keyframes shelffadeafter{to{opacity:0}}
/* mobile-only surface; the <=900px block turns it on */
.atlas__glossary-bar{display:none}

.atlas__sh-empty{padding:56px 44px;display:flex;flex-direction:column;justify-content:flex-end;
          height:100%}
.atlas__sh-empty p{font-family:var(--hpc-font-mono);font-size:13px;letter-spacing:.06em;color:var(--hpc-text-muted);
            margin:0;max-width:34ch;line-height:1.8}
.atlas__sh{display:none;height:100%}
/* The leader. Was a hardcoded 61-character literal dot string clipped by
   overflow, which cannot adapt to the container it sits in — MEASURED
   2026-08-03: the string renders at a fixed 439.2px, so on `social`'s short
   subcategory names the leader stopped 17-45px short of the count on all five
   rows, and on `bio`'s two longest names the container collapsed to 8.9px and
   0px and the leader vanished entirely, leaving the count floating unattached
   on the site's most-trafficked shelf. A repeating background fills whatever
   width it is given, at any name length, forever. `background-size` sets the
   pitch; the gradient stop sets the dot. No new hex — --line-heavy is an
   existing token. */
.atlas__lead{flex:1;min-width:0;align-self:center;height:1px;
      background-image:radial-gradient(circle at 1px 50%, var(--atlas-line-heavy) 1px, transparent 1.2px);
      background-size:6px 2px;background-repeat:repeat-x;background-position:0 50%}

/* Hover, press, and touch feedback for the reading surface.
   MEASURED 2026-08-03: every text hover in the panel computed
   `transition-duration: 0s` — the colour swapped instantly — while the only two
   elements with a real transition were the aria-hidden decorative thumbnails.
   The craft had gone to the layer nobody reads. §8 permits hover motion inside
   this gate; it was simply never written. */
@media (prefers-reduced-motion:no-preference){
.atlas__tab,
.atlas__row .atlas__row-name,
.atlas__legend-row .atlas__legend-name,
.atlas__feat .atlas__feat-title,
.atlas>summary{
    transition:color .2s var(--ease-out)}
}
.atlas__row:active,
.atlas__legend-row:active,
.atlas__tab:active{
  background:var(--hpc-line)}
.atlas__row,
.atlas__legend-row,
.atlas__tab,
.atlas>summary,
.atlas__back{-webkit-tap-highlight-color:transparent}

.atlas__feat{display:block;padding:16px 0 0;margin-top:auto}
.atlas__feat .atlas__feat-kicker{font-family:var(--hpc-font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
          color:var(--hpc-text-muted);display:flex;gap:10px;align-items:center;margin:0 0 9px}
.atlas__feat .atlas__feat-title{font-family:var(--hpc-font-display);font-size:20px;font-weight:400;line-height:1.25;
          color:var(--hpc-text);margin:0}


/* the two pillars with no plate never get a stand-in; they get an honest mark */
.atlas__noplate{display:flex;align-items:center;justify-content:center;text-align:center;
         border:1px dashed var(--atlas-line-heavy);background:var(--hpc-panel-2)}
.atlas__noplate span{font-family:var(--hpc-font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
              color:var(--hpc-text-muted);line-height:2}
.atlas__noplate b{display:block;color:var(--hpc-text-soft);font-size:12px;font-weight:600}

/* ── mobile: drill-down stack. Each level is a full screen; picking a pillar
   slides its shelf in from the right over the list, with a Back control that
   is just a label pointing at the "no pillar" radio. ── */
.atlas__back{display:none}
@media (max-width:900px){
  /* The mock's iteration-2b law, ported at last: the panel starts BELOW the
     header bar, so the morphing X trigger stays visible and hittable — the
     summary is the only control that can close a <details> without JS.
     --hpc-header-h is measured by hpc-header.js (same contract as
     --hpc-masthead-h); the fallback matches the desktop panel offset.
     While open, hpc-nav-atlas.css pins the whole header (see the
     :has([open]) rule below) so this offset holds at every scroll depth.
     Gate: tests/test_nav_atlas_mobile_close.py */
  .atlas__panel{top:var(--hpc-header-h,120px);left:0;transform:none;width:100vw;border:0;
       height:calc(100dvh - var(--hpc-header-h,120px));
       max-height:calc(100dvh - var(--hpc-header-h,120px))}
  @media (prefers-reduced-motion:no-preference){
    .atlas[open] .atlas__panel{animation:pnlm .34s var(--ease-out) both}
    @keyframes pnlm{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
  }
  .atlas__tabs{overflow-x:auto;scrollbar-width:none}
  .atlas__tabs::-webkit-scrollbar{display:none}
  /* R1-5 (expert panel MB-3): the glossary link squeezed into the scrolling
     tab strip PASSED a 44px rect check while its hit-test rect landed under
     the Assessments tab — untappable on every phone width. The Wave-1 law
     ("a real /glossary/ path must exist on mobile") now lives in a dedicated
     full-width bar under the tab strip (.atlas__glossary-bar, markup in
     hpc-nav-atlas.php) with nothing to fight for space with. The holdings
     line stays a desktop surface (hidden <=1100px as before).
     Gate: tests/test_nav_atlas_showcase.py R1-5 (hit-test, not rect). */
  .atlas__glossary-bar{display:flex;align-items:center;gap:8px;min-height:44px;
        padding:0 18px;border-bottom:1px solid var(--hpc-line);flex:none;
        font-family:var(--hpc-font-mono);font-size:13px;letter-spacing:.08em;
        text-transform:uppercase;color:var(--hpc-text-soft);text-decoration:none}
  .atlas__glossary-bar b{font-weight:600;color:var(--hpc-text)}
  .atlas__glossary-bar:focus-visible{outline:2px solid var(--hpc-gold);outline-offset:-2px}
  .atlas__body{position:relative;min-height:0}
  /* The pillar/drill columns and the slide-over shelves scroll INSIDE the
     panel — every row reachable at phone size (consumer panels Wave 1;
     the Atlas never had these rules because it never ran on mobile).
     R1-3 (expert panel MB-1): overscroll-behavior:contain on BOTH panes —
     the retired drawer carried it (hpc-header.css 905/2929), the Atlas
     panes never did, and a fling past the inner scroll end leaked
     3300-3900px of invisible window scroll. */
  /* R1-4 (expert panel MB-2): scroll freeze while the panel is open — the
     CSS-only sibling of the drawer's JS lock. overflow:hidden keeps the
     scroll position (no position:fixed, so the sticky header stays put);
     initAtlas() adds a restore-on-close belt for any drift that still gets
     through (iOS). Same body:has() idiom as the modality rule above. */
  body:has(details.atlas[open]){overflow:hidden}
  .atlas__scrim{touch-action:none}
  .atlas__col{width:100%;border-right:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
        overscroll-behavior:contain}
  .atlas__shelf{position:absolute;inset:0;background:var(--hpc-panel);transform:translateX(100%);
         visibility:hidden;z-index:2;overflow-y:auto;-webkit-overflow-scrolling:touch;
         overscroll-behavior:contain}
  /* R1-6 (expert panel VC-2): the desktop scroll-fade is a TRUE alpha mask;
     on mobile the shelf is a full-screen overlay stacked on the pillar list,
     so the mask punched a 44px window straight through to unrelated rows
     behind it. Mobile swaps the element mask for an opaque sticky gradient
     that composites against the shelf's own panel colour — same affordance,
     no punch-through — with the same scroll-driven retirement at bottom. */
  .atlas__shelf{mask-image:none;-webkit-mask-image:none;animation:none}
  .atlas__shelf::after{content:"";position:sticky;bottom:0;display:block;height:44px;
        margin-top:-44px;flex:none;pointer-events:none;
        background:linear-gradient(to bottom,transparent,var(--hpc-panel))}
  @supports (animation-timeline:scroll()){
    @media (prefers-reduced-motion:no-preference){
      .atlas__shelf::after{animation:shelffadeafter linear both;
            animation-timeline:scroll(nearest);
            animation-range:contain 88% contain 100%}
    }
  }
  @media (prefers-reduced-motion:no-preference){
    .atlas__shelf{transition:transform .34s var(--ease-out),visibility .34s}
  }
  .atlas__back{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 18px;
        font-family:var(--hpc-font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
        color:var(--hpc-text-soft);cursor:pointer;border-bottom:1px solid var(--hpc-line);width:100%}
  /* clip the shelf parked off-canvas at translateX(100%). Deliberately on the
     panel's own flex row and NOT on html/body — overflow-x there kills
     position:sticky, which the masthead depends on. */
  .atlas__body{overflow:hidden}
}
/* While the panel is open, pin the WHOLE header (masthead included) so the
   nav row — and the X trigger in it — sits at a knowable height at every
   scroll depth, and the mobile panel's top offset above always lands flush
   under it. Outside the open state the sticky keeps its normal travel
   (nav row alone pins; see hpc-header.css). :has() carries the specificity. */
header.hpc-header:has(details.atlas[open]){top:0}
@media (max-width:700px){
}
@media (max-width:560px){
}
.atlas__blurb{font-size:15px;line-height:1.6;color:var(--hpc-text-soft);margin:16px 0 18px;max-width:52ch}
@media (max-width:900px){}
.atlas__void{font-family:var(--hpc-font-mono);font-size:13px;color:var(--hpc-text-muted);padding:22px 0;margin:0}
.atlas__coll--assess .atlas__shelf .atlas__sh,.atlas__coll--protocols .atlas__shelf .atlas__sh{background:var(--hpc-panel)}
@media (max-width:900px){
}

.atlas__sh-empty{display:none}
#atlas-pillar-index:checked~.atlas__body .atlas__sh-rest{display:flex}
#atlas-pillar-bio:checked~.atlas__body .atlas__sh-bio,#atlas-pillar-flow:checked~.atlas__body .atlas__sh-flow,#atlas-pillar-decisions:checked~.atlas__body .atlas__sh-decisions,#atlas-pillar-learning:checked~.atlas__body .atlas__sh-learning,#atlas-pillar-habits:checked~.atlas__body .atlas__sh-habits,#atlas-pillar-identity:checked~.atlas__body .atlas__sh-identity,#atlas-pillar-leadership:checked~.atlas__body .atlas__sh-leadership,#atlas-pillar-arena:checked~.atlas__body .atlas__sh-arena,#atlas-pillar-nutri:checked~.atlas__body .atlas__sh-nutri,#atlas-pillar-social:checked~.atlas__body .atlas__sh-social{display:flex}
#atlas-pillar-bio:checked~.atlas__body .atlas__sh-bio,#atlas-pillar-flow:checked~.atlas__body .atlas__sh-flow,#atlas-pillar-decisions:checked~.atlas__body .atlas__sh-decisions,#atlas-pillar-learning:checked~.atlas__body .atlas__sh-learning,#atlas-pillar-habits:checked~.atlas__body .atlas__sh-habits,#atlas-pillar-identity:checked~.atlas__body .atlas__sh-identity,#atlas-pillar-leadership:checked~.atlas__body .atlas__sh-leadership,#atlas-pillar-arena:checked~.atlas__body .atlas__sh-arena,#atlas-pillar-nutri:checked~.atlas__body .atlas__sh-nutri,#atlas-pillar-social:checked~.atlas__body .atlas__sh-social{display:flex}
@media (max-width:900px){
#atlas-pillar-bio:checked~.atlas__body .atlas__shelf,#atlas-pillar-flow:checked~.atlas__body .atlas__shelf,#atlas-pillar-decisions:checked~.atlas__body .atlas__shelf,#atlas-pillar-learning:checked~.atlas__body .atlas__shelf,#atlas-pillar-habits:checked~.atlas__body .atlas__shelf,#atlas-pillar-identity:checked~.atlas__body .atlas__shelf,#atlas-pillar-leadership:checked~.atlas__body .atlas__shelf,#atlas-pillar-arena:checked~.atlas__body .atlas__shelf,#atlas-pillar-nutri:checked~.atlas__body .atlas__shelf,#atlas-pillar-social:checked~.atlas__body .atlas__shelf{transform:none;visibility:visible}
}
/* one back control per collection, hoisted out of the shelves (defect 2) */
.atlas__back{display:none}
@media (max-width:900px){
  .atlas__shelf>.atlas__back{display:inline-flex;position:sticky;top:0;z-index:3;background:var(--hpc-panel)}
  .atlas__sh .atlas__back{display:none}
}

/* Focus travels from the visually-hidden radio to whichever label points at it,
   wherever that label sits in the DOM. Verified: focusing #atlas-pillar-bio previously
   produced no perceivable change anywhere on the page. */
.atlas__panel:has(#atlas-pillar-index:focus-visible) label[for="atlas-pillar-index"],
.atlas__panel:has(#atlas-pillar-bio:focus-visible) label[for="atlas-pillar-bio"],
.atlas__panel:has(#atlas-pillar-flow:focus-visible) label[for="atlas-pillar-flow"],
.atlas__panel:has(#atlas-pillar-decisions:focus-visible) label[for="atlas-pillar-decisions"],
.atlas__panel:has(#atlas-pillar-learning:focus-visible) label[for="atlas-pillar-learning"],
.atlas__panel:has(#atlas-pillar-habits:focus-visible) label[for="atlas-pillar-habits"],
.atlas__panel:has(#atlas-pillar-identity:focus-visible) label[for="atlas-pillar-identity"],
.atlas__panel:has(#atlas-pillar-leadership:focus-visible) label[for="atlas-pillar-leadership"],
.atlas__panel:has(#atlas-pillar-arena:focus-visible) label[for="atlas-pillar-arena"],
.atlas__panel:has(#atlas-pillar-nutri:focus-visible) label[for="atlas-pillar-nutri"],
.atlas__panel:has(#atlas-pillar-social:focus-visible) label[for="atlas-pillar-social"],
.atlas__panel:has(#atlas-tab-pillars:focus-visible) label[for="atlas-tab-pillars"],
.atlas__panel:has(#atlas-tab-assess:focus-visible) label[for="atlas-tab-assess"],
.atlas__panel:has(#atlas-tab-protocols:focus-visible) label[for="atlas-tab-protocols"]{outline:2px solid var(--hpc-gold);outline-offset:-3px;background:var(--hpc-panel)}
.atlas__rad:focus-visible+.atlas__tab{outline:2px solid var(--hpc-gold);outline-offset:-2px}

/* A flex item's automatic minimum size is its min-content width, so .atlas__coll could
   not shrink to the panel and laid out at 1198-1262px inside a 1200px panel —
   overflowing in nine of eleven builds and silently clipped by the panel's
   overflow:hidden. Atlas v2 was worst, losing 17px of the running head, the
   plate and the title. Measured against the PANEL edge; an earlier check
   compared against the shelf's own rect, which was itself already outside the
   visible area, and so reported clean. */
.atlas__coll{min-width:0}
.atlas__col{min-width:0}

.atlas__coll--pillars .atlas__col{background:var(--hpc-panel-2);padding:12px 0 28px}
.atlas__row{display:flex;align-items:center;gap:12px;min-height:52px;padding:8px 24px;
  cursor:pointer;border-bottom:1px solid var(--hpc-line);position:relative}
.atlas__row-plate-label{font-family:var(--hpc-font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--hpc-text-muted);opacity:.65;flex:none}
.atlas__row-num{font-family:var(--hpc-font-mono);font-size:13px;font-weight:600;color:var(--pac);flex:none}
.atlas__row-name{font-size:17px;font-weight:600;color:var(--hpc-text-soft);letter-spacing:-.006em;flex:none}
.atlas__row-count{font-family:var(--hpc-font-mono);font-size:12px;color:var(--hpc-text-muted);flex:none}

/* the runner line — muted, 13px (§5 floor, DM Sans not mono since these are
   names a reader parses), never bolder than the name above it */
.atlas__row{align-items:flex-start;padding:8px 24px 12px}
.atlas__row-chip{margin-top:2px}
.atlas__row-main{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.atlas__row-line1{display:flex;align-items:baseline;gap:12px;width:100%}
.atlas__row-runner{font-size:13px;line-height:1.35;color:var(--hpc-text-muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.atlas__coll--pillars .atlas__sh{display:none}
.atlas__shelf-in{display:flex;flex-direction:column;width:100%;padding:28px 44px 40px}
.atlas__shelf-run{display:flex;align-items:center;gap:12px;font-family:var(--hpc-font-mono);font-size:11px;
  letter-spacing:var(--tr-eyebrow);text-transform:uppercase;color:var(--hpc-text-muted);margin:0 0 20px;
  padding-bottom:8px;border-bottom:1px solid var(--hpc-line-strong)}
.atlas__shelf-run-dot{width:8px;height:8px;background:var(--pac);flex:none}
.atlas__figure{margin:0 0 8px}
.atlas__figure-img{width:100%;aspect-ratio:2.4/1;object-fit:cover;display:block}
/* R2-7 (expert panel VC-4): three plates are square 1024x1024 sources inside
   a 2.4:1 crop — ~58% of their height discarded, and habits' statue lost its
   head at the default 50% 50%. Hand-tuned until the subject survives; the
   long-term fix (re-export at 1456x816) is in the deferred list. */
.atlas__sh-habits .atlas__figure-img{object-position:50% 22%}
.atlas__sh-decisions .atlas__figure-img{object-position:50% 42%}
.atlas__sh-leadership .atlas__figure-img{object-position:50% 35%}
/* R2-6 (expert panel IA-4): at 1024x768 the 2.4:1 figure left ONE of five
   legend rows visible on first paint — most of a pillar's own index hidden
   behind an unsignalled scroll. In the 901-1120 band the photograph is the
   first thing sacrificed for information density (a 5.2:1 sliver was tried
   and still cost ~100px for no compositional value): band, blurb and legend
   stay. Same trade Arc/Linear make on cramped viewports. */
@media (min-width:901px) and (max-width:1120px){
  .atlas__figure{display:none}
  .atlas__blurb{margin:10px 0 12px}
}
.atlas__figure figcaption{font-family:var(--hpc-font-mono);font-size:11px;letter-spacing:.08em;color:var(--hpc-text-muted);
  padding:8px 0 0;text-align:center;position:relative}
.atlas__shelf-title{font-family:var(--hpc-font-display);font-weight:400;font-size:32px;line-height:1.06;margin:0 0 6px;
  letter-spacing:-.014em}
.atlas__legend-head{font-family:var(--hpc-font-mono);font-size:11px;letter-spacing:var(--tr-eyebrow);text-transform:uppercase;
  color:var(--hpc-text-muted);margin:8px 0 2px;padding-bottom:8px;
  border-bottom:1px solid var(--hpc-line-strong)}
.atlas__legend-row{display:flex;align-items:baseline;gap:12px;min-height:44px;padding:8px 0;
  border-bottom:1px solid var(--hpc-line)}
.atlas__legend-addr{font-family:var(--hpc-font-mono);font-size:12px;color:var(--pac);flex:none;width:38px}
.atlas__legend-name{font-size:14px;color:var(--hpc-text-soft);line-height:1.35}

.atlas__legend-count{font-family:var(--hpc-font-mono);font-size:12px;color:var(--hpc-text-muted);flex:none}
.atlas__coll--pillars .atlas__feat{margin-top:8px;padding-top:12px;border-top:1px solid var(--hpc-line-strong)}
/* a plateless pillar gets a short ruled band, never a borrowed crop and never a
   reverent empty rectangle — editorial's warning about the Vitrine */
.atlas__figure--void .atlas__noplate{aspect-ratio:auto;height:74px;border:1px dashed var(--pac);
  background:repeating-linear-gradient(135deg,transparent 0 7px,var(--hpc-line) 7px 8px);
  display:flex;align-items:center;justify-content:center;width:100%}
.atlas__figure--void .atlas__noplate span{font-family:var(--hpc-font-mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--hpc-text-muted)}
.atlas__figure--void .atlas__noplate b{display:none}
@media (max-width:900px){
  .atlas__shelf-in{padding:18px 20px 32px} .atlas__shelf-title{font-size:24px}
  .atlas__row-name{font-size:15px} .atlas__row{gap:8px;padding:8px 20px}
}
/* ── THE INDEX LEAF ──────────────────────────────────────────────────
   The rest state. An atlas opens to its index, not to a blank verso:
   all fifty shelf names in full (the left rows truncate theirs), their
   addresses and counts, two columns, text only, zero requests. §5 keeps
   every size at or above the 13px floor except the mono addresses and
   counts, which sit at the register's established 11-12px mono scale.
   Elements are div/span on purpose — the shared `.atlas__sh-empty p` rule at
   (0,1,1) would silently beat any single-class rule here (the
   specificity landmine), so no <p> exists for it to catch. */
.atlas__sh-rest.atlas__index{justify-content:flex-start;padding:24px 28px;overflow:hidden}
.atlas__index-cap{display:flex;align-items:baseline;gap:12px;font-family:var(--hpc-font-mono);font-size:11px;
  letter-spacing:var(--tr-eyebrow);text-transform:uppercase;color:var(--hpc-text-muted);margin:0 0 12px;
  padding-bottom:8px;border-bottom:1px solid var(--hpc-line-strong)}
.atlas__index-cols{columns:2;column-gap:20px}
/* R2-5 (expert panel VC-3): at 1024 the two-column leaf pinned every title to
   135px and ellipsised 6 of 10 — breaking the leaf's one promise, "all fifty
   shelf names in full". One column at laptop widths keeps the promise. */
@media (max-width:1300px){.atlas__index-cols{columns:1}}
.atlas__index-group{break-inside:avoid;margin-bottom:4px}
.atlas__index-head{display:flex;align-items:baseline;gap:8px;margin:0;padding:4px 0 2px}
/* the affordance a non-tech reader asked for: a table of contents does not
   look pressable, so each group carries a quiet chevron and a hover wash */
.atlas__index-head::after{content:"›";margin-left:auto;font-family:var(--hpc-font-mono);font-size:13px;
  color:var(--hpc-text-muted)}


.atlas__index-num{font-family:var(--hpc-font-mono);font-size:12px;font-weight:600;color:var(--pac)}
.atlas__index-title{font-size:13px;font-weight:600;color:var(--hpc-text-soft);letter-spacing:-.004em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.atlas__index-row{display:flex;align-items:baseline;gap:8px;font-size:13px;line-height:1.3;
  padding:1px 0}
.atlas__index-addr{font-family:var(--hpc-font-mono);font-size:11px;color:var(--pac);flex:none;width:28px}
/* R2-1: the name is a real destination now — link resets keep the row's
   register; hover/focus treatments match the legend-row grammar. */
.atlas__index-name{color:var(--hpc-text-muted);letter-spacing:-.006em;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;text-decoration:none}
@media (hover:hover) and (pointer:fine){
  .atlas__index-name:hover{color:var(--hpc-text);text-decoration:underline;
    text-underline-offset:3px;text-decoration-color:var(--pac)}
}
.atlas__index-name:focus-visible{outline:2px solid var(--hpc-gold);outline-offset:1px;
  color:var(--hpc-text)}
.atlas__index-count{font-family:var(--hpc-font-mono);font-size:11px;color:var(--hpc-text-muted);flex:none;margin-left:auto}
/* rows carry no leaders: fifty dotted lines beside the left column's own
   would be texture, not information, and the width they cost is what the
   longest shelf names need. The cap keeps its one. */
@media (max-width:900px){#atlas-pillar-index:checked~.atlas__body .atlas__sh-rest.atlas__index{display:none}}

.atlas__row-chip{position:relative;display:block;width:46px;height:29px;flex:none;overflow:hidden;
  background:var(--hpc-panel);border:1px solid var(--hpc-line-strong)}
/* R2-8 (expert panel VC-5): saturate(.10) brightness(.55) left 8 of 10 chips
   reading as near-black smudges at 44x27 — and the hover recovery is
   hover:hover-gated, so touch users NEVER saw the commissioned art. Still
   held back relative to the plate, but now legibly a photograph at rest. */
.atlas__row-chip-img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.28) brightness(.72)}
@media (prefers-reduced-motion:no-preference){
  .atlas__row-chip-img{transition:filter .35s var(--ease-out)}
}

.atlas__row-chip .atlas__noplate{width:100%;height:100%;border:0;
  background:repeating-linear-gradient(135deg,transparent 0 4px,var(--hpc-line) 4px 5px)}
.atlas__row-chip .atlas__noplate span{display:none}
@media (max-width:900px){.atlas__row-chip{width:40px;height:25px}}

/* the one variant that lets the accent hold a whole plane. The number is
   knocked out of the band in the panel colour rather than printed on it. */
.atlas__shelf-in--placard{padding:0 0 36px}
.atlas__band{display:flex;align-items:center;gap:16px;background:var(--pac);
  padding:12px 40px;margin-bottom:16px}
.atlas__band-num{font-family:var(--hpc-font-mono);font-size:26px;font-weight:600;color:var(--hpc-panel-2);
  letter-spacing:-.02em;position:relative}
/* the registration tick: a dotted rule in the knockout colour ties the
   band numeral to the leader grammar every other number lives on */
.atlas__band-num::after{content:"";position:absolute;left:1px;right:1px;bottom:-5px;height:1px;
  background-image:repeating-linear-gradient(to right,var(--hpc-panel-2) 0 1px,transparent 1px 4px)}
.atlas__band-title{font-family:var(--hpc-font-display);font-size:26px;color:var(--hpc-panel-2);line-height:1.05;
  letter-spacing:-.012em}
/* no opacity on the knockout: at .75 the count composited to 4.29:1 on arena
   (#C47358), under AA. At full strength the worst accent is 5.73:1. Hierarchy
   is carried by size and mono, not by fading text on a coloured plane. */
.atlas__band-count{font-family:var(--hpc-font-mono);font-size:12px;color:var(--hpc-panel-2);margin-left:auto;
  display:flex;align-items:baseline}
/* the register word inside the plane: catalogues label their numbers, ads do not */
.atlas__band-count i{font-style:normal;font-size:11px;letter-spacing:var(--tr-kicker);
  text-transform:uppercase;margin-left:6px}
.atlas__shelf-in--placard .atlas__figure,.atlas__shelf-in--placard .atlas__blurb,.atlas__shelf-in--placard .atlas__legend-head,.atlas__shelf-in--placard .atlas__legend-row,.atlas__shelf-in--placard .atlas__feat,
.atlas__shelf-in--placard .atlas__shelf-run{margin-left:40px;margin-right:40px}
.atlas__shelf-in--placard .atlas__shelf-run{display:none}
/* ── THE ENGRAVED PLATE ────────────────────────────────────────────────
   Parity, not apology. A plateless pillar gets the same 2:1 mount a
   photograph gets, drawn from its own accent. Rings + a stroked numeral;
   no plane is filled, so Amendment 16's budget is untouched and this
   stays inside §3's hairline allowance. §1: color-mix of existing tokens
   only, no new hex. §5: caption at the 13px floor; the numeral is display
   type well above Amendment 13's 28px minimum. */
.atlas__figure--void .atlas__noplate{aspect-ratio:2.4/1;height:auto;width:100%;border:1px solid var(--pac);
  position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:var(--hpc-panel-2)}
.atlas__figure--void .atlas__noplate::before{content:"";position:absolute;inset:0;
  background:repeating-radial-gradient(circle at 50% 50%,
    transparent 0 26px,
    color-mix(in srgb, var(--pac) 30%, transparent) 26px 27px)}
.atlas__figure--void .atlas__noplate .atlas__plate-num{position:relative;z-index:1;font-family:var(--hpc-font-display);font-weight:400;
  font-size:clamp(56px,11vw,108px);line-height:1;letter-spacing:normal;text-transform:none;
  color:color-mix(in srgb, var(--pac) 45%, transparent)}
.atlas__figure--void .atlas__noplate .atlas__plate-cap{position:absolute;z-index:1;left:16px;bottom:12px;right:16px;
  font-family:var(--hpc-font-mono);font-size:13px;letter-spacing:var(--tr-kicker);text-transform:uppercase;
  color:var(--hpc-text-muted);text-align:left;display:block}
.atlas__figure--void .atlas__noplate .atlas__plate-cap b{display:block;color:var(--hpc-text-soft);font-size:13px;font-weight:600;
  margin-bottom:2px}
/* the index chip speaks the same language — the hazard hatch is retired.
   Iteration 1: at 74px the old 3-4px double-ring pattern read as damage,
   not engraving ("looked like something broke" — consumer jury). Fewer,
   wider rings and a solid accent numeral read as a deliberate mark. */
.atlas__row-chip .atlas__noplate{background:repeating-radial-gradient(circle at 50% 50%,
    transparent 0 7px, color-mix(in srgb, var(--pac) 40%, transparent) 7px 8px),
  var(--hpc-panel-2)}
.atlas__row-chip .atlas__noplate .atlas__plate-cap{display:none}
.atlas__row-chip .atlas__noplate .atlas__plate-num{display:block;font-size:12px;-webkit-text-stroke:0;
  color:var(--pac)}
#atlas-pillar-bio:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-bio],
#atlas-pillar-flow:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-flow],
#atlas-pillar-decisions:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-decisions],
#atlas-pillar-learning:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-learning],
#atlas-pillar-habits:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-habits],
#atlas-pillar-identity:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-identity],
#atlas-pillar-leadership:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-leadership],
#atlas-pillar-arena:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-arena],
#atlas-pillar-nutri:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-nutri],
#atlas-pillar-social:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-social]{background:var(--hpc-panel)}
#atlas-pillar-bio:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-bio] .atlas__row-name,
#atlas-pillar-flow:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-flow] .atlas__row-name,
#atlas-pillar-decisions:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-decisions] .atlas__row-name,
#atlas-pillar-learning:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-learning] .atlas__row-name,
#atlas-pillar-habits:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-habits] .atlas__row-name,
#atlas-pillar-identity:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-identity] .atlas__row-name,
#atlas-pillar-leadership:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-leadership] .atlas__row-name,
#atlas-pillar-arena:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-arena] .atlas__row-name,
#atlas-pillar-nutri:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-nutri] .atlas__row-name,
#atlas-pillar-social:checked~.atlas__body .atlas__coll .atlas__row[for=atlas-pillar-social] .atlas__row-name{color:var(--hpc-text)}
#atlas-pillar-bio:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-bio] .atlas__row-chip-img,
#atlas-pillar-flow:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-flow] .atlas__row-chip-img,
#atlas-pillar-decisions:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-decisions] .atlas__row-chip-img,
#atlas-pillar-learning:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-learning] .atlas__row-chip-img,
#atlas-pillar-habits:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-habits] .atlas__row-chip-img,
#atlas-pillar-identity:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-identity] .atlas__row-chip-img,
#atlas-pillar-leadership:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-leadership] .atlas__row-chip-img,
#atlas-pillar-arena:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-arena] .atlas__row-chip-img,
#atlas-pillar-nutri:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-nutri] .atlas__row-chip-img,
#atlas-pillar-social:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-social] .atlas__row-chip-img{filter:none}
#atlas-pillar-bio:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-bio] .atlas__row-chip,
#atlas-pillar-flow:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-flow] .atlas__row-chip,
#atlas-pillar-decisions:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-decisions] .atlas__row-chip,
#atlas-pillar-learning:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-learning] .atlas__row-chip,
#atlas-pillar-habits:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-habits] .atlas__row-chip,
#atlas-pillar-identity:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-identity] .atlas__row-chip,
#atlas-pillar-leadership:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-leadership] .atlas__row-chip,
#atlas-pillar-arena:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-arena] .atlas__row-chip,
#atlas-pillar-nutri:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-nutri] .atlas__row-chip,
#atlas-pillar-social:checked~.atlas__body .atlas__coll--pillars .atlas__row[for=atlas-pillar-social] .atlas__row-chip{border-color:var(--pac)}

@media (prefers-reduced-motion:no-preference){
#atlas-pillar-bio:checked~.atlas__body .atlas__coll--pillars .atlas__sh-bio .atlas__figure,#atlas-pillar-flow:checked~.atlas__body .atlas__coll--pillars .atlas__sh-flow .atlas__figure,#atlas-pillar-decisions:checked~.atlas__body .atlas__coll--pillars .atlas__sh-decisions .atlas__figure,#atlas-pillar-learning:checked~.atlas__body .atlas__coll--pillars .atlas__sh-learning .atlas__figure,#atlas-pillar-habits:checked~.atlas__body .atlas__coll--pillars .atlas__sh-habits .atlas__figure,#atlas-pillar-identity:checked~.atlas__body .atlas__coll--pillars .atlas__sh-identity .atlas__figure,#atlas-pillar-leadership:checked~.atlas__body .atlas__coll--pillars .atlas__sh-leadership .atlas__figure,#atlas-pillar-arena:checked~.atlas__body .atlas__coll--pillars .atlas__sh-arena .atlas__figure,#atlas-pillar-nutri:checked~.atlas__body .atlas__coll--pillars .atlas__sh-nutri .atlas__figure,#atlas-pillar-social:checked~.atlas__body .atlas__coll--pillars .atlas__sh-social .atlas__figure{
    animation:atin .22s var(--ease-out) both}
  @keyframes atin{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
}

@media (max-width:900px){
  .atlas__band{padding:12px 20px} .atlas__band-title{font-size:20px} .atlas__band-num{font-size:21px}
  .atlas__shelf-in--placard .atlas__figure,.atlas__shelf-in--placard .atlas__blurb,.atlas__shelf-in--placard .atlas__legend-head,.atlas__shelf-in--placard .atlas__legend-row,.atlas__shelf-in--placard .atlas__feat{
    margin-left:20px;margin-right:20px}
}

.atlas__shelf-in--drill{padding:26px 40px 36px}
.atlas__shelf-in--drill .atlas__shelf-title{font-size:27px;margin-bottom:14px}
.atlas__drill-list{display:flex;flex-direction:column}
.atlas__drill-row{display:flex;align-items:center;gap:16px;min-height:56px;padding:10px 0;
  border-bottom:1px solid var(--hpc-line)}
.atlas__drill-thumb{position:relative;display:block;width:74px;height:46px;flex:none;overflow:hidden;
  background:var(--hpc-panel-2);border:1px solid var(--hpc-line-strong)}
.atlas__drill-img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.45) brightness(.78)}
@media (prefers-reduced-motion:no-preference){
  .atlas__drill-img{transition:filter .35s var(--ease-out)}
}

/* 11 of 83 rows genuinely have no hero; they are ruled, never given a
   neighbour's picture */
.atlas__drill-thumb--void{border-style:dashed;border-color:var(--hpc-line-strong);
  background:repeating-linear-gradient(135deg,transparent 0 5px,var(--hpc-line) 5px 6px)}
.atlas__drill-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.atlas__drill-addr{font-family:var(--hpc-font-mono);font-size:12px;color:var(--pac);letter-spacing:.04em}
.atlas__drill-title{font-size:14px;line-height:1.35;color:var(--hpc-text-soft)}


@media (max-width:900px){
  .atlas__shelf-in--drill{padding:18px 20px 32px}
  .atlas__drill-thumb{width:58px;height:36px}
  .atlas__shelf-in--drill .atlas__shelf-title{font-size:22px}
}

/* a11y (blocker): #atlas-pillar-index is the panel's first tab stop and had no visible focus */
.atlas__panel:has(#atlas-pillar-index:focus-visible) .atlas__sh-rest.atlas__index{outline:2px solid var(--hpc-gold);outline-offset:-3px}

/* wayfinding: the holdings strip must not wear the tabs' pointer */
.atlas__tab.atlas__holdings,.atlas__tab.atlas__holdings *{cursor:default}
/* wayfinding: the whole index group jumps to its pillar (44px law: the
   group is the target now, ~117px tall) */
.atlas__index-group{display:block;cursor:pointer}

.atlas__index-group:active{background:var(--hpc-line)}
.atlas__index-title{transition:color .2s var(--ease-out)}
/* shared-rule overrides: blurb rhythm, tab gap on the 4px grid */
.atlas__blurb{margin:12px 0 8px}
.atlas__tab{gap:8px}
/* motion: press feedback settles instead of flashing (color-only, ungated) */
.atlas__row,.atlas__legend-row,.atlas__drill-row,.atlas__feat,.atlas__back,
.atlas__index-group{transition:background-color .1s var(--ease-out)}
.atlas__tab{transition:color .2s var(--ease-out),background-color .1s var(--ease-out)}
.atlas__back:active,.atlas__idx-back:active{background:var(--hpc-line)}
@media (prefers-reduced-motion:no-preference){
  #atlas-tab-pillars:checked~.atlas__body .atlas__coll--pillars,#atlas-tab-assess:checked~.atlas__body .atlas__coll--assess,#atlas-tab-protocols:checked~.atlas__body .atlas__coll--protocols{
    transition:opacity .16s var(--ease-out)}
  @starting-style{
    #atlas-tab-pillars:checked~.atlas__body .atlas__coll--pillars,#atlas-tab-assess:checked~.atlas__body .atlas__coll--assess,#atlas-tab-protocols:checked~.atlas__body .atlas__coll--protocols{opacity:0}
  }
  /* R2 motion: entrance beats compress to the container's own crossfade so
     rapid tab/pillar cycling never layers a slower second clock */
  .atlas__band,.atlas__shelf-in--placard .atlas__blurb,.atlas__shelf-in--placard .atlas__legend-head,.atlas__shelf-in--drill .atlas__shelf-run,.atlas__shelf-in--drill .atlas__shelf-title{
    animation:atin .16s var(--ease-out) both}
}
/* ── R2 council fixes ─────────────────────────────────────────────── */
/* type: every uppercase-mono micro-label resolves to one of two tokens */
details.atlas{--tr-eyebrow:.14em;--tr-kicker:.12em}
.atlas__feat .atlas__feat-kicker{letter-spacing:var(--tr-kicker);transition:color .2s var(--ease-out)}
.atlas__back{letter-spacing:var(--tr-kicker)}
/* density: void AND one-item drill panes balance instead of pooling dark */
.atlas__drill-list:has(> .atlas__void),.atlas__drill-list:has(> .atlas__drill-row:only-child){
  display:flex;flex-direction:column;justify-content:center;flex:1}
/* R3 craft: the three affordances that still snapped at 0s */
.atlas__tab::after{transition:background-color .2s var(--ease-out)}
.atlas__drill-thumb{transition:border-color .2s var(--ease-out)}
/* ── Placard iteration 1 (owner confirmed E post-jury) ─────────────── */
/* The consumer jury's keyboard user tabbed in, saw one ring around the
   whole Index Leaf, tabbed again and fell out believing the menu was
   unreachable — the arrow-key contract lived in SR-only text. The hint
   is now visible whenever any radio holds keyboard focus. aria-hidden:
   screen readers keep the fuller sr-only sentence they already had. */
.atlas__kbd-hint{display:none;position:absolute;left:24px;bottom:10px;z-index:2;
  align-items:baseline;gap:14px;font-family:var(--hpc-font-mono);font-size:11px;
  letter-spacing:var(--tr-kicker);text-transform:uppercase;color:var(--hpc-text-muted)}
.atlas__kbd-hint b{font-weight:600;color:var(--hpc-text-soft)}
.atlas__panel:has(.atlas__rad:focus-visible) .atlas__kbd-hint{display:flex}
/* ── Placard iteration 2b: the regression panel's confirmed catches ── */
/* MOBILE COULD NOT CLOSE. At <=900px the panel took the whole screen and
   buried the masthead — and the summary is the only control that can close
   a <details> without JS. Same bug class as 0f27c41 (scrim intercepting
   the summary), one layer up. The panel now starts below the masthead, so
   the X MENU control stays hittable on every viewport.
   PORT CORRECTION: the prototype's own demo masthead was 64px; the port
   inherited that number unexamined. MEASURED against the real
   templates/hpc-header.php + hpc-header.css (`.masthead` + `.nav__bar`) at
   every width in this file's own 900px breakpoint: 159px at 390-430px (the
   §10 mobile-close gate's own viewport), 155px at 600px, up to 171px at
   721-900px (`.nav__bar`'s min-height steps from 68px to 76px above 720px).
   RETIRED 2026-08-05 (audit round 3): this block's hand-carried 172px was
   itself the next generation of the same bug — it silently overrode the
   measured var(--hpc-header-h) rule earlier in this file (later-in-file
   wins at equal specificity), so the panel ignored the real header height
   and the R3-8 landscape compaction (header 76px) opened a 96px dead band.
   The var rule (fallback 120px, JS-measured, :has([open]) pins the header)
   is the one law now; the numbers this comment MEASURED live on in the
   fallback's sanity margin. When one number lies, audit its siblings. */
/* ── MICRO COUNCIL (six seats, small touches — 2026-08-03) ─────────── */
/* three seats: the leader floated ~5px above its row's baseline because
   align-self:center overrode the containers' baseline alignment. auto
   restores baseline where containers use it, center where they centre. */
.atlas__lead{align-self:auto}
/* two seats: hover brightened the name and orphaned its own count */
.atlas__row-count,.atlas__legend-count,.atlas__index-count{transition:color .2s var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .atlas__row:hover .atlas__row-count,.atlas__legend-row:hover .atlas__legend-count,.atlas__index-group:hover .atlas__index-count{color:var(--hpc-text-soft)}
}
/* hairlines: reduced-motion users had the last real line permanently
   masked — the resolving animation is lawfully gated off, so their fade
   must always land on padding, never prose */
@media (prefers-reduced-motion:reduce){
  /* not on .atlas__shelf-in: flex stretches it to the shelf's height, so its own
     padding sits inside the clamped box and never reaches scrollHeight —
     the padding must ride the last CONTENT element */
  .atlas__shelf-in--placard>:last-child,.atlas__shelf-in--drill>:last-child{padding-bottom:44px}
}
/* hairlines: inset focus rings inside dense lists (the file's own
   convention); the outset ring crossed neighbouring rows' hairlines */
.atlas__legend-row:focus-visible,.atlas__feat:focus-visible,.atlas__drill-row:focus-visible{outline-offset:-2px}
/* hairlines: the holdings strip drew a redundant hairline against the
   panel's own frame */
.atlas__holdings{border-right:0}
/* optical: on the default-checked tab the focus ring and the active
   underline stacked into a doubled bottom edge — the ring carries it */
.atlas__rad:focus-visible+.atlas__tab::after{background:transparent}
/* optical: the open X read heavier than its label — the rotation, not
   the declared height, was the weight */
.atlas[open]>summary .atlas__bars i{height:1.1px}
/* states: a dead-end row now says so before the click */
.atlas__row.is-void .atlas__row-name{color:var(--hpc-text-muted)}
/* R1-8 (expert panel AP-3): opacity:.55 stacked on the count's own .56-alpha
   color — effective .31 alpha, 2.64:1, an AA failure. The muted name alone
   already communicates the void state. */
/* depth: drill rows pressed with zero feedback; and the active wash was
   compounding with row hairlines painted from the same token */
.atlas__row:active,.atlas__legend-row:active,.atlas__tab:active,.atlas__drill-row:active,.atlas__index-group:active{
  background:var(--hpc-line);background-clip:padding-box}
/* depth: the panel's shadow ring duplicated its own border (and carried
   a colour literal). The vitrine rim replaces it: one inset catchlight
   grazing the top edge. */
.atlas__panel{box-shadow:0 40px 120px -20px var(--atlas-shadow), inset 0 1px 0 var(--atlas-line-heavy)}
/* microtype: runner truncation cut mid-word ('Hor…'); a fade-out reads
   as intent. rgba form: masks care only about alpha (the build gate
   rejects raw hex here by design). */
.atlas__row-runner{text-overflow:clip;
  mask-image:linear-gradient(90deg,rgba(0,0,0,1) calc(100% - 32px),rgba(0,0,0,0))}
/* glyphs: the panel's key hints wear the masthead keycap's own frame */
.atlas__kbd-hint b{font-weight:400;border:1px solid var(--hpc-line-strong);border-radius:3px;
  padding:1px 4px}
/* hairlines signature: the leader cinches — the dot pitch pulls taut
   (6px to 5px) the moment the eye lands on a row, like a tape measure
   drawn tight. Discrete pitch change stays under reduced motion; only
   the easing between states is gated. */
@media (prefers-reduced-motion:no-preference){
  .atlas__lead{transition:background-size .18s var(--ease-out)}
}
@media (hover:hover) and (pointer:fine){
  .atlas__row:hover .atlas__lead,.atlas__legend-row:hover .atlas__lead,.atlas__feat:hover .atlas__lead{background-size:5px 2px}
}
.atlas__row:active .atlas__lead,.atlas__legend-row:active .atlas__lead,.atlas__feat:active .atlas__lead,
.atlas__legend-row:focus-visible .atlas__lead{background-size:5px 2px}
/* states signature: the specimen-tag underline — the address token
   underlines itself in its own pillar accent on hover, so the system's
   quietest data answers the pointer in the pillar's own voice */
@media (prefers-reduced-motion:no-preference){
  .atlas__row-num,.atlas__legend-addr,.atlas__index-num,.atlas__drill-addr{transition:box-shadow .16s var(--ease-out)}
}
@media (hover:hover) and (pointer:fine){
  .atlas__row:hover .atlas__row-num{box-shadow:0 1px 0 0 var(--pac)}
  .atlas__legend-row:hover .atlas__legend-addr{box-shadow:0 1px 0 0 var(--pac)}
  .atlas__index-group:hover .atlas__index-num{box-shadow:0 1px 0 0 var(--pac)}
  .atlas__drill-row:hover .atlas__drill-addr{box-shadow:0 1px 0 0 var(--pac)}
}
/* optical signature: selection wears the room's colour — maize in the
   panel, the pillar's own accent inside its open shelf */
.atlas__panel ::selection{background:color-mix(in srgb,var(--hpc-gold) 30%,var(--hpc-panel));color:var(--hpc-text)}
.atlas__sh ::selection{background:color-mix(in srgb,var(--pac) 40%,var(--hpc-panel));color:var(--hpc-text)}
.nav__bar:has(.atlas[open]) .nav__right{visibility:hidden}
body:has(.atlas[open]) main{visibility:hidden}
/* wayfinding: the desktop route back to the Index. Lives in the tab bar
   (zero height cost — the shelf-header variant measured +44px overflow and
   was rejected). Rests at --t2: an escape hatch, not a fourth peer tab. */
.atlas__idx-back{display:none;align-items:center;gap:8px;padding:0 20px;
  min-height:44px;align-self:stretch;font-family:var(--hpc-font-mono);font-size:12px;
  letter-spacing:var(--tr-kicker);text-transform:uppercase;color:var(--hpc-text-soft);
  cursor:pointer;flex:none;border-right:1px solid var(--hpc-line-strong);
  transition:color .2s var(--ease-out)}
@media (min-width:901px){
  #atlas-pillar-bio:checked~.atlas__tabs .atlas__idx-back,#atlas-pillar-flow:checked~.atlas__tabs .atlas__idx-back,
  #atlas-pillar-decisions:checked~.atlas__tabs .atlas__idx-back,#atlas-pillar-learning:checked~.atlas__tabs .atlas__idx-back,
  #atlas-pillar-habits:checked~.atlas__tabs .atlas__idx-back,#atlas-pillar-identity:checked~.atlas__tabs .atlas__idx-back,
  #atlas-pillar-leadership:checked~.atlas__tabs .atlas__idx-back,#atlas-pillar-arena:checked~.atlas__tabs .atlas__idx-back,
  #atlas-pillar-nutri:checked~.atlas__tabs .atlas__idx-back,#atlas-pillar-social:checked~.atlas__tabs .atlas__idx-back{display:flex}
}


@media (hover:hover) and (pointer:fine){
.atlas>summary:hover{color:var(--hpc-gold)}
.atlas__tab:hover{color:var(--hpc-text-soft)}
.atlas__feat:hover .atlas__feat-kicker{color:var(--hpc-text)}
.atlas__row:hover .atlas__row-name{color:var(--hpc-text)}
.atlas__legend-row:hover .atlas__legend-name{color:var(--hpc-text)}
.atlas__index-group:hover{background:var(--hpc-line)}
.atlas__index-group:hover .atlas__index-head::after{color:var(--hpc-text)}
.atlas__row:hover .atlas__row-chip-img{filter:saturate(.5) brightness(.8)}
.atlas__drill-row:hover .atlas__drill-img{filter:none}
.atlas__drill-row:hover .atlas__drill-title{color:var(--hpc-text)}
/* the void thumb keeps its honest mark: no borrowed accent glow */
.atlas__drill-row:hover .atlas__drill-thumb:not(.atlas__drill-thumb--void){border-color:var(--pac)}
/* craft: the one row hover that broke the panel-wide --t1 convention */
.atlas__feat:hover .atlas__feat-title{color:var(--hpc-text)}
.atlas__index-group:hover .atlas__index-title{color:var(--hpc-text)}
.atlas__idx-back:hover{color:var(--hpc-gold)}
}

/* ── The Placard masthead arrangement (owner direction 2026-08-04) ──────
   In Atlas mode the Menu anchors the LEFT of the bar and the brand signs
   the RIGHT, per the approved atlas-e-placard masthead. Since the
   keyboard-order fix (consumer panels Wave 1) the ARRANGEMENT IS DOM
   ORDER — templates/hpc-header.php emits shell → right → logo in Atlas
   mode — so no `order` properties here: CSS order reorders pixels but not
   the tab sequence, which is exactly the right-to-left focus bug the
   panel's keyboard persona measured. Only the spacing rule remains. */
@media (min-width: 901px) {
	.nav__bar > .atlas { margin-right: auto; }
}
/* Mobile keeps brand-left visually (the drawer control stays right where
   readers expect it). This is the one place pixels and DOM diverge — two
   stops, hamburger before brand — accepted as the lesser mismatch. */
@media (max-width: 1023px) {
	.nav__bar > .nav__logo { order: -1; }
	.nav__bar > .nav__right { margin-left: auto; }
}

/* ── One nav system per viewport (AUDIT-2026-08-04 P0-4, amended 08-05) ──
   v25.0.1 shipped the legacy hamburger (unhidden unconditionally at
   <=1023px by hpc-header.css) NEXT TO the Atlas Menu pill — and the Atlas
   panel at 390px was a desktop placard with no dedicated close control.
   The P0 fix hid the Atlas below 1024px and made the drawer the mobile
   nav. Owner direction 2026-08-05 (mock fidelity): the selected mock runs
   THE ATLAS on mobile, panel below the header bar, morphing X trigger as
   the always-hittable close — so in mobile-atlas mode (.atlas--solo, the
   default; PHP renders no hamburger/drawer at all) the Atlas is the one
   nav at EVERY width. The hide below survives only for the rollback
   filter (hpc_header_mobile_atlas => false), which restores the P0-4
   split. Element-qualified selector on purpose — the reveal-bar
   regression (v24.4.0) taught that a bare class here silently loses.
   Gate: tests/test_nav_atlas_single_trigger.py */
@media (max-width: 1023px) {
	details.atlas:not(.atlas--solo) { display: none; }
}

/* ── Closed-panel teardown (AUDIT-2026-08-04 P0-4, overflow leg) ────────
   Chrome skips *painting* a closed <details>' content but this stylesheet's
   unconditional .atlas__panel{display:flex;...} still gave it laid-out
   geometry — measured live as a permanent 426px scrollWidth on a 390px
   trend page, with pointer-events:auto on an invisible fixed panel.
   Restore the UA's closed-details semantics explicitly. */
details.atlas:not([open]) .atlas__panel { display: none; }

/* ── Holdings row: the one real link reads as one (Wave 1) ──────────────
   Glossary is now an <a>; the underline-on-hover is the only added
   emphasis (Amendment 16 budget untouched), gated like every hover here. */
.tsp-i--link{color:inherit;text-decoration:none}
@media (hover:hover) and (pointer:fine){
  .tsp-i--link:hover{text-decoration:underline;text-underline-offset:3px}
}
.tsp-i--link:focus-visible{outline:2px solid var(--hpc-gold);outline-offset:2px}

/* ── Panel reach + honesty (consumer panels Wave 1) ─────────────────────
   Two panelists read the runner's mid-word cut as a rendering bug even
   though the micro-council chose clip+fade ON PURPOSE ("a fade-out reads
   as intent") — so the decision stands and the FADE gets loud enough to
   land: 32px was reading as a hard chop at a glance. Not an ellipsis;
   that call stays the council's. The hub link is the pillar's front door:
   quiet mono, 44px target per §10. */
.atlas__row-runner{white-space:nowrap;overflow:hidden;text-overflow:clip;
  mask-image:linear-gradient(90deg,rgba(0,0,0,1) calc(100% - 72px),rgba(0,0,0,0) calc(100% - 6px))}
.atlas__hub-link{display:flex;align-items:center;gap:8px;min-height:44px;margin-top:10px;
  padding:0 2px;font:500 13px/1 var(--hpc-font-mono);letter-spacing:.02em;
  color:var(--hpc-text-soft);text-decoration:none;border-top:1px solid var(--hpc-line)}
.atlas__hub-link:focus-visible{outline:2px solid var(--hpc-gold);outline-offset:2px}
@media (hover:hover) and (pointer:fine){
  .atlas__hub-link:hover{color:var(--hpc-text)}
  .atlas__hub-link:hover span{transform:translateX(2px)}
  .atlas__hub-link span{transition:transform .2s var(--ease-out)}
}

/* ── Wave-4 council implementations ─────────────────────────────────────
   Q1 (3-0): every pillar row wears the index groups' own '›' — finishing a
   glyph language the system already started — rotating when its shelf is
   open; plus one quiet always-on usage line (the kbd-hint is focus-gated,
   invisible to mouse users). Q2 (3-0): unlinked holdings demote to an
   inventory note. Q4 (unanimous core): the current row's plate label says
   YOU ARE HERE. No new color anywhere: Amendment 16 untouched. */
.atlas__row::after{content:"\203A";font-family:var(--hpc-font-mono);font-size:13px;
  color:var(--hpc-text-muted);margin-left:6px;transition:transform .2s var(--ease-out)}
.atlas__panel:has(#atlas-pillar-bio:checked) .atlas__row[for="atlas-pillar-bio"]::after,
.atlas__panel:has(#atlas-pillar-flow:checked) .atlas__row[for="atlas-pillar-flow"]::after,
.atlas__panel:has(#atlas-pillar-decisions:checked) .atlas__row[for="atlas-pillar-decisions"]::after,
.atlas__panel:has(#atlas-pillar-learning:checked) .atlas__row[for="atlas-pillar-learning"]::after,
.atlas__panel:has(#atlas-pillar-habits:checked) .atlas__row[for="atlas-pillar-habits"]::after,
.atlas__panel:has(#atlas-pillar-identity:checked) .atlas__row[for="atlas-pillar-identity"]::after,
.atlas__panel:has(#atlas-pillar-leadership:checked) .atlas__row[for="atlas-pillar-leadership"]::after,
.atlas__panel:has(#atlas-pillar-arena:checked) .atlas__row[for="atlas-pillar-arena"]::after,
.atlas__panel:has(#atlas-pillar-nutri:checked) .atlas__row[for="atlas-pillar-nutri"]::after,
.atlas__panel:has(#atlas-pillar-social:checked) .atlas__row[for="atlas-pillar-social"]::after{
  transform:rotate(90deg);color:var(--hpc-text-soft)}
@media (prefers-reduced-motion:reduce){.atlas__row::after{transition:none}}
/* R1-8 (expert panel AP-2): --hpc-text-faint measured 3.37:1 on this real
   reader-facing text — an AA failure. --hpc-text-muted measures 5.85:1. */
.tsp-i--note{font-weight:400;color:var(--hpc-text-muted);font-size:13px}
.atlas__usage{margin:0;padding:8px 22px 0;font:500 13px/1 var(--hpc-font-mono);
  letter-spacing:.02em;color:var(--hpc-text-muted)}
.atlas__hub-link--top{margin-top:0;margin-bottom:12px;border-top:0;
  border-bottom:1px solid var(--hpc-line)}
.atlas__row-plate-label--here{color:var(--hpc-gold)}

/* ── R2-2 (expert panel IA-3): the back control names its destination ──────
   Same control, same target radio — but "‹ Index" only describes the Pillars
   tab's return. One span per tab, shown by the tab radio already checked. */
.atlas__idx-back-t{display:none}
#atlas-tab-pillars:checked~.atlas__tabs .atlas__idx-back-t--pillars{display:inline}
#atlas-tab-assess:checked~.atlas__tabs .atlas__idx-back-t--assess{display:inline}
#atlas-tab-protocols:checked~.atlas__tabs .atlas__idx-back-t--protocols{display:inline}

/* ── R2-4 (expert panel IA#4): cross-collection jump chips ─────────────────
   The pillar radio is shared state across tabs (verified live) — these turn
   that architecture into a one-click path to THIS pillar's assessments or
   protocols. Quiet mono chips, legend-row grammar, §10 targets. */
.atlas__jump{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.atlas__jump-chip{display:inline-flex;align-items:center;gap:7px;min-height:44px;
  padding:0 14px;border:1px solid var(--hpc-line-strong);cursor:pointer;
  font-family:var(--hpc-font-mono);font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--hpc-text-soft);
  -webkit-tap-highlight-color:transparent}
@media (hover:hover) and (pointer:fine){
  .atlas__jump-chip:hover{color:var(--hpc-text);border-color:var(--hpc-text-muted)}
}
.atlas__jump-chip:active{background:var(--hpc-line)}

/* ══ ROUND 3 (expert panel, 2026-08-05): motion & polish ══════════════════
   All motion below is transform/opacity only and fully disarmed under
   prefers-reduced-motion. The scrim now leads the panel by 60ms on purpose
   (the room darkens, then the panel arrives) — see the .24s/.3s durations
   at the entrance keyframes; the pair used to be an unexplained .3/.42. */

/* R3-3 (M#6): the legend rows are the shelf's actual scannable content and
   were the one list arriving in bulk. 120ms total stagger — well inside the
   220ms figure entrance it plays alongside; one coherent arrival. */
@media (prefers-reduced-motion:no-preference){
  /* sibling-chained delays, not :nth-child — the rows share a parent with
     the band/figure/blurb/feat, so child indices are structure-dependent */
  .atlas__legend-row{animation:legrow .18s var(--ease-out) both;animation-delay:.02s}
  @keyframes legrow{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
  .atlas__legend-row+.atlas__legend-row{animation-delay:.04s}
  .atlas__legend-row+.atlas__legend-row+.atlas__legend-row{animation-delay:.06s}
  .atlas__legend-row+.atlas__legend-row+.atlas__legend-row+.atlas__legend-row{animation-delay:.08s}
  .atlas__legend-row+.atlas__legend-row+.atlas__legend-row+.atlas__legend-row+.atlas__legend-row{animation-delay:.10s}
  .atlas__legend-row+.atlas__legend-row+.atlas__legend-row+.atlas__legend-row+.atlas__legend-row+.atlas__legend-row{animation-delay:.12s}
}

/* R3-5 (M#10): the band is the one licensed accent plane (Amendment 16) —
   the plane itself stays static; only the type knocked out of it gets a
   quick settle, so the plate reads freshly stamped, not pre-printed. */
@media (prefers-reduced-motion:no-preference){
  .atlas__band-num,.atlas__band-title,.atlas__band-count{
    animation:bandin .16s var(--ease-out) both}
  .atlas__band-title{animation-delay:.02s}
  .atlas__band-count{animation-delay:.04s}
  @keyframes bandin{from{opacity:0;transform:translateX(-3px)}to{opacity:1;transform:none}}
}

/* R3-2 (M#5): the outgoing collection now fades as the incoming one enters —
   transition-behavior:allow-discrete lets display wait for the 120ms fade.
   The R2-council "entrance beats compress" law holds: this touches only the
   collection swap; the incoming shelf's own entrance is unchanged, and the
   120ms exit sits well inside the interrupt-safety window the rapid-cycling
   stress test proved. */
@media (prefers-reduced-motion:no-preference){
  /* The ENTRANCE fade lives upstream (the :checked rule + @starting-style,
     .16s). This base rule is what an UNCHECKED collection falls back to the
     moment it loses :checked — allow-discrete holds its display for the
     same .16s so the outgoing collection fades instead of popping off. */
  .atlas__coll{transition-property:opacity,display;transition-duration:.16s;
    transition-timing-function:var(--ease-out);transition-behavior:allow-discrete;
    opacity:1}
}

/* R3-7 (M#7): guaranteed compositing for the two largest animated surfaces,
   scoped to the open state only. Safe HERE: the will-change footgun this
   codebase documents (hpc-header.css) is a fixed HEADER becoming the
   containing block for the scrim's inset:0 — nothing inside the panel needs
   to escape it. */
@media (prefers-reduced-motion:no-preference){
  .atlas[open] .atlas__panel,.atlas[open] .atlas__scrim{will-change:transform,opacity}
  @media (max-width:900px){
    .atlas__shelf{will-change:transform}
  }
}

/* R3-1 (M-5/M#3): the panel took 300ms to arrive and vanished in one frame.
   initAtlas() holds the close for 180ms under .atlas--closing (closes feel
   snappier than opens, per platform convention), then flips `open`. No-JS
   floor intact: without script the native instant close still works. */
@media (prefers-reduced-motion:no-preference){
  .atlas--closing .atlas__panel{animation:pnlout .18s var(--ease-out) both}
  .atlas--closing .atlas__scrim{animation:scrimout .18s var(--ease-out) both}
  @keyframes pnlout{to{opacity:0;transform:translateX(-50%) translateY(-8px)}}
  @keyframes scrimout{to{opacity:0}}
  @media (max-width:900px){
    @keyframes pnlout{to{opacity:0;transform:translateY(8px)}}
  }
}

/* R3-10 (IA-7/IA#10): the overflowing mobile tab strip now says it scrolls —
   the same right-edge fade vocabulary the row runner already uses. */
@media (max-width:900px){
  .atlas__tabs{mask-image:linear-gradient(90deg,rgba(0,0,0,1) calc(100% - 32px),rgba(0,0,0,0));
    -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,1) calc(100% - 32px),rgba(0,0,0,0))}
}

/* R3-10 (VC#10): the two-part trigger answers the pointer as one unit. */
@media (hover:hover) and (pointer:fine){
  .atlas>summary:hover{text-decoration:underline;text-underline-offset:4px}
}

/* R3-10 (MB#9): every tap gets something in the first frame — a settle,
   not a flash; the existing :active background stays. */
@media (prefers-reduced-motion:no-preference){
  .atlas__row,.atlas__jump-chip{transition:background-color .1s var(--ease-out),transform .08s var(--ease-out)}
  .atlas__tab{transition:color .2s var(--ease-out),background-color .1s var(--ease-out),transform .08s var(--ease-out)}
  .atlas__row:active,.atlas__tab:active,.atlas__jump-chip:active{transform:scale(.99)}
}

/* R3-9 (MB#10): home-indicator clearance on the two scrollable panes. */
@media (max-width:900px){
  .atlas__col,.atlas__shelf{padding-bottom:max(12px,env(safe-area-inset-bottom))}
}