.onboarding-shell{--ob-purple-50:#f5f0ff;--ob-purple-100:#ede5ff;--ob-purple-200:#d4c4fb;--ob-purple-400:#a78bfa;--ob-purple-500:#8b5cf6;--ob-purple-600:#6d28d9;--ob-purple-700:#5b21b6;--ob-purple-800:#4c1d95;--ob-purple-900:#3b0f7a;--ob-surface:#fff;--ob-surface-dim:#f8f7fc;--ob-text:#1e1b2e;--ob-text-secondary:#6b6880;--ob-text-muted:#9e9bb0;--ob-border:#eae8f0;--ob-border-strong:#d6d3e0;--ob-teal:#0d9488;--ob-blue:#3b82f6;--ob-orange:#f97316;--ob-pink:#ec4899;--ob-green:#10b981;--ob-red:#ef4444;--ob-yellow:#f59e0b;--ob-radius:16px;--ob-radius-lg:24px;--ob-radius-full:9999px;--ob-shadow-sm:0 1px 3px #6d28d90f;--ob-shadow-md:0 4px 16px #6d28d91a;--ob-shadow-lg:0 8px 32px #6d28d924;--ob-shadow-glow:0 0 40px #6d28d92e;--ob-shadow-btn:0 8px 24px #6d28d94d;-webkit-font-smoothing:antialiased;background:linear-gradient(160deg,#f5f0ff 0%,#ede5ff 30%,#f8f7fc 60%,#fff 100%);justify-content:center;align-items:center;min-height:100dvh;padding:0;font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:flex}.onboarding-phone{background:var(--ob-surface);flex-direction:column;width:100%;max-width:430px;min-height:100dvh;display:flex;position:relative;overflow:hidden}@media (min-width:640px){.onboarding-shell{padding:24px}.onboarding-phone{border-radius:40px;min-height:820px;max-height:900px;box-shadow:0 0 0 1px #6d28d914,0 24px 80px -12px #6d28d933,0 0 120px #8b5cf614}}.ob-topbar{background:var(--ob-surface);z-index:20;align-items:center;padding:20px 24px 16px;display:flex;position:sticky;top:0}.ob-back-btn{border:1.5px solid var(--ob-border);background:var(--ob-surface);cursor:pointer;width:40px;height:40px;color:var(--ob-text);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.ob-back-btn:hover{background:var(--ob-purple-50);border-color:var(--ob-purple-200)}.ob-back-btn:active{transform:scale(.94)}.ob-progress-track{flex:1;gap:6px;margin-left:20px;display:flex}.ob-progress-dot{border-radius:var(--ob-radius-full);background:var(--ob-border);flex:1;height:5px;transition:background .4s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.ob-progress-dot.active{background:var(--ob-purple-600)}.ob-progress-dot.active:after{content:"";background:linear-gradient(90deg,var(--ob-purple-600),var(--ob-purple-400));border-radius:inherit;animation:1.5s ease-in-out infinite ob-shimmer;position:absolute;inset:0}@keyframes ob-shimmer{0%,to{opacity:1}50%{opacity:.6}}.ob-content{scrollbar-width:none;flex:1;padding-bottom:0;overflow-y:auto}.ob-content::-webkit-scrollbar{display:none}.ob-step{flex-direction:column;min-height:100%;padding:8px 24px 32px;animation:.45s cubic-bezier(.16,1,.3,1) forwards ob-fadeSlideIn;display:flex}@keyframes ob-fadeSlideIn{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}.ob-step-intro{animation-name:ob-fadeSlideUp}@keyframes ob-fadeSlideUp{0%{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}.ob-step-center{text-align:center;align-items:center;animation-name:ob-fadeScaleIn}@keyframes ob-fadeScaleIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.ob-heading{letter-spacing:-.02em;color:var(--ob-text);margin-bottom:8px;font-size:26px;font-weight:800;line-height:1.2}.ob-heading .ob-highlight{color:var(--ob-purple-600);position:relative}.ob-heading .ob-highlight:after{content:"";background:linear-gradient(90deg,var(--ob-purple-400),var(--ob-purple-600));opacity:.5;border-radius:2px;height:3px;position:absolute;bottom:-2px;left:0;right:0}.ob-subheading{color:var(--ob-text-secondary);margin-bottom:28px;font-size:15px;line-height:1.5}.ob-btn-primary{border-radius:var(--ob-radius);background:linear-gradient(135deg,var(--ob-purple-600)0%,var(--ob-purple-500)100%);color:#fff;cursor:pointer;width:100%;box-shadow:var(--ob-shadow-btn);border:none;justify-content:center;align-items:center;gap:8px;padding:16px 24px;font-size:17px;font-weight:700;transition:all .25s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;overflow:hidden}.ob-btn-primary:before{content:"";background:linear-gradient(90deg,#0000,#ffffff26,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.ob-btn-primary:hover:before{left:100%}.ob-btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 32px #6d28d959}.ob-btn-primary:active{box-shadow:var(--ob-shadow-md);transform:translateY(0)scale(.98)}.ob-btn-primary:disabled{background:var(--ob-border);color:var(--ob-text-muted);box-shadow:none;cursor:not-allowed;transform:none}.ob-btn-primary:disabled:before{display:none}.ob-btn-ghost{border-radius:var(--ob-radius);width:100%;color:var(--ob-text-muted);cursor:pointer;background:0 0;border:none;padding:14px 24px;font-size:15px;font-weight:600;transition:all .2s}.ob-btn-ghost:hover{color:var(--ob-text-secondary);background:var(--ob-surface-dim)}.ob-bottom-cta{padding:20px 24px;padding-bottom:max(20px,env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent 0%,var(--ob-surface)30%);position:sticky;bottom:0}.ob-option-card{border-radius:var(--ob-radius);border:1.5px solid var(--ob-border);background:var(--ob-surface);cursor:pointer;text-align:left;align-items:center;gap:14px;width:100%;padding:16px 18px;transition:all .25s cubic-bezier(.34,1.56,.64,1);display:flex}.ob-option-card:hover{border-color:var(--ob-purple-200);background:var(--ob-purple-50);box-shadow:var(--ob-shadow-sm);transform:translateY(-1px)}.ob-option-card.selected{border-color:var(--ob-purple-500);background:var(--ob-purple-50);box-shadow:0 0 0 3px #8b5cf61f,var(--ob-shadow-md)}.ob-option-icon{border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:22px;display:flex}.ob-option-label{color:var(--ob-text);flex:1;font-size:16px;font-weight:600}.ob-option-chevron{color:var(--ob-text-muted);flex-shrink:0;transition:color .2s,transform .2s}.ob-option-card:hover .ob-option-chevron,.ob-option-card.selected .ob-option-chevron{color:var(--ob-purple-500);transform:translate(2px)}.ob-checkbox{border:2px solid var(--ob-border-strong);background:0 0;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;transition:all .2s;display:flex}.ob-checkbox.checked{background:var(--ob-purple-600);border-color:var(--ob-purple-600);animation:.3s cubic-bezier(.34,1.56,.64,1) ob-checkPop}@keyframes ob-checkPop{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.ob-subject-card{border-radius:var(--ob-radius);border:1.5px solid var(--ob-border);background:var(--ob-surface);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;padding:20px 12px;transition:all .25s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;overflow:hidden}.ob-subject-card:hover{border-color:var(--ob-purple-200);box-shadow:var(--ob-shadow-sm);transform:translateY(-2px)}.ob-subject-card.selected{border-color:var(--ob-purple-500);background:linear-gradient(180deg,var(--ob-purple-50)0%,#f3eeff 100%);box-shadow:0 0 0 3px #8b5cf61a,var(--ob-shadow-md)}.ob-subject-card.selected .ob-subject-check{opacity:1;transform:scale(1)}.ob-subject-check{background:var(--ob-purple-600);opacity:0;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:absolute;top:8px;right:8px;transform:scale(.5)}.ob-subject-icon{border-radius:16px;justify-content:center;align-items:center;width:56px;height:56px;margin-bottom:10px;transition:all .25s;display:flex}.ob-subject-card.selected .ob-subject-icon{transform:scale(1.08)}.ob-subject-label{color:var(--ob-text);font-size:14px;font-weight:700}.ob-emoji-btn{cursor:pointer;flex-direction:column;align-items:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex}.ob-emoji-circle{background:var(--ob-surface-dim);filter:grayscale(.7);border:3px solid #0000;border-radius:50%;justify-content:center;align-items:center;width:88px;height:88px;margin-bottom:8px;font-size:44px;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex}.ob-emoji-btn:hover .ob-emoji-circle{filter:grayscale(0);border-color:var(--ob-purple-200);transform:scale(1.08)}.ob-emoji-btn.selected .ob-emoji-circle{filter:grayscale(0);border-color:var(--ob-purple-500);background:var(--ob-purple-50);box-shadow:0 0 0 6px #8b5cf61a,var(--ob-shadow-lg);transform:scale(1.15)}.ob-emoji-circle.large{width:110px;height:110px;font-size:56px}.ob-emoji-label{color:var(--ob-text-muted);text-align:center;font-size:12px;font-weight:600;transition:color .2s}.ob-emoji-btn.selected .ob-emoji-label{color:var(--ob-purple-600);font-weight:700}.ob-loader-ring{border-radius:50%;justify-content:center;align-items:center;width:220px;height:220px;margin:0 auto 32px;display:flex;position:relative}.ob-loader-ring:before{content:"";border:3px solid var(--ob-border);border-top-color:var(--ob-purple-500);border-radius:50%;animation:1.2s linear infinite ob-spin;position:absolute;inset:-4px}.ob-loader-ring:after{content:"";border:2px dashed var(--ob-purple-200);border-radius:50%;animation:3s linear infinite reverse ob-spin;position:absolute;inset:8px}@keyframes ob-spin{to{transform:rotate(360deg)}}.ob-loader-content{background:linear-gradient(135deg,var(--ob-purple-50),#f0e6ff);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:180px;height:180px;display:flex;position:relative;overflow:hidden}.ob-loader-content img{object-fit:contain;width:100px;height:100px}.ob-float-particle{opacity:.6;border-radius:50%;animation:3s ease-in-out infinite ob-float;position:absolute}@keyframes ob-float{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-12px)scale(1.1)}}.ob-progress-bar-track{background:var(--ob-border);border-radius:var(--ob-radius-full);width:100%;height:6px;overflow:hidden}.ob-progress-bar-fill{background:linear-gradient(90deg,var(--ob-purple-600),var(--ob-purple-400));border-radius:var(--ob-radius-full);height:100%;transition:width .4s cubic-bezier(.16,1,.3,1);position:relative}.ob-progress-bar-fill:after{content:"";width:10px;height:10px;box-shadow:0 0 8px var(--ob-purple-500);background:#fff;border-radius:50%;position:absolute;top:-2px;right:0}.ob-benefit-item{border-radius:var(--ob-radius);background:var(--ob-surface);border:1px solid var(--ob-border);align-items:flex-start;gap:16px;padding:16px;transition:all .2s;display:flex}.ob-benefit-item:hover{box-shadow:var(--ob-shadow-sm);transform:translate(4px)}.ob-benefit-icon{border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.ob-benefit-title{color:var(--ob-text);margin-bottom:2px;font-size:15px;font-weight:700}.ob-benefit-desc{color:var(--ob-text-secondary);font-size:13px}.ob-input-group{border-radius:var(--ob-radius);border:1.5px solid var(--ob-border);background:var(--ob-surface-dim);align-items:center;gap:12px;padding:14px 16px;transition:all .25s;display:flex}.ob-input-group:focus-within{border-color:var(--ob-purple-500);background:var(--ob-surface);box-shadow:0 0 0 4px #8b5cf614}.ob-input-group input{color:var(--ob-text);background:0 0;border:none;outline:none;flex:1;font-family:inherit;font-size:15px;font-weight:500}.ob-input-group input::placeholder{color:var(--ob-text-muted);font-weight:400}.ob-input-icon{color:var(--ob-text-muted);flex-shrink:0}.ob-input-divider{background:var(--ob-border-strong);width:1px;height:20px}.ob-input-prefix{color:var(--ob-text-secondary);flex-shrink:0;font-size:14px;font-weight:600}.ob-input-action{color:var(--ob-purple-600);cursor:pointer;background:0 0;border:none;border-radius:8px;flex-shrink:0;padding:4px 8px;font-family:inherit;font-size:13px;font-weight:700;transition:background .2s}.ob-input-action:hover{background:var(--ob-purple-50)}.ob-input-action.sent{color:var(--ob-green);cursor:default}.ob-insight-card{border-radius:var(--ob-radius-lg);background:linear-gradient(135deg,var(--ob-purple-50)0%,#ede1ff 100%);border:1px solid var(--ob-purple-200);padding:20px;position:relative;overflow:hidden}.ob-insight-card:before{content:"";background:radial-gradient(circle,#8b5cf626,#0000 70%);border-radius:50%;width:100px;height:100px;position:absolute;top:-30px;right:-30px}.ob-insight-badge{border-radius:var(--ob-radius-full);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--ob-purple-700);box-shadow:var(--ob-shadow-sm);background:#fffc;align-items:center;gap:6px;margin-bottom:12px;padding:6px 12px;font-size:12px;font-weight:700;display:inline-flex}.ob-insight-text{color:var(--ob-purple-800);z-index:1;font-size:15px;font-weight:600;line-height:1.5;position:relative}.ob-rec-item{border-radius:var(--ob-radius);background:var(--ob-surface-dim);border:1px solid var(--ob-border);align-items:center;gap:12px;padding:14px 16px;display:flex}.ob-rec-icon{border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.ob-rec-text{color:var(--ob-text);font-size:14px;font-weight:600}.ob-trophy-glow{width:200px;height:200px;margin:0 auto 24px;position:relative}.ob-trophy-glow:before{content:"";background:radial-gradient(circle,#f59e0b26,#0000 70%);border-radius:50%;animation:2s ease-in-out infinite ob-pulse-glow;position:absolute;inset:-20px}@keyframes ob-pulse-glow{0%,to{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.ob-confetti-container{pointer-events:none;position:absolute;inset:0;overflow:hidden}.ob-confetti{border-radius:2px;width:8px;height:8px;animation:linear infinite ob-confetti-fall;position:absolute}@keyframes ob-confetti-fall{0%{opacity:1;transform:translateY(-20px)rotate(0)}to{opacity:0;transform:translateY(100vh)rotate(720deg)}}.ob-footer-note{color:var(--ob-text-muted);justify-content:center;align-items:center;gap:6px;padding:12px 0;font-size:13px;display:flex}@media (min-width:1024px){.onboarding-shell{background:radial-gradient(at 20% 30%,#8b5cf60f 0%,#0000 50%),radial-gradient(at 80% 70%,#6d28d90a 0%,#0000 50%),linear-gradient(160deg,#f5f0ff 0%,#ede5ff 30%,#f8f7fc 60%,#fff 100%)}}.ob-spacer{flex:1}.ob-mt-auto{margin-top:auto}.ob-text-center{text-align:center}.ob-gap-12{gap:12px}.ob-gap-16{gap:16px}
