:root {
  color-scheme: light;
  --tf-background: #fff8f6;
  --tf-surface: #fff8f6;
  --tf-surface-lowest: #ffffff;
  --tf-surface-low: #fff1eb;
  --tf-surface-high: #fee3d8;
  --tf-surface-highest: #f8ddd2;
  --tf-surface-container: #ffeae1;
  --tf-ink: #261812;
  --tf-ink-muted: #5a4136;
  --tf-outline: #8e7164;
  --tf-outline-soft: #e2bfb0;
  --tf-primary: #a04100;
  --tf-primary-bright: #ff6b00;
  --tf-primary-soft: #ffdbcc;
  --tf-success: #0e6d3b;
  --tf-success-soft: #9cf2b4;
  --tf-warning: #785900;
  --tf-warning-bright: #c19100;
  --tf-warning-soft: #fff0c2;
  --tf-error: #ba1a1a;
  --tf-error-soft: #ffdad6;
  --tf-white: #ffffff;
  --tf-radius-sm: 8px;
  --tf-radius-md: 12px;
  --tf-radius-lg: 16px;
  --tf-radius-xl: 24px;
  --tf-shadow-soft: 0 6px 20px rgba(38, 24, 18, 0.12);
  --tf-shadow-card: 0 12px 32px rgba(160, 65, 0, 0.18);
  --tf-shadow-glow: 0 10px 32px rgba(255, 107, 0, 0.32);
  --tf-font: 'Hanken Grotesk', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --tf-motion-fast: 140ms;
  --tf-motion-standard: 220ms;
  --tf-motion-easing: cubic-bezier(0.2, 0.8, 0.2, 1);
}