.video_box {
  width: 100%;
}

.video_box .sva-video-shell {
  position: relative;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  background: #05070d;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.14);
}

.video_box .sva-video-frame {
  position: relative;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle at 50% 35%, rgba(21, 94, 239, 0.24), transparent 34%), linear-gradient(135deg, #05070d 0%, #101828 100%);
}

.video_box .sva-video-frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.video_box .sva-video-state {
  display: flex;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  padding: 30px;
  color: #fff;
  text-align: center;
}

.video_box .sva-video-state-card {
  display: grid;
  max-width: 420px;
  justify-items: center;
  gap: 12px;
}

.video_box .sva-video-kicker {
  margin: 0;
  color: #93c5fd;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.video_box .sva-video-message {
  margin: 0;
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.35;
}

.video_box .sva-video-detail {
  margin: 0;
  color: #cbd5e1;
  font-size: 13px;
  line-height: 1.5;
}

.video_box .sva-video-loader {
  width: 44px;
  height: 44px;
  border: 4px solid rgba(255, 255, 255, 0.18);
  border-top-color: #155eef;
  border-radius: 999px;
  animation: sva-video-spin 850ms linear infinite;
}

.video_box .sva-video-icon {
  display: inline-flex;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(21, 94, 239, 0.18);
  color: #93c5fd;
  font-size: 22px;
  font-weight: 900;
}

.video_box .sva-video-state.error .sva-video-icon,
.video_box .sva-video-state.locked .sva-video-icon {
  background: rgba(251, 146, 60, 0.14);
  color: #fed7aa;
}

@keyframes sva-video-spin {
  to { transform: rotate(360deg); }
}