/* EscrowX Chronos portal — compressed promo-matched transmission */
#chronosPortal {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: none;
  overflow: hidden;
  background: #000;
  opacity: 0;
}

#chronosPortal.is-active {
  display: block;
  animation: portalVisibility 8.15s linear forwards;
}

#chronosPortalVideo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #000;
}

.chronos-portal-vignette {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle, transparent 0 46%, rgba(0,0,0,.16) 72%, rgba(0,0,0,.72) 100%);
  box-shadow: inset 0 0 13vw rgba(0,0,0,.72);
}

.chronos-portal-status {
  position: absolute;
  left: 50%;
  bottom: 5.5vh;
  transform: translateX(-50%);
  width: min(88vw, 680px);
  color: #dffcff;
  font: 700 clamp(11px, 1.2vw, 15px)/1.5 "Courier New", monospace;
  letter-spacing: clamp(1px, .22vw, 3px);
  text-align: center;
  text-shadow: 0 0 12px rgba(190,248,255,.9), 0 0 30px rgba(0,162,255,.62);
  animation: portalStatusPulse 1.5s ease-in-out infinite;
}

.portal-gate-opening .error-page {
  animation: portalGateFracture .42s steps(2, end) forwards;
}

.portal-gate-opening .error-zero {
  animation: portalZeroFracture .42s steps(2, end) forwards;
}

@keyframes portalGateFracture {
  0% { transform: translate(0); filter: none; }
  24% { transform: translate(-6px, 2px); filter: contrast(1.35); }
  48% { transform: translate(7px, -3px); filter: contrast(1.7) hue-rotate(-8deg); }
  72% { transform: translate(-3px, -1px); opacity: .72; }
  100% { transform: scale(1.06); opacity: 0; filter: blur(4px); }
}

@keyframes portalZeroFracture {
  0%, 100% { text-shadow: 0 0 14px rgba(255,0,0,.4); }
  25% { transform: translateX(-8px) skewX(6deg); color: #fff; }
  55% { transform: translateX(9px) skewX(-7deg); color: #ff2336; }
  78% { transform: scale(1.18); color: #dffcff; }
}

@keyframes portalVisibility {
  0% { opacity: 0; }
  2%, 94% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes portalStatusPulse {
  0%, 100% { opacity: .72; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  #chronosPortal.is-active { animation-duration: .9s; }
  #chronosPortalVideo { display: none; }
  .portal-gate-opening .error-page,
  .portal-gate-opening .error-zero { animation: none; opacity: 0; }
}
