/* NYMERO Cosmic Ambient v1.0
   Subtle cosmic atmosphere for all pages (except homepage quiz).
   Three intensity levels: light | medium | heavy
   Include after design-system.css */

/* ─── SHARED CONTAINER ─── */
.ca-layer{position:fixed;inset:0;pointer-events:none;z-index:-1;overflow:hidden}
.ca-canvas{position:fixed;inset:0;pointer-events:none;z-index:-2}

/* ─── AMBIENT ORBITS (medium + heavy) ─── */
.ca-orbits{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:-1}
.ca-orbit{position:absolute;top:50%;left:50%;border-radius:50%;border:1px solid rgba(201,168,76,0.05);transform:translate(-50%,-50%)}
.ca-orbit:nth-child(1){width:400px;height:380px;animation:caOrbit 60s linear infinite}
.ca-orbit:nth-child(2){width:700px;height:660px;animation:caOrbit 100s linear infinite reverse;border-color:rgba(201,168,76,0.035)}
.ca-dot{position:absolute;top:-2px;left:50%;border-radius:50%;transform:translateX(-50%)}
.ca-orbit:nth-child(1) .ca-dot{width:3px;height:3px;background:#c9a84c;box-shadow:0 0 8px rgba(201,168,76,0.4)}
.ca-orbit:nth-child(2) .ca-dot{width:2.5px;height:2.5px;background:#a68530;box-shadow:0 0 6px rgba(166,133,48,0.3)}

@keyframes caOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}

/* ─── AMBIENT AURORA (medium + heavy) ─── */
.ca-aurora{position:fixed;inset:0;pointer-events:none;z-index:-1;overflow:hidden}
.ca-aurora-blob{position:absolute;border-radius:50%;filter:blur(120px);will-change:transform;opacity:0.4}
.ca-aurora-blob:nth-child(1){width:500px;height:500px;top:-15%;left:-10%;
  background:radial-gradient(circle,rgba(201,168,76,0.06) 0%,transparent 70%);
  animation:caAurora1 40s ease-in-out infinite}
.ca-aurora-blob:nth-child(2){width:550px;height:550px;bottom:-15%;right:-10%;
  background:radial-gradient(circle,rgba(120,80,40,0.05) 0%,transparent 70%);
  animation:caAurora2 55s ease-in-out infinite}

@keyframes caAurora1{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(40px,30px) scale(1.1)}
  66%{transform:translate(-20px,50px) scale(0.92)}
}
@keyframes caAurora2{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(-35px,-25px) scale(1.08)}
  66%{transform:translate(30px,-40px) scale(0.95)}
}

/* ─── FLOATING PARTICLES (all levels) ─── */
.ca-particles{position:fixed;inset:0;pointer-events:none;z-index:-1;overflow:hidden}
.ca-particle{position:absolute;width:2px;height:2px;border-radius:50%;background:rgba(201,168,76,0.25);
  animation:caFloat var(--dur,20s) linear infinite;
  left:var(--x,50%);top:var(--y,100%)}
.ca-particle:nth-child(odd){background:rgba(201,168,76,0.18);width:1.5px;height:1.5px}

@keyframes caFloat{
  0%{transform:translateY(0) translateX(0);opacity:0}
  10%{opacity:1}
  90%{opacity:1}
  100%{transform:translateY(calc(-100vh - 40px)) translateX(var(--drift,20px));opacity:0}
}

/* ─── SHOOTING STAR (triggered via JS) ─── */
.ca-shooting-star{position:fixed;top:15%;left:-10%;width:100px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(201,168,76,0.6),transparent);
  transform:rotate(-15deg);pointer-events:none;z-index:1;
  animation:caStar 1.2s ease-out forwards;opacity:0}

@keyframes caStar{
  0%{opacity:0;transform:rotate(-15deg) translateX(0)}
  15%{opacity:1}
  100%{opacity:0;transform:rotate(-15deg) translateX(110vw)}
}

/* ─── BURST PARTICLES (triggered via JS) ─── */
.ca-burst{position:fixed;pointer-events:none;z-index:2}
.ca-burst-dot{position:absolute;width:3px;height:3px;border-radius:50%;
  background:var(--burst-color,#c9a84c);
  animation:caBurst 0.8s ease-out forwards}

@keyframes caBurst{
  0%{transform:translate(0,0) scale(1);opacity:1}
  100%{transform:translate(var(--bx,30px),var(--by,-40px)) scale(0);opacity:0}
}

/* ─── GLOW PULSE (CSS-only, for hero numbers) ─── */
.ca-glow-pulse{animation:caGlow 3s ease-in-out infinite}
@keyframes caGlow{
  0%,100%{text-shadow:0 0 20px rgba(201,168,76,0.15)}
  50%{text-shadow:0 0 40px rgba(201,168,76,0.3),0 0 80px rgba(201,168,76,0.1)}
}

/* ─── HEAVY: boost aurora opacity ─── */
[data-cosmic="heavy"] .ca-aurora-blob{opacity:0.6}
[data-cosmic="heavy"] .ca-orbit{border-color:rgba(201,168,76,0.07)}
[data-cosmic="heavy"] .ca-orbit:nth-child(2){border-color:rgba(201,168,76,0.05)}

/* ─── IDLE STATE: dim ambient when user reads content ─── */
.ca-idle .ca-orbit,.ca-idle .ca-aurora-blob,.ca-idle .ca-particle{
  animation-play-state:paused!important;
  transition:opacity 2s ease;
  opacity:0.15!important}
.ca-idle .ca-canvas{transition:opacity 2s ease;opacity:0.2}
.ca-idle .ca-orbits{transition:opacity 2s ease;opacity:0.3}
/* Wake: smooth return */
.ca-orbits,.ca-aurora-blob,.ca-particle,.ca-canvas{transition:opacity 1.5s ease}

/* ─── REDUCED MOTION ─── */
@media(prefers-reduced-motion:reduce){
  .ca-layer,.ca-canvas,.ca-orbits,.ca-aurora,.ca-particles,
  .ca-shooting-star,.ca-burst,.ca-glow-pulse{
    animation:none!important;
    display:none!important}
}

/* ─── MOBILE: reduce aurora size ─── */
@media(max-width:600px){
  .ca-aurora-blob:nth-child(1){width:300px;height:300px}
  .ca-aurora-blob:nth-child(2){width:320px;height:320px}
  .ca-orbit:nth-child(2){display:none}
}