:root{--ink:#1c1c1c;--paper:#eae3d8;--orange:#ff6a00;--orange-l:#ffa64d;--orange-d:#b53e00;--green:#10b981;--pink:#ec4899;--yellow:#fbbf24;--muted:#eae3d88c;--border:#ff6a002e;--card-bg:#111;--selected:#ff6a001f;--ff-display:"Bebas Neue",sans-serif;--ff-serif:"DM Serif Display",serif;--ff-body:"DM Sans",sans-serif;--ease:cubic-bezier(.4,0,.2,1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--ink);color:var(--paper);font-family:var(--ff-body);min-height:100vh;font-weight:300;overflow-x:hidden}body:after{content:"";pointer-events:none;z-index:9999;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");position:fixed;inset:0}.nav{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:100;background:#1c1c1ce6;justify-content:space-between;align-items:center;padding:20px 40px;display:flex;position:sticky;top:0}.nav-logo{font-family:var(--ff-display);letter-spacing:.12em;color:var(--orange);align-items:center;gap:12px;font-size:20px;display:flex}.nav-logo img{width:auto;height:32px}.nav-step{color:var(--muted);letter-spacing:.08em;font-size:12px}.progress-wrap{background:#c9a84c1a;height:2px;position:relative}.progress-bar{background:var(--orange);height:100%;transition:width .5s var(--ease);position:relative}.progress-bar:after{content:"";background:var(--orange);width:8px;height:8px;box-shadow:0 0 10px var(--orange);border-radius:50%;position:absolute;top:-3px;right:0}.container{max-width:720px;margin:0 auto;padding:0 24px}.screen{display:none}.screen.active{display:block}.intro{justify-content:center;align-items:center;min-height:calc(100vh - 62px);padding:60px 24px;display:flex;position:relative;overflow:hidden}.intro-glow{pointer-events:none;background:radial-gradient(circle,#ff6a0017 0%,#0000 70%);border-radius:50%;width:700px;height:700px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.intro-grid{background-image:linear-gradient(#ff6a000d 1px,#0000 1px),linear-gradient(90deg,#ff6a000d 1px,#0000 1px);background-size:56px 56px;animation:25s linear infinite drift;position:absolute;inset:0}@keyframes drift{to{transform:translateY(56px)}}.intro-inner{z-index:2;text-align:center;max-width:620px;animation:fadeUp .8s var(--ease)forwards;position:relative}@keyframes fadeUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.intro-badge{border:1px solid var(--gold);color:var(--orange);letter-spacing:.2em;text-transform:uppercase;margin-bottom:32px;padding:6px 18px;font-size:11px;font-weight:500;display:inline-block}.intro-h1{font-family:var(--ff-display);letter-spacing:.02em;color:var(--paper);margin-bottom:24px;font-size:clamp(56px,10vw,100px);line-height:.92}.intro-h1 em{color:var(--orange);font-style:normal}.intro-p{color:var(--muted);max-width:480px;margin-bottom:40px;margin-left:auto;margin-right:auto;font-size:16px;line-height:1.75}.intro-meta{flex-wrap:wrap;justify-content:center;align-items:center;gap:24px;margin-bottom:40px;display:flex}.intro-meta-item{color:var(--muted);align-items:center;gap:8px;font-size:13px;display:flex}.intro-meta-item svg{flex-shrink:0;width:16px;height:16px}.intro-meta-item:first-child{color:var(--green)}.intro-meta-item:first-child svg{fill:var(--green)}.intro-meta-item:nth-child(2){color:var(--pink)}.intro-meta-item:nth-child(2) svg{fill:var(--pink)}.intro-meta-item:nth-child(3){color:var(--yellow)}.intro-meta-item:nth-child(3) svg{fill:var(--yellow)}.cta-highlight{background:linear-gradient(135deg,#10b98114 0%,#ec48990f 50%,#fbbf240f 100%);border:1px solid #10b98133;border-radius:8px;margin:48px 0 40px;padding:24px;position:relative;overflow:hidden}.cta-pulse{background:radial-gradient(circle at 25%,#10b98114 0%,#0000 40%),radial-gradient(circle at 75%,#fbbf2414 0%,#0000 40%);animation:3s ease-in-out infinite ctaPulse;position:absolute;inset:0}@keyframes ctaPulse{0%,to{opacity:.4}50%{opacity:.9}}.cta-content{z-index:2;position:relative}.cta-label{font-family:var(--ff-display);letter-spacing:.16em;text-transform:uppercase;color:var(--orange);margin-bottom:8px;font-size:11px;display:block}.cta-text{color:var(--paper);font-size:15px;font-weight:300;line-height:1.6}.cta-text em{color:var(--orange-l);font-style:normal;font-weight:500}.btn-primary{background:var(--orange);color:var(--ink);font-family:var(--ff-body);letter-spacing:.05em;cursor:pointer;border:none;align-items:center;gap:10px;padding:16px 36px;font-size:14px;font-weight:500;transition:background .2s,transform .15s,box-shadow .2s;display:inline-flex}.btn-primary:hover{background:var(--orange-l);transform:translateY(-2px);box-shadow:0 12px 36px #ff6a004d}.btn-arrow{transition:transform .2s}.btn-primary:hover .btn-arrow{transform:translate(4px)}.btn-ghost{color:var(--muted);border:1px solid var(--border);font-family:var(--ff-body);letter-spacing:.04em;cursor:pointer;background:0 0;align-items:center;gap:8px;padding:12px 24px;font-size:13px;transition:all .2s;display:inline-flex}.btn-ghost:hover{color:var(--paper);border-color:#ff6a0066}.quiz-wrap{min-height:calc(100vh - 62px);padding:60px 24px 100px}.q-header{animation:fadeUp .5s var(--ease)forwards;margin-bottom:48px}.q-num{font-family:var(--ff-display);letter-spacing:.2em;color:var(--orange);align-items:center;gap:12px;margin-bottom:16px;font-size:13px;display:flex}.q-num:before{content:"";background:var(--gold);width:28px;height:1px;display:block}.q-text{font-family:var(--ff-serif);color:var(--paper);font-size:clamp(22px,4vw,32px);font-style:italic;line-height:1.25}.q-sub{color:var(--muted);margin-top:10px;font-size:14px;line-height:1.6}.options{animation:fadeUp .6s var(--ease).1s both;flex-direction:column;gap:12px;display:flex}.option{background:var(--card-bg);border:1px solid var(--border);cursor:pointer;transition:all .2s var(--ease);align-items:flex-start;gap:16px;padding:20px 24px;display:flex;position:relative;overflow:hidden}.option:before{content:"";background:var(--selected);opacity:0;transition:opacity .2s;position:absolute;inset:0}.option:hover{border-color:#c9a84c59;transform:translate(4px)}.option:hover:before{opacity:1}.option.selected{border-color:var(--gold)}.option.selected:before{opacity:1}.opt-letter{border:1px solid var(--border);width:32px;height:32px;font-family:var(--ff-display);letter-spacing:.06em;color:var(--muted);z-index:1;flex-shrink:0;justify-content:center;align-items:center;font-size:16px;transition:all .2s;display:flex;position:relative}.option.selected .opt-letter{background:var(--orange);border-color:var(--gold);color:var(--ink)}.opt-content{z-index:1;position:relative}.opt-title{color:var(--paper);margin-bottom:4px;font-size:15px;font-weight:500;line-height:1.4}.opt-desc{color:var(--muted);font-size:13px;line-height:1.6}.q-footer{animation:fadeUp .6s var(--ease).2s both;justify-content:space-between;align-items:center;margin-top:48px;display:flex}.q-back{color:var(--muted);font-family:var(--ff-body);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;font-size:13px;transition:color .2s;display:flex}.q-back:hover{color:var(--paper)}.q-back:disabled{opacity:0;pointer-events:none}.loading-screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:32px;min-height:calc(100vh - 62px);padding:40px;display:flex}.loading-rings{width:80px;height:80px;position:relative}.ring{border:1px solid #0000;border-top-color:var(--orange);border-radius:50%;animation:1.2s linear infinite spin;position:absolute}.ring:first-child{animation-duration:1.2s;inset:0}.ring:nth-child(2){border-top-color:#ff6a0066;animation-duration:1.8s;inset:12px}.ring:nth-child(3){border-top-color:#ff6a0026;animation-duration:2.4s;inset:24px}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{font-family:var(--ff-display);letter-spacing:.06em;color:var(--paper);font-size:28px}.loading-sub{color:var(--muted);font-size:14px}.result-screen{padding:0 24px 100px}.result-hero{border-bottom:1px solid var(--border);margin-bottom:60px;padding:80px 0 60px;position:relative;overflow:hidden}.result-glow{pointer-events:none;background:radial-gradient(circle,#ff6a001a 0%,#0000 70%);border-radius:50%;width:500px;height:500px;position:absolute;top:0;right:-100px}.result-label{letter-spacing:.22em;text-transform:uppercase;color:var(--orange);align-items:center;gap:12px;margin-bottom:20px;font-size:11px;font-weight:500;display:flex}.result-label:before{content:"";background:var(--gold);width:28px;height:1px;display:block}.result-profile-name{font-family:var(--ff-display);letter-spacing:.02em;color:var(--paper);margin-bottom:24px;font-size:clamp(52px,9vw,88px);line-height:.92}.result-profile-name em{color:var(--gold);font-style:normal;display:block}.result-desc{color:#f4efe6a6;max-width:540px;margin-bottom:40px;font-size:17px;line-height:1.75}.match-badge{border:1px solid var(--border);border-left:3px solid var(--orange);color:var(--paper);background:#ff6a0014;align-items:center;gap:10px;padding:14px 20px;font-size:14px;display:inline-flex}.match-badge strong{color:var(--gold)}.result-cards{background:var(--border);border:1px solid var(--border);grid-template-columns:repeat(3,1fr);gap:1px;margin-bottom:48px;display:grid}@media (max-width:640px){.result-cards{grid-template-columns:1fr}}.result-card{background:var(--card-bg);padding:32px 28px}.rc-label{letter-spacing:.18em;text-transform:uppercase;color:var(--orange);margin-bottom:10px;font-size:11px;font-weight:500}.rc-value{font-family:var(--ff-display);color:var(--paper);margin-bottom:8px;font-size:36px;line-height:1}.rc-desc{color:var(--muted);font-size:13px;line-height:1.6}.score-section{margin-bottom:48px}.score-title{letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:20px;font-size:12px;font-weight:500}.score-bars{flex-direction:column;gap:14px;display:flex}.score-row{align-items:center;gap:16px;display:flex}.score-label{color:var(--muted);flex-shrink:0;width:160px;font-size:13px}.score-track{background:#ff6a001a;flex:1;height:4px;position:relative}.score-fill{background:var(--orange);height:100%;transition:width 1s var(--ease).3s}.score-pct{color:var(--orange);text-align:right;width:36px;font-size:12px;font-weight:500}.tf-wrap{flex-direction:column;justify-content:center;align-items:center;min-height:calc(100vh - 64px);padding:60px 24px 100px;display:flex;position:relative;overflow:hidden}.tf-bg-grid{pointer-events:none;background-image:linear-gradient(#ff6a000a 1px,#0000 1px),linear-gradient(90deg,#ff6a000a 1px,#0000 1px);background-size:56px 56px;animation:25s linear infinite drift;position:absolute;inset:0}.tf-bg-glow{pointer-events:none;background:radial-gradient(circle,#ff6a0012 0%,#0000 65%);border-radius:50%;width:600px;height:600px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.tf-dots{z-index:2;gap:8px;margin-bottom:52px;display:flex;position:relative}.tf-dot{background:var(--border);width:6px;height:6px;transition:all .3s var(--ease);border-radius:50%}.tf-dot.active{background:var(--orange);border-radius:3px;width:22px}.tf-dot.done{background:var(--orange-d)}.tf-field-wrap{z-index:2;width:100%;max-width:580px;position:relative}.tf-slide-in{animation:tfSlideIn .38s var(--ease)forwards}.tf-slide-out-up{animation:tfSlideOut .3s var(--ease)forwards}.tf-slide-idle{opacity:1}@keyframes tfSlideIn{0%{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}@keyframes tfSlideOut{0%{opacity:1;transform:none}to{opacity:0;transform:translateY(-24px)}}.tf-step-label{font-family:var(--ff-display);letter-spacing:.22em;text-transform:uppercase;color:var(--orange);align-items:center;gap:10px;margin-bottom:20px;font-size:12px;display:flex}.tf-step-label:before{content:"";background:var(--orange);width:24px;height:1px;display:block}.tf-question{font-family:var(--ff-serif);color:var(--paper);cursor:default;margin-bottom:10px;font-size:clamp(26px,5vw,40px);font-style:italic;line-height:1.2;display:block}.tf-subtitle{color:var(--muted);margin-bottom:36px;font-size:15px;line-height:1.7}.tf-input-row{border-bottom:2px solid #ff6a0040;align-items:stretch;gap:0;transition:border-color .2s;display:flex}.tf-input-row:focus-within{border-bottom-color:var(--orange)}.tf-input{font-family:var(--ff-body);color:var(--paper);caret-color:var(--orange);background:0 0;border:none;outline:none;flex:1;min-width:0;padding:12px 0;font-size:clamp(18px,3vw,26px);font-weight:300}.tf-input::placeholder{color:#eae3d833}.tf-input.tf-input-error{color:#ff6b6b}.tf-confirm-btn{background:var(--orange);cursor:pointer;width:44px;height:44px;color:var(--ink);border:none;flex-shrink:0;justify-content:center;align-self:flex-end;align-items:center;margin-bottom:2px;transition:background .2s,transform .15s;display:flex}.tf-confirm-btn:hover{background:var(--orange-l);transform:scale(1.05)}.tf-hint{color:#eae3d84d;align-items:center;gap:6px;margin-top:16px;font-size:12px;display:flex}.tf-hint kbd{font-size:11px;font-family:var(--ff-body);color:#eae3d866;background:#eae3d814;border:1px solid #eae3d826;border-radius:3px;padding:1px 6px;display:inline-block}.tf-error{color:#ff6b6b;animation:tfSlideIn .2s var(--ease);align-items:center;gap:6px;margin-top:14px;font-size:13px;display:flex}.tf-error:before{content:"!";background:#ff6b6b26;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;font-size:10px;font-weight:700;display:inline-flex}.tf-footer{z-index:2;align-items:center;gap:24px;display:flex;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}.tf-back-btn{color:var(--muted);font-family:var(--ff-body);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:8px 0;font-size:13px;transition:color .2s;display:flex}.tf-back-btn:hover{color:var(--paper)}.tf-progress-text{color:#eae3d840;letter-spacing:.06em;font-size:12px}.fade-out{animation:fadeOut .3s var(--ease)forwards}@keyframes fadeOut{to{opacity:0;transform:translateY(-12px)}}.fade-in{animation:fadeIn .4s var(--ease)forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}.cta-buttons{flex-direction:column;align-items:center;gap:12px;width:100%;display:flex}.btn-cta-main,.btn-cta-secondary{justify-content:center;width:100%;max-width:420px}@media (max-width:600px){.nav{padding:14px 20px}.nav-logo img{height:26px}.nav-step{font-size:11px}.intro{align-items:flex-start;padding:40px 20px 60px}.intro-inner{text-align:left}.intro-h1{font-size:clamp(48px,13vw,72px)}.intro-p{margin-left:0;margin-right:0;font-size:15px}.intro-meta{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:16px}.cta-highlight{margin:32px 0 28px;padding:20px}.btn-primary{justify-content:center;width:100%;padding:18px 24px;font-size:15px}.quiz-wrap{padding:32px 0 80px}.container{padding:0 20px}.q-header{margin-bottom:32px}.q-text{font-size:clamp(20px,5.5vw,28px)}.option{gap:12px;padding:16px}.opt-title{font-size:14px}.opt-desc{font-size:12px}.opt-letter{flex-shrink:0;width:28px;height:28px;font-size:14px}.q-footer{flex-direction:column-reverse;align-items:stretch;gap:12px;margin-top:32px}.q-footer .btn-primary{justify-content:center;width:100%}.q-back{justify-content:center;padding:12px 0}.tf-wrap{justify-content:flex-start;padding:60px 20px 80px}.tf-question{font-size:clamp(22px,6vw,32px)}.tf-input{font-size:clamp(16px,5vw,22px)}.tf-footer{bottom:24px}.loading-screen{padding:24px 20px}.loading-text{font-size:22px}.result-screen{padding:0 20px 60px}.result-hero{margin-bottom:40px;padding:48px 0 40px}.result-profile-name{font-size:clamp(44px,12vw,72px)}.result-desc{font-size:15px}.result-cards{grid-template-columns:1fr}.result-card{padding:24px 20px}.rc-value{font-size:28px}.score-label{width:110px;font-size:12px}.btn-cta-main,.btn-cta-secondary{max-width:100%}}