/* TWO FACES, BOTH OURS (design b, 2026-09-29). inter is the whole site: text,
   headings and figures (tabular numerals on). plex mono is the detail cell and
   the filing id, nothing else. the serif and the two other sans faces left
   with the paper design. latin subsets, self-hosted, swapped in on arrival. */
@font-face{font-family:"Inter";src:url("/fonts/inter.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/fonts/plexmono.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/fonts/plexmono-medium.woff2") format("woff2");font-weight:500 600;font-display:swap}
/* THE TOKENS (design b, 2026-09-29). ONE BLOCK, ONE SOURCE: ops/build_company_pages.py
   lifts this stylesheet into site.css, and every other page links that file. no
   page carries its own :root and no rule below spells a colour in hex; a colour
   with no name here does not exist on the site. the paper tokens were retired
   the same day (an off-white page, a serif, ink buttons, no shadows). the old
   names stay as aliases at the end of the block so nothing breaks while the
   pages are recarded slice by slice; a rule written today uses the new names. */
:root{
  /* SURFACES. a near-white canvas; the panels carry the tone; white is what
     sits ON a panel (an input, a chip, a hovered row, a pill). */
  --bg:#FCFCFD;
  --panel:#E9EDF3;
  --pline:#D9DFE8;      /* a panel's own border */
  --line:#DDE2EA;       /* hairlines everywhere else */
  --white:#FFFFFF;
  --radius:12px;        /* a panel */
  --r-s:8px;            /* a button, an input */
  --r-pill:999px;       /* a chip, a badge */
  --shadow:0 1px 2px rgba(15,23,42,.04);
  /* INK. three greys: the text, the secondary text, the labels. */
  --ink:#0F172A;
  --mut:#64748B;
  --faint:#94A3B8;
  /* MEANING. indigo is the one action and the one highlight; green means
     bought and red means sold, each with the tint that carries its chip. */
  --accent:#4F46E5;
  --accent-l:#EEF2FF;
  --buy:#059669;
  --buy-l:#ECFDF5;
  --sell:#DC2626;
  --sell-l:#FEF2F2;
  --amber:#B45309;
  --amber-w:#FFFBEB;
  --slate-l:#F1F5F9;    /* a chip that carries neither verdict (compensation, a transfer) */
  /* TYPE. one sans, tabular figures; mono for the detail cell and the filing id. */
  --ui:"Inter",ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono","SF Mono",Menlo,monospace;
  /* THE SCALE. seven sizes for everything below a headline (design b slice 2,
     2026-09-29; thirty-seven ad hoc sizes before). a headline is a clamp of its own. */
  --fs-2xs:10.5px;      /* a label, a chip, a badge */
  --fs-xs:11.5px;       /* fine print, a date, a filing id */
  --fs-s:13px;          /* secondary text, a detail cell */
  --fs-m:14px;          /* a table cell, the body of a card */
  --fs-b:15px;          /* prose */
  --fs-l:17px;          /* a section head, the lede */
  --fs-xl:22px;         /* a subsection head, a modal title */
  --max:1280px;         /* ONE MEASURE FOR EVERY PAGE (2026-09-18): the nav and the column never move between pages */
  /* ALIASES FROM THE PAPER DESIGN. each points at a token above; they leave
     as the pages are recarded and the last use goes (grep before deleting). */
  --rule:var(--line);   /* was a 2px ink section rule; a hairline now */
  --line2:var(--line);
  --blue:var(--accent);
  --blue-d:#4338CA;
  --wash:var(--accent-l);
  --stone:#CBD5E1;      /* the leaderboard's bars: a bar that only measures */
  --stone-d:#94A3B8;
  --bar:#CBD5E1;
  --clay:var(--accent); /* the founder mark and the screen counts wore clay; they wear the accent */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{background:var(--bg);color:var(--ink);font-family:var(--ui);font-size:var(--fs-b);line-height:1.5;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
h1,h2,h3{font-family:var(--ui);font-weight:700;letter-spacing:-.02em;color:var(--ink)}
a{color:var(--ink);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:2px}
a:hover{text-decoration:underline}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(20px,3.5vw,48px)}
.mono{font-family:var(--mono)}
.hide{display:none!important}

/* ---------- top bar ---------- */
/* the bar is chrome, not page: ink, so it can never be mistaken for the
   content it floats over. Every colour on it is re-chosen for the dark
   ground -- the brand blue reads as mud on ink, so the accent lightens. */
/* ONE SURFACE. The nav was a black band on a paper page: the heaviest
   thing on the screen, and it read as a different product bolted on top.
   Same paper, a hairline, dark text; the search box is the one fixture. */
/* THE MASTHEAD IS INK. An edge-to-edge band in the site's own colour
   separates navigation from the page without a rule, and states the
   scheme in the first row of pixels. */
.top{position:sticky;top:0;z-index:30;background:var(--bg);border-bottom:1px solid var(--line)}
/* the sticky bar would otherwise sit on top of whatever we jump to */
[id]{scroll-margin-top:80px}
.topin{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:16px;padding-bottom:16px;flex-wrap:wrap}
.logo{font-family:var(--ui);font-weight:700;font-size:var(--fs-xl);letter-spacing:-.02em;color:var(--ink)}
.logo i{font-style:normal;color:var(--ink)}   /* one colour: the type is the mark, not a split */
.topnav{display:flex;align-items:center;gap:22px;font-size:var(--fs-s);font-weight:600;flex-wrap:wrap}
.topnav a{color:var(--mut)}
.topnav a:hover{color:var(--ink);text-decoration:none}

/* ---------- sections ----------
   THE DIVIDER AND THE TITLE, AND NOTHING ELSE.
   Four attempts got here: a hairline nobody saw, an ink rule that read as
   a hard stop, alternating tone that turned a document into stacked
   panels, and a rule plus a blue tick above each title -- one mark too
   many, once the titles themselves had grown. What is left is the rule at
   2px in a grey one step darker than a hairline (seen, never severe), and
   a heading at a size no sub-heading on the page uses. The air is enough
   to say a section has started and no more: it was near 80px, which read
   as a gap rather than as a join. */
.hero{padding:clamp(36px,4.5vw,60px) 0 clamp(28px,3vw,40px)}

/* ---------- hero ---------- */
.hero h1{font-family:var(--ui);font-weight:700;letter-spacing:-.02em;line-height:1.08;font-size:clamp(30px,3.7vw,54px)}   /* one line at the shared measure (2026-09-18) */   /* the same edges as the tables */
.hero h1 b{font-weight:700}
.herosub{margin:18px 0 0;font-size:clamp(15px,1.25vw,18px);line-height:1.5;color:var(--mut)}
@media(max-width:900px){.herosub{white-space:normal;max-width:52ch}}
/* THE HEADLINE MAKES THE CLAIM; THE STRIP CARRIES THE EVIDENCE.
   Three sizes of grey prose with a mono date wedged mid-sentence buried
   the only numbers worth reading. One quiet line of method, a hairline,
   then the figures at a size that matches their importance. */
/* THE HERO IN TWO COLUMNS. The sentence keeps a measure a reader can take
   in one glance (22ch); the third of the page that left empty now holds
   the three numbers that back it, with the date beneath. On a phone the
   columns stack back into the row they were. */
/* THE STRIP IS A ROW UNDER THE WORDS. As a tall right-hand column it set
   the hero's height, and the left half sat empty beneath a two-line
   headline. A row beneath uses the height the words already take. */
.hero .wrap{display:block}
.herostats{margin-top:30px;padding:22px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:row;flex-wrap:wrap;gap:20px 44px;align-items:flex-start}
/* the tape excerpt on the home page: no controls; the full tape a click away */
.excerpt .tapectl,.excerpt .actstats{display:none}
/* THE ASK'S BAND: one line, the promise on the left, the field
   and Send on the right, inside the same column as the tables, with its
   own air above the footer. No weekday (a send is a week, not a
   calendar), no price. */
.homesub{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.homesub input{font:inherit;font-size:var(--fs-m);padding:9px 12px;border:1px solid var(--pline);background:var(--white);border-radius:var(--r-s);width:220px}
.homesub button{font:inherit;font-size:var(--fs-m);font-weight:600;color:var(--white);background:var(--accent);border:0;border-radius:var(--r-s);padding:9px 16px;cursor:pointer}
.homesub button:hover{background:var(--blue-d)}
.homesub button:disabled,.homesub input:disabled{opacity:.55;cursor:default}
.homesub .hs-msg{font-size:var(--fs-s);color:var(--mut);flex-basis:100%}
.hstat .n{font-family:var(--ui);font-size:clamp(28px,2.8vw,38px);font-weight:500;
  letter-spacing:-.022em;line-height:1;white-space:nowrap}
.hstat .n.hl{color:var(--ink)}
.hstat .k{font-family:var(--ui);font-weight:600;font-size:var(--fs-2xs);letter-spacing:.06em;
  text-transform:uppercase;color:var(--faint);margin-top:9px}

/* ---------- leaderboard ---------- */
.shead{display:flex;justify-content:space-between;align-items:baseline;gap:18px;margin-bottom:20px;flex-wrap:wrap}
.shead h2{font-family:var(--ui);font-weight:700;letter-spacing:-.02em;font-size:clamp(24px,2.4vw,32px);line-height:1.1}
.shead .r{font-size:var(--fs-s);color:var(--mut)}
.screenline{min-height:22px;font-size:var(--fs-b);line-height:22px;color:var(--mut);margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Ten bars in the frame, the rest a scroll away -- the ranking runs the
   whole index, so cutting it at ten hid 490 companies behind nothing at
   all. Room is left on the right so the scrollbar does not sit on the
   percentages. */
/* A SECTION BODY IS A CARD. Title and controls on the paper; the content
   in a flat panel with a hairline, the way the activity feed's days
   already were. On a paper page with paper bars, everything blended. */
/* THE CARD IS THE PICTURE. This is the visual most likely to be snipped
   and shared, so everything a screenshot needs is inside the card: what it
   ranks, at which close, the legend, and where it came from. Ten rows and
   no scrollbar (a scrolling list reads as cut off); "show all" expands. */
/* A SECTION BODY IS A PANEL (design b slice 2, 2026-09-29): the controls and the table
   in one card; the title and its exit stay on the canvas above it. */
.sbody{background:var(--panel);border:1px solid var(--pline);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px 6px;margin-top:14px}
/* THE LIST SCROLLS INSIDE THE CARD. Ten rows show; the rest are a scroll
   away, in the same card, with no button that unrolls two thousand rows
   onto the page. */
/* STONE: A BAR THAT ONLY MEASURES. Green would say "bought" and red
   "sold"; a leaderboard bar says neither, so it takes the one colour on
   the site that means nothing, a warm stone a step below the paper. Light
   enough that the ink label and the ink founder mark sit on it exactly as
   they sit on the track beside it, so a name inside the bar and one past
   its edge are set the same way; a screenshot is done without a cursor on
   it. Hover deepens the tone. */
/* (the seal, its pill and the blur CSS left with the paid tier, 2026-09-23) */

/* ---------- table ---------- */
.controls{display:flex;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.search{flex:1;min-width:240px;display:flex;align-items:center;gap:9px;border:1px solid var(--pline);border-radius:var(--r-s);padding:9px 13px;background:var(--white)}
.search svg{flex:none;opacity:.35}
.search input{border:none;outline:none;width:100%;font:inherit;background:none}
.chip{font-size:var(--fs-s);font-weight:600;padding:7px 12px;border:1px solid var(--pline);border-radius:var(--r-pill);color:var(--ink);background:var(--white)}
.chip.on{background:var(--ink);border-color:var(--ink);color:var(--white)}
select{font:inherit;font-size:var(--fs-s);border:1px solid var(--pline);border-radius:var(--r-s);padding:9px 11px;background:var(--white)}
select:disabled{opacity:.45;cursor:not-allowed}
/* A WINDOW, NOT A WALL.
   Five hundred rows pushed everything below the table off the page, and the
   Show-all button made the reader choose between a truncated view and an
   unusable one. The body scrolls inside a fixed frame instead, ten rows
   deep, with the column heads pinned so you can still see what you are
   sorting by at row four hundred. */
.tscroll{max-height:660px;overflow:auto;overscroll-behavior:contain;
         border-bottom:1px solid var(--line)}
.tscroll thead th{position:sticky;top:0;z-index:2;background:var(--panel);
  /* a sticky cell cannot carry a collapsed border, so it is drawn inset */
  border-bottom:none;box-shadow:inset 0 -1px 0 var(--line)}
table{width:100%;border-collapse:collapse}
.sbody .tscroll{background:transparent;border:0;border-radius:0}   /* the scroll box keeps its own overflow; the panel is the frame */
/* THE SCREENER IS THE WIDTH OF THE PAGE. Fixed layout, every column with a
   width, the two text columns truncating; nothing scrolls sideways. */
table.screen{table-layout:fixed;width:100%}
table.screen td{overflow:hidden}   /* the two text columns truncate; a header never does */
.tscroll{overflow-x:hidden}
/* /companies/: eleven columns, widths that sum to 100 */
.w-rk{width:4%}.w-co{width:31%}.w-ceo{width:27%}.w-own{width:10%}.w-val{width:10%}.w-mc{width:10%}.w-r1{width:8%}
.c-ltd .ltd{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);white-space:nowrap}   /* as the tape's Traded and Filed columns */
table.screen thead th{letter-spacing:.05em}
table.screen thead th .arr{width:auto}
table.screen .c-lt .lt{gap:6px}
thead th.c,td.c{text-align:center}
.c-ns .nsy{display:inline-block;font-weight:700;color:var(--buy);font-size:var(--fs-m)}
table.screen thead th .arr{width:.7em}
/* the screener's cells: no left inset, a gutter on every numeric column so
   a right-aligned figure sits away from the next column's words */
table.screen thead th,table.screen tbody td{padding-left:0;padding-right:10px}
table.screen thead th.n,table.screen tbody td.n{padding-right:28px}
td.c-co .nm,td.ceo .cn{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
td.ceo .fb{vertical-align:2px}
.c-mc{white-space:nowrap}
@media(max-width:980px){.h-mc,.c-mc,.w-mc{display:none}.w-co{width:24%}}
@media(max-width:760px){.c-conf,.c-lt,.c-ltd,.h-mc,.c-mc,.w-mc{display:none}.w-co{width:34%}.w-ceo{width:26%}.w-own{width:20%}.w-val{width:14%}
  table.screen .tbar{display:none}table.screen thead th,table.screen tbody td{padding-left:8px;padding-right:8px}}
thead th{font-family:var(--ui);font-size:var(--fs-xs);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);text-align:left;padding:0 10px 10px 0;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0;background:var(--panel);z-index:1}
/* A NUMBER SITS AWAY FROM THE NEXT COLUMN'S WORDS. Right-aligned figures
   end at their column's edge, where a left-aligned label begins; without
   an inset the two touch (Value against Last move, New stake against
   Manner). Every numeric column keeps a gutter on its right. */
thead th.n,tbody td.n{padding-right:28px}
thead th.sortable{cursor:pointer;user-select:none}
thead th.sortable:hover{color:var(--ink)}
thead th .arr{display:inline-block;width:1em;color:var(--blue)}
thead th.n,td.n{text-align:right}
tbody td{padding:9px 10px 9px 0;border-top:1px solid var(--line2);font-size:var(--fs-m);vertical-align:middle}
tbody tr{cursor:pointer}
tbody tr:hover{background:var(--slate-l)}
td.rk{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);text-align:right;width:44px}
td .tk{font-family:var(--ui);font-weight:700;font-size:var(--fs-m)}   /* one face, one size (2026-09-18): the ticker in bold, the name beside it in the muted ink */
td .nm{font-size:var(--fs-m);color:var(--mut)}
td.ceo{white-space:nowrap;overflow:hidden}
td.ceo .ceow{display:flex;align-items:center;gap:8px;min-width:0}
td.ceo .cn{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
td.ceo .fb{flex:none;margin-left:0}
.tbar{flex:1;height:4px;background:var(--line2);border-radius:2px;overflow:hidden;min-width:40px}
.tbar i{display:block;height:100%;background:var(--stone-d)}
/* A FIGURE IS THE SAME FIGURE IN EVERY TABLE (2026-09-14: the home table's
   cell rule at 14px outranked this at 13px; now one rule names both tables
   at a specificity nothing else reaches) */
td.num,.tablesec.home tbody td.num,table.tape tbody td.n{font-family:var(--ui);font-size:var(--fs-m);color:var(--ink);font-variant-numeric:tabular-nums}   /* one face, one size, in every cell (2026-09-18); tabular figures keep the columns aligned */
td.asof{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);white-space:nowrap}
.conf{display:inline-flex;align-items:center;gap:7px;font-size:var(--fs-xs);color:var(--mut)}
.dot{width:8px;height:8px;border-radius:50%;flex:none}
.dot.high{background:var(--ink)}
.dot.medium{background:#fff;border:2px solid var(--ink)}
.dot.low{background:#fff;border:2px solid var(--amber)}
td.src a{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint)}
td.src a:hover{color:var(--blue)}
.c-lt .up{color:var(--buy);font-weight:600}.c-lt .down{color:var(--sell);font-weight:600}
/* THE 12-MONTH CHANGE (2026-09-17): points, coloured by direction like the tape's change; a dash for a record younger than a year */
/* no colour in the figures (2026-09-18): a stake a year ago is a figure, not a verdict */
td.c-fd{font-size:var(--fs-s);color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* a right-aligned number beside a left-aligned word reads as one token; the
   word column gets a gutter so the two groups (numbers, then the trade)
   stay apart */table.screen td.c-lt{padding-left:0}
/* the 1-year return is a figure, uncoloured */
.tfoot{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 0 8px;font-size:var(--fs-s);color:var(--mut);flex-wrap:wrap}
.tablesec.home .tfoot{padding:14px 0 0;font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint)}   /* the same count line as the tape's */
.tablesec.home .tfoot a{color:var(--faint)}
.tablesec.home .controls{display:none}
/* the exit from a preview: title left, its full page right, the same on every block */
.shead .exit{font-family:var(--ui);font-size:var(--fs-s);font-weight:600;color:var(--ink);background:var(--white);border:1px solid var(--pline);border-radius:var(--r-s);padding:8px 14px;text-decoration:none;white-space:nowrap;align-self:center}
.shead .exit:hover{background:var(--ink);border-color:var(--ink);color:var(--white);text-decoration:none}
.tablesec:not(.home) .shead .exit{display:none}
.tablesec:not(.home) .home-sub{display:none}   /* /companies/ has its chips and switches instead */
/* the home tape is founders only by its own subhead; a mark on every name says nothing */
.excerpt .fm{display:none}
/* TWO CUTS OF ONE INSTRUMENT (2026-09-14): the home preview shares the
   tape's chrome: no outer box, the same header row, the same hairlines
   and row rhythm; one line per company; the columns a stranger needs
   (Company · CEO · Own · Value · Last move, the date inside Last move). */
.tablesec.home .tscroll{border:0;background:transparent;border-radius:0;max-height:none;overflow:visible}
.tablesec.home tbody td{font-size:var(--fs-m)}
.tablesec.home td .tk{display:inline;margin-right:8px}
.tablesec.home td .nm{display:inline;font-size:var(--fs-s)}
.tablesec.home td.c-co{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* ONE GRID: the home preview is five columns whose widths sum to 100
   (Company 28 · CEO 24 · Own 12 · Value 12 · Last move 24). The columns
   it does not carry are removed from the DOM at first paint (pruneHome),
   not hidden: a fixed-layout grid counts a hidden <col> inconsistently. */
.tablesec.home td.rk,.tablesec.home .c-fd,.tablesec.home .c-r1,.tablesec.home .c-amt{display:none}
.tablesec.home .w-co{width:38%}.tablesec.home .w-ceo{width:26%}.tablesec.home .w-own{width:12%}.tablesec.home .w-val{width:12%}.tablesec.home .w-mc{width:12%}
.tablesec.home td.c-mc{color:var(--mut)}   /* the company's size is context, in the lighter ink; the founder's numbers in the full ink */
.tablesec.home td.c-lt .dt{display:none}   /* the date is its own column, as on the tape */
.tablesec.home td.ceo .cn{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
td.c-lt .dt{display:none;font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);margin-left:8px}
/* THE HOME PAGE'S SIX COLUMNS: company, CEO, founder, ownership, value,
   the last move and its date. Market cap, the year's return and the
   amount are the screener's, on /companies/. */

.more{font-weight:600;font-size:var(--fs-s);background:var(--white);border:1px solid var(--pline);border-radius:var(--r-s);padding:8px 16px}
.more:hover{background:var(--ink);border-color:var(--ink);color:var(--white)}

/* the screener's two new cells */
.c-lt .ns{display:inline-block;font-family:var(--ui);font-size:var(--fs-2xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);background:var(--accent-l);border-radius:var(--r-pill);padding:2px 6px;margin-top:4px}
.c-lt .lt{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.chip.export{margin-left:auto}
.c-lt .ltd{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint)}

/* ---------- trends ---------- */
/* ONE LOCK, USED EVERYWHERE.
   There were two: a blurred table with a floating seal, and a bordered box
   over a blurred chart -- so a reader met two different things meaning the
   same thing, and neither said plainly "there is more here". Now every
   locked thing looks identical: the real content behind a blur, a wash of
   the page colour over it so the text underneath cannot be read, and one
   card on top. What is locked is the shape you can still see; what unlocks
   it is the same button every time. */
/* A LOCKED TABLE IS THE SAME SIZE AS AN OPEN ONE.
   Blurring nine rows produced a 500px field of haze taller than the table
   it was teasing. The locked block is capped to the height of the tables
   elsewhere on the page, and what does not fit is simply clipped -- the
   point is to show the shape of what is missing, and that reads in 340px
   as well as it does in 900. */
.lock{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:11px;text-align:center;padding:20px}
.lock .seal{width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;
  display:grid;place-items:center;font-size:var(--fs-b)}
.lock p{font-size:var(--fs-s);color:var(--mut);max-width:34ch;line-height:1.5}
/* a locked block never collapses to nothing: the blur needs room to read as
   content rather than as a smudge */

/* ---------- recent activity ---------- */
/* THE DAY STRIP. One bordered box, the newest filing day, every filing on
   it. It is the thing a returning reader looks at first and the thing that
   gets screenshotted, so it carries a date a human can read, a count, and
   its own permalink. */
/* the day chips are the section's own chips -- white with a border, the
   chosen one filled ink -- so they read as the filter they are */
/* THE DAY IS A TABLE. Kind, company, value, stake, manner, transaction,
   filing: seven columns, every row the same shape, so twelve filings
   scan as a table and not as twelve sentences of different lengths. */
/* THE TAPE (PLAN.md section 5): a weather line, the controls, one table
   grouped by kind; no card grid. Tables are the site. */
.tapehead{align-items:flex-start;margin-bottom:8px}
.activitysec.excerpt{padding-top:56px;padding-bottom:56px}
.activitysec.excerpt .shead .exit{margin-top:6px}
.tapesub{font-family:var(--ui);font-size:var(--fs-s);color:var(--mut);margin-top:8px}   /* a caption: who · when · order, one size on both tables */
.actstats{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 22px}
.actstats .hstat{background:var(--panel);border:1px solid var(--pline);border-radius:var(--r-s);padding:10px 14px;min-width:120px}
.actstats .hstat .n{font-size:clamp(24px,2.4vw,32px)}
.actstats b{color:var(--ink);font-weight:700}
.tapectl{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.tapectl .chips{gap:6px}
.chip.win.dim{color:var(--faint);border-color:var(--line2)}
.chip.win.dim:hover{color:var(--ink);border-color:var(--line)}
.toggles{display:flex;gap:22px;flex-wrap:wrap;margin-left:6px}
.tg{font-size:var(--fs-s);color:var(--ink);display:inline-flex;align-items:center;gap:7px;cursor:pointer}
.tg input{accent-color:var(--ink);width:14px;height:14px;margin:0}
.tapewrap{overflow:auto}
table.tape{width:100%;border-collapse:collapse;table-layout:fixed}
/* ONE SHAPE FOR BOTH TABLES: the name columns take the left half, the
   figures sit in narrow right-aligned columns near their labels, the
   last two columns are the move and its date. The CEO cell truncates. */
/* THE CONTROLS AS GROUPS (2026-09-21): a small mono label over a row of chips; the home preview hides the two trade groups */
.controls{display:flex;flex-direction:column;gap:12px;align-items:stretch;margin-bottom:12px}
.controls .crow{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:flex-end}
.controls .crow .search{flex:0 1 420px}
.controls .grp{display:flex;flex-direction:column;gap:5px}
.controls .grp .chip{padding:6px 9px;font-size:var(--fs-s)}
.tablesec .shead{margin-bottom:6px}
.tfoot .export{margin-left:auto}
.controls .grp .gl{font-family:var(--ui);font-weight:600;font-size:var(--fs-2xs);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);white-space:nowrap}
.controls .grp .gc{display:flex;gap:6px}
.controls .grp .chip{margin:0}
.tablesec.home .controls .g-trade{display:none}
.tw-kind{width:19%}.tw-td2{width:7%}.tw-co{width:20%}.tw-ceo{width:15%}.tw-v{width:9%}.tw-sh{width:9%}.tw-ch{width:9%}.tw-st{width:8%}.tw-lk{width:4%}   /* eight columns and the filing's link (2026-10-15): one line per row; the detail after the badge, the name after the ticker, each cut with an ellipsis at its column's edge */
table.tape td.kd .dt{font-family:var(--ui);font-size:var(--fs-xs);color:var(--mut);margin-left:8px}
table.tape td.kd .dt a{color:inherit}
table.tape td.co .tk{display:inline-block;min-width:5ch;font-family:var(--mono);font-weight:600;font-size:var(--fs-s);color:var(--ink)}   /* a fixed slot: the names line up whatever the ticker's length (W, ALMU, FWONA) */
table.tape td.co .nm{font-size:var(--fs-xs);color:var(--mut);margin-left:10px}
table.tape th.lk,table.tape td.lk{text-align:right;padding-right:10px;overflow:visible;text-overflow:clip}
table.tape td.lk a{color:var(--faint);display:inline-flex;vertical-align:middle}table.tape td.lk a:hover{color:var(--ink)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
td.tk{font-weight:600;white-space:nowrap}
table.tape th.sortable{cursor:pointer;user-select:none}table.tape th.sortable:hover{color:var(--ink)}table.tape td.fd{white-space:nowrap}
table.tape th{font-family:var(--ui);font-size:var(--fs-xs);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);text-align:left;padding:0 10px 10px 0;border-bottom:1px solid var(--line)}
table.tape th.n,table.tape td.n{text-align:right;padding-right:28px}
table.tape td{padding:9px 10px 9px 0;border-top:1px solid var(--line2);font-size:var(--fs-m);vertical-align:middle;white-space:nowrap}
table.tape tr.dayrow{cursor:pointer}
table.tape tr.dayrow:hover td{background:var(--slate-l)}
/* A ROW THAT MOVED NOTHING IS NOT GREYED OUT (2026-09-16): the kind's own
   colour (Compensation faint, Planned muted) says how much it matters; every
   other column reads like every other row, so the table stays one table.
   The dim class remains on the row for the "Moved the stake" chip and the
   note's count, and only the kind cell reads from it. */
td.dt{font-family:var(--mono);font-size:var(--fs-xs);color:var(--mut);white-space:nowrap;overflow:hidden;max-width:170px;padding-right:10px}
td.td2{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);white-space:nowrap;overflow:hidden;padding-right:10px}
/* THE KIND CHIP (design b, 2026-09-29): one rule for the tape, the home strip and
   the company record. a tinted pill: red for a sale (planned or not), green for
   a purchase, slate for compensation and a transfer, the faintest for a share
   count. company.html carried its own copy; it does not now. */
.kind{display:inline-block;font-family:var(--ui);font-size:10px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;line-height:1;padding:4px 7px;border-radius:var(--r-pill);background:var(--slate-l);color:var(--mut);white-space:nowrap;vertical-align:middle}
.kind.bought{background:var(--buy-l);color:var(--buy)}
.kind.sold,.kind.disc,.kind.plan{background:var(--sell-l);color:var(--sell)}
.kind.comp{background:var(--slate-l);color:var(--mut)}
.kind.xfer{background:var(--slate-l);color:var(--ink)}
.kind.neu{background:transparent;border:1px solid var(--line);color:var(--faint);padding:3px 7px}
table.tape tr.dim td.kd .kind{color:var(--faint)}
/* THE DETAIL IS THE FILING'S LABEL IN GREY, the same cell the company page
   draws: "COMPENSATION award granted", "SOLD not stated" */
table.tape td.kd{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
table.tape td.kd .detail{font-size:var(--fs-xs);color:var(--mut);margin-left:7px}
table.tape td.kd .detail a{color:inherit;text-decoration:none}table.tape td.kd .detail a:hover{text-decoration:underline}
table.tape td.td .late{color:var(--mut);white-space:nowrap}   /* a filing that landed days after its transaction says so (2026-09-20) */

table.tape .lowc{font-family:var(--mono);font-size:var(--fs-2xs);color:var(--faint);margin-left:4px;cursor:help}
/* ONE ROW OF CONTROLS (2026-09-15): when · who · what · how much, in
   reading order, wrapping on a narrow screen; the dashed chip sits after
   Transfers, not alone at the right */
.tapectl .tchips{display:inline-flex;gap:6px;flex-wrap:wrap;align-items:center}
.tapectl .tchips .chip small{font-weight:500;color:var(--mut);margin-left:4px}
.tapectl .tchips .chip.on small{color:rgba(255,255,255,.72)}
.tapectl .tchips .tsep{width:1px;height:18px;background:var(--line);margin:0 4px}
.tapectl .tchips .chip.big{border-style:dashed}.tapectl .tchips .chip.big.on{border-style:solid}
/* THE COMPANY CELL IS THE SAME CELL IN BOTH TABLES: the ticker in mono, the
   name in grey after it, the row truncating rather than spilling */
table.tape td.co{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
table.tape td.co a{font-family:var(--ui);font-weight:700;font-size:var(--fs-m);color:inherit;text-decoration:none;margin-right:8px}table.tape td.co a:hover{text-decoration:underline}
table.tape td.co .nm{font-size:var(--fs-m);color:var(--mut)}
table.tape td.ceo{overflow:hidden;text-overflow:ellipsis}
table.tape td.ceo .cn{display:inline-block;max-width:calc(100% - 40px);overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
table.tape td.n{font-family:var(--mono);font-size:var(--fs-s)}
table.tape td.v a{color:inherit;text-decoration:none}table.tape td.v a:hover{text-decoration:underline}
table.tape td.td .dt,table.tape td.fd .dt{color:var(--ink);font-family:var(--ui);font-size:var(--fs-m);white-space:nowrap;font-variant-numeric:tabular-nums}
.firstb{display:inline-block;margin-left:8px;font-family:var(--mono);font-size:var(--fs-2xs);letter-spacing:.1em;text-transform:uppercase;color:var(--buy);border:1px solid var(--buy);border-radius:999px;padding:1px 6px;vertical-align:middle}
.actnote{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);margin-top:14px}
.actnote a{color:var(--faint);text-decoration:underline;text-underline-offset:2px}
.dayempty{padding:14px 24px 10px;font-size:var(--fs-s);color:var(--mut);line-height:1.6;text-align:center}
@media(max-width:640px){.dayrow{grid-template-columns:auto minmax(0,1fr)}}

/* THE TWO COLUMNS. Same frame, same chips, same bar; only the colour and
   the heading differ, so the eye compares them as a pair. Each column
   scales its bars to ITS OWN largest person -- the headline totals carry
   the absolute comparison, the bars carry the ranking within a side. */
/* align-items:start, deliberately: a short buy column beside a long sell
   column is the finding, so neither column is stretched to the other */
/* ONE COLOUR FOR ONE FACT. The badges already say 10b5-1 with a light
   tint of the same colour; the bars said it with stripes, a second
   vocabulary for the same thing. Now the light tint everywhere. */
/* on a phone the bar takes its own line beneath the name, full width */
/* THE FOUNDER MARK. The site exists to tell founders from hired hands, so
   the section says which is which -- quietly, and in the leaderboard's own
   badge: the same ink pill, abbreviated to F, always after the name so
   every name starts at the same edge. The proxy sentence is on hover, and
   an ambiguous proxy gets nothing. In a bar the name is the flexible part
   and the pill is not, so a long name shortens before the pill can go. */
.fm{display:inline-block;flex:none;box-sizing:border-box;width:16px;height:16px;line-height:16px;text-align:center;font-family:var(--ui);font-size:var(--fs-2xs);font-weight:700;letter-spacing:0;border-radius:var(--r-pill);padding:0;margin-left:7px;vertical-align:1px;background:var(--accent-l);color:var(--accent);cursor:help}
/* the day chips: the last five filing days, newest on the right */
/* THE STRIP IS A FIXED FRAME. A day of three trades and a day of thirty
   take the same space; the rows scroll inside it, and the page below never
   jumps when a chip is chosen. */
.dayempty{height:100%;display:grid;place-items:center}
/* SALES THAT DID NOT MOVE A STAKE ARE OFF THE PAGE AND ONE CLICK AWAY.
   The site's question is ownership. Options cashed and units converted
   are real sales of real shares and the measured stake ends where it
   began; they used to earn a paragraph under Sold explaining why they
   were not ranked. Now nothing above ranks, lists or sums them, one
   sentence for the whole section says how many were kept out, and the
   table holds every one -- the record stays complete, the page stops
   explaining. */

.actnote a:hover{color:var(--blue)}
/* TWO KINDS OF CHIP, TOLD APART BY TONE.
   Views and directions are white; the chips after the divider -- the
   manners of selling, the founders-only modifier -- sit on the panel wash,
   so the row reads as two families even before the divider is noticed.
   The divider itself steps up to the section-rule grey. */
.chip[data-kind]{background:var(--panel)}
.chip[data-kind].on{background:var(--ink)}
#perfchart svg{width:100%;height:auto;display:block}
.fsw{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none;
  font-family:var(--mono);font-size:var(--fs-xs);letter-spacing:.02em;color:var(--faint)}
.fsw .tr{width:34px;height:19px;border-radius:999px;background:var(--line);position:relative;
  transition:background .15s;flex:none}
.fsw .tr i{position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;
  background:#fff;transition:left .15s;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.fsw.on .tr{background:var(--ink)}
.fsw.on .tr i{left:17px}
.fsw.on{color:var(--ink)}
.fsw:hover{color:var(--ink)}
.chip i{font-style:normal;font-family:var(--mono);font-size:var(--fs-2xs);color:var(--faint);margin-left:7px}
.chip.on i{color:rgba(255,255,255,.62)}
/* the badge in a row is the fastest filter on the page, so it acts like one */
/* the feed is a window, not a wall -- same rule as the company table */
.pwarn{cursor:help;color:var(--amber)}
.approx{cursor:help;color:var(--amber)}
/* ONE BOX FOR EVERY BADGE. BOUGHT is two letters wider than SOLD and a
   column of them raggedly staggered the figures beside them; every badge
   is now the same width, its word centred, wherever it appears. */
.nopr{color:var(--faint);font-weight:400}

.fb{display:inline-block;font-family:var(--ui);font-size:var(--fs-2xs);font-weight:600;letter-spacing:.06em;border-radius:var(--r-pill);padding:2px 7px;margin-left:8px;vertical-align:1px}
.fb.yes{background:var(--accent-l);color:var(--accent)}
.fb.unc{border:1px solid var(--faint);color:var(--mut)}
/* ---------- links that open a company's page ---------- */
a.pglink{color:inherit;text-decoration:none}
a.pglink:hover{text-decoration:underline}
td.c-co .tk a{color:inherit;text-decoration:none}
td.c-co .tk a:hover{text-decoration:underline}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;display:none;place-items:center;z-index:60;padding:20px;background:rgba(12,13,14,.4)}
.modal.on{display:grid}

footer{padding:22px 0 44px;font-family:var(--ui);font-size:var(--fs-s);color:var(--faint);border-top:1px solid var(--line)}
footer .row{display:flex;justify-content:center;text-align:center;align-items:baseline;gap:4px 20px;flex-wrap:wrap}
footer .fname{font-family:var(--ui);font-weight:700;color:var(--ink)}
footer a{color:var(--mut)}
footer .mono{font-family:var(--ui);font-size:var(--fs-s)}   /* the dates in the footer's own face */
/* THE SEARCH IS THE NAV (2026-09-23): a ticker box in the header, on every
   page. It matches tickers, companies AND chief executives, because the
   queries that reach the site are people's names. /search.js fills it. */
/* THE ACCOUNT IN THE NAV (2026-10-14): the address, a caret, a small menu beneath */
.navme{position:relative}
.navme.in>a{color:var(--ink);max-width:26ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:bottom}
.navmenu{position:absolute;right:0;top:calc(100% + 10px);min-width:190px;background:var(--white);border:1px solid var(--pline);border-radius:var(--r-s);box-shadow:var(--shadow);padding:6px 0;z-index:40}
.navmenu a{display:block;padding:8px 14px;color:var(--ink);font-weight:500}
.navmenu a:hover{background:var(--panel)}
.navmenu a:last-child{color:var(--mut);border-top:1px solid var(--line)}
.navsearch{position:relative;margin-right:6px}
.navsearch input{font-family:var(--ui);font-size:var(--fs-s);width:210px;max-width:38vw;padding:8px 10px;border:1px solid var(--pline);background:var(--white);color:var(--ink);border-radius:var(--r-s)}
.navsearch input:focus{outline:none;border-color:var(--accent)}
.navqd{position:absolute;right:0;top:calc(100% + 6px);width:min(430px,92vw);background:var(--white);border:1px solid var(--pline);border-radius:var(--r-s);box-shadow:0 8px 24px rgba(15,23,42,.10);z-index:60;max-height:60vh;overflow:auto}
.navqd .qrow{display:flex;gap:10px;align-items:baseline;padding:9px 12px;cursor:pointer;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.navqd .qrow:last-child{border-bottom:0}
.navqd .qrow.on,.navqd .qrow:hover{background:var(--slate-l)}
.navqd .qtk{font-family:var(--mono);font-size:var(--fs-xs);font-weight:600;min-width:52px}
.navqd .qco{font-size:var(--fs-s);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.navqd .qceo{font-size:var(--fs-s);color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:34%}
.navqd .qpct{font-family:var(--mono);font-size:var(--fs-xs);font-weight:600;white-space:nowrap}
.navqd .qf{font-family:var(--mono);font-size:var(--fs-2xs);letter-spacing:.08em;color:var(--accent);font-weight:700}
@media(max-width:700px){.navsearch input{width:120px}.navmenu{left:0;right:auto}}

/* ---- THE FRONT-DOOR HOME PAGE (2026-09-23) ---- */
.hero .wrap.heroin{display:flex;flex-direction:column;align-items:center;text-align:center;padding:4px 0 40px}
.hero h1{max-width:21ch}
.herosub{max-width:62ch}
.herosearch{position:relative;display:flex;align-items:center;gap:12px;width:min(640px,100%);height:58px;background:var(--white);border:1px solid var(--pline);border-radius:var(--radius);box-shadow:var(--shadow);padding:0 12px 0 18px;margin:26px 0 8px}
.herosearch .hsico{color:var(--mut);flex:none}
.herosearch input{flex:1 1 auto;border:0;outline:none;background:transparent;font:inherit;font-size:var(--fs-b);color:var(--ink);min-width:0}
.herosearch .hskey{font-family:var(--ui);font-weight:600;font-size:var(--fs-xs);color:var(--faint);border:1px solid var(--line);border-radius:6px;padding:2px 8px;flex:none}
.herosearch .navqd{top:calc(100% + 6px);left:0;right:0;text-align:left}
.herostats{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:24px;border-top:0;padding-top:0}
.herostats .hstat{background:var(--panel);border:1px solid var(--pline);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 28px;min-width:200px;text-align:center}
.fweek .fwrows{background:var(--panel);border:1px solid var(--pline);border-radius:var(--radius);box-shadow:var(--shadow);padding:2px 18px;margin-top:14px}
.fweek .fwrow:first-child{border-top:0}
.stakes{padding-top:52px}   /* air after the fweek rows' bottom rule (2026-09-24) */
.fwrow{display:flex;align-items:baseline;gap:18px;padding:15px 0;border-top:1px solid var(--line)}
.fwdate{font-family:var(--mono);font-size:var(--fs-s);color:var(--faint);width:72px;flex:none}
.fwtk{font-family:var(--mono);font-size:var(--fs-m);font-weight:500;width:60px;flex:none}
.fwtxt{flex:1 1 auto;font-size:var(--fs-b);min-width:0}
.fwbadge{font-family:var(--ui);font-weight:600;font-size:var(--fs-xs);letter-spacing:.04em;padding:3px 10px;border-radius:var(--r-pill);background:var(--slate-l);color:var(--mut);flex:none;white-space:nowrap}
.fwbadge.sell{color:var(--sell);background:var(--sell-l)}
.fwbadge.buy{color:var(--buy);background:var(--buy-l)}
.fwempty{padding:18px 0;color:var(--mut)}
.stakecards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:20px}
.scard{display:flex;flex-direction:column;gap:5px;background:var(--panel);border:1px solid var(--pline);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px 24px;text-decoration:none}
.scard:hover{border-color:var(--accent);text-decoration:none}
.sck{font-family:var(--ui);font-weight:600;font-size:var(--fs-xs);color:var(--faint);letter-spacing:.05em;text-transform:uppercase}
.scn{font-family:var(--ui);font-size:40px;font-weight:700;letter-spacing:-.02em;color:var(--accent);line-height:1;font-variant-numeric:tabular-nums}
.sct{font-size:var(--fs-b);color:var(--mut);line-height:1.45}
.homechips{display:flex;gap:12px;flex-wrap:wrap}
.chipl{font-family:var(--ui);font-weight:600;font-size:var(--fs-s);background:var(--white);border:1px solid var(--pline);border-radius:var(--r-pill);padding:9px 16px;text-decoration:none;color:var(--ink)}
.chipl:hover{border-color:var(--accent);color:var(--accent)}
.method{margin-top:44px}
.mrow{display:flex;gap:14px;padding-top:0;padding-bottom:0}   /* longhand: the shorthand was erasing .wrap's side padding and the section ran wider than the page (2026-09-24) */
.mcol{flex:1 1 0;background:var(--panel);border:1px solid var(--pline);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px 24px}
.mk{font-family:var(--ui);font-weight:600;font-size:var(--fs-xs);letter-spacing:.05em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.mt{font-size:var(--fs-b);color:var(--mut);line-height:1.55}
/* THE ASK IS A PANEL (design b slice 2, 2026-09-29): the ink slab left with the paper
   design; the promise sits on the site's own panel with the accent button. */
.homecap{max-width:var(--max);margin:36px auto 0;padding:0 clamp(20px,3.5vw,48px);color:var(--ink)}
.homecap .wrap.capin{max-width:none;background:var(--panel);border:1px solid var(--pline);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 32px}
.homecap .hs-msg:empty{display:none}
.homecap .capin{display:flex;flex-direction:row;align-items:center;justify-content:space-between;text-align:left;gap:14px 28px;flex-wrap:wrap}
.caph{font-family:var(--ui);font-size:var(--fs-xl);font-weight:700;letter-spacing:-.02em;max-width:30ch;line-height:1.25;flex:1 1 320px}
.homecap .homesub{display:flex;gap:10px;flex:none}
.homecap input{width:min(300px,60vw);height:44px;border:1px solid var(--pline);background:var(--white);color:var(--ink);border-radius:var(--r-s);padding:0 16px;font:inherit;font-size:var(--fs-b);outline:none}
.homecap button{height:44px;padding:0 20px;background:var(--accent);color:var(--white);border:0;border-radius:var(--r-s);font-family:var(--ui);font-weight:600;font-size:var(--fs-m);cursor:pointer}
.homecap button:hover{background:var(--blue-d)}
.homecap .hs-msg{font-size:var(--fs-m);color:var(--mut);flex-basis:100%}
.capfine{font-size:var(--fs-xs);color:var(--faint);flex-basis:100%;margin-top:-4px}
.capfine a{color:var(--ink)}
@media(max-width:900px){.stakecards{grid-template-columns:1fr}.mrow{flex-direction:column;gap:26px}}
@media(max-width:640px){.fwbadge{display:none}.hero h1{font-size:34px}}
/* the nav's box shows on the home page too (2026-10-14): one more box bound by search.js, and the links never move */

/* ---- COMPANIES REDESIGN (2026-09-24): the screener is the page ---- */
.tablesec:not(.home) .controls{border-top:0;border-bottom:1px solid var(--line);padding:0 0 16px;margin:0 0 6px}
.screenchips{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 2px}
.screenchips a{font-family:var(--ui);font-weight:600;font-size:var(--fs-s);background:var(--white);border:1px solid var(--pline);border-radius:var(--r-pill);padding:8px 15px;text-decoration:none;color:var(--ink)}
.screenchips a:hover{border-color:var(--accent);color:var(--accent)}
.screenchips a.on{background:var(--ink);border-color:var(--ink);color:var(--white)}.screenchips a.on b{color:var(--accent-l)}
.screenchips b{color:var(--accent);font-weight:600;margin-left:4px;font-variant-numeric:tabular-nums}
.cidx{margin-top:56px;border-top:1px solid var(--line)}
.cidx>.wrap>h2:first-of-type{margin-top:28px}
.cidx .letters{font-family:var(--ui);font-weight:600;font-size:var(--fs-xs);letter-spacing:.16em;margin:10px 0 4px}
.cidx .letters a{color:var(--mut);text-decoration:none;margin-right:2px}
.cidx section h2{font-family:var(--ui);font-weight:600;font-size:var(--fs-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin:20px 0 4px}
.cidx ul{columns:4;column-gap:44px;list-style:none;margin:0;padding:0}
.cidx li{font-size:var(--fs-s);line-height:1.9;break-inside:avoid;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cidx li a{color:var(--ink);text-decoration:none}
.cidx li a:hover{color:var(--accent)}
.cidx li .co{color:var(--mut)}
.cidx li .ceo{color:var(--faint)}
.cidx li .fb{font-size:var(--fs-2xs);padding:1px 5px;margin-left:5px}
@media(max-width:1000px){.cidx ul{columns:2}}

/* ---- THE DAY-GROUPED TAPE (2026-09-24) ---- */
table.tape tr.dgrp td{border-top:0;padding:26px 0 9px;font-family:var(--ui);font-weight:700;font-size:var(--fs-l);letter-spacing:-.02em}
table.tape tr.dgrp:first-child td{padding-top:10px}
table.tape tr.dgrp a{color:var(--ink);text-decoration:none}
table.tape tr.dgrp a:hover{color:var(--accent)}
table.tape tr.dgrp .dsub{color:var(--faint);font-weight:500}
table.tape tr.dgrp .dn{font-family:var(--mono);font-size:var(--fs-xs);color:var(--faint);margin-left:12px}