/* Raven's colours and type, defined once. Taken from the marketing page (raven-black plum, the blue-green-violet
   sheen on a raven's feathers, the amber eye). Dark is the default whatever the device says; light is offered in
   the accessibility panel and uses the same names. Contrast for every pair the dashboard uses is checked by
   tests/ui/contrast.test.js, so add new pairs there when you add tokens. */
:root {
  --bg: #0c0810;
  --bg-2: #120c17;
  --panel: #18111e;
  --panel-2: #1f1727;
  --line: #2c2236;
  --line-strong: #73608a;
  --ink: #f1ecf4;
  --ink-2: #cbc1d3;
  --mute: #a194ab;

  --plum: #6b3f7d;
  --plum-hover: #7b4a8f;
  --plum-line: #84529a;
  --plum-ink: #c9a6d8;
  --plum-wash: #22152b;

  /* the feather sheen: thin accents only (rules, markers, chart strokes), never fills behind text */
  --sheen-violet: #7a52a8;
  --sheen-blue: #4f7fae;
  --sheen-green: #4a9b85;

  /* the raven's eye: the one most important action on a screen, and keyboard focus */
  --amber: #ffb21e;
  --amber-hover: #ffc24d;
  --on-amber: #1a1003;
  --focus: #ffb21e;

  --ok: #7cc7a4;
  --ok-wash: #12261d;
  --bad: #f0907c;
  --bad-wash: #2c1414;
  --bad-line: #8f3b2c;

  --font: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --serif: 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif;
  --mono: ui-monospace, 'Cascadia Mono', Consolas, 'Liberation Mono', monospace;

  --radius: 8px;
  --radius-sm: 5px;
  --wrap: 1180px;
  color-scheme: dark;
}

/* Light, only when chosen ("Light", or "Device" on a light device). */
:root[data-theme="light"] {
  --bg: #f7f4f8; --bg-2: #efe9f1; --panel: #ffffff; --panel-2: #f6f1f8; --line: #ddd2e3; --line-strong: #8a7a94;
  --ink: #1a1220; --ink-2: #3b2f44; --mute: #5f5268;
  --plum: #6b3f7d; --plum-hover: #5c336c; --plum-line: #5c336c; --plum-ink: #5a2f6b; --plum-wash: #f1e7f5;
  --sheen-violet: #6a4596; --sheen-blue: #3b6894; --sheen-green: #2f7a66;
  --amber: #ffb21e; --amber-hover: #f0a000; --on-amber: #1a1003; --focus: #9a5b00;
  --ok: #1e6b47; --ok-wash: #e2f2ea; --bad: #a83a24; --bad-wash: #fbe9e5; --bad-line: #d79a8c;
  color-scheme: light;
}
@media (prefers-color-scheme: light) {
  :root[data-theme="device"] {
    --bg: #f7f4f8; --bg-2: #efe9f1; --panel: #ffffff; --panel-2: #f6f1f8; --line: #ddd2e3; --line-strong: #8a7a94;
    --ink: #1a1220; --ink-2: #3b2f44; --mute: #5f5268;
    --plum: #6b3f7d; --plum-hover: #5c336c; --plum-line: #5c336c; --plum-ink: #5a2f6b; --plum-wash: #f1e7f5;
    --sheen-violet: #6a4596; --sheen-blue: #3b6894; --sheen-green: #2f7a66;
    --amber: #ffb21e; --amber-hover: #f0a000; --on-amber: #1a1003; --focus: #9a5b00;
    --ok: #1e6b47; --ok-wash: #e2f2ea; --bad: #a83a24; --bad-wash: #fbe9e5; --bad-line: #d79a8c;
    color-scheme: light;
  }
}

/* Higher contrast: brighter text and stronger lines, in both themes. */
:root.a11y-contrast { --ink: #ffffff; --ink-2: #f3eef6; --mute: #dcd2e4; --line: #6d5a7c; --line-strong: #9b86aa; --plum-ink: #e6d2ef; --bg: #050307; }
:root.a11y-contrast[data-theme="light"] { --ink: #000000; --ink-2: #140c19; --mute: #33283b; --line: #6d5a7c; --line-strong: #3d2f48; --plum-ink: #3f1f4d; --bg: #ffffff; }
@media (prefers-color-scheme: light) {
  :root.a11y-contrast[data-theme="device"] { --ink: #000000; --ink-2: #140c19; --mute: #33283b; --line: #6d5a7c; --line-strong: #3d2f48; --plum-ink: #3f1f4d; --bg: #ffffff; }
}

:root[data-text="1"] { font-size: 112.5%; }
:root[data-text="2"] { font-size: 125%; }
:root[data-text="3"] { font-size: 140%; }
:root.a11y-font { --font: Verdana, Tahoma, 'Segoe UI', sans-serif; --serif: Verdana, Tahoma, 'Segoe UI', sans-serif; }