/*! AoT theme bundle (built 2026-04-29T01:42:23Z)
 *  source order: tokens.css base.css layout.css components.css pages.css mobile.css ui-fixes-20260424.css
 */

/* ── tokens.css ────────────────────────────────────────────────── */
/* Art of Truth Beta — Design Tokens
 * Source: v2-shell.jsx lines 3-20
 * All tokens exported as CSS custom properties on :root
 */

/* ── Self-hosted font declarations (4 families, all `font-display: swap`) ──
   Tried Newsreader → `font-display: optional` (TODO 2026-04-29 mobile-perf, fix
   #2): the PSI field-data hint was that the article LCP element
   (.article-header__dek, Newsreader body) had a ~1.2 s render delay attributable
   to font-swap. Lab Lighthouse mobile on /repair-monopoly-tactics-…/ showed
   no LCP delta between `swap` and `optional` (4.1-4.7 s either way, within
   ±300 ms noise). Reverted: the cosmetic cost (mobile visitors on Slow 4G hit
   the 100 ms `optional` threshold and see Georgia for the whole session) is
   real, the perf gain wasn't. Real article render delay (3.6 s) is upstream of
   font choice; lab data points at the Inter critical chain (~344 KiB transfer
   on Slow 4G). See TODO 2026-04-29-00-43-mobile-perf-push.md `## 2026-04-29
   progress` for the full ranked-list re-evaluation. */

/* `?v=2026-04-28` cache-buster: the original WOFF2 binaries shipped as
   44-byte stubs in the initial theme commit; browsers that fetched them
   cached an unparseable file and kept reusing it after the bytes were
   replaced. Bumping the URL forces every client to refetch. Update this
   suffix any time the binary itself changes. */
@font-face {
    font-family: 'Fraunces';
    src: url('../fonts/Fraunces/Fraunces-VariableFont_SOFT,WONK,opsz,wght.woff2?v=2026-04-28') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fraunces';
    src: url('../fonts/Fraunces/Fraunces-Italic-VariableFont_SOFT,WONK,opsz,wght.woff2?v=2026-04-28') format('woff2');
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Newsreader';
    src: url('../fonts/Newsreader/Newsreader-VariableFont_opsz,wght.woff2?v=2026-04-28') format('woff2');
    font-weight: 300 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Newsreader';
    src: url('../fonts/Newsreader/Newsreader-Italic-VariableFont_opsz,wght.woff2?v=2026-04-28') format('woff2');
    font-weight: 300 800;
    font-style: italic;
    font-display: swap;
}

/* Inter UI font: subset to Latin + Latin-Ext + UI symbol ranges. Covers
   EN/FR/DE/ES (Latin-1, Latin-Ext-A/B, Latin-Ext-Additional), smart quotes
   and em/en dashes (U+2000-206F), €/™/← →/✓/▶/◀/★/☆ (U+2190-21FF, U+2200-22FF,
   U+25A0-25FF, U+2600-26FF, U+2700-27BF). Original Inter 344 KiB → subset
   v2 187 KiB (≈46% off). The UI-symbol ranges were added after a pre-ship
   audit caught U+25B6 ▶ in the TTS play button (`template-parts/tts-player.php`)
   and the on-disk Inter cmap; without those ranges the TTS triangle would
   render in the system-ui fallback. Cache-bust `?v=2026-04-29-2` on subset
   filename change; original `Inter-VariableFont_slnt,wght.woff2` stays in
   fonts/ as a rollback fallback (revert this `src` URL to drop). Subset
   built with `pyftsubset --layout-features='*' --no-hinting --desubroutinize
   --flavor=woff2`; full unicode-range list lives in TODO 2026-04-29-00-43. */
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter/Inter-VariableFont_slnt,wght.latin.woff2?v=2026-04-29-2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* JetBrains Mono: subset same as Inter (Latin + Latin-Ext + UI symbols).
   Original 92 KiB → 35 KiB regular, 96 KiB → 37 KiB italic. Mono sat on
   the Lighthouse critical request chain at full size; subsetting drops
   ~115 KiB of parallel font traffic on Slow 4G mobile. Mono is used for
   small UI labels (util-strip, masthead flanks, post-byline timestamps,
   footer caption, search/contact form labels), all latin-only. Originals
   stay in fonts/ for rollback. */
@font-face {
    font-family: 'JetBrains Mono';
    src: url('../fonts/JetBrainsMono/JetBrainsMono-VariableFont_wght.latin.woff2?v=2026-04-29-2') format('woff2');
    font-weight: 100 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'JetBrains Mono';
    src: url('../fonts/JetBrainsMono/JetBrainsMono-Italic-VariableFont_wght.latin.woff2?v=2026-04-29-2') format('woff2');
    font-weight: 100 800;
    font-style: italic;
    font-display: swap;
}

/* ── CSS Custom Properties ───────────────────────────────────────────────── */

:root {
    /* Ink / background scale — near-black (b > r) to maximize contrast
       with the #a61c1c accent. Cool cast intentional (avoids warm-brown
       drift); keep the b-channel slightly above r. */
    --ink-0:      #050507;
    --ink-1:      #0d0d13;
    --ink-2:      #17171f;

    /* Paper / foreground scale — neutral (drops yellow saturation so the
       cream doesn't combine with any warm cast in the ink scale). */
    --paper-0:    #ece9e3;
    --paper-1:    #c2beb4;

    /* Muted — neutral hue, WCAG-AA on --ink-0 */
    --mute-0:     #9a968d;
    --mute-1:     #807c74;

    /* Rules / dividers — neutralised alongside paper */
    --rule-weak:   rgba(236, 233, 227, 0.12);
    --rule-strong: rgba(236, 233, 227, 0.28);

    /* Accent (crimson), FireBrick-adjacent red, green/blue near zero.
       Most --accent uses are hover states; sub-AA contrast on body
       text is an accepted trade-off for branding fidelity. */
    --accent:      #a61c1c;
    --accent-dim:  rgba(166, 28, 28, 0.22);

    /* Review pill colors */
    --approved:    #6fb88a;
    --ai-verified: #a78bfa;

    /* Buy-me-a-coffee yellow */
    --coffee-yellow: #FFDD00;

    /* Typography stacks */
    --font-display: 'Fraunces', 'Times New Roman', serif;
    --font-body:    'Newsreader', Georgia, serif;
    --font-ui:      'Inter', system-ui, sans-serif;
    --font-mono:    'JetBrains Mono', ui-monospace, monospace;

    /* Spacing */
    --gutter-desktop: 56px;
    --gutter-narrow:  22px;

    /* Tinted shadows: cool-cast toward Carbon Ink instead of pure black,
       so shadow color sits inside the brand neutral system. */
    --shadow-hover-lift:    0 16px 40px rgba(5, 5, 12, 0.5);
    --shadow-tooltip-float: 0 2px 12px rgba(5, 5, 12, 0.4);
    /* Modal scrim: Carbon Ink at 70% alpha. */
    --overlay-scrim:        rgba(5, 5, 7, 0.7);
}


/* ── base.css ────────────────────────────────────────────────── */
/* Art of Truth Beta, Base reset + default typography */

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

html {
    color-scheme: dark;
    /* Base raised from 16px → 17.5px; scales all rem-based sizes by ~9%.
       px-sized UI labels bumped individually in components/pages.css. */
    font-size: 17.5px;
    -webkit-text-size-adjust: 100%;
}

body {
    /* Layered background: two layers over --ink-0.
       1. Radial vignette from top-center, accent-tinted halo at alpha
          0.05 so it reads as atmosphere, not colour.
       2. Inline SVG feTurbulence noise (fractalNoise, baseFreq 0.9,
          2 octaves, stitched, alpha 0.05), paper-like grain at 200×200
          tiles so the repeat isn't visible.
       Both layers use `background-attachment: fixed` so texture stays
       consistent as the viewport scrolls. */
    background-color: var(--ink-0);
    background-image:
        radial-gradient(ellipse 110% 55% at 50% -10%,
            rgba(166, 28, 28, 0.05), transparent 62%),
        url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-repeat: no-repeat, repeat;
    background-attachment: fixed, fixed;
    color: var(--paper-0);
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.7;
    min-height: 100vh;
}

/* Default link styles */
a {
    color: inherit;
    text-decoration: none;
}
a:hover {
    color: var(--accent);
}
:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: 500;
    line-height: 1.15;
    color: var(--paper-0);
}

/* Paragraphs */
p {
    margin-bottom: 1.25em;
}
p:last-child {
    margin-bottom: 0;
}

/* Semantic block elements */
/* Blockquote: hairline-rule pattern (top + bottom 1px), no side stripe.
   Replaces the prior `border-left: 3px solid var(--accent)` to clear
   the side-stripe absolute ban. The italic + paper-1 colour now do
   the visual work; the rules give the quote a print-set feel. */
blockquote {
    border-top: 1px solid var(--rule-strong);
    border-bottom: 1px solid var(--rule-strong);
    padding: 1rem 1.25rem;
    margin: 1.5rem 0;
    font-style: italic;
    color: var(--paper-1);
}

figure {
    margin: 0;
}

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

hr {
    border: none;
    border-top: 1px solid var(--rule-weak);
    margin: 2rem 0;
}

/* Code */
code, pre, kbd, samp {
    font-family: var(--font-mono);
    font-size: 0.875em;
}

/* Lists */
ul, ol {
    padding-left: 1.5em;
}
li {
    margin-bottom: 0.25em;
}

/* Button reset */
button {
    font-family: var(--font-ui);
    cursor: pointer;
    border: none;
    background: none;
    color: inherit;
}

/* Screen reader only */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Visible-on-focus skip-to-content link. Pairs with .sr-only baseline:
   the link is offscreen until focused (Tab from page load), then
   materializes at the top with high contrast. */
.sr-only-focusable:focus,
.sr-only-focusable:focus-visible {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0.75rem 1rem;
    overflow: visible;
    clip: auto;
    white-space: normal;
    background: var(--paper-0);
    color: var(--ink-0);
    font-family: var(--font-ui);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    z-index: 9999;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ── layout.css ────────────────────────────────────────────────── */
/* Art of Truth Beta — Layout: 12-col grid, gutters, breakpoints */

/* ── Container ───────────────────────────────────────────────────────────── */

.site-container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 var(--gutter-desktop);
}

.content-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0 1.5rem;
}

/* ── Lead + Rail split (8/4) ─────────────────────────────────────────────── */

.lead-col {
    grid-column: 1 / 9;
}
.rail-col {
    grid-column: 9 / 13;
}

/* ── Desks grid (3×2) ────────────────────────────────────────────────────── */

.desks-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background-color: var(--rule-weak);
}
.desk-cell {
    background-color: var(--ink-0);
}

/* ── Section header rule ─────────────────────────────────────────────────── */

.section-header {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--rule-strong);
}
.section-header__label {
    font-family: var(--font-mono);
    font-size: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--mute-0);
}

/* ── Breakpoint: 1200px — narrower gutters only ──────────────────────────── */
/* (Removed the html font-size: 14.4px shrink; it produced unreadable
   body text on tablets and contradicted the larger-fonts direction
   adopted in hotfix-011/012/013.) */

@media (max-width: 1200px) {
    .site-container {
        padding: 0 calc(var(--gutter-desktop) * 0.7);
    }
}

/* ── Breakpoint: 900px — lead+rail stack, desks 2-col ────────────────────── */

@media (max-width: 900px) {
    .site-container {
        padding: 0 var(--gutter-narrow);
    }
    .lead-col,
    .rail-col {
        grid-column: 1 / -1;
    }
    .desks-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ── Breakpoint: 640px — mobile layouts ──────────────────────────────────── */

@media (max-width: 640px) {
    .desks-grid {
        grid-template-columns: 1fr;
    }
    .content-grid {
        display: block;
    }
}


/* ── components.css ────────────────────────────────────────────────── */
.util-strip{display:flex;justify-content:space-between;align-items:center;padding:10px var(--gutter-desktop);font-family:var(--font-mono);font-size:12px;letter-spacing:1.3px;color:var(--paper-1);border-bottom:1px solid var(--rule-weak)}.util-search,.util-strip__left,.util-strip__right{display:flex;align-items:center;gap:22px}.util-strip a{color:inherit;text-decoration:none;transition:color 150ms ease}.util-strip a:hover,.util-strip a[data-lang].is-active,.util-strip a[data-lang][aria-current=true]{color:var(--paper-0)}.util-search{gap:0}.util-search input[type=search]{background:0 0;border:1px solid var(--rule-weak);border-right:none;color:var(--paper-0);font-family:var(--font-mono);font-size:10.5px;letter-spacing:1px;padding:4px 8px;width:140px;height:22px;line-height:1;outline:0;transition:border-color 150ms ease}.util-search input[type=search]::placeholder{color:var(--mute-0);text-transform:uppercase;letter-spacing:1.5px;font-size:10px}.util-search input[type=search]:focus{border-color:var(--accent);width:180px}.util-search__submit{background:0 0;border:1px solid var(--rule-weak);color:var(--mute-0);font-family:var(--font-mono);font-size:12px;padding:0 8px;height:22px;cursor:pointer;transition:color 150ms ease,border-color 150ms ease}.util-search__submit:hover{color:var(--accent);border-color:var(--accent)}.masthead__flanks span,.util-strip__funded{color:var(--paper-1)}.masthead{padding:44px var(--gutter-desktop) 24px;text-align:center;position:relative}.masthead__flanks{position:absolute;top:50%;transform:translateY(-50%);font-family:var(--font-mono);font-size:10.5px;letter-spacing:1.6px;color:var(--mute-0);line-height:1.6}.masthead__flanks--left{left:var(--gutter-desktop);text-align:left}.masthead__flanks--right{right:var(--gutter-desktop);text-align:right}.masthead__wordmark{font-family:var(--font-display);font-size:92px;font-weight:500;letter-spacing:-3.2px;line-height:.9;color:var(--paper-0);display:block}.masthead__wordmark em{font-style:italic;font-weight:400;color:var(--accent)}.masthead__tagline{margin-top:12px;font-family:var(--font-body);font-style:italic;font-size:17px;color:var(--paper-1);letter-spacing:.2px}.masthead-home{text-decoration:none;color:inherit}.primary-nav{display:flex;justify-content:center;gap:44px;padding:14px var(--gutter-desktop);font-family:var(--font-ui);font-size:14px;letter-spacing:1.6px;text-transform:uppercase;border-top:1px solid var(--rule-strong);border-bottom:3px double var(--rule-strong)}.primary-nav-link{color:var(--paper-0);font-weight:600;cursor:pointer;padding:6px 10px;border-bottom:none;transition:color 150ms ease;text-decoration:none;display:inline-block}.post-card__headline a:hover,.primary-nav-link:hover{color:var(--accent)}.primary-nav-link.is-active,.primary-nav-link[aria-current=page]{color:var(--accent);font-weight:600;border-bottom:1px solid var(--accent)}@media (prefers-reduced-motion:reduce){.primary-nav-link{transition:none}}#site-header{background-color:var(--ink-0);color:var(--paper-0);border-bottom:1px solid var(--rule-strong)}.tts-bar{display:flex;align-items:center;gap:.7rem;padding:6px 12px;background-color:var(--ink-2);border:1px solid var(--rule-weak);border-radius:3px;max-width:680px;margin:1rem auto 2rem}.tts-bar__pending-label{font-family:var(--font-mono);font-size:9.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--mute-0);flex-shrink:0}button.tts-play-pause{width:26px;height:26px;border-radius:50%;background-color:transparent;border:1px solid var(--paper-1);color:var(--paper-0);display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;font-size:10px;line-height:1;padding:0;transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease}button.tts-play-pause:hover{background-color:var(--accent);border-color:var(--accent);color:var(--paper-0)}button.tts-play-pause:disabled,button.tts-play-pause[aria-disabled=true]{opacity:.4;cursor:default;pointer-events:none}.tts-bar__progress{flex:1;height:2px;background-color:var(--rule-weak);border-radius:2px;overflow:hidden;min-width:60px}.tts-bar__progress-fill{height:100%;background-color:var(--accent);width:0%;transition:width .5s linear}.tts-bar__time{font-family:var(--font-mono);font-size:10px;color:var(--mute-0);flex-shrink:0;letter-spacing:.4px;font-variant-numeric:tabular-nums}.version-toggle{display:flex;align-items:center;gap:8px;margin:0 0 1.5rem;padding:8px 12px;border:1px solid var(--rule-strong);border-radius:4px;background:var(--ink-2);font-family:var(--font-ui);font-size:.82rem}.version-toggle-label{font-family:var(--font-ui);font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--mute-0);font-weight:600;margin-right:4px}.version-btn{padding:4px 12px;background:0 0;border:1px solid transparent;color:var(--mute-0);border-radius:3px;font-size:.82rem;font-family:inherit;cursor:pointer;transition:background 150ms ease,color 150ms ease,border-color 150ms ease}.version-btn:hover{color:var(--paper-0)}.version-btn.is-active{background:rgba(166,28,28,.12);border-color:rgba(166,28,28,.3);color:var(--accent);font-weight:600}@media (max-width:640px){.version-toggle{padding:6px 10px;gap:6px}.version-toggle-label{display:none}}.ver[data-version]{display:none}.ver[data-version].ver-active{display:block}.glossary-term{position:relative;cursor:help;border-bottom:1px dotted var(--accent)}.glossary-term:focus,.glossary-term:hover{outline:0}.glossary-tooltip{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);min-width:200px;max-width:320px;padding:.55rem .75rem;font-family:var(--font-body);font-size:.85rem;line-height:1.4;color:var(--paper-0);background-color:var(--ink-1);border:1px solid var(--rule-strong);border-radius:3px;box-shadow:var(--shadow-tooltip-float);z-index:50;opacity:0;pointer-events:none;transition:opacity 120ms ease;white-space:normal;text-transform:none;letter-spacing:0}.glossary-term.is-active>.glossary-tooltip,.glossary-term:focus>.glossary-tooltip,.glossary-term:hover>.glossary-tooltip{opacity:1;pointer-events:auto}.pull-quote{font-family:var(--font-display);font-size:1.4rem;font-style:italic;font-weight:400;color:var(--paper-1);border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);padding:1.5rem 0;margin:2rem 0;text-align:center}.tip-jar{display:flex;flex-direction:column;gap:1.25rem;padding:1.75rem;background-color:var(--ink-2);border:1px solid var(--rule-strong);border-radius:4px;margin-top:2rem}.post-card__headline a,.tip-jar__cta{color:var(--paper-0);text-decoration:none}.tip-jar__cta{display:block;padding:13px 20px;background-color:transparent;border:1px solid var(--paper-0);font-family:var(--font-mono);font-size:14px;letter-spacing:1.4px;text-transform:uppercase;font-weight:600;border-radius:2px;text-align:center;transition:background-color 150ms ease,color 150ms ease,transform 100ms ease}.tip-jar__cta:hover{background-color:var(--paper-0);color:var(--ink-0);transform:translateY(-1px)}.posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;align-items:stretch}@media (max-width:1100px){.posts-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.posts-grid{grid-template-columns:1fr}}.post-card{background:var(--ink-2);border:1px solid var(--rule-strong);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;transition:transform 200ms ease,border-color 200ms ease,box-shadow 200ms ease}.post-card:hover{transform:translateY(-4px);border-color:rgba(166,28,28,.35);box-shadow:var(--shadow-hover-lift)}@media (prefers-reduced-motion:reduce){.post-card,.post-card:hover{transform:none}}.post-card__image-link{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--ink-1);flex-shrink:0}.post-card__image{width:100%;height:100%;aspect-ratio:16/9;object-fit:cover;display:block;transition:transform 400ms ease}.post-card__image-link:hover .post-card__image{transform:scale(1.05)}@media (prefers-reduced-motion:reduce){.post-card__image-link:hover .post-card__image{transform:none}}.post-card__body{padding:.6rem 1rem .9rem;flex:1;display:flex;flex-direction:column}.post-card__meta{display:flex;align-items:center;gap:.4rem;margin-bottom:.35rem;flex-wrap:wrap}.post-card__date{font-family:var(--font-ui);font-size:.78rem;color:var(--mute-0)}.post-card__headline{font-family:var(--font-display);font-size:1.15rem;font-weight:700;line-height:1.3;letter-spacing:-.01em;margin:0 0 .6rem;color:var(--paper-0)}.post-card__headline a{transition:color 150ms ease}.post-card__dek{font-family:var(--font-body);font-size:.92rem;color:var(--paper-1);line-height:1.6;margin:0 0 .75rem}.post-card .post-cat{margin-top:auto;padding-top:.2rem;display:flex;flex-wrap:wrap;gap:.3rem;margin-bottom:0}.persona-card__medallion{width:52px;height:52px;border-radius:50%;background-color:var(--ink-2);border:1px solid var(--rule-strong);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-style:italic;font-size:26px;color:var(--paper-1);text-decoration:none}.site-footer{background-color:var(--ink-0);border-top:3px double var(--rule-strong);padding:.45rem var(--gutter-desktop)}.footer-inline{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;flex-wrap:wrap}.footer-inline__brand{display:flex;flex-direction:column}.footer-inline__nav{display:flex;align-items:center;gap:1.75rem;flex-wrap:wrap}.footer-inline__nav>a{font-family:var(--font-ui);font-size:14px;color:var(--paper-1);text-decoration:none;padding:5px 9px;border-radius:3px;transition:color 100ms,background-color 100ms}.footer-inline__nav>a:hover{color:var(--paper-0);background-color:var(--ink-1)}.footer-col__brand{font-family:var(--font-display);font-size:1.4rem;font-weight:500}.footer-col__brand em{font-style:italic;color:var(--accent)}.footer-col__tagline{font-family:var(--font-body);font-style:italic;font-size:13px;color:var(--paper-1);margin-top:2px}.footer-note{margin-top:.25rem;padding-top:.25rem;border-top:1px solid var(--rule-weak);font-family:var(--font-mono);font-size:11px;letter-spacing:1.3px;color:var(--paper-1);text-align:center}#nav-burger{background:0 0;border:0;color:var(--paper-0);font-size:22px;cursor:pointer;padding:4px 8px;line-height:1}#nav-burger,#nav-burger[aria-expanded=true] .nav-burger__icon--open,.nav-burger__icon--close{display:none}#nav-burger[aria-expanded=true] .nav-burger__icon--close{display:inline}#nav-burger[aria-expanded=true]+.primary-nav,.share-row{display:flex}.share-row{gap:8px;flex-wrap:wrap;align-items:center}.share-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border:1px solid var(--rule-strong);border-radius:3px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--mute-0);text-decoration:none;transition:border-color 100ms,color 100ms;cursor:pointer;background:0 0}.share-pill:hover{border-color:var(--paper-0);color:var(--paper-0)}.share-pill--icon{gap:0;width:32px;height:32px;padding:0;justify-content:center;color:var(--paper-1);font-size:0;letter-spacing:0;text-transform:none}.share-pill--icon:focus-visible,.share-pill--icon:hover{border-color:var(--paper-0);color:var(--paper-0)}.share-pill .share-pill__icon-check,.share-pill.is-copied .share-pill__icon-default{display:none}.share-pill.is-copied{color:var(--approved);border-color:var(--approved)}.share-pill.is-copied .share-pill__icon-check{display:inline-block}.share-pill.is-failed{color:var(--accent);border-color:var(--accent)}.desk-header{padding:0 1.25rem 1rem;border-bottom:1px solid var(--rule-weak)}.desk-header__kicker,.lang-switcher a{font-family:var(--font-mono);text-transform:uppercase}.desk-header__kicker{font-size:11px;letter-spacing:1.6px;color:var(--accent);margin-bottom:.25rem}.desk-header__title{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--paper-0)}.lang-switcher{display:flex;gap:12px}.lang-switcher a{font-size:12px;letter-spacing:1.3px;color:var(--paper-1);text-decoration:none;padding:3px 7px;border-radius:3px;transition:background-color 120ms ease,color 120ms ease}.lang-switcher a:hover{background-color:var(--ink-1);color:var(--paper-0)}.lang-switcher a.is-active,.lang-switcher a[aria-current=true]{color:var(--paper-0)}

/* ── pages.css ────────────────────────────────────────────────── */
.editors-desk-band{padding:1.25rem var(--gutter-desktop);border-bottom:1px solid var(--rule-weak);background-color:var(--ink-2)}.editors-desk-band__kicker{font-family:var(--font-mono);font-size:9.5px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:.5rem}.editors-desk-band__note{font-family:var(--font-body);font-style:italic;font-size:1rem;color:var(--paper-1);max-width:720px}.lead-rail-section{padding-top:16px;padding-bottom:16px}.lead-article{background:var(--ink-2);border:1px solid var(--rule-strong);border-radius:8px;overflow:hidden;transition:transform 200ms ease,border-color 200ms ease,box-shadow 200ms ease}.lead-article:hover{border-color:rgba(166,28,28,.35);box-shadow:var(--shadow-hover-lift)}.lead-article figure{margin:0;overflow:hidden;aspect-ratio:16/9}.lead-article figure img{width:100%;height:100%;object-fit:cover;transition:transform 400ms ease}.lead-article figure a:hover img{transform:scale(1.03)}@media (prefers-reduced-motion:reduce){.lead-article,.lead-article:hover{transform:none;box-shadow:none}.lead-article figure a:hover img{transform:none}}.lead-article h1{font-family:var(--font-display);font-size:2.15rem;font-weight:500;line-height:1.1;margin:0;padding:1.75rem 1.5rem 0}.lead-article h1 em{font-weight:400;transition:color 150ms ease}.lead-article h1 a{color:var(--paper-0);text-decoration:none;transition:color 150ms ease}.lead-article h1 a em,.lead-article h1 em{color:var(--paper-1)}.desk-cell .latest-item a:hover,.lead-article h1 a:hover,.lead-article h1 a:hover em{color:var(--accent)}.lead-article__meta{padding:1.5rem 1.5rem 0;font-family:var(--font-ui);font-size:.85rem;color:var(--mute-0)}.lead-article__meta+h1{padding-top:.4rem}.lead-article__body{font-family:var(--font-body);font-size:17px;line-height:1.7;color:var(--paper-0);margin:0;padding:1rem 1.5rem .25rem}.lead-article__body p{margin:0 0 1rem}.lead-article__body p:last-child{margin-bottom:0}.continue-reading-link{display:inline-block;margin:0;padding:.5rem 1.5rem 1.75rem;color:var(--paper-0);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px;font-weight:600}.continue-reading-link:hover{color:var(--paper-0)}@media (min-width:901px){.lead-article,.lead-col{display:flex;flex-direction:column}.lead-article{flex:1 1 auto;min-height:0}.lead-article__body{flex:1 1 0;min-height:0;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(to bottom,#000 85%,transparent 100%);mask-image:linear-gradient(to bottom,#000 85%,transparent 100%)}}.rail-col{display:flex;flex-direction:column;gap:1.25rem}@media (min-width:901px){.rail-col{justify-content:space-between;padding:0}}@media (max-width:900px){.rail-col{padding-top:0;padding-bottom:1rem}}.rail-card.post-card{margin:0}.rail-card .post-card__body{padding:.7rem .9rem .9rem}.rail-card .post-card__headline{font-size:1rem;line-height:1.3;margin-bottom:.45rem}.rail-card .post-card__dek{font-size:.85rem;line-height:1.5;margin-bottom:.2rem}.six-desks-section{margin-top:0;padding-top:0;padding-bottom:1rem;border-top:1px solid var(--rule-strong)}.desk-cell{padding:1.25rem;min-height:200px;transition:background-color 150ms ease;cursor:pointer}.desk-cell:hover{background-color:var(--ink-1)}.desk-cell__latest-list{list-style:none;padding:0;margin-top:1rem}.desk-cell .latest-item{margin:0;border-bottom:1px solid var(--rule-weak)}.desk-cell .latest-item:last-child{border-bottom:none}.desk-cell .latest-item a{display:flex;align-items:flex-start;gap:.55rem;font-family:var(--font-body);font-size:.95rem;color:var(--paper-0);text-decoration:none;line-height:1.4;padding:.55rem .2rem;transition:color 140ms ease,background-color 140ms ease,transform 140ms ease}.desk-cell .latest-item a::before{content:"▸";color:var(--accent);font-size:.85em;flex-shrink:0;transform:translateY(1px);transition:transform 140ms ease}.desk-cell .latest-item a:hover::before{transform:translate(3px,1px)}.support-strip{padding:2rem var(--gutter-desktop);background-color:var(--ink-2);border-top:1px solid var(--rule-weak);display:flex;align-items:center;justify-content:space-between;gap:2rem}.support-strip__label{font-family:var(--font-mono);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--mute-0)}.single-wrap{max-width:820px;margin:0 auto;padding-top:2.5rem;padding-bottom:4rem}.post-header{margin-bottom:2.5rem}.post-header-meta{display:flex;align-items:center;gap:1rem;margin-bottom:1.25rem;flex-wrap:wrap}.post-header-meta time{font-size:.82rem;color:var(--mute-0)}.post-cat{display:flex;flex-wrap:wrap;gap:.5rem;margin:0}.post-cat a,.post-header-meta time,.read-time{font-family:var(--font-ui)}.post-cat a{font-size:.6rem;font-weight:600;text-transform:uppercase;letter-spacing:.07em;background:rgba(166,28,28,.08);border:1px solid var(--accent-dim);border-radius:3px;padding:.5em .75em;white-space:nowrap;transition:background 150ms,color 150ms}.post-cat a:hover{background:rgba(166,28,28,.22);color:var(--paper-0)}.read-time{font-size:.75rem;color:var(--mute-0);letter-spacing:.02em}.read-time::before{content:"·";margin-right:.4em}.post-title{font-family:var(--font-display);font-size:clamp(2rem,5.5vw,3.5rem);font-weight:900;color:var(--paper-0);letter-spacing:-.03em;line-height:1.1;margin-bottom:1.25rem}.article-header__dek{font-family:var(--font-body);font-style:italic;font-size:1.1rem;line-height:1.55;color:var(--paper-1);margin-bottom:1.5rem;max-width:680px}.post-byline{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:2rem;font-family:var(--font-ui);font-size:.82rem}.post-byline-author{color:var(--mute-0);font-weight:500}.post-byline-author-name{color:inherit}.post-byline-ai-verified,.post-byline-approved{display:inline-flex;align-items:center;gap:.35rem;color:var(--approved);font-weight:600;font-size:.78rem;letter-spacing:.02em}.post-byline-ai-verified{color:var(--ai-verified)}.post-byline-what{color:var(--mute-1);font-size:.75rem;text-decoration:underline;text-underline-offset:2px}.post-byline-what:hover{color:var(--accent)}.translation-notice{margin-top:.75rem;padding:.6rem .9rem;background:rgba(166,28,28,.06);border:1px solid var(--accent-dim);border-radius:3px;font-size:.82rem;color:var(--mute-0);line-height:1.5}.post-cat a{color:var(--accent);text-decoration:none}.translation-notice a{color:var(--paper-0);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:2px}.endcap-factuality a{text-decoration:underline}.translation-notice a:hover{color:var(--accent)}.article-endcap,.post-featured-img{border:1px solid var(--rule-strong);border-radius:8px}.post-featured-img{overflow:hidden;margin-top:2rem}.post-featured-img img{width:100%}.post-featured-img.small-img{text-align:center;background:0 0;border:0;padding:1rem 0}.post-featured-img.small-img img{width:auto;min-width:250px;max-width:320px;max-height:350px;display:block;margin:0 auto;border-radius:8px}.post-featured-img .featured-img-caption{font-size:.75rem;color:var(--mute-1);font-style:italic;text-align:center;padding:.4rem 1rem;margin:0;line-height:1.4}.single-wrap .entry-content{font-family:var(--font-body);font-size:1.1rem;line-height:1.8;color:var(--paper-0);max-width:none;margin:0}.single-wrap .entry-content p{margin-bottom:1.25em}.single-wrap .entry-content h2,.single-wrap .entry-content h3{font-family:var(--font-display);color:var(--paper-0);margin-top:2rem;margin-bottom:.75rem}.single-wrap .entry-content h2{font-size:1.6rem;font-weight:600}.single-wrap .entry-content h3{font-size:1.25rem;font-weight:600}.single-wrap .entry-content a{color:var(--paper-0);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:2px;transition:color 150ms,text-decoration-color 150ms}.article-sources li a:hover,.single-wrap .entry-content a:hover{color:var(--accent);text-decoration-color:var(--accent)}.single-wrap .entry-content ol,.single-wrap .entry-content ul{margin:0 0 1.25em 1.5em;padding-left:.5em}.single-wrap .entry-content li{margin-bottom:.4em}.single-wrap .entry-content blockquote{border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);padding:1rem 1.25rem;margin:1.5rem 0;color:var(--paper-1);font-style:italic}.article-endcap{margin:2.5rem 0 0;padding:1.25rem 1.5rem;background:var(--ink-2)}.article-endcap.has-sources{border-radius:8px 8px 0 0;border-bottom:none;margin-bottom:0;padding-bottom:0}.endcap-rating,.endcap-share{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;padding:.75rem 0}.endcap-rating{padding-top:0}.endcap-share{border-top:1px solid var(--rule-strong)}.endcap-rating-label,.endcap-share-label{font-size:.82rem}.endcap-factuality,.endcap-rating-label,.endcap-share-label{font-family:var(--font-ui);color:var(--mute-0)}.endcap-btn svg,.endcap-rating-label,.endcap-share-label{flex-shrink:0}.endcap-stars{display:flex;gap:.15rem}.endcap-star{background:0 0;border:0;color:var(--mute-0);cursor:pointer;padding:12px;line-height:1;transition:color 150ms ease,transform 150ms ease}.endcap-star:hover{color:var(--accent);transform:scale(1.15)}.endcap-star.is-filled,.endcap-star.is-filled svg{color:var(--accent);fill:var(--accent)}.endcap-rating.is-rated .endcap-star{cursor:default}.endcap-rating-thanks{color:var(--paper-1);font-size:.85rem;font-style:italic}.endcap-share-buttons{display:flex;gap:.4rem;flex-wrap:wrap}.endcap-btn{display:inline-flex;align-items:center;gap:.35rem;background:0 0;border:1px solid var(--rule-strong);border-radius:20px;color:var(--mute-0);padding:.4rem .75rem;font-family:var(--font-ui);font-size:.75rem;text-decoration:none;cursor:pointer;line-height:1;transition:color 150ms ease,border-color 150ms ease,background 150ms ease}.endcap-btn:hover{color:var(--paper-0);border-color:var(--accent);background:rgba(166,28,28,.08)}.endcap-btn.is-copied{color:var(--accent);border-color:var(--accent)}.article-sources h2,.endcap-factuality{padding:.85rem 0 0;border-top:1px solid var(--rule-strong)}.endcap-factuality{margin:0;text-align:center;font-size:.78rem}.endcap-factuality a{color:var(--mute-0);text-underline-offset:2px;transition:color 150ms ease}.endcap-factuality a:hover,.page-article .entry-content a:hover,.related-card-title a:hover{color:var(--accent)}.article-sources{background:var(--ink-2);border:1px solid var(--rule-strong);border-top:none;border-radius:0 0 8px 8px;padding:.85rem 1rem 1rem}.article-sources h2{font-family:var(--font-ui);font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--mute-0);margin:0 0 .6rem;line-height:1}.article-sources h2::before{content:none}.article-sources ol,.article-sources ul{list-style:none;margin:0;padding:0}.article-sources li{font-family:var(--font-body);font-size:.88rem;line-height:1.5;color:var(--mute-0);padding:.3rem 0;border-bottom:1px solid var(--rule-weak);margin-bottom:0;word-break:break-word}.article-sources li:last-child{border-bottom:none}.article-sources li a{color:var(--mute-0);text-decoration:underline;text-decoration-color:var(--rule-weak);text-underline-offset:2px;transition:color 150ms,text-decoration-color 150ms}.article-sources p{font-family:var(--font-body);font-size:.88rem;color:var(--mute-0);margin:0 0 .75rem}.related-posts{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--rule-strong)}.related-title{margin-top:0;font-family:var(--font-ui);font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--mute-0);margin-bottom:1.5rem}.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem}.related-card{display:flex;flex-direction:column;border:1px solid var(--rule-strong);border-radius:6px;overflow:hidden;transition:border-color 150ms;background:var(--ink-1)}.related-card:hover{border-color:var(--accent)}.related-card-img{display:block}.related-card-img img{width:100%;height:150px;object-fit:cover;display:block}.related-card-body{padding:.9rem 1rem;flex:1}.related-card-cat{font-family:var(--font-ui);font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);display:block;margin-bottom:.35rem}.related-card-title{font-family:var(--font-display);font-size:.95rem;font-weight:600;line-height:1.4;margin:0}.related-card-title a{color:var(--paper-0);text-decoration:none}.page-article{max-width:760px;margin:1rem auto 2.5rem}.page-article .article-header{padding:14px 0 1rem;margin-bottom:1.5rem;border-bottom:1px solid var(--rule-weak)}.page-article .article-header h1{font-family:var(--font-display);font-size:2.2rem;font-weight:500;line-height:1.15;color:var(--paper-0)}.page-article .entry-content{font-size:1.05rem;line-height:1.75;max-width:none;color:var(--paper-0)}.page-article .entry-content h2,.page-article .entry-content h3{margin-top:2rem;margin-bottom:.75rem}.page-article .entry-content h2{font-size:1.5rem}.page-article .entry-content h3{font-size:1.25rem}.page-article .entry-content a{color:var(--paper-0);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}.page-article .entry-content>p:first-child::first-letter{font-family:inherit;font-size:inherit;float:none;line-height:inherit;margin:0;color:inherit}.support-page .tip-jar{max-width:500px;margin:2rem auto}.coffee-breakdown{margin-top:1.5rem;font-family:var(--font-body);font-size:.9rem;color:var(--mute-0)}.contact-blocks-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin:2rem 0}.contact-block{padding:1.5rem;border:1px solid var(--rule-weak);border-radius:2px}.contact-block__heading{font-family:var(--font-mono);font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--accent);margin-bottom:.75rem}.contact-block__email{font-family:var(--font-ui);font-size:1rem;color:var(--paper-0);word-break:break-word}.contact-block__note{font-family:var(--font-mono);font-size:12px;color:var(--paper-1);margin-top:.5rem;line-height:1.5}.contact-form{max-width:600px;margin:2rem auto}.contact-form__group{margin-bottom:1rem}.contact-form label,.contact-form__submit{font-family:var(--font-mono);text-transform:uppercase}.contact-form label{display:block;font-size:12px;letter-spacing:1.3px;color:var(--paper-1);margin-bottom:.4rem}.contact-form input,.contact-form textarea{width:100%;padding:8px 12px;background-color:var(--ink-2);border:1px solid var(--rule-strong);color:var(--paper-0);font-family:var(--font-body);font-size:.95rem;border-radius:2px}.contact-form textarea{min-height:150px;resize:vertical}.contact-form__submit{padding:13px 20px;background-color:transparent;color:var(--paper-0);font-family:'JetBrains Mono',ui-monospace,monospace;font-size:14px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--paper-0);border-radius:2px;cursor:pointer;transition:background-color 150ms ease,color 150ms ease,transform 100ms ease}.contact-form__submit:hover,.contact-form__submit:focus-visible{background-color:var(--paper-0);color:var(--ink-0);transform:translateY(-1px);outline:none}@media (prefers-reduced-motion:reduce){.contact-form__submit{transition:background-color 150ms ease,color 150ms ease}.contact-form__submit:hover,.contact-form__submit:focus-visible{transform:none}}.archive-header{padding:14px 0 1rem;border-bottom:1px solid var(--rule-strong);margin-bottom:2rem}.archive-header__title{font-family:var(--font-display);font-size:2rem;font-weight:500}.archive-wrap{padding-bottom:16px}.archive-body{display:flex;gap:2rem}.cat-sidebar{width:220px;flex-shrink:0}.archive-content{flex:1;min-width:0;transition:opacity 120ms ease}.posts-grid .post-card{height:100%;display:flex;flex-direction:column;padding-top:0;padding-bottom:0}.posts-grid .post-card__headline{margin-bottom:.35rem}.posts-grid .post-card__dek{flex:0 0 auto}.no-posts{grid-column:1/-1;text-align:center;color:var(--mute-0);padding:4rem 0}.cat-sidebar-search{margin-bottom:1.25rem;padding-bottom:1rem}.cat-sidebar-search-field{width:100%;padding:.55rem .65rem;font-family:var(--font-ui);font-size:16px;color:var(--paper-0);background-color:var(--ink-2);border:1px solid var(--rule-strong);border-radius:2px;outline:0;transition:border-color 120ms ease}.cat-sidebar-search-field:focus{border-color:var(--accent)}.cat-sidebar-search-field::placeholder{color:var(--paper-1);opacity:.9}.cat-sidebar-group,.cat-sidebar-solo{border-bottom:1px solid var(--rule-weak)}.cat-sidebar-group{margin:0}.cat-sidebar-header{display:flex;align-items:center;justify-content:space-between}.cat-sidebar-parent-link,.cat-sidebar-solo{display:flex;align-items:baseline;gap:.35rem;font-family:var(--font-ui);font-size:12px;font-weight:600;letter-spacing:0;text-transform:uppercase;color:var(--paper-1);text-decoration:none;padding:.55rem 0;transition:color 120ms ease}.cat-sidebar-parent-link{flex:1 1 auto;min-width:0}.cat-sidebar-solo{padding-right:22px}.cat-sidebar-children li a:hover,.cat-sidebar-parent-link:hover,.cat-sidebar-solo:hover{color:var(--paper-0)}.cat-sidebar-parent-link.active,.cat-sidebar-solo.active{color:var(--accent)}.cat-sidebar-chevron-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:0 0;border:1px solid transparent;border-radius:2px;color:var(--mute-0);cursor:pointer;transition:background-color 120ms,border-color 120ms,color 120ms;flex-shrink:0}.cat-sidebar-chevron-btn:hover{background-color:var(--ink-1);border-color:var(--rule-strong);color:var(--paper-0)}.cat-sidebar-chevron{display:inline-block;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid currentColor;transition:transform 180ms ease}.cat-sidebar-chevron-btn[aria-expanded=false] .cat-sidebar-chevron{transform:rotate(-90deg)}.cat-sidebar-children{list-style:none;padding-left:.75rem;margin:0;overflow:hidden;max-height:0}.cat-sidebar-children li a{display:flex;padding:.35rem 0;font-size:14px;transition:color 120ms ease}.cat-sidebar-children li a::before{content:"▸";color:var(--accent);font-size:.85em;margin-right:.4rem;flex-shrink:0;line-height:1}.cat-sidebar-children li a.active{color:var(--accent);font-weight:600}.cat-sidebar-count{font-family:var(--font-ui);font-size:11px;font-variant-numeric:tabular-nums;opacity:.7;margin-left:auto;padding-left:.3rem}.cat-sidebar-children li a,.cat-sidebar-clear{align-items:center;font-family:var(--font-ui);color:var(--paper-1);text-decoration:none}.cat-sidebar-clear{display:inline-flex;gap:.35rem;margin-top:1rem;padding:.4rem .85rem;font-size:13px;font-weight:500;background-color:var(--ink-1);border:1px dashed var(--rule-strong);border-radius:999px;transition:color 120ms,border-color 120ms;cursor:pointer}.cat-sidebar-clear svg{opacity:.7}.cat-sidebar-clear:hover{color:var(--accent);border-color:var(--accent)}.cat-sidebar-clear:hover svg{opacity:1}.cat-sidebar-overlay,.cat-sidebar-toggle{display:none}.article-list+.navigation.pagination,.article-list+.pagination{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--rule-strong)}.navigation.pagination{padding-top:16px}.navigation.pagination .nav-links,.pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;font-family:var(--font-ui);font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.04em}.navigation.pagination a.page-numbers,.navigation.pagination span.page-numbers,.pagination a.page-numbers,.pagination span.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:40px;padding:0 12px;color:var(--paper-1);text-decoration:none;border:1px solid var(--rule-strong);background-color:var(--ink-0);transition:background-color 120ms ease,color 120ms ease,border-color 120ms ease}.navigation.pagination a.page-numbers:hover,.pagination a.page-numbers:hover{color:var(--paper-0);border-color:var(--accent);background-color:var(--ink-1)}.navigation.pagination span.page-numbers.current,.pagination span.page-numbers.current{color:var(--accent);border-color:var(--accent);background-color:var(--ink-1)}.navigation.pagination .page-numbers.dots,.pagination .page-numbers.dots{border-color:transparent;background-color:transparent}.search-form{display:flex;gap:.5rem;margin-bottom:2rem}.search-form input[type=search]{flex:1;padding:8px 14px;background-color:var(--ink-2);border:1px solid var(--rule-strong);color:var(--paper-0);font-family:var(--font-body);font-size:1rem;border-radius:2px}.error-404{padding:4rem 0;text-align:center}.error-404__code{font-family:var(--font-mono);font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--accent);margin-bottom:1rem}.error-404__heading{font-family:var(--font-display);font-size:3rem;font-weight:500;margin-bottom:1rem}.cluster-frame{width:100%;min-height:600px;border:0;border-top:1px solid var(--rule-weak)}

/* ── mobile.css ────────────────────────────────────────────────── */
@media (max-width:640px){html{font-size:18.5px}.post-card__date,.post-card__meta{font-size:13px}.post-card .post-cat a{font-size:.65rem}.post-byline{font-size:14px}.desk-header__kicker,.post-byline-what{font-size:12px}.lang-switcher{gap:4px}.lang-switcher a{font-size:11px;padding:2px 5px;letter-spacing:.8px}.footer-note{font-size:12px}.cat-sidebar-parent-link,.cat-sidebar-solo{font-size:13px;letter-spacing:.04em}.cat-sidebar-children li a{font-size:15px}.cat-sidebar-count{font-size:13px}.cat-sidebar-clear{font-size:14px}.cat-sidebar-search-field{font-size:16px}#nav-burger{display:block;font-size:18px;padding:2px 6px}.nav-burger__icon{font-size:18px;line-height:1}body:has(#nav-burger[aria-expanded=true]) .cat-sidebar-toggle{display:none!important}.primary-nav{display:none;flex-direction:column;gap:0;padding:0;background-color:var(--ink-0);position:fixed;top:0;left:0;right:0;bottom:0;overflow-y:auto;z-index:90;border:0}.primary-nav-link{display:block;padding:1.1rem 1.5rem;border-bottom:1px solid var(--rule-weak);letter-spacing:1.3px;font-size:15px}.masthead{padding:14px 1rem}.masthead__wordmark{font-size:2.2rem;letter-spacing:-1px}.masthead__tagline{font-size:14px;margin-top:6px}.masthead__flanks{display:none}.site-header-inner{height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 1rem}.util-strip{padding:8px 1rem;overflow-x:auto;flex-wrap:nowrap;gap:12px;font-size:11px;letter-spacing:1.1px}.util-strip__left,.util-strip__right{gap:12px}.lead-article h1{font-size:1.6rem}.lead-article__body{max-height:11em;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(to bottom,#000 72%,transparent 100%);mask-image:linear-gradient(to bottom,#000 72%,transparent 100%)}.footer-columns{grid-template-columns:1fr;gap:1.5rem}.footer-inline{flex-direction:column;align-items:center;gap:.85rem;text-align:center}.footer-inline__nav{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:12px;width:100%;padding:0;margin:0;overflow-x:auto}.footer-inline__nav>a{font-size:13px;padding:2px 0;white-space:nowrap;letter-spacing:.2px;flex-shrink:0}.site-footer{padding-left:.5rem;padding-right:.5rem}.article-list{grid-template-columns:1fr;gap:1.5rem}.archive-body{display:block}.archive-body .posts-grid{grid-template-columns:1fr}.navigation.pagination,.pagination{padding-bottom:16px}.navigation.pagination .nav-links,.pagination .nav-links{gap:4px;flex-wrap:nowrap}.navigation.pagination a.page-numbers,.navigation.pagination span.page-numbers,.pagination a.page-numbers,.pagination span.page-numbers{min-width:36px;height:36px;padding:0 8px;font-size:13px}.archive-header{margin-bottom:0;border-bottom:none}.desk-cell{padding-bottom:0}.cat-sidebar{display:none;position:fixed;top:0;left:0;width:280px;height:100vh;background-color:var(--ink-0);border-right:1px solid var(--rule-strong);z-index:1000;padding:1.5rem 1.25rem;overflow-y:auto}.cat-sidebar-overlay.open,.cat-sidebar.open{display:block}.cat-sidebar-overlay{display:none;position:fixed;inset:0;background-color:var(--overlay-scrim);z-index:999}.cat-sidebar-toggle{position:fixed;bottom:1.25rem;right:1.25rem;z-index:998;display:flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;background-color:var(--ink-2);border:1px solid var(--rule-strong);border-radius:50%;color:var(--paper-0);cursor:pointer;transition:background-color 150ms ease,border-color 150ms ease,transform 100ms ease}.cat-sidebar-toggle:hover,.cat-sidebar-toggle:focus-visible{background-color:var(--accent);border-color:var(--accent);color:var(--paper-0);outline:none}.cat-sidebar-toggle:active{transform:scale(.92)}.cat-sidebar-toggle svg{width:20px;height:20px;opacity:.92}.contact-blocks-grid,.related-articles__grid,.related-grid{grid-template-columns:1fr}.site-container{padding:0 1rem}.support-strip{flex-direction:column;padding:1.5rem 1rem;text-align:center}.masthead-mobile-row{display:flex!important;align-items:center;justify-content:space-between;padding:10px 1rem;min-height:54px;border-bottom:1px solid var(--rule-weak)}.masthead-mobile-wordmark{font-family:var(--font-display);font-size:1.65rem;font-weight:500;color:var(--paper-0);line-height:1;text-decoration:none}.masthead-mobile-wordmark em{font-style:italic;color:var(--accent)}.masthead-mobile-wordmark:hover{color:var(--paper-0)}.masthead-desktop{display:none}}@media (min-width:641px){.masthead-mobile-row{display:none}}

/* ── ui-fixes-20260424.css ────────────────────────────────────────────────── */
/* ui-fixes-20260424.css — iter-5 (2026-04-24 21:30)
 *
 * New in iter-5:
 *  - overflow-x: clip on html, body. Contains absolute-positioned children
 *    (like .glossary-tooltip) that would otherwise push document scrollWidth
 *    past viewport and trigger horizontal page scroll. Verified root cause
 *    via Playwright DOM inspection: .glossary-tooltip width 200px, centered
 *    on anchor with translateX(-50%); lands 6-9px past right edge when
 *    anchor is near viewport right. Using `clip` (not `hidden`) so
 *    position: sticky isn't broken elsewhere.
 *  - .glossary-tooltip scoped width on mobile so it never exceeds viewport
 *    even where overflow-x:clip isn't supported (iOS < 15.4).
 */

/* Horizontal overflow containment — fixes glossary-tooltip bleed. */
html, body {
    overflow-x: clip;
}

/* Glossary tooltip: scale down + viewport-safe width on mobile.
   Also protects against left-edge overflow if anchor is near viewport left. */
@media (max-width: 640px) {
    .glossary-tooltip {
        min-width: 0;
        max-width: calc(100vw - 2rem);
        width: max-content;
    }
}

/* ── Base card bg ────────────────────────────────────────────────────────── */
/* Promoted from a hard-coded #0d0d0d to --ink-1 (#0d0d13). Same darkness,
   tiny cool cast keeps the No-True-Black Rule happy. */
.post-card,
.lead-article,
.article-sources,
.article-endcap,
.tip-jar {
    background: var(--ink-1);
}

/* Desk-cell: kill hover flash + clickable cursor (wrapper isn't a link). */
.desk-cell {
    cursor: default;
}
.desk-cell:hover {
    background-color: var(--ink-0);
}
.tip-jar {
    padding: 0;
}

/* TTS progress: click-to-seek + 16px touch hit area via padding trick. */
.tts-bar__progress {
    cursor: pointer;
    height: 6px;
    padding: 5px 0;
    background-clip: content-box;
    box-sizing: content-box;
}
.tts-bar__progress-fill {
    height: 6px;
}

/* Mobile lead↔rail gap */
@media (max-width: 900px) {
    .content-grid {
        row-gap: 1.25rem;
    }
}

@media (max-width: 640px) {
    .rail-col {
        margin-top: 1.25rem;
    }

    /* Mobile contrast bump: was #131313; promoted to --ink-2 (#17171f),
       which is one tonal step lighter than --ink-1 and reads more
       distinctly against --ink-0 on small screens. */
    .post-card,
    .lead-article,
    .article-sources,
    .article-endcap,
    .tip-jar {
        background: var(--ink-2);
    }
    /* Version-toggle: wrap + per-button word-break. Prevents clipping at
       ≤390px when 3+ versions have long labels (e.g. Peter Scully). */
    .version-toggle {
        flex-wrap: wrap;
        row-gap: 6px;
    }
    .version-btn {
        max-width: 100%;
        white-space: normal;
        word-break: break-word;
        line-height: 1.2;
    }
}

/* ── Hero visibility pass (2026-04-24) ──────────────────────────────────────
 * Goal: get image + title + first body line above the 1440×900 fold on
 * the home front page. Levers applied:
 *   2. Header shrink, masthead 44/24 → 14/12, util-strip 10 → 6,
 *      primary-nav 14 → 10. Saves ~80px header height.
 *   3. Lead date breathing room, meta padding-top 1.5rem → 0.6rem.
 *      Saves ~14px above the title.
 * Desktop-only (≥641px); mobile masthead row is independent and unchanged. */
@media (min-width: 641px) {
    .masthead {
        padding: 14px var(--gutter-desktop) 12px;
    }
    .util-strip {
        padding: 6px var(--gutter-desktop);
    }
    .primary-nav {
        padding: 10px var(--gutter-desktop);
    }
}
.lead-article__meta {
    padding: 0.6rem 1.5rem 0;
}

/* ── Audit pass (2026-04-28) ────────────────────────────────────────────────
 *  /impeccable audit findings; see /tmp/aot-audit/AUDIT-REPORT.md and TODO
 *  ~/TODO/2026-04-28-23-27-impeccable-audit-fixes.md. CSS-only fixes batched
 *  here so they're trivial to roll back if a regression shows up.
 */

/* P1: mobile hamburger touch target. components.css sizes #nav-burger at
   ~30x22; mobile.css narrows it to ~28x22. WCAG 2.5.8 AA wants ≥24x24,
   AAA wants 44x44. Pad up. .masthead-mobile-row is min-height:54px so a
   44x44 hit area fits without reflow. */
@media (max-width: 900px) {
    #nav-burger {
        padding: 12px;
        font-size: 22px;       /* restore icon to readable size */
        line-height: 20px;
        min-width: 44px;
        min-height: 44px;
    }
}

/* P2: mobile language-switcher chips. components.css 12px/3-7px → mobile
   11px/2-5px. WCAG 2.5.8 AA = 24x24 floor. Bring chips to ~36x32 by
   padding up; row is 4 two-letter labels, plenty of horizontal room. */
@media (max-width: 900px) {
    .lang-switcher a {
        padding: 8px 10px;
        font-size: 12px;
        min-height: 32px;
        min-width: 32px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

/* P2: article body line measure. .single-wrap is capped at 820px in
   pages.css and .entry-content inherits the full 820px width, at 19.25px
   Newsreader that's roughly 85ch, exceeding the 65-75ch cap in DESIGN.md.
   Cap text-block elements (paragraph/list/heading) at 70ch while leaving
   figure/img/iframe/blockquote unconstrained so inline media still spans
   the article column. */
.entry-content > p,
.entry-content > ul,
.entry-content > ol,
.entry-content > h2,
.entry-content > h3,
.entry-content > h4 {
    max-width: 70ch;
}

/* P2: inline footnote citation hit area. Markup is <sup><a>[s]</a></sup>
   inside paragraphs; default link is 15x16. Pad the anchor without
   shifting line height, negative margin compensates so paragraph rhythm
   stays intact. Scoped via :where() so specificity stays at zero and the
   existing entry-content/lead-article link rules still win where they
   apply. Cover both the article single body (.entry-content) and the
   home-page lead body (.lead-article__body) since both render citations. */
:where(.entry-content, .lead-article__body) sup > a {
    padding: 6px 4px;
    margin: -6px -2px;
    border-radius: 2px;
}

/* User report 2026-04-29: util-strip date wraps to two lines on mobile in
   every language because "WEDNESDAY · APRIL 29, 2026" / "MERCREDI · AVRIL
   29, 2026" / "MIÉRCOLES · ABRIL 29, 2026" / "MITTWOCH · APRIL 29, 2026"
   doesn't fit alongside the four lang chips at narrow widths. Header.php
   now emits two date spans (full + compact); show only the appropriate
   one per viewport. Both spans get nowrap as a hard belt: even with the
   compact format we never want a wrap line in the chrome. */
.util-date--compact { display: none; }
.util-date { white-space: nowrap; }
@media (max-width: 600px) {
    .util-date--full { display: none; }
    .util-date--compact { display: inline; }
}

/* P3: lift 404.php inline styles into a real cascade. The body
   paragraph and CTA used inline `style=...` attrs; same selectors here
   keep the visual identical and let theming changes apply. */
.error-404__body {
    font-family: var(--font-body);
    color: var(--mute-0);
    max-width: 560px;
    margin: 1.25rem auto 0;
    line-height: 1.6;
}
.error-404__cta {
    margin-top: 1.5rem;
}
.error-404__pill {
    display: inline-flex;
}

/* P2: footer brand "of" em was rendering at #a61c1c on #050507 (2.72:1),
   sub-3:1 large-text threshold. The masthead em (huge display, spec-allowed)
   stays crimson; the footer instance at 1.4rem reads as small body and
   loses brand legibility. Switch to --paper-1 (aged-newsprint, AAA on
   ink-0), keeps italic editorial voice without the contrast hit. */
.footer-col__brand em {
    color: var(--paper-1);
}