:root{--bg-primary: #0f1117;--bg-elevated: rgba(20, 27, 43, .85);--bg-gradient-top: #0f141f;--bg-gradient-mid: #243a6d;--bg-gradient-focus: #6f3bea;--bg-gradient-warm: #ff8d5c;--accent-primary: #6f3bea;--accent-secondary: #ff6b3d;--accent-tertiary: #c86bfa;--border-subtle: rgba(255, 255, 255, .08);--text-primary: #f5f6fb;--text-secondary: #b5bddb;--text-muted: #7c86a5;font-synthesis:none;text-rendering:optimizeLegibility;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:Manrope,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:radial-gradient(circle at 20% 20%,rgba(111,59,234,.4),transparent 55%),radial-gradient(circle at 80% 20%,rgba(200,107,250,.3),transparent 50%),radial-gradient(circle at 50% 75%,rgba(255,141,92,.35),transparent 55%),linear-gradient(160deg,var(--bg-gradient-top) 0%,#101523 45%,#090b12 100%);min-height:100vh;color:var(--text-primary)}#root{min-height:100vh;display:flex;align-items:stretch}.landing-shell,.app-shell{width:100%;max-width:1080px;margin:0 auto;padding:48px 24px 64px;display:flex;flex-direction:column;gap:32px}.glass-panel{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:22px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 24px 64px #00000059;overflow:hidden}.landing-hero{position:relative;background:linear-gradient(150deg,#0f1521eb,#181e2ecc);border-radius:28px;border:1px solid rgba(255,255,255,.06);padding:48px;overflow:hidden;display:grid;gap:32px}.landing-hero:after{content:"";position:absolute;inset:-15% -20% auto auto;width:420px;height:420px;background:radial-gradient(circle at center,rgba(111,59,234,.55),transparent 60%);filter:blur(10px)}.landing-hero:before{content:"";position:absolute;inset:auto auto -25% -10%;width:520px;height:520px;background:radial-gradient(circle at center,rgba(255,107,61,.42),transparent 70%);filter:blur(12px)}.landing-nav{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}.landing-brand{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;display:inline-flex;align-items:center;gap:16px;padding:0;cursor:pointer;color:inherit;font:inherit;transition:color .16s ease}.landing-brand:focus-visible{outline:2px solid rgba(200,107,250,.6);outline-offset:4px}.landing-brand:hover .landing-avatar{box-shadow:0 14px 28px #c86bfa66}.landing-brand:hover .landing-wordmark{color:#fff}.landing-links{display:flex;gap:18px;color:var(--text-muted);font-size:.95rem;flex-wrap:wrap}.landing-links span{cursor:default}.brand-logo{width:40px;height:40px;border-radius:12px}.brand-logo.small{width:32px;height:32px}.landing-content{position:relative;z-index:1;display:grid;gap:22px;max-width:640px}.landing-tag{align-self:start;background:#6f3bea38;color:var(--accent-tertiary);border-radius:999px;padding:8px 18px;text-transform:uppercase;font-size:.85rem;letter-spacing:.16em}.landing-title{font-size:3.2rem;margin:0;line-height:1.05;letter-spacing:-.02em}.landing-title span{background:linear-gradient(120deg,#ff8d5c,#c86bfa);-webkit-background-clip:text;color:transparent}.landing-subtitle{margin:0;color:var(--text-secondary);font-size:1.05rem;line-height:1.7}.landing-cta{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.landing-cta .button{flex:1 1 260px;min-width:240px;min-height:58px;padding:16px 28px;font-size:1rem;justify-content:center;text-align:center}.email-form{display:grid;gap:10px}.email-label{font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}.email-row{display:flex;gap:12px;flex-wrap:wrap}.email-input{flex:1 1 220px;min-width:200px;padding:12px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0c0f18e6;color:var(--text-primary);font-size:.95rem;transition:border .16s ease,box-shadow .16s ease}.email-input:focus{outline:none;border-color:#c86bfa99;box-shadow:0 0 0 2px #6f3bea40}.email-input.error{border-color:#ff5c7cb3}.email-save{padding:12px 18px}.email-error{color:var(--danger);font-size:.85rem}.email-success{color:var(--success);font-size:.85rem}.email-gate{display:flex;flex-direction:column;gap:32px;padding:32px}.email-gate-body{display:grid;gap:20px;max-width:520px}.gate-title{margin:0;font-size:2.1rem}.gate-subtitle{margin:0;color:var(--text-secondary);line-height:1.6}.email-form.gate .email-save{padding:12px 22px}.landing-footnote{font-size:.92rem;color:var(--text-muted)}.header{display:flex;flex-direction:column;gap:18px;padding:28px 32px 16px}.header-nav{display:flex;align-items:center;justify-content:space-between;gap:18px}.logo-lockup{display:inline-flex;align-items:center;gap:14px;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;padding:0;cursor:pointer;color:inherit;font:inherit;background:transparent;transition:color .16s ease}.logo-lockup:focus-visible{outline:2px solid rgba(200,107,250,.6);outline-offset:4px}.logo-avatar{position:relative;z-index:1;display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,#ff8d5c,#c86bfa);box-shadow:0 10px 20px #c86bfa52;overflow:hidden}.landing-avatar{width:40px;height:40px;border-radius:14px}.landing-avatar:after{border-radius:12px}.landing-avatar .brand-logo{width:26px;height:26px}.landing-wordmark{font-size:1.24rem;font-weight:600;letter-spacing:-.012em}.logo-avatar:after{content:"";position:absolute;top:1px;right:1px;bottom:1px;left:1px;border-radius:10px;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.22),transparent 60%),linear-gradient(160deg,#ffffff1f,#ffffff05);pointer-events:none}.logo-avatar .brand-logo{position:relative;z-index:1;width:24px;height:24px}.logo-lockup:hover .logo-avatar{box-shadow:0 12px 24px #c86bfa61}.logo-lockup:hover .logo-wordmark{color:#fff}.logo-lockup.logo-animating,.landing-brand.logo-animating{animation:logo-jiggle .7s ease-in-out;transform-origin:center}.logo-lockup.logo-animating .logo-avatar,.landing-brand.logo-animating .landing-avatar{animation:logo-neon .7s ease-in-out;box-shadow:0 0 18px #c86bfa7a}.logo-lockup.logo-animating .logo-wordmark,.landing-brand.logo-animating .landing-wordmark{animation:logo-glow-text .7s ease-in-out}@keyframes logo-jiggle{0%,to{transform:rotate(0)}20%{transform:rotate(-6deg)}40%{transform:rotate(5deg)}60%{transform:rotate(-4deg)}80%{transform:rotate(3deg)}}@keyframes logo-neon{0%,to{box-shadow:0 10px 20px #c86bfa52;filter:brightness(1)}50%{box-shadow:0 0 16px #c86bfaa6,0 0 32px #ff8d5c73;filter:brightness(1.15)}}@keyframes logo-glow-text{0%,to{color:var(--text-primary);text-shadow:none}50%{color:#fff;text-shadow:0 0 12px rgba(200,107,250,.55)}}.logo-wordmark{font-size:1.15rem;font-weight:600;letter-spacing:-.01em;color:var(--text-primary);display:inline-flex;align-items:baseline;gap:6px}.reset-button{padding:7px 18px;font-size:.82rem;line-height:1.2;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:8px;transition:transform .16s ease,box-shadow .2s ease}.nav-reset{background:#131927e6;border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px #ffffff0f;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.14em}.nav-reset:hover{transform:translateY(-1px);color:var(--text-primary);box-shadow:inset 0 1px #ffffff1f,0 12px 28px #00000047}.nav-reset:active{transform:translateY(0);box-shadow:inset 0 1px #ffffff14,0 8px 18px #0000003d}.logo-emoji{font-size:26px;background:linear-gradient(135deg,#ff8d5c,#ff6b3d 40%,#6f3bea);-webkit-background-clip:text;color:transparent;font-weight:700;letter-spacing:.04em}.title{font-size:2.6rem;line-height:1.1;margin:0}.subtitle{margin:0;max-width:640px;color:var(--text-secondary);font-size:.92rem;line-height:1.5}.progress-shell{padding:0 32px 24px}.badge{display:inline-flex;align-items:center;gap:8px;background:#6f3bea2e;border-radius:999px;padding:6px 16px;font-size:.85rem;color:var(--accent-tertiary);text-transform:uppercase;letter-spacing:.08em}.progress-bar{position:relative;height:8px;border-radius:999px;background:#ffffff0f;overflow:hidden}.progress-bar>span{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;transform-origin:left center;background:linear-gradient(90deg,var(--accent-primary) 0%,var(--accent-secondary) 100%);transition:transform .32s ease}.question-card{display:grid;gap:24px;padding:32px;max-width:420px;margin:0 auto}.question-meta{display:flex;flex-direction:column;gap:6px}.question-step{font-size:.9rem;letter-spacing:.14em;color:var(--text-muted);text-transform:uppercase}.question-title{font-size:1.9rem;margin:0}.question-detail{margin:0;color:#dfe2f0cc;line-height:1.65;max-width:720px}.options-grid{display:grid;gap:16px}.option-card{display:flex;align-items:flex-start;gap:18px;position:relative;width:100%;text-align:left;border-radius:18px;border:1px solid rgba(255,255,255,.04);background:#080a10c7;padding:20px 24px;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;isolation:isolate}.option-card:hover{transform:translateY(-2px);border-color:#c86bfa66;background:#141a28d9}.option-card.selected{border-color:#ffffff8c;box-shadow:0 18px 36px #6f3bea38;background:#191f30eb}.option-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:radial-gradient(circle at 50% 50%,#fff0,#fff0);opacity:0;pointer-events:none;transition:opacity .2s ease}.option-card.selected:after{animation:pulseBlink .52s ease}.option-card:focus-visible{outline:2px solid rgba(200,107,250,.6);outline-offset:2px}.option-checkbox{flex-shrink:0;width:22px;height:22px;border:2px solid rgba(255,255,255,.9);border-radius:6px;margin-top:3px;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease}.option-checkbox.checked{background:#f5f6fb;border-color:#f5f6fb;box-shadow:inset 0 0 0 4px #0f1117}.option-copy{display:flex;flex-direction:column;gap:10px}.option-title{font-size:1.1rem;margin:0}.option-detail{margin:0;font-size:.95rem;color:#e8ebf8c7;line-height:1.5}.option-quip{margin:0;font-size:.9rem;color:#ff9668e0}.break-card{border-radius:18px;border:1px dashed rgba(200,107,250,.4);background:#0c0f18c7;padding:28px 24px;text-align:center;display:grid;gap:14px;box-shadow:inset 0 0 0 1px #ffffff0a}.break-copy{margin:0;font-size:1.05rem;color:#e8ebf8e6;line-height:1.6}.break-aside{margin:0;font-size:.9rem;color:#c8cfeebf}.nav-row{display:flex;align-items:center;gap:16px;padding:0 32px 32px;width:100%}.nav-left{display:flex;gap:12px;align-items:center;margin-right:auto}.nav-row .lockin-button{flex:1;min-width:260px}.button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;padding:12px 20px;border-radius:12px;font-size:.95rem;font-weight:600;display:inline-flex;align-items:center;gap:10px;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}.button.primary{background:linear-gradient(120deg,var(--accent-primary),var(--accent-secondary));color:var(--text-primary);box-shadow:0 12px 28px #6f3bea61}.lockin-button,.backtrack-button{position:relative;overflow:hidden}.lockin-button{min-width:200px;justify-content:flex-end;padding:12px 32px}.lockin-button.animating{box-shadow:0 18px 32px #c86bfa59}.backtrack-button{padding:12px 28px;justify-content:flex-start;min-width:180px}.lockin-text,.backtrack-text{flex:1;display:block;position:relative;z-index:1;transform:translate(0);transition:transform .45s cubic-bezier(.25,.1,.25,1);white-space:nowrap}.lockin-text{text-align:right}.backtrack-text{text-align:left}.lockin-text.sliding{transform:translate(-45%)}.backtrack-text.sliding{transform:translate(35%)}.button-slider{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(120% 180% at 20% 50%,#ffffff2e,#fff0);transform:translate(-120%);transition:transform .45s cubic-bezier(.25,.1,.25,1);z-index:0;pointer-events:none}.button-slider.backward{transform:translate(120%);background:radial-gradient(120% 180% at 80% 50%,#ffffff29,#fff0)}.lockin-button.animating .button-slider.forward,.backtrack-button.animating .button-slider.backward{transform:translate(0)}.arrow{width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;position:relative;z-index:1;transition:transform .45s cubic-bezier(.25,.1,.25,1)}.arrow-right{border-left:9px solid currentColor}.arrow-left{border-right:9px solid currentColor}.lockin-button.animating .arrow-right{transform:translate(6px)}.backtrack-button.animating .arrow-left{transform:translate(-6px)}.button.secondary{background:#ffffff14;color:var(--text-secondary)}.button[disabled]{filter:grayscale(.4);pointer-events:none;opacity:.5}.reaction-bar{padding:24px 32px 32px;display:flex;gap:18px;align-items:center}.reaction-pill{background:#0f1117c2;border-radius:999px;padding:12px 20px;font-size:.92rem;border:1px solid rgba(255,255,255,.06);color:var(--text-secondary);min-height:44px;display:flex;align-items:center}.results-shell{display:grid;gap:24px;padding:32px}.results-header{display:flex;flex-direction:column;gap:10px}.results-title{font-size:2.2rem;margin:0}.results-subtitle{margin:0;color:var(--text-secondary);max-width:640px}.results-letter-strip{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}.letter-pill{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px;background:#6f3bea29;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:10px 14px}.letter-symbol{font-size:1.4rem;font-weight:700;letter-spacing:.08em;color:#f5f6fb}.letter-name{font-size:.85rem;color:#d9dcf0d9;letter-spacing:.04em;text-transform:uppercase}.results-type{display:inline-flex;gap:10px;align-items:center;font-size:1rem;background:#6f3bea33;color:var(--accent-tertiary);padding:8px 16px;border-radius:12px;font-weight:600;letter-spacing:.08em}.chart-card{background:#111521d1;border-radius:18px;padding:24px;border:1px solid rgba(255,255,255,.06);display:grid;gap:16px}.results-overview{display:grid;grid-template-columns:minmax(200px,260px) 1fr;gap:24px;align-items:stretch}.personality-card{background:#0c0f18d9;border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.06);display:grid;gap:12px;text-align:left}.personality-card h2{margin:0;font-size:1.8rem;letter-spacing:.08em;text-transform:uppercase}.personality-card p{margin:0;font-size:.95rem;color:#d9dcf0d9;line-height:1.6}.radar-shell{height:320px}.trait-grid{display:grid;gap:14px}.trait-row{display:flex;justify-content:space-between;align-items:center;background:#1a2134bf;border-radius:14px;padding:14px 18px;border:1px solid rgba(255,255,255,.05);gap:12px}.trait-name{font-weight:600;display:flex;flex-direction:column;gap:2px}.trait-name span{font-size:.82rem;font-weight:500;color:#b5bddbcc;letter-spacing:.04em;text-transform:uppercase}.trait-score{font-family:Manrope,sans-serif;color:var(--accent-tertiary);font-size:.95rem}.cta-banner{background:linear-gradient(130deg,#6f3bea59,#ff6b3d47);border-radius:18px;padding:20px 24px;display:grid;gap:18px;border:1px solid rgba(255,255,255,.08)}.cta-banner p{margin:0;color:var(--text-secondary)}.cta-actions{display:flex;flex-direction:column;gap:16px}.cta-buttons{display:flex;gap:12px;flex-wrap:wrap}@media (max-width: 768px){.landing-shell,.app-shell{padding:24px 16px 48px}.landing-hero{padding:24px 18px 32px;border-radius:20px;gap:24px}.landing-nav{flex-direction:column;align-items:stretch;gap:16px}.landing-brand{width:100%;justify-content:flex-start}.landing-links{width:100%;justify-content:space-between;gap:12px}.header,.question-card,.nav-row,.results-shell{padding:24px}.cta-banner{flex-direction:column;align-items:flex-start}.lockin-text.sliding{transform:translate(-20%)}}@media (max-width: 620px){.landing-hero{padding:24px 18px 32px;border-radius:20px}.landing-title{font-size:2.2rem}.landing-subtitle{font-size:.95rem}.header{padding:24px 20px 8px;text-align:left}.question-card{padding:20px;gap:18px;max-width:340px}.cta-buttons{flex-direction:column;align-items:stretch}.email-gate{padding:24px}.nav-row .lockin-button{min-width:0;padding:14px 20px}.gate-title{font-size:1.8rem}.cta-banner{padding:18px}.cta-actions{gap:12px}.question-title{font-size:1.6rem}.option-card{padding:18px 20px;gap:16px}.nav-row{padding:0 20px 24px;gap:12px}.nav-left{gap:10px}.reaction-bar{padding:16px 20px 24px}.results-overview{grid-template-columns:1fr}.personality-card{text-align:center}}@media (max-width: 420px){.landing-links{display:none}.landing-cta{flex-direction:column;align-items:stretch}.email-row{flex-direction:column;gap:10px}.button{width:100%;justify-content:center}.landing-shell{padding:20px 14px 40px;gap:20px}.landing-hero{padding:20px 14px 28px;border-radius:18px;gap:20px}.landing-brand strong{font-size:1rem}.landing-title{font-size:2rem;line-height:1.2}.landing-tag{font-size:.78rem}.email-input,.email-save{width:100%}}@keyframes pulseBlink{0%{opacity:0}30%{background:radial-gradient(circle at 50% 50%,#ffffffd9,#fff0);opacity:1}60%{background:radial-gradient(circle at 50% 50%,#ffffff59,#fff0);opacity:.6}to{background:radial-gradient(circle at 50% 50%,#fff0,#fff0);opacity:0}}