.onboarding-container{display:flex;align-items:center;justify-content:space-between;min-height:100vh;background:radial-gradient(circle at center,#061926,#000);padding:60px 100px;gap:80px}.preview-side{flex:1.8 1;display:flex;justify-content:flex-start}.desktop-browser{width:1200px;height:660px;border-radius:14px;background:rgba(0,0,0,.9);box-shadow:0 0 110px rgba(124,58,237,.35);overflow:hidden;display:flex;flex-direction:column}.desktop-bar{display:flex;align-items:center;gap:8px;padding:10px 18px;background:rgba(20,20,20,.95)}.dot{width:12px;height:12px;border-radius:50%;display:inline-block}.dot.red{background:#ff5f57}.dot.yellow{background:#fdbc2e}.dot.green{background:#28c840}.browser-address{margin-left:12px;font-size:.9rem;color:#aaa;font-family:Inter,sans-serif}.desktop-preview-inner{flex:1 1;background-size:cover;background-position:50%;display:flex;justify-content:center;align-items:center;padding:40px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.profile-card{background:rgba(17,17,17,.6);border-radius:18px;padding:40px;text-align:center;color:#fff;box-shadow:0 0 60px rgba(124,58,237,.3);width:75%;max-width:850px;overflow-wrap:break-word;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .3s ease}.profile-avatar{border-radius:50%;margin-bottom:20px}.profile-name{font-size:1.8rem;font-weight:700;margin-bottom:10px}.profile-quote{font-size:1rem;color:#b7a9ff;margin-bottom:12px;font-style:italic}.profile-desc{font-size:1rem;color:#aaa;margin-bottom:20px;line-height:1.5;word-wrap:break-word;max-width:90%;margin-left:auto;margin-right:auto}.profile-socials{gap:10px}.profile-socials a{color:#7c3aed;text-decoration:none;font-weight:500}.profile-socials a:hover{color:#9b5de5}.input-side{flex:0.6 1;display:flex;justify-content:flex-end;align-items:center}.onboarding-step-box{background:rgba(15,15,15,.85);border-radius:18px;padding:45px 40px;color:#fff;width:500px;box-shadow:0 0 50px rgba(124,58,237,.35),inset 0 0 10px rgba(124,58,237,.15);display:flex;flex-direction:column;gap:20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(124,58,237,.25)}.onboarding-step-box h2{font-size:1.5rem;font-weight:600}.step-sub{font-size:1rem;color:#a1a1aa;margin-bottom:6px}.onboarding-step-box input{width:100%;background:#121212;border:1px solid #2a2a2a;border-radius:10px;padding:10px 15px;font-size:1rem;color:#fff;outline:none;transition:border .2s ease}.onboarding-step-box input:focus{border-color:#7c3aed}.onboarding-step-box button{width:auto;min-width:140px;padding:10px 0;background:linear-gradient(90deg,#7c3aed,#9b5de5);border:none;color:#fff;font-weight:600;border-radius:10px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.onboarding-step-box button:hover{transform:translateY(-1px);box-shadow:0 0 15px rgba(124,58,237,.4)}.onboarding-nav{display:flex;justify-content:space-between;gap:12px;margin-top:10px}.onboarding-nav button{flex:1 1;background:linear-gradient(90deg,#7c3aed,#9b5de5)!important;color:#fff;border:none}.onboarding-nav button:hover{transform:translateY(-1px);box-shadow:0 0 15px rgba(124,58,237,.4)}@media(max-width:900px){.preview-side{display:none}.onboarding-container{justify-content:center;align-items:center;flex-direction:column;padding:40px 20px;gap:30px}.input-side{justify-content:center;flex:unset;width:100%}.onboarding-step-box{width:100%;max-width:420px;padding:30px;box-shadow:0 0 30px rgba(124,58,237,.2)}.onboarding-step-box h2{font-size:1.3rem}}@media(max-width:600px){.onboarding-container{padding:25px 15px}.onboarding-step-box{padding:25px}.onboarding-step-box button,.onboarding-step-box input{font-size:.9rem}}.profile-socials{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:12px}.profile-socials a{display:flex;align-items:center;justify-content:center;background:rgba(17,17,17,.6);border-radius:50%;width:48px;height:48px;transition:all .2s ease}.profile-socials a:hover{background:rgba(124,58,237,.3);transform:scale(1.08);box-shadow:0 0 15px rgba(124,58,237,.4)}.social-icon{width:32px;height:32px;filter:brightness(0) invert(1);opacity:.95;transition:opacity .2s ease}.profile-socials a:hover .social-icon{opacity:1}.onboarding-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background:radial-gradient(circle at center,#061926,#000);color:#fff;font-family:Inter,sans-serif;gap:16px}.spinner{width:60px;height:60px;border:6px solid rgba(255,255,255,.1);border-top-color:#7c3aed;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}