/* Screens. Sizes and spacing follow the original app's StyleSheets (brainwise-mobile src/screens). */
.welcome { position: relative; min-height: 100vh; min-height: 100dvh; display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 24px 16px calc(24px + env(safe-area-inset-bottom, 0px)); }
.welcome-inner { position: relative; text-align: center; max-width: 420px; width: 100%; }
.rays span { position: absolute; top: -20%; left: 30%; width: 200px; height: 140%; background: linear-gradient(var(--rays), transparent); transform: rotate(15deg); opacity: .6; }
.rays span + span { left: 60%; transform: rotate(45deg); }
.head { width: 128px; height: auto; filter: brightness(0) invert(.95); opacity: .85; animation: float 6s ease-in-out infinite; }
@keyframes float { 0%, 100% { transform: translateY(-8px); } 50% { transform: translateY(8px); } }
.brand { margin: 24px 0 0; line-height: 1; }
.brand-title { display: block; font-size: 36px; font-weight: 800; letter-spacing: 3px; }
.brand-sub { display: block; font-size: 28px; font-weight: 700; letter-spacing: 6px; color: var(--brand-sub); margin-top: 6px; }
.tagline { font-size: 20px; font-weight: 600; margin: 32px 0 8px; color: rgba(240,244,248,0.9); }
.subtitle { font-size: 16px; margin: 0 0 40px; color: var(--text); opacity: .9; }
.soon { display: inline-block; padding: 16px 32px; border-radius: 15px; background: rgba(255,255,255,0.15); border: 1px solid var(--border); font-size: 18px; font-weight: 600; margin: 0; }
@media (prefers-reduced-motion: reduce) { .head { animation: none; } }