/* --------------------------------------------------------------------------
   Dark theme
   Applied by the head scripts in _RedesignLayout and _AuthLayout (stored choice,
   else the OS) and only to pages that opt in with html.themeable. Panels, the hero, the
   footer and the drawer were already dark and stay dark; everything else flips
   through the tokens site.css now reads from.
   -------------------------------------------------------------------------- */
html.themeable[data-theme="dark"]{
  color-scheme:dark;
  --bg:#060B1E;
  --bg-soft:#0A1230;
  --bg-hover:rgba(255,255,255,0.06);
  --bg-tint:#0F1C46;
  --bg-tint-2:#0D1942;
  --bg-code:#0B1433;
  --bg-mono:#0B1433;
  --surface:#0C1535;
  --surface-hover:#111D47;
  --panel:#0F1B47;

  --navy:#EEF2FF;
  --text:#EEF2FF;
  --text-strong:#DDE5F8;
  --text-body:#C3CDE4;
  --text-muted:#9DA9C6;
  --text-faint:#6F7C9C;

  --blue:#55ADFF;
  --blue-dark:#93CCFF;
  --selection:#1C3D80;

  --line:#1B264F;
  --line-strong:#25325E;
  --line-soft:#172148;
  --line-softer:#131C40;
  --line-section:#151F47;
  --line-dashed:#2C3E72;
  --line-focus:#30508D;

  --ask-ink:#5CC6FF; --core-ink:#FF9B5E; --studio-ink:#FF6D80; --vault-ink:#FFC35E;
  --synapse-ink:#86A2FF; --amplify-ink:#4FD3BE; --fusion-ink:#5CC6FF; --catalyst-ink:#B6BFCF;
  --apex-ink:#B6BFCF; --canvas-ink:#73B8FF;
  /* Apex's slate is the icon's colour, but as a glow on navy it disappears, and Apex is live -- it has
     to read as lit on the wheel. Lifted to a steel tone for the dark theme only. */
  --apex:#93A3C4;

  --good:#2BC3AB; --good-ink:#5AD8C3; --good-bg:#0A1F27; --good-bg-2:#0B2229; --good-line:#17423F;
  --bad-ink:#FF8E8E;
  --warn-ink:#F3C46E; --warn-bg:#1F190B; --warn-line:#46361A;

  --sh-card:0 12px 34px -24px rgba(0,0,0,0.85);
  --sh-card-hover:0 28px 60px -28px rgba(0,0,0,0.8);
  --sh-menu:0 28px 70px -24px rgba(0,0,0,0.75);

  --stage-bg:#050A1C;
  --stage-bg-2:#08102B;
  --stage-ink:#FFFFFF;
  --stage-muted:rgba(226,234,255,0.72);
  --stage-faint:rgba(226,234,255,0.5);
  --stage-accent:#6FD3FF;
  --stage-grid:rgba(120,160,255,0.06);
  --stage-card:rgba(255,255,255,0.035);
  --stage-card-2:rgba(255,255,255,0.055);
  --stage-line:rgba(255,255,255,0.09);
  --stage-line-strong:rgba(255,255,255,0.16);
  --stage-media:#0A1230;
  --stage-glow-a:rgba(0,174,255,0.18);
  --stage-glow-b:rgba(91,76,255,0.14);
  --stage-shadow:0 34px 80px -46px rgba(0,0,0,0.9);
  --stage-ghost-bg:rgba(255,255,255,0.06);
  --stage-ghost-line:rgba(255,255,255,0.26);
  --stage-spoke:rgba(180,200,255,0.16);
  --stage-hub-a:#21408F;
  --stage-hub-b:#0B1640;
}

html.themeable[data-theme="dark"] .callout.is-error{background:#2A1015;border-color:#4C1E26;}
html.themeable[data-theme="dark"] .callout.is-success{border-color:var(--good-line);}