/* =========================================================================
   SEIDR LABS — fable2 NIGHT SKIN · 2026-08-04
   Loaded AFTER fable2.css on every subpage. The Atelier sheet is fully
   token-driven, so re-valuing the tokens carries the whole design into the
   same night world as the tree homepage. All pairs AA-checked:
     ink #e6eef9 on paper #070d16 = 14.8:1 · ink-soft #9fb1c6 = 7.4:1
     brass #d9a75f on paper = 7.9:1 · green #57c9a8 on paper = 9.6:1
     on-green #e9f4ee on green-deep #0a1a22 = 13.9:1
   ========================================================================= */
:root {
    color-scheme: dark;

    --paper:         #070d16;
    --sand:          #0b1420;
    --card:          #0e1826;
    --ink:           #e6eef9;
    --ink-soft:      #9fb1c6;
    --line:          #1d2c3f;
    --line-strong:   #31445c;

    --green:         #57c9a8;
    --green-bright:  #74e0c0;
    --green-deep:    #0a1a22;
    --green-ink:     #071018;
    --green-soft:    #0f2028;
    --on-green:      #e9f4ee;
    --on-green-mut:  #9fc0b4;
    --line-on-green: rgba(233, 244, 238, 0.14);

    --brass:         #d9a75f;
    --brass-bright:  #edc07a;
    --brass-soft:    #241c10;

    --ok:            #4ade9d;
    --warn:          #e0b05c;
    --danger:        #ff8f7a;
}
html, body { background: var(--paper); }
/* imagery calms down at night */
img, video { filter: brightness(0.92); }
/* hero contour lines glow faintly instead of printing dark */
.hero-contour { opacity: 0.5; }
.site-header .brand span, .footer-brand .brand span { color: var(--ink); }
/* the sticky header + mobile nav hardcode cream glass in fable2.css — night them */
.site-header {
    background: rgba(7, 13, 22, 0.88);
    box-shadow: 0 1px 0 rgba(146, 196, 255, 0.07);
}
@media (max-width: 900px) {
    .nav-links { background: rgba(7, 13, 22, 0.97); }
}
/* fable2 builds the footer ON var(--ink) (near-black in the light theme);
   with night ink being near-white that inverted to a white band — pin it dark */
.site-footer {
    background: #060b13;
    color: #9fb1c6;
    border-top: 1px solid var(--line);
}
.site-footer a { color: #c6d3e4; }
.site-footer a:hover { color: var(--green-bright); }