/* Trial endpoint atlas (board row T-0130): the pages tools/make_trial_atlas.py writes. Loaded after styles.css and uses its tokens,
   fonts and reduced-motion rules. No animation here. One hue (--neon-cyan) means "a count" in the figures and nothing else is coloured
   there: open ring versus filled circle, the dashed outline, the hatch, the shaded column, their text labels and the printed numbers
   carry the meaning, so nothing relies on colour alone and forced-colours mode keeps it. No :has() means both figures show, stacked.
   Which tier of a figure shows is decided in the generated atlas-tiers.css (the wide tier only where its text renders at 11 px or more);
   with no container-query support the narrow tier shows. Every figure text is 12 user units or larger (tests/test_trial_atlas.py).
   Copied to the output folder as atlas.css. */

.atlas .wrap { width: min(100% - 2rem, var(--wide)); }       /* 16 px gutters on a phone */
.atlas main { overflow-wrap: anywhere; }

.synthetic-banner {
    border-block: 3px dashed var(--neon-orange);
    background: #1a1000;
    color: var(--ink-primary);
    padding: 0.6rem 1rem;
    font-family: var(--font-mono);
    font-size: 0.9rem;
}
.synthetic-banner p { margin: 0; max-width: var(--wide); margin-inline: auto; }
.synthetic-banner strong { color: var(--neon-orange); letter-spacing: 0.08em; }
.placeholder { color: var(--neon-orange); font-family: var(--font-mono); font-size: 0.85em; }

.atlas-head { border-bottom: 1px solid var(--border-glass); background: var(--bg-glass); }
.atlas-head-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1.5rem; padding: 0.6rem 0; }
/* The brand, as the site's shared header has it (site PR #40, src/styles.css; copied here, src/ is not edited): logo, the name on
   two lines, the subtitle to its right. The subtitle sits to the right of the name, in the space the two-line name leaves; on a
   very narrow screen it wraps to two lines instead of overflowing. */
.brand-name { flex: none; white-space: nowrap; }
.brand-sub { flex: 1 1 0; min-width: 6.25rem; padding-left: 0.75rem; border-left: 1px solid var(--border-glass); color: var(--ink-secondary); font-family: var(--font-mono); font-size: 0.7rem; font-weight: 500; line-height: 1.3; text-transform: uppercase; letter-spacing: 1px; text-wrap: balance; }
.atlas-head nav ul { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; margin: 0; padding: 0; list-style: none; }
.atlas-head nav a, .two-links a, .jumps a, .downloads a {
    display: inline-flex; align-items: center; min-height: 44px; color: var(--neon-cyan); text-underline-offset: 3px;
}

/* Atlas Secondary Navigation (pill bar matching site standard) */
.atlas-nav {
    margin: 1.25rem 0 1.5rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border-glass);
    background: rgba(255, 255, 255, 0.02);
}
.atlas-nav .wrap ul,
.atlas-nav-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem 0.75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.atlas-nav li {
    display: inline-flex;
    margin: 0;
    padding: 0;
}
.atlas-nav a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.2rem;
    padding: 0.35rem 0.85rem;
    border: 1px solid var(--border-subtle);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--ink-secondary);
    font-family: var(--font-mono);
    font-size: 0.82rem;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
}
.atlas-nav a:hover {
    color: var(--ink-primary);
    border-color: var(--border-glass);
    background: rgba(255, 255, 255, 0.06);
}
.atlas-nav a[aria-current="page"] {
    color: var(--neon-cyan);
    border-color: var(--neon-cyan);
    background: rgba(0, 229, 255, 0.12);
    font-weight: 600;
    box-shadow: 0 0 10px rgba(0, 229, 255, 0.15);
}
.atlas-nav a[aria-current="page"]::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--neon-cyan);
    box-shadow: 0 0 6px var(--neon-cyan);
}
.atlas-nav a.atlas-companion-link {
    border-color: rgba(0, 229, 255, 0.35);
    background: rgba(0, 229, 255, 0.04);
}
.atlas-nav a.atlas-companion-link:hover {
    border-color: var(--neon-cyan);
    color: var(--neon-cyan);
    background: rgba(0, 229, 255, 0.1);
}

.source-line { max-width: 46rem; color: var(--ink-primary); font-weight: 500; }

/* the copy's ledger: a small description list */
.ledger { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: 0.4rem 1.25rem; margin: 0 0 1rem; max-width: 60rem; }
.ledger div { min-width: 0; }
.ledger dt { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-secondary); }
.ledger dd { margin: 0; font-size: 0.95rem; }
.ledger code { color: var(--ink-primary); }

.live-line { max-width: 46rem; color: var(--ink-secondary); }
.live-line a, .terms a, .measure-grid a, .atlas-table a, .eyebrow a, a.more, .meta a { color: var(--neon-cyan); text-underline-offset: 3px; }
.units, .gate, .gloss, .caption, .none { max-width: 46rem; color: var(--ink-secondary); }
.gate { font-style: italic; }
.two-links { display: flex; flex-wrap: wrap; gap: 0 1.5rem; }

/* metric cards: one colour, no glow; two to a row on a phone */
.atlas .counts { grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); }
.atlas .counts strong { font-size: 2rem; }
.atlas .counts strong, .atlas .counts > div:first-child strong { color: var(--neon-cyan); text-shadow: none; }
.atlas .counts > div::before, .atlas .counts > div:first-child::before { background: var(--neon-cyan); opacity: 0.6; }

.not-say { margin: 1.5rem 0; padding: 1rem 1.25rem; border: 1px solid var(--border-glass); border-left: 4px solid var(--ink-secondary); border-radius: 8px; background: var(--bg-panel); max-width: 46rem; }
.not-say h2 { font-size: 1.25rem; margin-bottom: 0.5rem; }
.not-say ul { margin: 0; padding-left: 1.2rem; color: var(--ink-secondary); }
.not-say li { margin-bottom: 0.4rem; }
.not-shown, .sorted-check { margin: 1.5rem 0; padding: 1rem 1.25rem; border: 1px solid var(--border-glass); border-left: 4px solid var(--ink-secondary); border-radius: 8px; background: var(--bg-panel); max-width: 46rem; }
.not-shown h2, .sorted-check h2 { font-size: 1.25rem; margin-bottom: 0.5rem; }
.not-shown-names { margin: 0.5rem 0; padding-left: 1.2rem; }
.few-checked, .few-note { color: var(--ink-secondary); font-style: italic; }

.jumps ul { display: flex; flex-wrap: wrap; gap: 0 1.5rem; margin: 0; padding: 0; list-style: none; }

/* the figure switch: two radios and :has(); without :has() the switch hides and both figures show */
.fig-switch { display: none; margin: 1.5rem 0 0.5rem; padding: 0; border: 0; }
.fig-switch .switch-label { margin-right: 0.75rem; font-family: var(--font-mono); font-size: 0.8rem; color: var(--ink-secondary); }
.fig-switch label { display: inline-flex; align-items: center; min-height: 44px; padding: 0 0.9rem 0 0.3rem; cursor: pointer; }
.fig-switch input { width: 1.1rem; height: 1.1rem; accent-color: var(--neon-cyan); }
@supports selector(:has(*)) {
    .fig-switch { display: flex; flex-wrap: wrap; align-items: center; }
    .figures:has(#pick-years:checked) #fig-phase { display: none; }
    .figures:has(#pick-phase:checked) #fig-years { display: none; }
}

.figure { margin: 1.5rem 0 2.5rem; }
.figure h2 { font-size: clamp(1.3rem, 3vw, 1.8rem); }

.legend { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin: 0 0 1rem; padding: 0; list-style: none; font-size: 0.85rem; color: var(--ink-secondary); }
.legend li { display: flex; align-items: center; gap: 0.45rem; }
.key { display: inline-block; flex: none; width: 14px; height: 14px; border-radius: 50%; }
.key-unlit { width: 4px; height: 4px; margin: 5px; background: rgba(255, 255, 255, 0.42); }
.key-ring { border: 2px solid var(--neon-cyan); }
.key-fill { background: var(--neon-cyan); }
.key-planned { border: 2px dashed var(--ink-primary); }
.key-part { border-radius: 2px; background: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.55) 0 1.5px, transparent 1.5px 5px); border: 1px solid var(--border-glass); }
.key-planned-col { border-radius: 2px; background: rgba(255, 255, 255, 0.16); border: 1px solid var(--border-glass); }
.key-untyped { border: 2px solid var(--neon-cyan); background: linear-gradient(135deg, transparent 42%, var(--ink-primary) 42% 58%, transparent 58%); }

/* the lit grid: every tier written; atlas-tiers.css shows, per figure, the widest tier legible in its box (class names left of the
   rows, the picture filling the box); below every threshold the phone tier, class names above the rows */
.lit-box .tier { display: none; }
.lit-box .tier-narrow { display: block; }
.lit { display: block; width: 100%; height: auto; margin-bottom: 1rem; }
.lit-narrow { max-width: 22rem; margin-left: 0; }
/* a class page's year strip: Figure 1's renderer for one row, in a labelled box that scrolls sideways where the strip is wider */
.strip-cap { margin: 0.5rem 0 0; color: var(--ink-secondary); font-family: var(--font-mono); font-size: 0.78rem; }
.lit-box-strip { padding: 0.5rem; margin: 0.4rem 0 0.25rem; }
.lit-box-strip .lit { margin-bottom: 0; }
.year-view .legend { margin-bottom: 0.25rem; }
.year-view .table-alt { margin-bottom: 0.5rem; }
/* real data (about 35 start years) keep the yearly tier for very wide screens: the figures may run wider than the text, and the
   five-year tier gets more room once its box is wide */
.atlas .figures.wrap { width: min(100% - 2rem, 120rem); }
@container (min-width: 40rem) { .lit-narrow { max-width: 26rem; } }
.lit text { font-family: var(--font-mono); fill: var(--ink-secondary); }
.lit .hd { font-size: 12px; }
.lit .hd.major { fill: var(--ink-primary); font-weight: 600; }
.lit .col-note { font-size: 12px; fill: var(--ink-primary); }
.lit .lab { font-size: 13px; fill: var(--ink-primary); font-family: var(--font-body); }
.lit .dom { font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; fill: var(--ink-secondary); }
.lit .n { font-size: 12px; fill: var(--ink-primary); }
.lit .sh { fill: var(--ink-secondary); }
.lit .tot .n { fill: var(--ink-secondary); }
.lit .unlit { fill: rgba(255, 255, 255, 0.42); }
.lit .ring { fill: none; stroke: var(--neon-cyan); stroke-width: 2; }
.lit .fill { fill: var(--neon-cyan); }
.lit .planned-mark { fill: none; stroke: var(--ink-primary); stroke-width: 1.4; stroke-dasharray: 2.5 2; }
/* start date given, type not recorded: a slash across the mark, a shape (not a colour) unlike the planned dashed ring */
.lit .untyped-halo { stroke: var(--bg-dark); stroke-width: 4; stroke-linecap: round; }   /* keeps the slash readable on a filled circle */
.lit .untyped-mark { stroke: var(--ink-primary); stroke-width: 1.6; stroke-linecap: round; }
.lit .hatch-line { stroke: rgba(255, 255, 255, 0.4); stroke-width: 1.5; }
.lit .planned-col { fill: rgba(255, 255, 255, 0.08); }
.lit .band { fill: rgba(255, 255, 255, 0.035); }
.lit .divider { stroke: rgba(255, 255, 255, 0.22); stroke-width: 1; }
.lit .tick { stroke: rgba(255, 255, 255, 0.1); stroke-width: 1; }
.lit .rule { stroke: rgba(255, 255, 255, 0.22); }

/* the table under each figure, folded; open in print */
.table-alt { margin: 0 0 1.5rem; }
.table-alt > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.4rem; min-height: 44px; padding-block: 0.6rem; cursor: pointer; color: var(--neon-cyan); }
.table-alt > summary .rows-note { color: var(--ink-secondary); }

/* a table wider than its box scrolls inside it; edge shadows show there is more (pure CSS: the shadows move with the scroll) */
.table-scroll {
    max-width: 100%; overflow-x: auto; margin: 0.5rem 0 1.5rem; border: 1px solid var(--border-glass); border-radius: 8px;
    background:
        linear-gradient(to right, var(--bg-dark) 30%, rgba(5, 5, 5, 0)) left center / 2.5rem 100% no-repeat local,
        linear-gradient(to left, var(--bg-dark) 30%, rgba(5, 5, 5, 0)) right center / 2.5rem 100% no-repeat local,
        radial-gradient(farthest-side at 0 50%, rgba(0, 243, 255, 0.45), rgba(0, 243, 255, 0)) left center / 0.9rem 100% no-repeat scroll,
        radial-gradient(farthest-side at 100% 50%, rgba(0, 243, 255, 0.45), rgba(0, 243, 255, 0)) right center / 0.9rem 100% no-repeat scroll,
        var(--bg-dark);
}
/* the hidden cell context is absolutely positioned: without a positioned box it escapes the scroll and widens the whole page */
.table-scroll { position: relative; }
.atlas-table { border-collapse: collapse; font-size: 0.85rem; font-variant-numeric: tabular-nums; }
.atlas-table caption { caption-side: top; text-align: left; padding: 0.6rem 0.75rem; color: var(--ink-secondary); font-family: var(--font-mono); font-size: 0.78rem; }
.atlas-table th, .atlas-table td { padding: 0 0.5rem; border-top: 1px solid var(--line); text-align: right; white-space: nowrap; height: 44px; }
.atlas-table th[scope="row"] { text-align: left; font-weight: 500; position: sticky; left: 0; background: var(--bg-panel); }
.atlas-table thead th { font-family: var(--font-mono); font-weight: 500; color: var(--ink-secondary); }
.atlas-table td a { display: inline-flex; align-items: center; justify-content: flex-end; min-width: 44px; min-height: 44px; }
.atlas-table .pl, .part-note { color: var(--ink-secondary); font-size: 0.8em; }
.atlas-table .tot-row th, .atlas-table .tot-row td { border-top: 2px solid var(--border-glass); color: var(--ink-secondary); }
/* the class pages' small tables reflow: column heads and row heads wrap (a row head such as "2026 (year to the snapshot date)" too), so six
   columns fit a phone; the box around them still scrolls if a table is ever wider (a labelled region, like the figures' tables) */
.small-table { width: 100%; }
.atlas-table, .atlas-table * { overflow-wrap: normal; word-break: normal; }
.small-table thead th { white-space: normal; vertical-align: bottom; line-height: 1.25; padding-block: 0.4rem; font-size: 0.72rem; }
.small-table th[scope="row"] { position: static; white-space: normal; min-width: 4rem; max-width: 8rem; line-height: 1.25; padding-block: 0.3rem; }
@media (max-width: 40rem) { .small-table th, .small-table td { padding-inline: 0.3rem; } }

/* the co-occurrence matrix: class names run up the column heads so the columns stay narrow; each pair once, below the diagonal */
.co-table thead th { vertical-align: bottom; height: auto; padding: 0.5rem 0.2rem; }
.co-table thead th:first-child { vertical-align: bottom; text-align: left; }
.co-table .co-col { display: inline-block; writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; text-align: left; line-height: 1.2; text-transform: none; letter-spacing: 0; font-family: var(--font-body); font-size: 0.8rem; color: var(--ink-primary); }
.co-table td { min-width: 44px; text-align: center; }
.co-table td.diag { font-weight: 600; border: 1px solid var(--border-glass); color: var(--ink-primary); }
.co-table td.zero { color: var(--muted); }
/* a pair with studies differs from zero by weight, a tint and a border, not by colour alone */
.co-table td.nz { font-weight: 700; color: var(--ink-primary); background: rgba(0, 243, 255, 0.12); outline: 1px solid rgba(0, 243, 255, 0.55); outline-offset: -4px; }
/* A1: on a phone the row heads wrap at 8rem and stop being sticky, so more data columns fit beside them */
.co-table th[scope="row"] { white-space: normal; min-width: 6rem; max-width: 8rem; line-height: 1.25; }
@media (max-width: 40rem) { .co-table th[scope="row"] { position: static; } }
.scroll-hint { margin: 0 0 0.25rem; color: var(--ink-secondary); font-size: 0.85rem; }
.pair-table { width: 100%; max-width: 46rem; margin: 0.5rem 0 1.25rem; }
.pair-table td, .pair-table th { text-align: left; white-space: normal; }
.pair-table td:last-child, .pair-table th:last-child { text-align: right; }
.pair-table caption { padding-left: 0; }
.pair-table td { vertical-align: middle; }
.pair-table td a { justify-content: flex-start; min-width: 0; }
.pair-table th[scope="row"] { position: static; white-space: normal; text-align: left; font-weight: 400; }   /* both names in one cell */
.pair-table th[scope="row"] a { display: inline; min-height: 0; }
.pairs-more { margin: 0 0 1.25rem; max-width: 46rem; }
.pairs-more > summary { display: block; box-sizing: border-box; min-height: 44px; padding-block: 0.7rem; cursor: pointer; color: var(--neon-cyan); }   /* block, not flex: flex drops the space after the count */
@media (max-width: 40rem) { .pair-table td, .pair-table th { height: auto; padding-block: 0.3rem; font-size: 0.8rem; } .pair-table td a { min-height: 24px; } }   /* class names read from the left, not like counts */
/* styles.css makes every span in a card a block; a number inside a card's sentence stays in the sentence */
.atlas .counts span span { display: inline; margin-top: 0; font-size: inherit; }
.matrix-fold, .ledger-fold { margin: 0.5rem 0 1.5rem; }
.matrix-fold > summary, .ledger-fold > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--neon-cyan); }
.caution { max-width: 46rem; color: var(--ink-primary); }
.caution a { color: var(--neon-cyan); text-underline-offset: 3px; }
.zero-line { max-width: 46rem; color: var(--ink-secondary); }
.zero-line a { color: var(--ink-secondary); text-underline-offset: 3px; }
.small-wrap { margin: 0.5rem 0 1.5rem; }
/* A7: focus outlines inside scroll boxes and sticky heads are drawn inward so they are not clipped */
.atlas-table a:focus-visible { outline-offset: -3px; }

/* what each measure means: a compact list on phones, two columns on wide screens; a class with no study is quieter, still listed */
.measure-grid, .measure-grid ul { list-style: none; padding: 0; margin: 0; }
.measure-grid > li { break-inside: avoid; margin-bottom: 0.9rem; }
.measure-grid > li.single { margin-bottom: 0.4rem; }
.measure-grid h3 { font-size: 1rem; margin: 0 0 0.15rem; color: var(--ink-secondary); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.05em; }
.measure-grid .m { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.6rem; min-height: 28px; padding-block: 2px; }
.measure-grid .m a { display: inline-flex; align-items: center; min-height: 24px; }   /* compact on a phone: 24 px targets (WCAG 2.2 minimum) */
.measure-grid > li:not(.single) .m { padding-left: 1rem; }
.measure-grid .m-n { color: var(--ink-secondary); font-size: 0.9rem; }
.measure-grid .gloss { flex-basis: 100%; margin: 0 0 0.5rem; }
@media (min-width: 48rem) { .measure-grid { columns: 2; column-gap: 2.5rem; } .measure-grid .m { min-height: 44px; } }

.steps { max-width: 46rem; padding-left: 1.4rem; color: var(--ink-secondary); }
.steps li { margin-bottom: 0.6rem; }
.cite { max-width: 46rem; padding: 0.75rem 1rem; border-left: 3px solid var(--neon-cyan); background: var(--bg-panel); }

.terms { margin: 2rem 0 3rem; padding-top: 1rem; border-top: 1px solid var(--border-glass); }
.terms h2 { font-size: clamp(1.2rem, 3vw, 1.6rem); }
.terms-list { max-width: 46rem; margin: 0; color: var(--ink-secondary); }
.terms-list dt { margin-top: 0.75rem; color: var(--ink-primary); font-weight: 600; }
.terms-list dd { margin: 0.2rem 0 0; }
.terms-list ul, .terms-list ol { margin: 0.2rem 0 0; padding-left: 1.4rem; }
.terms-more { margin-top: 1rem; max-width: 46rem; }
.terms-more > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--neon-cyan); }

.atlas-foot { border-top: 1px solid var(--border-glass); padding: 1.5rem 0 2rem; color: var(--ink-secondary); }

/* The published build (--draft): the site's shared header and footer come from styles.css; below the header, the banner on what the
   sorting was checked against (its label a plain .stamp from styles.css), then the atlas's own navigation. */
.draft-banner { border-block: 1px solid var(--border-glass); background: var(--bg-panel); padding: 0.75rem 0; }
.draft-banner .wrap { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.75rem; }
.draft-banner .stamp { margin: 0; }
.draft-banner p { margin: 0; max-width: 46rem; color: var(--ink-primary); font-size: 0.95rem; }
.atlas-nav { border-bottom: 1px solid var(--border-glass); }
.atlas-nav ul { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; margin: 0; padding: 0; list-style: none; }
.atlas-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--neon-cyan); text-underline-offset: 3px; }

@media (forced-colors: active) {
    .lit { forced-color-adjust: none; background: Canvas; }
    .lit text, .lit .n, .lit .lab, .lit .dom, .lit .hd, .lit .hd.major, .lit .col-note, .lit .tot .n, .lit .sh { fill: CanvasText; }
    .lit .unlit { fill: CanvasText; }
    .co-table td.nz { outline: 2px solid CanvasText; background: Canvas; color: CanvasText; }
    .table-scroll { border: 1px solid CanvasText; }
    .lit .ring { stroke: CanvasText; }
    .lit .fill { fill: CanvasText; }
    .lit .planned-mark { stroke: CanvasText; stroke-width: 1.8; }
    .lit .untyped-mark { stroke: CanvasText; stroke-width: 1.8; }
    .lit .untyped-halo { stroke: Canvas; }
    .key-untyped { forced-color-adjust: none; border-color: CanvasText; background: linear-gradient(135deg, Canvas 42%, CanvasText 42% 58%, Canvas 58%); }
    .lit .hatch-line { stroke: CanvasText; }
    .lit .planned-col, .lit .band { fill: transparent; }
    .lit .divider, .lit .rule, .lit .tick { stroke: GrayText; }
    .key-unlit { background: CanvasText; forced-color-adjust: none; }
    .key-ring { border-color: CanvasText; }
    .key-fill { background: CanvasText; forced-color-adjust: none; }
    .key-planned { border-color: CanvasText; }
    .synthetic-banner, .not-say, .not-shown, .sorted-check { border-color: CanvasText; }
    .draft-banner { border-color: CanvasText; background: Canvas; }
    .table-scroll { background: Canvas; }
}

@media print {
    .synthetic-banner { border-color: #000; background: #fff; color: #000; }
    .synthetic-banner strong, .placeholder { color: #000; }
    .fig-switch, .atlas-head nav, .atlas-nav { display: none !important; }
    .draft-banner { border-color: #000; background: #fff; }
    .draft-banner p { color: #000; }
    .figures #fig-years, .figures #fig-phase { display: block !important; }
    details > *:not(summary) { display: block !important; }
    details::details-content { content-visibility: visible; display: block; }
    .lit text, .lit .n, .lit .lab { fill: #000; }
    .lit .ring { stroke: #000; }
    .lit .fill { fill: #000; }
    .lit .unlit { fill: #999; }
    .not-say, .not-shown, .sorted-check, .atlas-table th[scope="row"], .table-scroll { background: #fff; color: #000; }
}