/* Generated from tokens.json. Do not edit directly. */
:root {
  --color-canvas: #F8F3EB;
  --color-surface: #FFFCF7;
  --color-surface-subtle: #EEE3D5;
  --color-text: #352A24;
  --color-text-muted: #685B50;
  --color-brand: #8D432D;
  --color-brand-hover: #713421;
  --color-on-brand: #FFFFFF;
  --color-accent: #D7B58D;
  --color-on-accent: #352A24;
  --color-border: #D7C8B8;
  --color-border-control: #8A7665;
  --color-focus: #77422F;
  --color-success: #486047;
  --color-success-bg: #EDF1E7;
  --color-warning: #79501F;
  --color-warning-bg: #FBF0DB;
  --color-danger: #9D3038;
  --color-danger-bg: #FBEDEF;
  --font-body: "Source Sans 3", Arial, sans-serif;
  --font-data: "Source Sans 3", Arial, sans-serif;
  --text-xs: 0.875rem;
  --text-sm: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.25rem;
  --text-h3: 1.5rem;
  --text-h2: clamp(1.75rem, 1.25rem + 1.5vw, 2.5rem);
  --text-hero: clamp(2.5rem, 1.6rem + 3vw, 4.5rem);
  --text-product-title: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem);
  --text-price: clamp(1.5rem, 1.3rem + 0.7vw, 2rem);
  --line-body: 1.5;
  --line-heading: 1.08;
  --line-label: 1.3;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --content-max: 1280px;
  --reading-max: 68ch;
  --control-min: 44px;
  --control-primary: 48px;
  --header-mobile: 56px;
  --header-desktop: 64px;
  --radius-small: 4px;
  --radius-pill: 999px;
  --border-width: 1px;
  --focus-width: 2px;
  --focus-offset: 3px;
  --z-header: 30;
  --z-filters: 20;
  --z-tray: 40;
  --z-overlay: 60;
  --z-modal: 70;
  --duration-fast: 120ms;
  --duration-normal: 180ms;
  --duration-slow: 240ms;
  --ease-standard: cubic-bezier(.2,0,0,1);
  --font-display: "Newsreader", Georgia, serif;
  --weight-display: 500;
  --tracking-display: -0.02em;
  --radius-card: 8px;
  --radius-control: 8px;
  --shadow-overlay: 0 12px 36px rgba(53,42,36,.12);
}

/* Breakpoints (media queries do not use CSS custom properties):
   sm: 640px
   md: 960px
   lg: 1280px
*/
