:root {
  --forest-950: #0c1712;
  --forest-900: #132019;
  --forest-800: #1a2c22;
  --forest-700: #25402e;
  --forest-500: #3f6a4a;
  --wood-950: #120d09;
  --wood-900: #1c1410;
  --wood-800: #2a1d16;
  --wood-700: #3a261b;
  --wood-100: #f3ede4;
  --wood-50: #fff9f2;
  --ember-500: #d97a3a;
  --ember-400: #e49a5d;
  --mist-300: #d7d1c6;
}

* {
  box-sizing: border-box;
}

body {
  font-family: 'Inter', system-ui, sans-serif;
  background: radial-gradient(circle at top, rgba(63, 106, 74, 0.2), transparent 55%),
    var(--forest-950);
  color: var(--wood-50);
  min-height: 100vh;
}

h1, h2, h3, h4 {
  font-family: 'Merriweather', serif;
  letter-spacing: -0.02em;
}

.bg-wood-950 { background-color: var(--wood-950); }
.bg-wood-900 { background-color: var(--wood-900); }
.bg-forest-900 { background-color: var(--forest-900); }
.bg-forest-800 { background-color: var(--forest-800); }
.bg-forest-700 { background-color: var(--forest-700); }
.bg-forest-900-70 { background-color: rgba(19, 32, 25, 0.7); }
.bg-forest-800-60 { background-color: rgba(26, 44, 34, 0.6); }
.bg-ember-500-80 { background-color: rgba(217, 122, 58, 0.8); }
.text-wood-50 { color: var(--wood-50); }
.text-wood-100 { color: var(--wood-100); }
.text-mist-300 { color: var(--mist-300); }
.text-ember-500 { color: var(--ember-500); }
.text-ember-400 { color: var(--ember-400); }
.border-forest-700 { border-color: var(--forest-700); }
.border-forest-800 { border-color: var(--forest-800); }
.border-wood-700 { border-color: var(--wood-700); }
.bg-ember-500 { background-color: var(--ember-500); }
.bg-ember-400 { background-color: var(--ember-400); }

.campfire-glow {
  background: radial-gradient(circle, rgba(217, 122, 58, 0.25), transparent 65%);
}

.wood-card {
  background: linear-gradient(135deg, rgba(28, 20, 16, 0.95), rgba(19, 32, 25, 0.75));
  border: 1px solid rgba(63, 106, 74, 0.35);
  box-shadow: 0 18px 45px rgba(8, 12, 10, 0.45);
}

.wood-input {
  background-color: rgba(12, 23, 18, 0.85);
  border: 1px solid rgba(63, 106, 74, 0.4);
  color: var(--wood-50);
}

.wood-input::placeholder {
  color: rgba(215, 209, 198, 0.7);
}

.ember-button {
  background: linear-gradient(135deg, var(--ember-500), var(--ember-400));
  color: var(--wood-50);
  box-shadow: 0 12px 30px rgba(217, 122, 58, 0.3);
}

.grove-pill {
  border: 1px solid rgba(63, 106, 74, 0.6);
  background-color: rgba(19, 32, 25, 0.8);
}

.fade-divider {
  background: linear-gradient(90deg, transparent, rgba(217, 122, 58, 0.35), transparent);
  height: 1px;
}