/* SequelSEC — one layer, one set of decisions.
   Replaces eight appended layers that redefined .card seven times and used
   eight different corner radii against each other. Everything below is stated
   once. Colour is only ever a token, so dark mode redefines the tokens and
   nothing else. */

:root{
  --ink:#1c1b18; --muted:#5f5b53; --faint:#8b857b;
  --line:#dcd6ca; --rule:#eae5db;
  --paper:#f4f1ea; --surface:#fffefb; --surface-sunk:#f8f5ee;
  --accent:#0f5b52; --accent-soft:#e4efec; --accent-ink:#0a4038;
  --negative:#9a3324; --positive:#0f5b52; --warn-line:#b8860b; --warn-bg:#fbf6e9;
  --sans:"Aptos","Segoe UI Variable Text","Segoe UI",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Times New Roman",serif;
  --mono:ui-monospace,"Cascadia Mono",SFMono-Regular,"SF Mono",Consolas,"Liberation Mono",monospace;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:36px;
}
html[data-theme="dark"]{
  --ink:#ece8df; --muted:#a29c91; --faint:#837d72;
  --line:#343128; --rule:#282620;
  --paper:#14130f; --surface:#1b1a15; --surface-sunk:#211f19;
  --accent:#63b8a8; --accent-soft:#1d2a26; --accent-ink:#8fd2c4;
  --negative:#d98a72; --positive:#63b8a8; --warn-line:#7a6528; --warn-bg:#211d12;
}

*{box-sizing:border-box}
html{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.55 var(--sans);
  -webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0;color:inherit}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--surface);padding:var(--s2) var(--s3);z-index:20}
.skip-link:focus{left:var(--s3);top:var(--s3)}
[hidden]{display:none!important}

/* ---- type ------------------------------------------------------------- */
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.01em}
h1{font-family:var(--serif);font-weight:400;font-size:38px;line-height:1.12;letter-spacing:-.02em}
h1 span{color:var(--muted)}
h2{font-size:22px}
h3{font-size:16px}
.subheading{font-size:17px;margin:var(--s5) 0 var(--s2)}
small,.unit-note,.method-note,.company-meta,.head-note{color:var(--muted);font-size:13px}
.eyebrow{font-size:11px;letter-spacing:.14em;font-weight:600;color:var(--muted);margin:0 0 var(--s2);text-transform:uppercase}
code{font-family:var(--mono);font-size:.92em}
.prose{max-width:74ch}
.prose p{margin:var(--s3) 0}

/* ---- header ----------------------------------------------------------- */
header{display:flex;align-items:center;gap:var(--s5);padding:0 4%;height:56px;
  background:var(--surface);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:var(--s2);text-decoration:none;color:var(--ink);
  font-weight:700;font-size:16px;letter-spacing:-.02em;white-space:nowrap}
.brand-mark{width:3px;height:17px;background:var(--accent)}
.brand-name-accent{color:var(--accent)}
nav{display:flex;gap:var(--s4)}
.nav{color:var(--muted);font-size:14px;padding:18px 0;border-bottom:2px solid transparent;text-decoration:none}
.nav.active,.nav:hover{color:var(--ink)}
.nav.active{border-bottom-color:var(--accent)}
.header-tools{margin-left:auto;display:flex;align-items:center;gap:var(--s3)}
.theme-toggle{color:var(--muted);font-size:13px;display:flex;align-items:center;gap:6px}
.theme-toggle:hover{color:var(--ink)}

/* ---- page frame ------------------------------------------------------- */
main{max-width:1500px;margin:0 auto;padding:0 4% var(--s6)}
/* Identity lives in the header. This is a status line, not a hero: the page
   starts with the data, because that is what the site is for. */
.statusbar{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s4);
  padding:var(--s2) 0;margin-bottom:var(--s4);border-bottom:1px solid var(--line);
  font-size:12px;color:var(--muted)}
.statusbar-what{color:var(--ink);font-weight:600}
.statusbar #dataset-count{color:var(--ink)}
.statusbar-scope{margin-left:auto;text-align:right}
.section-title{display:flex;justify-content:space-between;align-items:start;gap:var(--s5);margin:var(--s5) 0}
#notice:not(:empty){border-left:3px solid var(--warn-line);background:var(--warn-bg);
  padding:var(--s3) var(--s4);margin-bottom:var(--s4);font-size:14px}

/* ---- new filings strip ------------------------------------------------ */
.filings-feed{border-top:1px solid var(--line);padding-top:var(--s4);margin-bottom:var(--s5)}
.feed-head{display:flex;align-items:baseline;gap:var(--s3);margin-bottom:var(--s3)}
.feed-head h2{font-size:15px;font-weight:600}
.reel-wrap{display:flex;align-items:center;gap:var(--s2)}
.reel{display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;
  flex:1;min-width:0}
.reel::-webkit-scrollbar{height:6px}
.reel::-webkit-scrollbar-thumb{background:var(--line)}
.reel-item{scroll-snap-align:start;flex:0 0 auto;min-width:148px;padding:var(--s2) var(--s4) var(--s2) 0;
  display:flex;flex-direction:column;gap:1px}
.reel-item+.reel-item{border-left:1px solid var(--rule);padding-left:var(--s4)}
.reel-item .company-link{font-weight:600;font-size:14px}
.reel-meta{font-size:11px;color:var(--muted);white-space:nowrap}
.reel-rev{font-family:var(--serif);font-size:19px;letter-spacing:-.01em;white-space:nowrap}
.reel-change{font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
.reel-change.up{color:var(--positive)}
.reel-change.down{color:var(--negative)}
.reel-change.flat{color:var(--muted)}
.reel-item small{font-size:10px;color:var(--faint);text-transform:uppercase;letter-spacing:.05em}
.reel-nav{flex:0 0 auto;align-self:center;border:1px solid var(--line);color:var(--muted);
  width:26px;height:26px;line-height:1;font-size:12px;background:transparent}
.reel-nav:hover{background:var(--accent-soft);color:var(--ink)}
@media(max-width:700px){.reel-nav{display:none}}

/* ---- workspace -------------------------------------------------------- */
.workspace{display:grid;grid-template-columns:220px minmax(0,1fr);
  background:var(--surface);border:1px solid var(--line)}
aside{border-right:1px solid var(--line);padding:var(--s4);background:var(--surface-sunk)}
.field-label{display:block;font-size:12px;font-weight:600;margin-bottom:6px;color:var(--muted)}
input,select,textarea{width:100%;border:1px solid var(--line);background:var(--surface);
  padding:7px 9px;font-size:14px;border-radius:0}
.aside-label{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin:var(--s5) 0 var(--s2)}
#company-list{max-height:72vh;overflow-y:auto}
.company-option{display:block;width:100%;text-align:left;padding:6px var(--s2);
  border-left:2px solid transparent;color:var(--ink)}
.company-option strong{font-size:13px;font-weight:600}
.company-option span{display:block;font-size:11px;color:var(--muted);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
/* Size beside the name: a shell and a large filer are otherwise identical in a
   list, and the only way to tell them apart was to open both. */
.company-option .company-size{display:block;font-size:10px;color:var(--faint);
  letter-spacing:.02em}
.peer-size{display:block;font-size:10px;color:var(--faint)}
.pager{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);
  flex-wrap:wrap;margin:var(--s3) 0;font-size:12px}
.pager span{color:var(--muted);font-variant-numeric:tabular-nums}
.pager button[disabled]{opacity:.4;cursor:default}
.filter-bar{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;margin:var(--s3) 0}
.filter-bar input{flex:1 1 20rem;max-width:32rem}
.filter-bar small{color:var(--muted);font-size:12px}
.directory-list.counted li{display:flex;justify-content:space-between;gap:var(--s2);align-items:baseline}
.row-count{color:var(--faint);font-size:11px;font-variant-numeric:tabular-nums}
.empty-actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s3) 0}
.company-option:hover{background:var(--accent-soft)}
.company-option.active{background:var(--accent-soft);border-left-color:var(--accent)}
.coverage-status{display:block;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
#company-panel{padding:var(--s5);min-width:0}

/* ---- company header --------------------------------------------------- */
.company-head{display:flex;justify-content:space-between;gap:var(--s4);align-items:start;
  padding-bottom:var(--s4);border-bottom:1px solid var(--line)}
.company-head h2{font-family:var(--serif);font-weight:400;font-size:27px;margin:6px 0 4px}
.ticker-chip{display:inline-block;background:var(--ink);color:var(--paper);padding:1px 6px;
  font-size:11px;letter-spacing:.08em;font-weight:600}
.class-chip{display:inline-block;border:1px solid var(--line);color:var(--muted);
  padding:0 6px;font-size:11px;text-transform:capitalize;white-space:nowrap}
.company-actions{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;justify-content:flex-end}
.company-actions select{width:auto}
.period-chip{border:1px solid var(--line);padding:6px var(--s2);font-size:13px;white-space:nowrap;color:var(--muted)}

/* ---- headline figures: rules, not boxes ------------------------------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:var(--s4) 0;
  border-bottom:1px solid var(--line)}
.card{padding:var(--s3) var(--s4) var(--s4) 0}
.card+.card{border-left:1px solid var(--rule);padding-left:var(--s4)}
.card-label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}
.card .value,.stat-number{display:block;font-family:var(--serif);font-weight:400;font-size:30px;
  letter-spacing:-.02em;margin-top:5px;line-height:1.1}
.stat-number.range{font-size:19px}
.metric-cards{grid-template-columns:repeat(3,1fr)}
.value{text-align:inherit;white-space:nowrap}
button.value:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--accent)}
.missing{color:var(--faint)}
.negative{color:var(--negative)}

/* ---- chart ------------------------------------------------------------ */
.chart-box{margin:var(--s5) 0;padding-bottom:var(--s4);border-bottom:1px solid var(--line)}
.chart-head{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;margin-bottom:var(--s3)}
.chart-scale{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);padding-bottom:3px}
.bar-chart{height:112px;display:flex;align-items:end;gap:6px;padding-top:var(--s1);
  border-top:1px dashed var(--rule);border-bottom:1px solid var(--ink)}
.bar-col{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:end;text-align:center}
.bar{background:var(--line);min-height:2px}
.bar-col:last-child .bar{background:var(--accent)}
.bar-col small{font-size:10px;margin-top:5px}

/* ---- tables: the product ---------------------------------------------- */
.statement-tabs{display:flex;gap:var(--s4);margin:var(--s5) 0 var(--s3);border-bottom:1px solid var(--line)}
.statement-tabs button{font-size:13px;color:var(--muted);padding:0 0 var(--s2);
  border-bottom:2px solid transparent}
.statement-tabs button.active{color:var(--ink);border-bottom-color:var(--accent)}
.table-wrap{overflow:auto;max-width:100%;max-height:78vh;border:1px solid var(--line);background:var(--surface)}
/* Fifty rows of figures is further than anyone remembers which column is which.
   The header stays put while the body scrolls under it; the container scrolls
   rather than the page, because these tables are also wider than the screen. */
.table-wrap thead th{position:sticky;top:0;z-index:2;background:var(--surface)}
.table-wrap thead th::after{content:'';position:absolute;left:0;right:0;bottom:0;
  height:1px;background:var(--line)}
@media (max-height:640px){.table-wrap{max-height:none}}
table{border-collapse:collapse;width:100%;font-size:14px;white-space:nowrap;
  font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1}
th,td{text-align:right;padding:6px var(--s3);border-bottom:1px solid var(--rule)}
td{letter-spacing:-.01em}
td:first-child{letter-spacing:0;font-weight:500}
th{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.06em;
  background:var(--surface-sunk);position:sticky;top:0}
th:first-child,td:first-child{text-align:left;position:sticky;left:0;background:var(--surface);z-index:1}
th:first-child{background:var(--surface-sunk);z-index:2}
tbody tr:hover td{background:var(--accent-soft)}
tbody tr:last-child td{border-bottom:0}
caption{text-align:left}

/* ---- links and chips in tables ---------------------------------------- */
.company-link,.metric-link,.concept-link,.peer-link{color:var(--accent);text-align:left}
.company-link:hover,.metric-link:hover,.concept-link:hover,.peer-link:hover{text-decoration:underline}
.company-link{font-weight:600}
.screen-name{display:block;color:var(--muted);font-size:11px;font-weight:400;max-width:230px;
  overflow:hidden;text-overflow:ellipsis}

/* ---- buttons ---------------------------------------------------------- */
.primary,.secondary,.button-link{display:inline-block;padding:7px var(--s3);font-size:13px;
  border:1px solid var(--line);text-decoration:none;white-space:nowrap;line-height:1.5}
.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.secondary,.button-link{background:var(--surface);color:var(--ink)}
.secondary:hover,.button-link:hover{background:var(--accent-soft)}
.inline-actions{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap}

/* ---- screener --------------------------------------------------------- */
.query-panel{background:var(--surface);border:1px solid var(--line);padding:var(--s5)}
.query-title{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s4);margin-bottom:var(--s3)}
.formula-editor textarea,textarea{font-family:var(--mono);font-size:15px;min-height:76px;resize:vertical}
.formula-status,.formula-example{font-size:12px;color:var(--muted);margin-top:6px}
.query-bottom{display:flex;justify-content:space-between;gap:var(--s4);align-items:center;margin-top:var(--s3)}
.presets,.compare-presets,.ranking-presets{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center;margin:var(--s4) 0}
.presets span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.presets button,.compare-presets button,.ranking-presets button{border:1px solid var(--line);
  padding:4px var(--s2);font-size:12px;color:var(--muted)}
.presets button:hover,.compare-presets button:hover,.ranking-presets button:hover{color:var(--ink);background:var(--accent-soft)}
/* the catalog is a <details>; only the inner list is a grid */
.function-grid,.function-suggestions{display:grid;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:0 var(--s5);margin-top:var(--s3)}
.function-grid button,.function-suggestions button{text-align:left;display:block;
  padding:var(--s2) 0;border-bottom:1px solid var(--rule);width:100%}
.function-grid code{display:block;color:var(--accent);font-size:12px}
.function-grid span{display:block;font-size:12px;color:var(--muted)}
.function-catalog{margin-top:var(--s4);border-top:1px solid var(--rule);padding-top:var(--s3)}
.function-catalog>summary{font-size:13px;color:var(--muted);cursor:pointer}
.function-catalog>p{font-size:12px;color:var(--muted);margin:var(--s2) 0}
.syntax-reference{font-size:12px;color:var(--muted);margin-top:var(--s4);
  border-top:1px solid var(--rule);padding-top:var(--s3)}
.syntax-reference strong{display:block;color:var(--ink);margin-bottom:4px}
.syntax-reference span{display:block;margin:2px 0}
/* label, control, hint: each on its own line */
.as-of-control label,.as-of-control small,.screen-columns>summary,.history-picker label{display:block}
.as-of-control label{font-size:12px;font-weight:600;color:var(--muted);margin-bottom:4px}
.as-of-control small{margin-top:4px}
.screen-columns>summary,.visual-builder>summary,.history-picker>summary{font-size:13px;color:var(--muted);cursor:pointer}
.visual-builder,.as-of-control,.screen-columns,.history-picker{margin-top:var(--s4);
  border-top:1px solid var(--rule);padding-top:var(--s3)}
.screen-column-option{display:inline-flex;align-items:center;gap:6px;margin:0 var(--s3) 6px 0;font-size:12px}
.screen-column-option input{width:auto}
.screen-sort-label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.screen-sort-label select{width:auto}
.result-note,.ranking-result-note{display:flex;justify-content:space-between;align-items:baseline;
  gap:var(--s3);margin:var(--s5) 0 var(--s2);font-size:13px;color:var(--muted)}
.result-note strong{color:var(--ink)}
.interpretation{border-left:2px solid var(--accent);padding:var(--s2) var(--s3);background:var(--surface-sunk);
  font-size:13px;margin-bottom:var(--s3)}
.interpretation code{display:block;color:var(--accent);margin-top:4px}

/* ---- compare ---------------------------------------------------------- */
.compare-controls,.compare-picker-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}
.compare-picker-heading,.ranking-heading{font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin-bottom:var(--s2)}
.compare-options,.ranking-options,.metric-option,.compare-selected{max-height:280px;overflow:auto;
  border:1px solid var(--line);background:var(--surface)}
.compare-option,.ranking-options button,.metric-option{display:block;width:100%;text-align:left;
  padding:5px var(--s2);font-size:13px;border-bottom:1px solid var(--rule)}
.compare-option:hover,.ranking-options button:hover{background:var(--accent-soft)}
.ranking-options button.selected{background:var(--accent-soft);font-weight:600}
.compare-chip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);
  padding:2px var(--s2);font-size:12px;margin:0 5px 5px 0}
.compare-picker-count,.comparison-caption{font-size:12px;color:var(--muted)}
.compare-period select,.compare-search{width:auto}
.compare-results-head{display:flex;justify-content:space-between;align-items:baseline;margin:var(--s4) 0 var(--s2)}
.compare-empty,.empty{padding:var(--s6) var(--s4);text-align:center;color:var(--muted)}
.summary-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;
  border-top:1px solid var(--line);margin:var(--s4) 0}
.summary-company{display:block;text-align:left;padding:var(--s3) var(--s4) var(--s3) 0;color:var(--ink)}
.summary-company+.summary-company{border-left:1px solid var(--rule);padding-left:var(--s4)}
.summary-company span{display:block;color:var(--muted);font-size:12px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}

/* ---- quality checks, provenance --------------------------------------- */
.quality-list{display:grid;gap:0;margin-top:var(--s3)}
.quality-check{border-bottom:1px solid var(--rule);padding:var(--s3) 0}
.quality-check>div:first-child{display:flex;align-items:center;gap:var(--s2)}
.quality-check>div:first-child small{margin-left:auto}
.quality-check p{margin:5px 0;color:var(--muted);font-size:13px}
.quality-status{padding:0 6px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;border:1px solid var(--line)}
.quality-status.pass{color:var(--positive)}
.quality-status.review{color:var(--negative)}
.quality-status.unavailable{color:var(--muted)}
.check-inputs{display:flex;flex-wrap:wrap;gap:var(--s3);font-size:12px;margin-top:6px}
.filings{margin-top:var(--s5)}
.filing-row,.peer-links{display:flex;justify-content:space-between;gap:var(--s3);
  padding:var(--s2) 0;border-bottom:1px solid var(--rule);font-size:13px}
.peer-links{flex-wrap:wrap;justify-content:flex-start;gap:var(--s3)}
.metric-definition{border-top:1px solid var(--line);padding:var(--s3) 0}
.metric-definition h3{margin-bottom:4px}
.metric-definition p{margin:4px 0;font-size:13px;color:var(--muted)}
.concept-list{margin:var(--s2) 0;padding-left:var(--s5);color:var(--muted)}
.concept-list li{margin:2px 0}
.unit-note.comparability{border-left:3px solid var(--warn-line);background:var(--warn-bg);
  padding:var(--s3);max-width:82ch;color:var(--ink)}

/* ---- dialog ----------------------------------------------------------- */
dialog{padding:var(--s5);width:min(660px,94vw);max-height:88vh;border:1px solid var(--line);
  background:var(--surface);color:var(--ink);box-shadow:0 24px 70px rgba(10,20,35,.28)}
dialog::backdrop{background:rgba(10,20,35,.55)}
.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--s4)}
.source-number{font-family:var(--serif);font-size:32px;margin:var(--s3) 0}
.source-fields{display:grid;grid-template-columns:150px 1fr;gap:var(--s2);font-size:13px}
.source-fields dt{color:var(--muted)}
.source-fields dd{margin:0;overflow-wrap:anywhere}
.source-section{border-top:1px solid var(--line);padding-top:var(--s3);margin-top:var(--s4)}
.source-section h3{font-size:15px}
.source-section p{font-size:13px}
.source-input{display:block;width:100%;text-align:left;border:1px solid var(--line);
  background:var(--surface-sunk);padding:var(--s2);margin:6px 0;font-family:var(--mono);font-size:12px}

/* ---- footer ----------------------------------------------------------- */
footer{display:flex;justify-content:space-between;gap:var(--s5);flex-wrap:wrap;
  max-width:1500px;margin:0 auto;padding:var(--s4) 4% var(--s6);color:var(--muted);font-size:12px;
  border-top:1px solid var(--line)}
footer span{max-width:46ch}

/* ---- narrow ----------------------------------------------------------- */
@media(max-width:1000px){
  .workspace{grid-template-columns:180px minmax(0,1fr)}
  .compare-controls,.compare-picker-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  header{height:auto;padding:var(--s2) 5%;flex-wrap:wrap;gap:var(--s3)}
  nav{width:100%;gap:var(--s4);overflow-x:auto}
  .nav{padding:var(--s2) 0}
  .header-tools{margin-left:0}
  main,footer{padding-left:5%;padding-right:5%}
  h1{font-size:28px}
  .statusbar{gap:var(--s2) var(--s3)}
  .statusbar-scope{margin-left:0;text-align:left}
  .workspace{display:block}
  aside{border-right:0;border-bottom:1px solid var(--line)}
  #company-list{display:flex;overflow-x:auto;max-height:none;gap:var(--s2)}
  .company-option{width:auto;min-width:86px;flex-shrink:0;border-left:0;border-bottom:2px solid transparent}
  .company-option.active{border-bottom-color:var(--accent)}
  .company-option span{display:none}
  .company-head,.section-title,.query-bottom,.result-note{display:block}
  .company-actions{justify-content:flex-start;margin-top:var(--s3)}
  .cards{grid-template-columns:1fr;border-bottom:0}
  .card{padding:var(--s2) 0;border-bottom:1px solid var(--rule)}
  .card+.card{border-left:0;padding-left:0}
  .card .value,.stat-number{font-size:24px}
  .feed-list{grid-template-columns:1fr}
  .source-fields{grid-template-columns:100px 1fr}
  footer{display:block}
  footer span{display:block;margin-bottom:var(--s2)}
}

#home-directory{border-top:1px solid var(--line);margin-top:var(--s6);padding-top:var(--s4)}
#home-directory h3{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  margin:0 0 var(--s2)}
.directory{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--s5);
  margin:var(--s4) 0}
.directory-list{list-style:none;margin:0;padding:0;font-size:13px}
.directory-list li{padding:2px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.directory-list a{text-decoration:none}
.directory-list a:hover{text-decoration:underline}
.directory-list span{color:var(--muted);font-size:12px}

.preset-link{font-size:12px;color:var(--accent);text-decoration:none;margin-left:auto;white-space:nowrap}
.preset-link:hover{text-decoration:underline}

/* fixed layout takes its widths from the header row, so they are set there */
.filings-table{table-layout:fixed;min-width:560px}
.filings-table thead th:nth-child(1){width:104px}
.filings-table thead th:nth-child(3){width:96px}
.filings-table thead th:nth-child(4){width:118px}
/* the date took the first column, so the row header needs its own alignment */
.filings-table td:first-child,.filings-table th[scope="row"]{text-align:left}
.filings-table thead th:nth-child(2){text-align:left}
/* a row header inherits the header band's colour; here it is an ordinary cell */
.filings-table th[scope="row"]{position:static;font-weight:400;background:var(--surface);
  text-transform:none;letter-spacing:0;font-size:13px;color:var(--ink)}
.filings-table .screen-name{max-width:none}
.filings-table td.filed{color:var(--muted);font-size:12px}
.filings-table tr.day-start td,.filings-table tr.day-start th{border-top:1px solid var(--line)}

.period-tabs{display:flex;gap:var(--s3);margin-top:var(--s2)}
.period-tab{font-size:12px;color:var(--muted);text-decoration:none;padding-bottom:2px;
  border-bottom:2px solid transparent}
.period-tab:hover{color:var(--ink)}
.period-tab.active{color:var(--ink);border-bottom-color:var(--accent)}

.letter-nav{display:flex;flex-wrap:wrap;gap:2px;margin:var(--s4) 0;border-bottom:1px solid var(--line);padding-bottom:var(--s3)}
.letter{display:inline-block;min-width:26px;text-align:center;padding:3px 0;font-size:13px;
  text-decoration:none;border:1px solid transparent}
a.letter:hover{border-color:var(--line);background:var(--accent-soft)}
.letter.current{border-color:var(--accent);color:var(--ink);font-weight:600}
.letter.empty{color:var(--faint)}