/* GENERATED by scripts/workflows/emit_tokens.py — per-book theme override.
   Theme: bookshelf. Edit scripts/workflows/templates/themes/bookshelf/tokens.json, not this file. */
:root {
    /* Brand */
    --wedgwood: #4e6e8e;
    --wedgwood-light: #7a9bbf;
    --wedgwood-deep: #3d5a80;
    --wedgwood-pale: #a4c1dd;
    --focus-blue: #3898ec;
    --focus-ring-ink: #141413;
    --focus-ring-halo: #faf9f5;

    /* Surfaces */
    --parchment: #f5f4ed;
    --ivory: #faf9f5;
    --pure-white: #ffffff;
    --warm-sand: #e8e6dc;
    --dark-surface: #30302e;
    --deep-dark: #141413;

    /* Ink (warm ramp) */
    --ink-near-black: #141413;
    --ink-charcoal: #3d3d3a;
    --ink-olive: #504e49;
    --ink-stone: #6b6a64;
    --ink-warm-silver: #b0aea5;
    --ink-on-dark: #faf9f5;
    --ink-on-accent: #faf9f5;
    --link-on-dark: var(--wedgwood-light);

    /* Borders & rings */
    --border-cream: #f0eee6;
    --border-warm: #e8e6dc;
    --border-soft: #e5e3d8;
    --border-dark: #30302e;
    --ring-warm: #d1cfc5;
    --ring-deep: #c2c0b6;

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

    /* Shadows */
    --whisper-shadow: 0 4px 24px rgba(0, 0, 0, 0.05);

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

    /* Radius scale */
    --radius-tag: 2px;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-pill: 9999px;

    /* Type stacks */
    --font-serif: "Source Serif 4", "Charter", "Anthropic Serif", Georgia, "Times New Roman", serif;
    --font-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"] {
    --parchment: #141413;
    --ivory: #1a1a18;
    --pure-white: #1f1f1d;
    --warm-sand: #30302e;
    --dark-surface: #30302e;
    --deep-dark: #1a1a1a;
    --ink-near-black: #e8e2d2;
    --ink-charcoal: #c4c1b6;
    --ink-olive: #b0aea5;
    --ink-stone: #87867f;
    --border-cream: rgba(255, 255, 255, 0.06);
    --border-warm: rgba(255, 255, 255, 0.10);
    --border-soft: rgba(255, 255, 255, 0.06);
    --ring-warm: rgba(255, 255, 255, 0.12);
    --ring-deep: rgba(255, 255, 255, 0.20);
    --tag-bg: #2a3340;
}

/* layout layer — themes/bookshelf/layout.css */
/* ============================================================
   bookshelf — layout tier (first one for the house default).
   Appended verbatim after the token :root/[data-theme="dark"] blocks in the
   compiled theme.css (emit_tokens.render_theme_css) and injected the same way
   by the Studio live preview — see templates/CLAUDE.md. Loads AFTER
   style-bookshelf.css, so equal-specificity rules here win by source order.

   This is NOT a restyle — bookshelf's identity lives in style-bookshelf.css and
   is unchanged. This tier only carries design-guide COMPLIANCE fixes so the
   house default follows the same bar as the in-house style set (2026-07-24,
   taste-skill + motion + web-design-guidelines lenses):
     - color-scheme synced to the data-theme toggle (native controls / scrollbars)
     - reduced-motion guard on the infinite AI status-dot pulse
     - restrained, reduced-motion-first motion (solution reveal, nav fade, row hover)
     - h2 optical tracking corrected (tighten large display type, not loosen)
   ============================================================ */

/* NOTE: the two global correctness fixes (color-scheme synced to data-theme,
   and the reduced-motion guard on the infinite AI status-dot pulse) live
   house-wide in docs/style-bookshelf.css so EVERY theme/book gets them, not
   just bookshelf. This tier keeps only bookshelf's visible polish. */

/* [type] h2 is 28px display type; base loosens it (+0.4px), against the
   "tighten large text, loosen small text" rule. Nudge it tight; the small
   letter-spaced label rows keep their positive tracking. */
.main-content h2 { letter-spacing: -0.2px; }

/* ---- Motion: restrained, reduced-motion-first (taste-skill MOTION~=4) ---- */
@media (prefers-reduced-motion: no-preference) {
    /* Worked-solution reveal — the highest-traffic interactive element on the
       page; base opened it with an instant snap. */
    .solution-content { animation: soln-reveal 180ms ease-out; }
    @keyframes soln-reveal {
        from { opacity: 0; transform: translateY(4px); }
        to   { opacity: 1; transform: none; }
    }
    /* Nav dropdown eases in on open (base toggles display:none/block, so a
       transition can't run — a keyframe on .show can). */
    .nav-dropdown-menu.show { animation: navfade 120ms ease-out; }
    @keyframes navfade {
        from { opacity: 0; transform: translateY(-2px); }
        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); }