/* ── Fonts (loaded via <link> in HTML head to avoid render-blocking @import) ─ */

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

/* ── Light palette (matches wiki .light / LaTeX whitepaper) ──────── */
:root {
    --bg: #FAFAFA;
    --fg: #1a1a1a;
    --links: #1a5276;
    --inline-code-color: #c7254e;
    --quote-bg: #f5f5f5;
    --quote-border: #dddddd;
    --table-border-color: #d0d0d0;
    --table-header-bg: #f0f0f0;
    --table-alternate-bg: #f8f8f8;
    --rule-color: #333333;
    --heading-color: #1a1a1a;
    --subheading-color: #333333;
    --code-bg: #f5f5f5;
    --code-border: #e0e0e0;
    --muted: #666666;
}

/* ── Dark palette (matches wiki .navy / .coal / .ayu) ────────────── */
@media (prefers-color-scheme: dark) {
    :root {
        --bg: #161923;
        --fg: #c8cdd3;
        --links: #7eb8da;
        --inline-code-color: #e06c75;
        --quote-bg: #1c2028;
        --quote-border: #2a3040;
        --table-border-color: #2a3040;
        --table-header-bg: #1c2028;
        --table-alternate-bg: #181c24;
        --rule-color: #4a5568;
        --heading-color: #e2e8f0;
        --subheading-color: #a0aec0;
        --code-bg: #1c2028;
        --code-border: #2a3040;
        --muted: #8a9199;
    }
}

/* ── Body typography (mirrors .content main in wiki) ─────────────── */
body {
    font-family: 'Source Serif 4', 'STIX Two Text', Georgia, 'Times New Roman', serif;
    font-size: 18px;
    line-height: 1.72;
    letter-spacing: -0.003em;
    font-feature-settings: 'kern' 1, 'liga' 1, 'onum' 1;
    color: var(--fg);
    background: var(--bg);
    min-height: 100vh;
}

.container {
    max-width: 820px;
    margin: 0 auto;
    padding: 3em 1.5em 4em;
}

p {
    margin-bottom: 0.6em;
    text-align: left;
    hyphens: auto;
}

.subtitle {
    font-size: 1.15em;
    color: var(--muted);
    margin-bottom: 0;
}

.lede {
    margin-top: 1.2em;
    font-size: 1.02em;
}

/* ── Headings (sans-serif, like LaTeX \sffamily\bfseries) ────────── */
h1 {
    font-family: 'Inter', 'Helvetica Neue', sans-serif;
    font-weight: 700;
    font-size: 2.4em;
    color: var(--heading-color);
    margin-bottom: 0.15em;
    padding-bottom: 0.35em;
    border-bottom: 1.5px solid var(--rule-color);
    letter-spacing: -0.02em;
    line-height: 1.25;
}

h2 {
    font-family: 'Inter', 'Helvetica Neue', sans-serif;
    font-weight: 600;
    font-size: 1.6em;
    color: var(--heading-color);
    margin-top: 1.8em;
    margin-bottom: 0.25em;
    padding-bottom: 0.25em;
    border-bottom: 0.8px solid var(--rule-color);
    opacity: 0.95;
    letter-spacing: -0.01em;
    line-height: 1.3;
}

h3 {
    font-family: 'Inter', 'Helvetica Neue', sans-serif;
    font-weight: 600;
    font-size: 1.2em;
    color: var(--subheading-color);
    margin-top: 1.4em;
    margin-bottom: 0.2em;
    letter-spacing: -0.005em;
}

h4 {
    font-family: 'Inter', 'Helvetica Neue', sans-serif;
    font-weight: 600;
    font-size: 1.0em;
    color: var(--subheading-color);
    margin-top: 1.1em;
    margin-bottom: 0.15em;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ── Code (monospace) ─────────────────────────────────────────────── */
code {
    font-family: 'JetBrains Mono', 'Consolas', 'Monaco', monospace;
    font-size: 0.82em;
    font-feature-settings: 'liga' 0;
    padding: 0.1em 0.35em;
    border-radius: 3px;
    background-color: var(--code-bg);
    border: 0.5px solid var(--code-border);
    color: var(--inline-code-color);
}

pre {
    font-family: 'JetBrains Mono', 'Consolas', monospace;
    font-size: 0.82em;
    line-height: 1.55;
    padding: 0.9em 1.1em;
    border-radius: 4px;
    background-color: var(--code-bg);
    border: 1px solid var(--code-border);
    overflow-x: auto;
}

pre > code {
    padding: 0;
    border: none;
    background: transparent;
    font-size: inherit;
    color: inherit;
}

/* ── Tables (booktabs-inspired) ───────────────────────────────────── */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 1em 0;
    font-size: 0.92em;
    line-height: 1.5;
}

thead {
    border-top: 2px solid var(--rule-color);
    border-bottom: 1px solid var(--rule-color);
}

th {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.55em 0.7em;
    text-align: left;
    color: var(--subheading-color);
    background: transparent;
}

td {
    padding: 0.5em 0.7em;
    border-bottom: 0.5px solid var(--table-border-color);
    vertical-align: top;
}

tbody tr:last-child {
    border-bottom: 1.5px solid var(--rule-color);
}

tbody tr:nth-child(even) {
    background-color: var(--table-alternate-bg);
}

table code {
    font-size: 0.85em;
    padding: 0.05em 0.25em;
    white-space: nowrap;
}

/* ── Blockquotes ──────────────────────────────────────────────────── */
blockquote {
    border-left: 3px solid var(--links);
    padding: 0.4em 1em;
    margin: 0.8em 0;
    background: var(--quote-bg);
    border-radius: 0 3px 3px 0;
    font-style: italic;
    color: var(--subheading-color);
}

blockquote p {
    margin: 0.3em 0;
}

/* ── Lists ────────────────────────────────────────────────────────── */
ul, ol {
    padding-left: 1.5em;
    margin: 0.4em 0;
}

li {
    margin-bottom: 0.2em;
}

li > p {
    margin: 0.2em 0;
}

li > ul, li > ol {
    margin: 0.1em 0;
}

/* ── Links ────────────────────────────────────────────────────────── */
a {
    color: var(--links);
    text-decoration: none;
    border-bottom: 0.5px solid transparent;
    transition: border-color 0.15s;
}

a:hover {
    border-bottom-color: var(--links);
}

/* ── Strong / emphasis ────────────────────────────────────────────── */
strong {
    font-weight: 650;
    color: var(--heading-color);
}

em {
    font-style: italic;
}

/* ── Horizontal rule ──────────────────────────────────────────────── */
hr {
    border: none;
    border-top: 0.8px solid var(--rule-color);
    margin: 2em 0;
    opacity: 0.3;
}

/* ── Footer ───────────────────────────────────────────────────────── */
footer {
    margin-top: 3em;
    padding-top: 1.2em;
    border-top: 0.8px solid var(--rule-color);
    font-family: 'Inter', sans-serif;
    font-size: 0.85em;
    color: var(--muted);
    opacity: 0.8;
}

footer a { color: var(--muted); }
footer a:hover { color: var(--links); border-bottom-color: var(--links); }

/* ── Status badges ────────────────────────────────────────────────── */
.badge {
    font-family: 'Inter', sans-serif;
    font-size: 0.7em;
    font-weight: 600;
    padding: 0.15em 0.5em;
    border-radius: 3px;
    vertical-align: middle;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.badge-wiki {
    background: var(--links);
    color: var(--bg);
}

.badge-repo {
    background: var(--code-bg);
    border: 0.5px solid var(--code-border);
    color: var(--muted);
}

a:has(.badge) {
    border-bottom: none !important;
}

/* ── Print ────────────────────────────────────────────────────────── */
@media print {
    body { font-size: 10.5pt; }
    .container { max-width: none; padding: 1em; }
    h1 { font-size: 18pt; }
    h2 { font-size: 14pt; }
    pre { font-size: 8.5pt; }
    table { font-size: 9pt; }
}