/* Dark theme (theme.js sets data-theme on <html>). Mostly token swaps; then the few one-off tints, and the
   in-app Handbook pages. The PDF booklet opens in its own window without this file, so it stays light. */

[data-theme="dark"]{
  color-scheme:dark;
  --ink-rgb:255,255,255; --shadow-rgb:0,0,0;
  --bg:#191919; --side:#202020; --surface:#252525; --field:rgba(255,255,255,.055);
  --ink:rgba(255,255,255,.86); --muted:rgba(255,255,255,.58); --faint:rgba(255,255,255,.38);
  --line:rgba(255,255,255,.09); --soft:#2c2c2c; --hover:rgba(255,255,255,.06);
  --accent:#3b8fe8; --accent-soft:rgba(59,143,232,.18);
  --fact:#e35d5d; --fact-soft:rgba(227,93,93,.16); --fact-line:rgba(227,93,93,.4);
  --dim:#3b8fe8;
  --bridge:#a47cc4; --bridge-line:rgba(164,124,196,.45);
  --warn-soft:rgba(223,171,76,.13); --ok:#4dab9a; --amber:#dfab4c;
  --tag-red:#5a2b27;    --tag-red-ink:#ffd2cc;
  --tag-blue:#24405c;   --tag-blue-ink:#cfe4f7;
  --tag-yellow:#55421f; --tag-yellow-ink:#fbe2b4;
  --tag-purple:#44305a; --tag-purple-ink:#e7d9f5;
  --tag-gray:#3a3a3a;   --tag-gray-ink:#e3e2e0;
  --tag-green:#24402c;
}

/* ---------- one-off tints ---------- */
[data-theme="dark"] .seg button.on{background:rgba(255,255,255,.14);box-shadow:none}
[data-theme="dark"] .tool.on{background:rgba(255,255,255,.04)}
[data-theme="dark"] .seg button:hover,
[data-theme="dark"] .wt-edit:hover,
[data-theme="dark"] .wt-add:hover{background:rgba(255,255,255,.08)}
[data-theme="dark"] .tl-chip button:hover{background:rgba(255,255,255,.12)}
[data-theme="dark"] .pbox.on{border-color:rgba(77,171,154,.55);background:rgba(77,171,154,.1)}
[data-theme="dark"] .rhero.s-red{background:rgba(227,93,93,.12)}
[data-theme="dark"] .rhero.s-yellow{background:rgba(223,171,76,.12)}
[data-theme="dark"] .rhero.s-green{background:rgba(77,171,154,.12)}
[data-theme="dark"] .pipe.ro .pbox.b-red{background:rgba(227,93,93,.1);--pb:rgba(227,93,93,.55)}
[data-theme="dark"] .pipe.ro .pbox.b-yellow{background:rgba(223,171,76,.1);--pb:rgba(223,171,76,.55)}
[data-theme="dark"] .pipe.ro .pbox.b-green{background:rgba(77,171,154,.1);--pb:rgba(77,171,154,.55)}
[data-theme="dark"] .pipe.ro .pbox.b-none{background:rgba(255,255,255,.03)}
[data-theme="dark"] .lg-fill{background:linear-gradient(90deg,rgba(227,93,93,.18) 33%,rgba(223,171,76,.18) 33% 66%,rgba(77,171,154,.18) 66%)}
[data-theme="dark"] .home-next{border-color:rgba(59,143,232,.3)}
[data-theme="dark"] .tray{background:var(--side)}
[data-theme="dark"] .toast,
[data-theme="dark"] .note-tip{background:#3a3a3a;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
[data-theme="dark"] .tdot,
[data-theme="dark"] .nbadge.talk{background:var(--tag-yellow);color:var(--tag-yellow-ink)}
[data-theme="dark"] .imodal .x{background:rgba(37,37,37,.9)}
[data-theme="dark"] .hb-in{background:rgba(59,143,232,.08);border-color:rgba(59,143,232,.4)}
[data-theme="dark"] h1.with-ico .hb-ico{background:rgba(59,143,232,.18);color:#6aa7ff}

/* ---------- Handbook pages in the app (HB_CSS in handbook.js is written for the light booklet) ---------- */
[data-theme="dark"] .hb{--hb-ink:var(--ink);--hb-muted:var(--muted);--hb-code:#5fc27e;--hb-link:#6aa7ff;--hb-navy:#e4ebf5;
  --a-line:rgba(255,255,255,.1);--a-muted:var(--muted)}
[data-theme="dark"] .hb hr,
[data-theme="dark"] .hb-two h3{border-color:var(--line)}
[data-theme="dark"] .hb-ico{background:rgba(59,143,232,.18);color:#6aa7ff}
[data-theme="dark"] .hb-dots li::before{background:#6aa7ff;box-shadow:0 0 0 3px rgba(59,143,232,.2)}
[data-theme="dark"] .hb-mono,
[data-theme="dark"] .hb-chip.dark{background:#34445c;border-color:#34445c;color:#fff;box-shadow:none}
[data-theme="dark"] .hb-arch{background:#202020}
[data-theme="dark"] .hb-chip,
[data-theme="dark"] .hb-db{background:var(--surface);color:var(--ink);box-shadow:none}
[data-theme="dark"] .hb-chip.none{background:transparent}
[data-theme="dark"] .hb-box{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.08)}
[data-theme="dark"] .hb-under,
[data-theme="dark"] .hb-envs{border-color:rgba(255,255,255,.08)}
[data-theme="dark"] .hb-matrix th,
[data-theme="dark"] .hb-matrix td{border-color:var(--line)}
[data-theme="dark"] .hb-matrix thead th{border-bottom-color:rgba(255,255,255,.16)}
[data-theme="dark"] .hb-matrix .conformed{background:rgba(59,143,232,.1)}
[data-theme="dark"] .hb-matrix .hb-used{border-left-color:var(--line)}