/* =============================================================================
   BOOK — DARK. The dark edition of the Book of Life, used by /indexdark.html.

   Small, because book.css is already two-tone: this promotes the homepage's
   dark token set to the root and answers the literals where ink is a FILL
   rather than a text colour. Scoped to html[data-dark] and loaded last, so the
   paper edition cannot be regressed by anything in this file.
   ========================================================================== */

html[data-dark] {
    --ink:        #FFFFFF;
    --ink-77:     rgba(255, 255, 255, .72);
    --ink-55:     rgba(255, 255, 255, .58);
    --line:       rgba(255, 255, 255, .16);
    --line-soft:  rgba(255, 255, 255, .09);
    --muted:      #8A9199;

    /* The print red is chosen for white paper; on the deep ground it goes to
       the warm mark the console uses. */
    --accent:     #F97316;

    /* The tonal ladder, rebuilt rather than inverted: the page, then the
       whisper above it for the contents band. */
    --paper:      #0C1116;
    --tint:       #0F151B;
    --deep:       #1A222C;

    color-scheme: dark;
    background: var(--paper);
}

html[data-dark] body { background: var(--paper); color: var(--ink-77); }

/* The bar: mirror of the paper blur. */
html[data-dark] .nav {
    background: rgba(12, 17, 22, .86);
    border-bottom-color: var(--line-soft);
}

/* Ink as a background. The fill goes white and the label goes dark — the
   exact inverse of the paper edition. The skip link is the easiest to miss:
   it lives off-screen until a keyboard user focuses it. */
html[data-dark] .skip            { background: var(--ink); color: var(--paper); }
html[data-dark] .btn             { background: var(--ink); color: var(--paper); }
html[data-dark] .btn:hover       { background: rgba(255, 255, 255, .86); color: var(--paper); }
html[data-dark] .btn--ghost      { background: transparent; color: var(--ink); border-color: var(--line); }
html[data-dark] .btn--ghost:hover{ background: var(--ink); color: var(--paper); border-color: var(--ink); }

/* The pill: a white wash on ink instead of an ink wash on paper. The thumb
   keeps --ink as its fill, which is now white, so the lit glyph goes dark. */
html[data-dark] .mode-pill {
    background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.04));
    border-color: var(--line);
    box-shadow: inset 0 1px 2px rgba(0,0,0,.35);
}
html[data-dark] .mode-pill__thumb {
    box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.3);
}
html[data-dark] .mode-pill__seg          { color: var(--ink-55); }
html[data-dark] .mode-pill__seg.is-on    { color: #11161C; }
html[data-dark] .mode-pill__seg:not(.is-on):hover { color: var(--ink); }
html[data-dark] .mode-pill:has(.mode-pill__seg:hover) .mode-pill__seg.is-on { color: var(--ink-55); }
html[data-dark] .mode-pill:has(.mode-pill__seg:hover) .mode-pill__seg:hover { color: #11161C; }

/* The contents band reads the tint token; only its hairlines need a word. */
html[data-dark] .contents { border-color: var(--line-soft); }

/* The blockquote wash: line-soft is now a white at 9%, which is a heavier
   object on this ground than its paper twin was — take it down a step. */
html[data-dark] .chapter blockquote { background: rgba(255, 255, 255, .05); }