/* ════════════════════════════════════════════════════════════
   🥚 LIMPIAAI v15.0 — OMEGA EDITION
   Live Mystic Camera · Voice · Insights · Chakras · Numerología
   · Gold Dust Trail. Se apila sobre todas las capas anteriores.
   ════════════════════════════════════════════════════════════ */

/* ═══ ✨ GOLD DUST CANVAS ═══ */
.dust-canvas {
  position: fixed; inset: 0;
  z-index: 9998;
  pointer-events: none;
}

/* ═══ 📹 LIVE CAMERA BUTTON ═══ */
.omega-live-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid rgba(239,68,68,.4) !important;
}
.live-dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 0 8px rgba(239,68,68,.8);
  animation: liveBlink 1.4s ease-in-out infinite;
}
@keyframes liveBlink { 0%,100% { opacity: 1; } 50% { opacity: .35; } }

/* ═══ 📹 LIVE CAMERA MODAL ═══ */
.livecam-modal {
  position: fixed; inset: 0; z-index: 10000;
  background: #000;
  display: none;
}
.livecam-modal.on { display: block; }
.livecam-modal video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.livecam-overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  justify-content: space-between;
  padding: calc(16px + var(--st)) 16px calc(24px + var(--sb));
}
.livecam-top {
  display: flex; align-items: flex-start; gap: 12px;
}
.livecam-close {
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(0,0,0,.55); color: #fff;
  backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; flex-shrink: 0;
  border: 1px solid rgba(255,255,255,.15);
}
.livecam-stability {
  flex: 1;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(8px);
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  padding: 8px 12px;
  font-size: .72rem; color: #e2e8f0;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.stability-bar {
  flex-basis: 100%;
  height: 5px; border-radius: 99px;
  background: rgba(255,255,255,.12);
  overflow: hidden;
}
.stability-fill {
  height: 100%; width: 0%;
  border-radius: 99px;
  background: #fbbf24;
  transition: width .3s ease, background .3s ease;
}

/* Anillo de encuadre central */
.livecam-guide {
  align-self: center;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  pointer-events: none;
}
.guide-ring {
  width: min(62vw, 300px); height: min(62vw, 300px);
  border-radius: 50%;
  border: 2.5px dashed rgba(251,191,36,.75);
  box-shadow:
    0 0 0 2000px rgba(0,0,0,.28),
    0 0 30px rgba(251,191,36,.25) inset;
  animation: guideRot 24s linear infinite;
}
@keyframes guideRot { to { transform: rotate(360deg); } }
.guide-hint {
  font-size: .78rem; color: #fde68a;
  background: rgba(0,0,0,.55);
  padding: 6px 14px; border-radius: 99px;
  backdrop-filter: blur(8px);
}

/* Disparador */
.livecam-bottom { display: flex; justify-content: center; }
.livecam-shutter {
  width: 76px; height: 76px; border-radius: 50%;
  border: 4px solid rgba(255,255,255,.85);
  background: rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: center;
  transition: transform .25s var(--spring, ease), border-color .3s;
}
.livecam-shutter .shutter-inner {
  width: 56px; height: 56px; border-radius: 50%;
  background: #fff;
  transition: background .3s, transform .15s;
}
.livecam-shutter:active .shutter-inner { transform: scale(.85); }
.livecam-shutter.ready {
  border-color: #34d399;
  box-shadow: 0 0 24px rgba(52,211,153,.5);
}
.livecam-shutter.ready .shutter-inner { background: #34d399; }

/* Flash de captura */
.livecam-flash {
  position: absolute; inset: 0;
  background: #fff;
  animation: camFlash .35s ease-out forwards;
  pointer-events: none;
}
@keyframes camFlash { 0% { opacity: .9; } 100% { opacity: 0; } }

/* ═══ 🎙️ VOICE BUTTON ═══ */
#hdr-voice.listening {
  color: #f87171 !important;
  animation: voicePulse 1s ease-in-out infinite;
}
@keyframes voicePulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(239,68,68,.5); }
  50% { box-shadow: 0 0 0 8px rgba(239,68,68,0); }
}

/* ═══ 🧠 INSIGHTS CARD ═══ */
.insights-card {
  background: var(--gc);
  border: 1px solid rgba(139,92,246,.22);
  border-radius: var(--rx);
  padding: 16px;
  margin-bottom: 14px;
  box-shadow: var(--px-clay, var(--sm));
}
.insights-title {
  font-size: .92rem; font-weight: 800;
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-royal, inherit);
}
.insights-title i {
  background: var(--g-gold, none);
  background-size: 220% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: goldFlow 6s linear infinite;
}
.insights-sub { font-size: .68rem; color: var(--t3); margin: 2px 0 12px; }
.insight-row {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 9px 10px;
  border-radius: 14px;
  background: rgba(139,92,246,.06);
  border: 1px solid rgba(139,92,246,.12);
  margin-bottom: 7px;
  font-size: .76rem; line-height: 1.45;
  animation: insightIn .5s var(--spring-soft, ease) both;
}
@keyframes insightIn {
  from { opacity: 0; transform: translateX(-14px); }
  to   { opacity: 1; transform: translateX(0); }
}
.insight-icon { font-size: 1.05rem; flex-shrink: 0; }
.insight-text { color: var(--t2); }
.insight-text strong, .insight-text b { color: var(--gold1, #fde68a); }

/* ═══ 🌈 CHAKRA SECTION ═══ */
.chakra-body { display: flex; flex-direction: column; gap: 10px; }
.chakra-row { display: flex; align-items: center; gap: 10px; }
.chakra-icon { font-size: 1.1rem; flex-shrink: 0; width: 26px; text-align: center; }
.chakra-info { flex: 1; min-width: 0; }
.chakra-name {
  font-size: .72rem; font-weight: 700; margin-bottom: 4px;
  display: flex; align-items: center; gap: 6px;
}
.chakra-freq {
  font-size: .58rem; font-weight: 600;
  color: var(--t3); font-family: var(--mono);
  background: rgba(148,163,184,.08);
  padding: 1px 6px; border-radius: 99px;
}
.chakra-track {
  height: 7px; border-radius: 99px;
  background: rgba(148,163,184,.1);
  overflow: hidden;
}
.chakra-fill {
  height: 100%; border-radius: 99px;
  width: 0;
  animation: chakraGrow 1.2s var(--spring-soft, ease) forwards;
}
@keyframes chakraGrow { from { width: 0 !important; } }
.chakra-val {
  font-size: .7rem; font-weight: 800;
  font-family: var(--mono); flex-shrink: 0; width: 38px; text-align: right;
}
.chakra-tip {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(251,191,36,.07);
  border: 1px dashed rgba(251,191,36,.3);
  font-size: .72rem; color: var(--gold1, #fde68a);
  line-height: 1.5;
}

/* ═══ 🔢 NUMEROLOGY CARD ═══ */
.numer-card {
  display: flex; align-items: center; gap: 14px;
  background: var(--gc);
  border: 1px solid rgba(251,191,36,.25);
  border-radius: var(--rx);
  padding: 14px 16px;
  margin: 0 0 14px;
  box-shadow: var(--px-clay, var(--sm));
}
.numer-badge {
  width: 54px; height: 54px; flex-shrink: 0;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-royal, serif);
  font-size: 1.5rem; font-weight: 900;
  color: #3b2205;
  background: var(--g-gold, linear-gradient(135deg, #fde68a, #d97706));
  background-size: 220% auto;
  animation: goldFlow 6s linear infinite;
  box-shadow:
    0 1px 0 rgba(255,255,255,.4) inset,
    0 -3px 8px rgba(146,64,14,.5) inset,
    0 4px 14px rgba(251,191,36,.3);
}
.numer-title {
  font-size: .78rem; font-weight: 800;
  font-family: var(--font-royal, inherit);
  margin-bottom: 3px;
}
.numer-text { font-size: .7rem; color: var(--t2); line-height: 1.5; }

/* ═══ RESPONSIVE ═══ */
@media (max-width: 380px) {
  .guide-ring { width: 70vw; height: 70vw; }
  .numer-badge { width: 46px; height: 46px; font-size: 1.25rem; }
}

/* ═══ REDUCED MOTION ═══ */
@media (prefers-reduced-motion: reduce) {
  .guide-ring, .live-dot, #hdr-voice.listening,
  .insight-row, .chakra-fill, .numer-badge { animation: none !important; }
  .chakra-fill { width: inherit; }
}