/* ═══════════════════════════════════════════════════════════════════════════
   T-403 — the light twin of the Bevel skin, and the theme plumbing behind it.

   Mechanism. The Bevel series (T-240–T-243) is the app's ONE skin and it
   hardcodes its dark values, so the light skin ships as this override layer:
   every shipped rule that paints a dark literal is restated here under
   `html[data-theme="light"]` with its light value. The dark files are
   untouched, so the approved dark look cannot drift. The original light
   palette of `styles.css` (ink #0B1B2B · teal #12A594 · mist #F5F8FA) is the
   source of the values. Measured white-text pairs (T-409): the button accent
   is #0A7266 — white on it 5.81:1, AA pass; #12A594 carries white at only
   3.07:1 and teal-dark #0E897B at 4.30:1 — the old comment claiming 4.54:1
   was wrong, so no button or accent surface with white text uses them.

   The choice lives in `data-theme` on <html>: "dark" (the shipped default) or
   "light"; the app sets it before the first paint (web/theme-boot.js) and the
   Account row (#/me) writes it. `color-scheme` is pinned per skin, so native
   controls and the page finally agree (the live mismatch this ticket closes).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── the token swap: the app's own names, back to their light values ────── */
html[data-theme="light"] {
  --ink: #0B1B2B;
  --teal: #12A594;
  --teal-dark: #0E897B;
  --mist: #F5F8FA;
  --line: #DCE4EC;
  --muted: #5B7286;
  --amber: #F0A500;
  --coral: #C23A12;              /* the AA red for text; the dot keeps #E4572E */
  --card: #FFFFFF;
  --raised: #FFFFFF;
  --appbar: #0B1B2B;
  --shadow: 0 1px 2px rgba(11, 27, 43, .06), 0 6px 20px rgba(11, 27, 43, .07);
  --shadow-lg: 0 10px 40px rgba(11, 27, 43, .16);
  --hair: #DDE6EE;
  color-scheme: light;
}
/* native controls follow the skin, not the OS (the mismatch T-403 closes) */
html[data-theme="dark"] { color-scheme: dark; }

/* ── the app bar keeps the brand's dark band in BOTH skins — its own text
   and chips are restated here so the light tokens cannot darken them ────── */
html[data-theme="light"] .appbar { background: #0B1B2B; color: #FFFFFF; }
html[data-theme="light"] .brand { color: #FFFFFF; }
html[data-theme="light"] .brand__ver { color: #8FA3B3; }
html[data-theme="light"] .brand__name { color: #FFFFFF; }
html[data-theme="light"] .usermenu__btn { background: rgba(255, 255, 255, .06); color: #FFFFFF; }
html[data-theme="light"] .usermenu__btn:hover { background: rgba(255, 255, 255, .12); }
html[data-theme="light"] .usermenu__avatar { background: rgba(255, 255, 255, .08); color: #FFFFFF; }
/* the chips live on the dark band: they keep the dark skin's own values */
html[data-theme="light"] .chip--offpeak { background: rgba(201, 244, 90, .14); color: #C9F45A; }
html[data-theme="light"] .chip--peak { background: rgba(255, 179, 71, .16); color: #FFB347; }
html[data-theme="light"] .chip--done { background: rgba(91, 224, 176, .14); color: #5BE0B0; }
html[data-theme="light"] .chip--due { background: rgba(255, 107, 87, .16); color: #FF6B57; }
html[data-theme="light"] .chip--muted { background: rgba(141, 154, 148, .16); color: #8D9A94; }
html[data-theme="light"] .chip--level { background: rgba(201, 244, 90, .14); color: #C9F45A; }

/* ── review card pieces drawn dark inside styles.css itself (T-243's pass) ── */
html[data-theme="light"] .survey__row { background: #FFFFFF; border-color: #DDE6EE; }
html[data-theme="light"] .survey__btn:hover { color: #3D5A75; }
html[data-theme="light"] .survey__btn:active,
html[data-theme="light"] .survey__btn[aria-checked="true"] { color: #FFFFFF; }
html[data-theme="light"] .src-card { background: #FFFFFF; border-color: #DDE6EE; }
html[data-theme="light"] .src-card__field[contenteditable="true"]:focus { background: #FFFFFF; }
html[data-theme="light"] .src-card__quote { color: #55677D; border-color: #DDE6EE; }
html[data-theme="light"] .src-card__quote::before,
html[data-theme="light"] .src-card__quote::after { color: #3D5A75; }
html[data-theme="light"] .src-card__btn { background: #FFFFFF; border-color: #7E93A6; }
html[data-theme="light"] .src-card__btn:hover { background: #F5F8FA; border-color: #5B7286; }
/* T-411: the go rank is restated as a rank — the white fill above outranks styles.css's
   .src-card__btn--go on specificity, the exact T-409 fault on three more surfaces. */
html[data-theme="light"] .src-card__btn--go { background: #0A7266; border-color: #0A7266; color: #FFFFFF; }
html[data-theme="light"] .note-box { background: #FFFFFF; border-color: #DDE6EE; }
html[data-theme="light"] .note-box__hint { color: #55677D; }
html[data-theme="light"] .note-box__btn { background: #FFFFFF; border-color: #7E93A6; }
html[data-theme="light"] .note-box__btn:hover { background: #F5F8FA; border-color: #5B7286; }
html[data-theme="light"] .note-box__btn--go { background: #0A7266; border-color: #0A7266; color: #FFFFFF; }
html[data-theme="light"] .flag-scrim { background: rgba(11, 27, 43, .45); }
html[data-theme="light"] .flag-pop { background: #FFFFFF; border-color: #DDE6EE; }
html[data-theme="light"] .flag-pop__chip { border-color: #DDE6EE; }
html[data-theme="light"] .flag-pop__chip:hover { background: #F1F7F0; }
html[data-theme="light"] .flag-pop__bx { border-color: #9FB2C0; }
html[data-theme="light"] .flag-pop__chip.is-on { background: #F1F7F0; }
html[data-theme="light"] .flag-pop__btn { background: #FFFFFF; border-color: #7E93A6; }
html[data-theme="light"] .flag-pop__btn:hover { background: #F5F8FA; border-color: #5B7286; }
html[data-theme="light"] .flag-pop__btn--go { background: #0A7266; border-color: #0A7266; color: #FFFFFF; }
html[data-theme="light"] .card-marks__head { border-color: #DDE6EE; }
html[data-theme="light"] .card-marks__foot { border-color: #DDE6EE; }
/* the charcount "ok" green was drawn for the dark card; darker for light */
html[data-theme="light"] .hint.charcount.ok { color: #2E7D32; }
/* inline SVG literals drawn dark-only: the presentation attribute loses to CSS, so the light twin
   repaints them here (the shim's attribute-selector trap is an offline-harness issue only) */
html[data-theme="light"] svg [stroke="#5BE0B0"] { stroke: #0A7266; }
html[data-theme="light"] svg [stroke="#C9F45A"] { stroke: #0A7266; }
html[data-theme="light"] svg [stroke="#FFB347"] { stroke: #C87F00; }
html[data-theme="light"] svg [fill="#5BE0B0"] { fill: #0A7266; }
html[data-theme="light"] svg [fill="#C9F45A"] { fill: #0A7266; }
html[data-theme="light"] svg [fill="#A8E04A"] { fill: #0A7266; }
/* the four card-state segments and their legend dots (inline styles need the important flag) */
html[data-theme="light"] .seg i[data-seg="learning"],
html[data-theme="light"] .leg em[data-seg="learning"] { background: #0A7266 !important; }
html[data-theme="light"] .seg i[data-seg="review"],
html[data-theme="light"] .leg em[data-seg="review"] { background: #0E897B !important; }
html[data-theme="light"] .seg i[data-seg="relearning"],
html[data-theme="light"] .leg em[data-seg="relearning"] { background: #7E93A6 !important; }
html[data-theme="light"] .seg i[data-seg="mature"],
html[data-theme="light"] .leg em[data-seg="mature"] { background: #5B7286 !important; }
/* the scan ring's lime sweep becomes the teal sweep */
html[data-theme="light"] .scanring__spin {
  background: conic-gradient(
    rgba(14, 137, 123, 0) 0deg, rgba(14, 137, 123, .05) 30deg, rgba(14, 137, 123, .24) 60deg,
    rgba(14, 137, 123, .6) 90deg, rgba(14, 137, 123, 1) 120deg, rgba(14, 137, 123, .6) 150deg,
    rgba(14, 137, 123, .24) 180deg, rgba(14, 137, 123, .05) 210deg, rgba(14, 137, 123, 0) 240deg,
    rgba(14, 137, 123, 0) 360deg);
}

/* ── derived from bevel.css ── */
/* T-409: a rank is restated as a rank. The generic white fill below outranks
   bevel's .btn--primary on specificity, so the primary's fill and edge are
   restated HERE, after the generic rule — equal specificity, source order
   decides. Fill #0A7266 = the light skin's one accent (FAB, tabs, rings);
   white on it 5.81:1. The plain button's edge is #7E93A6, the same border the
   inputs already wear (3.18:1 against the white card), so buttons and inputs
   read as one family. */
html[data-theme="light"] .btn {
  background: #FFFFFF;
  border-color: #7E93A6;
}
html[data-theme="light"] .btn:hover {
  background: #F5F8FA;
  border-color: #5B7286;
}
html[data-theme="light"] .btn--primary {
  background: #0A7266;
  border-color: #0A7266;
  color: #FFFFFF;
}
html[data-theme="light"] .btn--primary:hover {
  background: #07574E;
  border-color: #07574E;
  color: #FFFFFF;
}
html[data-theme="light"] .btn--danger {
  border-color: rgba(228, 87, 46, .45);
}
html[data-theme="light"] .btn--danger:hover {
  background: rgba(228, 87, 46, .10);
}
html[data-theme="light"] .input,
html[data-theme="light"] .textarea,
html[data-theme="light"] .select {
  background: #FFFFFF;
  border-color: #7E93A6;
}
html[data-theme="light"] .input::placeholder,
html[data-theme="light"] .textarea::placeholder {
  color: #55677D;
}
html[data-theme="light"] .input:focus,
html[data-theme="light"] .textarea:focus,
html[data-theme="light"] .select:focus {
  box-shadow: 0 0 0 3px rgba(10,114,102,.16);
}
html[data-theme="light"] .rate:hover {
  border-color: #7E93A6;
}
html[data-theme="light"] .tabbar {
  background: rgba(255,255,255,.94);
  border: 1px solid #7E93A6;
  box-shadow: 0 10px 28px rgba(11,27,43,.18);
}
html[data-theme="light"] .tabbar__item {
  color: #55677D;
}
html[data-theme="light"] .tabbar__fab {
  color: #FFFFFF;
  box-shadow: 0 8px 20px rgba(10,114,102,.25);
}
html[data-theme="light"] .tabbar__fab:hover {
  background: #07574E;
}
html[data-theme="light"] .toast--error {
  background: #FAE8E4;
  color: #8C2B10;
  border-color: #ECC6BD;
}
html[data-theme="light"] .toast--ok {
  background: #E6F4EC;
  color: #14603F;
  border-color: #BFE2CF;
}
html[data-theme="light"] .modal__scrim,
html[data-theme="light"] .waiting {
  background: rgba(11,27,43,.44);
}
html[data-theme="light"] .home__bar,
html[data-theme="light"] .home__hero,
html[data-theme="light"] .me__head {
  background: var(--mist);
}
html[data-theme="light"] .home__bar,
html[data-theme="light"] .home__brand,
html[data-theme="light"] .home__stat,
html[data-theme="light"] .home__who,
html[data-theme="light"] .home__greet,
html[data-theme="light"] .home__ring svg text {
  fill: var(--ink);
}
html[data-theme="light"] .home__who {
  background: rgba(11,27,43,.07);
}
html[data-theme="light"] .home__ring svg circle {
  stroke: var(--line);
}
html[data-theme="light"] .home__ring svg circle + circle {
  stroke: var(--teal);
  stroke-linecap: round;
}
html[data-theme="light"] .home__ring--new svg circle + circle {
  stroke: var(--amber);
}
html[data-theme="light"] .home__ring svg text:nth-of-type(2) {
  fill: var(--muted);
}
html[data-theme="light"] .home__ring-lbl {
  color: var(--muted);
}
html[data-theme="light"] .home__freeze {
  background: #FFFFFF;
}
html[data-theme="light"] .home__bar-fill {
  background: #DDE6EE;
}
html[data-theme="light"] .home__freeze-lbl {
  color: var(--muted);
}
html[data-theme="light"] .toast {
  background: #FFFFFF;
}
html[data-theme="light"] .ed-bar {
  background: #FFFFFF;
}
html[data-theme="light"] .me__avatar {
  color: var(--muted);
}
html[data-theme="light"] .me__id {
  color: var(--ink);
}
html[data-theme="light"] .me__name {
  color: var(--ink);
}
html[data-theme="light"] .heat {
  background: #E9EFF4;
}
html[data-theme="light"] .heat--0 {
  background: #E9EFF4;
}
html[data-theme="light"] .heat--1 {
  background: rgba(10,114,102,.18);
}
html[data-theme="light"] .heat--2 {
  background: rgba(10,114,102,.40);
}
html[data-theme="light"] .heat--3 {
  background: rgba(10,114,102,.66);
}
html[data-theme="light"] .heatmap__rowlbl,
html[data-theme="light"] .heatmap__wd {
  color: #55677D;
}
html[data-theme="light"] .home__avatar:hover {
  background: #DDE6EE;
}
html[data-theme="light"] .home__sig-bar {
  background: #7E93A6;
}
html[data-theme="light"] .home__cta {
  color: #FFFFFF;
}
html[data-theme="light"] .home__cta:hover {
  background: #07574E;
}
html[data-theme="light"] .home__axis span {
  color: #55677D;
}
html[data-theme="light"] body.is-home .home__bar .home__brand {
  color: var(--ink);
}
html[data-theme="light"] .concept-groups .cg--parent {
  background: rgba(10,114,102,.07);
  border: 1px solid rgba(10,114,102,.16);
}
html[data-theme="light"] .concept-groups .cg__head::after {
  border-right: 2px solid #55677D;
  border-bottom: 2px solid #55677D;
}
html[data-theme="light"] .concept-groups .cg--parent > .cg__body {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
}
html[data-theme="light"] .concept-groups .cg--child .cg__head {
  color: #3D5A75;
}
html[data-theme="light"] .concept-groups .concept {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .concept-groups .concept__title {
  color: var(--ink);
}
html[data-theme="light"] .concept-groups .concept__stats {
  color: #55677D;
}
html[data-theme="light"] .concept-groups .cg__edit {
  color: #55677D;
}
html[data-theme="light"] body.is-home .home__brand {
  color: var(--ink);
}
html[data-theme="light"] .home__avatar {
  background: #FFFFFF;
  border: 1px solid #7E93A6;
  color: #3D5A75;
}
html[data-theme="light"] .home__ring-lbl {
  color: var(--muted);
}
html[data-theme="light"] .home__box-lbl {
  color: #3D5A75;
}
html[data-theme="light"] .home__sect h2 {
  color: var(--muted);
}
html[data-theme="light"] .home__avg {
  color: #3D5A75;
}
html[data-theme="light"] .home__axis span {
  color: #55677D;
}
html[data-theme="light"] .home__decks .deck {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .home__decks .deck__meta {
  color: var(--muted);
}
html[data-theme="light"] .home__decks .deck__go {
  color: #55677D;
}
html[data-theme="light"] .home__decks .deck__pill {
  color: #FFFFFF;
}
html[data-theme="light"] body {
  background: #F5F8FA;
}
html[data-theme="light"] .home {
  background: #F5F8FA;
}
html[data-theme="light"] .home__hero {
  background: #F5F8FA;
}
html[data-theme="light"] .home__ring-lbl {
  color: var(--muted);
}
html[data-theme="light"] .home__box {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
}
html[data-theme="light"] .home__box-lbl {
  color: var(--muted);
}
html[data-theme="light"] .home__sect h2 {
  color: var(--muted);
}
html[data-theme="light"] .home__avg {
  color: #3D5A75;
}
html[data-theme="light"] .home__axis span {
  color: var(--muted);
}
html[data-theme="light"] .home__decks .deck {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .home__decks .deck__meta {
  color: var(--muted);
}
html[data-theme="light"] .home__decks .deck__pill {
  background: #0A7266;
}
html[data-theme="light"] .tabbar__fab {
  background: #0A7266;
  box-shadow: 0 0 22px rgba(10,114,102,.35);
}
html[data-theme="light"] .tabbar__fab {
  box-shadow: 0 0 22px rgba(10,114,102,.35);
}
html[data-theme="light"] .d2 .m .ic.is-live::after {
  background: radial-gradient(closest-side, rgba(10,114,102,.40), rgba(10,114,102,0));
}
html[data-theme="light"] .d2 .m .ic.is-live svg {
  filter: drop-shadow(0 0 5px rgba(10,114,102,.40));
}
html[data-theme="light"] .d2 .m .ic.is-live--mint::after {
  background: radial-gradient(closest-side, rgba(10,114,102,.40), rgba(10,114,102,0));
}
html[data-theme="light"] .d2 .m .ic.is-live--mint svg {
  filter: drop-shadow(0 0 5px rgba(10,114,102,.40));
}

/* ── derived from home-mock.css ── */
html[data-theme="light"] .d2 .avatar {
  background: #FFFFFF;
  border: 1px solid #7E93A6;
}
html[data-theme="light"] .d2 .btn {
  background: #0A7266;
  color: #FFFFFF;
}
html[data-theme="light"] .d2 .ghost {
  border: 1px solid #7E93A6;
}
html[data-theme="light"] .d2 .bars .b {
  background: #DDE6EE;
}
html[data-theme="light"] .d2 .bars .b.hi {
  background: #0A7266;
}
html[data-theme="light"] .d2 .duepill {
  color: #FFFFFF;
  background: #0A7266;
}
html[data-theme="light"] .d2 .navpill {
  background: rgba(255,255,255,.92);
  border: 1px solid #7E93A6;
}
html[data-theme="light"] .d2 .bottombar .it {
  color: #55677D;
}
html[data-theme="light"] .d2 .bottombar .it.on {
  background: #DDE6EE;
  color: #0A7266;
}
html[data-theme="light"] .d2 .answer {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2 .answer .lab {
  color: #0A7266;
}
html[data-theme="light"] .d2 .reveal {
  color: #0A7266;
}
html[data-theme="light"] .d2 .primer {
  border: 1px solid #7E93A6;
}
html[data-theme="light"] .d2 .rate {
  border: 1px solid #7E93A6;
  background: #FFFFFF;
}
html[data-theme="light"] .d2 .rate.a {
  border-color: #E5B3A6;
  background: #FBF0ED;
}
html[data-theme="light"] .d2 .rate.h {
  border-color: #E0C98E;
  background: #FBF4E2;
}
html[data-theme="light"] .d2 .rate.g {
  border-color: #9CCFC0;
  background: #E9F5F0;
}
html[data-theme="light"] .d2 .rate.e {
  border-color: #9FBED0;
  background: #EAF2F7;
}
html[data-theme="light"] .d2 .metrics .m .mini i {
  background: #DDE6EE;
}
html[data-theme="light"] .d2 .metrics .m .mini i.on {
  background: #0A7266;
}
html[data-theme="light"] .d2 .dayax span {
  color: #55677D;
}
html[data-theme="light"] .d2 .bottombar .go {
  background: #0A7266;
  color: #FFFFFF;
  box-shadow: 0 8px 20px rgba(10,114,102,.25);
}

/* ── derived from deck-mock.css ── */
html[data-theme="light"] .d2 .ring .in i {
  color: var(--muted);
}
html[data-theme="light"] .d2 .zero {
  color: var(--muted);
}
html[data-theme="light"] .d2 .ptile {
  background: rgba(10,114,102,.07);
  border: 1px solid rgba(10,114,102,.16);
}
html[data-theme="light"] .d2 .ptile .pt i {
  color: var(--muted);
}
html[data-theme="light"] .d2 .ptile .duepill {
  color: #FFFFFF;
  background: #0A7266;
}
html[data-theme="light"] .d2 .ptile .zero {
  color: var(--muted);
}
html[data-theme="light"] .d2 .ptile .chev {
  stroke: var(--muted);
}
html[data-theme="light"] .d2 .switch {
  background: #0A7266;
}
html[data-theme="light"] .d2 .switch i {
  background: #FFFFFF;
}
html[data-theme="light"] .d2 .switch.off {
  background: #C7D3DD;
}
html[data-theme="light"] .d2 .switch.off i {
  background: #FFFFFF;
}
html[data-theme="light"] .d2 .swl {
  color: var(--ink);
}
html[data-theme="light"] .d2 .swl i {
  color: var(--muted);
}
html[data-theme="light"] .d2 .addbtn2 {
  background: #0A7266;
}
html[data-theme="light"] .d2 .addbtn2 svg {
  stroke: #FFFFFF;
}
html[data-theme="light"] .d2 .archive {
  color: #55677D;
}
html[data-theme="light"] .d2 .archive svg {
  stroke: #55677D;
}
html[data-theme="light"] .d2 .sheetcard {
  background: #FFFFFF;
  border: 1px solid #7E93A6;
}
html[data-theme="light"] .sheetback {
  background: rgba(11,27,43,.44);
}
html[data-theme="light"] .sheetcard {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
  color: var(--ink);
}
html[data-theme="light"] .deck-sheets--decks .sheetback {
  background: rgba(11,27,43,.44);
}
html[data-theme="light"] .deck-sheets--decks .sheetcard {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
  color: var(--ink);
}
html[data-theme="light"] .deck-sheets--decks .sheetbody form .btn--primary {
  box-shadow: 0 -12px 0 16px #FFFFFF, 0 24px 0 16px #FFFFFF;
}
html[data-theme="light"] .deck-sheets--decks .sheetbody .formactions {
  background: #FFFFFF;
  box-shadow: 0 -10px 0 12px #FFFFFF, 0 10px 0 12px #FFFFFF;
}
html[data-theme="light"] .sheetopt {
  background: #FFFFFF;
  border: 1px solid #7E93A6;
  color: var(--ink);
}
html[data-theme="light"] .sheetclose {
  border: 1px solid #7E93A6;
  color: #3D5A75;
}
html[data-theme="light"] .d2 .kidrow {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2 .kidrow i {
  color: var(--muted);
}
html[data-theme="light"] .d2 .kdot {
  background: #C7D3DD;
}
html[data-theme="light"] .d2 .kdot.on {
  background: #0A7266;
}
html[data-theme="light"] .d2 .archive {
  color: #55677D;
}
html[data-theme="light"] .tools-fold {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .tools-fold > summary {
  color: var(--muted);
}
html[data-theme="light"] .wizrow {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
  color: var(--ink);
}
html[data-theme="light"] .wizico {
  background: #EEF3F7;
}
html[data-theme="light"] .wizico svg {
  stroke: #0A7266;
}
html[data-theme="light"] .wiztxt i {
  color: var(--muted);
}
html[data-theme="light"] .wizchev {
  color: #55677D;
}
html[data-theme="light"] .shrow {
  border-top: 1px solid #DDE6EE;
  color: var(--ink);
}
html[data-theme="light"] .shtxt i {
  color: var(--muted);
}
html[data-theme="light"] .shasend {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .shasend .kicker {
  color: var(--muted);
}
html[data-theme="light"] .tabbar__count {
  background: #F5F8FA;
  color: #0A7266;
}
html[data-theme="light"] .shasend,
html[data-theme="light"] .shsend {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .shsend > summary {
  color: var(--muted);
}
html[data-theme="light"] .shsend .field__label {
  color: var(--muted);
}
html[data-theme="light"] .shsend .input,
html[data-theme="light"] .shsend .select {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
  color: var(--ink);
}
html[data-theme="light"] .d2.decks-screen .sumline {
  color: var(--muted);
}
html[data-theme="light"] .d2.decks-screen .sumline b {
  color: #0A7266;
}
html[data-theme="light"] .d2 .tile-row {
  background: rgba(10,114,102,.06);
  border: 1px solid rgba(10,114,102,.12);
}
html[data-theme="light"] .d2 .tile-row .chev {
  stroke: #55677D;
}
html[data-theme="light"] .d2 .duepill--act {
  background: #0A7266;
  color: #FFFFFF;
}
html[data-theme="light"] .d2.decks-screen .footnote {
  color: #55677D;
}
html[data-theme="light"] .newsdeck .kicker {
  color: var(--muted);
}
html[data-theme="light"] .newsdeck .sheetintro {
  color: #3D5A75;
}
html[data-theme="light"] .newsdeck .field__label {
  color: var(--muted);
}
html[data-theme="light"] .newsdeck .input,
html[data-theme="light"] .newsdeck .select {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
  color: var(--ink);
}
html[data-theme="light"] .newsdeck__import {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .newsdeck__import > summary {
  color: var(--muted);
}
html[data-theme="light"] .d2 .laterbtn {
  color: #55677D;
}
html[data-theme="light"] .d2.decks-screen .deckrow {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .wizpick .kicker {
  color: var(--muted);
}
html[data-theme="light"] .wizpick .input,
html[data-theme="light"] .wizpick .select {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
  color: var(--ink);
}
html[data-theme="light"] .airange__end {
  color: var(--muted);
}
html[data-theme="light"] .airange__num {
  color: var(--ink);
}
html[data-theme="light"] .d2 .deckrow .chev {
  stroke: #55677D;
}
html[data-theme="light"] .d2.decks-screen .deckrow .t b {
  color: var(--ink);
}
html[data-theme="light"] .d2.decks-screen .deckrow .t i {
  color: var(--muted);
}
html[data-theme="light"] .d2 .ptile--waiting {
  background: rgba(240,165,0,.10);
  border-color: rgba(240,165,0,.25);
}
html[data-theme="light"] .d2 .kidrow--wait {
  border-top: 1px solid rgba(240,165,0,.16);
}
html[data-theme="light"] .d2 .kidrow--wait .wtext {
  color: #3D5A75;
}
html[data-theme="light"] .d2 .kidrow--wait .wlen {
  color: #8A5A00;
}

/* ── derived from stats-mock.css ── */
html[data-theme="light"] .d2.stats {
  background: #F5F8FA;
}
html[data-theme="light"] .d2.stats .line {
  color: var(--ink);
}
html[data-theme="light"] .d2.stats .line b {
  color: #0A7266;
}
html[data-theme="light"] .d2.stats .dayax span {
  color: #55677D;
}
html[data-theme="light"] .d2.stats .note {
  color: #55677D;
}
html[data-theme="light"] .d2.stats .spend {
  color: var(--muted);
}
html[data-theme="light"] .d2.stats .card2 {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2.stats .todayn span {
  color: var(--muted);
}
html[data-theme="light"] .d2.stats .seg {
  background: #FFFFFF;
}
html[data-theme="light"] .d2.stats .leg span {
  color: var(--muted);
}
html[data-theme="light"] .d2.stats .wk > div {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2.stats .wk i {
  color: var(--muted);
}
html[data-theme="light"] .d2.stats .qrow {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2.stats .qrow span {
  color: var(--muted);
}
/* T-408 — the fold rows now open on the Deeper tab too: the topics' names must read on the light
 * card (they shipped near-white, a dark-skin colour), the deck labels and chevrons with them. */
html[data-theme="light"] .d2.stats .qpanel__name {
  color: var(--ink);
}
html[data-theme="light"] .d2.stats .qpanel__deck {
  color: var(--muted);
}
html[data-theme="light"] .d2.stats .qrow__chev {
  border-color: var(--muted);
}

/* ── derived from account-mock.css ── */
html[data-theme="light"] .d2.account {
  background: #F5F8FA;
}
html[data-theme="light"] .d2.account .av {
  background: #FFFFFF;
  border: 1px solid #7E93A6;
  color: var(--muted);
}
html[data-theme="light"] .d2.account .cam {
  background: #FFFFFF;
  border: 1px solid #7E93A6;
  color: var(--muted);
}
html[data-theme="light"] .d2.account .face .nm {
  color: var(--ink);
}
html[data-theme="light"] .d2.account .face .em {
  color: var(--muted);
}
html[data-theme="light"] .d2.account .arow {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2.account .arow .lbl {
  color: var(--ink);
}
html[data-theme="light"] .d2.account .arow .val {
  color: var(--muted);
}
html[data-theme="light"] .d2.account .arow svg.ch {
  stroke: #55677D;
}
html[data-theme="light"] .d2.account .arow:focus-visible {
  outline: 3px solid #0A7266;
}
html[data-theme="light"] .d2.account .switch {
  background: #C7D3DD;
}
html[data-theme="light"] .d2.account .switch i {
  background: #FFFFFF;
}
html[data-theme="light"] .d2.account .switch.is-on {
  background: #0A7266;
}
html[data-theme="light"] .d2.account .signout__btn {
  color: #55677D;
}
html[data-theme="light"] .d2.account .signout__btn:hover {
  color: var(--ink);
}
html[data-theme="light"] .d2.account .arow--danger {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2.account .arow--danger .lbl {
  color: #C23A12;
}
html[data-theme="light"] .d2.account .switch--danger {
  background: #E4572E;
}
html[data-theme="light"] .d2.account .switch--danger i {
  background: #FFFFFF;
}
html[data-theme="light"] .d2.account .switch-off__note,
html[data-theme="light"] .d2.account .switch-off__warn {
  color: #55677D;
}
html[data-theme="light"] .d2.account .admin-fold {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2.account .admin-fold > summary {
  color: var(--muted);
}
html[data-theme="light"] .d2.account .admin-fold > summary::after {
  border-right: 2px solid #55677D;
  border-bottom: 2px solid #55677D;
}

/* ── derived from review-mock.css ── */
html[data-theme="light"] body.is-session {
  background: #F5F8FA;
}
html[data-theme="light"] .review-body .progress {
  background: #DDE6EE;
}
html[data-theme="light"] .review-body .progress__bar {
  background: #0A7266;
}
html[data-theme="light"] .review-body .qcard {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
}
html[data-theme="light"] .review-body .reveal__btn,
html[data-theme="light"] .review-body .reveal__btn:hover,
html[data-theme="light"] .review-body .reveal.is-revealed .reveal__btn,
html[data-theme="light"] .review-body .reveal:not(.is-revealed) .reveal__btn {
  background: #FFFFFF;
  border: 1px solid #DDE6EE;
}
html[data-theme="light"] .review-body .reveal__label {
  color: #0A7266;
}
html[data-theme="light"] .review-body .reveal__hint {
  color: #0A7266;
}
html[data-theme="light"] .review-body .reveal__hide {
  border: 1px solid #7E93A6;
  color: var(--muted);
}
html[data-theme="light"] .review-body .psources__toggle,
html[data-theme="light"] .review-body .psources__toggle:hover {
  border: 1px solid #7E93A6;
  background: #FFFFFF;
  color: var(--ink);
}
html[data-theme="light"] .review-body .psources__state {
  color: var(--muted);
}
html[data-theme="light"] .session-footer {
  background: #F5F8FA;
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .session-footer__exit {
  background: #F5F8FA;
}
html[data-theme="light"] .session-footer__exit .btn,
html[data-theme="light"] .session-footer__exit .btn:hover {
  color: var(--muted);
}
html[data-theme="light"] .session-footer .rate {
  background: #FFFFFF;
  border: 1px solid #7E93A6;
}
html[data-theme="light"] .session-footer .rate:hover {
  background: #FFFFFF;
  border-color: #7E93A6;
}
html[data-theme="light"] .session-footer .rate__name {
  color: var(--ink);
}
html[data-theme="light"] .session-footer .rate::before {
  background: #7E93A6;
}
html[data-theme="light"] .session-footer .rate--again::before {
  background: #E4572E;
}
html[data-theme="light"] .session-footer .rate--hard::before {
  background: #F0A500;
}
html[data-theme="light"] .session-footer .rate--good::before {
  background: #0A7266;
}
html[data-theme="light"] .session-footer .rate--easy::before {
  background: #0A7266;
}
html[data-theme="light"] .session-footer .rate.is-chosen {
  background: #FFFFFF;
  border-color: #0A7266;
  box-shadow: inset 0 0 0 2px #0A7266;
}

/* ── derived from theme-common.css ── */
html[data-theme="light"] .sheetback,
html[data-theme="light"] .modal {
  background: rgba(11,27,43,.44) !important;
}
html[data-theme="light"] .sheetcard,
html[data-theme="light"] .modal__card {
  box-shadow: 0 24px 60px rgba(11,27,43,.18);
}
html[data-theme="light"] .d2 .kidrow {
  border-top: 1px solid #DDE6EE;
}
html[data-theme="light"] .d2 .sheetcard .input,
html[data-theme="light"] .d2 .sheetcard .select,
html[data-theme="light"] .sheetcard .input,
html[data-theme="light"] .sheetcard textarea.input {
  background: #FFFFFF;
  border: 1px solid #7E93A6;
  color: var(--ink);
}
html[data-theme="light"] .sheetcard .btn--danger {
  background: #FAE8E4;
  color: #8C2B10;
  border: 1px solid #ECC6BD;
}
html[data-theme="light"] .signout-fab {
  background: rgba(255,255,255,.88);
  border: 1px solid #7E93A6;
  color: #3D5A75;
}
html[data-theme="light"] .tabbar__report[aria-pressed="true"],
html[data-theme="light"] .tabbar__report:hover {
  color: #0A7266;
}
html[data-theme="light"] .d2 .ptile .tileedit {
  background: rgba(10,114,102,.08);
  color: #0A7266;
}
html[data-theme="light"] .d2 .deckrow .t i,
html[data-theme="light"] .d2 .kidrow i,
html[data-theme="light"] .admrow__t i,
html[data-theme="light"] .d2 .meta,
html[data-theme="light"] .d2 .zero {
  color: var(--muted);
}
html[data-theme="light"] .d2 .kicker {
  color: var(--muted);
}
html[data-theme="light"] .d2 .duepill {
  background: #0A7266;
  color: #FFFFFF;
}
html[data-theme="light"] .d2 .cap2,
html[data-theme="light"] .d2 .ring ~ .meta,
html[data-theme="light"] .d2.decks-screen .ring + .meta,
html[data-theme="light"] .d2.stats .cap2 {
  color: var(--muted);
}
html[data-theme="light"] .tabbar {
  background: rgba(255,255,255,.75) !important;
  border: 1px solid rgba(11,27,43,.07) !important;
  box-shadow: 0 10px 30px rgba(11,27,43,.16), inset 0 1px 0 rgba(11,27,43,.07);
}
html[data-theme="light"] .tabbar__item {
  color: var(--muted);
}
html[data-theme="light"] .tabbar__item[aria-current="page"] {
  color: #0A7266;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html[data-theme="light"] .sheetback,
  html[data-theme="light"] .modal {
    background: rgba(11,27,43,.7) !important;
  }
  html[data-theme="light"] .tabbar {
    background: rgba(255,255,255,.95) !important;
  }
}