:root {
  --bl-void: #0e0b0a;
  --bl-night: #17100f;
  --bl-wine: #451317;
  --bl-carmine: #a92a2f;
  --bl-ember: #d94b45;
  --bl-ivory: #f3e8d2;
  --bl-muted: #b9a58b;
  --bl-antique-gold: #b88947;
  --bl-gold-soft: #d7b36a;

  --bl-radius-sm: 8px;
  --bl-radius-md: 14px;
  --bl-radius-lg: 24px;

  --bl-shadow-ritual: 0 0 44px rgb(169 42 47 / 18%);
  --bl-shadow-gold: 0 0 28px rgb(215 179 106 / 16%);

  --bl-font-display: Fraunces, "Cormorant Garamond", Georgia, serif;
  --bl-font-ui: Inter, Manrope, Arial, sans-serif;
}

.bl-surface {
  background:
    radial-gradient(circle at 50% 0%, rgb(169 42 47 / 18%), transparent 34rem),
    linear-gradient(180deg, var(--bl-void), var(--bl-night));
  color: var(--bl-ivory);
}

.bl-field-input {
  border: 1px solid rgb(184 137 71 / 48%);
  background: rgb(14 11 10 / 82%);
  color: var(--bl-ivory);
  box-shadow: inset 0 0 0 1px rgb(243 232 210 / 5%);
}

.bl-field-input:focus-within {
  border-color: var(--bl-carmine);
  box-shadow: var(--bl-shadow-ritual), inset 0 0 0 1px rgb(215 179 106 / 18%);
}

.bl-primary-cta {
  background: linear-gradient(135deg, var(--bl-carmine), var(--bl-wine));
  color: var(--bl-ivory);
  box-shadow: var(--bl-shadow-ritual);
}

.bl-reading-panel {
  border: 1px solid rgb(184 137 71 / 32%);
  background: linear-gradient(180deg, rgb(23 16 15 / 92%), rgb(14 11 10 / 96%));
  box-shadow: 0 20px 80px rgb(0 0 0 / 32%);
}