:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%;height:100%}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.phone-auth-container{min-height:100vh;width:100vw;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--background)}.auth-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.auth-background img{width:100%;height:100%;object-fit:cover;transition:transform 20s ease-out}.phone-auth-container:hover .auth-background img{transform:scale(1.05)}.background-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at center,#0f0f2366,#0f0f23cc);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.auth-card-wrapper{position:relative;z-index:1;width:100%;max-width:480px;padding:24px;animation:fade-up .8s ease-out}.auth-content.glass-panel{background:#1a1a2ebf;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:48px 40px;box-shadow:0 25px 50px -12px #00000080}.auth-header{margin-bottom:32px;text-align:center}.auth-header h1{font-size:36px;font-weight:800;margin-bottom:12px;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.3);letter-spacing:-.5px}.auth-header p{font-size:16px;color:#fffc;line-height:1.5}.auth-form{gap:24px}.form-group label{margin-bottom:8px;font-size:13px;text-transform:uppercase;letter-spacing:.5px;font-weight:600;color:#ffffffb3}.phone-input-wrapper{background:#0000004d;border:1px solid rgba(255,255,255,.1);transition:all .2s ease}.phone-input-wrapper:focus-within{border-color:var(--primary);background:#00000080;box-shadow:0 0 0 4px #6366f133}.phone-input-wrapper .country-code{background:#ffffff0d;border-right:1px solid rgba(255,255,255,.1);padding:0 16px;display:flex;align-items:center;font-size:16px;color:#fff}.phone-input-wrapper input{padding:16px;font-size:18px;background:transparent;color:#fff;font-weight:500}.otp-input{font-family:Courier New,monospace;letter-spacing:12px;font-size:28px;padding:12px;background:#0000004d;border:1px solid rgba(255,255,255,.1);color:#fff;border-radius:8px}.otp-input:focus{border-color:var(--primary);background:#00000080;box-shadow:0 0 0 4px #6366f133}.dev-code-box{background:#10b98126;color:#34d399;padding:10px;border-radius:8px;font-size:14px;margin-bottom:16px;text-align:center;border:1px solid rgba(16,185,129,.3);animation:slide-down .3s ease}button[type=submit]{width:100%;padding:16px;font-size:16px;font-weight:600;background:linear-gradient(135deg,var(--primary),var(--primary-dark));box-shadow:0 4px 15px #6366f166}button[type=submit]:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #6366f180}.text-button{color:#fff9;font-size:14px;background:transparent;margin-top:8px}.text-button:hover{color:#fff;background:transparent;text-decoration:underline}.terms-text{font-size:12px;color:#ffffff80;text-align:center;margin-top:24px}@keyframes fade-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:600px){.auth-card-wrapper{padding:16px}.auth-content.glass-panel{padding:32px 24px}.auth-header h1{font-size:28px}}.onboarding-full-container{min-height:100vh;width:100vw;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--background)}.onboarding-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.onboarding-background img{width:100%;height:100%;object-fit:cover;transition:transform 20s ease-out}.background-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at center,#0f0f2380,#0f0f23e6);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.onboarding-content-wrapper{position:relative;z-index:1;width:100%;max-width:800px;padding:24px}.onboarding-card.glass-panel{background:#1a1a2ed9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:40px;box-shadow:0 25px 50px -12px #0009;display:flex;flex-direction:column;gap:32px;animation:fade-up .6s cubic-bezier(.16,1,.3,1)}.step-container .phone-auth-container{min-height:auto;padding:0;width:100%;background:transparent}.step-container .phone-auth-container .auth-background{display:none}.step-container .phone-auth-container .auth-card-wrapper{max-width:100%;padding:0}.step-container .phone-auth-container .auth-content.glass-panel{box-shadow:none;border:none;background:transparent;padding:0}.onboarding-progress{margin-bottom:0}.progress-bar{background:#ffffff1a}.step-dot{background:#ffffff0d;border-color:#fff3;color:#ffffff80}.progress-step.current .step-dot{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 0 15px #6366f180}.progress-step.completed .step-dot{background:var(--secondary);border-color:var(--secondary)}.step-label{color:#ffffff80}.progress-step.current .step-label{color:#fff;font-weight:500}.step-header h1{color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2)}.form-group label{color:#fffc}.form-group input,.form-group select,.form-group textarea{background:#0003;border-color:#ffffff26;color:#fff}.form-group input::placeholder,.form-group textarea::placeholder{color:#ffffff4d}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{background:#0006;border-color:var(--primary)}.quiz-question h2{color:#fff}.quiz-option{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#fff}.quiz-option:hover{background:#ffffff1a;border-color:#ffffff4d}.quiz-option.selected{background:#6366f133;border-color:var(--primary)}@media(max-width:640px){.onboarding-card.glass-panel{padding:24px;border-radius:0;min-height:100vh;border:none}.onboarding-content-wrapper{padding:0;max-width:100%}.step-label{display:none}}.center-align{display:flex;flex-direction:column;align-items:center;gap:12px}.photo-actions{display:flex;gap:12px;margin-top:8px}.secondary.small{padding:8px 16px;font-size:.9rem;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.secondary.small:hover{background:#fff3}.text-button{background:transparent;border:none;color:#fff9;cursor:pointer;font-size:.9rem;padding:8px;text-decoration:underline}.text-button:hover{color:#fff}.text-button.danger{color:#ef4444}.text-button.danger:hover{color:#f87171}.camera-button{position:absolute;bottom:0;right:0;background:var(--primary);color:#fff;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 6px #0000004d;transition:transform .2s,background .2s;font-size:1.2rem}.camera-button:hover{transform:scale(1.1);background:var(--primary-hover)}.avatar-section{position:relative;display:inline-block}.camera-modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease}.camera-modal-content{background:#1e1e2df2;border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:24px;width:90%;max-width:500px;display:flex;flex-direction:column;gap:20px;box-shadow:0 25px 50px -12px #00000080}.camera-preview-wrapper{width:100%;aspect-ratio:4/3;background:#000;border-radius:12px;overflow:hidden;position:relative;border:2px solid rgba(255,255,255,.1)}.camera-video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.camera-modal-controls{display:flex;justify-content:center;gap:16px;margin-top:8px}.camera-capture-btn-large{background:var(--primary);color:#fff;border:none;padding:12px 32px;border-radius:50px;font-size:1rem;font-weight:600;cursor:pointer;box-shadow:0 4px 12px #6366f166;transition:transform .2s,background .2s;display:flex;align-items:center;gap:8px}.camera-capture-btn-large:hover{background:var(--primary-hover);transform:translateY(-2px)}.camera-cancel-btn-large{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.1);padding:12px 24px;border-radius:50px;font-size:1rem;cursor:pointer;transition:background .2s}.camera-cancel-btn-large:hover{background:#fff3}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}:root{--primary: #6366f1;--primary-dark: #4f46e5;--primary-light: #818cf8;--secondary: #10b981;--background: #0f0f23;--surface: #1a1a2e;--surface-light: #252545;--text: #ffffff;--text-secondary: #a1a1aa;--text-muted: #71717a;--error: #ef4444;--success: #22c55e;--warning: #f59e0b;--border: #3f3f5c;--border-light: #52526e;--intellectual: #3b82f6;--visionary: #f59e0b;--protector: #22c55e;--creator: #ec4899;--fire: #ef4444;--water: #3b82f6;--earth: #84cc16;--air: #a1a1aa;--light: #fbbf24;--shadow: #8b5cf6;--nature: #22c55e}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--background);color:var(--text);line-height:1.6;min-height:100vh}.onboarding-progress{margin-bottom:32px}.progress-bar{height:4px;background:var(--surface);border-radius:2px;overflow:hidden;margin-bottom:16px}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--secondary));transition:width .5s ease}.progress-steps{display:flex;justify-content:space-between;gap:8px}.progress-step{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1}.step-dot{width:28px;height:28px;border-radius:50%;background:var(--surface);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--text-muted);transition:all .3s ease}.progress-step.current .step-dot{background:var(--primary);border-color:var(--primary);color:#fff}.progress-step.completed .step-dot{background:var(--secondary);border-color:var(--secondary);color:#fff}.step-label{font-size:11px;color:var(--text-muted);text-align:center}.progress-step.current .step-label{color:var(--text)}.onboarding-step{flex:1;display:flex;flex-direction:column}.step-header{text-align:center;margin-bottom:32px}.step-header h1{font-size:28px;font-weight:700;margin-bottom:8px;background:linear-gradient(135deg,var(--text),var(--primary-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.step-header p{color:var(--text-secondary);font-size:16px}.onboarding-form,.auth-form{display:flex;flex-direction:column;gap:20px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:14px;font-weight:500;color:var(--text)}.form-group input,.form-group select,.form-group textarea{padding:12px 16px;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:16px;transition:border-color .2s,box-shadow .2s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #6366f11a}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-muted)}.form-group select{cursor:pointer}.helper-text{font-size:12px;color:var(--text-muted)}.phone-input-wrapper{display:flex;align-items:stretch;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--surface)}.phone-input-wrapper .country-code{padding:12px 16px;background:var(--surface-light);color:var(--text-secondary);font-weight:500;border-right:1px solid var(--border)}.phone-input-wrapper input{flex:1;border:none;border-radius:0}.otp-input{text-align:center;font-size:24px;font-weight:600;letter-spacing:8px}button{padding:14px 24px;font-size:16px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}button:not(.secondary):not(.text-button):not(.nav-button):not(.option-button):not(.selection-card):not(.selection-pill):not(.dot){background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff}button:not(.secondary):not(.text-button):not(.nav-button):hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #6366f166}button:disabled{opacity:.5;cursor:not-allowed;transform:none}button.secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}button.secondary:hover:not(:disabled){background:var(--surface-light)}button.text-button{background:transparent;color:var(--primary-light);padding:8px}button.text-button:hover{text-decoration:underline}.button-row{display:flex;gap:12px;margin-top:16px}.button-row button{flex:1}.selection-grid{display:grid;gap:12px;margin-bottom:24px}.activities-grid{grid-template-columns:repeat(2,1fr)}.music-grid{grid-template-columns:repeat(3,1fr)}.selection-card{padding:20px;background:var(--surface);border:2px solid var(--border);border-radius:12px;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;transition:all .2s ease}.selection-card:hover{border-color:var(--border-light);background:var(--surface-light)}.selection-card.selected{border-color:var(--primary);background:#6366f11a}.selection-card .card-icon{font-size:32px}.selection-card .card-label{font-size:13px;text-align:center;color:var(--text)}.selection-pill{padding:12px 16px;background:var(--surface);border:1px solid var(--border);border-radius:20px;font-size:14px;color:var(--text);cursor:pointer;transition:all .2s ease}.selection-pill:hover{border-color:var(--border-light)}.selection-pill.selected{background:var(--primary);border-color:var(--primary);color:#fff}.selection-count{text-align:center;font-size:14px;color:var(--text-secondary);margin-bottom:16px}.quiz-header{text-align:center;margin-bottom:32px}.quiz-header h1{font-size:24px;margin-bottom:16px}.progress-text{font-size:14px;color:var(--text-secondary);margin-top:8px}.question-container{flex:1;display:flex;flex-direction:column;gap:24px}.question-category{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.category-badge{padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase}.category-badge.intellectual{background:var(--intellectual);color:#fff}.category-badge.visionary{background:var(--visionary);color:#fff}.category-badge.protector{background:var(--protector);color:#fff}.category-badge.creator{background:var(--creator);color:#fff}.dimension{font-size:13px;color:var(--text-muted)}.question-text{font-size:22px;font-weight:600;line-height:1.4}.options-list{display:flex;flex-direction:column;gap:12px}.option-button{padding:16px 20px;background:var(--surface);border:2px solid var(--border);border-radius:12px;text-align:left;cursor:pointer;transition:all .2s ease}.option-button:hover{border-color:var(--primary-light);background:var(--surface-light)}.option-button.selected{border-color:var(--primary);background:#6366f126}.option-text{font-size:16px;color:var(--text)}.quiz-navigation{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:32px;padding-top:24px;border-top:1px solid var(--border)}.nav-button{padding:10px 20px;font-size:14px;background:var(--surface);border:1px solid var(--border);color:var(--text)}.nav-button.submit{background:linear-gradient(135deg,var(--secondary),#059669);border:none}.question-dots{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.dot{width:8px;height:8px;border-radius:50%;background:var(--surface);border:1px solid var(--border);padding:0;cursor:pointer}.dot.current{background:var(--primary);border-color:var(--primary)}.dot.answered{background:var(--secondary);border-color:var(--secondary)}.spirit-reveal{position:relative;overflow:hidden}.mystical-background{position:absolute;inset:-50%;background:radial-gradient(circle at center,rgba(99,102,241,.2),transparent 50%);animation:pulse 4s ease-in-out infinite}.mystical-background.animated{animation:mystical-spin 3s linear infinite}.mystical-background.glowing{background:radial-gradient(circle at center,rgba(99,102,241,.3),rgba(16,185,129,.2) 50%,transparent 70%)}@keyframes pulse{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.1);opacity:.8}}@keyframes mystical-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spirit-reveal .content{position:relative;z-index:1;text-align:center}.spirit-reveal.intro h1{font-size:48px;margin-bottom:24px;background:linear-gradient(135deg,#fff,var(--primary-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.spirit-reveal.intro p{color:var(--text-secondary);max-width:600px;margin:0 auto 24px;font-size:1.1rem;line-height:1.6}.spirit-reveal.intro p.emphasis{color:var(--text);font-size:1.5rem;font-weight:600;margin-top:16px}.mystical-button{margin-top:32px;padding:20px 48px;font-size:1.25rem;font-weight:600;letter-spacing:.5px;background:linear-gradient(135deg,var(--primary),#8b5cf6);box-shadow:0 10px 30px #6366f166;transform:translateY(0);transition:all .3s ease}.mystical-button:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 20px 40px #6366f199}.spirit-orb{width:120px;height:120px;margin:0 auto 24px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--secondary));box-shadow:0 0 60px var(--primary)}.spirit-orb.pulsing{animation:orb-pulse 1.5s ease-in-out infinite}@keyframes orb-pulse{0%,to{transform:scale(1);box-shadow:0 0 60px var(--primary)}50%{transform:scale(1.1);box-shadow:0 0 80px var(--primary)}}.loading-text{font-size:18px;color:var(--text-secondary);animation:fade 2s ease-in-out infinite}@keyframes fade{0%,to{opacity:.5}50%{opacity:1}}.spirit-reveal-animation{animation:reveal-in 1s ease-out}@keyframes reveal-in{0%{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.spirit-image-container{width:280px;height:280px;margin:0 auto 32px;border-radius:50%;overflow:hidden;border:4px solid var(--primary);box-shadow:0 0 60px #6366f199;transition:transform .3s ease}.spirit-image-container:hover{transform:scale(1.05);box-shadow:0 0 80px #6366f1cc}.spirit-image{width:100%;height:100%;object-fit:cover}.spirit-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:72px;font-weight:700;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff}.spirit-name{font-size:56px;font-weight:800;margin-bottom:12px;background:linear-gradient(135deg,#fff,var(--primary-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 10px 30px rgba(99,102,241,.3)}.spirit-tagline{font-size:1.5rem;color:var(--text-secondary);margin-bottom:32px;font-weight:500;max-width:600px;margin-left:auto;margin-right:auto}.spirit-attributes{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:16px}.spirit-attributes .attribute{padding:10px 24px;border-radius:50px;font-size:1rem;font-weight:600;letter-spacing:.5px;box-shadow:0 4px 12px #0003}.attribute.element{text-transform:capitalize}.attribute.element.fire{background:var(--fire);color:#fff}.attribute.element.water{background:var(--water);color:#fff}.attribute.element.earth{background:var(--earth);color:#fff}.attribute.element.air{background:var(--air);color:#fff}.attribute.element.light{background:var(--light);color:#1a1a2e}.attribute.element.shadow{background:var(--shadow);color:#fff}.attribute.element.nature{background:var(--nature);color:#fff}.attribute.mbti{background:var(--surface-light);border:1px solid var(--primary);color:var(--primary-light)}.attribute.energy{background:var(--surface);border:1px solid var(--border);color:var(--text)}.spirit-details-container{background:var(--surface);border-radius:16px;padding:24px;max-height:80vh;overflow-y:auto}.spirit-header{display:flex;gap:20px;align-items:flex-start;margin-bottom:24px}.spirit-avatar{width:80px;height:80px;border-radius:50%;overflow:hidden;flex-shrink:0}.spirit-avatar img{width:100%;height:100%;object-fit:cover}.avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;font-size:32px;font-weight:700}.spirit-info h1{font-size:24px;margin-bottom:4px}.spirit-info .description{color:var(--text-secondary)}.spirit-story,.spirit-traits,.spirit-evolution,.spirit-attributes-full{margin-bottom:24px}.spirit-story h3,.spirit-traits h3,.spirit-evolution h3,.spirit-attributes-full h3{font-size:16px;margin-bottom:12px;color:var(--text-secondary)}.spirit-story p{line-height:1.7}.traits-container{display:flex;gap:24px}.trait-group h4{font-size:13px;color:var(--text-muted);margin-bottom:8px}.trait-tags{display:flex;flex-wrap:wrap;gap:8px}.trait-tag{padding:6px 12px;border-radius:16px;font-size:13px}.trait-tag.primary{background:#6366f133;color:var(--primary-light)}.trait-tag.secondary{background:var(--surface-light);color:var(--text-secondary)}.evolution-intro{color:var(--text-secondary);margin-bottom:12px}.evolution-paths{display:flex;flex-direction:column;gap:12px}.evolution-path-preview{padding:16px;background:var(--surface-light);border-radius:12px}.evolution-path-preview h4{font-size:16px;margin-bottom:4px}.evolution-path-preview p{font-size:14px;color:var(--text-secondary);margin-bottom:8px}.stages-count{font-size:12px;color:var(--text-muted)}.attributes-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.attribute-item{display:flex;flex-direction:column;gap:4px}.attribute-label{font-size:12px;color:var(--text-muted)}.attribute-value{font-size:14px;font-weight:500;padding:6px 12px;background:var(--surface-light);border-radius:8px;display:inline-block;width:fit-content}.attribute-value.element{text-transform:capitalize}.continue-button{width:100%;margin-top:24px}.profile-preview{text-align:center;margin-bottom:32px}.avatar-section{margin-bottom:16px}.profile-avatar{width:120px;height:120px;border-radius:50%;object-fit:cover;border:4px solid var(--primary)}.avatar-placeholder.large{width:120px;height:120px;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;font-size:48px;font-weight:700}.name-display{font-size:24px;font-weight:600;margin-bottom:8px}.spirit-badge{display:inline-block;padding:6px 16px;background:#6366f133;border-radius:20px;font-size:14px;color:var(--primary-light)}.error-message{padding:12px 16px;background:#ef44441a;border:1px solid var(--error);border-radius:8px;color:var(--error);font-size:14px}.terms-text{text-align:center;font-size:12px;color:var(--text-muted)}.loader{width:48px;height:48px;border:4px solid var(--surface);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--text-secondary)}@media(max-width:480px){.onboarding-container{padding:16px}.form-row,.activities-grid{grid-template-columns:1fr}.music-grid{grid-template-columns:repeat(2,1fr)}.step-header h1{font-size:24px}.question-text{font-size:18px}.spirit-name{font-size:28px}.spirit-image-container{width:150px;height:150px}.traits-container{flex-direction:column;gap:16px}.attributes-grid{grid-template-columns:1fr}.progress-steps{display:none}}.home-container{min-height:100vh;width:100vw;background-color:#0f172a;background-image:radial-gradient(ellipse at 0% 0%,var(--spirit-primary, #c7d2fe) 0px,transparent 40%),radial-gradient(ellipse at 100% 100%,var(--spirit-secondary, #818cf8) 0px,transparent 40%);color:#fff;overflow-x:hidden}.home-background-glow{position:fixed;inset:0;background:radial-gradient(circle at 50% 50%,transparent 0%,rgba(0,0,0,.4) 100%);pointer-events:none;z-index:0}.glass-panel,.glass-card{background:#ffffff0d;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);border-radius:20px}.home-header{display:flex;justify-content:space-between;align-items:center;padding:20px 48px;margin-bottom:40px;position:relative;z-index:10;border-radius:0;border-top:none;border-left:none;border-right:none}.user-profile-summary{display:flex;align-items:center;gap:20px}.header-avatar,.header-avatar-placeholder{width:60px;height:60px;border-radius:50%;flex-shrink:0}.header-avatar{object-fit:cover;border:3px solid var(--spirit-accent, #6366f1)}.header-avatar-placeholder{background:linear-gradient(135deg,#6366f1,#8b5cf6);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.5rem;color:#fff;border:3px solid rgba(255,255,255,.2)}.header-text h1{font-size:1.5rem;margin:0;font-weight:600}.subtitle-row{display:flex;align-items:center;gap:16px;margin-top:6px}.location-tag{font-size:.95rem;color:#ffffffb3}.location-tag:before{content:"📍 "}.mbti-badge{background:linear-gradient(135deg,#6366f1,#8b5cf6);padding:5px 12px;border-radius:6px;font-size:.75rem;font-weight:700;letter-spacing:.5px}.logout-button-small{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#f87171;padding:12px 24px;border-radius:10px;cursor:pointer;font-size:.9rem;font-weight:500;transition:all .2s}.logout-button-small:hover{background:#ef444433}.home-content{position:relative;z-index:1;padding:0 48px 60px}.loading-spinner{display:flex;align-items:center;justify-content:center;height:400px;font-size:1.2rem;color:#fff9}.dashboard-grid{display:flex;gap:48px;align-items:flex-start}.spirit-section{flex:0 0 420px;width:420px;padding:32px;display:flex;flex-direction:column;gap:24px}.spirit-section .spirit-header{text-align:center}.section-label{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:3px;color:#ffffff80;margin-bottom:8px}.spirit-section .spirit-header h2{font-size:2.25rem;font-weight:700;margin:0;background:linear-gradient(135deg,#fff,var(--spirit-primary, #a5b4fc));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.spirit-visual-container{position:relative;width:260px;height:260px;margin:0 auto}.spirit-visual-container .spirit-image,.spirit-image-placeholder{width:100%;height:100%;border-radius:20px;position:relative;z-index:2}.spirit-visual-container .spirit-image{object-fit:cover}.spirit-image-placeholder{background:linear-gradient(135deg,var(--spirit-primary, #6366f1),var(--spirit-secondary, #8b5cf6));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.spirit-initial{font-size:4rem;font-weight:700;color:#ffffffe6}.spirit-name-fallback{font-size:.9rem;font-weight:500;color:#ffffffb3;text-transform:uppercase;letter-spacing:2px}.spirit-aura{position:absolute;inset:-20px;background:radial-gradient(circle,var(--spirit-primary, #6366f1) 0%,transparent 70%);opacity:.2;z-index:1;border-radius:50%;animation:pulse 3s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:.2}50%{transform:scale(1.05);opacity:.3}}.spirit-traits{text-align:center}.trait-badges{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.trait-badge{padding:8px 16px;border-radius:20px;font-size:.85rem;font-weight:500;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#ffffffd9;text-transform:capitalize}.trait-badge.element{background:#ef444426;border-color:#ef44444d;color:#fca5a5}.trait-badge.energy{background:#3b82f626;border-color:#3b82f64d;color:#93c5fd}.xp-container{background:#0003;border-radius:14px;padding:20px}.xp-info{display:flex;justify-content:space-between;margin-bottom:12px}.xp-info .level{font-weight:600;color:var(--spirit-primary, #a5b4fc)}.xp-info .xp-count{color:#ffffff80;font-size:.9rem}.xp-bar-track{height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden}.xp-bar-fill{height:100%;background:linear-gradient(90deg,var(--spirit-primary, #6366f1),var(--spirit-secondary, #a5b4fc));border-radius:4px}.profile-column{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:32px}.info-card{padding:32px}.info-card h3{font-size:1.35rem;font-weight:600;margin:0 0 16px;color:#fff}.user-bio{font-size:1.1rem;line-height:1.7;color:#ffffffbf;margin:0 0 28px;word-wrap:break-word;overflow-wrap:break-word}.info-grid{display:flex;flex-wrap:wrap;gap:40px}.info-item{min-width:140px}.info-item label{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:1.5px;color:#fff6;font-weight:500;margin-bottom:6px}.info-item span{display:block;font-size:1.15rem;font-weight:600;color:#fff;text-transform:capitalize}.tags-container{display:flex;flex-wrap:wrap;gap:12px}.interest-tag{padding:10px 20px;border-radius:20px;font-size:.9rem;font-weight:500;text-transform:capitalize;white-space:nowrap}.interest-tag.activity{background:#10b9811f;border:1px solid rgba(16,185,129,.25);color:#6ee7b7}.interest-tag.music{background:#ec48991f;border:1px solid rgba(236,72,153,.25);color:#f9a8d4}.empty-tags{color:#fff6;font-style:italic}.empty-state{text-align:center;padding:80px 40px;max-width:500px;margin:0 auto}.empty-state p{font-size:1.2rem;color:#fff9;margin-bottom:28px}.secondary-button{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#fff;padding:14px 28px;border-radius:12px;cursor:pointer;font-size:1rem;font-weight:500}.secondary-button:hover{background:#ffffff1f}.animated-entry{animation:fadeUp .5s ease-out forwards;opacity:0}.animated-entry.delay-1{animation-delay:.1s}.animated-entry.delay-2{animation-delay:.2s}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1100px){.home-header{padding:20px 32px}.home-content{padding:0 32px 48px}.dashboard-grid{gap:32px}.spirit-section{flex:0 0 360px;width:360px}.spirit-visual-container{width:220px;height:220px}.info-grid{gap:28px}}@media(max-width:900px){.dashboard-grid{flex-direction:column;gap:32px}.spirit-section{flex:none;width:100%;max-width:500px;margin:0 auto}.spirit-visual-container{width:240px;height:240px}.profile-column{width:100%}}@media(max-width:600px){.home-header{flex-direction:column;align-items:flex-start;gap:16px;padding:20px 24px}.logout-button-small{position:absolute;top:20px;right:24px}.home-content{padding:0 20px 40px}.spirit-section{padding:24px}.spirit-section .spirit-header h2{font-size:1.85rem}.spirit-visual-container{width:200px;height:200px}.spirit-initial{font-size:3.5rem}.info-card{padding:24px}.info-card h3{font-size:1.2rem}.info-grid{gap:24px}.info-item{min-width:120px}.info-item span{font-size:1rem}.interest-tag{padding:8px 16px;font-size:.85rem}}