@import url("https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Bebas+Neue&family=Bodoni+Moda:opsz,wght@6..96,600;6..96,700;6..96,800;6..96,900&family=Cinzel:wght@500;600;700;800;900&family=Cinzel+Decorative:wght@700;900&family=Cormorant+Garamond:wght@700&family=Great+Vibes&family=Inter:wght@400;500;600;700;800;900&family=Montserrat:wght@500;600;700;800&family=Oswald:wght@500;600;700&family=Playfair+Display:wght@600;700;800;900&display=swap");

/* Premium Pride Picks theme: luxury nightlife, ballroom energy, fintech polish. */
:root {
  --bg: #050505 !important;
  --panel: rgba(13, 11, 16, 0.78) !important;
  --panel-2: rgba(24, 20, 28, 0.82) !important;
  --line: rgba(255, 215, 0, 0.28) !important;
  --gold: #ffd700 !important;
  --gold-2: #ff9f1c !important;
  --hot: #ff1493 !important;
  --pink: #ff1493 !important;
  --purple: #8a2be2 !important;
  --text: #fff9e8 !important;
  --muted: rgba(255, 249, 232, 0.68) !important;
  --luxury-glass: linear-gradient(180deg, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0.025)) !important;
  --luxury-border: rgba(255, 215, 0, 0.24) !important;
  --luxury-shadow: 0 22px 70px rgba(0, 0, 0, 0.62), 0 0 28px rgba(138, 43, 226, 0.16) !important;
}

body,
.phone {
  color: var(--text) !important;
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(255, 20, 147, 0.18), transparent 23rem),
    radial-gradient(circle at 82% 16%, rgba(138, 43, 226, 0.22), transparent 25rem),
    radial-gradient(circle at 50% 100%, rgba(255, 215, 0, 0.08), transparent 22rem),
    #050505 !important;
}

h1,
h2,
h3,
.section-title h2,
.login-splash-content h1,
.auth-modal-intro h2,
.launch-copy h1 {
  font-family: "Bebas Neue", "Oswald", Impact, sans-serif !important;
  letter-spacing: 0.018em !important;
}

.brand-script,
.logo-script {
  font-family: "Great Vibes", cursive !important;
}

.login-live-stats strong,
.modal-live-row b,
.stats-grid strong,
.board-summary strong,
.leaderboard-list strong,
.login-top-houses em,
.entry-box span,
#balance,
#walletBalance {
  font-family: "Oswald", "Inter", sans-serif !important;
  letter-spacing: 0.02em !important;
}

.phone img.brand-mark,
.login-splash-logo img,
.auth-screen-top img {
  filter: drop-shadow(0 0 16px rgba(255, 215, 0, 0.36)) drop-shadow(0 0 24px rgba(255, 20, 147, 0.14)) !important;
}

.phone section,
.phone article,
.phone .profile-card,
.phone .compliance-card,
.phone .event-card,
.phone .match-card,
.phone .quick-card,
.phone .culture-card,
.phone .house-card,
.phone .app-module,
.phone .leaderboard-preview,
.phone .entry-box,
.phone .profile-rank-card,
.phone .pricing-grid article,
.phone .login-live-stats article,
.phone .login-top-houses article,
.phone .login-featured-contest,
.phone .top-drawer,
.phone .wallet,
.phone .auth-forms form,
.phone .forgot-form,
.phone .account-card {
  border-color: var(--luxury-border) !important;
  background: var(--luxury-glass), rgba(5, 5, 5, 0.76) !important;
  box-shadow: var(--luxury-shadow) !important;
  backdrop-filter: blur(18px) saturate(1.2) !important;
}

.phone .screen,
.phone .auth-panel,
.phone .login-splash-content {
  background: transparent !important;
}

.phone button,
.phone input,
.phone select {
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif !important;
}

.gold-button,
.join-gradient,
.phone .gold-button,
.phone .join-gradient {
  border: 1px solid rgba(255, 245, 180, 0.42) !important;
  background: linear-gradient(180deg, #fff0a0 0%, #ffd700 38%, #ffae22 72%, #9d5c00 100%) !important;
  color: #090600 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.28) !important;
  box-shadow: 0 14px 30px rgba(255, 174, 34, 0.22), 0 0 22px rgba(255, 215, 0, 0.26) !important;
}

.text-button,
.phone .text-button,
.login-outline {
  color: var(--hot) !important;
  border-color: rgba(255, 20, 147, 0.45) !important;
  background: rgba(255, 20, 147, 0.055) !important;
  text-shadow: 0 0 16px rgba(255, 20, 147, 0.3) !important;
}

.phone input,
.phone select,
.phone textarea {
  color: var(--text) !important;
  border: 1px solid rgba(255, 215, 0, 0.18) !important;
  background: rgba(0, 0, 0, 0.68) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 20, 147, 0.04) !important;
}

.phone input:focus,
.phone select:focus,
.phone textarea:focus {
  border-color: rgba(255, 20, 147, 0.72) !important;
  box-shadow: 0 0 0 3px rgba(255, 20, 147, 0.15), 0 0 24px rgba(138, 43, 226, 0.2) !important;
  outline: none !important;
}

.pill,
.module-kicker,
.launch-kicker {
  color: var(--gold) !important;
  border-color: rgba(255, 215, 0, 0.34) !important;
  background: rgba(255, 215, 0, 0.07) !important;
}

.phone .screen {
  animation: luxuryScreenIn 280ms ease both !important;
}

@keyframes luxuryScreenIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.995);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .phone .screen,
  body {
    animation: none !important;
  }
}

/* Final Pride Picks public home cleanup: keep the reference layout tight. */
.phone.locked .wallet,
.phone.locked > .wallet,
.phone.locked .home-activity-card,
.phone.locked .launch-activity-head,
.phone.locked .launch-activity-feed,
.phone.locked .social-home .activity-feed,
.phone.locked .login-splash-content > .activity-feed {
  display: none !important;
}

.phone.locked .home-bottom-stack,
.phone.locked .login-splash-content {
  grid-template-columns: 1fr !important;
}

.phone.locked .launch-top-houses-head,
.phone.locked .login-splash-content > .login-top-houses,
.phone.locked .launch-trending-head,
.phone.locked .launch-trending-carousel,
.phone.locked .home-top-houses-card,
.phone.locked .home-trending-card {
  grid-column: 1 / -1 !important;
}

.phone.locked .login-splash-content > .login-top-houses {
  width: 100% !important;
}

.phone.locked .login-splash-content {
  padding-bottom: 128px !important;
}

.phone.locked.auth-modal-open::after {
  background: #000 !important;
  backdrop-filter: none !important;
}

.phone.locked.auth-modal-open .auth-forms {
  align-content: center !important;
  justify-content: center !important;
  position: fixed !important;
  inset: 0 !important;
  top: 0 !important;
  left: 50% !important;
  right: auto !important;
  bottom: 0 !important;
  transform: translateX(-50%) !important;
  width: min(900px, 100vw) !important;
  min-height: 0 !important;
  height: 100dvh !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 34px 18px 124px !important;
  overflow-y: auto !important;
  border-radius: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background:
    radial-gradient(circle at 78% 8%, rgba(255, 45, 170, 0.22), transparent 28%),
    radial-gradient(circle at 16% 0%, rgba(245, 194, 66, 0.12), transparent 28%),
    linear-gradient(180deg, #07070a 0%, #000 58%, #050507 100%) !important;
}

.phone.locked.signup-success-open .auth-forms,
.phone.locked.signup-success-open .login-splash,
.phone.locked.signup-success-open .section-title.compact,
.phone.locked.signup-success-open .live-proof,
.phone.locked.signup-success-open .login-note,
.phone.locked.signup-success-open .forgot-form,
.phone.locked.signup-success-open .account-card {
  display: none !important;
}

.signup-success-screen {
  position: fixed !important;
  inset: 0 !important;
  left: 50% !important;
  z-index: 10030 !important;
  width: min(900px, 100vw) !important;
  height: 100dvh !important;
  transform: translateX(-50%) !important;
  display: grid !important;
  align-content: center !important;
  gap: 14px !important;
  padding: 34px 22px 124px !important;
  color: var(--text) !important;
  overflow-y: auto !important;
  background:
    radial-gradient(circle at 50% 30%, rgba(255, 215, 0, 0.18), transparent 11rem),
    radial-gradient(circle at 50% 15%, rgba(255, 20, 147, 0.2), transparent 13rem),
    radial-gradient(circle at 68% 18%, rgba(138, 43, 226, 0.25), transparent 16rem),
    #050505 !important;
}

.signup-success-screen.hidden {
  display: none !important;
}

.success-confetti {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  opacity: 0.9 !important;
  background-image:
    linear-gradient(18deg, transparent 44%, #ff1493 45% 55%, transparent 56%),
    linear-gradient(-18deg, transparent 44%, #ffd700 45% 55%, transparent 56%),
    linear-gradient(90deg, transparent 44%, #ff8a00 45% 55%, transparent 56%),
    linear-gradient(45deg, transparent 44%, #8a2be2 45% 55%, transparent 56%) !important;
  background-size: 76px 76px, 92px 92px, 112px 112px, 134px 134px !important;
  background-position: 8% 8%, 70% 11%, 28% 42%, 88% 58% !important;
  animation: successFloat 14s linear infinite !important;
}

.success-crown {
  position: relative !important;
  z-index: 1 !important;
  width: 102px !important;
  height: 74px !important;
  justify-self: center !important;
  background: linear-gradient(180deg, #fff6b9, #ffd700 50%, #b96f00) !important;
  clip-path: polygon(4% 86%, 96% 86%, 88% 24%, 67% 55%, 50% 5%, 33% 55%, 12% 24%) !important;
  filter: drop-shadow(0 0 22px rgba(255, 215, 0, 0.5)) !important;
}

.signup-success-screen h2 {
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
  color: #fff !important;
  font-family: "Bebas Neue", "Oswald", sans-serif !important;
  font-size: clamp(2.75rem, 10vw, 4.2rem) !important;
  line-height: 0.95 !important;
  text-align: center !important;
  letter-spacing: 0.01em !important;
}

.starter-bonus {
  position: relative !important;
  z-index: 1 !important;
  width: 184px !important;
  height: 184px !important;
  justify-self: center !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  border: 3px solid #ffd700 !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(255, 215, 0, 0.12), rgba(0, 0, 0, 0.92) 62%) !important;
  box-shadow: 0 0 36px rgba(255, 215, 0, 0.38), inset 0 0 26px rgba(255, 215, 0, 0.1) !important;
}

.starter-bonus strong {
  color: #ffd700 !important;
  font-family: "Oswald", sans-serif !important;
  font-size: 3.35rem !important;
  line-height: 0.9 !important;
}

.starter-bonus span {
  color: #ffd700 !important;
  font-family: "Oswald", sans-serif !important;
  font-size: 1.7rem !important;
  font-weight: 900 !important;
}

.starter-bonus b {
  position: absolute !important;
  bottom: 20px !important;
  left: 50% !important;
  width: 166px !important;
  padding: 7px 10px !important;
  transform: translateX(-50%) rotate(-3deg) !important;
  border-radius: 4px !important;
  color: #fff !important;
  background: linear-gradient(90deg, #9b005f, #ff1493, #9b005f) !important;
  font-size: 0.76rem !important;
  text-align: center !important;
  text-transform: uppercase !important;
  box-shadow: 0 0 18px rgba(255, 20, 147, 0.42) !important;
}

.signup-success-screen p,
.signup-success-screen h3 {
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
  text-align: center !important;
}

.signup-success-screen p {
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 1.05rem !important;
  line-height: 1.35 !important;
}

.signup-success-screen p strong,
.signup-success-screen h3 {
  color: #ffd700 !important;
}

.signup-success-screen h3 {
  font-family: "Bebas Neue", sans-serif !important;
  font-size: 1.45rem !important;
  letter-spacing: 0.02em !important;
}

.success-action {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) 18px !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 390px !important;
  min-height: 78px !important;
  justify-self: center !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(255, 215, 0, 0.2) !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: var(--luxury-glass), rgba(8, 8, 11, 0.76) !important;
  box-shadow: var(--luxury-shadow) !important;
  text-align: left !important;
}

.success-action strong,
.success-action small {
  display: block !important;
}

.success-action strong {
  color: #fff !important;
  font-size: 1rem !important;
}

.success-action small {
  margin-top: 3px !important;
  color: rgba(255, 255, 255, 0.66) !important;
  font-size: 0.82rem !important;
}

.success-action > b {
  color: #ffd700 !important;
  font-size: 1.6rem !important;
}

.success-icon {
  width: 46px !important;
  height: 46px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 10px !important;
  color: #ff1493 !important;
  border: 1px solid rgba(255, 20, 147, 0.38) !important;
  background: rgba(255, 20, 147, 0.08) !important;
  font-family: "Oswald", sans-serif !important;
  font-size: 0.86rem !important;
  font-weight: 900 !important;
  box-shadow: 0 0 16px rgba(255, 20, 147, 0.18) !important;
}

.house-icon {
  position: relative !important;
}

.house-icon::before {
  content: "" !important;
  position: absolute !important;
  left: 17px !important;
  top: 10px !important;
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  background: currentColor !important;
  box-shadow: -12px 7px 0 -2px currentColor, 12px 7px 0 -2px currentColor !important;
}

.house-icon::after {
  content: "" !important;
  position: absolute !important;
  left: 9px !important;
  right: 9px !important;
  bottom: 9px !important;
  height: 15px !important;
  border-radius: 16px 16px 6px 6px !important;
  background: currentColor !important;
  box-shadow: -11px 2px 0 -5px currentColor, 11px 2px 0 -5px currentColor !important;
}

.success-primary {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 390px !important;
  justify-self: center !important;
  text-transform: uppercase !important;
}

@keyframes successFloat {
  from {
    background-position: 8% 8%, 70% 11%, 28% 42%, 88% 58%;
  }
  to {
    background-position: 8% 88%, 70% 91%, 28% 122%, 88% 138%;
  }
}

.phone.locked.auth-modal-open .auth-forms form {
  width: 100% !important;
  max-width: 390px !important;
  min-height: 0 !important;
  padding: 0 !important;
  gap: 8px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(245, 194, 66, 0.18) !important;
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

.phone.locked.auth-modal-open .auth-forms input {
  min-height: 40px !important;
  padding: 9px 12px !important;
  border-radius: 9px !important;
}

.phone.locked.auth-modal-open .auth-forms .gold-button,
.phone.locked.auth-modal-open .auth-forms .join-gradient {
  min-height: 46px !important;
  border-radius: 9px !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  background: linear-gradient(180deg, #ffd76a, #f5a623 58%, #ff8a00) !important;
  color: #120800 !important;
  box-shadow: 0 0 18px rgba(245, 194, 66, 0.34) !important;
}

.auth-modal-brand {
  display: none !important;
  justify-content: center !important;
  margin: -2px 0 2px !important;
}

.auth-screen-top {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 78px !important;
  margin-bottom: 2px !important;
}

.auth-screen-top img {
  width: min(190px, 58vw) !important;
  max-height: 84px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 18px rgba(245, 194, 66, 0.38)) !important;
}

.auth-back-inline,
.phone.locked .auth-modal-close.auth-back-button {
  position: absolute !important;
  left: 0 !important;
  top: 19px !important;
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: transparent !important;
  font-size: 1.72rem !important;
  line-height: 1 !important;
}

.phone.locked .auth-modal-close.auth-back-button {
  display: none !important;
}

.auth-modal-brand img {
  display: block !important;
  width: min(156px, 52vw) !important;
  max-height: 58px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 16px rgba(245, 194, 66, 0.32)) !important;
}

.auth-modal-intro {
  text-align: center !important;
  margin: 0 0 4px !important;
}

.auth-modal-intro h2 {
  margin: 0 !important;
  color: #fff !important;
  font-size: 2rem !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
  font-weight: 950 !important;
}

.auth-modal-intro p {
  margin: 5px auto 0 !important;
  max-width: 292px !important;
  color: rgba(255, 255, 255, 0.74) !important;
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
}

.modal-live-row {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin: 12px 0 12px !important;
  border: 1px solid rgba(255, 45, 170, 0.2) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: rgba(255, 255, 255, 0.035) !important;
}

.modal-live-row span {
  display: grid !important;
  gap: 1px !important;
  min-height: 70px !important;
  place-items: center !important;
  padding: 8px 3px !important;
  border-radius: 0 !important;
  border: 0 !important;
  border-right: 1px solid rgba(255, 45, 170, 0.17) !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 0.54rem !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

.modal-live-row span:last-child {
  border-right: 0 !important;
}

.modal-live-row i {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  margin-bottom: 2px !important;
}

.mini-people {
  color: #ff2daa !important;
  position: relative !important;
}

.mini-people::before {
  content: "" !important;
  position: absolute !important;
  left: 8px !important;
  top: 3px !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: currentColor !important;
  box-shadow: -7px 4px 0 -1px currentColor, 7px 4px 0 -1px currentColor !important;
}

.mini-people::after {
  content: "" !important;
  position: absolute !important;
  left: 4px !important;
  right: 4px !important;
  bottom: 3px !important;
  height: 9px !important;
  border-radius: 10px 10px 4px 4px !important;
  background: currentColor !important;
  box-shadow: -7px 1px 0 -3px currentColor, 7px 1px 0 -3px currentColor !important;
}

.mini-crown {
  background: linear-gradient(180deg, #fff4ba, #f5c242 55%, #c88914) !important;
  clip-path: polygon(4% 82%, 96% 82%, 88% 32%, 67% 57%, 50% 16%, 33% 57%, 12% 32%) !important;
  filter: drop-shadow(0 0 10px rgba(245, 194, 66, 0.5)) !important;
}

.mini-bolt,
.mini-flash {
  background: linear-gradient(180deg, #fff6a8, #f5c242 50%, #ff8a00) !important;
  clip-path: polygon(56% 0, 17% 52%, 43% 52%, 32% 100%, 83% 38%, 55% 38%) !important;
}

.mini-flash {
  background: linear-gradient(180deg, #7ee9ff, #1da7ff 55%, #4957ff) !important;
}

.modal-live-row b {
  display: block !important;
  color: #fff !important;
  font-size: 1.08rem !important;
  line-height: 1 !important;
}

.auth-field-label {
  margin: 3px 0 -4px !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
}

.interest-tags {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  margin-top: 3px !important;
}

.interest-tags small {
  grid-column: 1 / -1 !important;
  color: rgba(255, 255, 255, 0.66) !important;
  font-size: 0.68rem !important;
  text-transform: none !important;
}

.interest-tags button,
.social-login-row button,
.modal-switch {
  min-height: 30px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 45, 170, 0.55) !important;
  background: rgba(255, 45, 170, 0.08) !important;
  color: #ff4fba !important;
  font-size: 0.66rem !important;
  font-weight: 800 !important;
}

.house-picker {
  display: grid !important;
  gap: 4px !important;
  margin-top: 4px !important;
}

.house-picker span {
  color: rgba(255, 255, 255, 0.66) !important;
  font-size: 0.68rem !important;
}

.modal-switch {
  width: 100% !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.72) !important;
}

.modal-switch b {
  color: #ff2daa !important;
}

.modal-legal {
  margin: 2px auto 0 !important;
  max-width: 270px !important;
  color: rgba(255, 255, 255, 0.58) !important;
  font-size: 0.66rem !important;
  line-height: 1.25 !important;
  text-align: center !important;
}

.login-preview-card {
  display: grid !important;
  gap: 3px !important;
  min-height: 154px !important;
  margin: 12px 0 12px !important;
  padding: 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(245, 194, 66, 0.26) !important;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.94), rgba(0, 0, 0, 0.38) 54%, rgba(0, 0, 0, 0.12)),
    url("./assets/featured-crown-pillow.png") right center / auto 100% no-repeat,
    rgba(255, 255, 255, 0.04) !important;
  overflow: hidden !important;
}

.login-preview-copy {
  display: grid !important;
  gap: 5px !important;
  width: 56% !important;
}

.login-preview-card span {
  color: #f5c242 !important;
  font-size: 0.62rem !important;
  text-transform: uppercase !important;
  font-weight: 900 !important;
}

.login-preview-card span b {
  float: right !important;
  color: #ff2daa !important;
  font-size: 0.58rem !important;
}

.login-preview-card strong {
  color: #fff !important;
  font-size: 0.98rem !important;
  line-height: 1.05 !important;
}

.login-preview-card small,
.login-preview-card em {
  color: rgba(255, 255, 255, 0.68) !important;
  font-size: 0.7rem !important;
  font-style: normal !important;
}

.login-preview-card em {
  display: block !important;
  color: #ff2daa !important;
  font-size: 0.95rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.05em !important;
}

.online-dot::before {
  content: "" !important;
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  margin-right: 6px !important;
  border-radius: 50% !important;
  background: #27d863 !important;
}

.social-login-row {
  display: grid !important;
  grid-template-columns: repeat(4, 46px) !important;
  justify-content: center !important;
  gap: 16px !important;
  margin: 8px 0 2px !important;
}

.social-login-row::before {
  content: "or" !important;
  grid-column: 1 / -1 !important;
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 0.72rem !important;
  text-align: center !important;
}

.social-login-row button {
  width: 46px !important;
  height: 46px !important;
  min-height: 46px !important;
  border-color: rgba(255, 255, 255, 0.13) !important;
  background: rgba(255, 255, 255, 0.045) !important;
  color: #fff !important;
  font-size: 1rem !important;
}

.phone.locked .brand-mark {
  width: min(460px, 78vw) !important;
  max-height: 118px !important;
}

.phone.locked .login-live-stats b.stat-icon,
.phone.locked .login-live-stats b.stat-crown {
  width: 38px !important;
  height: 38px !important;
  margin: 0 auto 4px !important;
  display: inline-block !important;
}

.phone.locked .login-live-stats .stat-people {
  position: relative;
  color: #ff2daa;
  filter: drop-shadow(0 0 14px rgba(255, 45, 170, 0.48));
}

.phone.locked .login-live-stats .stat-people::before {
  content: "";
  position: absolute;
  left: 13px;
  top: 7px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: -12px 5px 0 -2px currentColor, 12px 5px 0 -2px currentColor;
}

.phone.locked .login-live-stats .stat-people::after {
  content: "";
  position: absolute;
  left: 7px;
  right: 7px;
  bottom: 5px;
  height: 14px;
  border-radius: 16px 16px 7px 7px;
  background: currentColor;
  box-shadow: -12px 2px 0 -4px currentColor, 12px 2px 0 -4px currentColor;
}

.phone.locked .login-live-stats .stat-bolt {
  background: linear-gradient(180deg, #fff4a4, #f5c242 48%, #ff8a00);
  clip-path: polygon(56% 0, 17% 52%, 43% 52%, 32% 100%, 83% 38%, 55% 38%);
  filter: drop-shadow(0 0 14px rgba(245, 194, 66, 0.52));
}

.phone.locked .login-live-stats .stat-flame {
  background: linear-gradient(180deg, #baff80, #20df74 42%, #009a54);
  clip-path: polygon(52% 0, 68% 22%, 83% 42%, 80% 70%, 62% 94%, 37% 98%, 16% 78%, 15% 51%, 32% 31%);
  filter: drop-shadow(0 0 14px rgba(34, 220, 122, 0.46));
}

.phone.locked .login-splash-content > .login-top-houses article {
  grid-template-columns: 104px minmax(0, 1fr) 96px !important;
}

.phone.locked .login-splash-content > .login-top-houses .rank-crown {
  width: 52px !important;
  height: 40px !important;
}

/* Screen 2: Join / Sign Up, built to match the numbered luxury mobile reference. */
.phone.locked.show-signup.auth-modal-open .auth-forms {
  display: grid !important;
  grid-template-columns: minmax(0, 430px) !important;
  align-content: start !important;
  justify-content: center !important;
  padding: 24px 14px 110px !important;
  background:
    radial-gradient(circle at 78% 3%, rgba(255, 20, 147, 0.22), transparent 15rem),
    radial-gradient(circle at 50% -4%, rgba(255, 215, 0, 0.15), transparent 12rem),
    linear-gradient(145deg, rgba(255, 20, 147, 0.055), transparent 34%),
    #050505 !important;
}

.phone.locked.show-signup #signupForm {
  position: relative !important;
  max-width: 410px !important;
  margin: 0 auto !important;
  padding: 0 16px 18px !important;
  border: 1px solid rgba(255, 215, 0, 0.34) !important;
  border-radius: 24px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)),
    rgba(0, 0, 0, 0.86) !important;
  box-shadow:
    0 0 0 1px rgba(255, 20, 147, 0.12),
    0 22px 72px rgba(0, 0, 0, 0.75),
    0 0 34px rgba(255, 20, 147, 0.16) !important;
  overflow: hidden !important;
}

.phone.locked.show-signup #signupForm::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  height: 180px !important;
  pointer-events: none !important;
  background:
    linear-gradient(120deg, rgba(255, 215, 0, 0.16), transparent 40%),
    radial-gradient(circle at 82% 12%, rgba(255, 20, 147, 0.24), transparent 8rem),
    url("./assets/pride-logo-transparent.png") right 14px top 14px / 130px auto no-repeat !important;
  opacity: 0.32 !important;
}

.phone.locked.show-signup #signupForm > * {
  position: relative !important;
  z-index: 1 !important;
}

.phone.locked.show-signup .auth-screen-top {
  min-height: 88px !important;
  margin: 0 -4px 0 !important;
}

.phone.locked.show-signup .auth-screen-top img {
  width: min(190px, 58vw) !important;
  max-height: 84px !important;
}

.phone.locked.show-signup .auth-back-inline {
  left: 2px !important;
  top: 24px !important;
  color: #fff !important;
  text-shadow: 0 0 12px rgba(255, 20, 147, 0.32) !important;
}

.phone.locked.show-signup .auth-modal-intro {
  margin: 0 0 14px !important;
}

.phone.locked.show-signup .auth-modal-intro h2 {
  font-size: clamp(2.35rem, 9vw, 3.4rem) !important;
  line-height: 0.9 !important;
  color: #fff !important;
  text-shadow: 0 0 22px rgba(255, 20, 147, 0.22) !important;
}

.phone.locked.show-signup .auth-modal-intro p {
  max-width: 315px !important;
  margin-top: 9px !important;
  color: rgba(255, 255, 255, 0.76) !important;
  font-size: 0.93rem !important;
  line-height: 1.38 !important;
}

.phone.locked.show-signup .modal-live-row {
  margin: 0 0 14px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255, 20, 147, 0.27) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.018)) !important;
}

.phone.locked.show-signup .modal-live-row span {
  min-height: 76px !important;
  gap: 3px !important;
  padding: 8px 2px !important;
}

.phone.locked.show-signup .modal-live-row i {
  width: 26px !important;
  height: 26px !important;
}

.phone.locked.show-signup .modal-live-row b {
  font-size: 1.18rem !important;
  color: #fff !important;
}

.phone.locked.show-signup .modal-live-row em {
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 0.54rem !important;
  font-style: normal !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

.phone.locked.show-signup .auth-field-label {
  margin: 6px 0 -2px !important;
  color: #fff !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
}

.phone.locked.show-signup #signupForm input {
  min-height: 46px !important;
  padding: 11px 13px !important;
  border-radius: 10px !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  background: rgba(0, 0, 0, 0.66) !important;
  color: #fff !important;
}

.phone.locked.show-signup #signupForm input::placeholder {
  color: rgba(255, 255, 255, 0.42) !important;
}

.phone.locked.show-signup .interest-tags {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin: 8px 0 3px !important;
}

.phone.locked.show-signup .interest-tags small,
.phone.locked.show-signup .house-picker span {
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 0.7rem !important;
}

.phone.locked.show-signup .interest-tags button {
  min-height: 32px !important;
  padding: 0 6px !important;
  border-radius: 8px !important;
  color: #ff1493 !important;
  border-color: rgba(255, 20, 147, 0.58) !important;
  background: rgba(255, 20, 147, 0.09) !important;
  box-shadow: 0 0 14px rgba(255, 20, 147, 0.08) !important;
}

.phone.locked.show-signup .house-picker {
  margin: 8px 0 0 !important;
}

.phone.locked.show-signup #signupForm .gold-button {
  width: 100% !important;
  min-height: 52px !important;
  margin-top: 8px !important;
  border-radius: 10px !important;
  font-size: 0.9rem !important;
  text-transform: uppercase !important;
}

.phone.locked.show-signup .modal-switch {
  min-height: 34px !important;
  margin-top: 4px !important;
}

.phone.locked.show-signup .modal-legal {
  max-width: 315px !important;
  margin-top: 0 !important;
  color: rgba(255, 255, 255, 0.55) !important;
  font-size: 0.68rem !important;
}

.signup-flow-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(255, 20, 147, 0.16) !important;
}

.signup-flow-strip span {
  display: grid !important;
  gap: 5px !important;
  justify-items: center !important;
  color: rgba(255, 255, 255, 0.64) !important;
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  text-align: center !important;
}

.signup-flow-strip b {
  width: 30px !important;
  height: 30px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  color: #050505 !important;
  background: linear-gradient(180deg, #fff3a6, #ffd700 55%, #ff9f1c) !important;
  box-shadow: 0 0 16px rgba(255, 215, 0, 0.28) !important;
  font-family: "Oswald", sans-serif !important;
  font-size: 0.86rem !important;
}

@media (max-width: 430px) {
  .phone.locked.show-signup.auth-modal-open .auth-forms {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .phone.locked.show-signup #signupForm {
    border-radius: 20px !important;
    padding-left: 13px !important;
    padding-right: 13px !important;
  }

  .phone.locked.show-signup .interest-tags button {
    font-size: 0.58rem !important;
  }
}

.phone.auth-modal-open,
.phone.signup-success-open {
  height: 100dvh !important;
  overflow: hidden !important;
}

/* Cinematic lightning effect for the LEGACY word only. */
.login-splash h1 span {
  position: relative !important;
  display: inline-block !important;
  isolation: isolate !important;
  background: linear-gradient(90deg, var(--hot), var(--orange), var(--gold), var(--green), var(--blue), var(--purple)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: #f6d77a !important;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.14) !important;
  animation: legacySubtlePulse 4.2s ease-in-out infinite !important;
}

.login-splash h1 span::before,
.login-splash h1 span::after {
  content: "" !important;
  position: absolute !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

.login-splash h1 span::before {
  z-index: 2 !important;
  top: -38% !important;
  left: -44% !important;
  width: 18% !important;
  height: 190% !important;
  border-radius: 999px !important;
  background:
    linear-gradient(
      125deg,
      transparent 0 16%,
      rgba(255, 255, 255, 0.98) 17% 22%,
      rgba(95, 212, 255, 0.95) 23% 29%,
      rgba(183, 78, 255, 0.86) 30% 35%,
      transparent 36% 100%
    ) !important;
  box-shadow:
    0 0 9px rgba(255, 255, 255, 0.95),
    0 0 18px rgba(66, 205, 255, 0.86),
    0 0 34px rgba(162, 62, 255, 0.74) !important;
  transform: rotate(-18deg) translate3d(0, 0, 0) !important;
  filter: blur(0.25px) saturate(1.35) !important;
}

.login-splash h1 span::after {
  z-index: -1 !important;
  inset: -0.2em -0.32em !important;
  border-radius: 0.16em !important;
  background:
    radial-gradient(circle at 30% 40%, rgba(255, 255, 255, 0.36), transparent 28%),
    radial-gradient(circle at 52% 50%, rgba(38, 204, 255, 0.42), transparent 42%),
    radial-gradient(circle at 72% 50%, rgba(160, 62, 255, 0.48), transparent 46%) !important;
  filter: blur(13px) saturate(1.5) !important;
}

.login-splash h1 span.legacy-strike {
  animation: legacySubtlePulse 4.2s ease-in-out infinite, legacyLetterCharge 920ms cubic-bezier(0.18, 0.78, 0.22, 1) both !important;
}

.login-splash h1 span.legacy-strike::before {
  animation: legacyBoltTravel 760ms cubic-bezier(0.16, 0.82, 0.24, 1) both !important;
}

.login-splash h1 span.legacy-strike::after {
  animation: legacyBloomFlash 920ms ease-out both !important;
}

.login-splash h1 span.legacy-glitch {
  animation:
    legacySubtlePulse 4.2s ease-in-out infinite,
    legacyRgbGlitch 150ms steps(2, end) both !important;
}

.legacy-spark {
  position: absolute !important;
  z-index: 3 !important;
  left: var(--spark-x) !important;
  top: var(--spark-y) !important;
  width: var(--spark-size) !important;
  height: var(--spark-size) !important;
  border-radius: 999px !important;
  pointer-events: none !important;
  background: var(--spark-color) !important;
  box-shadow:
    0 0 6px var(--spark-color),
    0 0 14px rgba(255, 255, 255, 0.7) !important;
  transform: translate(-50%, -50%) !important;
  animation: legacySparkBurst 520ms ease-out forwards !important;
}

@keyframes legacySubtlePulse {
  0%,
  100% {
    filter: drop-shadow(0 0 3px rgba(255, 45, 170, 0.24));
  }
  50% {
    filter: drop-shadow(0 0 7px rgba(138, 43, 226, 0.34));
  }
}

@keyframes legacyBoltTravel {
  0% {
    opacity: 0;
    left: -48%;
    transform: rotate(-18deg) translate3d(-18%, -8%, 0) scaleY(0.82);
  }
  9% {
    opacity: 1;
  }
  52% {
    opacity: 1;
    transform: rotate(-18deg) translate3d(0, 0, 0) scaleY(1.08);
  }
  100% {
    opacity: 0;
    left: 125%;
    transform: rotate(-18deg) translate3d(24%, 10%, 0) scaleY(0.72);
  }
}

@keyframes legacyLetterCharge {
  0%,
  100% {
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.14);
    filter: drop-shadow(0 0 4px rgba(255, 45, 170, 0.28));
  }
  22% {
    text-shadow:
      0 0 4px rgba(255, 255, 255, 0.98),
      0 0 14px rgba(77, 211, 255, 0.92),
      0 0 30px rgba(153, 58, 255, 0.82),
      0 0 46px rgba(255, 255, 255, 0.44);
    filter:
      drop-shadow(0 0 9px rgba(255, 255, 255, 0.85))
      drop-shadow(0 0 22px rgba(47, 199, 255, 0.72))
      drop-shadow(0 0 34px rgba(155, 77, 255, 0.64));
  }
  44% {
    text-shadow:
      0 0 5px rgba(255, 255, 255, 0.94),
      0 0 16px rgba(114, 226, 255, 0.86),
      0 0 36px rgba(182, 92, 255, 0.7);
  }
}

@keyframes legacyBloomFlash {
  0%,
  100% {
    opacity: 0;
    transform: scale(0.92);
  }
  18% {
    opacity: 0.92;
    transform: scale(1.03);
  }
  46% {
    opacity: 0.52;
    transform: scale(1.08);
  }
}

@keyframes legacyRgbGlitch {
  0% {
    transform: translate3d(0, 0, 0);
    text-shadow:
      -2px 0 rgba(255, 45, 170, 0.78),
      2px 0 rgba(47, 199, 255, 0.78),
      0 0 18px rgba(255, 255, 255, 0.4);
  }
  45% {
    transform: translate3d(1px, -1px, 0) skewX(-1deg);
    text-shadow:
      2px 0 rgba(255, 45, 170, 0.82),
      -2px 0 rgba(47, 199, 255, 0.82),
      0 0 20px rgba(155, 77, 255, 0.62);
  }
  100% {
    transform: translate3d(0, 0, 0);
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.14);
  }
}

@keyframes legacySparkBurst {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.45);
  }
  12% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--spark-dx)), calc(-50% + var(--spark-dy))) scale(0.05);
  }
}

@media (prefers-reduced-motion: reduce) {
  .login-splash h1 span,
  .login-splash h1 span.legacy-strike,
  .login-splash h1 span.legacy-glitch {
    animation: none !important;
  }

  .login-splash h1 span::before,
  .login-splash h1 span::after,
  .legacy-spark {
    display: none !important;
  }
}

/* Premium gamer leaderboard treatment for the Top Houses section. */
.phone.locked .login-splash-content > .top-houses-head {
  align-items: center !important;
  margin-top: 22px !important;
  margin-bottom: 10px !important;
}

.phone.locked .login-splash-content > .top-houses-head strong {
  display: inline-flex !important;
  align-items: center !important;
  gap: 11px !important;
  color: #fff !important;
  font-family: "Bebas Neue", Oswald, sans-serif !important;
  font-size: clamp(24px, 4vw, 32px) !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-shadow: 0 0 14px rgba(255, 255, 255, 0.18) !important;
}

.phone.locked .login-splash-content > .top-houses-head strong::before {
  content: "" !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 4px !important;
  background: linear-gradient(135deg, #ff2daa, #8a2be2) !important;
  box-shadow:
    inset 0 0 0 3px rgba(0, 0, 0, 0.35),
    0 0 14px rgba(255, 45, 170, 0.72) !important;
  transform: rotate(45deg) !important;
}

.phone.locked .login-splash-content > .top-houses-head .text-button {
  color: #ff2d8d !important;
  font-family: "Bebas Neue", Oswald, sans-serif !important;
  font-size: clamp(20px, 3.2vw, 26px) !important;
  font-weight: 900 !important;
  letter-spacing: 0.07em !important;
  text-shadow: 0 0 14px rgba(255, 45, 141, 0.42) !important;
}

.phone.locked .login-splash-content > .top-houses-head .text-button::after {
  content: " >" !important;
}

.phone.locked .login-splash-content > .login-top-houses {
  display: grid !important;
  gap: 16px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row {
  position: relative !important;
  min-height: 118px !important;
  display: grid !important;
  grid-template-columns: 116px minmax(0, 1fr) 152px !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 18px 22px !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 255, 255, 0.095), transparent 32%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.04), transparent 42%),
    rgba(4, 4, 5, 0.94) !important;
  border: 2px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.035),
    inset 0 18px 42px rgba(255, 255, 255, 0.025),
    0 18px 44px rgba(0, 0, 0, 0.46) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.065), transparent) !important;
  opacity: 0.4 !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.champion {
  border-color: rgba(255, 210, 82, 0.9) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 243, 173, 0.16),
    0 0 24px rgba(245, 179, 47, 0.4),
    0 0 46px rgba(245, 179, 47, 0.18),
    0 18px 48px rgba(0, 0, 0, 0.5) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.champion::before {
  content: "" !important;
  position: absolute !important;
  top: -3px !important;
  left: 42px !important;
  width: 62% !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, #fff8c6 35%, #f5b32f 50%, #fff8c6 63%, transparent) !important;
  box-shadow:
    0 0 12px rgba(255, 246, 198, 0.96),
    0 0 32px rgba(245, 179, 47, 0.72),
    0 0 64px rgba(245, 179, 47, 0.42) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.silver {
  border-color: rgba(184, 190, 199, 0.72) !important;
  box-shadow:
    inset 0 0 0 1px rgba(232, 238, 247, 0.11),
    0 0 18px rgba(175, 184, 198, 0.18),
    0 18px 44px rgba(0, 0, 0, 0.46) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.bronze {
  border-color: rgba(191, 99, 50, 0.72) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 161, 91, 0.12),
    0 0 18px rgba(216, 126, 53, 0.2),
    0 18px 44px rgba(0, 0, 0, 0.46) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row b {
  position: relative !important;
  z-index: 1 !important;
  width: 92px !important;
  height: 96px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 22px 22px 28px 28px !important;
  clip-path: polygon(50% 0, 93% 15%, 86% 78%, 50% 100%, 14% 78%, 7% 15%) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.9), transparent 16%),
    radial-gradient(circle at 50% 28%, rgba(255, 255, 255, 0.26), transparent 38%),
    linear-gradient(155deg, #fff2a8 0%, #f5b32f 32%, #6e4208 72%, #ffe68b 100%) !important;
  color: #130d05 !important;
  box-shadow:
    inset 0 0 0 3px rgba(255, 246, 190, 0.28),
    inset 0 -16px 24px rgba(0, 0, 0, 0.4),
    0 0 22px rgba(245, 179, 47, 0.42) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.champion b::before {
  content: "" !important;
  position: absolute !important;
  top: -5px !important;
  left: 50% !important;
  width: 50px !important;
  height: 24px !important;
  transform: translateX(-50%) !important;
  background: linear-gradient(180deg, #fff6ba, #f5b32f 58%, #8b550c) !important;
  clip-path: polygon(3% 100%, 9% 42%, 28% 74%, 50% 5%, 72% 74%, 91% 42%, 97% 100%) !important;
  filter: drop-shadow(0 0 8px rgba(245, 179, 47, 0.7)) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.silver b {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.94), transparent 18%),
    linear-gradient(155deg, #ffffff 0%, #c6ced8 34%, #5e6672 70%, #edf2f7 100%) !important;
  color: #14171b !important;
  box-shadow:
    inset 0 0 0 2px rgba(255, 255, 255, 0.34),
    inset 0 -10px 18px rgba(0, 0, 0, 0.28),
    0 0 16px rgba(214, 222, 232, 0.24) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.bronze b {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.78), transparent 18%),
    linear-gradient(155deg, #ffd3a0 0%, #d87e35 36%, #793814 72%, #ffb060 100%) !important;
  color: #170a04 !important;
  box-shadow:
    inset 0 0 0 2px rgba(255, 218, 176, 0.28),
    inset 0 -10px 18px rgba(0, 0, 0, 0.3),
    0 0 16px rgba(216, 126, 53, 0.25) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row .rank-num {
  position: relative !important;
  z-index: 2 !important;
  font-family: Oswald, Inter, sans-serif !important;
  font-size: 40px !important;
  font-weight: 900 !important;
  letter-spacing: 0.03em !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.28),
    0 8px 18px rgba(0, 0, 0, 0.52) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row .rank-crown,
.phone.locked .login-splash-content > .login-top-houses article.top-house-row .rank-crown::before,
.phone.locked .login-splash-content > .login-top-houses article.top-house-row .rank-crown::after {
  content: none !important;
  display: none !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row span {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px 8px !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row span::before {
  content: none !important;
  display: none !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row strong {
  width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: #fff !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-family: "Bebas Neue", Oswald, sans-serif !important;
  font-size: clamp(25px, 4.7vw, 34px) !important;
  font-weight: 900 !important;
  letter-spacing: 0.025em !important;
  line-height: 0.95 !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row small {
  width: 100% !important;
  color: rgba(255, 255, 255, 0.66) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row mark {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255, 215, 90, 0.2), rgba(245, 179, 47, 0.1)) !important;
  border: 1px solid rgba(245, 179, 47, 0.45) !important;
  color: #ffd76b !important;
  font-family: Inter, sans-serif !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
  letter-spacing: 0.08em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row mark.trend.up {
  background: linear-gradient(180deg, rgba(46, 255, 122, 0.18), rgba(11, 107, 55, 0.16)) !important;
  border-color: rgba(46, 255, 122, 0.48) !important;
  color: #6dff9f !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row mark.trend.purple {
  background: linear-gradient(180deg, rgba(178, 90, 255, 0.18), rgba(85, 24, 142, 0.2)) !important;
  border-color: rgba(178, 90, 255, 0.45) !important;
  color: #d7a7ff !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row mark.trend.fire {
  background: linear-gradient(180deg, rgba(255, 147, 60, 0.2), rgba(143, 58, 14, 0.2)) !important;
  border-color: rgba(255, 147, 60, 0.5) !important;
  color: #ffb36f !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row em {
  position: relative !important;
  z-index: 1 !important;
  justify-self: end !important;
  color: #fff !important;
  font-family: Oswald, Inter, sans-serif !important;
  font-size: clamp(34px, 5.8vw, 48px) !important;
  font-style: normal !important;
  font-weight: 900 !important;
  letter-spacing: 0.025em !important;
  line-height: 0.95 !important;
  text-align: right !important;
  text-shadow: 0 0 16px rgba(255, 255, 255, 0.16) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.champion strong,
.phone.locked .login-splash-content > .login-top-houses article.top-house-row.champion em {
  color: #ffdc72 !important;
  text-shadow: 0 0 18px rgba(245, 179, 47, 0.34) !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.bronze strong,
.phone.locked .login-splash-content > .login-top-houses article.top-house-row.bronze em {
  color: #d88a56 !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row em::first-line {
  color: #fff !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.champion em::first-line {
  color: #ffdc72 !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.silver strong,
.phone.locked .login-splash-content > .login-top-houses article.top-house-row.silver em,
.phone.locked .login-splash-content > .login-top-houses article.top-house-row.silver em::first-line {
  color: #d8dce3 !important;
}

.phone.locked .login-splash-content > .login-top-houses article.top-house-row.bronze em::first-line {
  color: #d88a56 !important;
}

@media (max-width: 560px) {
  .phone.locked .login-splash-content > .login-top-houses article.top-house-row {
    grid-template-columns: 62px minmax(0, 1fr) 78px !important;
    gap: 10px !important;
    min-height: 86px !important;
    padding: 12px !important;
  }

  .phone.locked .login-splash-content > .login-top-houses article.top-house-row b {
    width: 54px !important;
    height: 60px !important;
  }

  .phone.locked .login-splash-content > .login-top-houses article.top-house-row .rank-num {
    font-size: 18px !important;
  }

  .phone.locked .login-splash-content > .login-top-houses article.top-house-row strong {
    font-size: 22px !important;
  }

  .phone.locked .login-splash-content > .login-top-houses article.top-house-row em {
    font-size: 20px !important;
  }
}

/* Final auth positioning fix: Join/Login are full app screens, not side panels. */
html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

body.pride-auth-open {
  overflow: hidden !important;
}

body.pride-auth-open .shell {
  width: 100% !important;
  max-width: 100vw !important;
  display: grid !important;
  justify-items: center !important;
  align-items: start !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.phone.auth-modal-open,
.phone.signup-success-open,
.phone.locked.auth-modal-open,
.phone.locked.signup-success-open {
  left: auto !important;
  right: auto !important;
  width: min(100vw, 740px) !important;
  max-width: 740px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  transform: none !important;
}

.phone.auth-modal-open {
  height: 100dvh !important;
  min-height: 100dvh !important;
  overflow: visible !important;
}

.phone.auth-modal-open #authPanel,
.phone.auth-modal-open #authPanel.hidden {
  display: block !important;
}

.phone.signup-success-open #authPanel,
.phone.signup-success-open #authPanel.hidden {
  display: block !important;
}

.phone.auth-modal-open > :not(#authPanel):not(.toast):not(.coin-burst),
.phone.auth-modal-open #authPanel > :not(#authForms) {
  display: none !important;
}

.phone.auth-modal-open #authForms {
  display: grid !important;
  position: fixed !important;
  inset: 0 auto 0 50% !important;
  z-index: 100000 !important;
  width: min(100vw, 740px) !important;
  max-width: 740px !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 22px 14px max(34px, env(safe-area-inset-bottom)) !important;
  transform: translateX(-50%) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  align-content: start !important;
  justify-content: center !important;
  grid-template-columns: minmax(0, 430px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 78% 4%, rgba(255, 20, 147, 0.22), transparent 16rem),
    radial-gradient(circle at 50% -4%, rgba(255, 215, 0, 0.16), transparent 12rem),
    radial-gradient(circle at 15% 22%, rgba(138, 43, 226, 0.18), transparent 15rem),
    #050505 !important;
  box-shadow: none !important;
  touch-action: pan-y !important;
}

.phone.auth-modal-open #loginForm,
.phone.auth-modal-open #signupForm {
  display: none !important;
}

.phone.auth-modal-open.show-login #loginForm,
.phone.auth-modal-open.show-signup #signupForm {
  display: grid !important;
  width: min(100%, 430px) !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.phone.auth-modal-open.show-login #loginForm,
.phone.auth-modal-open.show-signup #signupForm {
  align-self: start !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding-bottom: max(44px, env(safe-area-inset-bottom)) !important;
}

.phone.auth-modal-open.show-signup #signupForm {
  gap: 8px !important;
}

.phone.auth-modal-open.show-signup .auth-screen-top {
  min-height: 54px !important;
}

.phone.auth-modal-open.show-signup .auth-modal-brand {
  display: none !important;
}

.phone.auth-modal-open.show-signup .auth-modal-intro {
  margin-bottom: 4px !important;
}

.phone.auth-modal-open.show-signup .auth-modal-intro h2 {
  font-size: clamp(1.6rem, 8vw, 2.1rem) !important;
}

.phone.auth-modal-open.show-signup .auth-modal-intro p {
  font-size: 0.78rem !important;
  line-height: 1.28 !important;
}

.phone.auth-modal-open.show-signup .modal-live-row {
  min-height: 66px !important;
}

.phone.auth-modal-open.show-signup #signupForm input {
  min-height: 42px !important;
}

.phone.auth-modal-open.show-login #loginForm input,
.phone.auth-modal-open.show-signup #signupForm input,
.phone.auth-modal-open.show-login #loginForm button,
.phone.auth-modal-open.show-signup #signupForm button {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.phone.auth-modal-open.show-signup .interest-tags {
  gap: 6px !important;
}

.phone.auth-modal-open.show-signup .interest-tags button {
  min-height: 30px !important;
  padding: 6px 8px !important;
}

.phone.auth-modal-open.show-signup #signupForm .gold-button,
.phone.auth-modal-open.show-login #loginForm .gold-button {
  min-height: 48px !important;
}

.phone.auth-modal-open .tab-row {
  display: none !important;
}

/* Auth viewport repair: keep the existing runway design inside the screen. */
.phone.auth-modal-open,
.phone.locked.auth-modal-open {
  width: min(100vw, 740px) !important;
  max-width: 740px !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
}

.phone.auth-modal-open #authForms {
  width: min(100% - 24px, 740px) !important;
  max-width: 740px !important;
  min-width: 0 !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  padding: 18px 12px max(28px, env(safe-area-inset-bottom)) !important;
  grid-template-columns: minmax(0, 430px) !important;
  justify-content: center !important;
  overflow-x: clip !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
}

.phone.auth-modal-open #authForms,
.phone.auth-modal-open #authForms *,
.phone.auth-modal-open #loginForm,
.phone.auth-modal-open #signupForm,
.phone.auth-modal-open .runway-copy,
.phone.auth-modal-open .runway-tabs,
.phone.auth-modal-open .runway-field,
.phone.auth-modal-open .runway-field input,
.phone.auth-modal-open .runway-submit,
.phone.auth-modal-open .modal-legal {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.phone.auth-modal-open.show-login #loginForm,
.phone.auth-modal-open.show-signup #signupForm {
  width: min(100%, 430px) !important;
  overflow: visible !important;
}

.phone.auth-modal-open .runway-copy h2,
.phone.auth-modal-open .auth-modal-intro h2 {
  max-width: 100% !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
}

.phone.auth-modal-open .runway-copy h2 {
  width: 100% !important;
  margin-inline: auto !important;
  font-size: clamp(2.45rem, 11vw, 3.3rem) !important;
  line-height: 0.82 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.phone.auth-modal-open .runway-tabs {
  width: 100% !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.phone.auth-modal-open .runway-field input,
.phone.auth-modal-open .runway-submit,
.phone.auth-modal-open .runway-tabs button {
  width: 100% !important;
}

.phone .login-live-stats,
.phone .app-live-stats {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(6px, 2vw, 10px) !important;
  overflow: hidden !important;
}

.phone .login-live-stats article,
.phone .app-live-stats article {
  min-width: 0 !important;
  width: auto !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.phone .login-live-stats b,
.phone .app-live-stats b {
  transform: scale(0.9) !important;
  transform-origin: center !important;
}

.phone .login-live-stats strong,
.phone .app-live-stats strong {
  font-size: clamp(1.7rem, 8vw, 2.65rem) !important;
}

.phone .login-live-stats span,
.phone .app-live-stats span {
  font-size: clamp(0.48rem, 2.3vw, 0.68rem) !important;
  line-height: 1.05 !important;
  white-space: normal !important;
}

.phone .login-featured-contest,
.phone .app-featured-contest {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

@media (max-width: 520px) {
  .phone .login-live-stats,
  .phone .app-live-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
.app-featured-contest,
#socialHomeTop .home-top-houses-card,
#socialHomeTop .home-trending-card {
  position: relative;
  overflow: hidden;
}

.app-featured-contest {
  min-height: 176px;
  border-color: rgba(245, 179, 47, 0.42) !important;
  background:
    linear-gradient(90deg, rgba(4, 3, 8, 0.96) 0%, rgba(4, 3, 8, 0.72) 48%, rgba(4, 3, 8, 0.2) 100%),
    url("./assets/pride-hero-crowned.png") right 28% / auto 142% no-repeat,
    #050505 !important;
  box-shadow: inset 0 0 0 1px rgba(255, 214, 90, 0.14), 0 18px 44px rgba(0, 0, 0, 0.42) !important;
}

.app-featured-contest::after,
#socialHomeTop .home-top-houses-card::after,
#socialHomeTop .home-trending-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 0 38%, rgba(255, 255, 255, 0.1) 48%, transparent 58% 100%);
  opacity: 0.34;
  transform: translateX(-120%);
  animation: prideSignedInSheen 7s ease-in-out infinite;
}

#socialHomeTop .home-top-houses-card {
  border-color: rgba(138, 43, 226, 0.48) !important;
  background:
    radial-gradient(circle at 18% 12%, rgba(255, 45, 170, 0.18), transparent 9rem),
    linear-gradient(180deg, rgba(16, 10, 22, 0.96), rgba(7, 6, 12, 0.96)),
    #050505 !important;
}

#socialHomeTop .home-top-houses-card .app-top-houses article {
  isolation: isolate;
}

#socialHomeTop .home-top-houses-card .app-top-houses article::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.42;
  background:
    linear-gradient(90deg, rgba(3, 3, 6, 0.94), rgba(3, 3, 6, 0.58)),
    url("./assets/featured-crown-pillow.png") right 42% / auto 150% no-repeat;
}

#socialHomeTop .home-trending-card {
  border-color: rgba(255, 45, 170, 0.34) !important;
  background:
    radial-gradient(circle at 82% 10%, rgba(255, 45, 170, 0.15), transparent 8rem),
    rgba(7, 6, 12, 0.96) !important;
}

#socialHomeTop .trending-carousel .trending-card {
  min-height: 92px;
  align-content: end;
  justify-items: start;
  overflow: hidden;
  border-color: rgba(255, 45, 170, 0.36) !important;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.72)),
    url("./assets/trending-atl.png") center 18% / cover no-repeat,
    #090510 !important;
  box-shadow: inset 0 0 28px rgba(255, 45, 170, 0.14);
}

#socialHomeTop .trending-carousel .trending-card:nth-child(2) {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.72)),
    url("./assets/trending-drag-race.png") center 14% / cover no-repeat,
    #090510 !important;
}

#socialHomeTop .trending-carousel .trending-card:nth-child(3) {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.72)),
    url("./assets/trending-realness.png") center 16% / cover no-repeat,
    #090510 !important;
}

#socialHomeTop .trending-carousel .trending-card:nth-child(4) {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.72)),
    url("./assets/trending-vogue-fem.png") center 16% / cover no-repeat,
    #090510 !important;
}

#socialHomeTop .trending-carousel .trending-card:nth-child(5) {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.72)),
    url("./assets/trending-bonus.png") center 15% / cover no-repeat,
    #090510 !important;
}

.match-card {
  min-height: 194px !important;
  display: grid;
  align-content: end;
  gap: 8px;
  isolation: isolate;
  border-color: rgba(245, 179, 47, 0.36) !important;
  background: #050505 !important;
}

.match-card::before {
  opacity: 0 !important;
}

.match-card > :not(.match-live-bg) {
  position: relative;
  z-index: 2;
}

.match-live-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.82);
  background:
    linear-gradient(90deg, rgba(3, 3, 6, 0.98) 0%, rgba(3, 3, 6, 0.68) 48%, rgba(3, 3, 6, 0.28) 100%),
    url("./assets/reference-screens.png") 0 50% / auto 128% repeat-x,
    #050505;
}

.match-card.ny .match-live-bg {
  background-position: 0 50%, 38% 45%, 0 0;
}

.match-card.philly .match-live-bg {
  background-position: 0 50%, 72% 60%, 0 0;
}

.match-live-bg::before {
  content: "";
  position: absolute;
  inset: -18% -34%;
  background:
    radial-gradient(circle at 18% 32%, rgba(255, 45, 170, 0.28), transparent 12rem),
    radial-gradient(circle at 78% 18%, rgba(245, 179, 47, 0.22), transparent 10rem),
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
  animation: pridePoolLightSweep 8s ease-in-out infinite;
}

.match-live-track {
  position: absolute;
  top: 12px;
  left: 0;
  display: flex;
  gap: 18px;
  min-width: 200%;
  color: rgba(245, 179, 47, 0.76);
  font-family: Oswald, Inter, sans-serif;
  font-size: 0.68rem;
  font-weight: 1000;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  animation: pridePoolTicker 18s linear infinite;
}

.match-live-phone {
  position: absolute;
  top: 18px;
  right: 13px;
  width: min(54%, 284px);
  height: 132px;
  padding: 10px;
  border: 1px solid rgba(245, 179, 47, 0.32);
  border-radius: 14px;
  background: rgba(5, 5, 8, 0.76);
  box-shadow: inset 0 0 20px rgba(245, 179, 47, 0.1), 0 12px 28px rgba(0, 0, 0, 0.34);
  animation: pridePoolFloat 6.5s ease-in-out infinite;
}

.match-live-top,
.match-live-tabs,
.match-live-slip em,
.match-live-stats {
  display: flex;
  align-items: center;
}

.match-live-top,
.match-live-tabs,
.match-live-slip em {
  justify-content: space-between;
}

.match-live-top {
  color: #fff;
  font-size: 0.62rem;
  font-weight: 1000;
}

.match-live-tabs {
  gap: 4px;
  margin-top: 8px;
}

.match-live-tabs i {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  padding: 4px 5px;
  border-radius: 999px;
  background: rgba(255, 45, 170, 0.18);
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.48rem;
  font-style: normal;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.match-live-slip {
  display: grid;
  gap: 5px;
  margin-top: 9px;
}

.match-live-slip em {
  padding: 5px 7px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.08);
  font-style: normal;
}

.match-live-slip strong,
.match-live-slip small {
  font-size: 0.56rem;
}

.match-live-slip small {
  color: #f5b32f;
  font-weight: 1000;
}

.match-live-stats {
  position: absolute;
  right: 14px;
  bottom: 12px;
  gap: 6px;
}

.match-live-stats em {
  display: grid;
  min-width: 58px;
  padding: 7px 8px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.52);
  font-style: normal;
  text-align: center;
}

.match-live-stats strong {
  color: #fff;
  font-family: Oswald, Inter, sans-serif;
  font-size: 1rem;
  line-height: 1;
}

.match-live-stats small {
  margin-top: 3px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.48rem;
  font-weight: 1000;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.match-card h3 {
  font-size: clamp(1.32rem, 6vw, 2.08rem) !important;
  line-height: 0.92;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.88);
}

.match-card p {
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: clamp(0.96rem, 4vw, 1.24rem);
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.82);
}

@keyframes prideSignedInSheen {
  0%, 52% {
    transform: translateX(-120%);
  }
  78%, 100% {
    transform: translateX(120%);
  }
}

@keyframes pridePoolTicker {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

@keyframes pridePoolFloat {
  0%, 100% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(-10px, 4px, 0);
  }
}

@keyframes pridePoolLightSweep {
  0%, 100% {
    transform: translateX(-8%);
    opacity: 0.68;
  }
  50% {
    transform: translateX(8%);
    opacity: 1;
  }
}

@media (max-width: 520px) {
  .match-card {
    min-height: 178px !important;
  }

  .match-live-phone {
    right: 8px;
    width: 56%;
    height: 120px;
    opacity: 0.82;
  }

  .match-live-stats {
    display: none;
  }
}

#socialHomeTop #homeFeaturedContest.app-featured-contest {
  min-height: 176px !important;
  border-color: rgba(245, 179, 47, 0.42) !important;
  background:
    linear-gradient(90deg, rgba(4, 3, 8, 0.98), rgba(4, 3, 8, 0.66), rgba(4, 3, 8, 0.16)),
    radial-gradient(circle at 76% 42%, rgba(255, 45, 170, 0.24), transparent 9rem),
    var(--featured-image, url("./assets/featured-pride-weekend.png")) var(--featured-position, right 38%) / auto 128% no-repeat,
    #050505 !important;
  box-shadow: inset 0 0 0 1px rgba(255, 214, 90, 0.14), 0 18px 44px rgba(0, 0, 0, 0.42) !important;
}

/* New public entry: premium landing/login only, no pre-login Home feed. */
.phone.locked:not(.auth-modal-open):not(.signup-success-open) {
  min-height: 100dvh !important;
  background:
    radial-gradient(circle at 20% 6%, rgba(255, 45, 170, 0.18), transparent 15rem),
    radial-gradient(circle at 82% 14%, rgba(138, 43, 226, 0.2), transparent 18rem),
    linear-gradient(180deg, #030205 0%, #08050d 48%, #020102 100%) !important;
}

/* Homepage landing styles moved to landing-page.css for stability. */