#scene-splash {
  gap: 24px;
  background: #FDFDFD;
}

#splash-logo {
  animation: splashLogoPulse 1.8s ease-in-out infinite;
}
#splash-logo.hide { display: none; }

@keyframes splashLogoPulse {
  0%, 100% { transform: scale(1);    filter: drop-shadow(0 0  0px rgba(230,0,126,0));    }
     50%   { transform: scale(1.04); filter: drop-shadow(0 0 18px rgba(230,0,126,0.35)); }
}

.splash-bar {
  width: 200px; height: 4px;
  background: var(--c-line);
  border-radius: 100px;
  overflow: hidden;
  position: relative;
}
.splash-bar .fill {
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 0%;
  background: var(--c-pink);
  border-radius: 100px;
  transition: width 0.2s var(--ease-out);
}

.splash-spinner {
  width: 32px; height: 32px;
  border: 3px solid var(--c-line);
  border-top-color: var(--c-pink);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

.splash-text {
  font-size: var(--t-14);
  color: var(--c-ink-soft);
  letter-spacing: 0.06em;
  animation: splashDots 1.2s ease-in-out infinite;
}
@keyframes splashDots {
  0%, 100% { opacity: 0.5; }
     50%   { opacity: 1;   }
}

#scene-onboarding { gap: 14px; }

.ob-title { font-size: clamp(28px, 8vw, 36px); text-align: center; color: var(--c-ink); }
.ob-title b { color: var(--c-pink); font-weight: 900; }
.ob-sub { color: var(--c-ink-soft); font-size: var(--t-14); text-align: center; line-height: 1.5; }
.small-print { font-size: var(--t-11); color: var(--c-ink-mute); text-align: center; margin-top: 6px; }

.input-phone-wrap { position: relative; width: 100%; }

.input-phone {
  background: var(--c-surface);
  border: 1.5px solid var(--c-line);
  border-radius: 16px;
  padding: 16px 56px 16px 20px;
  font-family: 'Outfit', sans-serif;
  font-size: var(--t-24);
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--c-ink);
  width: 100%;
  transition: border-color 0.18s var(--ease-out), background-color 0.18s var(--ease-out);
}
.input-phone:focus  { outline: none; border-color: var(--c-pink); }
.input-phone.valid  { border-color: var(--c-success); background: rgba(0,184,107,0.04); }
.input-phone.invalid {
  border-color: var(--c-red);
  background: rgba(230,57,70,0.04);
  animation: shake 0.4s cubic-bezier(.36,.07,.19,.97);
}

.input-badge {
  position: absolute; right: 18px; top: 50%;
  transform: translateY(-50%) scale(0);
  width: 28px; height: 28px;
  border-radius: 50%;
  display: grid; place-items: center;
  font-weight: 900; font-size: 14px;
  transition: transform 0.25s var(--spring-snappy);
}
.input-badge.show { transform: translateY(-50%) scale(1); }
.input-badge.ok   { background: var(--c-success); color: #fff; }
.input-badge.no   { background: var(--c-red);     color: #fff; }

.input-msg {
  font-size: var(--t-14);
  height: 18px; text-align: center;
  color: var(--c-ink-soft);
  transition: color 0.2s;
}
.input-msg.ok { color: var(--c-success); }
.input-msg.no { color: var(--c-red); }
