:root{--bg: #0a0e17;--bg-card: #141b2d;--bg-hover: #1a2340;--text: #e8eaf0;--text-dim: #8892a4;--text-muted: #5a6478;--border: #1e2a42;--radius: 6px;--green: #43A047;--yellow: #FDD835;--orange: #FF8C00;--red: #FF1744;--blue: #1E88E5;--purple: #AA00FF;--pink: #f472b6;--accent: #60a5fa}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg);color:var(--text);line-height:1.5;min-height:100vh}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.quiz-header{padding:2rem 1.5rem 1rem;text-align:center;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(20,27,45,.8) 0%,var(--bg) 100%)}.quiz-header-inner{max-width:700px;margin:0 auto}.quiz-header h1{font-family:JetBrains Mono,monospace;font-size:1.8rem;font-weight:700;letter-spacing:-.02em;background:linear-gradient(135deg,#60a5fa,#a78bfa,#f472b6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.quiz-header .subtitle{color:var(--text-dim);font-size:.95rem;margin-top:.3rem}.back-link{display:inline-block;margin-bottom:.5rem;font-size:.85rem;color:var(--text-muted)}.back-link:hover{color:var(--text);text-decoration:none}.quiz-main{max-width:640px;margin:0 auto;padding:2rem 1rem;min-height:60vh}.hidden{display:none!important}.quiz-intro-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:2.5rem 2rem;text-align:center}.quiz-intro-icon{font-size:3rem;margin-bottom:1rem}.quiz-intro-card p{color:var(--text-dim);font-size:1.05rem;line-height:1.6;margin-bottom:2rem}.quiz-start-btn{background:linear-gradient(135deg,#60a5fa,#a78bfa,#f472b6);color:#fff;border:none;padding:.9rem 2.5rem;font-size:1.1rem;font-weight:600;border-radius:8px;cursor:pointer;font-family:JetBrains Mono,monospace;transition:transform .15s,box-shadow .15s}.quiz-start-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #60a5fa4d}.quiz-progress{display:flex;gap:6px;margin-bottom:1.5rem}.progress-seg{flex:1;height:4px;border-radius:2px;background:var(--border);transition:background .3s}.progress-seg.done{background:var(--accent)}.progress-seg.active{background:var(--pink)}.quiz-card{animation:cardIn .35s ease-out}@keyframes cardIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.quiz-q-number{font-family:JetBrains Mono,monospace;font-size:.8rem;color:var(--pink);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.5rem}.quiz-scenario{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:1.5rem;margin-bottom:1rem}.quiz-scenario-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.quiz-scenario-text{font-size:1.05rem;line-height:1.6;color:var(--text)}.quiz-answers{display:flex;flex-direction:column;gap:.6rem}.quiz-answer-btn{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:1rem 1.2rem;text-align:left;color:var(--text);font-size:.95rem;line-height:1.5;cursor:pointer;transition:border-color .2s,background .2s,transform .15s;font-family:inherit}.quiz-answer-btn:hover{border-color:var(--accent);background:var(--bg-hover);transform:translate(4px)}.quiz-answer-btn:active{transform:translate(2px)}.quiz-answer-btn .answer-letter{display:inline-block;width:24px;height:24px;line-height:24px;text-align:center;border-radius:50%;background:#60a5fa26;color:var(--accent);font-family:JetBrains Mono,monospace;font-size:.75rem;font-weight:700;margin-right:.7rem;flex-shrink:0}.quiz-answer-btn{display:flex;align-items:flex-start}.quiz-loading{text-align:center;padding:4rem 1rem;color:var(--text-dim)}.loading-spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 1rem}@keyframes spin{to{transform:rotate(360deg)}}.result-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;overflow:hidden;animation:cardIn .4s ease-out}.result-header{display:flex;gap:1.2rem;padding:1.5rem;align-items:center;border-bottom:1px solid var(--border)}.result-photo{width:100px;height:100px;border-radius:10px;object-fit:cover;flex-shrink:0;border:2px solid var(--border)}.result-info{flex:1}.result-name{font-family:JetBrains Mono,monospace;font-size:1.3rem;font-weight:700}.result-faction{color:var(--text-dim);font-size:.9rem;margin-top:.2rem;display:flex;align-items:center;gap:.4rem}.result-faction .dot{width:8px;height:8px;border-radius:50%;display:inline-block}.result-family{margin-top:.5rem;font-size:.85rem;padding:.2rem .6rem;border-radius:20px;display:inline-block}.result-match{text-align:center;padding:1.5rem;border-bottom:1px solid var(--border)}.result-match-pct{font-family:JetBrains Mono,monospace;font-size:3.5rem;font-weight:700;background:linear-gradient(135deg,#60a5fa,#a78bfa,#f472b6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}.result-match-label{color:var(--text-muted);font-size:.85rem;margin-top:.3rem}.result-summary{padding:1.2rem 1.5rem;color:var(--text-dim);font-size:.95rem;line-height:1.6;border-bottom:1px solid var(--border);font-style:italic}.result-profiles{padding:1.2rem 1.5rem;border-bottom:1px solid var(--border)}.result-profiles-title{font-family:JetBrains Mono,monospace;font-size:.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.8rem}.profile-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.6rem}.profile-label{width:90px;font-size:.8rem;color:var(--text-dim);flex-shrink:0}.profile-bars{flex:1;display:flex;flex-direction:column;gap:3px}.profile-bar{height:6px;border-radius:3px;transition:width .6s ease-out}.profile-bar.user{background:var(--pink)}.profile-bar.mp{background:var(--accent)}.profile-bar-legend{display:flex;gap:1rem;font-size:.75rem;color:var(--text-muted);margin-bottom:.6rem}.profile-bar-legend span:before{content:"";display:inline-block;width:10px;height:6px;border-radius:3px;margin-right:4px;vertical-align:middle}.profile-bar-legend .legend-user:before{background:var(--pink)}.profile-bar-legend .legend-mp:before{background:var(--accent)}.result-companions{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;padding:1.2rem 1.5rem;border-bottom:1px solid var(--border)}.companion-card{background:#ffffff08;border:1px solid var(--border);border-radius:10px;padding:1rem;text-align:center}.companion-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.companion-photo{width:56px;height:56px;border-radius:8px;object-fit:cover;margin-bottom:.4rem;border:1px solid var(--border)}.companion-name{font-size:.85rem;font-weight:600}.companion-pct{font-family:JetBrains Mono,monospace;font-size:.8rem;margin-top:.2rem}.companion-card.friend .companion-pct{color:var(--green)}.companion-card.enemy .companion-pct{color:var(--red)}.result-actions{padding:1.2rem 1.5rem;display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}.result-btn{padding:.6rem 1.2rem;border-radius:8px;font-size:.85rem;font-weight:600;border:1px solid var(--border);background:var(--bg-card);color:var(--text);cursor:pointer;font-family:inherit;transition:border-color .2s,background .2s}.result-btn:hover{border-color:var(--accent);background:var(--bg-hover)}.result-btn.primary{background:linear-gradient(135deg,#60a5fa,#a78bfa);border:none;color:#fff}.result-btn.primary:hover{opacity:.9}.result-btn.restart{border-color:var(--pink);color:var(--pink)}.quiz-footer{border-top:1px solid var(--border);padding:1.5rem;text-align:center;font-size:.8rem;color:var(--text-muted)}.quiz-footer p{margin-bottom:.3rem}.quiz-footer a{color:var(--text-dim)}@media(max-width:600px){.quiz-header h1{font-size:1.4rem}.quiz-main{padding:1.2rem .8rem}.quiz-intro-card{padding:1.5rem 1.2rem}.quiz-scenario{padding:1.2rem}.quiz-answer-btn{padding:.9rem 1rem;font-size:.9rem}.result-header{flex-direction:column;text-align:center}.result-photo{width:80px;height:80px}.result-match-pct{font-size:2.8rem}.result-companions{grid-template-columns:1fr}.result-actions{flex-direction:column}.result-btn{width:100%;text-align:center}.profile-label{width:70px;font-size:.75rem}}