@charset "UTF-8";

:root {
  color-scheme: light;
  --color-bg: #faf8f5;
  --color-bg-secondary: #f5f3ef;
  --color-text: #2c2c28;
  --color-text-soft: #5a5a56;
  --color-border: #d4d0c8;
  --color-border-soft: #e8e5df;
  --color-muted: #8a8a86;
  --color-accent: #6b6b67;
  --color-accent-soft: #9a9a96;
  --color-surface: rgba(212, 208, 200, 0.15);
  --color-surface-strong: rgba(212, 208, 200, 0.25);
  --shadow-soft: 0 8px 24px rgba(44, 44, 40, 0.06);
  --shadow-medium: 0 12px 32px rgba(44, 44, 40, 0.1);
  --shadow-strong: 0 16px 48px rgba(44, 44, 40, 0.15);
  --color-uncanny: #8b7355;
  --color-uncanny-soft: rgba(139, 115, 85, 0.2);
}

html.dark-mode {
  color-scheme: dark;
  --color-bg: #1a1a18;
  --color-bg-secondary: #1f1f1d;
  --color-text: #e8e6e2;
  --color-text-soft: #c8c6c2;
  --color-border: #3a3834;
  --color-border-soft: #2f2d29;
  --color-muted: #9a9894;
  --color-accent: #b8b6b2;
  --color-accent-soft: #8a8884;
  --color-surface: rgba(200, 198, 194, 0.08);
  --color-surface-strong: rgba(200, 198, 194, 0.15);
  --shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.4);
  --shadow-medium: 0 12px 32px rgba(0, 0, 0, 0.5);
  --shadow-strong: 0 16px 48px rgba(0, 0, 0, 0.6);
  --color-uncanny: #a68b6b;
  --color-uncanny-soft: rgba(166, 139, 107, 0.25);
}