/* Sacred Novenas v2.1.0 — Option B Design */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,400&family=Cinzel:wght@400;500;600;700&family=Cinzel+Decorative:wght@400;700&display=swap');

:root {
  --deep-navy: #0F1729;
  --rich-burgundy: #5C1A1B;
  --dark-burgundy: #3A0F10;
  --warm-gold: #C9A84C;
  --bright-gold: #E8C64A;
  --pale-gold: #F5E6B8;
  --cream: #F8F0DC;
  --parchment: #EDE0C8;
  --text-dark: #2C1810;
  --text-muted: #7A6B5D;
  --shadow-gold: rgba(201, 168, 76, 0.2);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background: linear-gradient(175deg, #1C1208 0%, #1A1005 30%, #0F0D08 100%);
  color: var(--cream);
  font-family: 'Crimson Text', Georgia, serif;
  min-height: 100vh;
}

/* Atmospheric background overlay */
#root::before {
  content: '';
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(201, 168, 76, 0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 100%, rgba(92, 26, 27, 0.08) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
}

#root { position: relative; z-index: 1; }

/* Loading screen override */
#loading-screen {
  background: linear-gradient(175deg, #1C1208 0%, #1A1005 30%, #0F0D08 100%) !important;
}

#loading-screen h2 {
  font-family: 'Cinzel Decorative', serif !important;
  color: var(--warm-gold) !important;
  letter-spacing: 2px;
}

/* ===== GLASS ICON COLORS ===== */
.glass-red { background: linear-gradient(135deg, rgba(184, 58, 58, 0.2), rgba(92, 26, 27, 0.3)); }
.glass-blue { background: linear-gradient(135deg, rgba(58, 92, 184, 0.2), rgba(27, 42, 74, 0.3)); }
.glass-green { background: linear-gradient(135deg, rgba(58, 139, 92, 0.2), rgba(45, 74, 45, 0.3)); }
.glass-purple { background: linear-gradient(135deg, rgba(107, 58, 184, 0.2), rgba(74, 45, 92, 0.3)); }
.glass-amber { background: linear-gradient(135deg, rgba(184, 138, 58, 0.2), rgba(130, 90, 30, 0.3)); }
.glass-rose { background: linear-gradient(135deg, rgba(184, 58, 92, 0.2), rgba(120, 30, 60, 0.3)); }
.glass-teal { background: linear-gradient(135deg, rgba(58, 160, 160, 0.2), rgba(30, 90, 90, 0.3)); }

/* ===== SCROLLBAR HIDE ===== */
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* ===== ANIMATIONS ===== */
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.fade-in { animation: fadeIn 0.3s ease-out; }