/* =====================================================================
   THANK YOU PAGE — ty__ / ty- namespaces
   ===================================================================== */

.ty-page {
  min-height: 100vh;
  padding: 96px 16px;
  background:
    radial-gradient(700px 420px at 18% 18%,rgba(var(--pagi-accent-rgb),.16),rgba(var(--pagi-accent-rgb),0) 60%),
    radial-gradient(640px 380px at 82% 28%,rgba(var(--pagi-accent-rgb),.12),rgba(var(--pagi-accent-rgb),0) 62%),
    radial-gradient(760px 420px at 50% 92%,rgba(15,23,42,.06),rgba(15,23,42,0) 62%),
    var(--bg);
  color: var(--text);
}

.ty {
  --ty-accent: var(--color-primary);
  --ty-ink: var(--text);
  --ty-muted: var(--muted);
  --ty-border: var(--border);
  --ty-bg: var(--bg);
  min-height: 100vh;
  background:
    radial-gradient(900px 500px at 20% 15%,rgba(var(--pagi-accent-rgb),.14),transparent 60%),
    radial-gradient(700px 420px at 85% 35%,rgba(15,23,42,.08),transparent 55%),
    var(--ty-bg);
  color: var(--text);
}

.ty-card,
.ty__card,
.thankyou-card {
  background: linear-gradient(180deg,#151820 0%,#101218 100%);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: var(--shadow-card);
}

.ty-card { padding: 34px 18px; }

.ty-card::before {
  content: "";
  position: absolute;
  inset: -2px;
  background: radial-gradient(420px 240px at 50% 0%,rgba(var(--pagi-accent-rgb),.18),rgba(var(--pagi-accent-rgb),0) 70%);
  pointer-events: none;
}

.ty-badge,
.ty__badge {
  background: rgba(193,18,31,.18);
  border: 1px solid rgba(242,183,5,.28);
}

.ty-badge {
  width: 76px;
  height: 76px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
  color: var(--primary);
  box-shadow: 0 14px 34px rgba(var(--pagi-accent-rgb),.22);
  position: relative;
  z-index: 1;
}

.ty__badge {
  display: inline-flex;
  width: 68px;
  height: 68px;
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  box-shadow: 0 18px 48px rgba(var(--pagi-accent-rgb),.18);
  margin-bottom: 18px;
  transform: translateY(6px);
  opacity: 0;
  animation: tyFadeUp .55s ease forwards;
}

.ty__badge-dot,
.ty-progress > span {
  background: var(--color-secondary);
}

.ty__badge-dot {
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(var(--pagi-accent-rgb),.35);
}

.ty-progress > span {
  display: block;
  height: 100%;
  width: 100%;
  transform-origin: left center;
  transform: scaleX(1);
  box-shadow: 0 12px 26px rgba(var(--pagi-accent-rgb),.28);
}

.ty-actions { flex-direction: column; align-items: stretch; }
.ty-btn     { width: 100%; }

.ty-btn--primary { box-shadow: 0 16px 36px rgba(var(--pagi-accent-rgb),.26); }

.ty__btn--primary {
  background: var(--ty-accent);
  border-color: var(--ty-accent);
  color: #fff;
  box-shadow: 0 14px 34px rgba(var(--pagi-accent-rgb),.26);
}

.ty__btn--outline:hover { border-color: rgba(var(--pagi-accent-rgb),.60); }
.ty__btn--outline .ty__btn-layer { background: rgba(var(--pagi-accent-rgb),.14); }

@media (max-width:767px) {
  .ty-card    { padding: 22px 14px; }
  .ty-timer   { text-align: left; }
  .ty-actions { flex-direction: column; align-items: stretch; }
  .ty-btn     { width: 100%; }
}