:root {
  --bg: #fbf6ec;
  --bg-soft: #f5ecdb;
  --surface: #ffffff;
  --surface-2: #f7eedf;
  --ink: #2a211a;
  --ink-soft: #55483a;
  --muted: #87766a;
  --line: rgba(42, 33, 26, 0.12);
  --line-strong: rgba(42, 33, 26, 0.26);

  --red: #c8102e;
  --red-deep: #990b22;
  --red-soft: rgba(200, 16, 46, 0.1);
  --amber: #e69a24;
  --gold: #bf7a18;
  --blue: #5a7a3b;
  --blue-soft: rgba(90, 122, 59, 0.12);

  --shadow-sm: 0 1px 2px rgba(42, 33, 26, 0.06), 0 6px 18px rgba(42, 33, 26, 0.07);
  --shadow-lg: 0 4px 12px rgba(42, 33, 26, 0.08), 0 24px 60px rgba(42, 33, 26, 0.14);
  --glow: radial-gradient(1200px 600px at 80% -10%, rgba(200, 16, 46, 0.15), transparent 60%);
  --glow-blue: radial-gradient(900px 500px at 10% 0%, rgba(90, 122, 59, 0.18), transparent 60%);
}

html.theme-dark {
  --bg: #14100c;
  --bg-soft: #1a1510;
  --surface: #1f1913;
  --surface-2: #2a2118;
  --ink: #f6efe4;
  --ink-soft: #cfc3b2;
  --muted: #968878;
  --line: rgba(246, 239, 228, 0.12);
  --line-strong: rgba(246, 239, 228, 0.26);

  --red: #ff4a5a;
  --red-deep: #ff7c88;
  --red-soft: rgba(255, 74, 90, 0.14);
  --amber: #f5b14a;
  --gold: #ffc76b;
  --blue: #a9c48f;
  --blue-soft: rgba(169, 196, 143, 0.14);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 20px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 6px 16px rgba(0, 0, 0, 0.45), 0 30px 70px rgba(0, 0, 0, 0.5);
  --glow: radial-gradient(1200px 600px at 80% -10%, rgba(255, 74, 90, 0.18), transparent 60%);
  --glow-blue: radial-gradient(900px 500px at 10% 0%, rgba(169, 196, 143, 0.14), transparent 60%);
}