/* Web Streaming Custom Dark Theme Enhancements */
@layer utilities {
  .scrollbar-none::-webkit-scrollbar {
    display: none;
  }
  .scrollbar-none {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
}

body {
  background-color: #0b0f19;
  color: #e2e8f0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  overflow-x: hidden;
}

/* Glassmorphism effects */
.glass-panel {
  background: rgba(17, 24, 39, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.glass-nav {
  background: rgba(11, 15, 25, 0.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* Card hover glow */
.card-hover {
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-hover:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 14px 28px -6px rgba(59, 130, 246, 0.25), 0 8px 10px -6px rgba(0, 0, 0, 0.4);
}

/* Custom player aspect ratio container */
.player-ratio-box {
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: 75vh;
  background: #000;
  position: relative;
  overflow: hidden;
  border-radius: 0.75rem;
}

/* Active Episode Pill Pulse */
.active-pill {
  background: linear-gradient(135deg, #2563eb, #3b82f6) !important;
  color: #ffffff !important;
  font-weight: 600;
  border-color: #60a5fa !important;
  box-shadow: 0 0 12px rgba(59, 130, 246, 0.5);
}