/* Copied from app/src/styles/tokens.css by build.mjs. Do not edit here. */
/* Bargain bin palette: sun-faded paper, teal and rust. See docs/DESIGN.md. */

:root {
  --ground: #e8dfcd;
  --surface: #f0e9db;
  --surface-deep: #ded3bf;
  --anchor: #2e6d69;
  --on-anchor: #fbf3e6;
  --on-anchor-muted: rgba(251, 243, 230, 0.75);
  --light: #b04828;
  --light-hover: #bd5232;
  --on-light: #fbf3e6;
  --ink: #26302f;
  --muted: #575f5d;
  --rule: rgba(38, 48, 47, 0.13);
  --rule-strong: rgba(38, 48, 47, 0.26);
  --hover: rgba(38, 48, 47, 0.06);
  --press: rgba(38, 48, 47, 0.1);
  --selected: rgba(38, 48, 47, 0.08);
  --gm-surface: #eadbcb;
  --gm-edge: #c2512f;
  --gm-hatch: rgba(194, 81, 47, 0.08);
  --focus: #c2512f;
  --scrim: rgba(38, 48, 47, 0.42);

  /* Display type: the title colour, its printed drop, labels and marks. */
  --title: #2e6d69;
  --title-drop: #e9b9a3;
  --rubric: #a3412a;
  --mark: #c2512f;

  /* The sidebar is teal tweed in both schemes. */
  --side-bg: #2a4a47;
  --side-ink: #f4eee3;
  --side-muted: #c9c8bd;
  --side-rule: rgba(244, 238, 227, 0.14);
  --side-label: #f2a27f;
  --side-current-ink: #f2a27f;
  --plate: #1b2e2c;
  --plate-ink: #f2a27f;

  --tex-paper: url('textures/paper-light.svg');
  --tex-card: url('textures/card-light.svg');
  --tex-mottle: url('textures/mottle-light.svg');

  --accent-done: #4e7a3a;
  --accent-danger: #d9533c;
  --accent-open: #e0a91c;
  --accent-rare: #3f6fb8;
  --accent-epic: #8a2f8e;
  --danger-ink: #a8321e;

  --radius: 4px;
  --radius-inner: 3px;
  --radius-small: 3px;
  --pill: 999px;

  --font-display: 'Pirata One', 'Iowan Old Style', Georgia, serif;
  --font-text: 'Alegreya', 'Iowan Old Style', Georgia, serif;
  --font-ui: 'Alegreya Sans', 'Avenir Next', 'Segoe UI', system-ui, sans-serif;
  --font-sc: 'Alegreya Sans SC', 'Alegreya Sans', 'Avenir Next', system-ui, sans-serif;
  --font-label: 'Alegreya SC', 'Alegreya', Georgia, serif;

  --sidebar: 296px;
  --measure: 720px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --ground: #1c2423;
    --surface: #243030;
    --surface-deep: #172020;
    --anchor: #e8825f;
    --on-anchor: #172020;
    --on-anchor-muted: rgba(23, 32, 32, 0.7);
    --light: #e8825f;
    --light-hover: #ee9474;
    --on-light: #172020;
    --ink: #e8dfcd;
    --muted: #a3aba6;
    --rule: rgba(232, 223, 205, 0.11);
    --rule-strong: rgba(232, 223, 205, 0.22);
    --hover: rgba(232, 223, 205, 0.06);
    --press: rgba(232, 223, 205, 0.1);
    --selected: rgba(232, 223, 205, 0.08);
    --gm-surface: #222c2b;
    --gm-edge: #e8825f;
    --gm-hatch: rgba(232, 130, 95, 0.08);
    --focus: #e8825f;
    --scrim: rgba(4, 8, 8, 0.6);
    --title: #e8825f;
    --title-drop: #3a2e2a;
    --rubric: #e8825f;
    --mark: #6fb3ac;
    --side-bg: #23403d;
    --plate: #121a19;
    --tex-paper: url('textures/paper-dark.svg');
    --tex-card: url('textures/card-dark.svg');
    --tex-mottle: url('textures/mottle-dark.svg');
    --accent-done: #7fb26a;
    --accent-rare: #7aa4e6;
    --accent-epic: #c98ad3;
    --danger-ink: #f08a72;
    color-scheme: dark;
  }
}

:root[data-theme='dark'] {
  --ground: #1c2423;
  --surface: #243030;
  --surface-deep: #172020;
  --anchor: #e8825f;
  --on-anchor: #172020;
  --on-anchor-muted: rgba(23, 32, 32, 0.7);
  --light: #e8825f;
  --light-hover: #ee9474;
  --on-light: #172020;
  --ink: #e8dfcd;
  --muted: #a3aba6;
  --rule: rgba(232, 223, 205, 0.11);
  --rule-strong: rgba(232, 223, 205, 0.22);
  --hover: rgba(232, 223, 205, 0.06);
  --press: rgba(232, 223, 205, 0.1);
  --selected: rgba(232, 223, 205, 0.08);
  --gm-surface: #222c2b;
  --gm-edge: #e8825f;
  --gm-hatch: rgba(232, 130, 95, 0.08);
  --focus: #e8825f;
  --scrim: rgba(4, 8, 8, 0.6);
  --title: #e8825f;
  --title-drop: #3a2e2a;
  --rubric: #e8825f;
  --mark: #6fb3ac;
  --side-bg: #23403d;
  --plate: #121a19;
  --tex-paper: url('textures/paper-dark.svg');
  --tex-card: url('textures/card-dark.svg');
  --tex-mottle: url('textures/mottle-dark.svg');
  --accent-done: #7fb26a;
  --accent-rare: #7aa4e6;
  --accent-epic: #c98ad3;
  --danger-ink: #f08a72;
  color-scheme: dark;
}