/* ===================== 🌌 HUD Glassy Theme ===================== */
.hud-panel {
  background: rgba(17, 25, 40, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  border-radius: 12px;
  color: hsl(var(--foreground));
  transition: all 0.25s ease;
}

.hud-panel:hover {
  box-shadow: 0 8px 42px rgba(12, 122, 122, 0.45);
  border-color: rgba(12, 122, 122, 0.25);
}

/* Subtle glow for active HUD */
.hud-panel-active {
  outline: 1px solid rgba(244, 123, 70, 0.35);
  box-shadow: 0 0 20px rgba(244, 123, 70, 0.25);
}

/* Text + Blur harmonization */
.hud-panel h1,
.hud-panel h2,
.hud-panel h3 {
  text-shadow: 0 0 12px rgba(255, 255, 255, 0.08);
}

/* ==========  HUD Isolation and Overlay ========== */
#hud-ai-overlay,
#global-overlay-root {
  isolation: isolate;
  transform: none !important;
  filter: none !important;
  position: fixed !important;
}

/* ✨ HUD Interaction Context Fix */
#hud-ai-overlay {
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

#hud-ai-overlay .hud-interactive {
  pointer-events: auto;
}

/* 🌌 Visual overlay backdrop */
.hud-backdrop {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.8) 100%);
  backdrop-filter: blur(12px);
  transition: opacity 0.3s ease;
}

/* ------------------------------------------------ */
.os-dashboard {
  background: radial-gradient(1200px 600px at 10% -10%, #121212 0%, #0a0a0a 60%, #080808 100%);
  color: #fff;
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue',
    Arial;
  letter-spacing: 0.2px;
}

.adaptive-timeline,
.meta-forecast-card,
.confidence-hud {
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.adaptive-timeline:hover,
.meta-forecast-card:hover,
.confidence-hud:hover {
  transform: translateY(-4px);
  box-shadow: 0 0 16px rgba(12, 122, 122, 0.38);
  border-color: #1f2b2b;
}

/* Subtle text glitch */
.hud-glitch {
  position: relative;
  display: inline-block;
}
.hud-glitch::before,
.hud-glitch::after {
  content: attr(data-glitch);
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.12;
  pointer-events: none;
}
.hud-glitch::before {
  transform: translate(0.6px, -0.6px);
  filter: hue-rotate(8deg);
}
.hud-glitch::after {
  transform: translate(-0.6px, 0.6px);
  filter: hue-rotate(-8deg);
}
.hud-glitch:hover::before {
  animation: hud-glitch-jitter 1.8s infinite steps(10);
}
.hud-glitch:hover::after {
  animation: hud-glitch-jitter 1.6s infinite steps(12);
}
@keyframes hud-glitch-jitter {
  0% {
    transform: translate(0.6px, -0.6px);
  }
  20% {
    transform: translate(-1px, 0.8px);
  }
  40% {
    transform: translate(0.8px, 0.6px);
  }
  60% {
    transform: translate(-0.6px, -0.8px);
  }
  80% {
    transform: translate(1px, -0.4px);
  }
  100% {
    transform: translate(0.6px, -0.6px);
  }
}

/* Parallax Glow */
.parallax-glow {
  position: absolute;
  border-radius: 50%;
  opacity: 0.9;
  animation: glow-fadein 600ms ease-out both;
}
@keyframes glow-fadein {
  from {
    opacity: 0;
    transform: scale(0.96);
  }
  to {
    opacity: 0.9;
    transform: scale(1);
  }
}