:root {
    --brand-primary: #4B352A;
    --brand-secondary: #3A2A1F;
    --brand-accent: #6B4F3A;
    --brand-on-primary: #F5F1EA;
    --brand-bg: #F2F1F0;
    --color-text: #3A2A1F;
    --color-text-muted: #737373;
    --color-border: #D9D1C2;
    --brand-50: #f1efee;
    --brand-100: #e4e1df;
    --brand-200: #c9c2bf;
    --brand-300: #a59a95;
    --brand-400: #78685f;
    --brand-500: #4B352A;
    --brand-600: #402d24;
    --brand-700: #35251d;
    --brand-800: #291d17;
    --brand-900: #1e1511;
    --font-heading: 'DM Sans', system-ui, sans-serif;
    --font-body: 'DM Sans', system-ui, sans-serif;
    --font-mono: 'JetBrains Mono', monospace;
    --font-size-h1: 48px;
    --font-size-h2: 36px;
    --font-size-h3: 28px;
    --font-size-h4: 22px;
    --font-size-body: 16px;
    --font-size-small: 14px;
    --font-size-micro: 12px;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --spacing-unit: 8px;
    --spacing-0: 4px;
    --spacing-1: 8px;
    --spacing-2: 12px;
    --spacing-3: 16px;
    --spacing-4: 24px;
    --spacing-5: 32px;
    --spacing-6: 48px;
    --spacing-7: 64px;
    --spacing-8: 96px;
    --spacing-section: 120px;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 20px;
    --radius-pill: 9999px;
    --radius-preset: md;
    --radius-default-tl: 6px;
    --radius-default-tr: 6px;
    --radius-default-br: 6px;
    --radius-default-bl: 6px;
    --radius-default: 6px 6px 6px 6px;
    --radius-button-tl: 6px;
    --radius-button-tr: 6px;
    --radius-button-br: 6px;
    --radius-button-bl: 6px;
    --radius-button: 6px 6px 6px 6px;
    --radius-image-tl: 10px;
    --radius-image-tr: 10px;
    --radius-image-br: 10px;
    --radius-image-bl: 10px;
    --radius-image: 10px 10px 10px 10px;
    --radius-card-tl: 6px;
    --radius-card-tr: 6px;
    --radius-card-br: 6px;
    --radius-card-bl: 6px;
    --radius-card: 6px 6px 6px 6px;
    --radius-input-tl: 6px;
    --radius-input-tr: 6px;
    --radius-input-br: 6px;
    --radius-input-bl: 6px;
    --radius-input: 6px 6px 6px 6px;
    --radius-modal-tl: 6px;
    --radius-modal-tr: 6px;
    --radius-modal-br: 6px;
    --radius-modal-bl: 6px;
    --radius-modal: 6px 6px 6px 6px;
    --radius-tl: 6px;
    --radius-tr: 6px;
    --radius-br: 6px;
    --radius-bl: 6px;
    --radius-all: 6px 6px 6px 6px;
    --radius-linked: 1;
    --density: comfortable;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.10);
    --shadow-lg: 0 12px 28px rgba(0,0,0,0.12);
}