/*
 * UltronFast — interactive instrument layer (S22 live-walk follow-up).
 *
 * Styles for the 13 runtime-mounted components (the S12–S15 ports) and the
 * S22 SSR editorial sections. The M5.A design system (uf-guide.css) styles
 * prose, SSR widget cards, and the M5.C estimator markup — the runtime
 * components' ~80 class names had no CSS behind them and rendered as bare
 * HTML on a live theme (operator-reported; confirmed on the staging WP).
 *
 * Rules:
 *  - Everything is scoped under `.uf-interactive` (the runtime mount root,
 *    which also carries `.uf-widget`, so the design tokens are in scope) or
 *    under a `.uf-widget--<type>` SSR scope. Nothing here can restyle a host
 *    theme — same covenant as uf-guide.css.
 *  - Consumes the SAME `--uf-*` tokens (light + dark flip automatically).
 *  - The PAPER ARTIFACTS are print-pinned by design (the checklist's
 *    "receipt stays cream with print-pinned colors"): the receipt, the
 *    persona mini-receipts, and the manila case-file folder keep literal
 *    light-palette colors in BOTH color schemes. The dusk/dawn instruments
 *    (seed/stranger/echo/unfinished-sentence) are likewise scheme-pinned:
 *    their self-contained palette holds the mood in light + dark.
 *  - Every OTHER color must be a var(--uf-*) token. Deliberate literals live
 *    only inside `uf-scheme-pinned: start/end` comment fences — a hex or
 *    rgb() outside a fence fails the build
 *    (tests/test_interactive_css_scheme_pinned.py).
 */

/* ------------------------------------------------------------ shared bits */
.uf-interactive button {
  appearance: none;
  font-family: var(--uf-sans);
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.uf-interactive .uf-trybtn {
  border: 0;
  background: var(--uf-green);
  color: var(--uf-paper);
  font: 600 14px/1 var(--uf-sans);
  padding: 12px 18px;
  border-radius: 10px;
  box-shadow: var(--uf-shadow);
}
.uf-interactive .uf-trybtn:hover { background: var(--uf-green-2); transform: translateY(-1px); }
.uf-interactive img.emoji { width: 1em; height: 1em; vertical-align: -0.1em; }

/* chip / pill buttons (ecosystem chips, persona tabs, event + denial pickers) */
.uf-interactive .uf-chip,
.uf-interactive .uf-pt,
.uf-interactive .uf-ev,
.uf-interactive .uf-reason,
.uf-interactive .uf-psz,
.uf-interactive .uf-lg {
  border: 1px solid var(--uf-line-2);
  background: var(--uf-card);
  color: var(--uf-ink-2);
  font: 600 13px/1 var(--uf-sans);
  padding: 9px 14px;
  border-radius: 100px;
}
.uf-interactive .uf-chip:hover, .uf-interactive .uf-pt:hover, .uf-interactive .uf-ev:hover,
.uf-interactive .uf-reason:hover, .uf-interactive .uf-psz:hover, .uf-interactive .uf-lg:hover {
  border-color: var(--uf-green);
  color: var(--uf-ink);
}
.uf-interactive .uf-chip.on, .uf-interactive .uf-pt.on, .uf-interactive .uf-psz.on,
.uf-interactive .uf-lg.on {
  background: var(--uf-green);
  border-color: var(--uf-green);
  color: var(--uf-paper);
}
.uf-interactive .uf-ev { font-family: var(--uf-mono); font-size: 11.5px; letter-spacing: .04em; }
.uf-interactive .uf-ev.on { background: var(--uf-ochre); border-color: var(--uf-ochre); color: var(--uf-paper); }
.uf-interactive .uf-reason.on { background: var(--uf-ink); border-color: var(--uf-ink); color: var(--uf-card); }

/* selectable answer cards (classifier, buy-checker, deposit options) */
.uf-interactive .uf-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.uf-interactive .uf-item,
.uf-interactive .uf-dopt {
  border: 1px solid var(--uf-line);
  background: var(--uf-card);
  color: var(--uf-ink-2);
  font: 600 14px/1.35 var(--uf-sans);
  padding: 13px 14px;
  border-radius: 12px;
  text-align: left;
}
.uf-interactive .uf-item:hover, .uf-interactive .uf-dopt:hover { border-color: var(--uf-green); color: var(--uf-ink); }
.uf-interactive .uf-item.on { background: var(--uf-green-soft); border-color: var(--uf-green-2); color: var(--uf-ink); }

/* ------------------------------------------------------- calculator (S13) */
/* The runtime calculator is a single-flow instrument; override the M5.C
   two-column estimator grid that shares the .uf-calc root class. */
.uf-interactive .uf-calc {
  display: block;
  border: 0;
  box-shadow: none;
  background: transparent;
  overflow: visible;
}
.uf-interactive .uf-calc__title {
  font: 600 21px/1.25 var(--uf-serif);
  margin: 0 0 16px;
  color: var(--uf-ink);
}
.uf-interactive .uf-calc__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
  background: var(--uf-paper-2);
  border: 1px solid var(--uf-line);
  border-radius: 14px;
  padding: 18px;
}
@media (max-width: 560px) { .uf-interactive .uf-calc__grid { grid-template-columns: 1fr; } }
.uf-interactive .uf-f { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.uf-interactive .uf-f > span {
  font: 600 11px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--uf-ink-3);
}
.uf-interactive .uf-calc input,
.uf-interactive .uf-calc input[type=number],
.uf-interactive .uf-calc select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--uf-line-2);
  border-radius: 10px;
  font: 500 15px var(--uf-mono);
  background: var(--uf-card);
  color: var(--uf-ink);
}
.uf-interactive .uf-calc input:focus, .uf-interactive .uf-calc select:focus {
  outline: none;
  border-color: var(--uf-green);
  box-shadow: 0 0 0 3px var(--uf-green-soft);
}
.uf-interactive .uf-f--chk {
  flex-direction: row;
  align-items: center;
  gap: 9px;
  align-self: end;
  padding: 10px 2px;
}
.uf-interactive .uf-f--chk > span {
  text-transform: none;
  letter-spacing: 0;
  font: 600 13.5px var(--uf-sans);
  color: var(--uf-ink-2);
}
.uf-interactive .uf-f--chk input { width: auto; accent-color: var(--uf-green); }
.uf-interactive .uf-suabtn {
  align-self: end;
  border: 1px solid var(--uf-ochre);
  background: var(--uf-ochre-soft);
  color: var(--uf-ochre);
  font: 600 12.5px/1 var(--uf-sans);
  padding: 10px 13px;
  border-radius: 10px;
}
.uf-interactive .uf-suabtn:hover { background: var(--uf-ochre); color: var(--uf-paper); }
.uf-interactive .uf-langs {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 14px 0;
}
.uf-interactive .uf-lg { padding: 8px 13px; font-family: var(--uf-mono); font-size: 12px; }
.uf-interactive .uf-preset {
  margin-left: auto;
  border: 1px solid var(--uf-green);
  background: transparent;
  color: var(--uf-green);
  font: 600 13.5px/1 var(--uf-sans);
  padding: 10px 16px;
  border-radius: 100px;
}
.uf-interactive .uf-preset:hover { background: var(--uf-green); color: var(--uf-paper); }

/* uf-scheme-pinned: start — PAPER ARTIFACT: the receipt (and its badge/gates
   strip) prints cream with print-pinned inks in BOTH color schemes. */
/* The receipt — a PAPER ARTIFACT: cream in both schemes, print-pinned ink. */
.uf-interactive .uf-receipt {
  background: #FFFEF8;
  color: #1C1812;
  font-family: var(--uf-mono);
  padding: 22px 24px 26px;
  margin: 18px auto 6px;
  max-width: 480px;
  box-shadow: var(--uf-shadow-lg);
  position: relative;
}
.uf-interactive .uf-receipt::before,
.uf-interactive .uf-receipt::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 9px;
}
.uf-interactive .uf-receipt::before {
  top: -9px;
  background: conic-gradient(from 135deg at 50% 0%, #FFFEF8 90deg, transparent 0) 0 0 / 14px 9px repeat-x;
}
.uf-interactive .uf-receipt::after {
  bottom: -9px;
  background: conic-gradient(from -45deg at 50% 100%, #FFFEF8 90deg, transparent 0) 0 0 / 14px 9px repeat-x;
}
.uf-interactive .uf-receipt__head {
  font: 600 13px/1.3 var(--uf-mono);
  letter-spacing: .08em;
}
.uf-interactive .uf-receipt__sub {
  font-size: 11px;
  letter-spacing: .06em;
  color: #7A6E5E;
  margin: 3px 0 10px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #D2C4AC;
}
.uf-interactive .uf-receipt .uf-badge {
  display: inline-block;
  font: 600 10.5px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 5px 10px;
  border-radius: 100px;
  border: 0;
  margin: 0 0 12px;
  background: #F4EDE0;
  color: #4A4136;
}
.uf-interactive .uf-receipt .uf-badge--ok { background: #E4EFE7; color: #1F5C3D; }
.uf-interactive .uf-receipt .uf-badge--no { background: #F6E2DB; color: #A6442E; }
.uf-interactive .uf-receipt .uf-badge--zero { background: #FBEFD6; color: #8a5d18; }
.uf-interactive .uf-rrow {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  font-size: 13.5px;
  padding: 5px 0;
  border-bottom: 1px dotted #E3D8C5;
}
.uf-interactive .uf-rrow span:last-child { white-space: nowrap; }
.uf-interactive .uf-rrow.net {
  border-bottom: 0;
  border-top: 1.5px solid #1C1812;
  margin-top: 4px;
  padding-top: 9px;
  font-weight: 600;
}
.uf-interactive .uf-receipt__total {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 3px double #1C1812;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.uf-interactive .uf-receipt__lab {
  font: 600 11px/1.3 var(--uf-mono);
  letter-spacing: .08em;
  max-width: 12ch;
}
.uf-interactive .uf-receipt__big {
  font: 600 44px/1 var(--uf-serif);
  color: #1F5C3D;
}
.uf-interactive .uf-receipt__big small,
.uf-interactive .uf-receipt__big .mo { font-size: 15px; color: #7A6E5E; }
.uf-interactive .uf-gates { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.uf-interactive .uf-gates span {
  font: 600 10.5px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 5px 10px;
  border-radius: 100px;
  background: #F4EDE0;
  color: #4A4136;
}
.uf-interactive .uf-gates span.pass { background: #E4EFE7; color: #1F5C3D; }
.uf-interactive .uf-gates span.fail { background: #F6E2DB; color: #A6442E; }
/* Save/share the estimate (audit 2026-07-10): an outline button on the fixed
   light receipt paper — literal colors are correct here (pinned artifact). */
.uf-interactive .uf-receipt__share {
  margin-top: 14px; width: 100%; padding: 9px 14px; border: 1px solid #1F5C3D;
  border-radius: 10px; background: transparent; color: #1F5C3D;
  font: 600 13px var(--uf-sans); cursor: pointer;
}
.uf-interactive .uf-receipt__share:hover { background: #1F5C3D; color: #FFFEF8; }
.uf-interactive .uf-receipt__share:focus-visible { outline: 2px solid #1F5C3D; outline-offset: 2px; }
/* uf-scheme-pinned: end */

/* ---------------------------------------------------------- prize board */
.uf-interactive .uf-prize__sizes { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.uf-interactive .uf-psz { min-width: 42px; padding: 11px 0; font-family: var(--uf-mono); }
.uf-interactive .uf-prize__big { display: flex; align-items: baseline; gap: 12px; margin: 6px 0 14px; }
.uf-interactive .uf-prize__big .n {
  font: 600 clamp(44px, 7vw, 64px)/1 var(--uf-serif);
  color: var(--uf-green);
}
.uf-interactive .uf-prize__big .l { font-size: 15px; color: var(--uf-ink-3); max-width: 22ch; line-height: 1.3; }
.uf-interactive .uf-prize__unlocks { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.uf-interactive .uf-pu {
  font-size: 12.5px;
  color: var(--uf-ink-2);
  background: var(--uf-ochre-soft);
  border: 1px solid var(--uf-line-2);
  padding: 6px 12px;
  border-radius: 100px;
}
.uf-interactive .uf-pu b { color: var(--uf-ink); }

/* ------------------------------------------------------------ score card */
.uf-interactive .uf-score__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 12px;
  font: 600 15px var(--uf-sans);
  color: var(--uf-ink-2);
}
.uf-interactive .uf-score__head .flag {
  font: 600 11px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--uf-ochre);
}
.uf-interactive .uf-stiles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
@media (max-width: 640px) { .uf-interactive .uf-stiles { grid-template-columns: repeat(2, 1fr); } }
.uf-interactive .uf-stile {
  background: var(--uf-paper-2);
  border: 1px solid var(--uf-line);
  border-radius: 12px;
  padding: 14px 15px;
}
.uf-interactive .uf-stile .v { font: 600 25px/1.1 var(--uf-mono); color: var(--uf-ink); }
.uf-interactive .uf-stile .v.up { color: var(--uf-green); }
.uf-interactive .uf-stile .l {
  font: 600 10.5px/1.3 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--uf-ink-3);
  margin-top: 7px;
}
.uf-interactive .uf-confbar { margin-top: 16px; }
.uf-interactive .uf-confbar .ct {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  color: var(--uf-ink-2);
  margin-bottom: 6px;
}
.uf-interactive .uf-confbar .track {
  height: 8px;
  border-radius: 100px;
  background: var(--uf-line);
  overflow: hidden;
}
.uf-interactive .uf-confbar .fill { height: 100%; background: var(--uf-green-2); border-radius: 100px; }
.uf-interactive .uf-confbar .why {
  font: italic 12.5px/1.5 var(--uf-serif);
  color: var(--uf-ink-3);
  margin-top: 8px;
}

/* ------------------------------------------------------------ loss ledger */
.uf-widget--loss-ledger { border-left: 3px solid var(--uf-clay); }
.uf-interactive .uf-shock__head { margin-bottom: 12px; }
.uf-interactive .uf-shock__head .skt {
  font: 600 11px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--uf-clay);
}
.uf-interactive .uf-shock__head .skn {
  font: 600 clamp(34px, 5vw, 46px)/1.05 var(--uf-serif);
  color: var(--uf-clay);
  margin: 6px 0 4px;
}
.uf-interactive .uf-shock__head .skn .yr { font: 500 15px var(--uf-sans); color: var(--uf-ink-3); }
.uf-interactive .uf-shock__head .sks { font-size: 13.5px; color: var(--uf-ink-2); }
.uf-interactive .uf-skrow {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  font: 500 14px var(--uf-mono);
  padding: 7px 0;
  border-bottom: 1px solid var(--uf-line);
}
.uf-interactive .uf-skrow .skl { color: var(--uf-ink-2); font-family: var(--uf-sans); }
.uf-interactive .uf-skrow .skv { color: var(--uf-clay); font-weight: 600; white-space: nowrap; }
.uf-interactive .uf-skctx { font-size: 12.5px; color: var(--uf-ink-3); margin-top: 12px; }
.uf-interactive .uf-skctx a { color: var(--uf-green); }

/* -------------------------------------------------------------- ecosystem */
.uf-interactive .uf-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.uf-interactive .uf-eco__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1.5px solid var(--uf-ink);
}
.uf-interactive .uf-eco__head .et { font: 600 18px var(--uf-serif); }
.uf-interactive .uf-eco__head .ev { text-align: right; }
.uf-interactive .uf-eco__head .ev .n { font: 600 22px var(--uf-mono); color: var(--uf-green); }
.uf-interactive .uf-eco__head .ev .l { display: block; font-size: 11px; color: var(--uf-ink-3); }
.uf-interactive .uf-tierlab {
  font: 600 11px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .07em;
  margin: 16px 0 6px;
}
.uf-interactive .uf-tierlab.very { color: var(--uf-green); }
.uf-interactive .uf-tierlab.chk { color: var(--uf-ochre); }
.uf-interactive .uf-erow {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  padding: 8px 0;
  border-bottom: 1px solid var(--uf-line);
  font-size: 14.5px;
}
.uf-interactive .uf-erow .en { color: var(--uf-ink); font-weight: 600; }
.uf-interactive .uf-erow .en .ew {
  display: block;
  font-weight: 400;
  font-size: 12.5px;
  color: var(--uf-ink-3);
}
.uf-interactive .uf-erow .ea { font: 600 14px var(--uf-mono); color: var(--uf-green); white-space: nowrap; }
.uf-interactive .uf-erow.chk .ea { color: var(--uf-ochre); }
.uf-interactive .uf-eco__foot {
  font: italic 12.5px/1.5 var(--uf-serif);
  color: var(--uf-ink-3);
  margin-top: 12px;
}

/* -------------------------------------- case file: the manila folder ---- */
/* uf-scheme-pinned: start — PAPER ARTIFACT: the manila case-file folder keeps
   its literal manila/ink palette in BOTH color schemes (print-pinned). */
.uf-interactive .uf-file { margin: 34px 0 16px; }
.uf-interactive .uf-folder {
  background: #F0E2C4;
  color: #1C1812;
  border: 1px solid #D9C69A;
  border-radius: 0 14px 14px 14px;
  padding: 20px 22px;
  position: relative;
  box-shadow: var(--uf-shadow-lg);
}
.uf-interactive .uf-folder__tab {
  position: absolute;
  top: -28px;
  left: -1px;
  background: #E4D2A8;
  border: 1px solid #D9C69A;
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
  padding: 7px 16px;
  font: 600 11px/1 var(--uf-mono);
  letter-spacing: .08em;
  color: #6B5A33;
}
.uf-interactive .uf-stamp {
  position: absolute;
  top: 14px;
  right: 16px;
  transform: rotate(7deg);
  font: 700 11px/1 var(--uf-mono);
  letter-spacing: .1em;
  color: #A6442E;
  border: 2px solid #A6442E;
  border-radius: 4px;
  padding: 5px 10px;
  opacity: .85;
}
.uf-interactive .uf-folder h4 {
  font: 600 12px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #6B5A33;
  margin: 18px 0 8px;
  padding-bottom: 5px;
  border-bottom: 1px dashed #D9C69A;
}
.uf-interactive .uf-folder h4:first-of-type { margin-top: 4px; }
.uf-interactive .uf-folder p { color: #4A4136; font-size: 14px; margin: 0; }
.uf-interactive .uf-ex-row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  font: 500 13.5px var(--uf-sans);
  padding: 5px 0;
}
.uf-interactive .uf-ex-row .v {
  font-family: var(--uf-mono);
  font-weight: 600;
  color: #1F5C3D;
  white-space: nowrap;
}
.uf-interactive .uf-ex-row--clear { font: italic 14px var(--uf-serif); color: #6B5A33; }
.uf-interactive .uf-folder__wait {
  margin: 12px 0;
  padding: 12px 14px;
  background: #FBEFD6;
  border-left: 3px solid #B7791F;
  border-radius: 0 8px 8px 0;
  font-size: 13.5px;
  color: #4A4136;
}
.uf-interactive .uf-folder__wait b { color: #8a5d18; }
.uf-interactive .uf-ex-ck { font-size: 13.5px; color: #1C1812; padding: 4px 0; }
.uf-interactive .uf-ex-say {
  font: italic 14px/1.5 var(--uf-serif);
  color: #4A4136;
  border-left: 2px solid #D9C69A;
  padding: 3px 0 3px 12px;
  margin: 7px 0;
}
/* uf-scheme-pinned: end */
.uf-interactive .uf-artifacts > .uf-trybtn { margin: 14px 10px 0 0; }
.uf-interactive .uf-card-preview {
  display: block;
  width: 100%;
  max-width: 340px;
  border-radius: 12px;
  margin-top: 16px;
  box-shadow: var(--uf-shadow-lg);
}

/* ------------------------------------------ classifier + buy-checker ---- */
.uf-interactive .uf-ruling { display: none; }
.uf-interactive .uf-ruling.show {
  display: block;
  background: var(--uf-paper-2);
  border: 1px solid var(--uf-line);
  border-radius: 14px;
  padding: 16px 18px;
}
.uf-interactive .uf-ruling .rb {
  display: inline-block;
  font: 600 10.5px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 5px 11px;
  border-radius: 100px;
}
.uf-interactive .uf-ruling .rb.yes { background: var(--uf-green-soft); color: var(--uf-green); }
.uf-interactive .uf-ruling .rb.no { background: var(--uf-clay-soft); color: var(--uf-clay); }
.uf-interactive .uf-ruling .rb.dep { background: var(--uf-ochre-soft); color: var(--uf-ochre); }
.uf-interactive .uf-ruling .rh2 { font: 600 17px var(--uf-serif); margin: 9px 0 6px; color: var(--uf-ink); }
.uf-interactive .uf-ruling p { font-size: 14.5px; color: var(--uf-ink-2); margin: 0; }
.uf-interactive .uf-rmp { font-size: 12.5px; color: var(--uf-ink-3); margin-top: 12px; }

/* ---------------------------------------------------------- personas ---- */
.uf-interactive .uf-ptabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.uf-interactive .uf-pcase {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 22px;
  align-items: start;
}
@media (max-width: 680px) { .uf-interactive .uf-pcase { grid-template-columns: 1fr; } }
.uf-interactive .uf-pcase .story h3 { font: 600 22px/1.2 var(--uf-serif); margin: 0 0 8px; color: var(--uf-ink); }
.uf-interactive .uf-pcase .story p { font-size: 15px; color: var(--uf-ink-2); margin: 0 0 10px; }
.uf-interactive .uf-pcase .pivot {
  background: var(--uf-ochre-soft);
  border-left: 3px solid var(--uf-ochre);
  border-radius: 0 8px 8px 0;
  padding: 10px 13px;
  font-size: 14.5px;
  color: var(--uf-ink-2);
}
/* uf-scheme-pinned: start — PAPER ARTIFACT: the persona mini-receipt is
   pinned cream with print-pinned inks in BOTH color schemes. */
/* the persona mini-receipt is a paper artifact too — pinned cream */
.uf-interactive .uf-minirec {
  background: #FFFEF8;
  color: #1C1812;
  font-family: var(--uf-mono);
  padding: 16px 18px;
  box-shadow: var(--uf-shadow);
  transform: rotate(.4deg);
}
.uf-interactive .uf-minirec .mh {
  font: 600 10.5px/1.3 var(--uf-mono);
  letter-spacing: .07em;
  color: #7A6E5E;
  margin-bottom: 8px;
  padding-bottom: 7px;
  border-bottom: 1px dashed #D2C4AC;
}
.uf-interactive .uf-minirec .uf-rrow { font-size: 12.5px; }
.uf-interactive .uf-minirec .uf-rrow.tot {
  border-bottom: 0;
  border-top: 1.5px solid #1C1812;
  margin-top: 4px;
  padding-top: 8px;
  font-weight: 600;
  color: #1F5C3D;
}
/* uf-scheme-pinned: end */
.uf-interactive [data-uf-verify="stale"] { outline: 2px dashed var(--uf-clay); outline-offset: 3px; }
.uf-interactive .pbridge { margin-top: 14px; }

/* ---------------------------------------------------------- benchmark ---- */
.uf-interactive .uf-bmk__head { margin-bottom: 12px; }
.uf-interactive .uf-bmk__head .bt { font: 600 19px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-bmk__head .bs { font-size: 13.5px; color: var(--uf-ink-3); margin-top: 3px; }
.uf-interactive .uf-brow {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  gap: 6px 14px;
  align-items: baseline;
  padding: 10px 2px;
  border-bottom: 1px solid var(--uf-line);
}
@media (max-width: 560px) { .uf-interactive .uf-brow { grid-template-columns: 1fr auto; } }
.uf-interactive .uf-brow .binc { font: 600 14px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive .uf-brow .bprogs { font-size: 13.5px; color: var(--uf-ink-2); }
.uf-interactive .uf-brow .bben { font: 600 14px var(--uf-mono); color: var(--uf-green); white-space: nowrap; }
.uf-interactive .uf-brow.you {
  background: var(--uf-green-soft);
  border: 1px solid var(--uf-green-2);
  border-radius: 10px;
  padding: 10px 12px;
  margin: 2px -10px;
}
.uf-interactive .uf-bmk__foot {
  font: italic 13px/1.5 var(--uf-serif);
  color: var(--uf-ink-3);
  margin-top: 12px;
}

/* --------------------------------------------------- life-event deltas ---- */
.uf-interactive .uf-evs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.uf-interactive .uf-delta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 20px;
  background: var(--uf-paper-2);
  border: 1px solid var(--uf-line);
  border-radius: 14px;
  padding: 16px 18px;
}
.uf-interactive .uf-delta .v { font: 600 24px/1.1 var(--uf-mono); color: var(--uf-ink); }
.uf-interactive .uf-delta .l {
  font: 600 10.5px/1.3 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--uf-ink-3);
  margin-top: 5px;
}
.uf-interactive .uf-delta .arrow { font-size: 22px; color: var(--uf-ink-3); }
.uf-interactive .uf-delta .chg b { font: 600 18px var(--uf-mono); color: var(--uf-green); }
.uf-interactive .uf-delta .chg b.down { color: var(--uf-clay); }
.uf-interactive .uf-delta .report {
  flex-basis: 100%;
  border-left: 3px solid var(--uf-green);
  background: var(--uf-card);
  border-radius: 0 8px 8px 0;
  padding: 11px 14px;
  font-size: 14px;
  color: var(--uf-ink-2);
}

/* ------------------------------------------------------- denial decoder ---- */
.uf-interactive .uf-reasons { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.uf-interactive .uf-verdict { display: none; }
.uf-interactive .uf-verdict.show {
  display: block;
  border-radius: 14px;
  padding: 18px 20px;
  border: 1px solid var(--uf-line);
}
.uf-interactive .uf-verdict.strong { background: var(--uf-green-soft); border-color: var(--uf-green-2); }
.uf-interactive .uf-verdict.fix { background: var(--uf-ochre-soft); border-color: var(--uf-ochre); }
.uf-interactive .uf-verdict .vt {
  font: 600 11px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .07em;
}
.uf-interactive .uf-verdict.strong .vt { color: var(--uf-green); }
.uf-interactive .uf-verdict.fix .vt { color: var(--uf-ochre); }
.uf-interactive .uf-verdict .vh { font: 600 18px/1.3 var(--uf-serif); margin: 7px 0 8px; color: var(--uf-ink); }
.uf-interactive .uf-verdict p { font-size: 14.5px; color: var(--uf-ink-2); margin: 0; }
.uf-interactive .uf-verdict .clock {
  margin-top: 12px;
  font: 600 12.5px var(--uf-mono);
  color: var(--uf-clay);
}

/* ------------------------------------------------------ deposit decoder ---- */
.uf-interactive .uf-dq { font: 600 17px/1.4 var(--uf-serif); color: var(--uf-ink); margin-bottom: 12px; }
.uf-interactive .uf-dopts { display: grid; gap: 10px; }
.uf-interactive .uf-dres {
  background: var(--uf-green-soft);
  border: 1px solid var(--uf-green-2);
  border-radius: 14px;
  padding: 16px 18px;
}
.uf-interactive .uf-dres .dt { font: 600 17px var(--uf-serif); margin-bottom: 6px; color: var(--uf-ink); }
.uf-interactive .uf-dres p { font-size: 14.5px; color: var(--uf-ink-2); margin: 0; }
.uf-interactive .uf-dsched { font: 600 12.5px var(--uf-mono); color: var(--uf-ink-2); margin-top: 10px; }
.uf-interactive .uf-dback {
  border: 0;
  background: none;
  font: 600 12.5px var(--uf-mono);
  color: var(--uf-ink-3);
  text-decoration: underline;
  margin-top: 12px;
  padding: 0;
}
.uf-interactive .uf-dback:hover { color: var(--uf-ink); }

/* ============================== S22 SSR editorial sections =============== */

/* six deduction cards: ride the chrome .uf-dcard card; add grid + badges */
.uf-widget--deduction-cards .uf-dcards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 860px) { .uf-widget--deduction-cards .uf-dcards { grid-template-columns: 1fr; } }
.uf-widget--deduction-cards .uf-dcard__badge {
  display: inline-block;
  font: 600 10.5px/1 var(--uf-mono);
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 5px 11px;
  border-radius: 100px;
}
.uf-widget--deduction-cards .uf-dcard--automatic .uf-dcard__badge { background: var(--uf-green-soft); color: var(--uf-green); }
.uf-widget--deduction-cards .uf-dcard--claim .uf-dcard__badge { background: var(--uf-ochre-soft); color: var(--uf-ochre); }
.uf-widget--deduction-cards .uf-dcard__name { font: 600 18px/1.25 var(--uf-serif); margin: 10px 0 2px; color: var(--uf-ink); }
.uf-widget--deduction-cards .uf-dcard__figure { font: 600 15px var(--uf-mono); color: var(--uf-green); margin: 0; }
.uf-widget--deduction-cards .uf-dcard__body { font-size: 14px; color: var(--uf-ink-2); margin: 8px 0 0; }

/* filing timeline (override the M6 chrome .uf-timeline 5-col tstep grid) */
.uf-widget--timeline .uf-timeline {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  list-style: none;
  counter-reset: uf-step;
  margin: 0;
  padding: 0;
}
@media (max-width: 820px) { .uf-widget--timeline .uf-timeline { grid-template-columns: 1fr; } }
.uf-widget--timeline .uf-timeline__step { counter-increment: uf-step; margin: 0; }
.uf-widget--timeline .uf-timeline__step::before {
  content: counter(uf-step);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--uf-green);
  color: var(--uf-paper);
  font: 600 17px var(--uf-serif);
  margin-bottom: 10px;
}
.uf-widget--timeline .uf-timeline__step:nth-child(n+4)::before { background: var(--uf-ochre); }
.uf-widget--timeline .uf-timeline__label { font: 600 15px/1.3 var(--uf-sans); color: var(--uf-ink); margin: 0 0 5px; }
.uf-widget--timeline .uf-timeline__body { font-size: 13.5px; line-height: 1.5; color: var(--uf-ink-2); margin: 0; }
.uf-widget--timeline .uf-timeline__crisis {
  margin-top: 20px;
  background: var(--uf-clay-soft);
  border-left: 3px solid var(--uf-clay);
  border-radius: 0 12px 12px 0;
  padding: 14px 18px;
}
.uf-widget--timeline .uf-timeline__ctitle { font: 600 16px var(--uf-serif); color: var(--uf-clay); margin: 0 0 4px; }
.uf-widget--timeline .uf-timeline__cbody { font-size: 14px; color: var(--uf-ink-2); margin: 0; }

/* edge rules: myth-corrected boxes */
.uf-widget--edge-rules .uf-edges { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 720px) { .uf-widget--edge-rules .uf-edges { grid-template-columns: 1fr; } }
.uf-widget--edge-rules .uf-edge {
  background: var(--uf-card);
  border: 1px solid var(--uf-line);
  border-radius: 14px;
  padding: 16px 18px;
}
.uf-widget--edge-rules .uf-edge__label { font: 600 16.5px var(--uf-serif); color: var(--uf-ink); margin: 0 0 6px; }
.uf-widget--edge-rules .uf-edge__myth {
  font: italic 14px/1.5 var(--uf-serif);
  color: var(--uf-clay);
  margin: 0 0 7px;
}
.uf-widget--edge-rules .uf-edge__fact { font-size: 14px; color: var(--uf-ink-2); margin: 0; }

/* state switcher (SSR state cards) */
.uf-widget--state-switcher .uf-states {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 14px;
}
.uf-widget--state-switcher .uf-state {
  background: var(--uf-paper-2);
  border: 1px solid var(--uf-line);
  border-radius: 14px;
  padding: 14px 16px;
}
.uf-widget--state-switcher .uf-state__code {
  font: 600 13px/1 var(--uf-mono);
  letter-spacing: .1em;
  color: var(--uf-green);
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--uf-line);
}
.uf-widget--state-switcher .uf-state__row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 12.5px;
  color: var(--uf-ink-3);
  padding: 4px 0;
}
.uf-widget--state-switcher .uf-state__row .v {
  color: var(--uf-ink);
  font-family: var(--uf-mono);
  font-weight: 600;
  text-align: right;
}
/* state switcher — runtime pills (0.8.17): pick a state, see its card.
   Pure show/hide of the SSR cards; theme tokens only, so dark mode rides. */
.uf-widget--state-switcher .uf-states__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}
.uf-widget--state-switcher .uf-states__pill {
  font: 600 13px/1 var(--uf-mono);
  letter-spacing: .08em;
  color: var(--uf-ink-3);
  background: var(--uf-paper-2);
  border: 1px solid var(--uf-line);
  border-radius: 999px;
  padding: 8px 13px;
  cursor: pointer;
  transition: color .15s, background-color .15s, border-color .15s;
}
.uf-widget--state-switcher .uf-states__pill:hover {
  color: var(--uf-ink);
  border-color: var(--uf-ink-3);
}
.uf-widget--state-switcher .uf-states__pill.on {
  background: var(--uf-green);
  border-color: var(--uf-green);
  color: var(--uf-paper);
}
.uf-widget--state-switcher .uf-states.uf-states--switching {
  grid-template-columns: 1fr;
}

/* changelog (the living-page history) */
.uf-widget--changelog .uf-chlog {
  list-style: none;
  margin: 0;
  padding: 0;
  border-left: 2px solid var(--uf-line-2);
}
.uf-widget--changelog .uf-chlog__entry {
  position: relative;
  padding: 0 0 16px 20px;
  font-size: 14.5px;
  color: var(--uf-ink-2);
}
.uf-widget--changelog .uf-chlog__entry::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 6px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--uf-ochre);
  border: 2px solid var(--uf-card);
}
.uf-widget--changelog .uf-chlog__date {
  display: block;
  font: 600 11.5px/1 var(--uf-mono);
  letter-spacing: .06em;
  color: var(--uf-ochre);
  margin-bottom: 4px;
}
.uf-widget--changelog .uf-chlog__src { color: var(--uf-green); font-size: 12.5px; }

/* SSA payment schedule (SSR rows) */
.uf-widget--ss-payment-schedule .uf-paysched__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  padding: 11px 2px;
  border-bottom: 1px solid var(--uf-line);
  font-size: 14.5px;
}
.uf-widget--ss-payment-schedule .uf-paysched__row:last-child { border-bottom: 0; }
.uf-widget--ss-payment-schedule .uf-paysched__who { color: var(--uf-ink-2); font-weight: 600; }
.uf-widget--ss-payment-schedule .uf-paysched__date {
  font: 600 14px var(--uf-mono);
  color: var(--uf-green);
  white-space: nowrap;
}

/* VA payment schedule (SSR rows — statute-computed dates) */
.uf-widget--va-payment-schedule .uf-vasched__intro { color: var(--uf-ink-2); margin-bottom: 10px; }
.uf-widget--va-payment-schedule .uf-vasched__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  padding: 11px 2px;
  border-bottom: 1px solid var(--uf-line);
  font-size: 14.5px;
}
.uf-widget--va-payment-schedule .uf-vasched__row:last-child { border-bottom: 0; }
.uf-widget--va-payment-schedule .uf-vasched__who { color: var(--uf-ink-2); font-weight: 600; }
.uf-widget--va-payment-schedule .uf-vasched__date {
  font: 600 14px var(--uf-mono);
  color: var(--uf-green);
  white-space: nowrap;
}
.uf-widget--va-payment-schedule .uf-vasched__note {
  color: var(--uf-ink-3);
  font-size: 12.5px;
  margin-top: 10px;
}

/* SNAP all-states issuance schedule (SSR rows) */
.uf-widget--snap-payment-schedule .uf-snapsched__intro { color: var(--uf-ink-2); margin-bottom: 10px; }
.uf-widget--snap-payment-schedule .uf-snapsched__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  padding: 10px 2px;
  border-bottom: 1px solid var(--uf-line);
  font-size: 14px;
}
.uf-widget--snap-payment-schedule .uf-snapsched__row:last-child { border-bottom: 0; }
.uf-widget--snap-payment-schedule .uf-snapsched__row--nap { opacity: 0.85; }
.uf-widget--snap-payment-schedule .uf-snapsched__state {
  color: var(--uf-ink-2);
  font-weight: 600;
  flex: 0 0 auto;
}
.uf-widget--snap-payment-schedule .uf-snapsched__window {
  color: var(--uf-green);
  font-weight: 500;
  text-align: right;
  max-width: 70%;
}
.uf-widget--snap-payment-schedule .uf-snapsched__note {
  color: var(--uf-ink-3);
  font-size: 12.5px;
  margin-top: 10px;
}

/* TANF 50-state+DC cash-payment schedule (SSR rows) */
.uf-widget--tanf-payment-schedule .uf-tanfsched__intro { color: var(--uf-ink-2); margin-bottom: 10px; }
.uf-widget--tanf-payment-schedule .uf-tanfsched__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  padding: 10px 2px;
  border-bottom: 1px solid var(--uf-line);
  font-size: 14px;
}
.uf-widget--tanf-payment-schedule .uf-tanfsched__row:last-child { border-bottom: 0; }
.uf-widget--tanf-payment-schedule .uf-tanfsched__state {
  color: var(--uf-ink-2);
  font-weight: 600;
  flex: 0 0 auto;
}
.uf-widget--tanf-payment-schedule .uf-tanfsched__window {
  color: var(--uf-green);
  font-weight: 500;
  text-align: right;
  max-width: 70%;
}
.uf-widget--tanf-payment-schedule .uf-tanfsched__note {
  color: var(--uf-ink-3);
  font-size: 12.5px;
  margin-top: 10px;
}

/* disclaimer */
.uf-widget--disclaimer { background: var(--uf-paper-2); }
.uf-widget--disclaimer .uf-disclaimer__line {
  font-size: 13.5px;
  color: var(--uf-ink-3);
  margin: 0 0 8px;
  max-width: 75ch;
}

/* Civic instruments — cola_calculator */
.uf-interactive[data-uf-component="cola"] .uf-cola { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="cola"] .uf-cola__field { display: flex; flex-direction: column; gap: 6px; font: 600 14px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="cola"] .uf-cola__money { display: inline-flex; align-items: center; gap: 4px; font: 600 18px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive[data-uf-component="cola"] .uf-cola__money input { width: 8ch; border: 1px solid var(--uf-line); border-radius: 8px; padding: 6px 8px; font: inherit; background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="cola"] .uf-cola__out { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 4px; }
.uf-interactive[data-uf-component="cola"] .uf-cola__cell { background: var(--uf-card); border: 1px solid var(--uf-line); border-radius: 12px; padding: 12px; text-align: center; }
.uf-interactive[data-uf-component="cola"] .uf-cola__cell span { display: block; font: 600 12px var(--uf-sans); color: var(--uf-ink-3); margin-bottom: 4px; }
.uf-interactive[data-uf-component="cola"] .uf-cola__cell b { font: 700 19px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive[data-uf-component="cola"] .uf-cola__cell--land { background: var(--uf-green-soft); border-color: var(--uf-green); }
.uf-interactive[data-uf-component="cola"] .uf-cola__cell--land b { color: var(--uf-green-2); }

/* Civic instruments — deposit_countdown */
.uf-interactive[data-uf-component="countdown"] .uf-cd { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="countdown"] .uf-cd__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive[data-uf-component="countdown"] .uf-cd__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 7px 13px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="countdown"] .uf-cd__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="countdown"] .uf-cd__clock { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.uf-interactive[data-uf-component="countdown"] .uf-cd__tile { background: var(--uf-ink); color: var(--uf-paper-2); border-radius: 12px; padding: 14px 0; text-align: center; }
.uf-interactive[data-uf-component="countdown"] .uf-cd__tile b { display: block; font: 700 28px var(--uf-mono); letter-spacing: 1px; }
.uf-interactive[data-uf-component="countdown"] .uf-cd__tile span { font: 600 11px var(--uf-sans); text-transform: uppercase; opacity: .7; }
.uf-interactive[data-uf-component="countdown"] .uf-cd__next { font: 600 15px var(--uf-serif); color: var(--uf-ink); text-align: center; }

/* Civic instruments — benefit_story */
.uf-interactive[data-uf-component="story"] .uf-story { display: grid; gap: 16px; }
.uf-interactive[data-uf-component="story"] .uf-story__setup { display: grid; gap: 10px; }
.uf-interactive[data-uf-component="story"] .uf-story__name, .uf-interactive[data-uf-component="story"] .uf-story__money input { border: 1px solid var(--uf-line); border-radius: 8px; padding: 8px 10px; font: 600 16px var(--uf-sans); background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="story"] .uf-story__money { display: inline-flex; align-items: center; gap: 4px; font: 600 16px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive[data-uf-component="story"] .uf-story__money input { width: 9ch; }
.uf-interactive[data-uf-component="story"] .uf-story__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive[data-uf-component="story"] .uf-story__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 6px 12px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="story"] .uf-story__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="story"] .uf-story__play { justify-self: start; background: var(--uf-ink); color: var(--uf-paper-2); border: 0; border-radius: 10px; padding: 10px 18px; font: 700 14px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="story"] .uf-story__play:disabled { opacity: .4; cursor: not-allowed; }
.uf-interactive[data-uf-component="story"] .uf-story__film { display: grid; gap: 12px; }
.uf-interactive[data-uf-component="story"] .uf-story__chapter { background: var(--uf-card); border: 1px solid var(--uf-line); border-radius: 14px; padding: 16px 18px; opacity: 0; transform: translateY(8px); animation: uf-story-rise .5s ease forwards; }
@keyframes uf-story-rise { to { opacity: 1; transform: none; } }
.uf-interactive[data-uf-component="story"] .uf-story__kicker { display: block; font: 700 11px var(--uf-sans); text-transform: uppercase; letter-spacing: 1px; color: var(--uf-ink-3); margin-bottom: 6px; }
.uf-interactive[data-uf-component="story"] .uf-story__body h3 { font: 700 22px var(--uf-serif); color: var(--uf-ink); margin: 0; }
.uf-interactive[data-uf-component="story"] .uf-story__old { color: var(--uf-ink-3); text-decoration: line-through; }
.uf-interactive[data-uf-component="story"] .uf-story__new { color: var(--uf-green-2); }
.uf-interactive[data-uf-component="story"] .uf-story__body ul { margin: 6px 0; padding-left: 18px; color: var(--uf-clay); }

/* Civic instruments — garnishment_defense */
.uf-interactive[data-uf-component="garnish"] .uf-garnish { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__field { display: flex; flex-direction: column; gap: 6px; font: 600 14px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__money { display: inline-flex; align-items: center; gap: 4px; font: 600 18px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__money input { width: 9ch; border: 1px solid var(--uf-line); border-radius: 8px; padding: 6px 8px; font: inherit; background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__verdict { border-radius: 12px; padding: 14px 16px; font: 500 15px var(--uf-serif); }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__verdict.is-safe { background: var(--uf-green-soft); color: var(--uf-green-2); }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__verdict.is-hit { background: var(--uf-ochre-soft); color: var(--uf-ink); }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__status { font: 500 13px var(--uf-sans); color: var(--uf-ink-3); margin: 0; }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__exits { display: grid; gap: 10px; }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__exit { background: var(--uf-card); border: 1px solid var(--uf-line); border-radius: 12px; padding: 12px 14px; }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__exit b { display: block; font: 700 14px var(--uf-sans); color: var(--uf-ink); margin-bottom: 3px; }
.uf-interactive[data-uf-component="garnish"] .uf-garnish__exit span { font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }

/* Civic instruments — overpayment_wizard */
.uf-interactive[data-uf-component="overpay"] .uf-overpay { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__inputs { display: grid; gap: 10px; }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__field { display: flex; flex-direction: column; gap: 6px; font: 600 14px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__money { display: inline-flex; align-items: center; gap: 4px; font: 600 18px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__money input { width: 9ch; border: 1px solid var(--uf-line); border-radius: 8px; padding: 6px 8px; font: inherit; background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__kind { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 7px 13px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__verdict { background: var(--uf-ochre-soft); border-radius: 12px; padding: 14px 16px; font: 500 15px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__paths { display: grid; gap: 10px; }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__path { background: var(--uf-card); border: 1px solid var(--uf-line); border-radius: 12px; padding: 12px 14px; }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__path b { display: block; font: 700 14px var(--uf-sans); color: var(--uf-ink); margin-bottom: 3px; }
.uf-interactive[data-uf-component="overpay"] .uf-overpay__path span { font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }

/* Civic instruments — survivor_underpayment_audit */
.uf-interactive[data-uf-component="survivor"] .uf-survivor { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__qs { display: grid; gap: 12px; }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__q p { margin: 0 0 6px; font: 600 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__yn { display: flex; gap: 8px; }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__yn button { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 5px 16px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__yn button.is-on { background: var(--uf-ink); border-color: var(--uf-ink); color: var(--uf-paper-2); }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__verdict { border-radius: 12px; padding: 14px 16px; }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__verdict.is-flag { background: var(--uf-ochre-soft); }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__verdict.is-clear { background: var(--uf-green-soft); }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__verdict p { margin: 0 0 10px; font: 500 15px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__script { margin: 0 0 10px; padding: 12px 14px; background: var(--uf-card); border-left: 3px solid var(--uf-ochre); border-radius: 8px; font: 400 13.5px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive[data-uf-component="survivor"] .uf-survivor__copy { background: var(--uf-ink); color: var(--uf-paper-2); border: 0; border-radius: 8px; padding: 8px 16px; font: 700 13px var(--uf-sans); cursor: pointer; }

/* Civic instruments — call_prep */
.uf-interactive[data-uf-component="callprep"] .uf-callprep { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 6px 13px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__panel { background: var(--uf-card); border: 1px solid var(--uf-line); border-radius: 14px; padding: 16px 18px; }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__h { font: 700 11px var(--uf-sans); text-transform: uppercase; letter-spacing: 1px; color: var(--uf-ink-3); margin: 0 0 6px; }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__docs { margin: 0 0 14px; padding-left: 18px; }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__docs li { font: 400 14px var(--uf-serif); color: var(--uf-ink); margin-bottom: 4px; }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__script { margin: 0 0 12px; padding: 12px 14px; background: var(--uf-paper-2); border-left: 3px solid var(--uf-green); border-radius: 8px; font: 400 13.5px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__copy { background: var(--uf-ink); color: var(--uf-paper-2); border: 0; border-radius: 8px; padding: 8px 16px; font: 700 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="callprep"] .uf-callprep__contact { font: 500 13px var(--uf-sans); color: var(--uf-ink-3); margin: 0; }

/* Civic instruments — ssi_asset_tracker */
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi { display: grid; gap: 12px; }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__field { display: flex; flex-direction: column; gap: 6px; font: 600 13.5px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__money { display: inline-flex; align-items: center; gap: 4px; font: 600 17px var(--uf-mono); color: var(--uf-ink); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__money input { width: 9ch; border: 1px solid var(--uf-line); border-radius: 8px; padding: 6px 8px; font: inherit; background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__married { display: flex; align-items: center; gap: 8px; font: 600 13.5px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 5px 14px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__bar { height: 12px; background: var(--uf-line-2, var(--uf-line)); border-radius: 999px; overflow: hidden; }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__fill { height: 100%; width: 0; background: var(--uf-green); transition: width .2s ease; }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__fill.is-caution { background: var(--uf-ochre); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__fill.is-danger { background: var(--uf-clay); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__verdict { font: 500 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__verdict.is-danger { color: var(--uf-clay); }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__exclusions summary { font: 600 13px var(--uf-sans); color: var(--uf-ink-3); cursor: pointer; }
.uf-interactive[data-uf-component="ssiasset"] .uf-ssi__exclusions ul { margin: 8px 0 0; padding-left: 18px; font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }

/* Civic instruments — fairness_act_check */
.uf-interactive[data-uf-component="fairness"] .uf-fair { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="fairness"] .uf-fair__qs { display: grid; gap: 12px; }
.uf-interactive[data-uf-component="fairness"] .uf-fair__q p { margin: 0 0 6px; font: 600 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="fairness"] .uf-fair__yn { display: flex; gap: 8px; }
.uf-interactive[data-uf-component="fairness"] .uf-fair__yn button { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 5px 16px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="fairness"] .uf-fair__yn button.is-on { background: var(--uf-ink); border-color: var(--uf-ink); color: var(--uf-paper-2); }
.uf-interactive[data-uf-component="fairness"] .uf-fair__verdict { border-radius: 12px; padding: 14px 16px; }
.uf-interactive[data-uf-component="fairness"] .uf-fair__verdict.is-affected { background: var(--uf-green-soft); }
.uf-interactive[data-uf-component="fairness"] .uf-fair__verdict.is-clear { background: var(--uf-paper-2); }
.uf-interactive[data-uf-component="fairness"] .uf-fair__verdict p { margin: 0 0 10px; font: 500 15px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="fairness"] .uf-fair__verdict ul { margin: 0; padding-left: 18px; }
.uf-interactive[data-uf-component="fairness"] .uf-fair__verdict li { font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); margin-bottom: 6px; }

/* Civic instruments — benefit_solver (capstone router) */
.uf-interactive[data-uf-component="solver"] .uf-solver { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="solver"] .uf-solver__field { display: flex; flex-direction: column; gap: 6px; }
.uf-interactive[data-uf-component="solver"] .uf-solver__prompt { font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="solver"] .uf-solver__input { border: 1px solid var(--uf-line); border-radius: 10px; padding: 10px 12px; font: 400 15px var(--uf-serif); background: var(--uf-card); color: var(--uf-ink); resize: vertical; }
.uf-interactive[data-uf-component="solver"] .uf-solver__input:focus { outline: none; border-color: var(--uf-green); box-shadow: 0 0 0 3px var(--uf-green-soft); }
.uf-interactive[data-uf-component="solver"] .uf-solver__go { justify-self: start; background: var(--uf-solver-accent, var(--uf-green)); color: var(--uf-paper); border: 0; border-radius: 10px; padding: 10px 18px; font: 700 14px var(--uf-sans); cursor: pointer; }
/* Per-program identity eyebrow (audit 2026-07-10): an accent-tinted kicker, not a rule over text. */
.uf-interactive[data-uf-component="solver"] .uf-solver__kicker { display: inline-block; margin: 0 0 2px; font: 700 11px var(--uf-mono); text-transform: uppercase; letter-spacing: 1.5px; color: var(--uf-solver-accent, var(--uf-green)); }
.uf-interactive[data-uf-component="solver"] .uf-solver__go:disabled { opacity: .4; cursor: not-allowed; }
.uf-interactive[data-uf-component="solver"] .uf-solver__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.uf-interactive[data-uf-component="solver"] .uf-solver__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 5px 12px; font: 600 12.5px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="solver"] .uf-solver__chip:hover { border-color: var(--uf-solver-accent, var(--uf-green)); color: var(--uf-ink); }
.uf-interactive[data-uf-component="solver"] .uf-solver__miss { background: var(--uf-paper-2); border-radius: 12px; padding: 14px 16px; font: 500 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="solver"] .uf-solver__card { border: 1px solid var(--uf-solver-accent, var(--uf-green)); border-radius: 14px; overflow: hidden; }
.uf-interactive[data-uf-component="solver"] .uf-solver__title { background: var(--uf-solver-accent, var(--uf-green)); color: var(--uf-paper); padding: 10px 16px; font: 700 14px var(--uf-sans); }
.uf-interactive[data-uf-component="solver"] .uf-solver__body { background: var(--uf-card); padding: 16px 18px; display: grid; gap: 8px; }
.uf-interactive[data-uf-component="solver"] .uf-solver__answer { margin: 0; font: 400 15px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="solver"] .uf-solver__label { margin: 6px 0 0; font: 700 11px var(--uf-mono); text-transform: uppercase; letter-spacing: 1.5px; color: var(--uf-solver-accent, var(--uf-green-2)); }
.uf-interactive[data-uf-component="solver"] .uf-solver__steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 5px; }
.uf-interactive[data-uf-component="solver"] .uf-solver__steps li { display: flex; gap: 8px; font: 400 14px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="solver"] .uf-solver__num { flex: none; font: 700 13px var(--uf-mono); color: var(--uf-ochre); }
.uf-interactive[data-uf-component="solver"] .uf-solver__who { margin: 0; font: 500 13px var(--uf-sans); color: var(--uf-ink-3); }

/* Civic instruments — program_screener */
.uf-interactive[data-uf-component="screener"] .uf-screener { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="screener"] .uf-screener__q { display: grid; gap: 6px; }
.uf-interactive[data-uf-component="screener"] .uf-screener__qlabel { margin: 0; font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="screener"] .uf-screener__opts { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive[data-uf-component="screener"] .uf-screener__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 6px 14px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="screener"] .uf-screener__chip:hover { border-color: var(--uf-green); color: var(--uf-ink); }
.uf-interactive[data-uf-component="screener"] .uf-screener__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="screener"] .uf-screener__result { display: grid; gap: 10px; }
.uf-interactive[data-uf-component="screener"] .uf-screener__lead { margin: 4px 0 0; font: 700 14px var(--uf-sans); color: var(--uf-green-2); }
.uf-interactive[data-uf-component="screener"] .uf-screener__prog { background: var(--uf-green-soft); border: 1px solid var(--uf-green-2); border-radius: 12px; padding: 12px 14px; }
.uf-interactive[data-uf-component="screener"] .uf-screener__name { margin: 0 0 3px; font: 700 14.5px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="screener"] .uf-screener__hint { margin: 0 0 4px; font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="screener"] .uf-screener__contact { margin: 0; font: 600 12.5px var(--uf-mono); color: var(--uf-green-2); }
.uf-interactive[data-uf-component="screener"] .uf-screener__none { background: var(--uf-paper-2); border-radius: 12px; padding: 14px 16px; font: 500 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="screener"] .uf-screener__note { margin: 2px 0 0; font: 400 12px var(--uf-sans); color: var(--uf-ink-3); }

/* Civic instruments — help_directory */
.uf-interactive[data-uf-component="directory"] .uf-dir { display: grid; gap: 12px; }
.uf-interactive[data-uf-component="directory"] .uf-dir__filter { width: 100%; box-sizing: border-box; border: 1px solid var(--uf-line); border-radius: 10px; padding: 9px 12px; font: 400 14px var(--uf-sans); background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="directory"] .uf-dir__filter:focus { outline: none; border-color: var(--uf-green); box-shadow: 0 0 0 3px var(--uf-green-soft); }
.uf-interactive[data-uf-component="directory"] .uf-dir__groups { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="directory"] .uf-dir__cat { margin: 0 0 6px; font: 700 11px var(--uf-mono); text-transform: uppercase; letter-spacing: 1.5px; color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="directory"] .uf-dir__entry { padding: 9px 0; border-top: 1px solid var(--uf-line); }
.uf-interactive[data-uf-component="directory"] .uf-dir__entry:first-of-type { border-top: 0; }
.uf-interactive[data-uf-component="directory"] .uf-dir__top { display: flex; flex-wrap: wrap; gap: 4px 12px; justify-content: space-between; align-items: baseline; }
.uf-interactive[data-uf-component="directory"] .uf-dir__name { font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="directory"] .uf-dir__contact { font: 600 13px var(--uf-mono); color: var(--uf-green-2); }
.uf-interactive[data-uf-component="directory"] .uf-dir__note { margin: 3px 0 0; font: 400 13px var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="directory"] .uf-dir__empty { margin: 0; padding: 12px 14px; background: var(--uf-paper-2); border-radius: 10px; font: 500 13.5px var(--uf-serif); color: var(--uf-ink); }

/* Civic instruments — free_vs_fee_check */
.uf-interactive[data-uf-component="freefee"] .uf-ff { display: grid; gap: 10px; }
.uf-interactive[data-uf-component="freefee"] .uf-ff__q { margin: 6px 0 0; font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="freefee"] .uf-ff__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive[data-uf-component="freefee"] .uf-ff__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 6px 13px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="freefee"] .uf-ff__chip:hover { border-color: var(--uf-green); color: var(--uf-ink); }
.uf-interactive[data-uf-component="freefee"] .uf-ff__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="freefee"] .uf-ff__chip--fee.is-on { background: var(--uf-ink); border-color: var(--uf-ink); color: var(--uf-paper-2); }
.uf-interactive[data-uf-component="freefee"] .uf-ff__verdict { border-radius: 12px; padding: 12px 14px; font: 500 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="freefee"] .uf-ff__verdict.is-free, .uf-interactive[data-uf-component="freefee"] .uf-ff__verdict.is-ok { background: var(--uf-green-soft); }
.uf-interactive[data-uf-component="freefee"] .uf-ff__verdict.is-bad { background: var(--uf-ochre-soft); }
.uf-interactive[data-uf-component="freefee"] .uf-ff__big { margin: 0 0 4px; font: 800 22px var(--uf-sans); color: var(--uf-green-2); letter-spacing: .5px; }
.uf-interactive[data-uf-component="freefee"] .uf-ff__note { margin: 6px 0 0; font: 400 12px var(--uf-sans); color: var(--uf-ink-3); }

/* Civic instruments — account_lockdown */
.uf-interactive[data-uf-component="lockdown"] .uf-lock { display: grid; gap: 12px; }
.uf-interactive[data-uf-component="lockdown"] .uf-lock__status { margin: 0; display: flex; align-items: center; gap: 8px; font: 500 14px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="lockdown"] .uf-lock__count { font: 700 14px var(--uf-mono); color: var(--uf-paper); background: var(--uf-green); border-radius: 999px; padding: 2px 10px; }
.uf-interactive[data-uf-component="lockdown"] .uf-lock__steps { display: grid; gap: 8px; }
.uf-interactive[data-uf-component="lockdown"] .uf-lock__step { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--uf-line); border-radius: 12px; padding: 11px 13px; cursor: pointer; }
.uf-interactive[data-uf-component="lockdown"] .uf-lock__step.is-on { border-color: var(--uf-green-2); background: var(--uf-green-soft); }
.uf-interactive[data-uf-component="lockdown"] .uf-lock__cb { margin-top: 3px; accent-color: var(--uf-green); }
.uf-interactive[data-uf-component="lockdown"] .uf-lock__txt { font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="lockdown"] .uf-lock__txt b { display: block; font: 700 14px var(--uf-sans); color: var(--uf-ink); margin-bottom: 2px; }

/* Civic instruments — ebt_skimmer_guard */
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt { display: grid; gap: 12px; }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__grid { display: grid; gap: 16px; }
@media (min-width: 520px) { .uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__grid { grid-template-columns: 1fr 1fr; } }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__h { margin: 0 0 6px; font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__signs { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__signs li { display: flex; gap: 8px; font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__warn { color: var(--uf-clay); flex: none; }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__sub { margin: 0 0 8px; font: 400 13px var(--uf-serif); color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__field { display: flex; flex-direction: column; gap: 4px; font: 600 12px var(--uf-sans); text-transform: uppercase; letter-spacing: .04em; color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__day { width: 6ch; border: 1px solid var(--uf-line); border-radius: 8px; padding: 6px 8px; font: 600 16px var(--uf-mono); background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__ritual { margin: 10px 0 0; padding: 11px 13px; background: var(--uf-green-soft); border-radius: 10px; font: 400 13.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="ebtarmor"] .uf-ebt__status { margin: 0; font: 400 12px var(--uf-sans); color: var(--uf-ink-3); }

/* situation_analyzer — whole-situation defense triage (Slice 1b). One earned accent. */
.uf-interactive[data-uf-component="situation"] .uf-situation { display: grid; gap: 16px; }
.uf-interactive[data-uf-component="situation"] .uf-situation__lead { margin: 0; font: 600 16px/1.5 var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="situation"] .uf-situation__pastewrap { display: grid; gap: 6px; }
.uf-interactive[data-uf-component="situation"] .uf-situation__paste { width: 100%; box-sizing: border-box; border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink); border-radius: 10px; padding: 8px 10px; font: 400 13.5px/1.45 var(--uf-serif); resize: vertical; }
.uf-interactive[data-uf-component="situation"] .uf-situation__paste:focus { outline: none; border-color: var(--uf-green-2); }
.uf-interactive[data-uf-component="situation"] .uf-situation__intake { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="situation"] .uf-situation__qlabel { display: block; margin: 0 0 6px; font: 600 12px var(--uf-sans); text-transform: uppercase; letter-spacing: .04em; color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="situation"] .uf-situation__opts { display: flex; flex-wrap: wrap; gap: 6px; }
.uf-interactive[data-uf-component="situation"] .uf-situation__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 6px 13px; font: 600 12.5px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="situation"] .uf-situation__chip:hover { border-color: var(--uf-green-2); color: var(--uf-ink); }
.uf-interactive[data-uf-component="situation"] .uf-situation__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="situation"] .uf-situation__plan { display: grid; gap: 10px; }
.uf-interactive[data-uf-component="situation"] .uf-situation__none { margin: 0; color: var(--uf-ink-2); font: 400 14px var(--uf-serif); }
.uf-interactive[data-uf-component="situation"] .uf-situation__card { border: 1px solid var(--uf-line-2); border-radius: 12px; padding: 13px 15px; background: var(--uf-card); }
.uf-interactive[data-uf-component="situation"] .uf-situation__card[data-tier="0"] { border-color: var(--uf-green-2); background: var(--uf-green-soft); }
.uf-interactive[data-uf-component="situation"] .uf-situation__pill { display: inline-block; margin: 0 0 7px; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .05em; border-radius: 999px; padding: 2px 9px; background: var(--uf-paper-2); color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="situation"] .uf-situation__card[data-tier="0"] .uf-situation__pill { background: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="situation"] .uf-situation__title { margin: 0 0 4px; font: 600 15px/1.35 var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="situation"] .uf-situation__why { margin: 0 0 11px; font: 400 14px/1.55 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="situation"] .uf-situation__route { border: 1px solid var(--uf-green); background: var(--uf-green); color: var(--uf-paper); border-radius: 8px; padding: 7px 13px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="situation"] .uf-situation__route:hover { background: var(--uf-green-2); border-color: var(--uf-green-2); }
.uf-interactive[data-uf-component="situation"] .uf-situation__legal { margin: 4px 0 0; padding-top: 12px; border-top: 1px solid var(--uf-line); font: 400 13px/1.55 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="situation"] .uf-situation__legal .uf-situation__route { margin-top: 7px; display: inline-block; }
.uf-interactive[data-uf-component="situation"] .uf-situation__routed { box-shadow: 0 0 0 2px var(--uf-green-2); }

/* --------------------------------------------- CASEWORKER S1: progressive intake
 * Step 0 (shared/public-computer choice) + the size chips + state select that lead
 * the intake. Same covenant: scoped under the component hook, --uf-* tokens only. */
.uf-interactive[data-uf-component="situation"] .uf-situation__progressive { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="situation"] .uf-situation__shared { display: inline-flex; align-items: center; gap: 8px; font: 500 12.5px var(--uf-sans); color: var(--uf-ink-3); cursor: pointer; }
.uf-interactive[data-uf-component="situation"] .uf-situation__sharedbox { accent-color: var(--uf-green); }
.uf-interactive[data-uf-component="situation"] .uf-situation__state { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink); border-radius: 10px; padding: 8px 12px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="situation"] .uf-situation__state:focus { outline: none; border-color: var(--uf-green-2); }

/* ----------------------------------------------- CASEWORKER S1: the Your-Plan panel
 * The honesty-tier BANDS + evidence-forward cards with VISIBLE receipts (a GN1 mirror)
 * the analyzer renders once the reader has answered. No blue as skin: forest is the
 * computed hero, gold (ochre) the cited/official band and the crisis strip; serif for
 * prose, mono for every numeral. --uf-* tokens only, so light/dark flips automatically. */
.uf-interactive[data-uf-component="situation"] .uf-plan { display: grid; gap: 16px; margin-top: 4px; padding-top: 18px; border-top: 2px solid var(--uf-line); }
.uf-interactive[data-uf-component="situation"] .uf-plan__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px; }
.uf-interactive[data-uf-component="situation"] .uf-plan__title { margin: 0; font: 600 19px/1.25 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="situation"] .uf-plan__fresh { margin: 0; font: 500 11.5px var(--uf-sans); color: var(--uf-ink-3); }

/* crisis strip — pinned above the bands; gold "do this first" urgency, never red */
.uf-interactive[data-uf-component="situation"] .uf-plan__crisis { display: grid; gap: 10px; padding: 13px 14px; border: 1px solid var(--uf-ochre-2); border-radius: 12px; background: var(--uf-ochre-soft); }
.uf-interactive[data-uf-component="situation"] .uf-plan__crisis-h { margin: 0; font: 700 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .06em; color: var(--uf-ochre); }

/* the three honesty-tier bands — the visible spine */
.uf-interactive[data-uf-component="situation"] .uf-plan__band { display: grid; gap: 10px; }
.uf-interactive[data-uf-component="situation"] .uf-plan__band-h { margin: 0 0 2px; font: 700 12px var(--uf-sans); text-transform: uppercase; letter-spacing: .05em; color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="situation"] .uf-plan__band[data-band="computed"] .uf-plan__band-h { color: var(--uf-green-2); }
.uf-interactive[data-uf-component="situation"] .uf-plan__more { margin: 0; font: 600 12.5px var(--uf-sans); color: var(--uf-green-2); cursor: default; }

/* a plan card — label + honesty badge, the injected figure, why, and the receipt */
.uf-interactive[data-uf-component="situation"] .uf-plan-card { display: grid; gap: 8px; border: 1px solid var(--uf-line-2); border-radius: 12px; padding: 13px 15px; background: var(--uf-card); }
.uf-interactive[data-uf-component="situation"] .uf-plan-card[data-tier="computed"] { border-color: var(--uf-green-2); }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__label { font: 600 15px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__badge { font: 700 10.5px var(--uf-sans); text-transform: uppercase; letter-spacing: .05em; border-radius: 999px; padding: 3px 9px; background: var(--uf-paper-2); color: var(--uf-ink-3); white-space: nowrap; }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__badge--computed { background: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__badge--cited { background: var(--uf-ochre-soft); color: var(--uf-ochre); }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__figure { margin: 0; }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__amount { font: 600 22px/1.2 var(--uf-mono); color: var(--uf-green); letter-spacing: -.01em; }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__pending { margin: 0; font: 400 13.5px/1.5 var(--uf-serif); font-style: italic; color: var(--uf-ink-2); }

/* the receipt — a GN1 mirror, VISIBLE as a "show the math" disclosure, never buried */
.uf-interactive[data-uf-component="situation"] .uf-plan-card__showmath,
.uf-interactive[data-uf-component="situation"] .uf-plan-why__t { cursor: pointer; font: 600 12px var(--uf-sans); color: var(--uf-green-2); list-style: none; }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__showmath::-webkit-details-marker,
.uf-interactive[data-uf-component="situation"] .uf-plan-why__t::-webkit-details-marker { display: none; }
.uf-interactive[data-uf-component="situation"] .uf-plan-card__showmath::before,
.uf-interactive[data-uf-component="situation"] .uf-plan-why__t::before { content: "\25B8  "; }
.uf-interactive[data-uf-component="situation"] details[open] > .uf-plan-card__showmath::before,
.uf-interactive[data-uf-component="situation"] details[open] > .uf-plan-why__t::before { content: "\25BE  "; }
.uf-interactive[data-uf-component="situation"] .uf-plan-receipt { margin-top: 8px; display: grid; gap: 4px; border-left: 3px solid var(--uf-green-2); padding: 8px 12px; background: var(--uf-paper-2); border-radius: 0 8px 8px 0; }
.uf-interactive[data-uf-component="situation"] .uf-plan-receipt__rule { font: 400 13px/1.5 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="situation"] .uf-plan-receipt__meta { font: 600 11px var(--uf-mono); color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="situation"] .uf-plan-receipt__src { font: 600 12px var(--uf-sans); color: var(--uf-green-2); text-decoration: none; }
.uf-interactive[data-uf-component="situation"] .uf-plan-receipt__src:hover { text-decoration: underline; }

/* why you're seeing this — the reader's own inputs, reflected back (attribution) */
.uf-interactive[data-uf-component="situation"] .uf-plan-why { margin: 0; }
.uf-interactive[data-uf-component="situation"] .uf-plan-why__list { margin: 6px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 5px 12px; }
.uf-interactive[data-uf-component="situation"] .uf-plan-why__list li { font: 500 12px var(--uf-sans); color: var(--uf-ink-2); }

/* provenance strip — quiet footer; proves only what the artifact carries */
.uf-interactive[data-uf-component="situation"] .uf-plan-prov { margin: 4px 0 0; padding-top: 12px; border-top: 1px solid var(--uf-line); font: 500 11px/1.5 var(--uf-mono); color: var(--uf-ink-3); }

/* --------------------------------------------------- psychology instruments
 * The engine-free psychology components (P10–P90) mounted and WORKED but
 * shipped with no stylesheet behind their class names — every instrument
 * rendered as bare unstyled HTML on a live theme (operator-reported on the
 * first psychology article). Same covenant as the rest of this file: scoped
 * under .uf-interactive, --uf-* tokens only, light/dark flip automatically.
 * cinematicpersonality (P99) and mindstory (P80) inject their own scoped
 * style blocks; everything else is styled here. */

/* shared rhythm: every instrument is a quiet grid inside its widget card */
.uf-interactive .uf-sd, .uf-interactive .uf-wd, .uf-interactive .uf-hl,
.uf-interactive .uf-bs, .uf-interactive .uf-fc, .uf-interactive .uf-rl,
.uf-interactive .uf-room, .uf-interactive .uf-ms { display: grid; gap: 14px; }

.uf-interactive .uf-sd__lead, .uf-interactive .uf-wd__intro,
.uf-interactive .uf-hl__intro, .uf-interactive .uf-bs__intro,
.uf-interactive .uf-fc__intro, .uf-interactive .uf-rl__intro,
.uf-interactive .uf-ms__intro { margin: 0; font: 400 16px/1.65 var(--uf-serif); color: var(--uf-ink-2); }

.uf-interactive .uf-wd__lab, .uf-interactive .uf-wd__clab,
.uf-interactive .uf-fc__lab, .uf-interactive .uf-rl__lab,
.uf-interactive .uf-hl__f > span, .uf-interactive .uf-ms__lab
  { display: block; margin: 0 0 6px; font: 600 12px var(--uf-sans); text-transform: uppercase; letter-spacing: .04em; color: var(--uf-ink-3); }

/* reader inputs: the situation-analyzer's input language */
.uf-interactive .uf-sd input[type="number"], .uf-interactive .uf-hl input[type="text"],
.uf-interactive .uf-rl__ta, .uf-interactive .uf-ms__ta
  { width: 100%; box-sizing: border-box; border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink); border-radius: 10px; padding: 8px 10px; font: 400 15px/1.5 var(--uf-sans); }
.uf-interactive .uf-sd input[type="number"]:focus, .uf-interactive .uf-hl input[type="text"]:focus,
.uf-interactive .uf-rl__ta:focus, .uf-interactive .uf-ms__ta:focus { outline: none; border-color: var(--uf-green-2); }
.uf-interactive .uf-rl__ta, .uf-interactive .uf-ms__ta { font-family: var(--uf-serif); resize: vertical; }
.uf-interactive .uf-sd input[type="range"], .uf-interactive .uf-wd input[type="range"],
.uf-interactive .uf-fc input[type="range"] { width: 100%; accent-color: var(--uf-green); }

/* chips: same pill language as the front door */
.uf-interactive .uf-wd__chips, .uf-interactive .uf-rl__chips, .uf-interactive .uf-ms__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.uf-interactive .uf-wd__chip, .uf-interactive .uf-rl__chip, .uf-interactive .uf-ms__chip
  { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 8px 15px; font: 600 13.5px var(--uf-sans); cursor: pointer; }
.uf-interactive .uf-wd__chip:hover, .uf-interactive .uf-rl__chip:hover, .uf-interactive .uf-ms__chip:hover { border-color: var(--uf-green-2); color: var(--uf-ink); }
.uf-interactive .uf-wd__chip.is-on, .uf-interactive .uf-rl__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }

/* verdict / result callouts (client-side reader math lands here) */
.uf-interactive .uf-sd__v, .uf-interactive .uf-wd__v, .uf-interactive .uf-hl__out,
.uf-interactive .uf-bs__fix, .uf-interactive .uf-rl__check, .uf-interactive .uf-ms__res
  { border: 1px solid var(--uf-green-2); background: var(--uf-green-soft); border-radius: 12px; padding: 13px 15px; font: 400 15.5px/1.65 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-sd__v--debt, .uf-interactive .uf-wd__v--carry { border-color: var(--uf-ochre-2); background: var(--uf-ochre-soft); }
.uf-interactive .uf-sd__tip { margin: 9px 0 0; font: 400 14px/1.6 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-fc__note, .uf-interactive .uf-hl__note { margin: 0; font: 400 13.5px/1.55 var(--uf-serif); color: var(--uf-ink-3); }

/* sleep-debt: the week of nights */
.uf-interactive .uf-sd__need { display: flex; align-items: center; gap: 12px; font: 600 14px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive .uf-sd__need strong { font: 700 17px var(--uf-mono); color: var(--uf-green); min-width: 3.2em; text-align: right; }
.uf-interactive .uf-sd__nights { display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: 8px; }
.uf-interactive .uf-sd__day { display: grid; gap: 4px; font: 600 12px var(--uf-sans); text-transform: uppercase; letter-spacing: .04em; color: var(--uf-ink-3); }

/* worry decoder: two sliders and a plan */
.uf-interactive .uf-wd__row { display: grid; gap: 6px; }
.uf-interactive .uf-wd__v--plan { border-color: var(--uf-line-2); background: var(--uf-card); }

/* habit loop: three fields fold into one sentence */
.uf-interactive .uf-hl__f { display: grid; gap: 4px; font: 600 12px var(--uf-sans); text-transform: uppercase; letter-spacing: .04em; color: var(--uf-ink-3); }
.uf-interactive .uf-hl__loop { margin: 0; font: 400 17px/1.65 var(--uf-serif); color: var(--uf-ink); }

/* bias spotter: pressable scenario rows */
.uf-interactive .uf-bs__rows { display: grid; gap: 8px; }
.uf-interactive .uf-bs__row { text-align: left; border: 1px solid var(--uf-line-2); background: var(--uf-card); color: var(--uf-ink); border-radius: 12px; padding: 11px 13px; font: 400 15.5px/1.6 var(--uf-serif); cursor: pointer; }
.uf-interactive .uf-bs__row:hover { border-color: var(--uf-green-2); }
.uf-interactive .uf-bs__row.is-on { border-color: var(--uf-green); background: var(--uf-green-soft); }
.uf-interactive .uf-bs__mark { display: inline-block; margin-right: 8px; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .05em; border-radius: 999px; padding: 2px 9px; background: var(--uf-paper-2); color: var(--uf-ink-3); }

/* focus cost: the switch counter and its two cards */
.uf-interactive .uf-fc__n { margin: 0; font: 700 17px var(--uf-mono); color: var(--uf-green); }
.uf-interactive .uf-fc__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.uf-interactive .uf-fc__card { border: 1px solid var(--uf-line-2); background: var(--uf-card); border-radius: 12px; padding: 13px 15px; font: 400 15px/1.6 var(--uf-serif); color: var(--uf-ink-2); }

/* reframe lab: the example line under the chips */
.uf-interactive .uf-rl__ex { margin: 0; font: 400 14px/1.6 var(--uf-serif); font-style: italic; color: var(--uf-ink-3); }

/* the room: scene stage, timed choices, reveal */
.uf-interactive .uf-room__scene { border: 1px solid var(--uf-line-2); background: var(--uf-card); border-radius: 14px; padding: 18px 20px; display: grid; gap: 12px; }
.uf-interactive .uf-room__kicker { margin: 0; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .08em; color: var(--uf-ink-3); }
.uf-interactive .uf-room__title, .uf-interactive .uf-room__rtitle { margin: 0; font: 600 22px/1.3 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-room__intro, .uf-interactive .uf-room__stext, .uf-interactive .uf-room__lede { margin: 0; font: 400 16px/1.65 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-room__choices, .uf-interactive .uf-room__tiles { display: grid; gap: 8px; }
.uf-interactive .uf-room__choice, .uf-interactive .uf-room__tile { text-align: left; border: 1px solid var(--uf-line-2); background: var(--uf-card); color: var(--uf-ink); border-radius: 12px; padding: 11px 13px; font: 400 15.5px/1.6 var(--uf-serif); cursor: pointer; }
.uf-interactive .uf-room__choice:hover, .uf-interactive .uf-room__tile:hover { border-color: var(--uf-green-2); }
.uf-interactive .uf-room__chint { margin: 0; font: 400 13px/1.55 var(--uf-sans); color: var(--uf-ink-3); }
.uf-interactive .uf-room__start, .uf-interactive .uf-room__again, .uf-interactive .uf-room__restart, .uf-interactive .uf-ms__go
  { justify-self: start; border: 1px solid var(--uf-green); background: var(--uf-green); color: var(--uf-paper); border-radius: 8px; padding: 8px 15px; font: 600 14px var(--uf-sans); cursor: pointer; }
.uf-interactive .uf-room__start:hover, .uf-interactive .uf-room__again:hover, .uf-interactive .uf-room__restart:hover, .uf-interactive .uf-ms__go:hover:not(:disabled)
  { background: var(--uf-green-2); border-color: var(--uf-green-2); }
.uf-interactive .uf-ms__go:disabled { opacity: .45; cursor: default; }
.uf-interactive .uf-room__timerbar, .uf-interactive .uf-room__bar { height: 6px; border-radius: 999px; background: var(--uf-paper-2); overflow: hidden; }
.uf-interactive .uf-room__timerfill, .uf-interactive .uf-room__barfill { height: 100%; background: var(--uf-green); border-radius: 999px; }
.uf-interactive .uf-room__timertxt, .uf-interactive .uf-room__tlabel, .uf-interactive .uf-room__clabel, .uf-interactive .uf-room__revlabel
  { font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .05em; color: var(--uf-ink-3); }
.uf-interactive .uf-room__dots { display: flex; gap: 6px; }
.uf-interactive .uf-room__dot { width: 8px; height: 8px; border-radius: 999px; background: var(--uf-line-2); }
.uf-interactive .uf-room__dot.is-on { background: var(--uf-green); }
/* the scene is a WIDE 640x200 svg (class sits ON the svg) — capping it at 300px
 * rendered the demo's full-bleed atmospheric stage as a small dark box
 * (operator-reported); only the square reveal sigil keeps the 300px cap */
.uf-interactive svg.uf-room__stagesvg { display: block; width: 100%; height: auto; max-width: none; margin: 0 0 6px; border-radius: 14px; }
.uf-interactive .uf-room__sigil { max-width: 300px; margin: 0 auto; }
.uf-interactive .uf-room__sigil svg { display: block; width: 100%; height: auto; }
/* the choice hint is a bare text node after the small-caps label span — inline
 * label rendered as "THE DOORsee the other side" (operator-reported run-on) */
.uf-interactive .uf-room__clabel { display: block; margin-bottom: 4px; }
.uf-interactive .uf-room__revgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.uf-interactive .uf-room__revtext, .uf-interactive .uf-room__body { margin: 0; font: 400 15.5px/1.65 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-room__fine { margin: 0; font: 400 12px/1.5 var(--uf-serif); color: var(--uf-ink-3); }
.uf-interactive .uf-room__spine { border-left: 3px solid var(--uf-green); padding-left: 12px; }
.uf-interactive .uf-room__glyph { font: 700 18px var(--uf-mono); color: var(--uf-green); }

/* mind solver: describe -> steps */
.uf-interactive .uf-ms__title, .uf-interactive .uf-ms__head { margin: 0; font: 600 18px/1.4 var(--uf-sans); color: var(--uf-ink); }
.uf-interactive .uf-ms__sub, .uf-interactive .uf-ms__what, .uf-interactive .uf-ms__reshint { margin: 0; font: 400 14px/1.6 var(--uf-serif); color: var(--uf-ink-3); }
.uf-interactive .uf-ms__steps { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.uf-interactive .uf-ms__step { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--uf-line-2); background: var(--uf-card); border-radius: 12px; padding: 11px 13px; font: 400 15.5px/1.6 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-ms__num { flex: none; width: 24px; height: 24px; border-radius: 999px; background: var(--uf-green); color: var(--uf-paper); font: 700 12px/24px var(--uf-sans); text-align: center; }
.uf-interactive .uf-ms__resgrid { display: grid; gap: 10px; }
.uf-interactive .uf-ms__reslabel { font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .05em; color: var(--uf-ink-3); }
.uf-interactive .uf-ms__miss { border: 1px dashed var(--uf-line-2); border-radius: 12px; padding: 11px 13px; font: 400 15px/1.6 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-ms__human { margin: 0; font: 400 14px/1.6 var(--uf-serif); color: var(--uf-ink-2); }

/* the analyzer's reveal: any instrument addressed by a 'Show me how' route */
.uf-interactive.uf-routed, .uf-interactive.uf-solver--routed { outline: 2px solid var(--uf-green-2); outline-offset: 4px; border-radius: var(--uf-radius, 12px); }

/* ------------------------------------------------- defense_map (MOAT capstone)
 * "Report one number — see what falls." The component shipped with NO styles at
 * all (operator-reported: native buttons + raw inputs on the live theme). Same
 * covenant: scoped, tokens only. */
.uf-interactive .uf-dm { display: grid; gap: 14px; }
.uf-interactive .uf-dm__lead { margin: 0; font: 400 16px/1.65 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-dm__q { display: grid; gap: 8px; }
.uf-interactive .uf-dm__q > span, .uf-interactive .uf-dm__klabel
  { display: block; font: 600 12px var(--uf-sans); text-transform: uppercase; letter-spacing: .04em; color: var(--uf-ink-3); }
.uf-interactive .uf-dm__chips, .uf-interactive .uf-dm__changes { display: flex; flex-wrap: wrap; gap: 6px; }
.uf-interactive .uf-dm__chip, .uf-interactive .uf-dm__change
  { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 8px 15px; font: 600 13.5px var(--uf-sans); cursor: pointer; }
.uf-interactive .uf-dm__chip:hover, .uf-interactive .uf-dm__change:hover { border-color: var(--uf-green-2); color: var(--uf-ink); }
.uf-interactive .uf-dm__chip.is-on, .uf-interactive .uf-dm__change.is-on
  { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive .uf-dm__income { display: flex; flex-wrap: wrap; gap: 12px 16px; font: 600 13px var(--uf-sans); color: var(--uf-ink-2); }
/* each caption sits ABOVE its input: a bare inline label let the two fields wrap
   at different heights (first caption inline-left, second floating over its box) */
.uf-interactive .uf-dm__income label { flex: 1 1 220px; min-width: 0; display: grid; gap: 6px; align-content: start; }
.uf-interactive .uf-dm input[type="number"], .uf-interactive .uf-dm input[type="date"]
  { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink); border-radius: 10px; padding: 10px 12px; font: 400 15px/1.5 var(--uf-sans); width: 100%; box-sizing: border-box; min-width: 0; }
.uf-interactive .uf-dm input:focus { outline: none; border-color: var(--uf-green-2); }
.uf-interactive .uf-dm__when { display: grid; gap: 6px; max-width: 280px; font: 600 13px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive .uf-dm__out { display: grid; gap: 12px; }
.uf-interactive .uf-dm__deltas, .uf-interactive .uf-dm__deadlines, .uf-interactive .uf-dm__linked, .uf-interactive .uf-dm__cantprice
  { border: 1px solid var(--uf-line-2); background: var(--uf-card); border-radius: 12px; padding: 13px 15px; font: 400 15px/1.6 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-dm__deltas { border-color: var(--uf-green-2); background: var(--uf-green-soft); }
/* NOTE: .uf-dm__base and .uf-dm__delta are the two number INPUTS (9J's markup);
   the computed output rows are shared .uf-rrow rows. Earlier rules here styled
   the inputs as if they were output rows (flex row + gray serif), which broke
   the income pair's alignment — the inputs take the shared input rule above. */
.uf-interactive .uf-dm__rule { display: block; font: 400 13.5px/1.55 var(--uf-serif); color: var(--uf-ink-2); margin-top: 6px; }
.uf-interactive .uf-dm__ics
  { justify-self: start; border: 1px solid var(--uf-green); background: var(--uf-green); color: var(--uf-paper); border-radius: 8px; padding: 8px 15px; font: 600 14px var(--uf-sans); cursor: pointer; }
.uf-interactive .uf-dm__ics:hover { background: var(--uf-green-2); border-color: var(--uf-green-2); }

/* ---------------------------------------------------- ask-anything (/ask row)
 * The situated answerer's inline ask box (9G): label + question input + one
 * amber Ask button + the answer/clarify/error lines. Shipped as a GHOST (zero
 * CSS — a native input and native button flush against the card edge). Scoped
 * to the generic ancestor: the block can ride any host component. */
.uf-interactive .uf-ask { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--uf-line); display: grid; gap: 10px; }
.uf-interactive .uf-ask__label { margin: 0; font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive .uf-ask__row { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive .uf-ask__q { flex: 1 1 240px; min-width: 0; border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink); border-radius: 10px; padding: 11px 13px; font: 400 15px/1.4 var(--uf-serif); }
.uf-interactive .uf-ask__q:focus { outline: none; border-color: var(--uf-green); box-shadow: 0 0 0 3px var(--uf-green-soft); }
.uf-interactive .uf-ask__go { border: 0; border-radius: 10px; background: var(--uf-cta); color: var(--uf-paper); font: 700 14px var(--uf-sans); padding: 11px 22px; min-height: 44px; cursor: pointer; }
.uf-interactive .uf-ask__go:hover { background: var(--uf-cta-2); }
.uf-interactive .uf-ask__out { display: grid; gap: 8px; }
.uf-interactive .uf-ask__out:empty { display: none; }
.uf-interactive .uf-ask__a, .uf-interactive .uf-ask__clarify { margin: 0; font: 400 15px/1.65 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-ask__err { margin: 0; font: 400 14.5px/1.6 var(--uf-serif); color: var(--uf-clay); }
.uf-interactive .uf-ask__amount { font: 600 15px var(--uf-mono); color: var(--uf-money-2); }
.uf-interactive .uf-ask__src { margin-left: 6px; font: 600 12px var(--uf-mono); color: var(--uf-trust); text-decoration: underline; text-underline-offset: 2px; }

/* --------------------------------------------------------- the_fork (P95)
 * A replayable counterfactual: a moment forks two ways, the reader walks one,
 * rewinds, walks the other, ends on a side-by-side. Scoped, --uf-* tokens only. */
.uf-interactive .uf-fork { display: grid; gap: 14px; }
.uf-interactive .uf-fork__kicker { margin: 0; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .08em; color: var(--uf-ink-3); }
.uf-interactive .uf-fork__title, .uf-interactive .uf-fork__reflect { margin: 0; font: 600 20px/1.3 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-fork__intro, .uf-interactive .uf-fork__prompt { margin: 0; font: 400 16px/1.65 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-fork__prompt { font-weight: 600; color: var(--uf-ink); }
.uf-interactive .uf-fork__forks { display: grid; gap: 10px; }
@media (min-width: 560px) { .uf-interactive .uf-fork__forks { grid-template-columns: 1fr 1fr; } }
.uf-interactive .uf-fork__fork { text-align: left; display: grid; gap: 4px; border: 1px solid var(--uf-line-2); background: var(--uf-card); color: var(--uf-ink); border-radius: 14px; padding: 15px 17px; cursor: pointer; transition: border-color .15s, background .15s, transform .12s; }
.uf-interactive .uf-fork__fork:hover { border-color: var(--uf-green-2); background: var(--uf-green-soft); transform: translateY(-1px); }
.uf-interactive .uf-fork__flabel { font: 600 15.5px/1.4 var(--uf-sans); }
.uf-interactive .uf-fork__fhint { font: 400 12.5px var(--uf-sans); color: var(--uf-ink-3); text-transform: uppercase; letter-spacing: .04em; }
.uf-interactive .uf-fork__walking { margin: 0; font: 600 13px var(--uf-sans); color: var(--uf-ink-3); }
.uf-interactive .uf-fork__walking strong { color: var(--uf-green); }
.uf-interactive .uf-fork__steps { display: grid; gap: 10px; }
.uf-interactive .uf-fork__step { margin: 0; font: 400 16px/1.6 var(--uf-serif); color: var(--uf-ink-2); border-left: 3px solid var(--uf-line-2); padding-left: 14px; opacity: .55; transition: opacity .3s, border-color .3s; }
.uf-interactive .uf-fork__step.is-now { opacity: 1; border-color: var(--uf-green); color: var(--uf-ink); }
.uf-interactive .uf-fork__act { margin-top: 2px; }
.uf-interactive .uf-fork__go, .uf-interactive .uf-fork__reset { border: 1px solid var(--uf-green); background: var(--uf-green); color: var(--uf-paper); border-radius: 10px; padding: 10px 18px; font: 600 14px var(--uf-sans); cursor: pointer; }
.uf-interactive .uf-fork__go:hover, .uf-interactive .uf-fork__reset:hover { background: var(--uf-green-2); border-color: var(--uf-green-2); }
.uf-interactive .uf-fork__reset { background: transparent; color: var(--uf-green); }
.uf-interactive .uf-fork__cols { display: grid; gap: 12px; }
@media (min-width: 560px) { .uf-interactive .uf-fork__cols { grid-template-columns: 1fr 1fr; } }
.uf-interactive .uf-fork__col { border: 1px solid var(--uf-line-2); background: var(--uf-card); border-radius: 14px; padding: 15px 17px; }
.uf-interactive .uf-fork__clabel { margin: 0 0 6px; font: 600 14px var(--uf-sans); color: var(--uf-green); }
.uf-interactive .uf-fork__cost { margin: 0; font: 400 14.5px/1.6 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-fork__frame { margin: 0; font: 400 15px/1.65 var(--uf-serif); color: var(--uf-ink-2); border-top: 1px solid var(--uf-line); padding-top: 12px; }

/* --------------------------------------------- The Recurrence Atlas (PA5)
 * The honest reward spine: every instrument stamps one cited specimen plate into
 * the reader's on-device field guide. Ghosted plates = the open loop. Scoped,
 * --uf-* tokens only; no points/streak chrome by design. */
.uf-interactive .uf-atlas { display: grid; gap: 12px; }
.uf-interactive .uf-atlas__kicker { margin: 0; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .08em; color: var(--uf-ink-3); }
.uf-interactive .uf-atlas__title { margin: 0; font: 600 22px/1.3 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-atlas__intro { margin: 0; font: 400 15.5px/1.65 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-atlas__progress { margin: 2px 0 0; font: 400 14px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive .uf-atlas__progress strong { font: 700 16px var(--uf-mono); color: var(--uf-green); }
.uf-interactive .uf-atlas__proghint { color: var(--uf-ink-3); }
.uf-interactive .uf-atlas__grid { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.uf-interactive .uf-atlas__plate { border: 1px solid var(--uf-line-2); border-radius: 14px; padding: 13px 14px; background: var(--uf-card); display: grid; gap: 4px; transition: border-color .3s, box-shadow .3s, transform .3s; }
.uf-interactive .uf-atlas__plate.is-ghost { color: var(--uf-ink-3); background: transparent; border-style: dashed; }
.uf-interactive .uf-atlas__plate.is-drawn { animation: ufAtlasDraw .5s ease both; box-shadow: var(--uf-shadow); }
@keyframes ufAtlasDraw { from { opacity: .2; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }
.uf-interactive .uf-atlas__art { width: 100%; max-width: 96px; margin: 0 auto 2px; }
.uf-interactive .uf-atlas__art svg { display: block; width: 100%; height: auto; }
.uf-interactive .uf-atlas__label { margin: 0; font: 600 14px/1.35 var(--uf-sans); color: var(--uf-ink); }
.uf-interactive .uf-atlas__plate.is-ghost .uf-atlas__label { color: var(--uf-ink-3); }
.uf-interactive .uf-atlas__band { margin: 0; font: 400 13px/1.5 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-atlas__ghosthint { margin: 0; font: 400 12px/1.45 var(--uf-sans); color: var(--uf-ink-3); }
.uf-interactive .uf-atlas__fig { margin: 4px 0 0; font: 400 12.5px/1.4 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-atlas__figval { font-family: var(--uf-mono); color: var(--uf-green); font-weight: 600; }
.uf-interactive .uf-atlas__src { font: 600 11px var(--uf-mono); color: var(--uf-ochre-2); text-decoration: none; letter-spacing: .02em; }
.uf-interactive a.uf-atlas__src:hover { text-decoration: underline; }
.uf-interactive .uf-atlas__foot { margin: 6px 0 0; font: 400 12.5px/1.5 var(--uf-serif); color: var(--uf-ink-3); }
.uf-interactive .uf-atlas__clear { border: 1px solid var(--uf-line); background: transparent; color: var(--uf-ink-3); border-radius: 8px; padding: 7px 13px; font: 600 12.5px var(--uf-sans); cursor: pointer; }
.uf-interactive .uf-atlas__clear:hover { border-color: var(--uf-line-2); color: var(--uf-ink-2); }

/* ------------------------------------------------------ The Rep Curve (P96)
 * Visible mastery: practice a reframe a few times, watch your own learning curve
 * draw itself. Scoped, --uf-* tokens only. */
.uf-interactive .uf-rep { display: grid; gap: 12px; }
.uf-interactive .uf-rep__kicker { margin: 0; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .08em; color: var(--uf-ink-3); }
.uf-interactive .uf-rep__title { margin: 0; font: 600 20px/1.3 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-rep__intro { margin: 0; font: 400 15.5px/1.65 var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive .uf-rep__rep { display: grid; gap: 8px; border: 1px solid var(--uf-line-2); border-radius: 14px; padding: 15px 16px; background: var(--uf-card); }
.uf-interactive .uf-rep__repno { margin: 0; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .05em; color: var(--uf-ink-3); }
.uf-interactive .uf-rep__thought { margin: 0 0 4px; font: 500 18px/1.5 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-rep__q { display: block; font: 600 12.5px var(--uf-sans); color: var(--uf-ink-2); margin-top: 4px; }
.uf-interactive .uf-rep__slrow { display: flex; align-items: center; gap: 12px; }
.uf-interactive .uf-rep__slider { flex: 1; accent-color: var(--uf-green); }
.uf-interactive .uf-rep__out { font: 700 15px var(--uf-mono); color: var(--uf-green); min-width: 3.2em; text-align: right; }
.uf-interactive .uf-rep__ta { width: 100%; box-sizing: border-box; border: 1px solid var(--uf-line); background: var(--uf-paper); color: var(--uf-ink); border-radius: 10px; padding: 9px 11px; font: 400 15px/1.55 var(--uf-serif); resize: vertical; min-height: 2.6em; }
.uf-interactive .uf-rep__ta:focus { outline: none; border-color: var(--uf-green-2); }
.uf-interactive .uf-rep__act { margin-top: 4px; display: flex; gap: 8px; flex-wrap: wrap; }
.uf-interactive .uf-rep__go, .uf-interactive .uf-rep__more { border: 1px solid var(--uf-green); background: var(--uf-green); color: var(--uf-paper); border-radius: 10px; padding: 9px 16px; font: 600 14px var(--uf-sans); cursor: pointer; }
.uf-interactive .uf-rep__go[disabled] { opacity: .4; cursor: default; }
.uf-interactive .uf-rep__go:hover:not([disabled]), .uf-interactive .uf-rep__more:hover { background: var(--uf-green-2); border-color: var(--uf-green-2); }
.uf-interactive .uf-rep__reset { border: 1px solid var(--uf-line); background: transparent; color: var(--uf-ink-3); border-radius: 10px; padding: 9px 14px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive .uf-rep__curve { border: 1px solid var(--uf-line-2); border-radius: 14px; padding: 14px 16px; background: var(--uf-card); }
.uf-interactive .uf-rep__curvelab { margin: 0 0 6px; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .05em; color: var(--uf-ink-3); }
.uf-interactive .uf-rep__curvesvg { display: block; width: 100%; height: auto; }
.uf-interactive .uf-rep__trend { margin: 8px 0 0; font: 400 15px/1.6 var(--uf-serif); color: var(--uf-ink); }
.uf-interactive .uf-rep__reflect { margin: 8px 0 0; font: 400 14.5px/1.6 var(--uf-serif); color: var(--uf-ink-2); border-top: 1px solid var(--uf-line); padding-top: 10px; }

/* --------------------------------------- psychology instruments: LARGER TYPE
 * A calmer read means a bigger read. This overlay lifts every psychology-instrument
 * font one comfortable step (~+2px on body, proportional on labels, numbers, headings)
 * WITHOUT touching the original rules — line-heights are unitless ratios, so they scale
 * cleanly. Scoped to the psych class prefixes only (never .uf-dm, the benefits defense
 * map). Same-specificity + later source order = these win. */
.uf-interactive :is(.uf-sd__lead, .uf-wd__intro, .uf-hl__intro, .uf-bs__intro,
  .uf-fc__intro, .uf-rl__intro, .uf-ms__intro, .uf-room__intro, .uf-room__stext,
  .uf-room__lede, .uf-fork__intro, .uf-fork__prompt, .uf-fork__step) { font-size: 18px; }
.uf-interactive :is(.uf-sd__v, .uf-wd__v, .uf-hl__out, .uf-bs__fix, .uf-rl__check,
  .uf-ms__res, .uf-bs__row, .uf-fc__card, .uf-room__choice, .uf-room__tile,
  .uf-room__revtext, .uf-room__body, .uf-ms__step, .uf-ms__miss, .uf-atlas__intro,
  .uf-rep__intro, .uf-rep__ta, .uf-rep__trend, .uf-fork__frame,
  .uf-sd input[type="number"], .uf-hl input[type="text"], .uf-rl__ta, .uf-ms__ta) { font-size: 17px; }
.uf-interactive :is(.uf-wd__chip, .uf-rl__chip, .uf-ms__chip) { font-size: 14.5px; }
.uf-interactive :is(.uf-room__start, .uf-room__again, .uf-room__restart, .uf-ms__go,
  .uf-fork__go, .uf-fork__reset, .uf-rep__go, .uf-rep__more) { font-size: 15.5px; }
.uf-interactive :is(.uf-wd__lab, .uf-wd__clab, .uf-fc__lab, .uf-rl__lab, .uf-ms__lab,
  .uf-hl__f, .uf-hl__f > span, .uf-sd__day) { font-size: 13px; }
.uf-interactive :is(.uf-fc__note, .uf-hl__note, .uf-rl__ex, .uf-room__chint, .uf-sd__tip,
  .uf-atlas__band, .uf-ms__sub, .uf-ms__what, .uf-ms__reshint, .uf-fork__cost) { font-size: 14.5px; }
.uf-interactive :is(.uf-sd__need, .uf-sd__need strong, .uf-fc__n) { font-size: 20px; }
.uf-interactive .uf-hl__loop { font-size: 19px; }
.uf-interactive .uf-rep__thought { font-size: 20px; }
.uf-interactive :is(.uf-room__title, .uf-room__rtitle, .uf-atlas__title) { font-size: 24px; }
.uf-interactive :is(.uf-ms__title, .uf-ms__head) { font-size: 20px; }
.uf-interactive :is(.uf-fork__title, .uf-fork__reflect, .uf-rep__title) { font-size: 22px; }


/* ========================================================= POSTERS (C6)
 * Controls on the white field: forest outlines, solid-forest selection,
 * one solid CTA. Press physics kept; every glow deleted.
 */
.uf-interactive button {
  appearance: none;
  font-family: var(--uf-sans);
  cursor: pointer;
  transition: transform .12s var(--uf-ease), background .15s, border-color .15s, color .15s, box-shadow .15s;
}
.uf-interactive :is(.uf-chip, .uf-pt, .uf-ev, .uf-reason, .uf-psz, .uf-lg,
                    .uf-item, .uf-dopt, .uf-situation__chip) {
  background: var(--uf-ctl-bg);
  border: 1.5px solid var(--uf-ctl-line);
  color: var(--uf-ctl-ink);
  box-shadow: none;
  min-height: 44px;
}
.uf-interactive :is(.uf-chip, .uf-pt, .uf-ev, .uf-reason, .uf-psz, .uf-lg,
                    .uf-item, .uf-dopt, .uf-situation__chip):hover {
  border-color: var(--uf-act);
  color: var(--uf-ctl-ink);
}
.uf-interactive :is(.uf-chip, .uf-pt, .uf-psz, .uf-lg).on,
.uf-interactive .uf-situation__chip.is-on,
.uf-interactive .uf-item.on,
.uf-interactive .uf-ev.on {
  background: var(--uf-act);
  border-color: var(--uf-act);
  color: var(--uf-paper);
  box-shadow: none;
}
.uf-interactive button:active { transform: scale(.97); }
.uf-interactive .uf-trybtn {
  background: var(--uf-cta);
  color: var(--uf-paper);
  border: 0;
  border-radius: 10px;
  font: 700 14px/1 var(--uf-sans);
  padding: 14px 22px;
  min-height: 48px;
  box-shadow: none;
}
@media (max-width: 560px) {
  .uf-interactive .uf-trybtn { display: block; width: 100%; }
}
.uf-interactive .uf-trybtn:hover { background: var(--uf-cta-2); transform: none; filter: none; box-shadow: none; }
.uf-interactive .uf-trybtn:active { transform: scale(.98); }
.uf-interactive[data-uf-component="situation"] .uf-situation__route { background: var(--uf-cta); border-color: var(--uf-cta); color: var(--uf-paper); box-shadow: none; }
.uf-interactive[data-uf-component="situation"] .uf-situation__route:hover { background: var(--uf-cta-2); border-color: var(--uf-cta-2); }
.uf-interactive[data-uf-component="situation"] .uf-situation__routed { box-shadow: 0 0 0 2px var(--uf-money); }
.uf-interactive[data-uf-component="story"] .uf-story__chip.is-on { background: var(--uf-act); border-color: var(--uf-act); color: var(--uf-paper); }
.uf-interactive input[type="range"] { accent-color: var(--uf-act); }
.uf-interactive .uf-prize__big .n { color: var(--uf-money-2); filter: none; }

/* prize board — ADR-0045 route variant: the big slot prints NO number (the SNAP
   figure routes to the live calculator), so the .n/.l pair sits INSIDE the amber
   .uf-trybtn. Without this scope the pair inherits the number face (64px serif
   .n, 22ch-clamped .l) and the pair collides with the button edges. Lay the
   button out as a full-width poster CTA: bold label, soft explainer below,
   generous padding — nothing touches the button edge. */
.uf-interactive .uf-prize__big--route { display: block; }
.uf-interactive .uf-prize__big--route .uf-trybtn {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  width: 100%; text-align: left; padding: 20px 24px; border-radius: 14px;
}
.uf-interactive .uf-prize__big--route .n {
  font: 700 clamp(19px, 3.2vw, 25px)/1.2 var(--uf-sans);
  color: var(--uf-paper); filter: none;
}
.uf-interactive .uf-prize__big--route .l {
  font: 400 14.5px/1.5 var(--uf-sans); color: var(--uf-paper);
  opacity: .85; max-width: 58ch;
}

/* THE ANSWER: the verdict is the white field itself — one line, one number. */
.uf-interactive .uf-calc__verdict {
  position: relative;
  text-align: left;
  border: 0;
  border-radius: 0;
  padding: 14px 0 4px;
  background: transparent;
  overflow: visible;
  box-shadow: none;
}
.uf-interactive .uf-calc__vtop { justify-content: flex-start; }
.uf-interactive .uf-calc__vicon { display: none; }
.uf-interactive .uf-calc__vtext {
  font: 400 16px/1.4 var(--uf-serif);
  text-transform: none;
  letter-spacing: 0;
  color: var(--uf-answer-mut);
  text-shadow: none;
}
.uf-interactive .uf-calc__verdict.is-no .uf-calc__vtext { color: var(--uf-coral); }
.uf-interactive .uf-calc__verdict .uf-calc__big {
  color: var(--uf-answer);
  font-size: clamp(64px, 11vw, 120px);
  line-height: .95;
  letter-spacing: -.035em;
  margin-top: 4px;
  filter: none;
}
.uf-interactive .uf-calc__verdict .uf-calc__per { color: var(--uf-money); font-size: 18px; }
.uf-interactive .uf-calc__verdict.is-no .uf-calc__big { color: var(--uf-coral); }

.uf-interactive :is(input, select, textarea):focus-visible {
  outline: 2px solid var(--uf-ring);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .uf-interactive button { transition: none; }
  .uf-interactive button:active { transform: none; }
}

/* ==================================================== POSTER CINEMA (C7)
 * The answer arc, in beats: line -> number (with a breath of overshoot) ->
 * the amber CTA last (peak-end). Chips arrive as one quiet group.
 */
@media (prefers-reduced-motion: no-preference) {
  html.uf-io .uf-interactive.uf-in :is(.uf-grid, .uf-story__chips, .uf-situation__opts) { animation: uf-beat-in .45s var(--uf-ease) .1s both; }
  html.uf-io .uf-interactive.uf-in .uf-calc__vtext { animation: uf-beat-in .4s var(--uf-ease) .18s both; }
  html.uf-io .uf-interactive.uf-in .uf-calc__verdict .uf-calc__big { animation: uf-star-in .65s var(--uf-ease) .32s both; }
  html.uf-io .uf-interactive.uf-in .uf-trybtn { animation: uf-beat-in .45s var(--uf-ease) .58s both; }
}

/* uf-scheme-pinned: start — DUSK/DAWN FAMILY: seed, stranger, echo and the
   unfinished sentence carry a self-contained dusk/dawn palette, independent of
   the site theme, so the owner-approved mood holds in light + dark. */
/* ======================================== The Stranger Was You — DUSK -> DAWN
 * The owner-approved look ("the night ends"): the SEED is a warm cream letter you
 * write tonight; the RETURN comes back on a COLD dusk card as a stranger's; on the
 * reveal, DAWN BREAKS — the card warms to cream, a horizon glow rises, and the
 * belief bars glow. Self-contained dusk/dawn palette (independent of the site theme
 * so the mood holds in light + dark); uses the connector's serif/sans faces. */
.uf-interactive .uf-seed {
  --sd-cream:#FBF3E7; --sd-ink:#33263A; --sd-mut:#9A8794; --sd-amber:#E89B5B; --sd-gold:#F1C079; --sd-rose:#D9787A;
  position: relative; overflow: hidden; display: grid; gap: 14px;
  background: var(--sd-cream); color: var(--sd-ink); border-radius: 18px; padding: 24px 26px;
  box-shadow: 0 24px 60px -30px rgba(30,16,44,.5), inset 0 1px 0 rgba(255,255,255,.6); border: 1px solid rgba(51,38,58,.06); }
.uf-interactive .uf-seed::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 90px; pointer-events: none;
  background: radial-gradient(120% 100% at 50% -30%, rgba(241,192,121,.3), transparent 70%); }
.uf-interactive .uf-seed > * { position: relative; }
.uf-interactive .uf-seed__kicker { margin: 0; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .24em; color: var(--sd-amber); }
.uf-interactive .uf-seed__title { margin: 0; font: 500 22px/1.25 var(--uf-serif); color: var(--sd-ink); }
.uf-interactive .uf-seed__form { display: grid; gap: 12px; }
.uf-interactive .uf-seed__intro { margin: 0; font: 400 17px/1.55 var(--uf-serif); color: var(--sd-ink); }
.uf-interactive .uf-seed__q { display: block; font: 600 12.5px var(--uf-sans); color: var(--sd-mut); }
.uf-interactive .uf-seed__ta { width: 100%; box-sizing: border-box; border: 1px solid rgba(51,38,58,.14); background: rgba(255,255,255,.5); color: var(--sd-ink); border-radius: 12px; padding: 12px 14px; font: 400 18px/1.55 var(--uf-serif); resize: vertical; min-height: 3.2em; }
.uf-interactive .uf-seed__ta::placeholder { color: var(--sd-mut); font-style: italic; }
.uf-interactive .uf-seed__ta:focus { outline: none; border-color: var(--sd-amber); box-shadow: 0 0 0 3px rgba(232,155,91,.16); background: #fff; }
.uf-interactive .uf-seed__slrow { display: flex; align-items: center; gap: 12px; }
.uf-interactive .uf-seed__slend { font: 400 12px var(--uf-sans); color: var(--sd-mut); white-space: nowrap; }
.uf-interactive .uf-seed__slider { flex: 1; accent-color: var(--sd-amber); }
.uf-interactive .uf-seed__act { margin-top: 2px; }
.uf-interactive .uf-seed__go { border: 0; background: var(--sd-ink); color: var(--sd-cream); border-radius: 100px; padding: 11px 20px; font: 600 12.5px var(--uf-sans); letter-spacing: .06em; cursor: pointer; transition: transform .2s, box-shadow .2s; }
.uf-interactive .uf-seed__go[disabled] { opacity: .4; cursor: default; }
.uf-interactive .uf-seed__go:hover:not([disabled]) { transform: translateY(-1px); box-shadow: 0 12px 26px -12px rgba(51,38,58,.6); }
.uf-interactive .uf-seed__sealed { display: flex; gap: 14px; align-items: flex-start; border-radius: 14px; padding: 14px 16px; background: rgba(232,155,91,.1); border: 1px solid rgba(232,155,91,.28); }
.uf-interactive .uf-seed__wax { flex: none; font-size: 22px; line-height: 1.1; color: var(--sd-rose); }
.uf-interactive .uf-seed__sealbody { display: grid; gap: 4px; }
.uf-interactive .uf-seed__sealttl { margin: 0; font: 600 14px var(--uf-sans); color: var(--sd-ink); }
.uf-interactive .uf-seed__sealtext { margin: 0; font: 400 15px/1.6 var(--uf-serif); color: var(--sd-ink); }
.uf-interactive .uf-seed__edit { justify-self: start; border: 0; background: transparent; color: var(--sd-amber); font: 600 12px var(--uf-sans); cursor: pointer; padding: 2px 0; text-decoration: underline; }
.uf-interactive .uf-seed__edit:hover { color: var(--sd-rose); }

.uf-interactive .uf-stranger {
  --sd-cream:#FBF3E7; --sd-ink:#33263A; --sd-mut:#9A8794; --sd-amber:#E89B5B; --sd-gold:#F1C079; --sd-rose:#D9787A;
  --sd-dusk-ink:#DAD4E6; --sd-dusk-mut:#8E88A8;
  position: relative; overflow: hidden; display: grid; gap: 12px; border-radius: 18px; padding: 24px 26px; }
.uf-interactive .uf-stranger.is-dusk { background: linear-gradient(180deg,#1B1436,#2A2049); color: var(--sd-dusk-ink);
  box-shadow: 0 26px 70px -34px rgba(8,6,20,.85), inset 0 1px 0 rgba(255,255,255,.06); }
.uf-interactive .uf-stranger.is-dawn { background: var(--sd-cream); color: var(--sd-ink);
  box-shadow: 0 26px 90px -30px rgba(240,150,90,.5), inset 0 1px 0 rgba(255,255,255,.6);
  animation: ufDawn 1.5s cubic-bezier(.2,.7,.2,1) both; }
@keyframes ufDawn { 0% { background: #241A40; } 100% { background: var(--sd-cream); } }
.uf-interactive .uf-stranger.is-dawn::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 62%; pointer-events: none;
  background: radial-gradient(120% 100% at 50% 135%, rgba(241,192,121,.42), rgba(217,120,122,.14) 45%, transparent 72%);
  animation: ufDawnGlow 1.7s ease both; }
@keyframes ufDawnGlow { from { opacity: 0; transform: translateY(22%); } to { opacity: 1; transform: none; } }
.uf-interactive .uf-stranger > * { position: relative; }
.uf-interactive .uf-stranger__kicker { margin: 0; font: 600 11px var(--uf-sans); text-transform: uppercase; letter-spacing: .24em; color: var(--sd-dusk-mut); }
.uf-interactive .uf-stranger.is-dawn .uf-stranger__kicker { color: var(--sd-amber); }
.uf-interactive .uf-stranger__quote { margin: 0; display: grid; gap: 8px; }
.uf-interactive .uf-stranger__quotetext { margin: 0; font: 400 21px/1.5 var(--uf-serif); color: inherit; }
.uf-interactive .uf-stranger__attrib { margin: 0; font: 600 11.5px var(--uf-sans); text-transform: uppercase; letter-spacing: .14em; color: var(--sd-dusk-mut); }
.uf-interactive .uf-stranger.is-dawn .uf-stranger__attrib { color: var(--sd-amber); }
.uf-interactive .uf-stranger__q { display: block; font: 600 12.5px var(--uf-sans); color: var(--sd-dusk-mut); }
.uf-interactive .uf-stranger__slrow { display: flex; align-items: center; gap: 12px; }
.uf-interactive .uf-stranger__slend { font: 400 12px var(--uf-sans); color: var(--sd-dusk-mut); white-space: nowrap; }
.uf-interactive .uf-stranger__slider { flex: 1; accent-color: #93A7D8; }
.uf-interactive .uf-stranger__act { margin-top: 2px; }
.uf-interactive .uf-stranger__go { border: 1px solid rgba(218,212,230,.4); background: rgba(255,255,255,.06); color: var(--sd-dusk-ink); border-radius: 100px; padding: 11px 20px; font: 600 12.5px var(--uf-sans); letter-spacing: .06em; cursor: pointer; transition: background .2s; }
.uf-interactive .uf-stranger__go:hover { background: rgba(255,255,255,.13); }
.uf-interactive .uf-stranger__reveal { margin: 8px 0 2px; font: 500 clamp(22px,4.4vw,30px)/1.12 var(--uf-serif); color: var(--sd-ink); text-align: center;
  animation: ufStrangerReveal .95s cubic-bezier(.2,.7,.2,1) both; }
@keyframes ufStrangerReveal { from { opacity: 0; transform: scale(.94); filter: blur(4px); } to { opacity: 1; transform: none; filter: blur(0); } }
.uf-interactive .uf-stranger__bars { display: grid; gap: 11px; max-width: 400px; margin: 14px auto 6px; }
.uf-interactive .uf-stranger__bl { display: flex; justify-content: space-between; font: 600 12px var(--uf-sans); color: var(--sd-mut); margin-bottom: 6px; }
.uf-interactive .uf-stranger__bl b { color: var(--sd-ink); }
.uf-interactive .uf-stranger__tr { height: 8px; border-radius: 8px; background: rgba(51,38,58,.1); overflow: hidden; }
.uf-interactive .uf-stranger__fl { display: block; height: 8px; border-radius: 8px; background: rgba(51,38,58,.24); animation: ufBarGrow 1.2s cubic-bezier(.2,.7,.2,1) both; }
.uf-interactive .uf-stranger__bar.is-str .uf-stranger__fl { background: linear-gradient(90deg,var(--sd-amber),var(--sd-gold)); box-shadow: 0 0 14px rgba(241,192,121,.6); }
@keyframes ufBarGrow { from { width: 0; } }
.uf-interactive .uf-stranger__delta { margin: 6px 0 0; font: 400 16px/1.6 var(--uf-serif); color: var(--sd-mut); text-align: center; }
.uf-interactive .uf-stranger__cite { margin: 8px 0 0; font: 400 15px/1.65 var(--uf-serif); color: var(--sd-mut); text-align: center; }
.uf-interactive .uf-stranger__reset { justify-self: center; margin-top: 10px; border: 0; background: transparent; color: var(--sd-amber); font: 600 12px var(--uf-sans); letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
@media (prefers-reduced-motion: reduce) {
  .uf-interactive .uf-stranger.is-dawn, .uf-interactive .uf-stranger.is-dawn::before,
  .uf-interactive .uf-stranger__reveal, .uf-interactive .uf-stranger__fl { animation: none !important; } }

/* ------------------------------------------------ Echo (P30) — dusk/dawn family
 * The trust card: a warm cream surface, the reader's own words read back as gauges
 * (a moving dot, never a score). Nothing is uploaded — the privacy line is styled to
 * reassure. Self-contained dusk/dawn palette; uses the connector's serif/sans. */
.uf-interactive .uf-echo {
  --sd-cream:#FBF3E7; --sd-ink:#33263A; --sd-mut:#9A8794; --sd-amber:#E89B5B; --sd-gold:#F1C079; --sd-rose:#D9787A;
  position: relative; overflow: hidden; display: grid; gap: 14px; background: var(--sd-cream); color: var(--sd-ink);
  border-radius: 18px; padding: 24px 26px; box-shadow: 0 24px 60px -30px rgba(30,16,44,.5), inset 0 1px 0 rgba(255,255,255,.6); border: 1px solid rgba(51,38,58,.06); }
.uf-interactive .uf-echo::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 90px; pointer-events: none; background: radial-gradient(120% 100% at 50% -30%, rgba(241,192,121,.28), transparent 70%); }
.uf-interactive .uf-echo > * { position: relative; }
.uf-interactive .uf-echo__kicker { margin: 0; font: 600 11px var(--uf-sans); letter-spacing: .24em; text-transform: uppercase; color: var(--sd-amber); }
.uf-interactive .uf-echo__intro { margin: 0; font: 400 16px/1.6 var(--uf-serif); color: var(--sd-ink); }
.uf-interactive .uf-echo__form { display: grid; gap: 12px; }
.uf-interactive .uf-echo__q { display: block; font: 500 17px/1.5 var(--uf-serif); color: var(--sd-ink); }
.uf-interactive .uf-echo__ta { width: 100%; box-sizing: border-box; border: 1px solid rgba(51,38,58,.14); background: rgba(255,255,255,.5); color: var(--sd-ink); border-radius: 12px; padding: 12px 14px; font: 400 17px/1.6 var(--uf-serif); resize: vertical; min-height: 5em; }
.uf-interactive .uf-echo__ta::placeholder { color: var(--sd-mut); font-style: italic; }
.uf-interactive .uf-echo__ta:focus { outline: none; border-color: var(--sd-amber); box-shadow: 0 0 0 3px rgba(232,155,91,.16); background: #fff; }
.uf-interactive .uf-echo__act { display: flex; align-items: center; gap: 12px; }
.uf-interactive .uf-echo__go { border: 0; background: var(--sd-ink); color: var(--sd-cream); border-radius: 100px; padding: 11px 20px; font: 600 12.5px var(--uf-sans); letter-spacing: .06em; cursor: pointer; transition: transform .2s, box-shadow .2s; }
.uf-interactive .uf-echo__go[disabled] { opacity: .4; cursor: default; }
.uf-interactive .uf-echo__go:hover:not([disabled]) { transform: translateY(-1px); box-shadow: 0 12px 26px -12px rgba(51,38,58,.6); }
.uf-interactive .uf-echo__hint { font: 400 12.5px var(--uf-sans); color: var(--sd-mut); font-style: italic; }
.uf-interactive .uf-echo__out { display: grid; gap: 16px; animation: ufEchoIn .7s ease both; }
@keyframes ufEchoIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.uf-interactive .uf-echo__lead { margin: 0; font: 600 11px var(--uf-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--sd-mut); }
.uf-interactive .uf-echo__g { display: grid; gap: 7px; }
.uf-interactive .uf-echo__glab { margin: 0; font: 600 13px var(--uf-sans); color: var(--sd-ink); }
.uf-interactive .uf-echo__track { position: relative; height: 6px; border-radius: 6px; background: linear-gradient(90deg, rgba(51,38,58,.1), rgba(232,155,91,.24)); }
.uf-interactive .uf-echo__dot { position: absolute; top: 50%; width: 16px; height: 16px; border-radius: 50%; background: linear-gradient(140deg,var(--sd-amber),var(--sd-gold)); box-shadow: 0 0 0 4px rgba(232,155,91,.18), 0 2px 6px rgba(0,0,0,.2); transform: translate(-50%,-50%); }
.uf-interactive .uf-echo__ends { display: flex; justify-content: space-between; font: 400 11.5px var(--uf-sans); color: var(--sd-mut); }
.uf-interactive .uf-echo__read { margin: 4px 0 0; font: 400 17px/1.6 var(--uf-serif); color: var(--sd-ink); }
.uf-interactive .uf-echo__privacy { margin: 0; font: 400 13px/1.55 var(--uf-sans); color: var(--sd-mut); background: rgba(232,155,91,.1); border-radius: 10px; padding: 10px 12px; }
.uf-interactive .uf-echo__again { justify-self: start; border: 0; background: transparent; color: var(--sd-amber); font: 600 12px var(--uf-sans); letter-spacing: .06em; cursor: pointer; text-decoration: underline; }
.uf-interactive .uf-echo__again:hover { color: var(--sd-rose); }
@media (prefers-reduced-motion: reduce) { .uf-interactive .uf-echo__out { animation: none; } }

/* --------------------------------- The Unfinished Sentence (P31) — dusk/dawn family
 * A warm cream card: one sentence about the reader's mind grows, blank by blank, into
 * a field note in their words. The blinking blank pulls the eye. Scoped. */
.uf-interactive .uf-unf {
  --sd-cream:#FBF3E7; --sd-ink:#33263A; --sd-mut:#9A8794; --sd-amber:#E89B5B; --sd-gold:#F1C079; --sd-rose:#D9787A;
  position: relative; overflow: hidden; display: grid; gap: 16px; background: var(--sd-cream); color: var(--sd-ink);
  border-radius: 18px; padding: 24px 26px; box-shadow: 0 24px 60px -30px rgba(30,16,44,.5), inset 0 1px 0 rgba(255,255,255,.6); border: 1px solid rgba(51,38,58,.06); }
.uf-interactive .uf-unf::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 90px; pointer-events: none; background: radial-gradient(120% 100% at 50% -30%, rgba(241,192,121,.28), transparent 70%); }
.uf-interactive .uf-unf > * { position: relative; }
.uf-interactive .uf-unf__kicker { margin: 0; font: 600 11px var(--uf-sans); letter-spacing: .24em; text-transform: uppercase; color: var(--sd-amber); }
.uf-interactive .uf-unf__intro { margin: 0; font: 400 15.5px/1.6 var(--uf-serif); color: var(--sd-mut); }
.uf-interactive .uf-unf__sentence { margin: 4px 0; font: 400 clamp(19px,3vw,23px)/1.55 var(--uf-serif); color: var(--sd-ink); }
.uf-interactive .uf-unf__was { color: var(--sd-ink); }
.uf-interactive .uf-unf__pick { color: var(--sd-rose); font-style: italic; }
.uf-interactive .uf-unf__lead { color: var(--sd-ink); }
.uf-interactive .uf-unf__blank { display: inline-block; width: 1.6em; height: 1.1em; vertical-align: -0.15em; border-bottom: 2px solid var(--sd-amber); margin-left: 2px; animation: ufUnfBlink 1.15s steps(1) infinite; }
@keyframes ufUnfBlink { 0%,55% { border-color: var(--sd-amber); } 56%,100% { border-color: rgba(232,155,91,.25); } }
.uf-interactive .uf-unf__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive .uf-unf__chip { border: 1px solid rgba(51,38,58,.16); background: rgba(255,255,255,.45); color: var(--sd-ink); border-radius: 100px; padding: 9px 15px; font: 400 15px var(--uf-serif); cursor: pointer; transition: .18s; }
.uf-interactive .uf-unf__chip:hover { border-color: var(--sd-amber); background: rgba(232,155,91,.12); transform: translateY(-1px); }
.uf-interactive .uf-unf__ownrow { display: flex; gap: 8px; align-items: center; }
.uf-interactive .uf-unf__own { flex: 1; min-width: 0; border: 1px solid rgba(51,38,58,.14); background: rgba(255,255,255,.5); color: var(--sd-ink); border-radius: 10px; padding: 10px 12px; font: 400 15px var(--uf-serif); outline: none; }
.uf-interactive .uf-unf__own::placeholder { color: var(--sd-mut); font-style: italic; }
.uf-interactive .uf-unf__own:focus { border-color: var(--sd-amber); box-shadow: 0 0 0 3px rgba(232,155,91,.16); background: #fff; }
.uf-interactive .uf-unf__use { flex: none; border: 0; background: var(--sd-ink); color: var(--sd-cream); border-radius: 100px; padding: 10px 18px; font: 600 12.5px var(--uf-sans); letter-spacing: .04em; cursor: pointer; }
.uf-interactive .uf-unf__use[disabled] { opacity: .35; cursor: default; }
.uf-interactive .uf-unf__donekick { margin: 0; font: 600 11px var(--uf-sans); letter-spacing: .24em; text-transform: uppercase; color: var(--sd-amber); }
.uf-interactive .uf-unf__donelead { margin: 0; font: 400 14px var(--uf-sans); color: var(--sd-mut); }
.uf-interactive .uf-unf__note { margin: 0; font: 400 clamp(19px,3vw,23px)/1.6 var(--uf-serif); color: var(--sd-ink); background: rgba(232,155,91,.09); border-radius: 14px; padding: 18px 20px; animation: ufUnfNote .8s cubic-bezier(.2,.7,.2,1) both; }
.uf-interactive .uf-unf__note em { color: var(--sd-rose); font-style: italic; }
@keyframes ufUnfNote { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.uf-interactive .uf-unf__again { justify-self: start; border: 0; background: transparent; color: var(--sd-amber); font: 600 12px var(--uf-sans); letter-spacing: .06em; cursor: pointer; text-decoration: underline; }
.uf-interactive .uf-unf__again:hover { color: var(--sd-rose); }
@media (prefers-reduced-motion: reduce) { .uf-interactive .uf-unf__blank, .uf-interactive .uf-unf__note { animation: none; } }
/* uf-scheme-pinned: end */

/* ---- Hick's-law disclosure ("+N more") — the muted twin of a chip. Reveals
   the tucked single-select options on click, then removes itself. Presentation
   only; scoped like every other runtime control. ---- */
.uf-interactive .uf-more {
  border: 1px dashed var(--uf-line-2);
  background: transparent;
  color: var(--uf-ink-3);
  border-radius: 999px;
  padding: 6px 13px;
  font: 600 13px var(--uf-sans);
  cursor: pointer;
  transition: color .15s, border-color .15s;
}
.uf-interactive .uf-more:hover { color: var(--uf-ink); border-color: var(--uf-green); }

/* ---- score card: the doors (each computed lever surfaced with its worth +
   the cited source of the amount it assumes). Sits between the stat tiles and
   the estimate note.
   SCOPED under .uf-score__doors: the psych Mind solver's stage ALSO rides a
   bare `uf-door` class (P90's "lit doorway"), and the unscoped light-paper row
   rules here out-specified its dark stage — cream titles on pale paper, the
   2026-07-13 unreadable-doorway sighting (same collision disease as the
   .uf-glass clobber fixed in 0.8.23). These rows only ever render inside the
   score card's list, so the scope costs nothing. ---- */
.uf-interactive .uf-score__doors { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.uf-interactive .uf-score__doors .uf-door {
  display: flex; align-items: baseline; gap: 10px;
  padding: 10px 13px; border: 1px solid var(--uf-line); border-radius: 10px; background: var(--uf-paper-2);
}
.uf-interactive .uf-score__doors .uf-door__label { flex: 1; font: 600 14px var(--uf-sans); color: var(--uf-ink-2); }
.uf-interactive .uf-score__doors .uf-door__delta { font: 600 15px var(--uf-mono); color: var(--uf-green); }
.uf-interactive .uf-score__doors .uf-door__src {
  font: 600 11px/1 var(--uf-mono); text-transform: uppercase; letter-spacing: .05em;
  color: var(--uf-ink-3); text-decoration: none;   /* color-only at rest — owner law: no lines on text */
}
.uf-interactive .uf-score__doors .uf-door__src:hover { color: var(--uf-ink); text-decoration: underline; }

/* ===========================================================================
   FORENSIC-FIX Phase 3 (Finding #3b): connector CSS for the three interactive
   components that previously had NONE and do not self-inject a stylesheet —
   deadline_clock (uf-dl), reinstatement_clock (uf-rc), snap_medical_worth_it
   (uf-mw). They rendered as dark, unstyled inputs/chips on live pages.

   These are NOT novel designs: every rule is cloned from the established
   solver/screener chip + labelled-input + result-card pattern above, using only
   existing --uf-* tokens (text-on-color is var(--uf-paper), so it flips with
   the scheme). Scoped on the stable data-uf-component hook so all program
   variants match.

   FLAGGED FOR DESIGN REVIEW: the owner holds strong design opinions and these
   three shells were shipped without a connector skin. This is a faithful clone
   of the neighbouring components to remove the dark-default regression — it is
   not a bespoke treatment. Review for the intended visual identity.
   =========================================================================== */

/* deadline_clock — date-math: program chips, a notice-date input, and a result
   card whose accent shifts by urgency kind (uf-dl__card--{ok,warn,danger}). */
.uf-interactive[data-uf-component="deadline"] .uf-dl { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="deadline"] .uf-dl__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive[data-uf-component="deadline"] .uf-dl__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 6px 14px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="deadline"] .uf-dl__chip:hover { border-color: var(--uf-green); color: var(--uf-ink); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__ask { display: flex; flex-direction: column; gap: 6px; font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__date { border: 1px solid var(--uf-line); border-radius: 10px; padding: 10px 12px; font: 400 15px var(--uf-serif); background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__date:focus { outline: none; border-color: var(--uf-green); box-shadow: 0 0 0 3px var(--uf-green-soft); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__hint { margin: 0; background: var(--uf-paper-2); border-radius: 12px; padding: 14px 16px; font: 500 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__card { display: grid; gap: 4px; border: 1px solid var(--uf-green); border-left-width: 4px; border-radius: 12px; padding: 14px 16px; background: var(--uf-card); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__card--ok { border-color: var(--uf-green); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__card--warn { border-color: var(--uf-ochre); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__card--danger { border-color: var(--uf-clay); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__klabel { font: 700 11px var(--uf-mono); text-transform: uppercase; letter-spacing: 1.5px; color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__date-out { font: 700 20px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__left { font: 600 13px var(--uf-sans); color: var(--uf-green-2); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__card--warn .uf-dl__left { color: var(--uf-ochre-2); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__card--danger .uf-dl__left { color: var(--uf-clay); }
.uf-interactive[data-uf-component="deadline"] .uf-dl__rule { margin: 4px 0 0; font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }

/* reinstatement_clock — same date-math shell as deadline (program chips,
   termination-date input, result card) plus a guidance line and an .ics button. */
.uf-interactive[data-uf-component="reinstate"] .uf-rc { display: grid; gap: 14px; }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__chip { border: 1px solid var(--uf-line); background: var(--uf-card); color: var(--uf-ink-2); border-radius: 999px; padding: 6px 14px; font: 600 13px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__chip:hover { border-color: var(--uf-green); color: var(--uf-ink); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__chip.is-on { background: var(--uf-green); border-color: var(--uf-green); color: var(--uf-paper); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__ask { display: flex; flex-direction: column; gap: 6px; font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__date { border: 1px solid var(--uf-line); border-radius: 10px; padding: 10px 12px; font: 400 15px var(--uf-serif); background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__date:focus { outline: none; border-color: var(--uf-green); box-shadow: 0 0 0 3px var(--uf-green-soft); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__hint { margin: 0; background: var(--uf-paper-2); border-radius: 12px; padding: 14px 16px; font: 500 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__card { display: grid; gap: 4px; border: 1px solid var(--uf-green); border-left-width: 4px; border-radius: 12px; padding: 14px 16px; background: var(--uf-card); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__klabel { font: 700 11px var(--uf-mono); text-transform: uppercase; letter-spacing: 1.5px; color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__date-out { font: 700 20px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__left { font: 600 13px var(--uf-sans); color: var(--uf-green-2); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__rule { margin: 4px 0 0; font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__guide { margin: 0; font: 400 14px var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__ics { justify-self: start; background: var(--uf-green); color: var(--uf-paper); border: 0; border-radius: 10px; padding: 10px 18px; font: 700 14px var(--uf-sans); cursor: pointer; }
.uf-interactive[data-uf-component="reinstate"] .uf-rc__ics[hidden] { display: none; }

/* snap_medical_worth_it — a single cost input and a computed result card
   (+$/mo more SNAP) with supporting cited notes. Clone of the solver card. */
.uf-interactive[data-uf-component="medworth"] .uf-mw { display: grid; gap: 12px; }
.uf-interactive[data-uf-component="medworth"] .uf-mw__ask { display: flex; flex-direction: column; gap: 6px; font: 700 14px var(--uf-sans); color: var(--uf-ink); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__in { border: 1px solid var(--uf-line); border-radius: 10px; padding: 10px 12px; font: 400 15px var(--uf-serif); background: var(--uf-card); color: var(--uf-ink); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__in:focus { outline: none; border-color: var(--uf-green); box-shadow: 0 0 0 3px var(--uf-green-soft); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__hint { margin: 0; background: var(--uf-paper-2); border-radius: 12px; padding: 14px 16px; font: 500 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__card { display: grid; gap: 4px; border: 1px solid var(--uf-green); border-radius: 12px; padding: 14px 16px; background: var(--uf-card); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__klabel { font: 700 11px var(--uf-mono); text-transform: uppercase; letter-spacing: 1.5px; color: var(--uf-ink-3); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__est { font: 700 20px var(--uf-serif); color: var(--uf-green-2); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__sub { font: 400 13.5px var(--uf-serif); color: var(--uf-ink-2); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__none { margin: 0; background: var(--uf-paper-2); border-radius: 12px; padding: 14px 16px; font: 500 14.5px var(--uf-serif); color: var(--uf-ink); }
.uf-interactive[data-uf-component="medworth"] .uf-mw__floor,
.uf-interactive[data-uf-component="medworth"] .uf-mw__ncoa,
.uf-interactive[data-uf-component="medworth"] .uf-mw__recert,
.uf-interactive[data-uf-component="medworth"] .uf-mw__smd { margin: 0; font: 400 12.5px var(--uf-sans); color: var(--uf-ink-3); }