* {
  /* opacity: 0.55; */
  /* cursor: not-allowed; */
  transform: none;
}

.primary {
  background: #2563eb;
}

.success {
  background: #16a34a;
}

.danger {
  background: #dc2626;
}

.dark {
  background: #111827;
}

.warning {
  background: #f97316;
}

.download-area a {
  display: inline-block;
  width: 100%;
  text-align: center;
  padding: 14px 18px;
  border-radius: 16px;
  background: linear-gradient(135deg, #16a34a, #22c55e);
  color: white;
  text-decoration: none;
  font-weight: 900;
  box-shadow: 0 12px 24px rgba(22, 163, 74, 0.25);
}

.video-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 16px;
}

.box {
  padding: 14px;
}

.box-title {
  margin-bottom: 10px;
  font-weight: 900;
  color: #334155;
}

video,
canvas {
  width: 100%;
  display: block;
  background: #020617;
  border-radius: 16px;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.wide {
  grid-column: 1 / -1;
}

@media (max-width: 800px) {
  .top-panel {
    grid-template-columns: 1fr;
  }

  .hero {
    padding: 20px;
  }

  .btn {
    width: 100%;
    color: black;
  }
}
body {
    background: #eef2ff !important;
    color: #111827 !important;
}

.hero,
.record-card,
.download-card,
.box {
    opacity: 1 !important;
}

h1, h2, h3, p, .tag, .subtitle, .box-title {
    color: #111827 !important;
    opacity: 1 !important;
}

.hero {
    background: linear-gradient(135deg, #1e3a8a, #2563eb) !important;
}

.hero h1,
.hero p,
.hero .tag,
.hero .subtitle {
    color: white !important;
}

button {
    color: black !important;
    /* opacity: 1 !important; */
}

video,
canvas {
    background: #000 !important;
}
.video-grid,
.box,
#webcamVideo,
#screenVideo,
#mixCanvas {
    display: none !important;
}
.recording-active {
    background: #991b1b !important;
    animation: pulseRecord 1s infinite;
}

@keyframes pulseRecord {
    0% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.7);
    }
    70% {
        box-shadow: 0 0 0 12px rgba(220, 38, 38, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0);
    }
}