/* GENERATED by scripts/workflows/emit_tokens.py — per-book theme override.
   Theme: paper. Edit scripts/workflows/templates/themes/paper/tokens.json, not this file. */
:root {
    /* Brand */
    --wedgwood: #1a3a7a;
    --wedgwood-light: #2340a0;
    --wedgwood-deep: #12285a;
    --focus-blue: #2340a0;

    /* Surfaces */
    --parchment: #fdfcf8;
    --ivory: #f7f5ed;
    --pure-white: #ffffff;
    --warm-sand: #f5f3ea;
    --dark-surface: #1a1a1a;
    --deep-dark: #0a0a0a;

    /* Ink (warm ramp) */
    --ink-near-black: #0a0a0a;
    --ink-charcoal: #1a1a1a;
    --ink-olive: #333333;
    --ink-stone: #707070;
    --ink-warm-silver: #a0a0a0;
    --ink-on-dark: #fdfcf8;
    --ink-on-accent: #fdfcf8;
    --link-on-dark: var(--wedgwood-light);

    /* Borders & rings */
    --border-cream: rgba(20, 20, 20, 0.10);
    --border-warm: rgba(20, 20, 20, 0.14);
    --border-soft: rgba(20, 20, 20, 0.10);
    --border-dark: #0a0a0a;
    --ring-warm: rgba(20, 20, 20, 0.14);
    --ring-deep: rgba(20, 20, 20, 0.35);

    /* Tag tints — pre-blended Wedgwood over parchment */
    --tag-bg: #dde3ef;
    --tag-bg-strong: #c3cee4;

    /* Shadows */
    --whisper-shadow: 0 1px 2px rgba(20, 20, 20, 0.04);

    /* Spacing scale */
    --xxs: 4px;
    --xs: 8px;
    --sm: 12px;
    --md: 16px;
    --lg: 24px;
    --xl: 32px;
    --xxl: 48px;
    --section: 72px;

    /* Radius scale */
    --radius-tag: 0;
    --radius-sm: 0;
    --radius-md: 0;
    --radius-lg: 0;
    --radius-xl: 0;
    --radius-pill: 9999px;

    /* Type stacks */
    --font-serif: "IBM Plex Sans", "Inter", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
    --font-sans: "IBM Plex Sans", "Inter", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    /* Legacy aliases for site-shared classes */
    --primary-color: var(--ink-near-black);
    --secondary-color: var(--wedgwood);
    --accent-color: var(--wedgwood);
    --bg-light: var(--parchment);
    --bg-highlight: var(--warm-sand);
    --bg-insight: var(--ivory);
    --border-color: var(--border-cream);
}

[data-theme="dark"] {
    --wedgwood: #7fa0d8;
    --wedgwood-light: #a3bce8;
    --wedgwood-deep: #5a7cc0;
    --ink-on-accent: #0f1420;
    --parchment: #121210;
    --ivory: #1a1a18;
    --pure-white: #1f1f1d;
    --warm-sand: #26241d;
    --dark-surface: #26241d;
    --deep-dark: #0a0a0a;
    --ink-near-black: #f5f3ea;
    --ink-charcoal: #d8d5c8;
    --ink-olive: #b8b5a8;
    --ink-stone: #8a8880;
    --border-cream: rgba(255, 255, 255, 0.08);
    --border-warm: rgba(255, 255, 255, 0.12);
    --border-soft: rgba(255, 255, 255, 0.08);
    --ring-warm: rgba(255, 255, 255, 0.14);
    --ring-deep: rgba(255, 255, 255, 0.24);
    --tag-bg: #1e2a44;
}

/* layout layer — themes/paper/layout.css */
/* ===========================================================
   academic-paper — reading-page layout tier (OD-adoption)

   Redesigns the reading page to match the identity of the
   academic-paper OD deck (.claude/skills/deck-paper/
   example.html): a print-journal article, not a colored-card
   textbook page. Signature moves lifted from the deck — centered
   title framed by a heavy rule + hairline rule with an italic
   small-caps kicker above it, hairline-ruled "theorem" boxes
   instead of tinted cards, and booktabs tables (heavy top/bottom
   rule, one hairline midrule, zero vertical rules).

   Cascade note: this file is appended to the compiled theme.css,
   which loads AFTER style-bookshelf.css (see skeleton.html), so
   an equal-specificity selector here wins by source order alone.
   Every box selector below is prefixed `.main-content` specifically
   so it ties (rather than loses to) the base file's own
   `[data-theme="dark"] .foo` overrides on specificity — no
   `[data-theme="dark"]` duplicates or `!important` needed anywhere,
   including on `.learning-objectives`'s hardcoded orange
   border-left-color (style-bookshelf.css:394): a plain
   `.main-content .learning-objectives` already outranks it.
   =========================================================== */

/* Article column: STOCK bookshelf width (user call, 2026-07-22 — no
   per-theme max-width narrowing; the base .container measure is the
   house standard for every theme). */

/* ---- Titlepage: kicker, heavy rule, title, hairline rule ----
   All three live on the h1 itself (no separate DOM nodes to hang
   them on): ::before is the kicker, its border-bottom doubles as
   the heavy navy rule, and h1's own border-bottom is the closing
   hairline. */
.main-content > h1 {
    text-align: center;
    padding-bottom: var(--xl);
    margin-top: var(--xl);
    margin-bottom: var(--xxl);
    border-bottom: 1px solid var(--border-soft);
}
.main-content > h1 a {
    color: inherit;
    text-decoration: none;
}
.main-content > h1::before {
    content: "bookSHelf \00b7 Course Notes";
    display: block;
    font-family: Georgia, "Iowan Old Style", "Palatino Linotype", "Book Antiqua", serif;
    font-style: italic;
    font-variant: small-caps;
    font-weight: 400;
    letter-spacing: 0.1em;
    font-size: calc(13px * var(--reader-font-scale, 1));
    color: var(--ink-stone);
    padding-bottom: var(--md);
    margin-bottom: var(--lg);
    border-bottom: 3px solid var(--accent-color);
}

/* ---- Lede: the first paragraph of the article reads larger ---- */
.main-content > p:first-of-type {
    font-size: calc(19px * var(--reader-font-scale, 1));
    line-height: 1.7;
    color: var(--ink-charcoal);
}

/* ---- Academic box family: definition / theorem / example / problem /
   collaborative-exercise / problem-set — from tinted rounded cards with a
   colored left strip to hairline-framed academic boxes on their own sheet
   of paper, the deck's `.figure` device. Only chrome changes here
   (border/bg/radius/shadow — `border` resets the shorthand's border-left
   sub-property too, so the 6px strip is gone in one declaration); padding,
   margin and type sizing stay the base rhythm.
   context-pause / insight-note / key-terminology are deliberately NOT in
   this family (user call, 2026-07-22): they keep the bookSHelf house
   tints, but move to a top rule instead of the left strip — see the
   dedicated block below, "keep the top border, not the left border". */
.main-content .definition,
.main-content .theorem,
.main-content .example,
.main-content .problem,
.main-content .collaborative-exercise,
.main-content .problem-set {
    background: var(--pure-white);
    border: 1px solid var(--border-soft);
    border-radius: 0;
    box-shadow: none;
}
/* Problem entries inside a problem-set stay borderless DIVIDERS. The base
   `.problem-set .problem` reset only TIES the box rule above on specificity
   and this file loads later, so the box border was winning — every problem
   rendered as its own hairline box, a lattice inside the set (user report
   2026-07-22). Explicit higher-specificity reset, mirroring the base look. */
.main-content .problem-set .problem {
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--border-soft);
}
.main-content .problem-set .problem:last-child {
    border-bottom: 0;
}

/* Box titles read like numbered theorem/figure labels: small-caps,
   bold, letterspaced, on their own hairline rule. */
.main-content .definition-title,
.main-content .theorem-title,
.main-content .example-title {
    font-variant: small-caps;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: none;
    color: var(--accent-color);
    border-bottom: 1px solid var(--border-soft);
    padding-bottom: var(--xs);
}
.main-content .collaborative-exercise::before {
    font-variant: small-caps;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--accent-color);
    border-bottom: 1px solid var(--border-soft);
    padding-bottom: var(--xs);
}

/* `.callout` — an inline aside with no base chrome at all. Treated as
   the deck's `.abstract`: hairline rules top and bottom, italic, no
   full box — a marginal remark rather than another numbered block. */
.main-content .callout {
    border-top: 1px solid var(--border-soft);
    border-bottom: 1px solid var(--border-soft);
    padding: var(--md) 0;
    margin: var(--xl) 0;
    font-style: italic;
    color: var(--ink-charcoal);
}

/* ---- learning-objectives: house tint + burnt-orange TOP rule (same
   treatment as the callout family — user call 2026-07-22); the left
   strip and rounded corner go, the color family stays. */
.main-content .learning-objectives {
    border-left: 0;
    border-radius: 0;
    border-top: 2px solid #c97a2c;
}
[data-theme="dark"] .main-content .learning-objectives {
    border-top-color: #e09a55;
}
.main-content .learning-objectives > strong:first-child {
    font-variant: small-caps;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--accent-color);
}

/* ---- Solutions: a plain unruled proof, not a warm-sand pill. No
   border-top — the hairline drew a divider between a problem and its
   own solution (user call, 2026-07-22); the small-caps accent summary
   is the only marker. ---- */
.main-content details.solution {
    background: transparent;
    border: 0;
    border-radius: 0;
}
.main-content details.solution summary {
    background: transparent;
    font-variant: small-caps;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--accent-color);
}
.main-content .solution-content {
    background: transparent;
    /* Left padding clears the base's 4px inset accent rail on
       details.solution[open] — at 0 the rail overlapped the text. */
    padding: var(--md) var(--md) var(--sm) var(--lg);
}

/* ---- Data tables: academic booktabs — heavy top/bottom rule, one
   hairline midrule under the header, never a vertical line. ---- */
.main-content .data-table {
    border-top: 2px solid var(--accent-color);
    border-bottom: 2px solid var(--accent-color);
}
.main-content .data-table th,
.main-content .data-table td {
    border: 0;
}
.main-content .data-table thead th {
    border-bottom: 1px solid var(--ink-near-black);
}
.main-content .data-table caption {
    text-align: center;
    font-style: italic;
    font-family: Georgia, "Iowan Old Style", "Palatino Linotype", "Book Antiqua", serif;
}

/* ---- context-pause / insight-note / key-terminology: house TINTS with an
   academic TOP rule in each type's own color (user call, 2026-07-22 —
   "keep the top border, not the left border"): the tinted background keeps
   the callout family color-coded, the accent-top rule keeps the deck's
   ruled-box grammar, and the house 6px left strip goes. Colors mirror the
   base strip palette (light / dark pairs from style-bookshelf.css). ---- */
.main-content .context-pause,
.main-content .insight-note,
.main-content .key-terminology {
    border-left: 0;
}
.main-content .context-pause { border-top: 2px solid #b8842c; }
.main-content .insight-note { border-top: 2px solid #4d7e7c; }
.main-content .key-terminology { border-top: 2px solid #3e6b40; }
[data-theme="dark"] .main-content .context-pause { border-top-color: #d4a35a; }
[data-theme="dark"] .main-content .insight-note { border-top-color: #7aabaa; }
[data-theme="dark"] .main-content .key-terminology { border-top-color: #8fb88f; }
.main-content .context-pause,
.main-content .insight-note {
    font-size: calc(15px * var(--reader-font-scale, 1));
    line-height: 1.55;
}

/* Figures stay UNBOXED at full column width (user call, 2026-07-22 — no
   frame div look); base .figure-static-wrap margins provide the spacing,
   and the def-pair overflow fix (style-bookshelf.css flex column) is what
   keeps them clear of the box above. */
.main-content .context-pause p:last-child,
.main-content .insight-note p:last-child {
    margin-bottom: 0;
}

/* ---- Chrome: a journal masthead, not an app navbar ---- */
.navbar {
    border-bottom: 1px solid var(--accent-color);
}
.navbar-brand {
    font-style: italic;
    font-variant: small-caps;
    letter-spacing: 0.06em;
}
.navbar-nav .nav-dropdown-btn {
    font-variant: small-caps;
    letter-spacing: 0.03em;
}
/* ============================================================
   In-house optimization layer (2026-07-24) — taste-skill lens.
   Restraint-first: surgical a11y + motion. Appended last, so equal-
   specificity rules win by source order over the base sheet. ============ */

/* ---- Motion: restrained, reduced-motion-first (taste-skill MOTION~=4) ---- */
@media (prefers-reduced-motion: no-preference) {
    /* Worked-solution reveal — the one state change the reader triggers. */
    .solution-content { animation: soln-reveal 180ms ease-out; }
    @keyframes soln-reveal {
        from { opacity: 0; transform: translateY(4px); }
        to   { opacity: 1; transform: none; }
    }
    /* Row-hover transition aids scanning a numeric row across the table. */
    .data-table tbody tr { transition: background-color 120ms ease-out; }
}
/* Instant hover feedback still present under reduced-motion. */
.data-table tbody tr:hover { background-color: var(--warm-sand); }

/* [a11y] Stronger box boundary — the hairline border on the definition /
   theorem / example / problem cards read ~1.2:1 against the paper ground
   (near-invisible); the small-caps title carried all the signal. */
.main-content .definition,
.main-content .theorem,
.main-content .example,
.main-content .problem,
.main-content .collaborative-exercise,
.main-content .problem-set { border-color: rgba(20, 20, 20, 0.24); }
[data-theme="dark"] .main-content .definition,
[data-theme="dark"] .main-content .theorem,
[data-theme="dark"] .main-content .example,
[data-theme="dark"] .main-content .problem,
[data-theme="dark"] .main-content .collaborative-exercise,
[data-theme="dark"] .main-content .problem-set { border-color: rgba(255, 255, 255, 0.18); }
