.quantum-intro {
  width: min(1080px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 0;
  color: #f2faf5;
  background: #05060f;
  border: 1px solid rgba(0, 207, 255, .45);
  border-radius: 22px;
  box-shadow: 0 0 48px rgba(0, 207, 255, .16);
  overflow: auto;
}
.quantum-intro[open] { animation: quantum-intro-enter .3s ease-out; }
.quantum-intro::backdrop { background: rgba(2, 4, 12, .94); }
.quantum-intro-header, .quantum-intro-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 18px;
}
.quantum-intro-header h2 { margin: 0; font: 600 14px/1.4 Inter, sans-serif; }
.quantum-intro-header h2 { flex: 1; }
.quantum-intro button {
  cursor: pointer;
  font: 600 14px/1.3 Inter, sans-serif;
  color: #f2faf5;
  background: rgba(0, 207, 255, .08);
  border: 1px solid rgba(0, 207, 255, .3);
  border-radius: 12px;
  min-height: 44px;
  padding: 10px 16px;
}
.quantum-intro button:hover { background: rgba(0, 207, 255, .18); }
.quantum-intro button:focus-visible { outline: 2px solid #00cfff; outline-offset: 3px; }
.quantum-intro .quantum-intro-close { padding: 8px; width: 44px; font-size: 26px; }
.quantum-intro video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: calc(100dvh - 240px);
  object-fit: contain;
  background: #000;
}
.quantum-intro-footer { display: grid; grid-template-columns: 1fr 1fr; padding: 18px; }
.quantum-intro-footer .quantum-intro-enter, .quantum-intro-whatsapp {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 60px; padding: 16px 20px; border-radius: 14px;
  font: 700 16px/1.4 Inter, sans-serif; text-align: center; text-decoration: none;
}
.quantum-intro-footer .quantum-intro-enter {
  background: linear-gradient(120deg, #00cfff, #1e6fff); color: #04111d;
  box-shadow: 0 4px 20px rgba(0,207,255,.18);
}
.quantum-intro-footer .quantum-intro-enter:hover { background: linear-gradient(120deg, #48dcff, #508fff); }
.quantum-intro-whatsapp { color: #f2faf5; background: rgba(37,211,102,.13); border: 1px solid rgba(37,211,102,.55); }
.quantum-intro-whatsapp:hover { background: rgba(37,211,102,.24); }
.quantum-intro-whatsapp img { width: 28px; height: 28px; object-fit: contain; flex-shrink: 0; }
.quantum-intro-whatsapp:focus-visible { outline: 2px solid #25d366; outline-offset: 3px; }
.quantum-intro-status { color: #a2bcae; padding: 0 18px 18px; margin: 0; font-size: 14px; }
@media (max-width: 600px) {
  .quantum-intro-header { flex-wrap: wrap; padding: 10px 12px; gap: 8px; }
  .quantum-intro-header h2 { flex-basis: calc(100% - 56px); }
  .quantum-intro-header [data-intro-sound] { order: 3; }
  .quantum-intro-footer { grid-template-columns: 1fr; padding: 12px; gap: 10px; }
  .quantum-intro-footer .quantum-intro-enter, .quantum-intro-whatsapp { min-height: 56px; font-size: 15px; }
  .quantum-intro video { max-height: calc(100dvh - 350px); }
}
.quantum-intro-progress { height: 2px; background: rgba(0, 207, 255, .12); }
.quantum-intro-progress span { display: block; height: 100%; width: 100%; transform: scaleX(0); transform-origin: left; background: #00cfff; }
@keyframes quantum-intro-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .quantum-intro[open] { animation: none; } }