/* =========================================================
   Gymsessed Workout Start Countdown
   iPhone/PWA stable fade-scale version
   ========================================================= */

html.gys-countdown-lock,
body.gys-countdown-lock {
  overflow: hidden !important;
  touch-action: none !important;
  overscroll-behavior: none !important;
}

.gys-workout-countdown {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  width: 100svw !important;
  height: 100vh !important;
  height: 100svh !important;
  height: 100dvh !important;
  z-index: 2147483600 !important;
  display: grid !important;
  place-items: center !important;
  padding:
    calc(18px + env(safe-area-inset-top, 0px))
    calc(18px + env(safe-area-inset-right, 0px))
    calc(18px + env(safe-area-inset-bottom, 0px))
    calc(18px + env(safe-area-inset-left, 0px)) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  transition:
    opacity 140ms ease-out,
    visibility 0s linear 140ms !important;
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
}

.gys-workout-countdown[hidden] {
  display: none !important;
}

.gys-workout-countdown.is-open {
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
  transition:
    opacity 140ms ease-out,
    visibility 0s linear 0s !important;
}

.gys-workout-countdown.is-leaving {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: visible !important;
  transition:
    opacity 230ms ease-in,
    visibility 0s linear 230ms !important;
}

.gys-workout-countdown,
.gys-workout-countdown *,
.gys-workout-countdown *::before,
.gys-workout-countdown *::after {
  box-sizing: border-box !important;
font-family: "Audiowide", "Orbitron", Impact, sans-serif !important;
  -webkit-tap-highlight-color: transparent !important;
  -webkit-font-smoothing: antialiased !important;
}

.gys-workout-countdown-bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background:
    radial-gradient(circle at center, rgba(173, 255, 0, 0.2), transparent 32%),
    radial-gradient(circle at top right, rgba(173, 255, 0, 0.15), transparent 38%),
    radial-gradient(circle at bottom left, rgba(173, 255, 0, 0.08), transparent 34%),
    rgba(0, 0, 0, 0.9) !important;
  backdrop-filter: blur(20px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.15) !important;
}

.gys-workout-countdown-shell {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: grid !important;
  place-items: center !important;
  pointer-events: none !important;
}

.gys-workout-countdown-ring {
  position: absolute !important;
  width: min(74vw, 420px) !important;
  height: min(74vw, 420px) !important;
  border-radius: 999px !important;
  border: 1px solid rgba(173, 255, 0, 0.22) !important;
  box-shadow:
    0 0 44px rgba(173, 255, 0, 0.1),
    inset 0 0 34px rgba(173, 255, 0, 0.08) !important;
  opacity: 0 !important;
  transform: scale(0.66) translateZ(0) !important;
}

.gys-workout-countdown-ring-2 {
  width: min(88vw, 510px) !important;
  height: min(88vw, 510px) !important;
  border-color: rgba(173, 255, 0, 0.12) !important;
}

.gys-workout-countdown.is-step-pulse .gys-workout-countdown-ring {
  animation: gys-countdown-ring 640ms cubic-bezier(.16, 1, .22, 1) both !important;
}

.gys-workout-countdown.is-step-pulse .gys-workout-countdown-ring-2 {
  animation-delay: 70ms !important;
}

.gys-workout-countdown-inner {
  position: relative !important;
  z-index: 3 !important;
  width: min(100%, 520px) !important;
  height: min(74dvh, 700px) !important;
  min-height: 430px !important;
  display: grid !important;
  place-items: center !important;
  text-align: center !important;
  border-radius: 36px !important;
  background:
    radial-gradient(circle at center, rgba(173, 255, 0, 0.2), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.018)),
    rgba(16, 16, 16, 0.76) !important;
  border: 1px solid rgba(173, 255, 0, 0.26) !important;
  box-shadow:
    0 34px 110px rgba(0, 0, 0, 0.86),
    0 0 84px rgba(173, 255, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  overflow: hidden !important;
  transform: translate3d(0, 16px, 0) scale(0.985) !important;
  -webkit-transform: translate3d(0, 16px, 0) scale(0.985) !important;
  transition: transform 180ms cubic-bezier(.16, 1, .22, 1) !important;
}

.gys-workout-countdown.is-open .gys-workout-countdown-inner {
  transform: translate3d(0, 0, 0) scale(1) !important;
  -webkit-transform: translate3d(0, 0, 0) scale(1) !important;
}

.gys-workout-countdown-content {
  position: relative !important;
  z-index: 10 !important;
  width: 100% !important;
  display: grid !important;
  place-items: center !important;
  pointer-events: none !important;
}

.gys-workout-countdown-scan {
  position: absolute !important;
  inset: -48% !important;
  z-index: 4 !important;
  pointer-events: none !important;
  background:
    linear-gradient(
      115deg,
      transparent 0%,
      transparent 39%,
      rgba(173, 255, 0, 0.08) 44%,
      rgba(173, 255, 0, 0.22) 48%,
      rgba(255, 255, 255, 0.13) 50%,
      rgba(173, 255, 0, 0.2) 52%,
      transparent 59%,
      transparent 100%
    ) !important;
  opacity: 0.85 !important;
  mix-blend-mode: screen !important;
  animation: gys-countdown-scan 1350ms linear infinite !important;
  will-change: transform !important;
}

.gys-workout-countdown-shimmer {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  pointer-events: none !important;
  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(173, 255, 0, 0.08) 18%,
      transparent 34%,
      transparent 66%,
      rgba(255, 255, 255, 0.08) 82%,
      transparent 100%
    ) !important;
  opacity: 0.24 !important;
  animation: gys-countdown-shimmer 900ms ease-in-out infinite alternate !important;
}

.gys-workout-countdown-pulse {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  z-index: 3 !important;
  width: clamp(210px, 48vw, 300px) !important;
  height: clamp(210px, 48vw, 300px) !important;
  border-radius: 999px !important;
  background: rgba(173, 255, 0, 0.09) !important;
  box-shadow:
    0 0 0 1px rgba(173, 255, 0, 0.22),
    0 0 68px rgba(173, 255, 0, 0.26),
    inset 0 0 40px rgba(173, 255, 0, 0.08) !important;
  pointer-events: none !important;
  opacity: 0.25 !important;
  transform: translate3d(-50%, -50%, 0) scale(0.84) !important;
  -webkit-transform: translate3d(-50%, -50%, 0) scale(0.84) !important;
  animation: gys-countdown-pulse 640ms ease-in-out infinite !important;
  will-change: transform, opacity !important;
}

.gys-workout-countdown-kicker {
  position: relative !important;
  z-index: 11 !important;
  width: 100% !important;
  display: block !important;
  color: rgba(173, 255, 0, 0.9) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.23em !important;
  text-indent: 0.23em !important;
  text-align: center !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  opacity: 0.9 !important;
}

.gys-workout-countdown-value {
  position: relative !important;
  z-index: 12 !important;
  width: 120% !important;
  overflow: visible !important;
  min-height: clamp(128px, 35vw, 224px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--gys-primary, #adff00) !important;
  font-size: clamp(128px, 35vw, 224px) !important;
  line-height: 0.82 !important;
  font-weight: 1000 !important;
  letter-spacing: -0.045em !important;
  text-indent: -0.045em !important;
  text-align: center !important;
  text-transform: uppercase !important;
  opacity: 0;
transform: translate3d(0, 24px, 0) scale(0.68);
-webkit-transform: translate3d(0, 24px, 0) scale(0.68);
  filter: none !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  text-shadow:
  0 0 8px rgba(173, 255, 0, 0.42),
  0 0 22px rgba(173, 255, 0, 0.24),
  0 10px 28px rgba(0, 0, 0, 0.72) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  transform-origin: center center !important;
  will-change: opacity, transform !important;
}

.gys-workout-countdown-value.is-go {
  font-size: clamp(92px, 28vw, 178px) !important;
  letter-spacing: -0.055em !important;
  text-indent: -0.055em !important;
}

.gys-workout-countdown.is-go-step .gys-workout-countdown-value {
text-shadow:
  0 0 10px rgba(173, 255, 0, 0.52),
  0 0 30px rgba(173, 255, 0, 0.3),
  0 12px 32px rgba(0, 0, 0, 0.76) !important;
}

@keyframes gys-countdown-ring {
  0% {
    opacity: 0;
    transform: scale(0.62) translateZ(0);
  }

  22% {
    opacity: 0.75;
  }

  100% {
    opacity: 0;
    transform: scale(1.18) translateZ(0);
  }
}

@keyframes gys-countdown-pulse {
  0% {
    opacity: 0.22;
    transform: translate3d(-50%, -50%, 0) scale(0.82);
  }

  48% {
    opacity: 0.82;
    transform: translate3d(-50%, -50%, 0) scale(1.04);
  }

  100% {
    opacity: 0.14;
    transform: translate3d(-50%, -50%, 0) scale(1.26);
  }
}

@keyframes gys-countdown-scan {
  0% {
    transform: translate3d(-38%, 0, 0) rotate(8deg);
  }

  100% {
    transform: translate3d(38%, 0, 0) rotate(8deg);
  }
}

@keyframes gys-countdown-shimmer {
  0% {
    opacity: 0.16;
    transform: translate3d(-2%, 0, 0);
  }

  100% {
    opacity: 0.34;
    transform: translate3d(2%, 0, 0);
  }
}

@media (min-width: 768px) {
  .gys-workout-countdown {
    padding: 24px !important;
  }

  .gys-workout-countdown-inner {
    height: min(74vh, 700px) !important;
    min-height: 500px !important;
  }

  .gys-workout-countdown-value {
    font-size: clamp(154px, 18vw, 224px) !important;
    min-height: clamp(154px, 18vw, 224px) !important;
  }

  .gys-workout-countdown-value.is-go {
    font-size: clamp(112px, 14vw, 178px) !important;
  }
}

@media (max-width: 390px) {
  .gys-workout-countdown {
    padding:
      calc(14px + env(safe-area-inset-top, 0px))
      calc(14px + env(safe-area-inset-right, 0px))
      calc(14px + env(safe-area-inset-bottom, 0px))
      calc(14px + env(safe-area-inset-left, 0px)) !important;
  }

  .gys-workout-countdown-inner {
    min-height: 390px !important;
    height: min(72dvh, 620px) !important;
    border-radius: 30px !important;
  }

  .gys-workout-countdown-value {
    font-size: clamp(118px, 35vw, 174px) !important;
    min-height: clamp(118px, 35vw, 174px) !important;
  }

  .gys-workout-countdown-value.is-go {
    font-size: clamp(88px, 28vw, 138px) !important;
  }
}

@supports (-webkit-touch-callout: none) {
  .gys-workout-countdown-value {
    text-shadow:
      0 0 6px rgba(173, 255, 0, 0.38),
      0 0 16px rgba(173, 255, 0, 0.22),
      0 8px 22px rgba(0, 0, 0, 0.72) !important;
  }

  .gys-workout-countdown.is-go-step .gys-workout-countdown-value {
    text-shadow:
      0 0 8px rgba(173, 255, 0, 0.46),
      0 0 22px rgba(173, 255, 0, 0.26),
      0 10px 26px rgba(0, 0, 0, 0.74) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gys-workout-countdown,
  .gys-workout-countdown-inner,
  .gys-workout-countdown-pulse,
  .gys-workout-countdown-scan,
  .gys-workout-countdown-shimmer,
  .gys-workout-countdown-ring {
    animation: none !important;
    transition: none !important;
  }

  .gys-workout-countdown.is-open {
    opacity: 1 !important;
    visibility: visible !important;
  }

  .gys-workout-countdown-value {
    opacity: 1 !important;
    transform: translate3d(0, 0, 0) scale(1) !important;
    -webkit-transform: translate3d(0, 0, 0) scale(1) !important;
  }
}