/* Filing Signals — a register, not an essay.
   Deliberately NOT an editorial-serif layout: monospace carries the metadata,
   the palette is cool slate rather than warm paper, corners are square and the
   structure is ruled and dense. Colour is reserved almost entirely for data
   encoding; the one status colour is used only for severity.
   Series slots are the validated categorical set (see charts.py) and are fixed,
   so a signal keeps its colour in tags, row rules and charts alike. */
:root{
  color-scheme:light;
  --bg:#eceff2; --surface:#fff; --surface-2:#f3f5f7; --surface-3:#e2e6ea;
  --line:#d3d9df; --line-strong:#b3bcc5;
  --ink:#0f151b; --ink-2:#39424b; --muted:#5f6a75;
  --rule:#0f151b;
  --alert:#b3261e; --alert-ink:#fff;

  /* Eight validated categorical slots, fixed order. Late filings take a
     neutral rather than a ninth hue: they are the high-volume background
     (60% of events), and a generated ninth would be indistinguishable under
     colour-vision deficiency. Both themes must define every slot - three were
     missing here, so SVG fell back to black on the largest segment. */
  --series-1:#2a78d6; --series-2:#eb6834; --series-3:#1baf7a;
  --series-4:#eda100; --series-5:#e87ba4; --series-6:#008300;
  --series-7:#4a3aa7; --series-8:#e34948; --series-muted:#5f6a75;

  /* The same nine hues as text. The chart palette is chosen to be
     distinguishable as FILLS; used as small uppercase type on a light
     background it was down to 1.9:1 for auditor changes and 2.3:1 for
     CFO departures - present, but not readable. These are the same hues
     with the lightness taken down until each clears 4.5:1 as text, so a
     signal still reads as its own colour everywhere. */
  --series-1-ink:#256bc0; --series-2-ink:#bc4313; --series-3-ink:#137a55;
  --series-4-ink:#916200; --series-5-ink:#ca2362; --series-6-ink:#007d00;
  --series-7-ink:#4a3aa7; --series-8-ink:#d12120; --series-muted-ink:#5f6a75;

  /* The masthead has its own palette, and the same one in both themes.
     Light mode was a white bar on a near-white page on white cards - correct
     colours, no anchor, and it read as a page that had not been designed for
     light. A dark bar is the ordinary way a register or a terminal is topped,
     it gives the eye somewhere to start, and holding it steady across themes
     means the site is recognisably itself either way. Not a new hue: the
     header is the ink colour with a little more blue in it. */
  --head-bg:#16212b; --head-ink:#eef2f6; --head-ink-2:#c3ceda;
  --head-muted:#9dabb8; --head-line:#31404d; --head-hover:#22303c;
  /* The self-check dot sits up here, so its three states need to be legible
     against the bar rather than against the page. */
  --head-ok:#4ec97f; --head-warn:#e0a52b; --head-fail:#ff7a6d;

  --radius:2px; --wrap:1600px; --reading:76ch;
  --wrap-pad:clamp(14px,2.4vw,28px);   /* used by .wrap and by anything
                                          that needs to bleed past it */
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
}
/* Dark is declared twice on purpose: the media query covers the OS setting,
   the attribute scope covers an explicit choice, and the :not() guard lets a
   light choice win even when the OS is dark. */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0b0f13; --surface:#151b21; --surface-2:#1b232a; --surface-3:#232c34;
    --line:#2a343d; --line-strong:#3d4952;
    --ink:#e7ecf1; --ink-2:#b9c3cc; --muted:#8593a0;
    --rule:#3d4952;
    --alert:#ff6b5e; --alert-ink:#1a0f0d;
    --series-1:#3987e5; --series-2:#d95926; --series-3:#199e70;
    --series-4:#c98500; --series-5:#d55181; --series-6:#008300;
    --series-7:#9085e9; --series-8:#e66767; --series-muted:#aab6c2;
    /* Dark was closer but not clean either: green sat at 3.5:1 on a card. */
    --series-1-ink:#3987e5; --series-2-ink:#da5d2b; --series-3-ink:#199e70;
    --series-4-ink:#c98500; --series-5-ink:#d75786; --series-6-ink:#009a00;
    --series-7-ink:#9085e9; --series-8-ink:#e66767; --series-muted-ink:#aab6c2;
  }
}
:root[data-theme="dark"]{
    color-scheme:dark;
    --bg:#0b0f13; --surface:#151b21; --surface-2:#1b232a; --surface-3:#232c34;
    --line:#2a343d; --line-strong:#3d4952;
    --ink:#e7ecf1; --ink-2:#b9c3cc; --muted:#8593a0;
    --rule:#3d4952;
    --alert:#ff6b5e; --alert-ink:#1a0f0d;
    --series-1:#3987e5; --series-2:#d95926; --series-3:#199e70;
    --series-4:#c98500; --series-5:#d55181; --series-6:#008300;
    --series-7:#9085e9; --series-8:#e66767; --series-muted:#aab6c2;
    /* Dark was closer but not clean either: green sat at 3.5:1 on a card. */
    --series-1-ink:#3987e5; --series-2-ink:#da5d2b; --series-3-ink:#199e70;
    --series-4-ink:#c98500; --series-5-ink:#d75786; --series-6-ink:#009a00;
    --series-7-ink:#9085e9; --series-8-ink:#e66767; --series-muted-ink:#aab6c2;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  font-size:15.5px;line-height:1.58;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--wrap-pad)}
a{color:var(--ink);text-decoration-color:var(--line-strong);text-underline-offset:3px}
a:hover{text-decoration-color:currentColor}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--surface);padding:8px;z-index:10}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* The last card was sitting hard against the footer rule. Note the selector:
   <main> also carries .wrap, whose `padding: 0 clamp(...)` shorthand resets
   padding-bottom to zero and outranks a bare element selector. Matching both
   is what makes this apply. */
main.wrap{padding-bottom:96px}
main p{max-width:var(--reading)}

/* ── masthead: a status bar, not a brand banner ───────────── */
.site-head{background:var(--head-bg);color:var(--head-ink-2);
  border-bottom:1px solid var(--head-line);position:sticky;top:0;z-index:5}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;
  gap:18px;flex-wrap:wrap;padding-top:11px;padding-bottom:11px}
.brand{font-family:var(--mono);font-weight:700;font-size:.95rem;color:var(--head-ink);
  text-decoration:none;display:inline-flex;align-items:center;gap:9px;
  letter-spacing:.06em;text-transform:uppercase}
/* The one piece of decoration on the page, and it uses the accent the nav
   already uses for the current tab rather than introducing a tenth colour. */
.dot{width:7px;height:7px;background:var(--series-2);flex:none;border-radius:50%}
.site-head nav{display:flex;gap:0;flex-wrap:wrap;font-size:.8rem;font-family:var(--mono)}
.site-head nav a{color:var(--head-muted);text-decoration:none;padding:5px 11px;
  letter-spacing:.05em;text-transform:uppercase;border-left:1px solid var(--head-line)}
.site-head nav a:first-child{border-left:none}
.site-head nav a:hover{color:var(--head-ink);background:var(--head-hover)}

/* ── section labels ───────────────────────────────────────── */
.eyebrow{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;
  letter-spacing:.12em;color:var(--muted);font-weight:600;margin:0 0 10px;
  padding-bottom:7px;border-bottom:1px solid var(--rule);max-width:none;
  display:flex;justify-content:space-between;gap:14px;align-items:baseline}

/* ── hero ─────────────────────────────────────────────────── */
.hero{padding:clamp(24px,3.4vw,44px) 0 22px;border-bottom:1px solid var(--line);
  margin-bottom:26px}
h1{font-family:var(--sans);font-size:clamp(1.55rem,3.1vw,2.35rem);line-height:1.16;
  letter-spacing:-.028em;margin:0 0 14px;font-weight:700;max-width:22ch;text-wrap:balance}
.lede{font-size:.99rem;color:var(--ink-2);max-width:var(--reading);margin:0;line-height:1.62}

/* Key figures as a monospace data strip. */
.figures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;
  margin:24px 0 0;border-top:1px solid var(--rule);border-left:1px solid var(--line)}
.figures>div:last-child:nth-child(odd){grid-column:1/-1}
.figures>div{padding:11px 13px;border-bottom:1px solid var(--line);
  border-right:1px solid var(--line);background:var(--surface)}
.figures dt{font-family:var(--mono);font-size:.63rem;text-transform:uppercase;
  letter-spacing:.11em;color:var(--muted);font-weight:600;margin-bottom:5px}
.figures dd{margin:0;font-family:var(--mono);font-size:1.3rem;font-weight:700;
  overflow-wrap:anywhere;font-variant-numeric:tabular-nums;
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1}
.figures .dd-date{font-size:1rem;letter-spacing:0}
@media (min-width:1080px){
  .hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
    gap:clamp(28px,3.5vw,56px);align-items:start}
  .figures{grid-template-columns:repeat(2,1fr);margin-top:4px}
}
.mixbar{display:block;width:100%;height:9px;margin:24px 0 0;border-radius:0}

/* ── charts ───────────────────────────────────────────────── */
.chart{margin:0 0 28px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:15px 16px 10px}
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.chart .grid{stroke:var(--line);stroke-width:1}
.chart .axis{fill:var(--muted);font-size:10.5px;font-family:var(--mono);
  font-variant-numeric:tabular-nums;letter-spacing:.02em}
.chart .bar-total{fill:var(--ink-2);font-size:10.5px;font-weight:700;
  font-family:var(--mono);font-variant-numeric:tabular-nums}
.chart .seg{transition:opacity .12s}
.chart svg:hover .seg{opacity:.5}
.chart .seg:hover{opacity:1}
.chart-legend{display:flex;gap:15px;flex-wrap:wrap;margin-bottom:11px;
  font-size:.7rem;color:var(--muted);font-family:var(--mono);text-transform:uppercase;
  letter-spacing:.06em}
.key{display:inline-flex;align-items:center;gap:6px}
.key i{width:9px;height:9px;flex:none}
.chart-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ── rate bars ────────────────────────────────────────────── */
.rates{display:grid;gap:18px;margin:0 0 26px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.rate-head{display:flex;gap:14px;align-items:baseline;justify-content:space-between;
  margin-bottom:7px}
.rate-label{font-size:.92rem;line-height:1.35}
.rate-value{font-family:var(--mono);font-size:1.22rem;font-weight:700;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;flex:none}
.rate-track{height:10px;background:var(--surface-3);overflow:hidden}
.rate-fill{height:100%;background:var(--ink-2);min-width:5px}
.rate-foot{font-family:var(--mono);font-size:.7rem;color:var(--muted);margin-top:5px;
  letter-spacing:.04em}

/* ── controls ─────────────────────────────────────────────── */
.controls{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.search{flex:1 1 260px}
.search input{width:100%;padding:9px 12px;border:1px solid var(--line-strong);
  border-radius:var(--radius);background:var(--surface);color:var(--ink);
  font-size:.9rem;font-family:var(--mono)}
.search input:focus{outline:2px solid var(--ink);outline-offset:-1px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1px solid var(--line-strong);background:var(--surface);
  color:var(--muted);border-radius:var(--radius);padding:8px 13px;font-size:.7rem;
  cursor:pointer;font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em}
.chip:hover{color:var(--ink);background:var(--surface-2)}
.chip.is-on{background:var(--ink);color:var(--surface)}
.count{font-family:var(--mono);color:var(--muted);font-size:.72rem;margin:0 0 16px;
  letter-spacing:.06em;text-transform:uppercase}

/* ── the register ─────────────────────────────────────────── */
.feed{display:grid;gap:12px}
@media (min-width:1120px){ .feed{grid-template-columns:1fr 1fr;align-items:start} }
/* A third column past 1700px. Cards are self-contained, so they tile; the
   prose above them stays at --reading regardless of how wide the page gets. */
@media (min-width:1700px){ .feed{grid-template-columns:repeat(3,1fr)} }
.event{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:15px 17px 15px 19px;position:relative;
  transition:border-color .12s}
.event::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:3px}
.event[data-signal="restatement"]::before{background:var(--series-1)}
.event[data-signal="comment_letter"]::before{background:var(--series-2)}
.event[data-signal="material_weakness"]::before{background:var(--series-3)}
.event[data-signal="auditor_change"]::before{background:var(--series-4)}
.event[data-signal="officer_departure"]::before{background:var(--series-5)}
.event[data-signal="going_concern"]::before{background:var(--series-6)}
.event[data-signal="policy_change"]::before{background:var(--series-7)}
.event[data-signal="revenue_recognition"]::before{background:var(--series-8)}
.event[data-signal="late_filing"]::before{background:var(--series-muted)}
.event:hover{border-color:var(--line-strong)}
.event-head{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:9px}
.event-head time{margin-left:auto;color:var(--muted);font-size:.72rem;
  font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.event-title{font-size:1rem;line-height:1.38;margin:0 0 8px;letter-spacing:-.012em;
  font-weight:650}
.event-meta{font-size:.8rem;color:var(--muted);margin:0 0 11px;font-family:var(--mono);
  letter-spacing:.02em}
.event-meta a{font-weight:600;font-family:var(--sans);letter-spacing:0}
.sep{margin:0 6px;opacity:.55}
.ticker{font-family:var(--mono);font-size:.72rem;background:var(--surface-3);
  color:var(--ink-2);padding:1px 5px;margin-left:6px;letter-spacing:.04em}

.tag{font-family:var(--mono);font-size:.63rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;padding:3px 7px;border-radius:0;white-space:nowrap;
  border:1px solid currentColor}
.tag-restatement{color:var(--series-1-ink)}
.tag-comment_letter{color:var(--series-2-ink)}
.tag-material_weakness{color:var(--series-3-ink)}
.tag-auditor_change{color:var(--series-4-ink)}
.tag-officer_departure{color:var(--series-5-ink)}
.tag-going_concern{color:var(--series-6-ink)}
.tag-policy_change{color:var(--series-7-ink)}
.tag-revenue_recognition{color:var(--series-8-ink)}
.tag-late_filing{color:var(--series-muted-ink)}
.tag-beta{color:var(--muted);letter-spacing:.06em;font-weight:600}
.tag-conf{color:var(--muted);border-style:dashed;font-weight:500;letter-spacing:.05em}
.tag-sev-high{color:var(--alert-ink);background:var(--alert);border-color:var(--alert)}
/* Elevated sits below high and must read that way: outlined in the alert
   colour rather than filled with it, so the two are ranked at a glance. */
.tag-sev-elevated{color:var(--alert);border-color:var(--alert);background:transparent}

.ai{background:var(--surface-2);border-left:2px solid var(--line-strong);
  padding:11px 13px;margin:0 0 11px}
.ai-label{font-family:var(--mono);font-size:.62rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.11em;color:var(--muted)}
.ai p{margin:5px 0 0;font-size:.92rem}
.ai .why{color:var(--muted);font-size:.86rem}

.subclass{font-size:.85rem;margin:0 0 9px;display:flex;gap:8px;align-items:center;
  flex-wrap:wrap}
.firms{font-family:var(--mono);font-weight:650;font-size:.83rem;letter-spacing:.01em}
.transition{display:flex;gap:9px;align-items:center;flex-wrap:wrap;font-size:.8rem;
  margin:0 0 11px;padding:8px 11px;background:var(--surface-2);font-family:var(--mono);
  letter-spacing:.01em}
.transition .from{color:var(--muted);text-decoration:line-through}
.transition .to{font-weight:700}
.transition .arrow,.arrow{color:var(--ink);font-weight:700}
.caveat{font-size:.83rem;color:var(--ink-2);background:var(--surface-2);
  border-left:2px solid var(--alert);padding:9px 12px;margin:0 0 11px}
blockquote{margin:0 0 11px;padding:2px 0 2px 13px;border-left:1px solid var(--line-strong);
  color:var(--ink-2);font-size:.87rem;line-height:1.6}
.evidence{margin:0 0 11px;font-size:.82rem}
.evidence summary{cursor:pointer;color:var(--muted);font-weight:600;font-family:var(--mono);
  font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.evidence dl{display:grid;grid-template-columns:auto 1fr;gap:4px 13px;margin:10px 0 0;
  font-family:var(--mono);font-size:.76rem}
.evidence dt{color:var(--muted)}
.evidence dd{margin:0;word-break:break-word}
.evidence ul{margin:6px 0 0;padding-left:17px;color:var(--muted)}
.links{margin:0;font-size:.78rem;display:flex;gap:15px;flex-wrap:wrap;
  font-family:var(--mono);letter-spacing:.04em}

/* ── chains, tables, misc ─────────────────────────────────── */
.chain{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-direction:column;gap:8px}
.chain li{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-left:17px;
  position:relative}
.chain li::before{content:"";position:absolute;left:2px;top:8px;width:6px;height:6px;
  background:var(--ink-2)}
.chain li:not(:last-child)::after{content:"";position:absolute;left:4.5px;top:16px;
  bottom:-10px;width:1px;background:var(--line-strong)}
.chain time{color:var(--muted);font-family:var(--mono);font-size:.75rem;
  font-variant-numeric:tabular-nums;flex:none}
.chain-note{color:var(--muted);font-family:var(--mono);font-size:.72rem}
.chain-box{background:var(--surface);border:1px solid var(--line);padding:15px 18px;
  margin:0 0 20px}
.chain-box h2{margin:0;font-size:.72rem;font-family:var(--mono);text-transform:uppercase;
  letter-spacing:.11em;color:var(--muted)}
.signal-block{border-top:1px solid var(--line);padding:20px 0}
.signal-block h2{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:.95rem;
  margin:0 0 8px;text-transform:none;letter-spacing:-.01em;font-family:var(--sans)}
.mini{list-style:none;padding:0;margin:11px 0 0;font-size:.87rem}
.mini li{padding:6px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;flex-wrap:wrap}
.mini time{color:var(--muted);font-family:var(--mono);font-size:.75rem;
  font-variant-numeric:tabular-nums;flex:none}
.ladder{max-width:62ch}.ladder li{margin:5px 0}
.notice{background:var(--surface-2);border-left:2px solid var(--line-strong);
  padding:13px 15px;font-size:.9rem;max-width:var(--reading)}
code{font-family:var(--mono);font-size:.88em;background:var(--surface-3);padding:1px 4px}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);
  background:var(--surface)}
table{border-collapse:collapse;width:100%;font-size:.83rem;min-width:620px;
  font-family:var(--mono)}
th,td{text-align:left;padding:9px 13px;border-bottom:1px solid var(--line);white-space:nowrap}
th{font-size:.65rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);
  background:var(--surface-2);font-weight:700}
tr:last-child td{border-bottom:none}
td{font-variant-numeric:tabular-nums}
.net-pos{color:var(--series-6-ink)}.net-neg{color:var(--series-2-ink)}
.empty-state{background:var(--surface);border:1px solid var(--line);padding:34px;
  text-align:center}
.empty-state h2{margin-top:0}
.empty{color:var(--muted);text-align:center;padding:34px;font-family:var(--mono);
  font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}
.crumb{font-family:var(--mono);font-size:.74rem;margin:22px 0 8px;text-transform:uppercase;
  letter-spacing:.07em}
.muted{color:var(--muted)}
h2{font-family:var(--sans);font-size:clamp(1.05rem,1.7vw,1.28rem);letter-spacing:-.018em;
  margin:36px 0 12px;font-weight:700}
.site-foot{border-top:2px solid var(--rule);background:var(--surface);
  padding:32px 0 40px;font-size:.83rem;margin-top:24px}
.site-foot p{margin:0 0 8px;max-width:78ch}
.colophon{font-family:var(--mono);font-size:.7rem;color:var(--muted);
  text-transform:uppercase;letter-spacing:.1em;margin:0 0 14px!important;
  padding-bottom:13px;border-bottom:1px solid var(--line)}

@media (max-width:620px){
  body{font-size:15px}
  /* The header is sticky, so every row costs screen for the whole session.
     Three stacked rows came to 155px on a 812px phone - roughly a fifth of the
     viewport. Collapsed to one row: the wordmark holds its width and the nav
     scrolls beside it. The provenance line moves to the footer, where it is
     read once rather than carried forever. */
  /* The nav gets its own full-width row. Sharing one line with the brand and
     the theme toggle left it about 190px -- barely one and a half tabs -- so
     reaching anything meant scrolling a strip most of which was off-screen. */
  .site-head .wrap{flex-wrap:wrap;gap:0 10px;padding-top:0;padding-bottom:0;
    align-items:center}
  .site-head .brand{min-height:44px;display:inline-flex;align-items:center}
  .brand{font-size:.8rem;letter-spacing:.05em;flex:none}
  .brand .dot{width:6px;height:6px}
  /* flex-start, not flex-end: with flex-end the overflow runs off the LEFT
     edge, where scrolling cannot reach it - the first four links were simply
     unreachable. Overflow must run right so the scroll gesture recovers it. */
  .site-head nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;min-width:0;
    justify-content:flex-start;
    flex:0 0 100%;order:3;border-top:1px solid var(--line);
    margin-inline:calc(-1 * var(--wrap-pad));padding-inline:var(--wrap-pad)}
  .site-head nav::-webkit-scrollbar{display:none}
  .site-head nav a{white-space:nowrap;border-left:none}
  .figures{grid-template-columns:1fr}
  .figures dd{font-size:1.15rem}
  .event{padding:13px 14px 13px 16px}
  .event-head time{margin-left:0;width:100%}
  .chart{padding:12px 10px 6px}
  .chart-scroll svg{min-width:660px}
  .rates{padding:15px}
  .rate-head{flex-direction:column;gap:1px}
  th,td{padding:8px 10px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* masthead status line: the site states its own provenance */
.statusline{width:100%;margin:9px 0 0;padding-top:8px;
  border-top:1px solid var(--head-line);
  display:flex;gap:20px;flex-wrap:wrap;font-family:var(--mono);font-size:.64rem;
  color:var(--head-muted);text-transform:uppercase;letter-spacing:.11em}
/* The dot reports the self-checks rather than being decorative, so a failing
   check is visible on every page instead of only on /status. */
.statusline .live{margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  color:var(--head-muted);text-decoration:none}
.statusline .live:hover{color:var(--head-ink)}
.statusline .live::before{content:"";width:5px;height:5px;border-radius:50%;
  background:var(--head-muted)}
.statusline .live-ok::before{background:var(--head-ok)}
.statusline .live-warn::before{background:var(--head-warn)}
.statusline .live-fail::before{background:var(--head-fail)}
.statusline .live-fail{color:var(--head-fail);font-weight:700}
.statusline .live-warn{color:var(--head-warn)}
@media (max-width:620px){
  /* Must live after the base .statusline rule, or source order wins. */
  .statusline{display:none}
}


/* ── theme toggle ─────────────────────────────────────────── */
.theme-toggle{display:inline-flex;gap:5px;margin-left:16px}
.theme-toggle button{appearance:none;border:1px solid var(--head-line);
  border-radius:var(--radius);background:transparent;color:var(--head-muted);
  font-family:var(--mono);font-size:.62rem;text-transform:uppercase;
  letter-spacing:.09em;padding:6px 10px;cursor:pointer;line-height:1}
.theme-toggle button:hover{color:var(--head-ink);background:var(--head-hover)}
.theme-toggle button[aria-pressed="true"]{background:var(--head-ink);
  color:var(--head-bg);border-color:var(--head-ink)}
/* On a phone the three-button group costs more width than the nav can spare,
   and burying it in the footer put it several hundred entries away. One
   compact button in the header cycles instead: same three states, ~34px. */
.theme-cycle{display:none}
@media (max-width:620px){
  .site-head .theme-toggle{display:none}
  .theme-cycle{display:inline-flex;align-items:center;justify-content:center;
    flex:none;width:34px;min-height:44px;border:none;background:transparent;
    color:var(--head-muted);font-size:1rem;cursor:pointer;padding:0;line-height:1}
  .theme-cycle:hover,.theme-cycle:focus-visible{color:var(--head-ink)}
}

/* ── size filter ──────────────────────────────────────────── */
.controls-size{margin-top:2px;margin-bottom:22px;gap:12px}
.filter-label{font-family:var(--mono);font-size:.64rem;text-transform:uppercase;
  letter-spacing:.11em;color:var(--muted);font-weight:600}
.filter-note{font-family:var(--mono);font-size:.62rem;color:var(--muted);
  letter-spacing:.05em}
.float{font-family:var(--mono);font-weight:650;color:var(--ink-2)}
@media (max-width:620px){ .filter-note{display:none} }

/* ── self-checks ──────────────────────────────────────────── */
.checks{list-style:none;padding:0;margin:14px 0 18px;border-top:1px solid var(--line)}
.check{display:grid;grid-template-columns:12px 1fr auto;gap:10px 12px;align-items:baseline;
  padding:10px 2px;border-bottom:1px solid var(--line)}
.check-dot{width:8px;height:8px;border-radius:50%;align-self:center;background:var(--muted)}
.check-ok .check-dot{background:var(--series-6)}
.check-warn .check-dot{background:var(--series-4)}
.check-fail .check-dot{background:var(--alert)}
.check-name{font-weight:650;font-size:.9rem}
.check-detail{grid-column:2;color:var(--muted);font-family:var(--mono);font-size:.74rem;
  letter-spacing:.02em}
.check-status{font-family:var(--mono);font-size:.62rem;text-transform:uppercase;
  letter-spacing:.11em;color:var(--muted);grid-row:1;grid-column:3}
.check-fail .check-status{color:var(--alert);font-weight:700}
.check-warn .check-status{color:var(--series-4-ink);font-weight:700}
.rights{font-size:.79rem;color:var(--muted);max-width:74ch;
  padding-top:12px;border-top:1px solid var(--line);margin-top:14px!important}

/* Non-comparable entries are context, not signal: a reverse merger carries the
   CIK across, so there is no "before" to have changed. */
.event.is-context{opacity:.72}
.event.is-context:hover{opacity:1}
.event.is-context::before{opacity:.45}
.chain-gap{font-family:var(--mono);font-size:.72rem;color:var(--muted);
  border:1px solid var(--line);padding:1px 6px;border-radius:3px}
.chain-span{font-family:var(--mono);font-size:.72rem;color:var(--muted);
  font-weight:400;letter-spacing:.04em;margin-left:10px}

/* ── comment letter topics ────────────────────────────────── */
.topics{display:grid;gap:9px;margin:14px 0 26px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.topic{display:grid;grid-template-columns:minmax(140px,190px) 1fr 44px;gap:14px;align-items:center}
.topic-name{font-size:.88rem}
.topic-bar{background:var(--surface-3);height:10px;display:block}
.topic-bar i{display:block;height:100%;background:var(--series-2);min-width:3px}
.topic-n{font-family:var(--mono);font-size:.8rem;color:var(--muted);text-align:right;
  font-variant-numeric:tabular-nums}
.feed-single{grid-template-columns:1fr!important}
@media (max-width:620px){ .topic{grid-template-columns:1fr;gap:4px} .topic-n{text-align:left} }

/* ── long-list rendering cost ─────────────────────────────────
   Cards and register rows are skipped entirely by the browser until they
   approach the viewport. The size hints stop the scrollbar jumping as each
   one is realised. This is what keeps a long feed cheap on a phone, where
   layout -- not download -- is the expensive part. */
.feed .event { content-visibility: auto; contain-intrinsic-size: auto 280px; }
.mini li     { content-visibility: auto; contain-intrinsic-size: auto 26px; }

/* Any element given `display` by a rule outranks the [hidden] attribute's
   own display:none. `.mini li{display:flex}` did exactly that, so filtering
   a signal page set hidden on every row and changed nothing on screen. */
[hidden]{display:none!important}

/* ── current page, and a nav you can hit on a phone ───────────
   The tabs scroll horizontally on a narrow screen, so "where am I" is not
   obvious from position alone: the current tab is marked rather than implied.
   Targets are sized for a thumb -- 44px is the usual minimum -- which the
   previous 13px/8px padding did not reach. */
.site-head nav a[aria-current="page"]{color:var(--head-ink);background:var(--head-hover);
  box-shadow:inset 0 -2px 0 var(--series-2)}
.site-head nav a:focus-visible{outline:2px solid var(--series-2);outline-offset:-2px}

@media (max-width:760px){
  /* A tab sliced mid-word at the scroll edge reads as a rendering fault. The
     fade says "there is more this way" instead, and snapping stops tabs
     landing half-cut. */
  .site-head nav{scroll-padding-inline:12px;scroll-snap-type:x proximity;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,
      #000 calc(100% - 14px),transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 14px,
      #000 calc(100% - 14px),transparent 100%)}
  .site-head nav a{scroll-snap-align:center}
  .site-head nav a{padding:14px 13px;font-size:.72rem;min-height:44px;
    display:flex;align-items:center}
  .site-head nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--series-2)}
}

/* ── a review, as a conversation ──────────────────────────── */
.exchange{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:14px}
.exchange li{border-left:2px solid var(--line);padding-left:14px}
.exchange-head{display:flex;gap:9px;align-items:baseline;flex-wrap:wrap;margin:0 0 6px;
  font-family:var(--mono);font-size:.72rem;color:var(--muted)}
.exchange blockquote{margin:0 0 6px}

/* ── refine panel ─────────────────────────────────────────────
   Secondary filters behind one disclosure. The summary carries the active
   refinements so nothing is ever filtered invisibly. */
.refine{border:1px solid var(--line);border-radius:var(--radius);
  background:var(--surface);margin:0 0 14px}
.refine summary{cursor:pointer;padding:11px 15px;display:flex;gap:11px;
  align-items:baseline;font-family:var(--mono);font-size:.74rem;
  text-transform:uppercase;letter-spacing:.09em;color:var(--muted);
  list-style:none;min-height:44px;box-sizing:border-box}
.refine summary::-webkit-details-marker{display:none}
.refine summary::before{content:"+";font-size:.95rem;line-height:1;color:var(--muted)}
.refine[open] summary::before{content:"\2212"}
.refine summary:hover{color:var(--ink)}
.refine-active{font-family:var(--sans);text-transform:none;letter-spacing:0;
  font-size:.8rem;color:var(--muted)}
.refine-active.is-set{color:var(--series-2-ink)}
.refine-body{padding:2px 15px 15px;display:grid;gap:15px;
  border-top:1px solid var(--line)}
@media (min-width:900px){ .refine-body{grid-template-columns:auto auto 1fr;gap:26px;align-items:start} }
.refine-group{display:grid;gap:7px;align-content:start}
.select{font:inherit;font-size:.85rem;padding:9px 11px;min-height:40px;
  border:1px solid var(--line);border-radius:var(--radius);
  background:var(--surface-2);color:var(--ink);max-width:16rem}
.rate-note{font-size:.8rem;color:var(--muted);margin:0 0 14px;max-width:var(--reading)}

/* ── company directory ────────────────────────────────────── */
.company-list li{flex-wrap:wrap}
.company-list .company-signals{display:inline-flex;gap:4px;flex-wrap:wrap;margin-left:auto}
.company-list .tag{font-size:.6rem;padding:1px 5px}
@media (max-width:620px){ .company-list .company-signals{margin-left:0;width:100%} }

/* ── results from outside the current page ────────────────── */
.elsewhere{border:1px solid var(--line);border-left:2px solid var(--series-2);
  border-radius:var(--radius);background:var(--surface);padding:12px 15px;margin:0 0 14px}
.elsewhere-head{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;
  letter-spacing:.09em;color:var(--muted);margin:0 0 7px}
.elsewhere .mini li{border-bottom:none;padding:3px 0}

/* ── run it yourself ──────────────────────────────────────── */
.actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:0;border:1px solid var(--line);margin:10px 0 6px}
.actions .action{display:block;padding:13px 15px;text-decoration:none;
  border-left:1px solid var(--line);background:var(--surface)}
.actions .action:first-child{border-left:none}
.actions .action:hover{background:var(--surface-2)}
.actions .action strong{display:block;font-family:var(--mono);font-size:.72rem;
  text-transform:uppercase;letter-spacing:.06em;color:var(--ink)}
.actions .action strong::after{content:" \2197";color:var(--muted)}
.actions .action span{display:block;margin-top:6px;font-size:.86rem;
  color:var(--ink-2);max-width:52ch}
.actions .action:focus-visible{outline:2px solid var(--series-2);outline-offset:-2px}
@media (max-width:620px){
  .actions{grid-template-columns:1fr}
  .actions .action{border-left:none;border-top:1px solid var(--line)}
  .actions .action:first-child{border-top:none}
}

/* Only ever visible when the data has stopped moving. */
.statusline .behind{color:var(--head-warn);font-weight:700;text-decoration:none;
  display:inline-flex;align-items:center;gap:6px}
.statusline .behind::before{content:"";width:5px;height:5px;border-radius:50%;
  background:var(--head-warn)}
.statusline .behind:hover{color:var(--head-ink)}
