/* Annalist site styles. Light is the default theme; [data-theme="dark"] on <html> switches to dark. */
:root {
  --bg: #FFFFFF; --bg-soft: #F6F7F9; --surface: #FFFFFF; --surface-2: #F3F4F7;
  --ink: #14171C; --ink-2: #3F4650; --ink-3: #5F6672;
  --line: #E2E5E9; --line-2: #D5D9DF;
  --accent: #3550D6; --accent-ink: #2741C9; --accent-soft: #EEF1FD; --on-accent: #FFFFFF; --warm: #CF6A10;
  --ok: #1E8A47; --warn: #B65A0B; --fail: #C93636;
  --s1: #3550D6; --s2: #D4541F; --s3: #14875E; --s4: #B07400;
  --grid: #ECEEF1; --axis: #C9CED6;
  --shadow: 0 12px 32px rgba(20, 23, 28, .10), 0 2px 6px rgba(20, 23, 28, .06);
  --serif: 'Newsreader', Georgia, serif;
  --sans: 'Instrument Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'DM Mono', ui-monospace, Menlo, monospace;
  --ease: cubic-bezier(.2, .7, .2, 1);
  color-scheme: light;
}
:root[data-theme="dark"] {
  --bg: #0E1014; --bg-soft: #13161C; --surface: #171A21; --surface-2: #1D212A;
  --ink: #E9ECF1; --ink-2: #C3C9D2; --ink-3: #8C94A1;
  --line: #252A33; --line-2: #333944;
  --accent: #8FA2FF; --accent-ink: #B1BEFF; --accent-soft: #1C2342; --on-accent: #0E1014; --warm: #F0A15A;
  --ok: #3CB56A; --warn: #F0A15A; --fail: #F07272;
  --s1: #7487F5; --s2: #D95926; --s3: #199E70; --s4: #C98500;
  --grid: #232831; --axis: #3A404C;
  --shadow: 0 14px 36px rgba(0, 0, 0, .5), 0 2px 6px rgba(0, 0, 0, .3);
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 15px/1.55 var(--sans); }
a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
button { font-family: inherit; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.num { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.muted { color: var(--ink-3); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* the skip link shows when it has focus (L11) */
a.sr:focus { position: fixed; top: 10px; left: 10px; z-index: 200; width: auto; height: auto; clip: auto; padding: 9px 14px;
  border: 1px solid var(--line-2); border-radius: 9px; background: var(--surface); color: var(--ink); box-shadow: var(--shadow); }
@media (pointer: coarse) { .kbd-find, .hint-keys { display: none; } }
kbd { font: 500 11px var(--mono); color: var(--ink-3); border: 1px solid var(--line-2); border-radius: 5px; padding: 1px 5px; background: var(--bg-soft); }
code { font: 400 13px var(--mono); }

/* top bar ---------------------------------------------------------------------------------------- */
.top { border-bottom: 1px solid var(--line); background: var(--bg); position: sticky; top: 0; z-index: 40; }
.top .wrap { display: flex; align-items: center; gap: 28px; height: 62px; }
.brand { display: inline-flex; align-items: baseline; gap: .3em; font: 500 22px/1 var(--serif); color: var(--ink); letter-spacing: -.01em; }
/* the mark: an A whose crossbar is a line that ends in a point, a figure traced to its source; its feet stand on
   the baseline of the wordmark and its apex at the height of the capitals (docs/brand/README.md) */
.brand .mark { position: relative; top: .1378em; width: .98em; height: .98em; flex: none; fill: currentColor; }
.brand .mark .sq { fill: var(--warm); }
.brand:hover { color: var(--ink); text-decoration: none; }
.nav { display: flex; gap: 4px; font-size: 14px; }
.nav a { color: var(--ink-2); padding: 7px 11px; border-radius: 8px; }
.nav a:hover { color: var(--ink); background: var(--bg-soft); text-decoration: none; }
.nav a[aria-current="page"] { color: var(--ink); background: var(--surface-2); }
.top .spacer { flex: 1; }
.find-btn { display: inline-flex; align-items: center; gap: 10px; height: 36px; padding: 0 10px 0 12px; border: 1px solid var(--line-2);
  border-radius: 9px; background: var(--surface); color: var(--ink-3); font: 400 14px var(--sans); cursor: pointer; }
.find-btn:hover { border-color: var(--ink-3); color: var(--ink-2); }
.icon-btn { display: inline-grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--line-2); border-radius: 9px;
  background: var(--surface); color: var(--ink-2); cursor: pointer; padding: 0; }
.icon-btn:hover { border-color: var(--ink-3); color: var(--ink); }
.menu-btn { display: none; }
.theme-btn .moon { display: none; }
:root[data-theme="dark"] .theme-btn .moon { display: block; }
:root[data-theme="dark"] .theme-btn .sun { display: none; }
.top .mobile-nav { display: none; height: auto; border-top: 1px solid var(--line); padding: 6px 24px 12px; }
.mobile-nav a { display: block; padding: 11px 0; color: var(--ink); font-size: 16px; border-bottom: 1px solid var(--line); }
.mobile-nav a[aria-current="page"] { color: var(--accent); }
.mobile-nav a:last-child { border-bottom: 0; }
.top.open .mobile-nav { display: block; }

/* search palette --------------------------------------------------------------------------------- */
.palette { position: fixed; inset: 0; z-index: 60; background: rgba(20, 23, 28, .32); display: grid; justify-items: center; align-items: start; padding: 10vh 16px 16px; }
:root[data-theme="dark"] .palette { background: rgba(5, 6, 9, .62); }
.palette[hidden] { display: none; }
.palette .box { width: min(640px, 100%); background: var(--surface); border: 1px solid var(--line-2); border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; }
.palette .search-box { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.palette .results { position: static; border: 0; border-radius: 0; box-shadow: none; max-height: min(420px, 60vh); }
.search { position: relative; max-width: 720px; }
.search-box { display: flex; align-items: center; gap: 12px; height: 58px; padding: 0 14px 0 18px; border: 1px solid var(--line-2);
  border-radius: 14px; background: var(--surface); }
.search-box:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.palette .search-box:focus-within { box-shadow: none; }
.search-box svg { flex: none; color: var(--ink-3); }
.search-box input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: 400 17px var(--sans); }
.search-box input::placeholder { color: var(--ink-3); }
.search-box input::-webkit-search-cancel-button { display: none; }
.results { position: absolute; left: 0; right: 0; top: 66px; background: var(--surface); border: 1px solid var(--line-2); border-radius: 14px;
  box-shadow: var(--shadow); padding: 8px; z-index: 30; max-height: min(460px, 60vh); overflow: auto; }
.results[hidden] { display: none; }
.results h3 { font: 600 11px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin: 12px 10px 6px; }
.results ul { list-style: none; margin: 0; padding: 0; }
.results li { display: flex; align-items: baseline; gap: 10px; padding: 9px 10px; border-radius: 9px; cursor: pointer; }
.results li .t { font-weight: 500; }
.results li .m { font-size: 13px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.results li[aria-selected="true"] { background: var(--accent-soft); }
.results .empty { padding: 14px 10px; color: var(--ink-3); font-size: 14px; }
.results .keys { display: flex; gap: 14px; padding: 10px 10px 4px; border-top: 1px solid var(--line); margin-top: 8px; font-size: 12px; color: var(--ink-3); }

/* page heads and sections ----------------------------------------------------------------------- */
.kicker { font: 600 12px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 16px; }
h1 { font: 400 46px/1.08 var(--serif); letter-spacing: -.02em; margin: 0; }
h2 { font: 400 28px/1.15 var(--serif); letter-spacing: -.01em; margin: 0; }
h3 { font: 500 19px/1.3 var(--serif); margin: 0; }
.page-head { padding: 48px 0 28px; }
.page-head .lede { font-size: 17px; line-height: 1.6; color: var(--ink-2); max-width: 66ch; margin: 16px 0 0; }
section.block { padding: 48px 0 8px; }
section[id] { scroll-margin-top: 72px; }
.head { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.head p { margin: 6px 0 0; color: var(--ink-3); font-size: 14px; max-width: 64ch; }
.head .more { font-size: 14px; white-space: nowrap; }
.prose { max-width: 70ch; color: var(--ink-2); }
.prose p { margin: 0 0 14px; }
.prose h3 { color: var(--ink); margin: 26px 0 8px; }
.note { font-size: 13px; color: var(--ink-3); }
.btn { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 9px;
  background: var(--surface); color: var(--ink); font: 500 14px var(--sans); cursor: pointer; }
.btn:hover { border-color: var(--ink-3); color: var(--ink); text-decoration: none; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.btn.primary:hover { filter: brightness(1.08); color: var(--on-accent); }

/* home ------------------------------------------------------------------------------------------- */
.hero { padding: 72px 0 40px; }
.hero h1 { font-size: 52px; line-height: 1.06; max-width: 17ch; }
.lede { font-size: 18px; line-height: 1.6; color: var(--ink-2); max-width: 62ch; margin: 22px 0 32px; }
.hint { font-size: 13px; color: var(--ink-3); margin: 12px 0 0; }
.keynums { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 28px 0 0; }
.keynums > * { padding: 26px 24px 24px 0; color: var(--ink); }
.keynums > * + * { padding-left: 24px; border-left: 1px solid var(--line); }
.keynums b { display: block; font: 400 46px/1 var(--serif); font-variant-numeric: lining-nums; letter-spacing: -.02em; }
.keynums span { display: block; margin-top: 10px; font-size: 14px; color: var(--ink-2); }
.keynums a:hover { text-decoration: none; }
.keynums a:hover span { color: var(--accent); }
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.card { display: block; border: 1px solid var(--line); border-radius: 14px; padding: 20px 20px 18px; background: var(--surface); color: var(--ink); }
.card:hover { border-color: var(--line-2); box-shadow: var(--shadow); text-decoration: none; color: var(--ink); }
.card .name { font: 500 20px/1.25 var(--serif); }
.card .meta { font-size: 13px; color: var(--ink-3); margin-top: 4px; }
.card .when { font-size: 13px; color: var(--ink-2); margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.card .figs { display: grid; grid-template-columns: 1.35fr 1fr; gap: 12px; margin-top: 14px; }
.fig .l { font-size: 12px; color: var(--ink-3); }
.fig .v { font: 500 19px/1.3 var(--mono); font-variant-numeric: tabular-nums; margin-top: 3px; }
.fig .d { font: 400 12px var(--mono); color: var(--ink-2); white-space: nowrap; }
.features { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.feature { display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--line); border-radius: 14px; padding: 20px; background: var(--surface); color: var(--ink); }
.feature:hover { border-color: var(--line-2); box-shadow: var(--shadow); text-decoration: none; color: var(--ink); }
.feature b { font: 400 13px var(--mono); color: var(--warm); }
.feature p { margin: 0; color: var(--ink-2); font-size: 14px; }
.feature .go { margin-top: auto; padding-top: 8px; font-size: 14px; color: var(--accent); }

/* shared by the landing page and the app page: the list of ledger changes -------------------- */
.feed { border: 1px solid var(--line-2); border-radius: 16px; background: var(--surface); overflow: hidden; box-shadow: var(--shadow); }
.feed-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 12px 16px; border-bottom: 1px solid var(--line);
  font: 600 11px/1.2 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.feed-h .live { display: inline-flex; align-items: center; gap: 6px; font: 500 12px var(--sans); letter-spacing: 0; text-transform: none; color: var(--ink-2); white-space: nowrap; }
.feed-h .live i { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); } /* still: the list is a ledger, not live data */
/* the list shows about 4 changes; while it is on screen it steps up to the next one, latest report first */
.feed-list { list-style: none; margin: 0; padding: 0 16px; height: 508px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin;
  -webkit-mask-image: linear-gradient(#000 calc(100% - 48px), transparent); mask-image: linear-gradient(#000 calc(100% - 48px), transparent); }
.feed-list li { padding: 12px 0; border-bottom: 1px solid var(--line); }
/* without motion the list does not step, so every change is shown */
@media (prefers-reduced-motion: reduce) { .feed-list { height: auto; -webkit-mask-image: none; mask-image: none; } }
.feed-list li.none { color: var(--ink-3); font-size: 13.5px; border: 0; }
.feed .fi { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.feed .ftk { min-width: 44px; font: 500 12.5px var(--mono); color: var(--ink); }
.feed .ft { font-size: 13.5px; font-weight: 500; color: var(--ink); }
.feed .src { font: 400 11px var(--mono); }
.feed .fx { margin: 5px 0 0; font-size: 13px; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.feed .fp { margin: 3px 0 0; font-size: 12px; color: var(--ink-3); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--ok) 55%, transparent); } 70% { box-shadow: 0 0 0 8px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.seg button .c { font: 400 12px var(--mono); color: var(--ink-3); margin-left: 6px; }
.seg button[aria-pressed="true"] .c { color: var(--ink-2); }
.rv { transition: opacity .5s var(--ease), transform .5s var(--ease); transition-delay: var(--rd, 0ms); }
.rv.pre { opacity: 0; transform: translateY(12px); transition: none; }
@keyframes rise { from { opacity: 0; transform: translateY(5px); } }

/* chips, facets, segmented controls ------------------------------------------------------------- */
.facets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px 28px; margin-bottom: 18px; }
.facet .l, .ctl .l { font: 600 11px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 10px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border: 1px solid var(--line-2); border-radius: 999px;
  background: var(--surface); color: var(--ink-2); font: 500 13px var(--sans); cursor: pointer; }
.chip .c { font: 400 12px var(--mono); color: var(--ink-3); }
.chip:hover { border-color: var(--ink-3); color: var(--ink); }
.chip[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.chip[aria-pressed="true"] .c { color: inherit; opacity: .75; }
.seg { display: inline-flex; padding: 3px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--bg-soft); gap: 2px; flex-wrap: wrap; }
.seg button { height: 30px; padding: 0 12px; border: 0; border-radius: 7px; background: transparent; color: var(--ink-2); font: 500 13px var(--sans); cursor: pointer; }
.seg button:hover { color: var(--ink); }
.seg button[aria-pressed="true"] { background: var(--surface-2); color: var(--ink); box-shadow: 0 0 0 1px var(--line-2); }
.controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px 24px; margin-bottom: 18px; }
.active { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 32px; margin-bottom: 12px; font-size: 13px; color: var(--ink-3); }
.label { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 6px 0 10px; border-radius: 7px; background: var(--accent-soft);
  color: var(--accent-ink); font: 500 13px var(--sans); }
.label button { border: 0; background: transparent; color: inherit; font-size: 16px; line-height: 1; cursor: pointer; padding: 0 4px; }
.clear { border: 0; background: transparent; color: var(--accent); font: 500 13px var(--sans); cursor: pointer; padding: 0; }
select { height: 36px; padding: 0 30px 0 12px; border: 1px solid var(--line-2); border-radius: 9px; background: var(--surface); color: var(--ink);
  font: 500 14px var(--sans); appearance: none; cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink-3) 50%), linear-gradient(135deg, var(--ink-3) 50%, transparent 50%);
  background-position: calc(100% - 16px) 15px, calc(100% - 11px) 15px; background-size: 5px 5px; background-repeat: no-repeat; }

/* tables ---------------------------------------------------------------------------------------- */
table { width: 100%; border-collapse: collapse; font-size: 14px; }
thead th { text-align: left; font: 600 11px/1.25 var(--sans); letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3);
  padding: 10px 12px 10px 0; border-bottom: 1px solid var(--line-2); white-space: nowrap; vertical-align: bottom; }
thead th button.sort { all: unset; cursor: pointer; }
thead th button.sort:hover { color: var(--ink); }
thead th button.sort:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }
thead th[aria-sort="ascending"] button.sort::after { content: " ↑"; }
thead th[aria-sort="descending"] button.sort::after { content: " ↓"; }
tbody td { padding: 13px 12px 13px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
tbody tr.link { cursor: pointer; }
tbody tr.link:hover td { background: var(--bg-soft); }
th.r, td.r { text-align: right; }
td .co { font: 500 16px/1.3 var(--serif); color: var(--ink); }
td a.co:hover { color: var(--accent); }
td .sub { font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
td.na, span.na { color: var(--ink-3); }
td.span-note { color: var(--ink-3); font-size: 13px; }
.none { padding: 26px 0; color: var(--ink-3); }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-top: 1px solid var(--line-2); }
.table-scroll table thead th { border-bottom-color: var(--line-2); }

/* company page ---------------------------------------------------------------------------------- */
.crumbs { font-size: 13px; color: var(--ink-3); padding-top: 26px; }
.crumbs a { color: var(--ink-3); }
.crumbs a:hover { color: var(--ink); }
.co-head { padding: 14px 0 22px; display: grid; grid-template-columns: 1fr auto; gap: 18px 32px; align-items: end; }
.co-head h1 { font-size: 42px; }
.co-meta { margin: 10px 0 0; color: var(--ink-2); font-size: 14.5px; }
.co-asof { margin: 6px 0 0; color: var(--ink-3); font-size: 13.5px; }
.co-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); position: sticky; top: 62px; z-index: 20; background: var(--bg); overflow-x: auto; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tabs a { padding: 13px 14px 12px; color: var(--ink-3); font: 500 14px var(--sans); border-bottom: 2px solid transparent; white-space: nowrap; margin-bottom: -1px; }
.tabs a:hover { color: var(--ink); text-decoration: none; }
.tabs a[aria-selected="true"] { color: var(--ink); border-bottom-color: var(--accent); }
.tab-ink { position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: var(--accent); pointer-events: none; }
.tabs.inked .tab-ink { transition: transform .35s var(--ease), width .35s var(--ease); }
.tabs.inked a[aria-selected="true"] { border-bottom-color: transparent; }
.panel { padding: 30px 0 10px; }
.panel[hidden] { display: none; }
.panel > h2 { margin-bottom: 6px; }
.panel-sub { color: var(--ink-3); font-size: 14px; margin: 0 0 20px; max-width: 70ch; }
.tiles { display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tile { padding: 18px 18px 16px 0; min-width: 0; }
.tile + .tile { padding-left: 18px; border-left: 1px solid var(--line); }
.tile .l { font-size: 12.5px; color: var(--ink-3); min-height: 2.6em; }
.tile .v { display: block; margin-top: 6px; font: 400 30px/1.05 var(--serif); letter-spacing: -.01em; color: var(--ink); font-variant-numeric: lining-nums; white-space: nowrap; }
button.v { all: unset; display: block; margin-top: 6px; font: 400 30px/1.05 var(--serif); letter-spacing: -.01em; color: var(--ink); cursor: pointer;
  font-variant-numeric: lining-nums; white-space: nowrap; border-bottom: 1px dashed transparent; }
button.v:hover { border-bottom-color: var(--ink-3); }
button.v:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 3px; }
.tile .d { display: block; margin-top: 8px; font: 400 12.5px var(--mono); color: var(--ink-2); }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.findings { list-style: none; margin: 0; padding: 0; counter-reset: f; }
.findings > li { position: relative; padding: 14px 0 14px 34px; border-bottom: 1px solid var(--line); color: var(--ink); counter-increment: f; }
.findings > li::before { content: counter(f, decimal-leading-zero); position: absolute; left: 0; top: 15px; font: 400 13px var(--mono); color: var(--warm); }
.findings > li:first-child { border-top: 1px solid var(--line); }
.findings .rule { display: block; margin-top: 4px; font: 400 11.5px var(--mono); color: var(--ink-3); }
.findings .rule a { white-space: nowrap; }
.findings .rule .rt { font: 400 12px var(--sans); } /* the title of the rule; its id is in the tooltip */
.findings .ft { margin: 0; }
.fmean { margin: 6px 0 0; max-width: 92ch; font-size: 13px; line-height: 1.5; color: var(--ink-3); }
.fmean b { font-weight: 600; color: var(--ink-2); }
.fstate { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 8px; font-size: 12.5px; color: var(--ink-3); }
.state { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: 6px; border: 1px solid var(--line-2);
  background: var(--surface-2); color: var(--ink-2); font: 500 11.5px var(--sans); white-space: nowrap; }
.state.st-new { background: var(--accent-soft); border-color: transparent; color: var(--accent-ink); }
.state.st-retired { color: var(--ink-3); background: transparent; }
.hist { margin-top: 8px; }
.hist summary { cursor: pointer; font-size: 12.5px; color: var(--accent); list-style: none; }
.hist summary::-webkit-details-marker { display: none; }
.hist summary::before { content: "\25B8"; display: inline-block; width: 14px; color: var(--ink-3); }
.hist[open] summary::before { content: "\25BE"; }
.timeline { list-style: none; margin: 10px 0 4px; padding: 0 0 0 14px; border-left: 1px solid var(--line-2); }
.timeline li { display: grid; grid-template-columns: 76px 116px 1fr; gap: 4px 10px; align-items: baseline; padding: 7px 0; }
.timeline .state { justify-self: start; }
.timeline .tp { font: 400 12px var(--mono); color: var(--ink-2); }
.timeline .tx { font-size: 13px; color: var(--ink-2); }
.timeline .tb { grid-column: 3; font: 400 11px var(--mono); color: var(--ink-3); }
.former { margin-top: 26px; }
.former h3 { font: 600 11px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 4px; }
.former ul { list-style: none; margin: 8px 0 0; padding: 0; }
.former li { padding: 10px 0; border-bottom: 1px solid var(--line); }
.former .hist { margin-top: 0; }
.former .hist summary { color: var(--ink); font-size: 14px; }
.charts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.chart-card { border: 1px solid var(--line); border-radius: 14px; background: var(--surface); padding: 16px 16px 10px; min-width: 0; }
.chart-card h3 { font: 600 13.5px/1.3 var(--sans); color: var(--ink); }
.chart-card .cs { font-size: 12.5px; color: var(--ink-3); margin: 2px 0 6px; }
.chart-card.wide { grid-column: span 2; }
.chart-card.full { grid-column: 1 / -1; }
.chart { position: relative; }
.chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.chart .grid line { stroke: var(--grid); stroke-width: 1; shape-rendering: crispEdges; }
.chart .zero { stroke: var(--axis); stroke-width: 1; shape-rendering: crispEdges; }
.chart text { fill: var(--ink-3); font: 400 11px var(--sans); font-variant-numeric: tabular-nums; }
.chart text.end { fill: var(--ink-2); font-weight: 500; }
.chart .bar { fill: var(--s1); }
.chart .bar.dim { opacity: .45; }
.chart .bar { transform-box: fill-box; transform-origin: 50% 100%; }
.chart .bar.neg { transform-origin: 50% 0; }
.chart.pre .bar { transform: scaleY(0); }
.chart.drawing .bar { transition: transform .6s var(--ease); transition-delay: calc(var(--i, 0) * 16ms); }
.chart.pre .line, .chart.drawing .line { stroke-dasharray: 1; }
.chart.pre .line { stroke-dashoffset: 1; }
.chart.drawing .line { stroke-dashoffset: 0; transition: stroke-dashoffset 1.1s var(--ease); }
.chart.pre .dot, .chart.pre text.end { opacity: 0; }
.chart.drawing .dot, .chart.drawing text.end { transition: opacity .3s var(--ease) .8s; }
.chart .hit { fill: transparent; cursor: crosshair; }
.chart .hover-bar { fill: var(--ink); opacity: .06; }
.chart .line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.chart .dot { stroke: var(--surface); stroke-width: 2; }
.chart .cross { stroke: var(--ink-3); stroke-width: 1; shape-rendering: crispEdges; }
.chart .off { fill: var(--surface); stroke-width: 1.6; stroke-linejoin: round; } /* a value off the scale, at the edge */
.chart-off { margin: 6px 0 0; font-size: 12px; }
.s1 { stroke: var(--s1); } .s2 { stroke: var(--s2); } .s3 { stroke: var(--s3); } .s4 { stroke: var(--s4); }
.f1 { fill: var(--s1); } .f2 { fill: var(--s2); } .f3 { fill: var(--s3); } .f4 { fill: var(--s4); }
.legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12.5px; color: var(--ink-2); margin: 2px 0 8px; }
.legend span { display: inline-flex; align-items: center; gap: 7px; }
.legend i { display: inline-block; width: 14px; height: 2px; border-radius: 2px; }
.legend .lv { font: 500 12px var(--mono); color: var(--ink); }
.legend i.k1 { background: var(--s1); } .legend i.k2 { background: var(--s2); } .legend i.k3 { background: var(--s3); } .legend i.k4 { background: var(--s4); }
.tip { position: absolute; pointer-events: none; z-index: 10; min-width: 140px; padding: 9px 11px; border: 1px solid var(--line-2); border-radius: 10px;
  background: var(--surface-2); box-shadow: var(--shadow); font-size: 12.5px; color: var(--ink-2); white-space: nowrap; }
.tip[hidden] { display: none; }
.tip .tt { color: var(--ink-3); margin-bottom: 4px; }
.tip .tv { font: 500 14px var(--mono); color: var(--ink); }
.tip .row { display: flex; align-items: center; gap: 8px; margin-top: 3px; }
.tip .row i { width: 12px; height: 2px; border-radius: 2px; flex: none; }
.tip .row .tv { margin-left: auto; padding-left: 14px; font-size: 13px; }

/* statements and ratios ------------------------------------------------------------------------- */
.stmt table { font-size: 13.5px; }
.stmt thead th { text-align: right; padding: 10px 0 10px 18px; }
.stmt thead th:first-child { text-align: left; padding-left: 0; position: sticky; left: 0; background: var(--bg); z-index: 2; }
.stmt thead th .pe { display: block; font: 400 11px var(--sans); letter-spacing: 0; text-transform: none; color: var(--ink-3); margin-top: 3px; }
.stmt tbody td { padding: 9px 0 9px 18px; text-align: right; white-space: nowrap; }
.stmt tbody td:first-child { text-align: left; padding-left: 0; white-space: normal; min-width: 230px; max-width: 320px; position: sticky; left: 0; background: var(--bg); z-index: 1; color: var(--ink-2); }
.stmt tbody tr.key td:first-child { color: var(--ink); font-weight: 500; }
.stmt tbody tr.key td { border-bottom-color: var(--line-2); }
.cell { all: unset; font: 400 13.5px var(--mono); font-variant-numeric: tabular-nums; color: var(--ink); cursor: pointer; padding: 2px 4px; margin: -2px -4px; border-radius: 5px; }
.cell:hover { background: var(--accent-soft); color: var(--accent-ink); }
.cell:focus-visible { outline: 2px solid var(--accent); outline-offset: 0; }
.cell.derived { color: var(--ink-2); }
.cell.derived::after { content: "d"; font-size: 9px; vertical-align: super; color: var(--warm); margin-left: 1px; }
.stmt-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-bottom: 14px; }
.stmt-bar .files { font-size: 13px; color: var(--ink-3); }
.ratio-group { margin-top: 26px; }
.ratio-group h3 { font: 600 11px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 4px; }
.ratios-table td.name { color: var(--ink); }
.ratios-table td.name .def { display: block; font-size: 12.5px; color: var(--ink-3); margin-top: 2px; max-width: 54ch; }
.ratios-table td.name .mean, .an-table td.name .mean { display: block; font-size: 13px; line-height: 1.45; color: var(--ink-2); margin-top: 3px; max-width: 62ch; }
.ratios-table td.spark { width: 128px; padding-top: 12px; }
.ratios-table td.spark svg { display: block; width: 120px; height: 28px; overflow: visible; }
.ratios-table td.spark polyline { fill: none; stroke: var(--s1); stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.ratios-table td.spark circle { fill: var(--s1); }
.stmt tbody tr.grp td { padding-top: 22px; font: 600 11px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); border-bottom-color: var(--line-2); }

/* corporate events ------------------------------------------------------------------------------ */
.events { list-style: none; margin: 0; padding: 0; }
.events > li { padding: 12px 0; border-bottom: 1px solid var(--line); }
.events > li:first-child { border-top: 1px solid var(--line); }
.events .eh { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.events .ek { font: 600 11px/1.3 var(--sans); letter-spacing: .07em; text-transform: uppercase; color: var(--accent-ink); }
.events .ed { font-size: 12.5px; color: var(--ink-3); }
.events .et { margin: 4px 0 0; color: var(--ink); font-size: 14px; }
.events .es { display: block; margin-top: 3px; font: 400 11.5px var(--mono); color: var(--ink-3); }

/* analysis -------------------------------------------------------------------------------------- */
.module { margin-top: 52px; }
.module:first-of-type { margin-top: 10px; }
.module .findings { margin-bottom: 8px; }
.an-h { font: 600 11px/1.3 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin: 30px 0 10px; }
.an-table { font-size: 13.5px; }
.an-table thead th { text-align: right; padding: 10px 0 10px 18px; }
.an-table thead th:first-child { text-align: left; padding-left: 0; }
.an-table thead th .pe { display: block; font: 400 11px var(--sans); letter-spacing: 0; text-transform: none; color: var(--ink-3); margin-top: 3px; }
.an-table tbody td { padding: 9px 0 9px 18px; text-align: right; white-space: nowrap; }
.an-table tbody td:first-child { text-align: left; padding-left: 0; white-space: normal; min-width: 220px; color: var(--ink-2); }
.an-table td.name { color: var(--ink); }
.an-table td.name .def { display: block; font-size: 12px; color: var(--ink-3); margin-top: 2px; max-width: 52ch; }
.an-table td.num, .an-table td .num { font: 400 13.5px var(--mono); font-variant-numeric: tabular-nums; color: var(--ink); }
.an-table tr.tot td { color: var(--ink); font-weight: 500; border-bottom-color: var(--line-2); }
.an-table .band { display: block; font: 400 11px var(--sans); color: var(--ink-3); margin-top: 3px; }
.band-scale { table-layout: fixed; min-width: 640px; }
.band-scale th, .band-scale td { border: 1px solid var(--line); padding: 10px 8px; vertical-align: middle; }
.band-scale thead th { text-align: center; border-bottom-color: var(--line); white-space: normal; text-transform: none; letter-spacing: 0; font: 600 12px/1.25 var(--sans); color: var(--ink-2); }
.band-scale thead th:first-child, .band-scale tbody th { text-align: left; font: 500 13px var(--sans); letter-spacing: 0; text-transform: none; color: var(--ink-2); width: 130px; }
.band-scale td { text-align: center; font-size: 12px; color: var(--ink-3); }
.band-scale td span { display: block; }
.band-scale td.on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-ink); }
.band-scale td.on b { display: block; font: 500 15px var(--mono); color: var(--ink); margin-bottom: 2px; }
.band-scale.zones { min-width: 0; margin: 12px 0 4px; }
.su { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.su-t tbody td:first-child { min-width: 0; }
.cover { margin: 12px 0 0; font-size: 14px; color: var(--ink-2); }
.cover b { font-size: 16px; color: var(--ink); margin-left: 6px; }
.module .chart-card { margin-bottom: 12px; }
.mat-t tbody td:first-child { min-width: 0; text-align: right; padding-left: 18px; }
.mat-t thead th:first-child { text-align: right; padding-left: 18px; }
.scores { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 26px; }
.score-card { border: 1px solid var(--line); border-radius: 14px; background: var(--surface); padding: 18px 18px 8px; min-width: 0; }
.score-card h3 { font: 600 13.5px/1.3 var(--sans); color: var(--ink); }
.score-card .cs { font-size: 12.5px; color: var(--ink-3); margin: 2px 0 0; }
.score-card .sv { display: inline-block; margin: 10px 0 2px; font: 400 34px/1.05 var(--serif); color: var(--ink); padding: 2px 6px; margin-left: -6px; }
.score-card .sv .of { font: 400 15px var(--sans); color: var(--ink-3); }
.score-card .an-table tbody td:first-child { min-width: 180px; }
.score-card .note { margin: 12px 0 10px; }
.score-card .mean, .module .mean { font-size: 13.5px; line-height: 1.5; color: var(--ink-2); margin: 8px 0 0; max-width: 78ch; }
.score-card .reading, .module .reading { font-size: 14px; line-height: 1.5; color: var(--ink); margin: 8px 0 10px; max-width: 78ch; }
.score-card .an-table td.name .def { display: block; font-size: 12px; color: var(--ink-3); margin-top: 2px; white-space: normal; }
.sig { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink-2); }
.sig::before { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; font: 600 10px/1 var(--sans); }
.sig.met::before { content: "\2713"; background: var(--accent-soft); color: var(--accent-ink); }
.sig.miss::before { content: "\00D7"; border: 1px solid var(--line-2); color: var(--ink-3); }
.an-notes { margin: 18px 0 0; padding-left: 18px; font-size: 13px; color: var(--ink-3); max-width: 92ch; }
.an-notes li { margin: 5px 0; }

/* analysis: credit update ----------------------------------------------------------------------------- */
/* the bar sits 1 pixel under the tab bar (top 62px, 44px high) so that no text shows between them; its chips scroll on
   their own and the tools at the right stay in view */
.an-jump, .r-jump { position: sticky; top: 105px; z-index: 15; display: flex; align-items: center; gap: 12px; padding: 10px 0;
  background: var(--bg); border-bottom: 1px solid var(--line); }
.jl { position: relative; display: flex; gap: 6px; flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.jl::-webkit-scrollbar { display: none; }
.jl.more { --fade: linear-gradient(to right, #000 calc(100% - 32px), transparent); }
.jl.less { --fade: linear-gradient(to right, transparent, #000 32px); }
.jl.less.more { --fade: linear-gradient(to right, transparent, #000 32px, #000 calc(100% - 32px), transparent); }
.jl.more, .jl.less { -webkit-mask-image: var(--fade); mask-image: var(--fade); }
.tabs.more { --fade: linear-gradient(to right, #000 calc(100% - 40px), transparent); }
.tabs.less { --fade: linear-gradient(to right, transparent, #000 40px); }
.tabs.less.more { --fade: linear-gradient(to right, transparent, #000 40px, #000 calc(100% - 40px), transparent); }
.tabs.more, .tabs.less { -webkit-mask-image: var(--fade); mask-image: var(--fade); }
.jt { display: flex; align-items: center; gap: 6px; flex: none; }
.an-jump a, .r-jump a { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 11px; border-radius: 999px;
  border: 1px solid var(--line-2); color: var(--ink-2); font: 500 12.5px var(--sans); white-space: nowrap; }
.an-jump a:hover, .r-jump a:hover { text-decoration: none; color: var(--ink); border-color: var(--ink-3); }
.an-jump a[aria-current="true"], .r-jump a[aria-current="true"] { background: var(--accent-soft); border-color: transparent; color: var(--accent-ink); }
.an-jump .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--warn); }
.tool { height: 28px; padding: 0 10px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--surface); color: var(--ink-2);
  font: 500 12.5px var(--sans); cursor: pointer; white-space: nowrap; }
.tool:hover { color: var(--ink); border-color: var(--ink-3); }
.switch { display: inline-flex; align-items: center; gap: 8px; height: 28px; padding: 0 10px 0 6px; border: 1px solid var(--line-2); border-radius: 999px;
  background: var(--surface); color: var(--ink-2); font: 500 12.5px var(--sans); cursor: pointer; white-space: nowrap; }
.switch i { position: relative; width: 26px; height: 16px; border-radius: 999px; background: var(--line-2); transition: background .2s; }
.switch i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: var(--ink); transition: transform .2s var(--ease); }
.switch[aria-checked="true"] i { background: var(--accent); }
.switch[aria-checked="true"] i::after { transform: translateX(10px); background: var(--on-accent); }
#analysis [id^="an-"], #ratio-groups [id] { scroll-margin-top: 172px; }
.cu-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px 24px; flex-wrap: wrap; padding: 24px 0 16px; }
.cu-title { font: 400 28px/1.15 var(--serif); margin: 10px 0 6px; }
.cu-head p { margin: 0; font-size: 13.5px; color: var(--ink-2); max-width: 72ch; }
.cu-count { display: flex; gap: 8px; }
.cu-count span { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 10px; border: 1px solid var(--line-2); border-radius: 10px; font-size: 12.5px; color: var(--ink-2); }
.cu-count b { font: 400 20px/1 var(--serif); color: var(--ink); }
.cu-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cu-card { display: flex; flex-direction: column; gap: 6px; text-align: left; padding: 13px 14px 12px; border: 1px solid var(--line); border-radius: 12px;
  background: var(--surface); color: var(--ink); cursor: pointer; min-width: 0; font: inherit; transition: border-color .2s, box-shadow .2s; }
.cu-card:hover { border-color: var(--line-2); box-shadow: var(--shadow); }
.cu-card .k { display: flex; align-items: center; justify-content: space-between; gap: 6px; font: 600 10.5px/1.2 var(--sans); letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-3); }
.cu-card .v { font: 400 28px/1.05 var(--serif); color: var(--ink); font-variant-numeric: lining-nums; }
.cu-card .v small { font: 400 12px var(--sans); color: var(--ink-3); margin-left: 6px; }
.cu-card .m { font-size: 12px; color: var(--ink-2); }
.per { display: inline-flex; align-items: center; height: 18px; padding: 0 5px; border-radius: 4px; border: 1px solid var(--line-2); font: 400 10.5px var(--mono);
  color: var(--ink-3); vertical-align: 1px; white-space: nowrap; }
.per.lag { border-color: color-mix(in srgb, var(--warn) 55%, transparent); color: var(--warn); }
.rkey .d .lag { color: var(--warn); }
.rt .per-m { display: none; }
.sort-m { display: none; }
.sort-row { display: flex; gap: 8px; }
.sort-row select { flex: 1; min-width: 0; }
.cu-chip { align-self: flex-start; display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; font: 500 11px var(--sans);
  white-space: nowrap; border: 1px solid var(--line-2); color: var(--ink-2); background: var(--surface-2); }
.cu-chip.band { background: var(--accent-soft); color: var(--accent-ink); border-color: transparent; }
.cu-chip.flag { color: var(--warn); border-color: color-mix(in srgb, var(--warn) 50%, transparent); background: transparent; }
.cu-chip.est { color: var(--warn); border-color: color-mix(in srgb, var(--warn) 50%, transparent); background: transparent; margin-top: 4px; }
.est { margin: 0 4px; padding: 0 4px; border-radius: 4px; font: 500 10px var(--sans); color: var(--warn); border: 1px solid color-mix(in srgb, var(--warn) 45%, transparent); vertical-align: 1px; cursor: help; }
.r-excl { margin: 6px 0 10px; max-width: 92ch; }
.cu-lists { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 14px; margin-top: 14px; align-items: start; }
.cu-list { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); padding: 6px 14px 10px; min-width: 0; }
.cu-list h4 { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 8px 0 4px; font: 600 11px/1.2 var(--sans);
  letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.cu-list h4 span { font: 400 12px var(--mono); letter-spacing: 0; }
.cu-list ul { list-style: none; margin: 0; padding: 0; }
.cu-list li { padding: 9px 0; border-top: 1px solid var(--line); }
.cu-list ul > li:first-child { border-top: 0; }
.cu-list .note { margin: 6px 0; }
.cu-list h4.lim { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.ch-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ch-top b { font-weight: 500; font-size: 13.5px; color: var(--ink); }
.ch-top .src { font: 400 11px var(--mono); }
.ch-text { margin: 4px 0 0; font-size: 13px; line-height: 1.5; color: var(--ink-2); }
.ch-prev { margin-top: 4px; }
.ch-prev summary, .more-row > summary, .rmore > summary { cursor: pointer; font-size: 12.5px; color: var(--accent); list-style: none; }
.ch-prev summary::-webkit-details-marker, .more-row > summary::-webkit-details-marker, .rmore > summary::-webkit-details-marker { display: none; }
.ch-prev summary::before, .rmore > summary::before { content: "\25B8"; display: inline-block; width: 13px; color: var(--ink-3); }
.ch-prev[open] summary::before, .rmore[open] > summary::before { content: "\25BE"; }
.ch-prev p { margin: 6px 0 0; padding-left: 10px; border-left: 2px solid var(--line-2); font-size: 12.5px; color: var(--ink-3); }
.more-row > summary { padding: 9px 0 3px; border-top: 1px solid var(--line); }
.an-open { all: unset; margin-top: 6px; display: inline-block; font-size: 12.5px; color: var(--accent); cursor: pointer; }
.an-open:hover { text-decoration: underline; }
.an-open:focus-visible, .rx:focus-visible, .ti:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }
.an-sub { margin: 30px 0 6px; }
details.mod { border-top: 1px solid var(--line); }
details.mod:last-of-type { border-bottom: 1px solid var(--line); }
details.mod > summary { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 4px 10px; align-items: baseline; padding: 16px 0; cursor: pointer; list-style: none; }
details.mod > summary::-webkit-details-marker { display: none; }
details.mod > summary::before { content: "\25B8"; color: var(--ink-3); font-size: 13px; }
details.mod[open] > summary::before { content: "\25BE"; }
.mod-t { font: 400 24px/1.2 var(--serif); color: var(--ink); }
.mod-k { grid-column: 2 / -1; font-size: 13px; color: var(--ink-3); }
.mod-f { grid-column: 3; grid-row: 1; display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.mod-body { padding: 0 0 22px 28px; }
.mod-lead { margin: 0 0 12px; font-size: 13.5px; color: var(--ink-3); max-width: 84ch; }
details.part { border-top: 1px dashed var(--line); }
details.part > summary { padding: 11px 0; cursor: pointer; list-style: none; font: 600 11px/1.3 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
details.part > summary::-webkit-details-marker { display: none; }
details.part > summary::before { content: "\25B8"; display: inline-block; width: 14px; }
details.part[open] > summary::before { content: "\25BE"; }
details.part > summary:hover { color: var(--ink); }
.part-in { padding: 0 0 16px; }
.scores.one { grid-template-columns: 1fr; margin-top: 0; }

/* ratios: key ratios, compact groups and rows that open ------------------------------------------------- */
.rkeys { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 12px;
  overflow: hidden; margin: 16px 0 6px; }
.rkey { display: grid; gap: 3px; min-width: 0; padding: 12px 14px 10px; border: 0; background: var(--surface); color: var(--ink); text-align: left; font: inherit; cursor: pointer; }
.rkey:hover { background: var(--bg-soft); }
.rkey .l { font-size: 12px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rkey .v { font: 400 24px/1.05 var(--serif); font-variant-numeric: lining-nums; }
.rkey .d { font: 400 11.5px var(--mono); color: var(--ink-2); white-space: nowrap; }
.rkey svg { display: block; width: 100%; height: 24px; overflow: visible; }
.rkey svg polyline, .rt svg polyline { fill: none; stroke: var(--s1); stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.rkey svg circle, .rt svg circle { fill: var(--s1); }
.rg { margin-top: 24px; }
.rg h3 { display: flex; align-items: baseline; gap: 8px; margin: 0 0 4px; font: 600 11px/1.3 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.rg h3 span { font: 400 11.5px var(--mono); letter-spacing: 0; }
.rg .table-scroll { border-top: 0; }
table.rt { table-layout: fixed; font-size: 13.5px; }
.rt col.c-v { width: 120px; } .rt col.c-p { width: 104px; } .rt col.c-d { width: 112px; } .rt col.c-s { width: 132px; }
.rt thead th { padding: 8px 0 8px 12px; }
.rt thead th:first-child { padding-left: 0; }
.rt tbody th { text-align: left; font-weight: 400; padding: 9px 12px 9px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.rt tbody td { padding: 9px 0 9px 12px; text-align: right; white-space: nowrap; vertical-align: top; }
.rt td.num { font: 400 13.5px var(--mono); font-variant-numeric: tabular-nums; color: var(--ink); }
.rt td.chg { color: var(--ink-2); }
.rt td.spark { padding-top: 7px; }
.rt td.spark svg { display: block; width: 120px; height: 26px; margin-left: auto; overflow: visible; }
.rx { all: unset; cursor: pointer; color: var(--ink); font: 400 14px var(--sans); }
.rx::before { content: "\25B8"; display: inline-block; width: 14px; color: var(--ink-3); font-size: 12px; }
.rx[aria-expanded="true"]::before { content: "\25BE"; }
.rx:hover { color: var(--accent); }
.ti { all: unset; display: inline-grid; place-items: center; width: 16px; height: 16px; margin-left: 6px; border-radius: 50%; border: 1px solid var(--line-2);
  font: 600 10px/1 var(--serif); color: var(--ink-3); cursor: pointer; vertical-align: 1px; }
.ti:hover { color: var(--accent-ink); border-color: var(--accent); }
.rt .mean { display: none; margin: 4px 0 0 14px; font-size: 12.5px; line-height: 1.45; color: var(--ink-3); white-space: normal; }
.explain .rt .mean { display: block; }
.rt tr.rx-row td { padding: 0 0 14px 14px; text-align: left; white-space: normal; font: 400 13px var(--sans); color: var(--ink-2); background: var(--bg-soft); }
.rx-box { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 14px 24px; padding: 12px 14px 4px 0; }
.rx-box h4 { margin: 0 0 6px; font: 600 10.5px/1.2 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.rx-box p { margin: 0 0 8px; }
.rx-box code { color: var(--ink); font-size: 12.5px; }
.inp { list-style: none; margin: 0; padding: 0; font-size: 12.5px; }
.inp li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; padding: 6px 0; border-bottom: 1px solid var(--line); }
.inp li .num { font: 400 12.5px var(--mono); color: var(--ink); text-align: right; }
.inp li .is { grid-column: 1 / -1; font-size: 12px; }
.inp li .is .src + .src { margin-top: 4px; }
.hbars { display: flex; align-items: flex-end; gap: 3px; height: 72px; padding: 4px 0; border-bottom: 1px solid var(--axis); }
.hbars i { flex: 1; background: var(--s1); opacity: .5; border-radius: 2px 2px 0 0; min-height: 1px; }
.hbars i.neg { background: var(--fail); }
.hbars i:last-child { opacity: 1; }
.hlab { display: flex; justify-content: space-between; font: 400 10.5px var(--mono); color: var(--ink-3); margin-top: 4px; }
.rmore > summary { padding: 9px 0; border-bottom: 1px solid var(--line); }
.rmore[open] > summary { border-bottom: 0; }

/* sources and checks ---------------------------------------------------------------------------- */
.check-sum { display: flex; flex-wrap: wrap; gap: 10px 28px; align-items: baseline; margin: 0 0 18px; }
.check-sum b { font: 400 34px/1 var(--serif); }
.families { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
.family { padding: 14px 0; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: auto 1fr auto; gap: 4px 12px; align-items: baseline; align-content: start; }
.family .st { width: 18px; height: 18px; border-radius: 50%; display: inline-grid; place-items: center; font: 600 11px/1 var(--sans); color: var(--on-accent); align-self: start; margin-top: 1px; }
.family .st.ok { background: var(--ok); }
.family .st.warn { background: var(--warn); }
.family .st.fail { background: var(--fail); }
.family .fn { font-weight: 500; color: var(--ink); }
.family .fc { font: 400 13px var(--mono); color: var(--ink-2); white-space: nowrap; }
.family .fd { grid-column: 2 / 4; font-size: 13px; color: var(--ink-3); }
.family .fx { grid-column: 2 / 4; font-size: 12.5px; color: var(--ink-2); margin-top: 6px; }
.family .fx div { font-family: var(--mono); font-size: 12px; padding: 3px 0; }
.docs td { font-size: 13.5px; }
.docs td.id { font: 400 12.5px var(--mono); color: var(--ink-2); word-break: break-all; }
.cite { border: 1px solid var(--line); border-radius: 12px; background: var(--bg-soft); padding: 14px 16px; font: 400 13px/1.6 var(--mono); color: var(--ink-2); word-break: break-word; }
.vh { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } /* read by screen readers only */
#sources .note code { overflow-wrap: anywhere; } /* the dataset hash wraps on a narrow screen */

/* source popover -------------------------------------------------------------------------------- */
.pop { position: absolute; z-index: 50; width: min(380px, calc(100vw - 32px)); padding: 14px 16px; border: 1px solid var(--line-2); border-radius: 12px;
  background: var(--surface-2); box-shadow: var(--shadow); font-size: 13.5px; color: var(--ink-2); }
.pop[hidden] { display: none; }
.pop:not([hidden]) { animation: popin .18s var(--ease); transform-origin: 24px 0; }
@keyframes popin { from { opacity: 0; transform: translateY(-4px) scale(.97); } }
.pop .pl { color: var(--ink-3); font-size: 12.5px; }
.pop .pv { font: 500 17px var(--mono); color: var(--ink); margin: 4px 0 10px; word-break: break-all; }
.pop dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin: 0; }
.pop dt { color: var(--ink-3); font-size: 12.5px; }
.pop dd { margin: 0; word-break: break-word; }
.pop dd code { font-size: 12px; }
.pop dd .src + .src { margin-top: 8px; }
.pop dd .num { font-family: var(--mono); font-size: 12.5px; color: var(--ink); }
.pop .x { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; border: 0; border-radius: 7px; background: transparent; color: var(--ink-3); font-size: 18px; cursor: pointer; }
.pop .x:hover { color: var(--ink); background: var(--bg-soft); }

/* compare --------------------------------------------------------------------------------------- */
.picker { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 6px; }
.pick { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 8px 0 12px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--surface); font: 500 14px var(--sans); color: var(--ink); }
.pick i { width: 14px; height: 3px; border-radius: 2px; }
.pick button { border: 0; background: transparent; color: var(--ink-3); font-size: 17px; cursor: pointer; padding: 0 4px; }
.pick button:hover { color: var(--ink); }
.add { position: relative; }
.add input { height: 36px; width: 240px; padding: 0 12px; border: 1px dashed var(--line-2); border-radius: 10px; background: transparent; color: var(--ink); font: 400 14px var(--sans); }
.add input:focus { outline: 0; border-style: solid; border-color: var(--accent); }
.add .results { top: 42px; width: 340px; }
.cmp td.v { font-family: var(--mono); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.cmp th.c { text-align: right; }
.cmp td.m { color: var(--ink); min-width: 240px; }
@media (max-width: 640px) {
  /* on a phone the measure column narrows and stays in place while the figures scroll */
  .cmp td.m, .cmp th:first-child { min-width: 150px; max-width: 170px; position: sticky; left: 0; background: var(--surface); z-index: 1; }
}
.cmp td.v .sub { white-space: normal; font-family: var(--sans); }
.cmp td.m .def { display: block; font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
.cmp tr.grp td { padding-top: 22px; font: 600 11px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); border-bottom: 1px solid var(--line-2); }

/* method and agents ----------------------------------------------------------------------------- */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.step b { display: block; font: 400 15px var(--mono); color: var(--warm); }
.step h3 { margin: 10px 0 8px; }
.step p { margin: 0; color: var(--ink-2); }
.toc { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.agents { border: 1px solid var(--line); border-radius: 14px; background: var(--bg-soft); padding: 6px 22px; }
.agents .row { display: grid; grid-template-columns: 190px 1fr auto; gap: 16px; align-items: center; padding: 14px 0; }
.agents .row + .row { border-top: 1px solid var(--line); }
.agents .k { font-weight: 600; }
.agents .row p { margin: 4px 0 0; font-size: 13px; color: var(--ink-3); }
#user-agent .note code { white-space: nowrap; } /* a User-Agent name stays on one line */
.agents code { color: var(--ink); word-break: break-all; }
pre.snippet { margin: 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-soft); color: var(--ink);
  font: 400 13px/1.6 var(--mono); overflow-x: auto; white-space: pre; }
.snip-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 22px 0 8px; }
.snip-head h3 { font: 600 14px var(--sans); }
.copy { height: 36px; padding: 0 14px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--surface); color: var(--ink-2);
  font: 500 13px var(--sans); cursor: pointer; }
.copy:hover { color: var(--ink); border-color: var(--ink-3); }
.tools { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
.tools div { padding: 12px 0; border-bottom: 1px solid var(--line); }
.tools code { color: var(--ink); font-size: 13.5px; }
.tools p { margin: 4px 0 0; font-size: 13.5px; color: var(--ink-2); }

footer { margin-top: 80px; border-top: 1px solid var(--line); padding: 28px 0 48px; font-size: 13px; color: var(--ink-3); }
footer .wrap { display: grid; grid-template-columns: 1fr auto; gap: 10px 32px; }
footer nav { display: flex; gap: 18px; flex-wrap: wrap; }
footer nav a { color: var(--ink-3); }
footer nav a:hover { color: var(--ink); }

@media (max-width: 1000px) {
  .cu-cards, .rkeys { grid-template-columns: 1fr 1fr; }
  .cu-lists { grid-template-columns: 1fr; }
  .tiles { grid-template-columns: repeat(3, 1fr); }
  .tile:nth-child(4) { border-left: 0; padding-left: 0; }
  .tile:nth-child(n+4) { border-top: 1px solid var(--line); }
  .charts { grid-template-columns: 1fr 1fr; }
  .chart-card.wide { grid-column: 1 / -1; }
  .features { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  .su, .scores { grid-template-columns: 1fr; }
  .cards { grid-template-columns: 1fr 1fr; }
  .facets { grid-template-columns: 1fr 1fr; }
  .steps { grid-template-columns: 1fr; }
  .nav, .find-btn kbd { display: none; }
  .menu-btn { display: inline-grid; }
  .two, .families, .tools { grid-template-columns: 1fr; }
  .co-head { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .cu-cards { grid-template-columns: 1fr; }
  .mod-body { padding-left: 0; }
  .mod-t { font-size: 20px; }
  .cu-title { font-size: 24px; }
  /* without the period and trend columns the widths come from the cells, so the column definitions go too */
  table.rt { table-layout: auto; }
  table.rt colgroup, .rt .pcol, .rt td.spark, .rt th.tcol { display: none; }
  .rt .per-m { display: block; margin-top: 2px; font: 400 10.5px var(--mono); color: var(--warn); }
  .sort-m { display: block; width: 100%; }
  .rt thead th { white-space: normal; }
  .rx-box { grid-template-columns: 1fr; }
  .wrap { padding: 0 16px; }
  .top .wrap { gap: 12px; }
  .search-box input { font-size: 16px; }
  .add input { font-size: 16px; width: 100%; }
  .add { width: 100%; }
  .add .results { width: 100%; }
  .hero { padding: 44px 0 28px; }
  .hero h1 { font-size: 36px; }
  h1, .co-head h1 { font-size: 32px; }
  .page-head { padding: 32px 0 20px; }
  .lede { font-size: 16.5px; }
  .find-btn span.t { display: none; }
  .find-btn { width: 36px; padding: 0; justify-content: center; }
  .keynums { grid-template-columns: 1fr 1fr; }
  .keynums > * { padding: 20px 12px 18px 0; }
  .keynums > * + * { padding-left: 12px; }
  .keynums > :nth-child(3) { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); }
  .keynums > :nth-child(4) { border-top: 1px solid var(--line); }
  .keynums b { font-size: 36px; }
  .cards, .facets, .features, .charts { grid-template-columns: 1fr; }
  .chart-card.wide { grid-column: auto; }
  .tiles { grid-template-columns: 1fr 1fr; }
  .tile:nth-child(n) { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); }
  .tile:nth-child(-n+2) { border-top: 0; }
  .tile:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--line); }
  .tile .v, button.v { font-size: 25px; }
  .head { display: block; }
  .head .more { display: inline-block; margin-top: 10px; }
  table.stack thead { display: none; }
  table.stack, table.stack tbody, table.stack tr, table.stack td { display: block; width: 100%; }
  table.stack tbody tr { padding: 14px 0; border-bottom: 1px solid var(--line); }
  table.stack tbody td { border: 0; padding: 3px 0; text-align: left !important; }
  table.stack tbody td[data-l]::before { content: attr(data-l) " "; color: var(--ink-3); font: 400 12.5px var(--sans); }
  .agents .row { grid-template-columns: 1fr; gap: 6px; }
  .stmt tbody td:first-child { min-width: 160px; max-width: 190px; }
  .timeline li { grid-template-columns: 1fr; gap: 3px; }
  .timeline .tb { grid-column: 1; }
  footer .wrap { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; transition-delay: 0ms !important; }
}
@media print {
  .an-jump, .r-jump { display: none; }
  .top, .tabs, footer nav, .co-actions { display: none; }
  .panel[hidden] { display: block; }
}

/* app page revamp of 22 October 2026: facet rows, the ledger list, compare sets and lenses ------------- */
.hero-app .lede { margin-bottom: 26px; }
.facet-rows { display: grid; gap: 10px; margin: 22px 0 0; }
.facet-row { display: flex; align-items: flex-start; gap: 14px; }
.facet-row .l { flex: none; width: 64px; padding-top: 7px; font: 600 11.5px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.facet-row .chips { gap: 6px; }
.facet-row .chip { height: 30px; font-size: 13px; }
.app-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 36px; align-items: start; }
.feed-app .feed-still { height: auto; max-height: none; -webkit-mask-image: none; mask-image: none; overflow: visible; }
.sets { display: grid; gap: 10px; }
.set { display: grid; gap: 3px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--ink); }
.set:hover { border-color: var(--line-2); box-shadow: var(--shadow); text-decoration: none; color: var(--ink); }
.set b { font: 500 15px var(--sans); }
.set span { font: 400 12.5px var(--mono); color: var(--ink-2); }
.set small { font-size: 12px; color: var(--ink-3); }
.lenses { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.lens { display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--ink); }
.lens:hover { border-color: var(--line-2); box-shadow: var(--shadow); text-decoration: none; color: var(--ink); }
.lens b { font: 500 14px var(--sans); }
.lens span { font-size: 12.5px; color: var(--ink-3); }
@media (max-width: 900px) { .app-grid { grid-template-columns: 1fr; gap: 28px; } .facet-row { flex-direction: column; gap: 6px; } .facet-row .l { width: auto; padding-top: 0; } }
@media (max-width: 560px) { .lenses { grid-template-columns: 1fr; } }
/* the measure behind a finding's state, against its earlier record: "57.7% from 87.5% in Q1 FY2027" */
.fstate .fm { font: 400 12px var(--mono); color: var(--ink-2); padding: 1px 7px; border: 1px solid var(--line); border-radius: 6px; }
/* adaptations of 23 October 2026: delta pills on the tiles, position bars on the Analysis cards ------------ */
.tile .d { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); }
.tile .d.up { color: var(--ok); border-color: color-mix(in srgb, var(--ok) 35%, transparent); background: color-mix(in srgb, var(--ok) 10%, transparent); }
.tile .d.down { color: var(--fail); border-color: color-mix(in srgb, var(--fail) 35%, transparent); background: color-mix(in srgb, var(--fail) 10%, transparent); }
.pos { position: relative; display: block; height: 6px; margin: 4px 0 2px; border-radius: 999px; background: var(--surface-2); overflow: visible; }
.pos .t { position: absolute; top: -3px; left: var(--x); width: 1px; height: 12px; background: var(--line-2); }
.pos .mk { position: absolute; top: -3px; left: var(--x); width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 2px var(--surface); transition: left .6s var(--ease); }
.pos-scores { background: linear-gradient(90deg, color-mix(in srgb, var(--fail) 35%, var(--surface-2)) 0 22%, var(--surface-2) 22% 52%, color-mix(in srgb, var(--ok) 35%, var(--surface-2)) 52% 100%); }
.pos-credit { background: linear-gradient(90deg, color-mix(in srgb, var(--ok) 30%, var(--surface-2)) 0 25%, var(--surface-2) 25% 66.7%, color-mix(in srgb, var(--fail) 30%, var(--surface-2)) 66.7% 100%); }
.tile .d { height: auto; min-height: 22px; padding: 1px 8px; font-size: 11.5px; line-height: 1.5; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: inline-block; }
.tile .d { font-family: var(--sans); font-size: 12px; font-variant-numeric: tabular-nums; padding: 1px 9px; }

/* the app of 28 October 2026 -------------------------------------------------------------------------------------------
   Every page of the app takes the design of the landing page: the colours of the brand (docs/brand/README.md), glass for
   the header and the tabs, a quiet light of cobalt and amber at the top of each page, cards that rise under the pointer,
   pill controls and the display type of Newsreader. These rules come last, so they hold over the earlier ones; the
   landing page keeps its own styles in landing.css. */
:root {
  --cobalt-2: #5B74F0; --grad: linear-gradient(180deg, #4562EC, #2E47CC); --on-grad: #FFFFFF;
  --elev-1: 0 1px 2px rgba(10, 18, 48, .05), 0 8px 22px -14px rgba(10, 18, 48, .18);
  --elev-2: 0 2px 4px rgba(10, 18, 48, .04), 0 26px 46px -24px rgba(10, 18, 48, .32), 0 12px 22px -14px rgba(10, 18, 48, .14);
  --glow: 0 1px 0 rgba(255, 255, 255, .28) inset, 0 -1px 0 rgba(0, 0, 0, .18) inset, 0 10px 22px -12px rgba(53, 80, 214, .75);
  --aura-1: rgba(91, 116, 240, .15); --aura-2: rgba(240, 161, 90, .12);
  --glass: color-mix(in srgb, var(--bg) 78%, transparent); --glass-2: color-mix(in srgb, var(--bg) 90%, transparent);
  --row-hover: color-mix(in srgb, var(--accent) 4%, var(--surface));
}
:root[data-theme="dark"] {
  --grad: linear-gradient(180deg, #AFBDFF, #8095F6); --on-grad: #0A1230;
  --elev-1: 0 1px 2px rgba(0, 0, 0, .35), 0 10px 24px -14px rgba(0, 0, 0, .7);
  --elev-2: 0 28px 48px -24px rgba(0, 0, 0, .8), 0 12px 22px -14px rgba(0, 0, 0, .55);
  --glow: 0 1px 0 rgba(255, 255, 255, .35) inset, 0 10px 22px -12px rgba(143, 162, 255, .5);
  --aura-1: rgba(91, 116, 240, .18); --aura-2: rgba(240, 161, 90, .07);
  --row-hover: color-mix(in srgb, var(--accent) 7%, var(--surface));
}

/* header: glass over the page, and a hairline once the page has scrolled (site.js) */
.top { background: var(--glass); border-bottom-color: transparent; -webkit-backdrop-filter: saturate(1.8) blur(16px);
  backdrop-filter: saturate(1.8) blur(16px); transition: border-color .3s, background-color .3s; }
.top.scrolled { border-bottom-color: var(--line); background: var(--glass-2); }
.top.open { background: var(--bg); }
.nav a { padding: 7px 13px; border-radius: 999px; transition: color .2s, background-color .2s; }
.nav a[aria-current="page"] { color: var(--accent-ink); background: var(--accent-soft); }
.find-btn, .icon-btn { border-color: var(--line); border-radius: 999px; box-shadow: 0 1px 2px rgba(10, 18, 48, .06);
  transition: border-color .2s, color .2s, box-shadow .3s var(--ease); }
.find-btn:hover, .icon-btn:hover { border-color: var(--line-2); box-shadow: 0 8px 18px -12px rgba(10, 18, 48, .35); }
@media (min-width: 901px) { .find-btn { min-width: 216px; padding: 0 8px 0 14px; } .find-btn kbd { margin-left: auto; } }

/* the light at the top of each page of the app, under the content and within the width of the screen */
body:not([data-page="landing"])::before, body:not([data-page="landing"])::after { content: ""; position: absolute; z-index: -1;
  left: 0; right: 0; top: 0; pointer-events: none; }
body:not([data-page="landing"])::before { height: 620px;
  background: radial-gradient(46% 72% at 90% 0%, var(--aura-1), transparent 70%), radial-gradient(34% 58% at 6% 0%, var(--aura-2), transparent 72%); }
body:not([data-page="landing"])::after { height: 460px; opacity: .5;
  background: linear-gradient(var(--line) 1px, transparent 1px) center -1px / 64px 64px, linear-gradient(90deg, var(--line) 1px, transparent 1px) center -1px / 64px 64px;
  -webkit-mask-image: radial-gradient(56% 80% at 76% 0%, #000 8%, transparent 70%); mask-image: radial-gradient(56% 80% at 76% 0%, #000 8%, transparent 70%); }

/* type: the label of a page opens with the amber square, and the headings take the display sizes of Newsreader */
.kicker { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 18px; letter-spacing: .1em; }
.kicker::before { content: ""; width: 7px; height: 7px; flex: none; background: var(--warm); }
h1 { font-size: clamp(34px, 4.6vw, 58px); line-height: 1.04; letter-spacing: -.03em; font-variation-settings: "opsz" 72; text-wrap: balance; }
h2 { font-size: clamp(24px, 2.4vw, 31px); line-height: 1.12; letter-spacing: -.02em; font-variation-settings: "opsz" 48; }
.page-head { padding: 64px 0 36px; }
.page-head .lede { margin-top: 18px; font-size: 18px; max-width: 60ch; }
section.block { padding: 64px 0 8px; }
.head { margin-bottom: 22px; }
.head p { font-size: 14.5px; }
.head .more { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; }
.head .more::after { content: "\2192"; transition: transform .3s var(--ease); }
.head .more:hover { text-decoration: none; }
.head .more:hover::after { transform: translateX(3px); }
.prose { font-size: 16px; line-height: 1.7; }
.prose h3 { margin: 34px 0 10px; font-size: 22px; }

/* controls: pills, with the cobalt of the brand for the primary action and for what is selected */
.btn { height: 40px; padding: 0 18px; border-color: var(--line-2); border-radius: 999px; box-shadow: 0 1px 2px rgba(10, 18, 48, .06);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .2s, color .2s; }
.btn:hover { border-color: var(--ink-3); transform: translateY(-1px); box-shadow: 0 10px 20px -12px rgba(10, 18, 48, .32); }
.btn.primary { border-color: transparent; background: var(--grad); color: var(--on-grad); box-shadow: var(--glow); }
.btn.primary:hover { color: var(--on-grad); filter: brightness(1.05); box-shadow: var(--glow), 0 16px 30px -14px rgba(53, 80, 214, .6); }
.btn svg { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tool, .copy { border-radius: 999px; }
.chip { height: 34px; padding: 0 14px; border-color: var(--line); box-shadow: 0 1px 2px rgba(10, 18, 48, .05);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .2s, color .2s, background-color .2s; }
.chip:hover { border-color: var(--line-2); transform: translateY(-1px); box-shadow: 0 8px 16px -10px rgba(10, 18, 48, .3); text-decoration: none; }
.chip[aria-pressed="true"] { border-color: transparent; background: var(--grad); color: var(--on-grad); box-shadow: var(--glow); }
.seg { padding: 4px; border-color: var(--line); border-radius: 13px; background: var(--bg-soft); }
.seg button { height: 32px; padding: 0 14px; border-radius: 9px; transition: color .2s, background-color .2s, box-shadow .2s; }
.seg button[aria-pressed="true"] { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgba(10, 18, 48, .1), 0 4px 12px -6px rgba(10, 18, 48, .28); }
:root[data-theme="dark"] .seg button[aria-pressed="true"] { background: var(--surface-2); box-shadow: 0 0 0 1px var(--line-2); }
select { height: 40px; border-radius: 12px; box-shadow: 0 1px 2px rgba(10, 18, 48, .05); background-position: calc(100% - 16px) 17px, calc(100% - 11px) 17px; }
.label { border-radius: 999px; padding: 0 6px 0 12px; }

/* search: a large pill, and results that open as a card */
.search-box { height: 62px; padding: 0 16px 0 22px; border-color: var(--line); border-radius: 999px; box-shadow: var(--elev-1);
  transition: box-shadow .3s var(--ease), border-color .2s; }
.search-box:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft), var(--elev-2); }
.results { top: 70px; border-color: var(--line); border-radius: 20px; box-shadow: var(--elev-2); }
.results li { border-radius: 12px; }
.palette { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.palette .box { border-color: var(--line); border-radius: 22px; box-shadow: var(--elev-2); }
.palette .search-box { height: 62px; border-radius: 0; }

/* cards: a hairline, a soft shadow, and a lift under the pointer where the card is a link */
.card, .set, .lens, .feature, .feed-app, .chart-card, .score-card, .cu-list, .step { border-color: var(--line); border-radius: 18px; box-shadow: var(--elev-1); }
.card, .set, .lens, .feature { transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .2s; }
.card:hover, .set:hover, .lens:hover, .feature:hover { transform: translateY(-3px); border-color: var(--line-2); box-shadow: var(--elev-2); }
.card { padding: 22px 22px 20px; }
.card .name { font-size: 21px; letter-spacing: -.01em; }
.card .figs .v { font-size: 20px; }
.set, .lens { padding: 15px 18px; }
.rv { transition: opacity .6s var(--ease), transform .6s var(--ease); transition-delay: var(--rd, 0ms); }
.set b::after, .lens b::after { content: " \2192"; color: var(--ink-3); }
.chart-card, .score-card { padding: 18px 18px 12px; }
.cu-card { border-radius: 16px; box-shadow: var(--elev-1); }
.agents { border-color: var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--elev-1); }
.step { padding: 22px 22px 20px; border: 1px solid var(--line); background: var(--surface); }
.steps { gap: 16px; }
.pop { border-color: var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--elev-2); }
.cite { border-radius: 16px; }
pre.snippet { border-color: #1B2550; border-radius: 16px; background: #0B1330; color: #DCE3FA; box-shadow: var(--elev-1); }
.pick { height: 38px; padding: 0 8px 0 14px; border-color: var(--line); border-radius: 999px; box-shadow: var(--elev-1); }
.add input { height: 38px; border-radius: 999px; }

/* the key figures of a company and of the coverage, each on a card of its own */
.tiles { gap: 12px; border: 0; }
.tiles > .tile:nth-child(n) { padding: 16px 16px 14px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--elev-1); }
.tile .v, button.v { font-size: 31px; }
/* the note under a figure wraps rather than hides its end */
.tiles .tile .d { white-space: normal; text-overflow: clip; border-radius: 11px; }
.rkeys { border-color: var(--line); border-radius: 18px; box-shadow: var(--elev-1); }

/* findings on a card, numbered in amber */
.findings { padding: 2px 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--elev-1); }
.findings:not(:has(> li)) { padding: 0; border: 0; box-shadow: none; }
.findings > li { padding-left: 36px; }
.findings > li:first-child { border-top: 0; }
.findings > li:last-child { border-bottom: 0; }

/* tables on cards: the statements, ratios, documents and comparisons scroll inside theirs, the directory is one */
.table-scroll.t-card { border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--elev-1); padding: 4px 18px 8px; }
.stmt .t-card th:first-child, .stmt .t-card td:first-child, .cmp td.m, .cmp th:first-child { background: var(--surface); }
.t-card tbody tr:hover td, .t-card tbody tr:hover th, .stmt .t-card tbody tr:hover td:first-child { background: var(--row-hover); }
.t-card tbody tr:last-child td, .t-card tbody tr:last-child th { border-bottom: 0; }
table.boxed { border-collapse: separate; border-spacing: 0; border: 1px solid var(--line); border-radius: 18px; background: var(--surface);
  box-shadow: var(--elev-1); overflow: hidden; }
table.boxed thead th { padding-top: 14px; padding-bottom: 12px; background: var(--bg-soft); }
table.boxed th:first-child, table.boxed td:first-child { padding-left: 22px; }
table.boxed th:last-child, table.boxed td:last-child { padding-right: 22px; }
table.boxed tbody tr:last-child td { border-bottom: 0; }
table.boxed tbody tr.link:hover td { background: var(--row-hover); }
.facets { padding: 22px 24px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); box-shadow: var(--elev-1); }
@media (min-width: 901px) { .facets { grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) minmax(0, .9fr) minmax(0, 1fr); } }

/* the company page: its head, glass for the tabs and the bars under them, and the line of the selected tab */
.crumbs { padding-top: 30px; }
.co-head { padding: 16px 0 30px; }
.co-head h1 { font-size: clamp(34px, 4.4vw, 56px); }
.co-meta { font-size: 15px; }
.co-actions .btn { height: 42px; }
/* a tab panel fills after its tab is chosen (the statements, the ratios, the analysis); the browser would keep an element
   below it in place and push the panel up under the tab strip, so the page keeps its offset instead */
body[data-page="company"] { overflow-anchor: none; }
.tabs, .an-jump, .r-jump { background: var(--glass); -webkit-backdrop-filter: saturate(1.8) blur(16px); backdrop-filter: saturate(1.8) blur(16px); }
.tab-ink { border-radius: 2px; background: linear-gradient(90deg, var(--accent), var(--cobalt-2)); }

/* the app page: the search at the centre, the coverage on cards and the 3 steps of a first visit */
.hero-app { padding: 76px 0 26px; text-align: center; }
.hero-app h1 { max-width: none; font-size: clamp(42px, 6vw, 76px); }
.hero-app .lede { max-width: 56ch; margin: 20px auto 34px; }
.hero-app .search { margin: 0 auto; text-align: left; }
.hero-app .facet-rows { justify-items: center; gap: 18px; margin-top: 34px; }
.hero-app .facet-row { flex-direction: column; align-items: center; gap: 10px; }
.hero-app .facet-row .l { width: auto; padding: 0; }
.hero-app .facet-row .chips { justify-content: center; }
.hero-app .keynums { gap: 12px; margin-top: 46px; border: 0; text-align: left; }
.hero-app .keynums > a:nth-child(n) { padding: 20px 22px 18px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface);
  box-shadow: var(--elev-1); transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
.hero-app .keynums > a:hover { transform: translateY(-3px); box-shadow: var(--elev-2); }
.hero-app .keynums b { font-size: clamp(34px, 3.6vw, 46px); }
.how { padding: 26px 0 0; }
.how-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.how-steps li { padding: 22px 22px 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--elev-1); }
.how-steps .ix { display: inline-flex; align-items: center; gap: 8px; font: 500 12px/1 var(--mono); color: var(--accent); }
.how-steps .ix::before { content: ""; width: 7px; height: 7px; background: var(--warm); }
.how-steps h3 { margin: 14px 0 6px; font: 400 23px/1.2 var(--serif); letter-spacing: -.01em; }
.how-steps p { margin: 0; font-size: 14.5px; color: var(--ink-2); }

/* footer: the mark, the notes and the pages in columns, on the soft ground */
footer { margin-top: 112px; padding: 46px 0 54px; border-top-color: var(--line); background: var(--bg-soft); }
footer .wrap { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 28px 64px; align-items: start; }
footer .brand { display: flex; width: max-content; margin-bottom: 16px; font-size: 21px; }
footer nav { display: grid; grid-template-columns: repeat(3, minmax(0, max-content)); gap: 11px 34px; }
footer nav a { color: var(--ink-2); font-size: 13.5px; }

@media (max-width: 900px) {
  .how-steps { grid-template-columns: 1fr; }
  footer .wrap { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .page-head { padding: 42px 0 24px; }
  section.block { padding-top: 48px; }
  .hero-app { padding-top: 50px; }
  .search-box { height: 56px; padding: 0 12px 0 18px; }
  .results { top: 64px; }
  .palette .search-box { height: 58px; }
  .tiles > .tile:nth-child(n) { padding: 13px 13px 12px; }
  .tile .v, button.v { font-size: 25px; }
  .findings { padding: 2px 16px; }
  .table-scroll.t-card { padding: 2px 12px 6px; }
  table.boxed.stack tbody tr { padding: 14px 18px; }
  table.boxed.stack tbody td:first-child { padding-left: 0; }
  table.boxed.stack tbody td:last-child { padding-right: 0; }
  table.boxed.stack tbody tr:last-child { border-bottom: 0; }
  .facets { padding: 18px; }
  .co-actions .btn { flex: 1; justify-content: center; }
  .co-actions .btn.primary { flex-basis: 100%; }
  .hero-app .keynums > a:nth-child(n) { padding: 16px 16px 14px; }
  footer { margin-top: 80px; }
  footer nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media print { body::before, body::after { display: none; } .top, .tabs { -webkit-backdrop-filter: none; backdrop-filter: none; } }

/* islands of 28 October 2026 -------------------------------------------------------------------------------------------
   The interactive parts of the app, Preact components in site_templates/islands/ bundled into assets/islands/: the
   explanation of a measure, the chart of a statement line, the screener of the directory and the builder of Compare. */
.term-i { display: inline-grid; place-items: center; width: 17px; height: 17px; margin-left: 6px; padding: 0; border: 1px solid var(--line-2);
  border-radius: 50%; background: var(--surface); color: var(--ink-3); font: italic 600 11px/1 var(--serif); cursor: pointer; vertical-align: 1px;
  transition: color .2s, border-color .2s, background-color .2s; }
.term-i:hover { color: var(--accent-ink); border-color: var(--accent); background: var(--accent-soft); }
.term-i:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
thead th .term-i { margin-left: 5px; vertical-align: 0; }
.m-row { display: flex; align-items: center; gap: 4px; }
.isl-pop { position: absolute; z-index: 70; padding: 16px 18px 14px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface);
  box-shadow: var(--elev-2); animation: popin .18s var(--ease); }
.isl-x { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border: 0; border-radius: 999px; background: transparent;
  color: var(--ink-3); font-size: 20px; line-height: 1; cursor: pointer; }
.isl-x:hover { background: var(--bg-soft); color: var(--ink); }
.isl-x:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.isl-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 8px; font: 600 11px/1.2 var(--sans); letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink-3); }
.isl-eyebrow::before { content: ""; width: 6px; height: 6px; flex: none; background: var(--warm); }
.term-pop h3 { margin: 0 34px 10px 0; font: 400 22px/1.2 var(--serif); letter-spacing: -.01em; }
.term-f { display: grid; gap: 5px; margin: 0 0 10px; }
.term-f span { font: 600 10.5px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.term-f code { font: 400 13px/1.5 var(--mono); color: var(--ink); }
.term-m { margin: 0 0 12px; font-size: 14px; line-height: 1.55; color: var(--ink-2); }
.term-a { font-size: 13px; font-weight: 500; }

/* a dialog over the page; on a phone it rises from the bottom */
html.isl-open { overflow: hidden; }
.isl-veil { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 24px; background: rgba(10, 18, 48, .34);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: islfade .2s var(--ease); }
:root[data-theme="dark"] .isl-veil { background: rgba(3, 5, 12, .62); }
.isl-sheet { position: relative; width: min(940px, 100%); max-height: calc(100vh - 48px); overflow: auto; padding: 22px 24px 20px;
  border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: var(--elev-2); animation: islsheet .34s var(--ease); }
.isl-sheet-h { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.isl-sheet-h h2 { margin: 0; font-size: clamp(24px, 3vw, 34px); }
.isl-sheet .isl-x { position: static; flex: none; }
@keyframes islfade { from { opacity: 0; } }
@keyframes islsheet { from { opacity: 0; transform: translateY(16px) scale(.985); } }

/* the chart of a statement line */
.line-open { all: unset; cursor: pointer; border-radius: 4px; }
.line-open:hover { color: var(--accent-ink); }
.line-open:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.line-open svg { width: 12px; height: 12px; margin-left: 6px; vertical-align: -1px; fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; opacity: 0; transition: opacity .2s; }
.line-open:hover svg, .line-open:focus-visible svg { opacity: .85; }
@media (hover: none) { .line-open svg { opacity: .55; } }
.lc-bar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.lc-body { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 18px; align-items: stretch; }
.lc-chart { min-width: 0; border-radius: 12px; cursor: crosshair; touch-action: pan-y; }
.lc-chart:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.lc-chart svg { display: block; overflow: visible; max-width: 100%; height: auto; }
.lc-grid { stroke: var(--grid); stroke-width: 1; shape-rendering: crispEdges; }
.lc-zero { stroke: var(--axis); stroke-width: 1; shape-rendering: crispEdges; }
.lc-y, .lc-x { fill: var(--ink-3); font: 400 11px var(--sans); font-variant-numeric: tabular-nums; }
.lc-b { fill: var(--s1); opacity: .62; transform-box: fill-box; transform-origin: 50% 100%; animation: islbar .55s var(--ease) both;
  animation-delay: calc(var(--i, 0) * 12ms); transition: opacity .15s; }
.lc-b.neg { fill: var(--s2); transform-origin: 50% 0; }
.lc-b.on { opacity: 1; }
.lc-gap { fill: var(--ink-3); opacity: .55; }
@keyframes islbar { from { transform: scaleY(0); } }
.lc-read { min-width: 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--bg-soft); font-size: 13.5px;
  color: var(--ink-2); }
.lc-v { margin: 0 0 10px; font: 400 28px/1.1 var(--serif); color: var(--ink); font-variant-numeric: lining-nums; overflow-wrap: anywhere; }
.lc-m, .lc-why { margin: 0 0 8px; font-size: 13px; color: var(--ink-3); }
.lc-src > span { display: block; margin-bottom: 5px; font: 600 10.5px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.lc-src .src + .src { margin-top: 8px; }
.lc-src a { overflow-wrap: anywhere; }
.lc-note { margin: 16px 0 0; max-width: 92ch; font-size: 12.5px; color: var(--ink-3); }

/* the screener of the directory */
.screener { margin: 0 0 22px; padding: 20px 22px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); box-shadow: var(--elev-1); }
.scr-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; margin-bottom: 16px; }
.scr-head h2 { margin: 0 0 6px; font-size: clamp(22px, 2.2vw, 28px); }
.scr-sub { margin: 0; max-width: 66ch; font-size: 13.5px; color: var(--ink-3); }
.scr-count { display: grid; justify-items: end; gap: 4px; margin: 0; font-size: 13px; color: var(--ink-3); }
.scr-count b { font: 400 36px/1 var(--serif); color: var(--ink); font-variant-numeric: lining-nums; }
.scr-list { display: grid; gap: 10px; margin: 0 0 14px; padding: 0; list-style: none; }
.scr-row { display: grid; grid-template-columns: minmax(0, 1.7fr) auto minmax(120px, .6fr) auto; gap: 8px 10px; align-items: center;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-soft); }
.scr-row select { width: 100%; min-width: 0; }
.scr-op { flex-wrap: nowrap; }
.scr-v { display: flex; align-items: center; height: 40px; padding: 0 12px; border: 1px solid var(--line-2); border-radius: 12px; background: var(--surface); }
.scr-v:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.scr-v input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: 400 15px var(--mono); }
.scr-v .u { margin-left: 6px; color: var(--ink-3); font: 400 13px var(--mono); }
.scr-x { width: 34px; height: 34px; padding: 0; border: 1px solid var(--line-2); border-radius: 999px; background: var(--surface); color: var(--ink-3);
  font-size: 18px; line-height: 1; cursor: pointer; }
.scr-x:hover { color: var(--ink); border-color: var(--ink-3); }
.scr-mean { grid-column: 1 / -1; margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--ink-3); }
.scr-presets, .cb-peers { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.scr-presets { margin: 0 0 14px; }
.scr-presets .l, .cb-peers .l { margin-right: 4px; font: 600 11px/1 var(--sans); letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); }
.scr-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }

/* the builder of Compare */
.cb { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.cb-list { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.cb-list .pick { transition: box-shadow .25s var(--ease), opacity .2s; }
.cb-list .pick.lifted { position: relative; z-index: 5; box-shadow: var(--elev-2); transition: none; }
.cb-list .pick.target { outline: 2px dashed color-mix(in srgb, var(--accent) 55%, transparent); outline-offset: 2px; }
.cb-grip { display: inline-grid; place-items: center; width: 14px; height: 24px; margin-left: -6px; border-radius: 4px; color: var(--ink-3);
  cursor: grab; touch-action: none; }
.cb-grip svg { width: 8px; height: 14px; fill: currentColor; }
.cb-grip:hover { color: var(--ink); }
.cb-grip:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.cb-list .pick.lifted .cb-grip { cursor: grabbing; }
.cb-copy { margin-left: auto; }
.cb-link { flex-basis: 100%; height: 38px; padding: 0 12px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--surface);
  color: var(--ink); font: 400 13px var(--mono); }
.cb-peers { flex-basis: 100%; margin-top: 2px; }
.cb-peer { height: 32px; }

@media (max-width: 760px) { .lc-body { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .isl-veil { place-items: end stretch; padding: 0; }
  .isl-sheet { width: 100%; max-height: 90vh; padding: 18px 16px 16px; border-radius: 22px 22px 0 0; }
  .screener { padding: 16px; }
  .scr-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .scr-row select { grid-column: 1 / -1; }
  .scr-count { justify-items: start; }
  .cb-copy { margin-left: 0; }
}