/* PRINT MODE (Sept 29 2026, Sensei: yes to a light mode for the Yearbook site).
   The site's tokens were always named for paper and ink (--paper, --k), they just carry darkroom values.
   Lights on swaps the values back: cream stock, black ink, the same cyan / pink / yellow, the same dot grain.
   The TV stays in the darkroom either way, like Studio's does. Toggle: the LIGHT MODE / DARK MODE chip by Camera School (renamed from PRINT / DARKROOM, SN 097: cute, but it read as a print button). */
html[data-mode="light"]{--k:#131316;--paper:#F4F1EA;--paper-2:#EDE8DD;--white:#E8E1D2;
  --rule:rgba(19,19,22,.22);--dim:rgba(19,19,22,.74);--c:#06708A;--m:#C8174F;--red:#B42A18;
  --text:var(--k);--text-muted:var(--dim);--bg:var(--paper);--bg-elev:var(--paper-2);--line:var(--rule);--line-strong:var(--white);
  --cyan:var(--c);--magenta:var(--m)}
html[data-mode="light"],html[data-mode="light"] body{background:#F4F1EA;color:#131316}
html[data-mode="light"]::before{mix-blend-mode:multiply;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Ccircle cx='1.5' cy='1.5' r='1.1' fill='%23000'/%3E%3Ccircle cx='4.5' cy='4.5' r='1.1' fill='%23000'/%3E%3C/svg%3E")}
/* the TV never leaves the darkroom */
html[data-mode="light"] #tv{--k:#F2EEE6;--paper:#131316;--paper-2:#1E1E22;--white:#26262B;--rule:rgba(242,238,230,.22);--dim:rgba(242,238,230,.62);
  --c:#4FC3D9;--m:#FF4574;--red:#FF4D3C;--text:var(--k);--text-muted:var(--dim);--bg:var(--paper);--bg-elev:var(--paper-2);--line:var(--rule);--line-strong:var(--white);--cyan:var(--c);--magenta:var(--m);
  background:#131316;color:#F2EEE6}
/* the switch */
.ybmode{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  display:inline-flex;align-items:center;gap:7px;height:100%;min-height:28px;padding:4px 10px 3px;margin-left:8px;flex:0 0 auto;
  background:transparent;color:var(--k);border:1.5px solid var(--rule);cursor:pointer}
.ybmode:hover,.ybmode:focus-visible{border-color:var(--y);color:var(--y);outline:none}
html[data-mode="light"] .ybmode:hover,html[data-mode="light"] .ybmode:focus-visible{border-color:var(--k);color:var(--k);background:var(--y)}
.ybmode i{width:9px;height:9px;border-radius:50%;background:var(--y);box-shadow:0 0 0 1.5px var(--k)}
html:not([data-mode="light"]) .ybmode i{background:#F4F1EA}
html[data-mode="light"] .obar.side .k i{color:#F4F1EA}
/* AUTO */
/* every hardcoded darkroom color and every yellow-as-text rule, flipped for print (generated from the site CSS) */
html[data-mode="light"]{background:#F4F1EA}
html[data-mode="light"] body{background:#F4F1EA}
html[data-mode="light"] .secno{color:#8A6200}
html[data-mode="light"] .wd.today .wd-n{color:#8A6200}
html[data-mode="light"] .wd-fri .wd-n{color:#8A6200}
html[data-mode="light"] .mdays span.off{background:repeating-linear-gradient(45deg,transparent 0 6px,rgba(19,19,22,.05) 6px 12px)}
html[data-mode="light"] .mdays span.today{color:#8A6200}
html[data-mode="light"] .w4 .duelane .l{color:#8A6200}
html[data-mode="light"] .w4 .ribbon span.off{background:repeating-linear-gradient(45deg,transparent 0 6px,rgba(19,19,22,.05) 6px 12px)}
html[data-mode="light"] .w4.now .chip-wk b{color:#8A6200}
html[data-mode="light"] .dcell.off{background:repeating-linear-gradient(45deg,transparent 0 6px,rgba(19,19,22,.05) 6px 12px)}
html[data-mode="light"] .w4lane.duel .l{color:#8A6200}
html[data-mode="light"] .dosigns .sgt > b{color:#8A6200}
html[data-mode="light"].demo.demo-big .nowsec b{color:#8A6200}
html[data-mode="light"] .keycard b{color:#8A6200}
html[data-mode="light"] .checkpoints .g{color:#8A6200}
html[data-mode="light"] .checkpoints .row.now .g{color:#8A6200}
html[data-mode="light"] .gchip.op{color:#8A6200}
html[data-mode="light"] .twoup .ex b{color:#8A6200}
html[data-mode="light"] .mineback button{color:#8A6200}
html[data-mode="light"] .bd-row .bd-all{color:#8A6200}
html[data-mode="light"] .sign.warn b{color:#8A6200}
html[data-mode="light"] .dgm figcaption b{color:#8A6200}
html[data-mode="light"] .rstops li.last .rn{color:#8A6200}
html[data-mode="light"] .gapbar>span>i{color:#8A6200}
.ybmode .on-light,html[data-mode="light"] .ybmode .on-dark{display:none}
html[data-mode="light"] .ybmode .on-light{display:inline}
