/* ============ THE DAYLIGHT GRADE ============
   Loaded after film.css. Same film, lit like day: a cool clean light base for reading,
   footage carries the cinema. The evidence (Piepenbrock 2013, NN/g): dark text on light
   wins reading and acuity; dark backgrounds win immersion. So: read in light, watch in picture. */
:root{
  --paper:#F4F5F8;            /* daylight ground, cool */
  --paper-2:#EAECF1;          /* raised */
  --white:#FFFFFF;            /* pane */
  --ink:#0B0C12;              /* text */
  --ink-70:#4B4E5A;           /* secondary text */
  --ink-45:#868A98;           /* tertiary text, labels */
  --cobalt:#2440E0;           /* THE accent */
  --sky:#D6E2FF;              /* atmosphere, faint */
  --mint:#D9EEE6;             /* atmosphere, faint */
  --champagne:#F3E9D2;        /* atmosphere, faint */
  --line:rgba(11,12,18,.09);
  --line-strong:rgba(11,12,18,.2);
  --shadow-float:0 60px 120px -40px rgba(11,12,18,.28), 0 24px 48px -24px rgba(11,12,18,.16);
  --veil:rgba(244,245,248,.78);
}
html{color-scheme:light}
/* no drifting blobs: that is the "AI site" tell. Light comes from the footage and the head. */
.orb{display:none}
.grain{opacity:.022}
.nav.scrolled{background:rgba(244,245,248,.8)}
.btn-line{background:rgba(255,255,255,.6)}
.btn-ink:hover{box-shadow:0 14px 34px -12px rgba(11,12,18,.45)}
.mani-line{opacity:.35}
.morph-row input,.field input,.field select,.field textarea,.sc-opts button,.scard-band{background:var(--white)}
.lib-sub input{background:var(--white)}
.where-map canvas{background:var(--white)}
.scene-media::after{background:linear-gradient(90deg,var(--veil) 0%,rgba(244,245,248,.42) 52%,rgba(244,245,248,.04) 100%),
  linear-gradient(0deg,var(--paper) 0%,transparent 26%,transparent 84%,rgba(244,245,248,.55) 100%)}
.scene.flip .scene-media::after{background:linear-gradient(270deg,var(--veil) 0%,rgba(244,245,248,.42) 52%,rgba(244,245,248,.04) 100%),
  linear-gradient(0deg,var(--paper) 0%,transparent 26%,transparent 84%,rgba(244,245,248,.55) 100%)}
.card-right::before{background:radial-gradient(ellipse at 60% 50%,rgba(244,245,248,.82),rgba(244,245,248,.45) 55%,transparent 78%)}
.cmp .us{background:linear-gradient(180deg,rgba(36,64,224,.06),transparent)}
.term{background:var(--ink);color:rgba(244,245,248,.72);border-radius:16px}
.term-line time{color:rgba(244,245,248,.45)}
.term-line b{color:var(--paper)}
.term-cursor{background:var(--paper)}
.spine-title,.spine-num,.cover b,.cover span,.reader-cover,.reader-cover h2,.reader-cover small{color:var(--paper)}
.spine-mark{border-color:rgba(244,245,248,.6)}
.spine-mark::after{background:var(--paper)}
.c1{--c:color-mix(in srgb,var(--cobalt) 88%,var(--ink))}
.c2{--c:color-mix(in srgb,var(--cobalt) 55%,var(--ink))}
.c3{--c:color-mix(in srgb,var(--ink) 78%,var(--cobalt))}
.c4{--c:color-mix(in srgb,var(--ink) 60%,var(--champagne))}
.shelf-board{background:linear-gradient(180deg,var(--white),var(--paper-2));box-shadow:0 30px 60px -24px rgba(11,12,18,.35)}
.reader::backdrop{background:rgba(244,245,248,.7);}
.pre-bar i{background:var(--ink)}
.stat,.how-steps li{background:var(--paper)}

/* dark bands: the page breathes light / dark / light. Read in light, watch in the dark. */
.band{--paper:#0B0C12;--paper-2:#13141B;--white:#171822;--ink:#F1EFE8;--ink-70:#B8B5AD;--ink-45:#7E7B74;--cobalt:#4D66FF;
  --line:rgba(241,239,232,.09);--line-strong:rgba(241,239,232,.22);--shadow-float:0 70px 140px -40px rgba(0,0,0,.85), 0 24px 48px -24px rgba(0,0,0,.7);
  --veil:rgba(11,12,18,.72);background:var(--paper);color:var(--ink);color-scheme:dark}
.band .term{background:var(--paper-2);color:var(--ink-70)}
.band .term-line time{color:var(--ink-45)}.band .term-line b{color:var(--ink)}.band .term-cursor{background:var(--ink)}
.band .pane{background:var(--white)}
.band .btn-ink{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.band .btn-line{background:rgba(241,239,232,.06);color:var(--ink);border-color:var(--line-strong)}
.band .cmp .us{background:linear-gradient(180deg,rgba(77,102,255,.1),transparent)}
.band-edge{position:relative}
.band-edge::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--line)}
.stats{background:var(--paper)}
/* a faint warm sun behind the hero so the white has depth */
.film-stage::before{content:"";position:absolute;inset:-10% -10% auto;height:120%;pointer-events:none;z-index:0;
  background:radial-gradient(ellipse 55% 60% at 72% 40%,rgba(36,64,224,.08),transparent 70%),radial-gradient(ellipse 60% 50% at 20% 90%,rgba(243,233,210,.7),transparent 70%)}
.scene-media::after{background:linear-gradient(90deg,var(--veil) 0%,rgba(244,245,248,.5) 48%,rgba(244,245,248,.06) 100%),
  linear-gradient(0deg,var(--paper) 0%,transparent 22%,transparent 86%,rgba(244,245,248,.5) 100%)}