/* The Three-Day Yes: light and dark for the editorial pages (/teach and /kit).
   Their dark sections (covers, the pitch, quotes) already sit on ink and stay as they are; this
   turns the cream sections and white cards dark. --ink stays dark here (it paints the dark
   sections), so text on cream is set separately. Every value is light-dark(light, dark) with the
   page's original as the light value. The printable worksheets stay paper in both. */
body[data-nav]{
  --paper:light-dark(#F5F2EC,#0A0A0C);
  --paper2:light-dark(#ECE7DE,#111114);
  --line:light-dark(#DDD6CA,#26262C);
  --dim:light-dark(#6E6A63,#A8A299);
  --mute:light-dark(#9C968C,#8A857D);
  --text:light-dark(#111113,#ECE7DF);
  --body-2:light-dark(#3a3833,#C9C4BB);
  --surface:light-dark(#FFFFFF,#141418);
  --shadow:0 40px 90px -40px light-dark(rgba(17,17,19,.35),rgba(0,0,0,.8));
}
@media screen{
  body[data-nav]{color:var(--text);transition:background-color .35s,color .35s}
  /* white cards → raised dark surfaces */
  .offer,.versus .old,.who div,.tile:not(.hot),.mail,.mv,.ref:not(.feat){background:var(--surface);border-color:var(--line)}
  .offer,.mv,.ref:not(.feat){box-shadow:var(--shadow),inset 0 1px 0 light-dark(transparent,rgba(255,255,255,.05))}
  /* dark text written for cream */
  .offer .promise,.mail .mb,.mv p,.structure p,.nums p,.ref:not(.feat) p,.tale p{color:var(--body-2)}
  .qw blockquote{color:light-dark(#24221f,#ECE7DF)}
  .tale .pull,.inside li .v{color:var(--text)}
  .btn.o.l{border-color:light-dark(#cfc7b9,#3a3a40);color:var(--text)}
  .btn.o.l:hover{border-color:var(--text)}
  .checks li:before{border-color:var(--text)}
  /* the offer's right column, story cards and other ink panels lift slightly off the dark page */
  .offer .r,.story,.versus .new,.move{box-shadow:inset 0 1px 0 light-dark(transparent,rgba(255,255,255,.06))}
  .versus .new,.story,.phone,.ref.feat{background:light-dark(#111113,#18181D);border:1px solid light-dark(transparent,rgba(255,255,255,.09))}
  .versus .new{background:radial-gradient(120% 120% at 100% 0%,light-dark(transparent,rgba(240,22,33,.14)),transparent 55%),light-dark(#111113,#18181D)}
  section.s.dark,.close,footer{border-color:light-dark(#222,#1d1d22)}
  /* paper stays paper: the A4 worksheets, the drawing and the phone mock */
  .sheet,.drawing .pic,.phone .scr{color-scheme:light}
  .sheet{--line:#DDD6CA;--dim:#6E6A63;--mute:#9C968C;color:#111113}
}
