:root {
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;
    --page-max: 1440px;
    --page-gutter: clamp(14px, 2vw, 32px);
    --form-max: 520px;
    --border: #cfd4dc;
    --muted: #555;
    --link: #2e5f8a;
    --link-hover: #1f4f78;
    --success: #19703f;
    --success-bg: #e7f4ec;
    --success-border: #abd6bd;
    --error: #b42318;
    --error-bg: #fbe9e7;
    --error-border: #efb9b2;
    --header-height: 56px;
    --content-max: 1200px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-family: Arial, Helvetica, sans-serif;
    accent-color: var(--button);
    color: var(--text);
    background: var(--bg);
}

body {
    margin: 0;
    min-height: 100vh;
    font-size: 16px;
    line-height: 1.45;
}

.site-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    max-width: var(--page-max);
    min-height: var(--header-height);
    margin: 0 auto;
    padding: var(--space-3) var(--page-gutter);
}

.site-brand {
    flex: 0 1 auto;
    min-width: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: inherit;
}

.site-brand:hover,
.site-brand:focus-visible {
    color: inherit;
}

.site-nav {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-3);
    text-align: right;
}

.site-nav form {
    display: inline-flex;
    margin: 0;
}

.site-nav-user {
    color: var(--muted);
}

.site-main {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: var(--space-4) var(--page-gutter) var(--space-6);
}

.content {
    max-width: var(--content-max);
}

main {
    max-width: 100%;
}

section {
    margin: var(--space-5) 0;
}

p {
    margin: 0 0 var(--space-3);
}

a {
    color: var(--link);
    text-decoration: none;
}

a:hover,
a:focus-visible {
    color: var(--link-hover);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.2;
    margin: 1.25em 0 var(--space-3);
}

.content > :first-child {
    margin-top: 0;
}

h1 {
    font-size: 2rem;
}

h2 {
    font-size: 1.5rem;
}

h3 {
    font-size: 1.25rem;
}

h4 {
    font-size: 1.1rem;
}

h5,
h6 {
    font-size: 1rem;
}

button,
input[type="button"],
input[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 120px;
    min-height: 42px;
    padding: 9px 18px;
    border: 0;
    border-radius: 6px;
    font: inherit;
    font-weight: 700;
    color: var(--button-text);
    background: var(--button);
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    touch-action: manipulation;
}

button:hover,
button:focus-visible,
input[type="button"]:hover,
input[type="button"]:focus-visible,
input[type="submit"]:hover,
input[type="submit"]:focus-visible {
    background: var(--button-hover);
}

button.button-secondary,
input[type="button"].button-secondary,
input[type="submit"].button-secondary {
    border: 1px solid var(--button);
    color: var(--button);
    background: var(--bg);
}

button.button-secondary:hover,
button.button-secondary:focus-visible,
input[type="button"].button-secondary:hover,
input[type="button"].button-secondary:focus-visible,
input[type="submit"].button-secondary:hover,
input[type="submit"].button-secondary:focus-visible {
    background: color-mix(in srgb, var(--text) 4%, var(--bg));
}

button.link-button {
    display: inline;
    min-width: 0;
    min-height: 0;
    width: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    font: inherit;
    font-weight: 400;
    color: var(--link);
    background: transparent;
}

button.link-button:hover,
button.link-button:focus-visible {
    color: var(--link-hover);
    background: transparent;
}

button:disabled,
input[type="button"]:disabled,
input[type="submit"]:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

button:disabled:hover,
button:disabled:focus-visible,
input[type="button"]:disabled:hover,
input[type="button"]:disabled:focus-visible,
input[type="submit"]:disabled:hover,
input[type="submit"]:disabled:focus-visible {
    background: var(--button);
}

button.button-secondary:disabled:hover,
button.button-secondary:disabled:focus-visible,
input[type="button"].button-secondary:disabled:hover,
input[type="button"].button-secondary:disabled:focus-visible,
input[type="submit"].button-secondary:disabled:hover,
input[type="submit"].button-secondary:disabled:focus-visible {
    background: var(--bg);
}

button.link-button:disabled:hover,
button.link-button:disabled:focus-visible {
    color: var(--link);
    background: transparent;
}

:where(input, select, textarea, button):focus-visible {
    outline: 2px solid var(--link);
    outline-offset: 2px;
}

label {
    font-weight: 700;
}

fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

legend {
    margin: 0 0 var(--space-2);
    padding: 0;
    font-weight: 700;
}

.choice-list {
    display: grid;
    gap: var(--space-2);
}

.choice-row {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    font-weight: 400;
}

.choice-row label {
    font-weight: 400;
}

.choice-row input[type="checkbox"],
.choice-row input[type="radio"] {
    flex: 0 0 auto;
    margin: 0.2em 0 0;
}

:where(input:not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
select,
textarea) {
    width: 100%;
    max-width: 100%;
    padding: 7px 9px;
    border: 1px solid var(--border);
    border-radius: 5px;
    font: inherit;
    color: inherit;
}

textarea {
    min-height: 8rem;
    resize: vertical;
}

pre,
code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

pre {
    max-width: 100%;
    overflow-x: auto;
    padding: var(--space-3);
    border: 1px solid #d7dbe0;
    border-radius: 5px;
    background: #fafafa;
}

table {
    width: 100%;
    max-width: 100%;
    margin: var(--space-5) 0;
    border-collapse: collapse;
}

th,
td {
    padding: 7px 10px;
    border: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

th {
    font-weight: 700;
    background: #f7f7f7;
}

table form {
    margin: 0;
}

/* Inline notices rendered within page content (form errors, one-off notes). */
.message {
    margin: 0;
}

.message-success {
    color: var(--success);
}

.message-error {
    color: var(--error);
}

/* Flash messages: transient, dismissible banners pinned to the top of the page.
   position: sticky keeps them in normal flow (so they push the page down) while
   pinning them to the top edge once the page is scrolled. */
.content > .flash-container:first-child {
    position: sticky;
    top: 0;
    z-index: 1000;
    display: grid;
    gap: var(--space-2);
    margin: 0 0 var(--space-5);
}

.flash {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin: 0;
    padding: var(--space-2) var(--space-4);
    border: 1px solid transparent;
    border-radius: 6px;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.flash-text {
    flex: 1 1 auto;
}

.flash-good {
    color: var(--success);
    background: var(--success-bg);
    border-color: var(--success-border);
}

.flash-bad {
    color: var(--error);
    background: var(--error-bg);
    border-color: var(--error-border);
}

.flash-close {
    flex: 0 0 auto;
    min-width: 0;
    min-height: 0;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border: 0;
    border-radius: 4px;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1;
    color: inherit;
    background: transparent;
}

.flash-close:hover,
.flash-close:focus-visible {
    color: inherit;
    background: rgba(0, 0, 0, 0.08);
}

.flash-hiding {
    opacity: 0;
    transform: translateY(-8px);
}

@media (prefers-reduced-motion: reduce) {
    .flash {
        transition: opacity 0.25s ease;
    }

    .flash-hiding {
        transform: none;
    }
}

.stacked-form {
    display: grid;
    gap: var(--space-4);
    max-width: var(--form-max);
    margin: 0 0 var(--space-4);
}

.form-row {
    display: grid;
    gap: var(--space-1);
    align-items: start;
}

.form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    align-items: center;
    margin-top: var(--space-2);
    padding-left: 0;
}

form + form,
section + form,
.stacked-form + form {
    margin-top: var(--space-4);
}

.api-key-once {
    max-width: 100%;
    overflow-x: auto;
}

@media (max-width: 720px) {
    table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .form-actions {
        align-items: stretch;
    }

    button,
    input[type="button"],
    input[type="submit"] {
        width: 100%;
    }
}

/* ---- Filings viewer styles (ported from filings_viewer_2026) ---- */

/* --------------------------------------------------------------------------
   Filings viewer */

.muted-note {
    color: var(--muted);
    font-size: 0.9rem;
}

.table-scroll {
    max-width: 100%;
    overflow-x: auto;
    margin: var(--space-5) 0;
}

.table-scroll table {
    margin: 0;
}

.fin-table {
    width: auto;
    font-size: 0.82rem;
}

.fin-table th,
.fin-table td {
    padding: 3px 8px;
    white-space: nowrap;
}

.fin-table td.num,
.fin-table th.num {
    text-align: right;
}

.fin-table .row-label {
    position: sticky;
    left: 0;
    background: var(--bg);
    min-width: 16rem;
    max-width: 26rem;
    white-space: normal;
}

.fin-table thead th.row-label {
    background: color-mix(in srgb, var(--text) 8%, var(--bg));
    z-index: 1;
}

/* The template's base rule hardcodes a light th background (#f7f7f7); every
   table the viewer renders needs headers that stay readable in dark mode. */
.content table th {
    background: color-mix(in srgb, var(--text) 8%, var(--bg));
}

.fin-table .emph {
    font-weight: 700;
}

.fin-table .col-sources th {
    font-weight: 400;
    font-style: italic;
    font-size: 0.72rem;
    color: var(--muted);
    max-width: 9rem;
    white-space: normal;
}

.fin-table .section-row td {
    font-weight: 700;
    background: color-mix(in srgb, var(--text) 10%, var(--bg));
    white-space: normal;
}

.fin-table a {
    text-decoration: none;
}

.derived {
    /* Muted color only — no italics (Erik 2026-08-20, LTM column). */
    color: var(--muted);
}

/* Synthesized section headers (no printed header line in any filing). */
.fin-table .synth {
    font-style: italic;
}

/* Footnote marker on a row label; the full footnote text is in title="". */
.fn-marker {
    margin-left: 2px;
    color: var(--muted);
    cursor: help;
}

/* Equity-component column headers are long; let them wrap. */
.equity-table th.num {
    white-space: normal;
    max-width: 11rem;
    vertical-align: bottom;
}

.point-meta th {
    width: 11rem;
}

.page-frame {
    position: relative;
    margin: var(--space-5) 0;
    border: 1px solid var(--border);
    max-width: 100%;
}

.page-frame img {
    display: block;
    max-width: 100%;
    height: auto;
}

.bbox {
    position: absolute;
    pointer-events: none;
}

.bbox-value {
    border: 2px solid #d33;
    background: rgba(220, 40, 40, 0.12);
}

.bbox-label {
    border: 2px dashed #36c;
    background: rgba(50, 100, 220, 0.08);
}

/* The template's theme.css only swaps --text/--bg/--button in dark mode, so
   --link/--muted/--border keep their light values and fall below readable
   contrast on the dark background. The viewer's primary content is links
   (every numeric cell) and muted text (derived values, column sources), so
   lift those tokens for dark mode. */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --border: #3a3f46;
        --muted: #9aa0a6;
        --link: #7fb0d8;
        --link-hover: #a6cbe8;
    }
}

:root[data-theme="dark"] {
    --border: #3a3f46;
    --muted: #9aa0a6;
    --link: #7fb0d8;
    --link-hover: #a6cbe8;
}

/* Printed-indentation ladder (engine `indent` field). Inline styles are
   blocked by the app's CSP (default-src 'self'), so indentation is
   expressed as classes; depth capped at 6. */
.fin-table td.ind-1 { padding-left: 22px; }
.fin-table td.ind-2 { padding-left: 36px; }
.fin-table td.ind-3 { padding-left: 50px; }
.fin-table td.ind-4 { padding-left: 64px; }
.fin-table td.ind-5 { padding-left: 78px; }
.fin-table td.ind-6 { padding-left: 92px; }

/* Judged stock-split divider: first post-split column on share/EPS rows. */
.fin-table td.split-left {
    border-left: 2px solid var(--muted);
}

/* Risk Factors page (web-only home for Item 1A; Erik ruling 2026-08-08) */
.risk-vintage { margin: 0.8rem 0; padding: 0.4rem 0.6rem; border: 1px solid var(--border, #ddd); border-radius: 4px; }
.risk-vintage > summary { cursor: pointer; }
.risk-category { margin: 0.9rem 0 0.2rem; font-size: 0.95rem; color: var(--muted, #666); text-transform: none; }
.risk-item { margin: 0.25rem 0 0.25rem 0.8rem; }
.risk-item > summary { cursor: pointer; }
.risk-body { white-space: pre-line; margin: 0.4rem 0 0.6rem 1rem; max-width: 75ch; }
.risk-preamble, .risk-nmc { font-style: italic; max-width: 75ch; }

/* Sticky year header (Erik, 2026-08-08; reworked 2026-08-10 "no tiny
   viewport"): statement tables flow FULL HEIGHT on the page — no inner
   scroll cage. `overflow: visible` means the page owns both scroll
   axes, so sticky-top years and sticky-left labels pin against page
   scroll directly (an overflow-x wrapper would capture stickiness).
   Non-nordvik tables (equity, guidance, legacy) keep the bounded box. */
.table-scroll {
    max-height: calc(100vh - 5rem);
    overflow: auto;
}
.table-scroll:has(.fin-table.nordvik) {
    max-height: none;
    overflow: visible;
    max-width: none;
}
.fin-table thead tr:first-child th {
    position: sticky;
    top: 0;
    background: color-mix(in srgb, var(--text) 8%, var(--bg));
    z-index: 2;
}
.fin-table thead tr:first-child th.row-label {
    left: 0;
    z-index: 4;
}

/* Ratios page (derived-metrics v1, 2026-08-09). Chart palette classes —
   inline styles are CSP-blocked, SVG presentation attributes are not. */
.ratio-chart { width: 100%; max-width: 780px; height: auto; display: block; margin: 0.3rem 0 1rem; }
.ratio-chart .grid { stroke: color-mix(in srgb, var(--text) 18%, transparent); stroke-width: 1; }
.ratio-chart .axis { fill: color-mix(in srgb, var(--text) 65%, transparent); font-size: 11px; }
.chart-title { margin: 1rem 0 0.2rem; }
.chart-legend { font-size: 0.8rem; margin: 0.2rem 0; }
.chart-legend .lg { margin-right: 1rem; white-space: nowrap; }
.chart-legend .swatch { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: baseline; }
.sw-0 { background: #4477aa; } .sw-1 { background: #ee6677; } .sw-2 { background: #228833; }
.sw-3 { background: #ccbb44; } .sw-4 { background: #66ccee; } .sw-5 { background: #aa3377; }
.sw-6 { background: #bbbbbb; }

/* Row chart overlay (company_chart.js): click a statement row's label
   or the space between its numbers to plot it. Esc / backdrop closes
   the chart; in the viewer the next Esc then closes the viewer. */
.row-chart-layer {
    position: fixed;
    inset: 0;
    z-index: 40;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--text) 25%, transparent);
}
.row-chart-panel {
    background: var(--bg);
    border: 1px solid color-mix(in srgb, var(--text) 25%, var(--bg));
    border-radius: 6px;
    box-shadow: 0 12px 40px color-mix(in srgb, var(--text) 25%, transparent);
    padding: var(--space-4) var(--space-5);
    width: min(92%, 880px);
}
.row-chart-panel h3 {
    margin: 0 0 2px;
}
.row-chart-panel .muted-note {
    margin: 0 0 var(--space-2);
}
.row-chart-panel .grid-zero {
    stroke: color-mix(in srgb, var(--text) 45%, transparent);
}
.row-chart-panel .hover-guide {
    stroke: color-mix(in srgb, var(--text) 40%, transparent);
    stroke-width: 1;
}
.row-chart-panel .hover-readout {
    fill: var(--text);
    font-size: 13px;
    font-weight: 600;
}
/* Number-click source popover: the point page framed chrome-free. */
.row-chart-panel.is-trace {
    width: min(94%, 1150px);
    padding: var(--space-2);
}
.trace-frame {
    display: block;
    width: 100%;
    height: min(86vh, 950px);
    border: 0;
}

/* Archetype layer (Erik, 2026-08-09): folded-in derived ratio rows are
   italic end to end (label + values, matching .derived cells); the
   highlight wash marks the reader's key metrics — low-alpha so it works
   in both themes; keep it scarce or it stops being a highlight. */
.fin-table tr.ratio-row .row-label {
    font-style: italic;
    color: var(--muted);
}
/* Ratio VALUE cells stay italic end to end with their label (the
   2026-08-09 blessed look) even though .derived itself lost its global
   italics (Erik 2026-08-20: the LTM/derived money cells go roman). */
.fin-table tr.ratio-row td {
    font-style: italic;
}
.fin-table tr.hl td {
    background: rgba(212, 184, 90, 0.16);
}

/* --- Nordvik statement styling (Erik-blessed archetype, 2026-08-10) ---
   Per-statement tables typed like the reference rendering: no cell
   borders, one hairline under the header, title level with the years,
   unit note tucked beneath, generous rhythm, quiet links. */
.fin-table.nordvik {
    font-size: .9rem;
    font-variant-numeric: tabular-nums;
    margin: 2.4rem 0 0;
}
.fin-table.nordvik th,
.fin-table.nordvik td {
    border: 0;
    background: transparent;
    padding: .17rem .55rem;
    vertical-align: baseline;
}
.fin-table.nordvik thead tr:first-child th {
    border-bottom: 1px solid color-mix(in srgb, var(--text) 45%, var(--bg));
    vertical-align: bottom;
    padding-bottom: .4rem;
    background: var(--bg);
}
.fin-table.nordvik thead th.num { font-weight: 650; white-space: nowrap; }
.fin-table.nordvik .stmt-title .t {
    display: block;
    font-size: .92rem;
    font-weight: 650;
    letter-spacing: .07em;
    text-transform: uppercase;
    white-space: nowrap;
}
.fin-table.nordvik .stmt-title .tnote {
    display: block;
    color: var(--muted);
    font-size: .78rem;
    font-style: italic;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    margin-top: .12rem;
    white-space: normal;
    max-width: 24rem;
}
.fin-table.nordvik .col-sources th {
    border-bottom: 0;
    padding-top: .3rem;
}
.fin-table.nordvik .row-label { background: var(--bg); }
.fin-table.nordvik thead th.row-label { background: var(--bg); z-index: 2; }
.fin-table.nordvik tbody tr.blockstart td { padding-top: .55rem; }
.fin-table.nordvik .emph { font-weight: 650; }
.fin-table.nordvik a { color: inherit; }
.fin-table.nordvik a:hover { text-decoration: underline; }

/* The sticky row-label needs an OPAQUE background (columns slide under
   it), so the translucent hl wash never showed on the label cell. An
   opaque color-mix of the same wash over the page background matches
   the number cells visually while keeping the sticky opacity. */
.fin-table tr.hl td.row-label {
    background: color-mix(in srgb, rgb(212 184 90) 16%, var(--bg));
}

/* Company viewer layer (Erik, 2026-08-10): on /companies, clicking a
   company opens /company/<TICKER>?embed=1 in an iframe panel floating
   ~30px from every viewport edge over a scrim; the page underneath
   stays exactly as you left it. Escape, backdrop click, or Back
   closes it. Logic: js/viewer_layer.js; the chrome-free document
   inside the frame: base_embed.html (body.embed). */
.viewer-layer {
    position: fixed;
    inset: 0;
    z-index: 100;
    padding: 30px;
    background: var(--scrim);
}

.viewer-frame {
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg);
}

/* Freeze the page behind the layer (scroll position survives). */
body.viewer-open {
    overflow: hidden;
    overscroll-behavior: none;
}

/* Inside the frame there is no app shell — body.embed holds just
   .content. The viewer must feel STATIC (Erik, 2026-08-10): the page
   itself never scrolls or rubber-bands; h1 + statement switcher are a
   fixed header; only .variant-tables scrolls (both axes). With the
   scroll container's left/top edge exactly where the table starts,
   the sticky year row and row labels pin with zero travel — nothing
   slides before settling. (The standalone company page keeps the
   opposite, page-owns-scroll model — see .table-scroll above.) */
body.embed:has(.variant-tables) {
    height: 100dvh;
    overflow: hidden;
    overscroll-behavior: none;
}
body.embed .content {
    max-width: none;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: var(--space-3) var(--page-gutter) 0;
}
body.embed .variant:not([hidden]) {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}
body.embed .variant-tables {
    flex: 1;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: none;
}
body.embed .variant-tables .fin-table.nordvik {
    margin-top: 0;
}
/* No space above the table inside the scroller: any top margin there
   is scrollable distance the sticky header travels before pinning. */
body.embed .variant-tables .table-scroll {
    margin-top: 0;
}
/* Row labels flush with the h1's left edge (drop the cell's own left
   padding — the scroll container edge already sits at the gutter). */
body.embed .variant-tables .row-label {
    padding-left: 0;
}
/* The narrow-screen fallback (@media 720px: table { display: block;
   overflow-x: auto }) would make each table its own scroller and steal
   the sticky headers from .variant-tables — the viewer's container
   already scrolls sideways, so keep real table layout inside it. */
body.embed .variant-tables table {
    display: table;
    overflow: visible;
}

/* Indent ladder re-asserted AFTER the nordvik block: the nordvik td
   padding shorthand ties on specificity (0,2,1) and later-wins, which
   silently flattened the presentation indentation (Erik-spotted,
   2026-08-10). Same values, final word in the cascade. */
.fin-table td.ind-1 { padding-left: 22px; }
.fin-table td.ind-2 { padding-left: 36px; }
.fin-table td.ind-3 { padding-left: 50px; }
.fin-table td.ind-4 { padding-left: 64px; }
.fin-table td.ind-5 { padding-left: 78px; }
.fin-table td.ind-6 { padding-left: 92px; }

/* The embed's flush-left label rule (padding-left: 0) outranks the
   indent ladder, flattening hierarchy inside the viewer layer — the
   ladder re-asserted at embed specificity (Erik-spotted, round 2). */
body.embed .variant-tables td.ind-1 { padding-left: 22px; }
body.embed .variant-tables td.ind-2 { padding-left: 36px; }
body.embed .variant-tables td.ind-3 { padding-left: 50px; }
body.embed .variant-tables td.ind-4 { padding-left: 64px; }
body.embed .variant-tables td.ind-5 { padding-left: 78px; }
body.embed .variant-tables td.ind-6 { padding-left: 92px; }

/* Executive-compensation viewer (Erik, 2026-08-20): verbatim proxy
   tables. Section rows are the NEO / plan headers from the ink. */
.comp-table { border-collapse: collapse; margin: .4rem 0 1.2rem;
              width: auto; }
.comp-table th, .comp-table td { padding: .15rem .6rem; }
.comp-table th { text-align: right; font-weight: 650; }
.comp-table th:first-child { text-align: left; }
.comp-num { text-align: right; font-variant-numeric: tabular-nums; }
.comp-sec td { font-weight: 650; padding-top: .55rem; }

/* Goals & outcomes graphics (Erik 2026-08-20: replace the confusing
   digest tables with bullet charts, an achievement timeline grid, and
   tranche bars). Pure CSS/SVG, no libraries. */
.chip { display: inline-block; padding: 0 .45em; border-radius: 9px;
        font-variant-numeric: tabular-nums; font-size: .84rem;
        line-height: 1.5; white-space: nowrap; }
.chip small { opacity: .65; font-size: .72rem; }
.chip.hi  { background: var(--success-bg); color: var(--success);
            border: 1px solid var(--success-border); }
.chip.mid { background: #fdf3dc; color: #8a6100; border: 1px solid #ecd9a6; }
.chip.lo  { background: var(--error-bg); color: var(--error);
            border: 1px solid var(--error-border); }
.chip.na  { background: transparent; color: var(--muted);
            border: 1px dashed var(--border); }
.chip.off { background: transparent; color: var(--muted); border: 0; }

.dg-scroll { overflow-x: auto; }
.dg-grid { width: auto; margin: .4rem 0 1rem; border-collapse: collapse; }
.dg-grid th, .dg-grid td { border: 0; padding: .12rem .3rem;
                           text-align: center; background: transparent; }
.dg-grid th { font-weight: 650; }
.dg-grid td.dg-name { text-align: left; font-weight: 650;
                      padding-right: .8rem; white-space: nowrap; }

.dg-card { margin: .35rem 0; border: 1px solid var(--border);
           border-radius: 6px; padding: .35rem .7rem; }
.dg-card > summary { cursor: pointer; }
.dg-brow { display: flex; align-items: center; gap: .8rem;
           margin: .55rem 0 .9rem; }
.dg-blabel { flex: 0 0 12.5rem; white-space: nowrap; overflow: hidden;
             text-overflow: ellipsis; }
.dg-blabel small { color: var(--muted); }
.dg-track { position: relative; flex: 1 1 auto; max-width: 34rem;
            height: 14px; }
.dg-band { position: absolute; top: 2px; height: 10px; }
.dg-band.b-lo  { background: color-mix(in srgb, var(--error) 14%, var(--bg)); }
.dg-band.b-mid { background: #fdf3dc; }
.dg-band.b-hi  { background: var(--success-bg); }
.dg-tick { position: absolute; top: 0; height: 14px; width: 2px;
           background: var(--muted); }
.dg-a { position: absolute; top: -2px; height: 18px; width: 3px;
        background: var(--text); border-radius: 2px; }
.dg-lab, .dg-alab { position: absolute; top: 15px; transform: translateX(-50%);
        font-size: .7rem; color: var(--muted); }
.dg-alab { top: -14px; color: var(--text); font-weight: 650; }
.dg-curve { display: flex; align-items: center; gap: .8rem;
            margin: .3rem 0 .5rem; }
.dg-curve svg text { font-size: 9px; fill: var(--muted); }
.dg-curve .dg-dot { fill: var(--error); }
.dg-neos { margin: .3rem 0; }
.dg-neo { display: inline-block; margin-right: 1.4rem; }

.dg-eq { margin: .6rem 0 1rem; }
.dg-eq h4 { margin: .4rem 0 .25rem; }
.dg-eq-axis { display: flex; justify-content: space-between;
              max-width: 30rem; color: var(--muted); font-size: .75rem; }
.dg-eq-row { display: flex; align-items: center; gap: .7rem;
             margin: .18rem 0; }
.dg-eq-n { flex: 0 0 4.5rem; white-space: nowrap; }
.dg-eq-n small { color: var(--muted); }
.dg-eq-trackwrap { position: relative; flex: 0 1 30rem; height: 10px;
                   background: color-mix(in srgb, var(--text) 5%, var(--bg));
                   border-radius: 5px; }
.dg-eq-bar { position: absolute; top: 0; height: 10px; border-radius: 5px; }
.dg-eq-bar.done { background: var(--success-border); }
.dg-eq-bar.open { background: repeating-linear-gradient(45deg,
                    var(--border), var(--border) 4px,
                    transparent 4px, transparent 8px); }

/* Shared lower-section presentation. These containers only reorganize
   fields already rendered by comp.html; they add no data requirements. */
.cc-detail-section { max-width: 72rem; margin: var(--space-6) 0;
                     padding-top: var(--space-5);
                     border-top: 1px solid var(--border); }
.cc-detail-header { margin-bottom: var(--space-4); }
.cc-detail-header h2 { margin: .2rem 0 0; }
.cc-section-summary,
.cc-section-intro { margin-bottom: var(--space-4); padding: var(--space-4);
                    border: 1px solid var(--border); border-radius: 8px;
                    background: color-mix(in srgb, var(--text) 2%, var(--bg)); }
.cc-section-summary > strong { font-size: 1.05rem; }
.cc-section-intro { color: var(--muted); font-size: .9rem; }
.cc-section-intro .cc-why { margin-top: var(--space-2); }

.cc-fact-grid { display: grid;
                grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
                gap: var(--space-2); }
.cc-fact-item { display: grid; gap: var(--space-1); padding: var(--space-3);
                background: color-mix(in srgb, var(--text) 3%, var(--bg)); }
.cc-fact-item span { color: var(--muted); font-size: .72rem;
                     font-weight: 700; letter-spacing: .04em;
                     text-transform: uppercase; }
.cc-fact-item strong { font-size: 1.05rem;
                       font-variant-numeric: tabular-nums; }
.cc-fact-primary { border-left: 4px solid var(--link-hover); }
.cc-fact-primary strong { color: var(--link-hover); font-size: 1.4rem; }
.cc-section-action { margin: var(--space-3) 0 var(--space-2); }

.cc-program-card { margin: var(--space-2) 0; border: 1px solid var(--border);
                   border-radius: 8px; overflow: hidden; }
.cc-program-summary { cursor: pointer; padding: var(--space-3) var(--space-4);
                      background: color-mix(in srgb, var(--text) 2%, var(--bg)); }
.cc-program-card[open] > .cc-program-summary { border-bottom: 1px solid var(--border); }
.cc-program-body { padding: var(--space-3) var(--space-4) var(--space-4); }
.cc-program-body > :last-child { margin-bottom: 0; }
.cc-rsu-summary { margin-top: var(--space-4); }

.cc-fixed-card { display: flex; align-items: center;
                 justify-content: space-between; gap: var(--space-5);
                 padding: var(--space-5); border: 1px solid var(--border);
                 border-radius: 10px;
                 background: color-mix(in srgb, var(--text) 2%, var(--bg)); }
.cc-fixed-card > div { display: grid; gap: var(--space-1); }
.cc-fixed-card span { color: var(--muted); font-size: .72rem;
                      font-weight: 700; letter-spacing: .06em;
                      text-transform: uppercase; }
.cc-fixed-card strong { font-size: 1.55rem; }
.cc-fixed-card p { max-width: 38rem; margin: 0; color: var(--muted); }

.cc-forward-card { padding: var(--space-5); border-left: 4px solid var(--link-hover);
                   background: color-mix(in srgb, var(--link) 7%, var(--bg)); }
.cc-forward-card > p { max-width: 78rem; margin-bottom: var(--space-3); }

.cc-source-section { max-width: 72rem; margin: var(--space-6) 0; }
.cc-proxy-card { margin: var(--space-2) 0; border: 1px solid var(--border);
                 border-radius: 8px; overflow: hidden;
                 scroll-margin-top: var(--space-4); }
.cc-proxy-card > summary { display: flex; align-items: baseline;
                           justify-content: space-between; gap: var(--space-4);
                           cursor: pointer; padding: var(--space-3) var(--space-4);
                           background: color-mix(in srgb, var(--text) 2%, var(--bg)); }
.cc-proxy-card > summary span { color: var(--muted); font-size: .78rem; }
.cc-proxy-card[open] > summary { border-bottom: 1px solid var(--border); }
.cc-proxy-body { padding: var(--space-3) var(--space-4) var(--space-5);
                 overflow-x: auto; }
.cc-proxy-body h3 { margin-top: var(--space-5); }
.cc-proxy-body > h3:first-child { margin-top: var(--space-2); }

/* CEO's-chair comp interface (Erik doctrine 2026-08-21): the ladder
   ranked by dollars at stake, per-year goal cards in the take-15
   grammar, verdict colors only (no gray bars). Amber literals reused
   from .chip.mid. */
.cc-callout { font-size: 1.05rem; }
.cc-ladder { margin: .6rem 0 1.4rem; }
.cc-rung { display: grid; grid-template-columns: 15rem minmax(0,1fr) 7rem;
           gap: 0 1rem; align-items: center; margin-top: .8rem; }
.cc-rlabel { font-weight: 650; }
.cc-rbarwrap { position: relative; height: 12px;
               background: color-mix(in srgb, var(--text) 4%, var(--bg));
               border-radius: 6px; }
.cc-rbar { position: absolute; top: 0; height: 12px; border-radius: 6px;
           background: var(--link); }
.cc-rusd { font-weight: 650; font-variant-numeric: tabular-nums;
           text-align: right; }
.cc-rsub { margin: .15rem 0 0 0; font-size: .85rem; color: var(--muted); }
.cc-why { display: block; margin-top: .15rem; }
.cc-why > summary { cursor: pointer; color: var(--link); font-size: .85rem;
                    display: inline-block; }
.cc-why p, .cc-why div, .cc-why li { font-size: .9rem; }
.cc-why table { margin: .4rem 0; }

.cc-card { margin: .6rem 0; border: 1px solid var(--border);
           border-radius: 10px; overflow: hidden; }
.cc-card > summary { display: flex; align-items: baseline;
                     justify-content: space-between; gap: var(--space-3);
                     cursor: pointer; padding: var(--space-3) var(--space-4);
                     background: color-mix(in srgb, var(--text) 2%, var(--bg)); }
.cc-card[open] > summary { border-bottom: 1px solid var(--border); }
.cc-card-title { min-width: 0; }
.cc-card-body { padding: 0 var(--space-4) var(--space-4);
                overflow-x: auto; }
.cc-card-body > .cc-goals,
.cc-card-body > .cc-payband { min-width: 48rem; }
.cc-chip { display: inline-block; padding: 0 .5em; border-radius: 9px;
           font-size: .84rem; margin-left: .5rem;
           font-variant-numeric: tabular-nums; }
.cc-chip.cs { background: var(--success-bg); color: var(--success);
              border: 1px solid var(--success-border); }
.cc-chip.cw { background: #fdf3dc; color: #8a6100; border: 1px solid #ecd9a6; }
.cc-chip.cn { color: var(--muted); border: 1px dashed var(--border); }

.cc-goals { margin-top: 1.3rem; }
.cc-hdr, .cc-grow { display: grid;
  grid-template-columns: 13rem minmax(0,1fr) 4.6rem 4.6rem 2rem;
  gap: 0 .8rem; align-items: center; }
.cc-hdr { font-size: .72rem; letter-spacing: .02em; color: var(--muted); }
.cc-hdr div:nth-child(3), .cc-hdr div:nth-child(4) { text-align: center; }
.cc-grow { margin: .9rem 0 .1rem; }
.cc-gname { display: flex; align-items: center; gap: .6rem;
            font-size: .92rem; }
.cc-ring { flex: 0 0 38px; width: 38px; height: 38px; }
.cc-ring text { font-size: 10px; font-weight: 650; fill: var(--text); }
.cc-ring .rk-s { stroke: var(--success); }
.cc-ring .rk-w { stroke: #8a6100; }
.cc-ring .rk-d { stroke: var(--error); }
.cc-ring .rk-na { stroke: var(--muted); }
.cc-lane { position: relative; height: 20px; }
.cc-track { position: absolute; top: 8px; left: 0; right: 0; height: 4px;
            border-radius: 2px;
            background: color-mix(in srgb, var(--text) 6%, var(--bg)); }
.cc-bar { position: absolute; top: 7px; height: 6px; border-radius: 3px; }
.bk-s { background: var(--success); } .bk-w { background: #8a6100; }
.bk-d { background: var(--error); } .bk-na { background: var(--muted); }
.cc-dot { position: absolute; top: 3px; width: 14px; height: 14px;
          border-radius: 50%; background: var(--bg);
          border: 3.5px solid; transform: translateX(-50%); }
.dk-s { border-color: var(--success); } .dk-w { border-color: #8a6100; }
.dk-d { border-color: var(--error); } .dk-na { border-color: var(--muted); }
.cc-tk { position: absolute; top: 4px; height: 12px; width: 2px;
         background: var(--border); }
.cc-tklab { position: absolute; top: -12px; transform: translateX(-50%);
            font-size: .7rem; color: var(--muted); }
.cc-g100 { position: absolute; top: -14px; height: 18px; width: 2px;
  background: repeating-linear-gradient(to bottom, var(--muted) 0 5px,
              transparent 5px 11px); }
.cc-glab { position: absolute; top: -28px; transform: translateX(-50%);
           font-size: .72rem; font-weight: 650; color: var(--muted);
           white-space: nowrap; }
.cc-vbox { text-align: center; font-weight: 650; border-radius: 8px;
           padding: .25rem .3rem; font-variant-numeric: tabular-nums; }
.vb-s { background: var(--success-bg); color: var(--success); }
.vb-w { background: #fdf3dc; color: #8a6100; }
.vb-d { background: var(--error-bg); color: var(--error); }
.vb-na, .cc-vbox.vn { background: color-mix(in srgb, var(--text) 4%, var(--bg));
                      color: var(--text); font-weight: 400; }
.vb-hl { background: var(--bg); border: 1px solid var(--success-border);
         color: var(--success); font-size: 1.02rem; }
.cc-vic { text-align: center; font-size: 1.05rem; }
.ik-s { color: var(--success); } .ik-w { color: #8a6100; }
.ik-d { color: var(--error); }
.cc-gsub { grid-column: 2 / 6; font-size: .78rem; color: var(--muted);
           margin-top: .2rem; }
.cc-payband { border-radius: 8px; padding: .6rem .5rem .7rem;
              margin-top: 1rem; }
.cc-payband.pb-s { background: var(--success-bg); }
.cc-payband.pb-w { background: #fdf3dc; }
.cc-neos { margin: .6rem 0 .2rem; font-size: .92rem; }

.cc-mix { display: flex; height: 28px; border-radius: 6px;
          overflow: hidden; margin: .4rem 0; }
.cc-mixseg.m1 { background: color-mix(in srgb, var(--link) 18%, var(--bg)); }
.cc-mixseg.m2 { background: var(--link); }
.cc-mixseg.m3 { background: color-mix(in srgb, var(--link) 45%, var(--bg)); }
.cc-mixseg.m4 { background: var(--link-hover); }
.cc-sw { display: inline-block; width: 10px; height: 10px;
         border-radius: 3px; margin-right: 4px; }
.cc-sw.m1 { background: color-mix(in srgb, var(--link) 18%, var(--bg)); }
.cc-sw.m2 { background: var(--link); }
.cc-sw.m3 { background: color-mix(in srgb, var(--link) 45%, var(--bg)); }
.cc-sw.m4 { background: var(--link-hover); }

/* CEO motivation overview: key statements, four independent mix charts,
   and reported-pay summary (Erik 2026-08-21). */
.cc-overview { max-width: 72rem; margin: var(--space-6) 0; }
.cc-overview-header { margin-bottom: var(--space-4); }
.cc-overview-header h2 { margin: .2rem 0 0; }
.cc-eyebrow,
.cc-panel-label { margin: 0 0 var(--space-1); color: var(--muted);
                  font-size: .72rem; font-weight: 700;
                  letter-spacing: .08em; text-transform: uppercase; }

.cc-profile-grid { display: grid;
                   grid-template-columns: minmax(0, 1.55fr) minmax(250px, .8fr);
                   gap: var(--space-4); }
.cc-profile-panel { border: 1px solid var(--border); border-radius: 10px;
                    padding: var(--space-5);
                    background: color-mix(in srgb, var(--text) 2%, var(--bg)); }
.cc-primary-panel { border-left: 4px solid var(--link-hover); }
.cc-profile-focus { display: flex; flex-wrap: wrap; align-items: baseline;
                    justify-content: space-between; gap: var(--space-2) var(--space-4);
                    margin: var(--space-2) 0 var(--space-4); }
.cc-profile-focus strong { font-size: 1.25rem; }
.cc-profile-focus span { color: var(--link); font-weight: 700; }
.cc-profile-thesis { max-width: 58rem; margin: 0; font-size: 1.05rem;
                     font-weight: 650; }
.cc-sensitivity-panel { display: flex; flex-direction: column; }
.cc-sensitivity-stat { display: grid; gap: var(--space-1);
                       margin: var(--space-2) 0 var(--space-4); }
.cc-sensitivity-stat strong { color: var(--link-hover); font-size: 2rem;
                              line-height: 1; }
.cc-sensitivity-stat span,
.cc-sensitivity-compare span { color: var(--muted); font-size: .86rem; }
.cc-sensitivity-compare { display: flex; align-items: baseline;
                          gap: var(--space-2); margin: 0 0 var(--space-4); }
.cc-sensitivity-compare strong { font-size: 1.25rem; }
.cc-profile-source { margin: auto 0 0; color: var(--muted);
                     font-size: .78rem; }

.cc-section-heading { display: flex; align-items: end;
                      justify-content: space-between; gap: var(--space-5);
                      margin: var(--space-6) 0 var(--space-4); }
.cc-section-heading h3 { margin: .2rem 0 0; }
.cc-section-heading > p { max-width: 34rem; margin: 0; color: var(--muted);
                          font-size: .86rem; text-align: right; }
.cc-mix-grid { display: grid;
               grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
               gap: var(--space-3); }
.cc-mix-card { display: grid; grid-template-rows: auto auto 132px auto;
               min-width: 0; padding: var(--space-4);
               border: 1px solid var(--border); border-radius: 10px;
               background: var(--bg); }
.cc-mix-card-head { display: flex; gap: var(--space-3); min-height: 5.8rem; }
.cc-mix-card-head > div { min-width: 0; }
.cc-mix-card-head h4 { margin: 0 0 var(--space-1); font-size: 1rem; }
.cc-mix-card-head p { margin: 0; color: var(--muted); font-size: .82rem; }
.cc-mix-card-head p strong { color: var(--text); font-size: 1rem; }
.cc-mix-rank { display: inline-grid; place-items: center; width: 28px;
               height: 28px; flex: 0 0 28px; border-radius: 50%;
               background: color-mix(in srgb, var(--link) 12%, var(--bg));
               color: var(--link); font-size: .78rem; font-weight: 700; }
.cc-mini-values { display: grid; grid-template-columns: repeat(2, 1fr);
                  gap: var(--space-3); padding-left: 2rem;
                  font-size: .78rem; font-weight: 700; text-align: center;
                  font-variant-numeric: tabular-nums; }
.cc-mini-chart { display: grid; grid-template-columns: 2rem minmax(0, 1fr);
                 height: 132px; }
.cc-mini-axis { display: flex; flex-direction: column;
                justify-content: space-between; padding-right: var(--space-2);
                color: var(--muted); font-size: .62rem; text-align: right;
                font-variant-numeric: tabular-nums; }
.cc-mini-plot { position: relative; min-width: 0; }
.cc-mini-gridline { position: absolute; left: 0; right: 0;
                    border-top: 1px solid var(--border); opacity: .65; }
.cc-mini-gridline-top { top: 0; }
.cc-mini-gridline-mid { top: 50%; }
.cc-mini-gridline-base { bottom: 0; }
.cc-mini-bars { position: absolute; inset: 0 var(--space-2);
                display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
                align-items: end; gap: var(--space-3); }
.cc-mini-barwrap { display: flex; align-items: end; justify-content: center;
                   height: 100%; }
.cc-mini-bar { display: block; width: min(48px, 78%);
               height: max(var(--cc-bar-height), 2px);
               border-radius: 4px 4px 0 0; }
.cc-mini-bar-ceo { background: var(--link-hover); }
.cc-mini-bar-typical { background: color-mix(in srgb, var(--link) 24%, var(--bg));
                       border: 1px solid var(--border); border-bottom: 0; }
.cc-mini-labels { display: grid; grid-template-columns: repeat(2, 1fr);
                  gap: var(--space-3); padding: var(--space-2) 0 0 2rem;
                  color: var(--muted); font-size: .7rem; text-align: center; }

.cc-mix-insight { margin-top: var(--space-4); padding: var(--space-4) var(--space-5);
                  border-left: 4px solid var(--link-hover);
                  background: color-mix(in srgb, var(--link) 7%, var(--bg)); }
.cc-mix-insight > p:not(.cc-panel-label) { max-width: 60rem;
                                          margin-bottom: var(--space-2); }
.cc-mix-insight .cc-why { margin: 0; }
.cc-paid-panel { margin-top: var(--space-4); padding: var(--space-5);
                 border: 1px solid var(--border); border-radius: 10px; }
.cc-paid-header { display: flex; align-items: end; justify-content: space-between;
                  gap: var(--space-4); margin-bottom: var(--space-4); }
.cc-paid-header h3 { margin: .2rem 0 0; font-size: 1.05rem; }
.cc-paid-total { font-size: 1.55rem; line-height: 1; }
.cc-paid-grid { display: grid;
                grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
                gap: var(--space-2); margin-bottom: var(--space-3); }
.cc-paid-item { display: grid; gap: var(--space-1);
                padding: var(--space-3);
                background: color-mix(in srgb, var(--text) 3%, var(--bg)); }
.cc-paid-item span { color: var(--muted); font-size: .78rem; }
.cc-paid-item strong { font-size: 1rem; }

.cc-imp { display: inline-block; padding: 0 .5em; border-radius: 9px;
          font-size: .8rem; font-weight: 650;
          background: color-mix(in srgb, var(--link) 12%, var(--bg));
          color: var(--link); border: 1px solid
          color-mix(in srgb, var(--link) 35%, var(--bg)); }
h2 .cc-imp { vertical-align: middle; margin-left: .5rem; }

/* Conviction (selling-vs-holding) Tab view. */
.cv-rows { margin: 1rem 0; }
.cv-row { display: grid;
  grid-template-columns: 6.2rem minmax(4rem,1fr) 8rem 7rem 4rem 5.2rem 6.5rem 4rem 5.2rem;
  gap: 0 1rem; align-items: center; margin: .3rem 0; }
.cv-row.cv-head { color: var(--muted); font-size: .78rem; }
.cv-date { font-variant-numeric: tabular-nums; }
.cv-lane { position: relative; height: 12px;
           background: color-mix(in srgb, var(--text) 4%, var(--bg));
           border-radius: 6px; }
.cv-bar { position: absolute; top: 0; height: 12px; border-radius: 6px;
          background: var(--link); }
.cv-n, .cv-delta, .cv-pct, .cv-val { text-align: right;
                            font-variant-numeric: tabular-nums; }
.cv-delta.up { color: var(--success); }
.cv-delta.dn { color: var(--error); }

@media (max-width: 720px) {
    .cc-profile-grid { grid-template-columns: 1fr; }
    .cc-profile-panel { padding: var(--space-4); }
    .cc-section-heading { display: block; }
    .cc-section-heading > p { margin-top: var(--space-2); text-align: left; }
    .cc-mix-grid { grid-template-columns: 1fr; }
    .cc-mix-card-head { min-height: 0; }
    .cc-paid-header { align-items: start; flex-direction: column; }
    .cc-fixed-card { align-items: start; flex-direction: column; }
    .cc-card > summary,
    .cc-proxy-card > summary { align-items: start; flex-direction: column; }
    .cc-card .cc-chip { margin-left: 0; }
    .cc-program-body,
    .cc-forward-card,
    .cc-proxy-body { padding: var(--space-4); }
}

/* Insider Conviction v2 — Form 4 rhythm strip (Erik design 2026-08-22) */
.cv2-head { margin: var(--space-5) 0 var(--space-4); }
.cv2-headline { margin: 0 0 2px; font-size: 1.5rem; }
.cv2-state { margin: var(--space-2) 0 0; font-size: 1.05rem; }
.cv2-h3 { margin: var(--space-6) 0 var(--space-2); }
.cv2-flow { max-width: 640px; }
.cv2-flow .comp-table td { padding: 3px 14px 3px 0; }
.cv2-sub td { border-top: 1px solid var(--border); }
.cv2-strip { font-variant-numeric: tabular-nums; }
.cv2-yr { display: flex; align-items: center; gap: var(--space-4); padding: 2px 0; }
.cv2-y { width: 3.2em; color: var(--muted); }
.cv2-cells { display: inline-flex; gap: 6px; }
.cv2-mn { width: 12px; font-style: normal; font-size: .7rem; color: var(--muted); text-align: center; }
.cv2-c { width: 12px; height: 12px; display: inline-block; border-radius: 3px; }
.cv2-none { background: none; position: relative; }
.cv2-none::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--border); }
.cv2-routine { background: var(--error); opacity: .55; transform: scale(.72); }
.cv2-burst { background: var(--error); }
.cv2-future { background: none; }
.cv2-val { min-width: 12.5em; text-align: right; margin-left: auto; }
.cv2-sold { min-width: 7em; text-align: right; color: var(--muted); }
.cv2-yrhead .cv2-val, .cv2-yrhead .cv2-sold { color: var(--muted); font-size: .8rem; }
.cv2-legend { margin-top: var(--space-2); }
.cv2-legend .cv2-c { vertical-align: -2px; }
.cv2-events td:last-child { max-width: 30em; }
.cv2-source { margin-top: var(--space-6); }
@media (max-width: 760px) { .cv2-yr { flex-wrap: wrap; } .cv2-val { margin-left: 3.2em; } }

/* The desk (Erik's console, 2026-09-05): plain words, one status word per
   company, semantic colors as fixed mid-tones that read on both themes. */
.dk { max-width: 1080px; }
.dk-crumb { margin: 0 0 6px; font-size: 13px; }
.dk-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.dk-head h1 { margin: 0; }
.dk-tk { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 400; opacity: .6; font-size: .7em; }
.dk-stamp, .dk-muted { opacity: .6; font-size: 12.5px; }
.dk-line { font-size: 17px; line-height: 1.5; margin: 10px 0 0; max-width: 72ch; }
.dk-fine { font-size: 12.5px; opacity: .72; margin: 10px 0 0; line-height: 1.5; }
.dk-empty { opacity: .7; font-style: italic; }
.dk-blk { margin-top: 34px; }
.dk-blk > h2 { font-size: 19px; display: flex; align-items: center; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--border, #ddd); margin: 0 0 14px; }
.dk-count { font: 600 12px/1 system-ui, sans-serif; padding: 3px 8px; border-radius: 10px; background: rgba(127,127,127,.15); }
.dk-count.needs { background: rgba(180,56,44,.15); color: #b4382c; }
.dk-unk { color: #b4382c; font-style: italic; }
/* questions */
.dk-q { border: 1px solid var(--border, #ddd); border-left: 3px solid #a86a12; border-radius: 4px; padding: 14px 16px 12px 18px; margin-bottom: 12px; }
.dk-q.blocking { border-left-color: #b4382c; }
.dk-q-head { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.dk-chip { font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; font-weight: 600; padding: 2px 7px; border-radius: 3px; border: 1px solid var(--border, #bbb); opacity: .85; }
.dk-chip.blocking { border-color: #b4382c; color: #b4382c; }
.dk-chip.ticker { border-color: #a86a12; color: #a86a12; }
.dk-q-title { font-weight: 600; font-size: 16px; }
.dk-q-meta { font-size: 12.5px; opacity: .65; margin-left: auto; }
.dk-card { padding: 8px 0 4px; border-top: 1px solid var(--border, #eee); margin-top: 8px; }
.dk-card:first-of-type { border-top: 0; }
.dk-q-text { margin: 6px 0 8px; font-size: 15px; max-width: 70ch; }
.dk-answers { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 0; }
.dk-ans { border: 1px solid #1f4e8c; background: #1f4e8c; color: #fff; border-radius: 4px; padding: 6px 12px; font: 500 13.5px/1.3 inherit; cursor: pointer; }
.dk-ans.alt { background: transparent; color: inherit; border-color: #1f4e8c; }
.dk-ans.quiet { background: transparent; color: inherit; border-color: var(--border, #bbb); opacity: .8; }
.dk-ans:hover { filter: brightness(1.1); }
.dk-impl { margin-top: 6px; }
details.dk-brief { margin: 8px 0 4px; font-size: 13.5px; }
details.dk-brief summary { cursor: pointer; color: #1f4e8c; font-weight: 500; }
.dk-brief-host { margin-top: 8px; border: 1px solid var(--border, #ddd); border-radius: 4px; overflow: hidden; }
.dk-autos { margin-top: 10px; }
.dk-auto { display: flex; gap: 10px; align-items: center; padding: 6px 0; border-top: 1px solid var(--border, #eee); margin: 0; font-size: 13.5px; }
.dk-auto span { flex: 1; }
/* the firm table */
.dk-tbl { overflow-x: auto; border: 1px solid var(--border, #ddd); border-radius: 4px; }
.dk-tbl table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
.dk-tbl th { text-align: left; font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; opacity: .7; font-weight: 600; padding: 9px 12px; border-bottom: 1px solid var(--border, #ddd); white-space: nowrap; }
.dk-tbl td { padding: 9px 12px; border-bottom: 1px solid var(--border, #eee); vertical-align: top; }
.dk-tbl tr:last-child td { border-bottom: 0; }
.dk-tbl th.num, .dk-tbl td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dk-firm td.tk a { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 600; text-decoration: none; }
.dk-firm td.left { min-width: 240px; font-size: 13px; opacity: .9; }
.dk-st { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-weight: 600; font-size: 12.5px; }
.dk-st::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #9aa1a8; display: inline-block; }
.dk-st.done { color: #2e7d4f; } .dk-st.done::before { background: #2e7d4f; }
.dk-st.working { color: #a86a12; } .dk-st.working::before { background: #a86a12; }
.dk-st.needs-you, .dk-st.parked { color: #b4382c; } .dk-st.needs-you::before, .dk-st.parked::before { background: #b4382c; }
.dk-proof { white-space: nowrap; font-size: 12.5px; }
.dk-proof .ok { color: #2e7d4f; } .dk-proof .warn { color: #a86a12; } .dk-proof .bad { color: #b4382c; }
/* the log */
.dk-log { list-style: none; margin: 0; padding: 0; border: 1px solid var(--border, #ddd); border-radius: 4px; }
.dk-log li { display: grid; grid-template-columns: 118px 170px minmax(0, 1fr) 56px; gap: 14px; padding: 10px 14px; border-bottom: 1px solid var(--border, #eee); font-size: 13.5px; }
.dk-log li:last-child { border-bottom: 0; }
.dk-log .when { opacity: .6; white-space: nowrap; font-variant-numeric: tabular-nums; }
.dk-log .who { font-weight: 500; }
.dk-log .cost { text-align: right; opacity: .6; font-variant-numeric: tabular-nums; }
/* proofs */
.dk-proofs { border: 1px solid var(--border, #ddd); border-radius: 4px; padding: 4px 16px; }
.dk-proofs .row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border, #eee); font-size: 13.5px; align-items: start; }
.dk-proofs .row:last-child { border-bottom: 0; }
.dk-proofs .k { font-weight: 500; }
.dk-proofs .k small { display: block; font-weight: 400; opacity: .65; font-size: 12.5px; margin-top: 2px; }
.dk-pill { font: 600 12px/1 system-ui, sans-serif; padding: 4px 8px; border-radius: 3px; white-space: nowrap; }
.dk-pill.ok { background: rgba(46,125,79,.14); color: #2e7d4f; }
.dk-pill.warn { background: rgba(168,106,18,.16); color: #a86a12; }
.dk-pill.bad { background: rgba(180,56,44,.14); color: #b4382c; }
.dk-pill.na { background: rgba(127,127,127,.15); opacity: .8; }
/* orders */
.dk-orders { border: 1px solid var(--border, #ddd); border-radius: 4px; padding: 14px 16px; }
.dk-orders ul { margin: 0 0 12px; padding-left: 18px; font-size: 14px; }
.dk-orders li { margin: 5px 0; }
.dk-orders li.open { color: inherit; } .dk-orders li.done { opacity: .6; }
.dk-orders .by { opacity: .6; font-size: 12.5px; }
.dk-order-box { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 10px; align-items: start; margin: 0; }
.dk-order-box textarea { width: 100%; min-height: 64px; resize: vertical; font: inherit; font-size: 14px; padding: 8px 10px; border: 1px solid var(--border, #bbb); border-radius: 4px; background: var(--bg, #fff); color: var(--text, inherit); }
.dk-order-side { display: grid; gap: 8px; }
.dk-order-side input { font: inherit; font-size: 13px; padding: 6px 8px; border: 1px solid var(--border, #bbb); border-radius: 4px; background: var(--bg, #fff); color: var(--text, inherit); }
/* case file */
.dk-left { margin: 0; padding: 0 0 0 22px; border: 1px solid var(--border, #ddd); border-radius: 4px; }
.dk-left li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 14px 9px 4px; border-bottom: 1px solid var(--border, #eee); font-size: 14px; }
.dk-left li:last-child { border-bottom: 0; }
.dk-timeline { list-style: none; margin: 0 0 0 6px; padding: 0; border-left: 2px solid var(--border, #bbb); }
.dk-timeline li { position: relative; padding: 0 0 14px 22px; font-size: 13.5px; }
.dk-timeline li::before { content: ""; position: absolute; left: -7px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--bg, #fff); border: 2px solid #9aa1a8; }
.dk-timeline li.ruling::before, .dk-timeline li.order::before, .dk-timeline li.veto::before { border-color: #1f4e8c; background: #1f4e8c; }
.dk-timeline li.sign::before { border-color: #2e7d4f; }
.dk-timeline li.board::before { border-color: #a86a12; }
.dk-timeline .t { opacity: .6; font-size: 12.5px; display: block; font-variant-numeric: tabular-nums; }
.dk-timeline .who { font-weight: 500; }
.dk-docs td.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; white-space: nowrap; }
.dk-boxes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 24px; font-size: 13.5px; }
.dk-boxes .grp { grid-column: 1 / -1; margin-top: 14px; font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; opacity: .65; font-weight: 600; }
.dk-boxes .bx { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--border, #eee); align-items: baseline; }
.dk-boxes .bx i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; background: #9aa1a8; position: relative; top: 1px; }
.dk-boxes .bx.ok i { background: #2e7d4f; } .dk-boxes .bx.red i { background: #b4382c; } .dk-boxes .bx.warn i { background: #a86a12; }
.dk-boxes .bx small { display: block; opacity: .65; font-size: 12px; }
@media (max-width: 760px) {
  .dk-log li { grid-template-columns: 100px minmax(0, 1fr); }
  .dk-log .cost { grid-column: 2; text-align: left; }
  .dk-order-box { grid-template-columns: 1fr; }
  .dk-boxes { grid-template-columns: 1fr; }
}