/* The /record page: Anshira's own consultant agent on its own record. One record screen (headline and its range, the
   requests laid out in time, the standing list, the ledger's pulse) and one tabbed detail area. Built on the site's
   conventions (tokens.css, site.css): white screens on mist, hairlines not shadows, colour only for meaning (ai = held
   or selected, shu = failed), mono for data.
   Motion rule: only what is still open moves. A pending request breathes, the append edge blinks, the ring counts to the
   next real check. Settled entries are still; a new entry lands once, flashes once, and rests. Everything below that
   animates sits behind prefers-reduced-motion, and loops pause when the screen is out of view. */

.nav-in .btn { margin-left: auto; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rc-top { margin-top: 24px; }
.rc-loading .note { padding: 8px 0; }
.rc-sweep { display: block; height: 1px; width: 100%; max-width: 420px; position: relative; overflow: hidden; background: var(--an-line); }
.rc-sweep::after { content: ""; position: absolute; top: 0; bottom: 0; width: 22%; background: var(--an-ink); animation: rc-sweep 1.4s var(--an-ease) infinite; }
@keyframes rc-sweep { from { left: -22%; } to { left: 100%; } }
@media (max-width: 640px) { .rc-top { margin-top: 16px; } }

/* ---- rolling numbers: a row of digit columns; moving to a new value slides each column ---- */
.roll { display: inline-block; white-space: nowrap; font-variant-numeric: tabular-nums; }
.roll .rv { display: inline-block; }
.roll .dg { position: relative; display: inline-block; height: calc(1em * var(--rl, 1)); line-height: calc(1em * var(--rl, 1)); clip-path: inset(0); }
.roll .dg::before { content: "0"; visibility: hidden; }                 /* gives the column its width and its baseline */
.roll .col { position: absolute; left: 0; right: 0; top: 0; text-align: center; transform: translateY(calc(var(--d) * -1em * var(--rl, 1))); transition: transform 820ms var(--an-ease) calc(var(--k, 0) * 70ms); }
.roll .col::before { content: "0\A 1\A 2\A 3\A 4\A 5\A 6\A 7\A 8\A 9"; display: block; white-space: pre; line-height: calc(1em * var(--rl, 1)); }
.roll.pre .col { transform: none; transition: none; }
.roll.rl { --rl: 1.28; }

/* ---- the record screen ---- */
.rc-rec { grid-template-columns: minmax(0, 1fr) 380px; }
@media (max-width: 900px) { .rc-rec { grid-template-columns: minmax(0, 1fr); } }
.rc-rec-head { grid-column: 1 / -1; display: grid; gap: 6px; padding: 16px 24px 14px; border-bottom: 1px solid var(--an-line); min-width: 0; }
.rc-title-row { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 6px 24px; }
.rc-title { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin: 0; font-size: 1.5rem; line-height: 1.2; letter-spacing: -0.025em; font-weight: 700; color: var(--an-ink); }
.rc-title img { width: 20px; height: 20px; flex: none; }
.rc-title .turn { font-weight: 600; color: var(--an-faint); }
.rc-loading .rc-title { margin-bottom: 4px; }
.rc-status { margin: 0; font: 400 0.6875rem/1.6 var(--an-mono); color: var(--an-muted); }
.rc-def { margin: 0; font-size: 0.9375rem; line-height: 1.45; color: var(--an-ink); max-width: 110ch; }
.rc-def .k { font-size: inherit; color: var(--an-muted); }
@media (max-width: 640px) {
  .rc-rec-head { padding: 14px 16px 12px; }
  .rc-title { font-size: 1.3125rem; }
  .rc-title .turn { color: var(--an-muted); }
}

/* the live clock: the page really does check the record every 20 s, and says when it last did */
.rc-live { display: inline-flex; align-items: center; gap: 10px; padding-top: 7px; font: 400 0.6875rem/1 var(--an-mono); color: var(--an-muted); white-space: nowrap; }
.rc-live .lv { display: inline-flex; align-items: center; gap: 8px; color: var(--an-ink); }
.rc-live .lv b { font-weight: 500; }
.beat { position: relative; width: 7px; height: 7px; border-radius: 50%; background: var(--an-ink); }
.beat::after { content: ""; position: absolute; inset: -1px; border-radius: 50%; border: 1px solid var(--an-ink); animation: rc-beat 2.6s var(--an-ease) infinite; }
.rc-live.is-pre .beat { background: transparent; box-shadow: inset 0 0 0 1.5px var(--an-ink); }
.rc-live.is-pre .beat::after { display: none; }
.ring { flex: none; transform: rotate(-90deg); }
.ring .rt, .ring .rp { fill: none; stroke-width: 1.5; }
.ring .rt { stroke: var(--an-line-2); }
.ring .rp { stroke: var(--an-ink); stroke-dasharray: 100; stroke-dashoffset: 100; animation: rc-ring 20s linear forwards; }
@keyframes rc-beat { 0% { transform: scale(1); opacity: 0.55; } 70%, 100% { transform: scale(3.2); opacity: 0; } }
@keyframes rc-ring { to { stroke-dashoffset: 0; } }
@media (max-width: 640px) { .rc-live { padding-top: 0; } }

.rc-rec .rec-main { padding: 20px 24px 18px; display: flex; flex-direction: column; min-width: 0; }
.rc-rec .figure-row { margin-top: 0; padding-bottom: 0; border-bottom: 0; align-items: end; gap: 6px 34px; }
.rc-rec .figure { display: flex; align-items: baseline; font-size: clamp(4.5rem, 8.4vw, 7.5rem); line-height: 1; letter-spacing: -0.045em; font-weight: 600; }
.rc-rec .figure .pct { font-size: 0.4em; margin-left: 4px; letter-spacing: 0; font-weight: 500; color: var(--an-ink-2); }
.rc-rec .figure .of { font-size: 0.34em; font-weight: 500; letter-spacing: 0; margin-left: 12px; color: var(--an-muted); }
.rc-rec .figure.is-dash { color: var(--an-line-2); font-weight: 500; }
.figure-def { max-width: none; gap: 3px; padding-bottom: 6px; }
.figure-def .mono { line-height: 1.55; }
.figure-def .src-line { display: block; }
.figure-def a, .rc-note a, .rc-def a { color: inherit; }
.figure-def a:hover, .rc-note a:hover { color: var(--an-ai); }
.figure-def .rc-prelaunch { font-size: 1.0625rem; font-weight: 600; color: var(--an-ink); }
.figure-def p { font-size: 0.9375rem; color: var(--an-ink-2); max-width: 64ch; }
@media (max-width: 640px) { .rc-rec .rec-main { padding: 16px 16px 14px; } .rc-rec .figure { font-size: 4.5rem; } .rc-rec .figure-row { grid-template-columns: minmax(0, 1fr); } }

/* the range: the received rate (ink mark), the received interval (the bar), where it lands once what is pending
   resolves (solid), and the target (dashed). Positions are the numbers the API sent. */
.gauge { position: relative; margin-top: 8px; }
.g-track { position: relative; height: 16px; margin: 24px 10px 0 0; }
.g-iv { position: absolute; top: 0; height: 16px; left: calc(var(--a) * 1%); width: calc((var(--b) - var(--a)) * 1%); background: var(--an-ai-soft); border-left: 1px solid var(--an-ai); border-right: 1px solid var(--an-ai); transition: left 800ms var(--an-ease), width 800ms var(--an-ease); }
.g-pr { position: absolute; top: 6px; height: 4px; left: calc(var(--a) * 1%); width: calc((var(--b) - var(--a)) * 1%); background: var(--an-ai); transition: left 800ms var(--an-ease), width 800ms var(--an-ease); }
.g-pt { position: absolute; top: -4px; height: 24px; width: 3px; margin-left: -1.5px; left: calc(var(--x) * 1%); background: var(--an-ink); transition: left 800ms var(--an-ease); }
.g-e { position: absolute; top: 1px; left: calc(var(--p) * 1%); font: 400 0.6875rem/14px var(--an-mono); color: var(--an-muted); white-space: nowrap; transition: left 800ms var(--an-ease); }
.g-e.lo { transform: translateX(calc(-100% - 7px)); }
.g-e.hi { margin-left: 7px; }
.g-tg { position: absolute; top: -10px; height: 36px; width: 0; left: calc(var(--x) * 1%); border-left: 1px dashed var(--an-ink-2); transition: left 800ms var(--an-ease); }
.g-tg span { position: absolute; bottom: 100%; left: 5px; margin-bottom: 1px; font: 400 0.6875rem/1.2 var(--an-mono); color: var(--an-ink-2); white-space: nowrap; }
.g-tg.flip span { left: auto; right: 5px; }
.g-rule { position: relative; height: 24px; margin: 8px 10px 0 0; }
.g-rule i { position: absolute; top: 0; left: calc(var(--p) * 1%); width: 1px; height: 4px; background: var(--an-line-2); }
.g-rule i.major { height: 7px; background: var(--an-faint); }
.g-n { position: absolute; top: 10px; left: calc(var(--p) * 1%); transform: translateX(-50%); font: 400 0.6875rem/1 var(--an-mono); color: var(--an-faint); }
.g-cap { margin: 2px 0 0; line-height: 1.5; }
.g-leg { display: flex; flex-wrap: wrap; gap: 2px 16px; margin: 2px 0 0; line-height: 1.5; }
.g-leg span { display: inline-flex; align-items: center; gap: 7px; }
.lg { display: inline-block; flex: none; }
.lg.iv { width: 14px; height: 10px; background: var(--an-ai-soft); border-left: 1px solid var(--an-ai); border-right: 1px solid var(--an-ai); }
.lg.pt { width: 3px; height: 12px; background: var(--an-ink); }
.lg.pr { width: 14px; height: 4px; background: var(--an-ai); }
.lg.tg { width: 0; height: 12px; border-left: 1px dashed var(--an-ink-2); }

/* before a percentage may show: twenty slots, each measured request fills one */
.slotwrap { margin-top: 22px; }
.slots { display: grid; grid-template-columns: repeat(20, 10px); gap: 8px; justify-content: start; }
.sl { height: 30px; border-radius: 1px; background: var(--an-ai); position: relative; transition: background 450ms var(--an-ease), box-shadow 450ms var(--an-ease); }
.sl.miss { background: var(--an-line-2); }
.sl.pend { background: var(--an-paper); box-shadow: inset 0 0 0 1px var(--an-faint); }
.sl.empty { background: transparent; box-shadow: inset 0 0 0 1px var(--an-line); }
.sl.empty.next { box-shadow: inset 0 0 0 1px var(--an-ink); animation: rc-caret 1.2s steps(1) infinite; }
.slotwrap .g-cap { margin-top: 10px; }
@media (max-width: 640px) { .slots { grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 4px; } }

/* the tape: every request at the time it arrived, one lane per type of request. The right edge is "as of". */
.rc-rec .strip-head { margin-top: 0; }
.rc-sub { margin-top: 20px; }
.tape-wrap { margin-top: 24px; }
.tape { --lh: 22px; --th: 16px; margin-top: 10px; outline-offset: 6px; }
.tape.compact { --lh: 28px; --th: 20px; }
.tape-grid { display: grid; grid-template-columns: 124px minmax(0, 1fr); }
.tape.compact .tape-grid { grid-template-columns: minmax(0, 1fr); }
.lbls { grid-column: 1; grid-row: 1; min-width: 0; }
.tape.compact .lbls { display: none; }
.ll { display: block; height: var(--lh); line-height: var(--lh); padding-right: 10px; font-size: 0.75rem; color: var(--an-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lt { position: relative; grid-column: 2; grid-row: 1; height: calc(var(--nl) * var(--lh)); margin-right: 10px; }
.tape.compact .lt { grid-column: 1; }
.gl { position: absolute; top: 0; bottom: 0; left: calc(var(--x) * 1%); width: 1px; background: var(--an-line); transition: left 800ms var(--an-ease); }
.ln { position: absolute; left: 0; right: 0; top: calc((var(--l) + 1) * var(--lh) - 1px); height: 0; border-top: 1px dotted var(--an-line-2); }
.tk { position: absolute; left: calc(var(--x) * 1% - 2px); top: calc(var(--l) * var(--lh) + (var(--lh) - var(--th)) / 2); width: 4px; height: var(--th); background: var(--an-ai); border-radius: 1px; pointer-events: none; transition: left 800ms var(--an-ease), background 400ms var(--an-ease); }
.tk.miss { background: var(--an-line-2); }
.tk.pend { background: var(--an-paper); box-shadow: inset 0 0 0 1px var(--an-faint); }
.tk.oth { background: var(--an-line); height: calc(var(--th) * 0.55); top: calc(var(--l) * var(--lh) + (var(--lh) - var(--th) * 0.55) / 2); }
.tk.sel { outline: 1px solid var(--an-ink); outline-offset: 2px; z-index: 1; }
.caret { position: absolute; top: -2px; bottom: -2px; left: 100%; width: 1px; margin-left: 5px; background: var(--an-ink); animation: rc-caret 1.2s steps(1) infinite; }
.ping { position: absolute; top: -3px; bottom: -3px; left: 0; width: 1px; background: var(--an-ink); opacity: 0; pointer-events: none; }
.ping.go { animation: rc-ping 1000ms var(--an-ease); }
.axis { position: relative; grid-column: 2; grid-row: 2; height: 18px; margin-right: 10px; }
.tape.compact .axis { grid-column: 1; }
.al { position: absolute; top: 4px; left: calc(var(--x) * 1%); padding-left: 4px; font: 400 0.6875rem/1 var(--an-mono); color: var(--an-faint); white-space: nowrap; transition: left 800ms var(--an-ease); }
.al::before { content: ""; position: absolute; left: 0; top: -5px; height: 4px; width: 1px; background: var(--an-line-2); }
.tape-read { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; min-height: 20px; margin-top: 8px; font: 400 0.6875rem/1.6 var(--an-mono); color: var(--an-muted); }
.tape-read b { font-weight: 500; color: var(--an-ink); }
.tape-read .ref { color: var(--an-ink); font-weight: 500; text-decoration-color: var(--an-line-2); text-underline-offset: 3px; }
.tape-read .ref:hover { color: var(--an-ai); }
.t.pend { background: var(--an-paper); box-shadow: inset 0 0 0 1px var(--an-line-2); }
.t.oth { background: var(--an-line); }
@media (max-width: 640px) { .al:nth-child(even) { display: none; } }

/* the rest of the headline column: everything counted, then the tests, kept apart */
.rc-rec .rc-sub .log-head { margin-top: 0; }
.rc-sub + .rc-sub { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--an-line); }
.rec-rail .rc-sub { margin-top: 0; padding-top: 14px; border-top: 1px solid var(--an-line-2); }
.rc-sub.tape-wrap { border-top: 0; padding-top: 0; }
.rc-counted { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 0.8125rem; color: var(--an-ink-2); }
.rc-counted li { display: inline; border-radius: 2px; }
.rc-counted b { font-weight: 600; color: var(--an-ink); }
.rc-counted .why { font: 400 0.6875rem var(--an-mono); color: var(--an-muted); }
.rc-counted.rc-stack { display: grid; gap: 2px; }
.rc-counted.rc-stack li { display: block; }
.rc-link { font: 400 0.6875rem var(--an-mono); color: var(--an-ink); text-underline-offset: 3px; }
.rc-link:hover { color: var(--an-ai); }
.rc-tl { display: grid; gap: 10px; }
.rc-tl .rc-counted { margin-top: 8px; }
/* the plan-builder counts: a label in mono, then the counts as a sentence, one line each */
.rc-counted.rc-intake { gap: 0; }
.rc-counted.rc-intake li { display: grid; grid-template-columns: 11.5rem minmax(0, 1fr); gap: 0 14px; padding: 7px 0; border-top: 1px solid var(--an-line); line-height: 1.5; }
.rc-counted.rc-intake li:first-child { border-top: 0; padding-top: 0; }
.rc-counted.rc-intake .k { font: 400 0.6875rem/1.9 var(--an-mono); color: var(--an-muted); }
@media (max-width: 640px) { .rc-counted.rc-intake li { grid-template-columns: minmax(0, 1fr); gap: 0; } }
.rc-spark { display: flex; align-items: flex-end; gap: 2px; flex: none; }
.rc-spark .t { position: relative; overflow: hidden; width: 5px; height: 22px; }
.rc-spark .t.cap::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: max(2px, calc(var(--f) * 100%)); background: var(--an-shu); }

/* the standing list: targets with their verdicts, violations caught and reached */
.rc-rec .rec-rail { padding: 18px 22px; gap: 16px; justify-content: flex-start; }
.rc-rec .rec-rail .k { display: block; margin-bottom: 6px; }
.rc-tg { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--an-line); }
.rc-tg li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 12px; align-items: baseline; padding: 5px 0; border-bottom: 1px solid var(--an-line); }
.rc-tg .l { grid-column: 1 / -1; font-size: 0.8125rem; color: var(--an-ink); }
.rc-tg .m { display: flex; flex-wrap: wrap; gap: 0 12px; font: 400 0.6875rem/1.5 var(--an-mono); color: var(--an-muted); }
.rc-tg .m b { font-weight: 500; color: var(--an-ink); }
.rc-tg .nw { white-space: nowrap; }
.rc-tg .v { display: inline-flex; align-items: center; gap: 6px; font: 400 0.6875rem var(--an-mono); color: var(--an-muted); white-space: nowrap; }
.rc-tg .v::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; }
.rc-tg .v.meets { color: var(--an-ai); } .rc-tg .v.meets::before { background: var(--an-ai); }
.rc-tg .v.misses { color: var(--an-shu); } .rc-tg .v.misses::before { background: var(--an-shu); }
.rc-tg .v.inconclusive::before { box-shadow: inset 0 0 0 1.5px var(--an-muted); }
.rc-tg .v.nodata::before { background: var(--an-line-2); }
.rc-vio li { grid-template-columns: 64px 28px minmax(0, 1fr); gap: 0 8px; align-items: baseline; }
.rc-vio .l { grid-column: auto; }
.rc-vio .m { text-align: left; }
.rc-vio b { font-size: 1.125rem; font-weight: 600; color: var(--an-ink); }
.rc-vio b.bad { color: var(--an-shu); }
.rc-note { margin-top: 8px; font-size: 0.8125rem; line-height: 1.5; color: var(--an-muted); }
@media (max-width: 900px) { .rc-rec .rec-rail { padding: 16px; } }

/* the record's pulse: entries, the head they chain to, and which characters of it just changed */
.rc-foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 24px; padding: 10px 24px; border-top: 1px solid var(--an-line); background: var(--an-panel); font: 400 0.6875rem/1.5 var(--an-mono); color: var(--an-muted); }
.rc-foot .lf { display: inline-flex; align-items: baseline; gap: 8px; min-width: 0; }
.rc-foot .k { font: inherit; color: var(--an-faint); }
.rc-foot .lf > span:not(.k) { color: var(--an-ink); }
.rc-foot code { font: inherit; color: var(--an-ink); }
.rc-foot .rc-link { margin-left: auto; color: var(--an-muted); }
.rc-foot .rc-link:hover { color: var(--an-ai); }
.hx .df { animation: rc-df 2.4s var(--an-ease); }
@media (max-width: 640px) { .rc-foot { padding: 10px 16px; } .rc-foot .rc-link { margin-left: 0; } }

/* the tabbed detail area */
.rc-tabs { margin-top: 20px; padding-bottom: 40px; scroll-margin-top: 72px; }
.rc-tablist { position: relative; display: flex; gap: 2px; padding: 0 12px; border-bottom: 1px solid var(--an-line); overflow-x: auto; scrollbar-width: none; }
.rc-tablist::-webkit-scrollbar { display: none; }
.rc-tab { flex: none; background: none; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; padding: 13px 12px 11px; font: 500 0.875rem var(--an-sans); color: var(--an-muted); cursor: pointer; white-space: nowrap; transition: color var(--an-fast) var(--an-ease); }
.rc-tab:hover { color: var(--an-ink); }
.rc-tab[aria-selected="true"] { color: var(--an-ink); }
.rc-tab:focus-visible { outline: 2px solid var(--an-ai); outline-offset: -4px; }
.rc-tab .n { margin-left: 7px; font: 400 0.6875rem var(--an-mono); color: var(--an-muted); }
.rc-tab .short { display: none; }
.rc-ind { position: absolute; left: 0; bottom: -1px; height: 2px; width: var(--w, 0px); transform: translateX(var(--x, 0px)); background: var(--an-ai); transition: transform 260ms var(--an-ease), width 260ms var(--an-ease); pointer-events: none; }
.rc-panel { padding: 18px 24px 24px; min-width: 0; }
.rc-panel[hidden] { display: none; }
.rc-panel:focus-visible { outline-offset: -3px; }
.rc-panel > .strip-head:first-child, .rc-panel > .log-head:first-child { margin-top: 0; }
.rc-panel .rc-gap { margin-top: 26px; }
.rc-lead { margin: 0 0 4px; max-width: 74ch; font-size: 0.875rem; color: var(--an-ink-2); }
.rc-h2 { margin: 0; font-size: 1.25rem; line-height: 1.25; letter-spacing: -0.02em; }
.rc-h2 .turn { font-weight: 600; }
.rc-empty { padding: 12px 0 2px; font-size: 0.9375rem; color: var(--an-ink-2); max-width: 70ch; }
@media (max-width: 640px) {
  .rc-tablist { padding: 0 6px; }
  .rc-tab { padding: 13px 10px 11px; }
  .rc-tab .long { display: none; }
  .rc-tab .short { display: inline; }
  .rc-panel { padding: 16px 16px 20px; }
}

/* activity: time, reference, request, outcome, version. Never content */
.rc-feed { list-style: none; margin: 6px 0 0; padding: 0; }
.rc-feed li { display: grid; grid-template-columns: 100px minmax(0, 1fr) auto 52px; gap: 14px; align-items: baseline; padding: 8px 10px; margin-inline: -10px; border-top: 1px solid var(--an-line); border-radius: 2px; font-size: 0.9375rem; color: var(--an-ink); transition: background var(--an-fast) var(--an-ease); }
.rc-feed li:first-child { border-top-color: transparent; }
.rc-feed li:hover, .rc-feed li.link { background: var(--an-panel); }
.rc-feed .d, .rc-feed .id, .rc-feed .v { font: 400 0.6875rem var(--an-mono); color: var(--an-muted); }
.rc-feed .id { margin-right: 8px; }
.rc-feed .v { text-align: right; }
.o { position: relative; display: inline-flex; align-items: center; gap: 7px; font: 400 0.6875rem var(--an-mono); white-space: nowrap; }
.o::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; transition: background 450ms var(--an-ease), box-shadow 450ms var(--an-ease); }
.o.held { color: var(--an-ai); } .o.held::before { background: var(--an-ai); }
.o.miss { color: var(--an-muted); } .o.miss::before { background: var(--an-line-2); }
.o.pend { color: var(--an-muted); } .o.pend::before { box-shadow: inset 0 0 0 1.5px var(--an-faint); }
.o.good { color: var(--an-muted); } .o.good::before { background: var(--an-faint); }
.rc-more { margin-top: 10px; padding-top: 12px; border-top: 1px solid var(--an-line); }
@media (max-width: 640px) {
  .rc-feed li { grid-template-columns: minmax(0, 1fr) auto; gap: 3px 12px; padding: 10px 10px; }
  .rc-feed .d { grid-area: 1 / 1; }
  .rc-feed .v { grid-area: 1 / 2; }
  .rc-feed .w { grid-area: 2 / 1; }
  .rc-feed .o { grid-area: 2 / 2; justify-self: end; text-align: right; white-space: normal; max-width: 13em; }
}

/* by request type */
.rc-types { list-style: none; margin: 6px 0 0; padding: 0; }
.rc-types li { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 2fr); gap: 4px 20px; align-items: baseline; padding: 10px 0; border-top: 1px solid var(--an-line); font-size: 0.9375rem; color: var(--an-ink); }
.rc-types li:first-child { border-top: 0; }
.rc-types .det { display: grid; gap: 2px; min-width: 0; }
.rc-types .c, .rc-types .tier { font: 400 0.6875rem/1.55 var(--an-mono); color: var(--an-muted); }
.rc-types .c b { font-weight: 500; color: var(--an-ink); }
.rc-gloss { margin: 6px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; border-top: 1px solid var(--an-line); }
.rc-gloss div { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--an-line); font-size: 0.8125rem; }
.rc-gloss dt { color: var(--an-ink); font-weight: 500; }
.rc-gloss dd { margin: 0; color: var(--an-ink-2); }
@media (max-width: 760px) { .rc-types li { grid-template-columns: minmax(0, 1fr); } .rc-gloss { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 420px) { .rc-gloss div { grid-template-columns: minmax(0, 1fr); gap: 2px; } }

/* tests: nightly strip, then each version, newest first */
.rc-tests-grid { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 28px 36px; margin-top: 16px; align-items: start; }
.rc-tests-grid .strip-head { margin-top: 0; }
.rc-tests-grid .strip-head .legend { flex-basis: 100%; }
.rc-ngroups { display: flex; flex-wrap: wrap; gap: 14px 20px; margin-top: 12px; }
.rc-ng { min-width: 0; }
.rc-ng .ver-l { gap: 16px; }
.rc-nights { display: flex; flex-wrap: wrap; gap: 3px; }
.rc-nights .t { position: relative; overflow: hidden; width: 10px; height: 36px; }
.rc-nights .t.cap::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: max(2px, calc(var(--f) * 100%)); background: var(--an-shu); }
.rc-last { margin-top: 12px; }
.rc-details { margin-top: 10px; }
.rc-details summary { cursor: pointer; font-size: 0.8125rem; color: var(--an-ink); width: fit-content; }
.rc-details summary:hover { color: var(--an-ai); }
.rc-nt { width: 100%; margin-top: 8px; border-collapse: collapse; font-size: 0.875rem; }
.rc-nt th, .rc-nt td { padding: 7px 12px 7px 0; border-bottom: 1px solid var(--an-line); text-align: left; font-weight: 400; color: var(--an-ink); }
.rc-nt thead th { font: 400 0.6875rem var(--an-mono); color: var(--an-muted); }
.rc-nt td.m { font: 400 0.6875rem var(--an-mono); color: var(--an-muted); }
.rc-vers { list-style: none; margin: 8px 0 0; padding: 0; }
.rc-vers > li { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 8px 24px; padding: 11px 0; border-top: 1px solid var(--an-line); }
.rc-vers > li:first-child { border-top: 0; }
.rc-vers .info { display: grid; gap: 1px; align-content: start; min-width: 0; }
.rc-vers .vid { font: 500 0.8125rem var(--an-mono); color: var(--an-ink); }
.rc-vers .res { font-size: 1.0625rem; font-weight: 600; color: var(--an-ink); font-variant-numeric: tabular-nums; }
.rc-vers .crit { margin-left: 10px; font: 400 0.6875rem var(--an-mono); color: var(--an-muted); }
.rc-vers .meta { font: 400 0.6875rem/1.55 var(--an-mono); color: var(--an-muted); overflow-wrap: anywhere; }
.rc-vers .bars { min-width: 0; }
.rc-vers .ticks { max-width: calc(var(--n) * 14px); }
.rc-vers .cap { margin-top: 8px; font: 400 0.6875rem/1.55 var(--an-mono); color: var(--an-muted); }
@media (max-width: 760px) { .rc-vers > li { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 1000px) { .rc-tests-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .rc-vers .ticks { max-width: none; grid-template-columns: repeat(auto-fill, minmax(7px, 1fr)); height: auto; grid-auto-rows: 28px; row-gap: 4px; } }

/* corrections: the severity table beside its note, then site.css .log */
.rc-vtwrap { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px 32px; margin-bottom: 18px; }
.rc-vt { width: 320px; max-width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.rc-vt caption { text-align: left; padding-bottom: 6px; font-size: 0.8125rem; color: var(--an-muted); }
.rc-vt th, .rc-vt td { padding: 6px 0; border-bottom: 1px solid var(--an-line); text-align: right; font-variant-numeric: tabular-nums; }
.rc-vt thead th { font: 400 0.6875rem var(--an-mono); color: var(--an-muted); border-top: 1px solid var(--an-line); }
.rc-vt tbody th { text-align: left; font-weight: 400; color: var(--an-ink-2); }
.rc-vt td { color: var(--an-ink); font-weight: 600; }
.rc-vt td.bad { color: var(--an-shu); }
.rc-vtwrap .rc-note { flex: 1 1 260px; max-width: 54ch; margin-top: 26px; }
.log .meta { display: block; margin-top: 2px; font: 400 0.6875rem/1.55 var(--an-mono); color: var(--an-muted); }
.log .s.over { color: var(--an-muted); }
.log .s.over::before { background: var(--an-line-2); }
.log .s { white-space: normal; text-align: right; }
@media (max-width: 640px) { .log .s { text-align: left; } .rc-vtwrap .rc-note { margin-top: 0; } }

/* how we limit grading ourselves, and the ledger */
.rc-self { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 40px; margin-top: 14px; align-items: start; }
.rc-self .rules { margin: 0; }
.rc-self .rules div { grid-template-columns: minmax(0, 1fr); gap: 3px; padding: 12px 0; }
.rc-self .rules div:first-child { border-top: 1px solid var(--an-line); }
.rc-self .rules dt { font-size: 0.9375rem; }
.rc-self .rules dd { font-size: 0.875rem; }
.rc-agree { min-width: 0; }
.rc-agree .facts div { align-items: baseline; gap: 16px; }
.rc-agree .facts dt { white-space: nowrap; }
.rc-agree .facts dd { text-align: right; font-weight: 500; min-width: 0; overflow-wrap: anywhere; }
.rc-agree .facts dd .mono, .rc-hash { font: 400 0.6875rem/1.6 var(--an-mono); font-weight: 400; overflow-wrap: anywhere; word-break: break-all; }
.rc-agree .gap { margin-top: 10px; font-size: 0.8125rem; color: var(--an-muted); }
.rc-ledger { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 40px; align-items: start; }
.rc-ledger .copy p { margin-top: 10px; max-width: 46ch; font-size: 0.9375rem; }
.rc-hash-box { margin-top: 12px; padding: 12px 14px; border: 1px solid var(--an-line-2); border-radius: var(--an-r-s); background: var(--an-panel); color: var(--an-ink); }
.rc-verify { margin-top: 14px; display: grid; gap: 8px; font-size: 0.875rem; color: var(--an-ink-2); }
.rc-verify b { font-weight: 600; color: var(--an-ink); }
.rc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: 14px; }
@media (max-width: 860px) { .rc-self, .rc-ledger { grid-template-columns: minmax(0, 1fr); gap: 20px; } }
@media (max-width: 640px) {
  .rc-agree .facts div { flex-direction: column; gap: 2px; }
  .rc-agree .facts dd { text-align: left; }
}

/* ---- motion. The record plays once on load; after that only what is open moves, and a new entry lands once ---- */
@keyframes rc-caret { 0%, 55% { opacity: 1; } 56%, 100% { opacity: 0; } }
@keyframes rc-breathe { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
@keyframes rc-ping { 0% { left: 0; opacity: 0.5; } 80% { opacity: 0.3; } 100% { left: 100%; opacity: 0; } }
@keyframes rc-land { from { opacity: 0; transform: translateY(-10px) scaleY(0.4); } to { opacity: 1; transform: none; } }
@keyframes rc-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes rc-wipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
@keyframes rc-flash { 0%, 22% { background-color: var(--an-line); } 100% { background-color: transparent; } }
@keyframes rc-df { 0%, 35% { background: var(--an-ink); color: var(--an-on-ink); } 100% { background: transparent; } }
@keyframes rc-ripple { from { opacity: 0.8; transform: scale(0.5); } to { opacity: 0; transform: scale(2.4); } }
@keyframes rc-row-in { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: none; } }
@keyframes rc-panel-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.rc-panel:not([hidden]) { animation: rc-panel-in 180ms var(--an-ease); }

.flash { animation: rc-flash 1.9s var(--an-ease); }

/* the first draw: blocks rise in turn, the range wipes open, ticks land left to right like a tally */
.rc-play .rc-rec-head, .rc-play .rec-main > *, .rc-play .rec-rail > *, .rc-play .rc-foot { animation: rc-rise 640ms var(--an-ease) backwards; }
.rc-play .rec-main > :nth-child(1) { animation-delay: 60ms; }
.rc-play .rec-main > :nth-child(2) { animation-delay: 160ms; }
.rc-play .rec-main > :nth-child(3) { animation-delay: 260ms; }
.rc-play .rec-main > :nth-child(4) { animation-delay: 360ms; }
.rc-play .rec-main > :nth-child(5) { animation-delay: 440ms; }
.rc-play .rec-rail > :nth-child(1) { animation-delay: 140ms; }
.rc-play .rec-rail > :nth-child(2) { animation-delay: 260ms; }
.rc-play .rec-rail > :nth-child(3) { animation-delay: 380ms; }
.rc-play .rec-rail > :nth-child(4) { animation-delay: 480ms; }
.rc-play .rc-foot { animation-delay: 520ms; }
.rc-play .g-iv, .rc-play .g-pr { animation: rc-wipe 800ms var(--an-ease) 480ms backwards; }
.rc-play .g-pt { transform-origin: bottom; animation: rc-land 600ms var(--an-ease) 820ms backwards; }
.rc-play .tk, .rc-play .sl:not(.empty) { transform-origin: bottom; animation: rc-land 460ms var(--an-ease) backwards; animation-delay: calc(360ms + min(var(--i, 0) * 16ms, 900ms)); }

/* only what is open moves: pending requests breathe, the open slot and the append edge blink */
.tk.pend, .sl.pend { animation: rc-breathe 3.4s ease-in-out infinite; }
.rc-play .tk.pend, .rc-play .sl.pend { animation: rc-land 460ms var(--an-ease) backwards, rc-breathe 3.4s ease-in-out 1.6s infinite; animation-delay: calc(360ms + min(var(--i, 0) * 16ms, 900ms)), 0s; }
.o.pend::before { animation: rc-breathe 3.4s ease-in-out infinite; }

/* a new request lands: its tick drops onto the tape and rings once; its row slides in and flashes */
.tk.arrive, .sl.arrive { transform-origin: bottom; animation: rc-land 560ms var(--an-ease) backwards; z-index: 2; }
.tk.arrive::after, .tk.settle::after, .sl.arrive::after, .sl.settle::after { content: ""; position: absolute; inset: -4px -6px; border: 1px solid var(--an-ink-2); border-radius: 4px; opacity: 0; pointer-events: none; animation: rc-ripple 1000ms var(--an-ease) 120ms backwards; }
.tk.arrive:not(.miss):not(.pend):not(.oth)::after, .tk.settle:not(.miss):not(.pend):not(.oth)::after, .sl.arrive:not(.miss):not(.pend):not(.empty)::after, .sl.settle:not(.miss):not(.pend):not(.empty)::after { border-color: var(--an-ai); }
.rc-feed li.arrive { animation: rc-row-in 520ms var(--an-ease) backwards, rc-flash 2.2s var(--an-ease); }
.rc-feed li.settle { animation: rc-flash 2.2s var(--an-ease); }
.rc-feed li.arrive .o::after, .rc-feed li.settle .o::after { content: ""; position: absolute; left: -4px; top: 50%; width: 16px; height: 16px; margin-top: -8px; border: 1px solid currentColor; border-radius: 50%; opacity: 0; pointer-events: none; animation: rc-ripple 1100ms var(--an-ease) 160ms backwards; }

/* out of view or in a background tab: loops stand still (they cost nothing while nobody is looking) */
.rc-off *, .rc-off *::before, .rc-off *::after { animation-play-state: paused !important; }

/* nothing moves under reduced motion; numbers and text still update */
@media (prefers-reduced-motion: reduce) {
  .rc-rec *, .rc-rec *::before, .rc-rec *::after, .rc-tabs *, .rc-tabs *::before, .rc-tabs *::after, .rc-sweep::after { animation: none !important; transition: none !important; }
  .ring, .ping { display: none; }
  .caret { opacity: 0.55; }
}

/* record not available yet */
.rc-unavail { max-width: 760px; }
.rc-unavail .rc-rec-head { grid-column: auto; }
.rc-unavail-body { padding: 22px 24px 26px; display: grid; gap: 12px; }
.rc-unavail h2 { font-size: clamp(1.6rem, 3vw, 2.1rem); }
.rc-unavail p { max-width: 58ch; }
.rc-unavail .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; margin-top: 4px; }
#record-root > .rc-top:last-child { margin-bottom: 56px; }
@media (max-width: 640px) { .rc-unavail-body { padding: 18px 16px 22px; } }

/* Local preview only: says plainly that this isn't the public record */
.rc-preview { margin: 0 0 12px; padding: 8px 12px; border: 1px dashed var(--an-line-2); border-radius: 6px;
  font: 13px/1.45 var(--an-mono); color: var(--an-ink-2); }