/* Full-screen overlay */

body.vt-lock { overflow: hidden; touch-action: none; }

#vt-loader-overlay{
  position: fixed; inset: 0; z-index: 2147483647;
  display: none; /* shown via JS */
  align-items: center; justify-content: center;
  background: rgba(5,10,25,.5);
  backdrop-filter: blur(2px);
  /* respect notches / safe areas on iOS */
  padding: env(safe-area-inset-top) env(safe-area-inset-right)
           env(safe-area-inset-bottom) env(safe-area-inset-left);
}

/* Card scales with screen, but never too big */
.vt-loader-card{
  width: min(92vw, 360px);
  max-width: 92vw;
  background: #fff;
  border-radius: 16px;
  padding: clamp(16px, 3vw, 24px);
  box-shadow: 0 10px 30px rgba(0,0,0,.2);
  text-align: center;
}

/* Logo scales with viewport */
.vt-logo-wrap{
  position: relative;
  width: clamp(56px, 14vw, 80px);
  height: clamp(56px, 14vw, 80px);
  margin: 0 auto 10px;
}
.vt-logo-wrap img{
  width: 100%; height: 100%; object-fit: contain; display: block;
}

/* Spinner ring */
.vt-ring{
  position: absolute; top: -6px; left: -6px; right: -6px; bottom: -6px;
  border: 4px solid transparent;
  border-top-color: #B7332B; border-right-color: #B7332B;
  border-radius: 50%;
  animation: vt-spin .9s linear infinite;
}
@keyframes vt-spin { to{ transform: rotate(360deg); } }

/* Text scales nicely on small screens */
.vt-loading-text{
  font-weight: 600;
  font-size: clamp(14px, 3.6vw, 16px);
  line-height: 1.3; color: #1f2533; margin-top: 6px;
}
.vt-subtle{
  font-size: clamp(12px, 3.2vw, 14px);
  line-height: 1.3; color: #6b7280; margin-top: 4px;
}

/* Tiny phones */
@media (max-width: 360px){
  .vt-loader-card{ width: 94vw; }
}

/* Accessibility: respect reduced-motion */
@media (prefers-reduced-motion: reduce){
  .vt-ring{ animation: none; }
}