:root {
  color-scheme: light;
  --paper: #f4f1e8;
  --paper-bright: #fbf9f2;
  --paper-dim: #e6e2d7;
  --ink: #1d221f;
  --ink-soft: #37403a;
  --slate: #5d6962;
  --silver: #dad7cc;
  --silver-dark: #a7aaa1;
  --cobalt: #3f6254;
  --cobalt-deep: #36584b;
  --cobalt-pale: #dde6df;
  --coral: #c3a15f;
  --coral-pale: #eee4cf;
  --coral-ink: #805a20;
  --chartreuse: #a9b7a5;
  --chartreuse-deep: #3f5548;
  --white: #fffdf8;
  --error: #b92e28;
  --on-dark-muted: #cfd5db;
  --on-dark-subtle: #bcc4cc;
  --outline-light: rgb(255 255 255 / 0.5);
  --line-light: rgb(255 255 255 / 0.18);
  --fill-light-muted: rgb(255 255 255 / 0.3);
  --ink-translucent: rgb(29 34 31 / 0.28);
  --shadow-dark: rgb(0 0 0 / 0.38);
  --field-dark: #1b211e;
  --field-on: #f8f5eb;

  --font-display: "Arial Black", "Arial Narrow", "Helvetica Neue", sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
  --font-label: "Courier New", Courier, monospace;
  --font-ui-2xs: 0.625rem;
  --font-ui-xs: 0.6875rem;
  --font-ui-sm: 0.75rem;
  --font-ui-md: 0.875rem;
  --font-ui-base: 1rem;
  --font-ui-lg: 1.125rem;
  --font-ui-xl: 1.375rem;
  --font-ui-2xl: 1.625rem;
  --font-ui-display-sm: 2rem;
  --font-ui-title: 2.5rem;

  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1.25rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --space-7: 6rem;
  --space-8: 9rem;

  --radius-control: 0.375rem;
  --radius-frame: 0.875rem;
  --shadow-frame: 12px 16px 36px rgb(29 34 31 / 0.13);
  --shadow-small: 5px 7px 18px rgb(29 34 31 / 0.11);
  --page-gutter: clamp(1rem, 4vw, 4.5rem);
  --page-max: 100rem;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-short: 180ms;
  --duration-long: 720ms;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #111613;
  --paper-bright: #19201c;
  --paper-dim: #252d28;
  --ink: #f1eee4;
  --ink-soft: #d5d9d2;
  --slate: #a7b0a9;
  --silver: #313a34;
  --silver-dark: #56635b;
  --cobalt: #405f52;
  --cobalt-deep: #aab9ae;
  --cobalt-pale: #26372f;
  --coral: #d1ac68;
  --coral-pale: #403721;
  --coral-ink: #d9b873;
  --chartreuse: #b0bba8;
  --chartreuse-deep: #c1cbb8;
  --white: #1b231f;
  --error: #ff7b72;
  --on-dark-muted: #cfd5db;
  --on-dark-subtle: #bcc4cc;
  --outline-light: rgb(255 255 255 / 0.56);
  --line-light: rgb(255 255 255 / 0.2);
  --fill-light-muted: rgb(255 255 255 / 0.22);
  --ink-translucent: rgb(241 238 228 / 0.22);
  --shadow-dark: rgb(0 0 0 / 0.58);
  --field-dark: #0c100e;
  --field-on: #f6f2e8;
  --shadow-frame: 12px 16px 36px rgb(0 0 0 / 0.4);
  --shadow-small: 5px 7px 18px rgb(0 0 0 / 0.34);
}