/* Theme default - tokens.css: colours, fonts, spacing and radii for the dark and light palettes. */
:root {
  color-scheme: dark;

  --primary-rgb: 240 169 46;
  --ink-rgb: 232 238 247;
  --steel-rgb: 127 158 196;
  --danger-rgb: 239 106 90;
  --ok-rgb: 78 201 138;
  --surface-rgb: 23 27 33;
  --raise-rgb: 36 42 51;

  --bg: #0e1013;
  --bg-2: #14171c;
  --surface: rgb(var(--surface-rgb) / 0.62);
  --surface-solid: #191d23;
  --raise: #1e232b;

  --text: #eef2f8;
  --text-strong: #ffffff;
  --muted: #99a3b3;
  --dim: #6b7484;

  --line: rgb(var(--ink-rgb) / 0.09);
  --line-strong: rgb(var(--ink-rgb) / 0.2);

  --primary: #f0a92e;
  --primary-tint: #f5c76a;
  --primary-shade: #d98a1a;
  --on-primary: #16181d;
  --steel: #7f9ec4;
  --danger: #ef6a5a;
  --ok: #4ec98a;
  --focus: var(--primary);

  --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
  --display: var(--sans);
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --wrap: 1180px;
  --gap: clamp(1rem, 2.5vw, 1.75rem);
  --pad-y: clamp(3rem, 6vw, 5.5rem);
  --r-s: 8px;
  --r-m: 12px;
  --r-l: 18px;
  --shadow: 0 24px 60px -34px rgb(0 0 0 / 0.9);

  --void: var(--bg);
  --abyss: var(--bg-2);
  --panel: var(--surface);
  --panel-solid: var(--surface-solid);
  --violet: var(--primary);
  --indigo: var(--primary-shade);
  --cyan: var(--primary);
  --aurora: var(--primary);
  --flare: var(--danger);
}

[data-theme="light"] {
  color-scheme: light;

  --primary-rgb: 143 84 5;
  --ink-rgb: 24 28 36;
  --steel-rgb: 70 100 138;
  --surface-rgb: 255 255 255;
  --raise-rgb: 255 255 255;

  --bg: #eaeef4;
  --bg-2: #f5f7fa;
  --surface: #ffffff;
  --surface-solid: #ffffff;
  --raise: #ffffff;

  --text: #181c24;
  --text-strong: #000000;
  --muted: #4c5566;
  --dim: #5f6a7d;

  --line: rgb(var(--ink-rgb) / 0.14);
  --line-strong: rgb(var(--ink-rgb) / 0.3);

  --primary: #8f5405;
  --primary-tint: #b06a08;
  --primary-shade: #6b3f03;
  --on-primary: #ffffff;
  --steel: #46648a;
  --danger: #b5342a;
  --ok: #1c7d45;

  --shadow: 0 10px 28px -18px rgb(24 28 36 / 0.3);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;

    --primary-rgb: 143 84 5;
    --ink-rgb: 24 28 36;
    --steel-rgb: 70 100 138;
    --surface-rgb: 255 255 255;
    --raise-rgb: 255 255 255;

    --bg: #eaeef4;
    --bg-2: #f5f7fa;
    --surface: #ffffff;
    --surface-solid: #ffffff;
    --raise: #ffffff;

    --text: #181c24;
    --text-strong: #000000;
    --muted: #4c5566;
    --dim: #5f6a7d;

    --line: rgb(var(--ink-rgb) / 0.14);
    --line-strong: rgb(var(--ink-rgb) / 0.3);

    --primary: #8f5405;
    --primary-tint: #b06a08;
    --primary-shade: #6b3f03;
    --on-primary: #ffffff;
    --steel: #46648a;
    --danger: #b5342a;
    --ok: #1c7d45;

    --shadow: 0 10px 28px -18px rgb(24 28 36 / 0.3);
  }
}

*, *::before, *::after { box-sizing: border-box; }