/* ============================================================
   Sonsteng Practicum — theme.css
   "Radical Casebook" — the single shared tokens + primitives
   partial. Compose pages from these primitives; never invent
   per-page palettes, fonts, radii, or shadows.
   Contract: docs/research/design-direction.md §§2-8.

   TABLE OF CONTENTS
     1. Fonts import
     2. Tokens  — palette, spacing/shape, type scale
     3. Large-type mode (.type-lg)
     4. Reset + body washes + paper grain
     5. Base typography
     6. Focus rings (a11y)
     7. Primitive — .brass-rule + .running-head
     8. Primitive — .card / .doc-card
     9. Primitive — .chip (+ variants)
    10. Primitive — .meter
    11. Primitive — .stage-direction
    12. Primitive — .ethics-flag
    13. Primitive — .toc-rail
    14. Primitive — .kpi-tile
    15. Primitive — .ledger
    16. Primitive — .segmented-toggle
    17. Chrome — masthead / breadcrumb / footer
    18. Motion
    19. prefers-reduced-motion / prefers-contrast
    20. Print
   ============================================================ */

/* ---------- 1. Fonts import (same-origin, embedded) ---------- */
@import url("fonts.css");

/* ---------- 2. Tokens ---------- */
:root{
  /* Radical Casebook palette — warm stock, dark ink, quiet claret */
  --paper:#f3ead5; --paper-deep:#e1cfa9;
  --surface-card:#fffaf0; --surface-featured:#ede0c7; --surface-inset:#eadcbe;
  --ink:#281e18; --ink-soft:#5f5046; --ink-faint:#857467;
  --brass:#9a7131; --brass-lite:#c29a55;
  --claret:#78363e; --claret-strong:#642b33; --claret-deep:var(--claret-strong);
  --green:#30483a; --border-strong:#3a2920;
  --line:rgba(58,41,32,.25); --line-soft:rgba(58,41,32,.12);
  --shadow:0 24px 64px -34px rgba(40,25,18,.5);
  --shadow-offset:5px 5px 0 var(--paper-deep);
  /* compatibility aliases used by existing page primitives */
  --paper-2:var(--surface-card); --paper-3:var(--surface-inset); --paper-edge:#d2bd92;
  --brass-wash:rgba(154,113,49,.10); --claret-wash:rgba(120,54,62,.065); --green-wash:rgba(48,72,58,.09);
  /* palette — semantic */
  --tier-volunteered:var(--green); --tier-revealed:var(--brass); --tier-rapport:var(--claret);
  --tier-concealed:var(--ink-soft); --tier-unknown:var(--ink-faint); --flag-ethics:var(--claret);
  --meter-track:rgba(29,26,22,.10);
  --ok:var(--green); --warn:var(--brass); --stop:var(--claret-strong); --ink-invert:#fffaf0;
  /* Text-safe variants keep decorative accents from becoming small low-contrast copy. */
  --ink-faint-text:#6b5b50;
  --brass-text:#75531e;
  --brass-lite-text:#d3ae5c;  /* 4.90:1 on the green banner */

  /* spacing + shape */
  --space:1rem; --sp-2:.5rem; --sp-3:.75rem; --sp-6:1.5rem; --sp-8:2rem; --sp-12:3rem; --sp-16:4rem;
  --maxw:72rem; --maxw-read:44rem; --gutter:clamp(1.1rem,3vw,2.5rem);
  --radius:3px; --radius-card:5px;      /* print-crisp, never pill */
  --rule:1px; --rule-bold:2.5px;
  --ease:cubic-bezier(.2,.7,.2,1); --dur-fast:140ms; --dur:260ms; --dur-slow:520ms;

  /* type families (never Inter/Roboto/Arial/system-ui) */
  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Spectral', Georgia, serif;
  --font-mono:'Fragment Mono', ui-monospace, Menlo, Consolas, monospace;

  /* type scale (rem, fluid) */
  --fs-mono-xs:.74rem; --fs-xs:.88rem; --fs-sm:1rem; --fs-base:1.125rem;
  --fs-editorial-label:clamp(.92rem,.84rem + .28vw,1.06rem);
  --fs-md:1.3rem; --fs-lg:clamp(1.55rem,1.35rem + .75vw,1.9rem);
  --fs-xl:clamp(2rem,1.45rem + 2vw,3rem);
  --fs-2xl:clamp(2.8rem,1.7rem + 4vw,5rem);
  --fs-display:clamp(3.5rem,2rem + 6vw,6.5rem);

  /* paper grain — inline feTurbulence, data-URI (no requests) */
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
}

/* ---------- 3. Large-type mode (first-class; John & Roger) ---------- */
html.type-lg{
  --fs-mono-xs:.88rem; --fs-xs:1.04rem; --fs-sm:1.16rem; --fs-base:1.32rem;
  --fs-editorial-label:clamp(1.08rem,1rem + .3vw,1.22rem);
  --fs-md:1.55rem; --fs-lg:clamp(1.9rem,1.65rem + .9vw,2.25rem);
  --fs-xl:clamp(2.35rem,1.7rem + 2.35vw,3.5rem);
  --fs-2xl:clamp(3.3rem,2rem + 4.7vw,5.8rem);
  --fs-display:clamp(4.1rem,2.3rem + 6.5vw,7.2rem);
}

/* ---------- 4. Reset + body washes + paper grain ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;max-width:100%;overflow-x:clip}
body{
  margin:0;
  min-height:100vh;
  color:var(--ink);
  font-family:var(--font-body);
  font-size:var(--fs-base);
  line-height:1.65;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
  max-width:100%;overflow-x:clip;
  /* two fixed radial washes: brass top-right, claret top-left */
  background:
    radial-gradient(58rem 40rem at 108% -8%, var(--brass-wash), transparent 60%),
    radial-gradient(48rem 36rem at -8% -6%, var(--claret-wash), transparent 55%),
    var(--paper);
  background-attachment:fixed;
}
body::before{                    /* letterpress paper grain */
  content:"";
  position:fixed;inset:0;
  z-index:-1;pointer-events:none;
  background:var(--grain);
  background-size:140px 140px;
  opacity:.03;
  mix-blend-mode:multiply;
}
img,svg{max-width:100%;height:auto;vertical-align:middle}

/* ---------- 5. Base typography ---------- */
h1,h2,h3,h4{
  font-family:var(--font-display);
  line-height:1.12;
  font-weight:600;
  margin:0 0 var(--sp-3);
  text-wrap:balance;
}
h1{font-size:var(--fs-2xl);font-weight:900;letter-spacing:-.035em;line-height:.96}
h2{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.025em;line-height:1}
h3{font-size:var(--fs-lg);font-weight:700;line-height:1.05}
h4{font-size:var(--fs-md)}
p{margin:0 0 var(--space)}
.wrap,main,section,article,div,header,footer,nav{min-width:0}
.wrap,main,.card,.doc-card,.viz-card,.fact-row,.prose{overflow-wrap:anywhere}
pre{max-width:100%;overflow-x:auto;white-space:pre-wrap;overflow-wrap:anywhere}
.prose{max-width:var(--maxw-read)}
.prose p,.measure{max-width:68ch}         /* prose measure ≤68ch */
strong,b{font-weight:600}
em,i,.stage,cite{font-style:italic}
small{font-size:var(--fs-sm)}

/* machine voice only — codes, IRIs, counts, money, timestamps, tags */
.mono,code,kbd,samp{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
}
.label{                          /* uppercase mono micro-label */
  font-family:var(--font-mono);
  font-size:var(--fs-mono-xs);
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--ink-soft);
}
.editorial-label{
  margin:0 0 var(--sp-3);
  color:var(--claret-strong);
  font-family:var(--font-mono);
  font-size:var(--fs-editorial-label);
  font-weight:700;
  line-height:1.35;
  letter-spacing:.075em;
  text-transform:uppercase;
}
.num{font-variant-numeric:tabular-nums}

/* links — brass, underline wipes left→right on hover/focus */
a{color:var(--claret);text-decoration:none}
a.link,.link{
  color:var(--ink);
  background-image:linear-gradient(var(--brass),var(--brass));
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:0% var(--rule-bold);
  transition:background-size var(--dur) var(--ease);
  padding-bottom:1px;
}
a.link:hover,.link:hover,a.link:focus-visible,.link:focus-visible{
  background-size:100% var(--rule-bold);
}

/* ---------- 6. Focus rings (every interactive element) ---------- */
a,button,input,textarea,select,summary,[tabindex]{outline:none}
a:focus-visible,button:focus-visible,input:focus-visible,
textarea:focus-visible,select:focus-visible,summary:focus-visible,
[tabindex]:focus-visible,.segmented-toggle button:focus-visible{
  outline:var(--rule-bold) solid var(--claret);
  outline-offset:2px;
  border-radius:var(--radius);
}

/* ---------- 7. Primitive — .brass-rule + .running-head ---------- */
.brass-rule{                     /* 1px brass divider + 2px claret left tick */
  position:relative;
  height:var(--rule);
  background:var(--brass);
  border:0;margin:var(--sp-6) 0;
  transform-origin:left center;
  transition:transform var(--dur-slow) var(--ease);
}
.brass-rule::before{
  content:"";
  position:absolute;left:0;top:50%;
  width:var(--rule-bold);height:12px;
  transform:translateY(-50%);
  background:var(--claret);
}
.brass-rule--bold{height:var(--rule-bold)}

/* running head — mono small-caps sitting IN the rule (printed-brief header) */
.running-head{
  display:flex;align-items:center;gap:var(--sp-3);
  font-family:var(--font-mono);
  font-size:var(--fs-mono-xs);
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--ink-soft);
  font-variant-numeric:tabular-nums;
  padding:0 0 var(--sp-2);
  border-bottom:var(--rule) solid var(--brass);
  position:relative;
}
.running-head::before{
  content:"";position:absolute;left:0;bottom:-1px;
  width:var(--rule-bold);height:12px;background:var(--claret);
}
.running-head .rh-spacer{flex:1}
.running-head .rh-right{color:var(--ink-faint-text)}

/* ---------- 8. Primitive — .card / .doc-card ---------- */
.card{
  background:var(--surface-card);
  border:var(--rule-bold) solid var(--border-strong);
  border-radius:var(--radius-card);
  padding:var(--sp-6);
  box-shadow:var(--shadow-offset);
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.card:hover{                     /* lift 2px */
  transform:translateY(-2px);
  box-shadow:7px 7px 0 var(--paper-deep),var(--shadow);
}
.card > :last-child{margin-bottom:0}
.card--featured{
  background:var(--surface-featured);
  border-color:var(--claret);
  box-shadow:var(--shadow-offset);
}

/* inset case-file document card */
.doc-card{
  background:var(--paper-3);
  border:var(--rule) solid var(--line);
  border-left:var(--rule-bold) solid var(--brass);
  border-radius:var(--radius);
  padding:var(--sp-6);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);         /* data-well inset */
}
.doc-card > :last-child{margin-bottom:0}
.doc-card .doc-card__meta{
  font-family:var(--font-mono);
  font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;
  color:var(--ink-faint-text);margin-bottom:var(--sp-2);
}

/* ---------- 9. Primitive — .chip (+ variants) ---------- */
.chip{
  display:inline-flex;align-items:center;gap:.4em;
  font-family:var(--font-mono);
  font-size:var(--fs-mono-xs);
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-variant-numeric:tabular-nums;
  color:var(--ink);
  background:var(--paper);
  /* 24px floor so a chip is a real target (WCAG 2.5.8) — they are links into the
     skills browser, not decoration. */
  min-height:24px;
  border:var(--rule) solid var(--line);
  border-left:var(--rule-bold) solid var(--ink-faint);
  border-radius:var(--radius);              /* never pill */
  padding:.34em .6em;
  white-space:nowrap;
}
.chip::before{content:attr(data-dot);}       /* optional glyph/label prefix */
.chip--folio{border-left-color:var(--ink-faint-text);color:var(--ink-soft);background:var(--paper-3)}
.chip--tier-volunteered{border-left-color:var(--tier-volunteered);color:var(--green)}
.chip--tier-revealed{border-left-color:var(--tier-revealed);color:var(--ink)}   /* brass = decorative border; text stays ink */
.chip--tier-rapport{border-left-color:var(--tier-rapport);color:var(--claret)}
.chip--tier-concealed{border-left-color:var(--tier-concealed);color:var(--ink-soft)}
.chip--tier-unknown{border-left-color:var(--tier-unknown);color:var(--ink-faint-text)}
.chip--state{border-left-color:var(--green);color:var(--green);background:var(--green-wash)}
.chip--meridian{border-left-color:var(--brass-text);color:var(--ink);background:var(--brass-wash)}
.chip--meridian::before{content:"⌘";color:var(--brass-text);margin-right:.15em}
.chip--coming-soon{border-left-color:var(--ink-faint-text);color:var(--ink-soft);background:var(--paper-3);font-style:normal}
/* No opacity here: it was .85, which diluted the label to 3.49:1 on paper-3.
   'Muted' is expressed with the colour, not by fading legible text out. */

/* ---------- 10. Primitive — .meter (disclosure / rubric) ---------- */
.meter{
  display:block;
  width:100%;height:8px;
  background:var(--meter-track);
  border-radius:var(--radius);
  overflow:hidden;
}
.meter__fill{
  display:block;height:100%;
  width:var(--meter-value,0%);
  background:var(--brass);
  border-radius:var(--radius);
  transition:width var(--dur-slow) var(--ease);   /* animate on first view */
}
.meter--ok .meter__fill{background:var(--ok)}
.meter--warn .meter__fill{background:var(--warn)}
.meter--stop .meter__fill{background:var(--stop)}
.meter__label{
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;
  font-variant-numeric:tabular-nums;color:var(--ink-soft);
}

/* ---------- 11. Primitive — .stage-direction (in-fiction) ---------- */
.stage-direction{
  font-family:var(--font-body);
  font-style:italic;
  color:var(--ink-soft);
  background:var(--paper-3);
  border-left:var(--rule-bold) solid var(--claret);
  border-radius:0 var(--radius) var(--radius) 0;
  padding:var(--sp-3) var(--sp-6);
  margin:var(--sp-6) 0;
  max-width:var(--maxw-read);
}

/* ---------- 12. Primitive — .ethics-flag (Rule 4.2 etc.) ---------- */
.ethics-flag{                    /* role="status" in markup */
  border:var(--rule-bold) solid var(--claret);
  border-radius:var(--radius);
  background:var(--claret-wash);
  padding:var(--sp-6);
  margin:var(--sp-6) 0;
  max-width:var(--maxw-read);
}
.ethics-flag__head{
  font-family:var(--font-mono);
  font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;
  color:var(--claret);font-weight:400;
  margin:0 0 var(--sp-2);
}
.ethics-flag__note{margin:0;color:var(--ink)}
.ethics-flag__tag{
  display:inline-block;margin-top:var(--sp-3);
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;color:var(--claret-deep);
}

/* ---------- 13. Primitive — .toc-rail (scroll-spied) ---------- */
.toc-rail{
  position:sticky;top:var(--sp-8);
  align-self:start;
  font-family:var(--font-mono);
  font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;
  border-left:var(--rule) solid var(--line);
  padding-left:var(--sp-3);
  display:flex;flex-direction:column;gap:var(--sp-2);
}
.toc-rail a{
  color:var(--ink-faint-text);
  /* Project target: generous navigation for readers using touch or Large Type. */
  display:flex;
  align-items:center;
  min-height:44px;
  padding:.3em 0 .3em var(--sp-2);
  margin-left:calc(-1 * var(--sp-3) - var(--rule));
  border-left:var(--rule-bold) solid transparent;
  font-variant-numeric:tabular-nums;
}
.toc-rail a:hover{color:var(--ink-soft)}
.toc-rail a[aria-current="true"],
.toc-rail a[aria-current="page"]{
  color:var(--claret);
  border-left-color:var(--claret);
}

/* ---------- 14. Primitive — .kpi-tile (practice ledger) ---------- */
.kpi-tile{
  background:var(--paper-2);
  border:var(--rule) solid var(--line);
  border-top:var(--rule-bold) solid var(--brass);
  border-radius:var(--radius-card);
  padding:var(--sp-6);
}
.kpi-tile__label{
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint-text);
  margin:0 0 var(--sp-2);
}
.kpi-tile__value{
  font-family:var(--font-display);
  font-size:var(--fs-2xl);font-weight:900;line-height:1;
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;
  color:var(--ink);margin:0;
}
.kpi-tile__delta{
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  font-variant-numeric:tabular-nums;letter-spacing:.04em;
  margin-top:var(--sp-2);color:var(--ink-soft);
}
.kpi-tile__delta.is-up{color:var(--green)}
.kpi-tile__delta.is-down{color:var(--claret)}
.kpi-row{
  display:grid;gap:var(--sp-6);
  grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));
}

/* ---------- 15. Primitive — .ledger (mono, right-aligned) ---------- */
.ledger{
  width:100%;
  border-collapse:collapse;
  font-family:var(--font-body);
  font-size:var(--fs-sm);
}
.ledger caption{
  text-align:left;
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint-text);
  padding-bottom:var(--sp-2);
}
.ledger th,.ledger td{
  padding:var(--sp-2) var(--sp-3);
  border-bottom:var(--rule) solid var(--line-soft);
}
.ledger thead th{
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;
  color:var(--ink-soft);text-align:left;font-weight:400;
  border-bottom:var(--rule) solid var(--brass);
}
.ledger .num,
.ledger td.num,.ledger th.num{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  text-align:right;
}
.ledger tbody tr:hover,.ledger tbody tr:hover{background:var(--brass-wash)}
.ledger tfoot td{
  border-top:var(--rule-bold) solid var(--brass);
  border-bottom:0;font-weight:600;
}

/* ---------- 16. Primitive — .segmented-toggle (Meridian ⇄ real) ---------- */
.segmented-toggle{
  display:inline-flex;
  border:var(--rule) solid var(--line);
  border-radius:var(--radius);
  background:var(--paper-3);
  padding:2px;gap:2px;
}
.segmented-toggle button{
  appearance:none;cursor:pointer;
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;
  color:var(--ink-soft);
  background:transparent;border:0;
  border-radius:var(--radius);
  padding:.5em .9em;min-height:44px;
  transition:background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.segmented-toggle button[aria-pressed="true"],
.segmented-toggle button[aria-selected="true"]{
  color:var(--ink);
  background:var(--paper);
  box-shadow:inset 0 0 0 var(--rule) var(--brass);
}
.segmented-toggle[data-side="real"] button[aria-pressed="true"]{
  box-shadow:inset 0 0 0 var(--rule) var(--green);color:var(--green);
}

/* ---------- 17. Chrome — masthead / breadcrumb / footer ---------- */
.masthead{
  position:sticky;top:0;z-index:20;
  border-top:var(--rule-bold) solid var(--brass);
  border-bottom:var(--rule) solid var(--line);
  background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:none;
}
.masthead__inner{
  max-width:var(--maxw);margin:0 auto;
  padding:var(--sp-3) var(--gutter);
  display:flex;align-items:center;gap:var(--sp-6);flex-wrap:wrap;
}
.masthead__brand{
  font-family:var(--font-display);
  font-weight:900;letter-spacing:-.01em;
  font-size:var(--fs-md);color:var(--ink);
  /* The home link on every page: 44px tall (WCAG 2.5.5). */
  display:inline-flex;align-items:center;min-height:44px;
}
.masthead__docket{
  margin-left:auto;
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;
  color:var(--ink-faint-text);font-variant-numeric:tabular-nums;
}
.breadcrumb{
  max-width:var(--maxw);margin:0 auto;
  padding:var(--sp-3) var(--gutter);
  font-family:var(--font-mono);font-size:var(--fs-mono-xs);
  text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint-text);
  overflow-wrap:anywhere;
}
.breadcrumb a{color:var(--brass-text)}
.breadcrumb .sep{color:var(--line);margin:0 .5em}

.site-footer{                    /* forest-green cloth binding */
  margin-top:var(--sp-16);
  background:var(--green);
  color:var(--ink-invert);
  border-top:var(--rule-bold) solid var(--brass);
}
.site-footer__inner{
  max-width:var(--maxw);margin:0 auto;
  padding:var(--sp-8) var(--gutter);
  display:flex;flex-wrap:wrap;gap:var(--sp-6);
  align-items:center;justify-content:space-between;
  font-size:var(--fs-sm);
}
.site-footer a{color:var(--ink-invert);text-decoration:underline;text-underline-offset:3px}
.site-footer .mono{color:var(--brass-lite-text)}

/* layout helper */
.wrap{max-width:var(--maxw);margin:0 auto;padding:var(--sp-8) var(--gutter)}

@media (max-width:42rem){
  .masthead__inner{gap:var(--sp-2) var(--sp-3)}
  .masthead__brand{flex:1 1 auto;overflow-wrap:anywhere}
  .masthead__docket{order:3;flex:1 0 100%;margin-left:0}
}

/* ---------- 18. Motion ---------- */
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes msg-rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.reveal{animation:rise var(--dur-slow) var(--ease) both}
.stagger > *{animation:rise var(--dur) var(--ease) both}
.stagger > *:nth-child(1){animation-delay:0ms}
.stagger > *:nth-child(2){animation-delay:60ms}
.stagger > *:nth-child(3){animation-delay:120ms}
.stagger > *:nth-child(4){animation-delay:180ms}
.stagger > *:nth-child(5){animation-delay:240ms}
.stagger > *:nth-child(6){animation-delay:300ms}
.stagger > *:nth-child(7){animation-delay:360ms}
.stagger > *:nth-child(8){animation-delay:420ms}
.stagger > *:nth-child(n+9){animation-delay:480ms}

/* brass rules draw in (scaleX 0→1); add .is-in when in view */
.brass-rule.draw{transform:scaleX(0)}
.brass-rule.draw.is-in{transform:scaleX(1)}

/* client (in-fiction) messages fade + rise */
.msg-client{animation:msg-rise var(--dur) var(--ease) both}

/* claret ruled-tick "considering" indicator (not bouncing dots) */
.considering{
  display:inline-block;width:var(--rule-bold);height:1em;
  background:var(--claret);vertical-align:-.15em;
  animation:consider 1s steps(2,jump-none) infinite;
}
@keyframes consider{0%,100%{opacity:.25}50%{opacity:1}}

/* ---------- 19. prefers-reduced-motion / prefers-contrast ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .card:hover{transform:none}         /* disable all transforms */
  .brass-rule,.brass-rule.draw{transform:none}
  .brass-rule.draw{transform:scaleX(1)}
  .reveal,.stagger > *,.msg-client{animation:none;opacity:1;transform:none}
  .considering{animation:none;opacity:.6}
}
@media (prefers-contrast: more){
  :root{                              /* darken brass→ink/claret for text */
    --brass:#6b5216; --brass-lite:#7c1e2b; --ink-faint:#544d43;
    --line:rgba(29,26,22,.32); --line-soft:rgba(29,26,22,.2);
  }
}

/* ---------- 20. Print (galley/packet output) ---------- */
@media print{
  :root{--shadow:none}
  html,body{
    background:#fff !important;color:#000;
  }
  body::before{display:none}          /* strip grain + washes */
  .masthead,.breadcrumb,.site-footer,.toc-rail,.segmented-toggle,
  .no-print{display:none !important}
  a{color:#000;text-decoration:underline}
  a[href^="http"]::after{content:" <" attr(href) ">";font-family:var(--font-mono);font-size:.85em}
  .card,.doc-card,.kpi-tile,.ethics-flag,.stage-direction{
    background:#fff !important;box-shadow:none !important;
    border-color:#000;break-inside:avoid;
  }
  .brass-rule{background:#000;transform:none}
  .part{break-before:page}            /* page-break per packet part */
  .instructor-notes{display:none !important}   /* never in print */
}