:root {
  color-scheme: light;

  --typeface-sans: 'Onest', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --typeface-mono: 'JetBrains Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;
  --mono-scale: 0.9em;

  --text-14: 0.875rem;
  --text-15: 0.9375rem;
  --text-16: 1rem;
  --text-17: 1.0625rem;
  --text-18: 1.125rem;
  --text-20: 1.25rem;
  --text-24: 1.5rem;
  --text-32: 2rem;
  --text-44: 2.75rem;
  --text-56: 3.5rem;
  --text-68: 4.25rem;
  --text-80: 5rem;
  --leading-body: 1.55;
  --leading-heading: 1.2;
  --leading-display: 1.04;
  --tracking-heading: -0.025em;
  --tracking-display: -0.04em;

  --space-4: 0.25rem;
  --space-8: 0.5rem;
  --space-12: 0.75rem;
  --space-16: 1rem;
  --space-20: 1.25rem;
  --space-24: 1.5rem;
  --space-32: 2rem;
  --space-48: 3rem;
  --space-64: 4rem;
  --space-96: 6rem;

  --radius-small: 8px;
  --radius-medium: 12px;
  --radius-large: 20px;
  --radius-sheet: 28px;
  --radius-pill: 999px;
  --focus-width: 2px;
  --focus-offset: 2px;
  --duration-hover: 0.12s;

  --control-height: 2.5rem;
  --control-height-small: 2rem;
  --control-height-large: 3.5rem;
  --row-height: 3rem;
  --row-height-total: 3.25rem;
  --frame-max: 80rem;
  --frame-narrow: 38rem;
  --frame-gutter: clamp(1rem, 3vw, 2rem);

  --shade: 20 32 26;
  --shade-inset: 0.14;
  --shade-lift: 0.32;
  --shade-sheet: 0.34;

  --color-canvas: #e3e8e5;
  --color-surface: #f8faf9;
  --color-surface-raised: #ffffff;
  --color-surface-lowered: #eef2f0;
  --color-well: #e6ebe8;
  --color-ink: #14201a;
  --color-ink-soft: #34413a;
  --color-ink-muted: #535f59;
  --color-edge: #78827d;
  --color-rule: #dfe3e1;
  --color-glint: #ffffff;
  --color-perforation: #b4b9b6;
  --color-accent: #0e6b55;
  --color-accent-hover: #16806a;
  --color-accent-edge: #094c3c;
  --color-accent-ink: #0b5b48;
  --color-accent-subtle: #e5efec;
  --color-on-accent: #ffffff;
  --color-warning: #8a5b00;
  --color-warning-ink: #4a3406;
  --color-warning-surface: #f7eed9;
  --color-warning-edge: #ddcba5;
  --color-danger: #a8231b;
  --color-danger-surface: #fbeceb;
  --color-qr-surface: #ffffff;

  --color-status-open: #14201a;
  --color-status-confirming: #2456a6;
  --color-status-partial: #8a5b00;
  --color-status-paid: #0b5b48;
  --color-status-overpaid: #7a2d68;
  --color-status-expired: #535f59;
  --color-status-cancelled: #a8231b;

  --color-chart-1: #0e6b55;
  --color-chart-2: #a86f00;
  --color-chart-3: #2f62b8;
  --color-chart-4: #8a3a78;
  --color-chart-5: #78827d;
  --color-chart-6: #14201a;
  --color-chart-grid: #dfe3e1;
  --color-chart-text: #535f59;

  --shadow-glint: inset 0 1px 0 var(--color-glint);
  --shadow-inset: inset 0 1px 2px rgb(var(--shade) / var(--shade-inset)), inset 0 0 0 1px rgb(var(--shade) / 0.05), inset 0 -1px 0 var(--color-glint);
  --shadow-lift: 0 0 0 1px rgb(var(--shade) / 0.06), 0 1px 2px rgb(var(--shade) / 0.1), 0 10px 24px -12px rgb(var(--shade) / var(--shade-lift));
  --shadow-sheet: 0 2px 6px rgb(var(--shade) / 0.06), 0 30px 56px -22px rgb(var(--shade) / var(--shade-sheet));
  --shadow-card: 0 1px 3px rgb(var(--shade) / 0.06), 0 14px 26px -14px rgb(var(--shade) / var(--shade-lift));
  --shadow-raised: var(--shadow-glint), inset 0 -2px 0 rgb(var(--shade) / 0.07), 0 0 0 1px var(--color-edge), var(--shadow-lift);
  --shadow-chosen: var(--shadow-glint), 0 0 0 1px rgb(var(--shade) / 0.08), var(--shadow-lift);
  --shadow-field: inset 0 0 0 1px var(--color-edge), inset 0 2px 3px rgb(var(--shade) / var(--shade-inset));
  --shadow-accent: inset 0 1px 0 rgb(255 255 255 / 0.2), inset 0 -2px 0 rgb(0 0 0 / 0.16), 0 0 0 1px var(--color-accent-edge), var(--shadow-lift);
  --groove: inset 0 1px 0 var(--color-rule), inset 0 2px 0 var(--color-glint);
  --raise: linear-gradient(var(--color-surface-raised), var(--color-surface-lowered));
  --raise-accent: linear-gradient(var(--color-accent-hover), var(--color-accent));
}
