:root {
  color-scheme: light;
  --primary: 69, 52, 34;
  --primary-deep: 52, 39, 25;
  --secondary: 120, 113, 103;
  --on-primary: 244, 239, 231;
  --bg: 245, 241, 234;
  --bg-raised: 236, 230, 220;
  --surface-strong: 225, 218, 206;
  --surface-lit: 214, 206, 193;
  --text: 52, 47, 41;
  --heading: 38, 38, 35;
  --muted: 105, 98, 88;
  --line: 216, 205, 189;
  --frame: 187, 147, 106;
  --accent: 187, 147, 106;
  --accent-text: 128, 97, 56;
  --wood: 118, 102, 90;
  --brand-brown: 69, 52, 34;
  --brand-beige: 216, 199, 170;
  --whatsapp: 244, 239, 231;
  --placeholder: 225, 218, 206;
  --swatch-bg: 255, 255, 255;
  --gradient: linear-gradient(90deg, rgb(166, 132, 86), rgb(200, 169, 126));
  --radius: 0;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-heading: "Inter Tight", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-accent: "Allison", cursive;
  --space-xs: 0.25rem;
  --space-s: 0.5rem;
  --space-m: 1rem;
  --space-l: 2rem;
  --space-xl: 4rem;
  --space-2xl: 8rem;
  --width-max: 76rem;
  --reading-width: 60ch;
  --text-label: 0.8125rem;
  --text-button: 0.875rem;
}

.tone-dark {
  color-scheme: dark;
  --primary: 217, 175, 102;
  --primary-deep: 232, 198, 140;
  --on-primary: 38, 38, 35;
  --bg: 38, 38, 35;
  --bg-raised: 46, 45, 42;
  --surface-strong: 56, 54, 50;
  --surface-lit: 48, 43, 37;
  --text: 222, 216, 205;
  --heading: 244, 239, 231;
  --muted: 163, 155, 143;
  --line: 82, 69, 64;
  --frame: 155, 144, 133;
  --accent: 217, 175, 102;
  --accent-text: 217, 175, 102;
  --whatsapp: 38, 38, 35;
  --swatch-bg: 255, 255, 255;
  background: rgb(var(--bg));
  color: rgb(var(--text));
}

.tone-brown {
  color-scheme: dark;
  --primary: 217, 175, 102;
  --primary-deep: 232, 198, 140;
  --on-primary: 38, 28, 18;
  --bg: 69, 52, 34;
  --bg-raised: 78, 60, 40;
  --surface-strong: 88, 68, 46;
  --surface-lit: 100, 78, 54;
  --text: 232, 222, 206;
  --heading: 247, 240, 228;
  --muted: 205, 190, 170;
  --line: 104, 83, 60;
  --frame: 122, 99, 74;
  --accent: 217, 175, 102;
  --accent-text: 222, 184, 118;
  --whatsapp: 38, 28, 18;
  background: rgb(var(--bg));
  color: rgb(var(--text));
}
