.app{min-height:100vh;background:linear-gradient(135deg,#0f0c29,#302b63,#24243e);display:flex;flex-direction:column;align-items:center;padding:2rem 1rem}.app-header{text-align:center;margin-bottom:2rem}.app-header h1{font-size:2rem;color:#fff;margin:0 0 .25rem}.app-subtitle{color:#a0a0c0;margin:0;font-size:1rem}.app-main{width:100%;max-width:640px;display:flex;flex-direction:column;gap:1.5rem}.progress-wrapper{background:rgba(255,255,255,.05);border-radius:12px;padding:1rem 1.25rem}.progress-info{display:flex;justify-content:space-between;color:#a0a0c0;font-size:.85rem;margin-bottom:.5rem}.progress-bar{height:8px;background:rgba(255,255,255,.1);border-radius:99px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#7c3aed,#a855f7);border-radius:99px;transition:width .4s ease}.question-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2rem;text-align:center}.question-emoji{font-size:2.5rem;margin-bottom:.75rem}.question-text{color:#fff;font-size:1.2rem;margin:0 0 1.5rem;line-height:1.5}.answers-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.answer-btn{background:rgba(255,255,255,.06);border:2px solid rgba(255,255,255,.12);border-radius:12px;padding:.9rem 1rem;color:#e0e0f0;font-size:.9rem;cursor:pointer;transition:all .2s ease;text-align:left;line-height:1.4}.answer-btn:hover{background:rgba(124,58,237,.2);border-color:#7c3aed;color:#fff}.answer-btn.selected{background:rgba(124,58,237,.35);border-color:#a855f7;color:#fff;box-shadow:0 0 0 1px #a855f7}.nav-buttons{display:flex;gap:1rem;justify-content:space-between}.nav-btn{flex:1;padding:.8rem 1.5rem;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;border:none;transition:all .2s ease}.nav-btn.primary{background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff}.nav-btn.primary:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.nav-btn.secondary{background:rgba(255,255,255,.08);color:#a0a0c0;border:1px solid rgba(255,255,255,.15)}.nav-btn.secondary:hover:not(:disabled){background:rgba(255,255,255,.12);color:#fff}.nav-btn:disabled{opacity:.35;cursor:not-allowed}.hint{text-align:center;color:#a855f7;font-size:.85rem;margin:0}.result-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:2.5rem 2rem;text-align:center}.result-emoji{font-size:4rem;margin-bottom:.5rem}.result-title{color:#a0a0c0;font-size:1rem;font-weight:400;margin:0 0 .25rem;text-transform:uppercase;letter-spacing:.1em}.result-profile{color:#fff;font-size:2rem;margin:0 0 1rem;background:linear-gradient(135deg,#a855f7,#ec4899);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.result-description{color:#c0c0d8;line-height:1.6;margin:0 0 2rem}.scores-section{text-align:left;margin-bottom:2rem}.scores-section h3{color:#a0a0c0;font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;margin:0 0 1rem}.score-row{display:flex;align-items:center;gap:.75rem;margin-bottom:.6rem}.score-label{color:#c0c0d8;font-size:.8rem;width:130px;flex-shrink:0}.score-bar-wrapper{flex:1;height:6px;background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden}.score-bar{height:100%;background:linear-gradient(90deg,#7c3aed,#a855f7);border-radius:99px;transition:width .6s ease}.score-value{color:#a0a0c0;font-size:.8rem;width:16px;text-align:right}.restart-btn{background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;border:none;border-radius:12px;padding:.9rem 2rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.restart-btn:hover{opacity:.9;transform:translateY(-1px)}.loading,.error-state{display:flex;flex-direction:column;align-items:center;gap:1rem;color:#a0a0c0;margin-top:4rem}.error-state span{font-size:3rem}.error-state p{margin:0;color:#e0e0f0}.error-hint{color:#a0a0c0!important;font-size:.85rem}.error-hint code{background:rgba(255,255,255,.1);padding:.1em .4em;border-radius:4px;color:#a855f7}.spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:#a855f7;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 480px){.answers-grid{grid-template-columns:1fr}.app-header h1{font-size:1.5rem}.question-text{font-size:1rem}}*,*:before,*:after{box-sizing:border-box}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}body{margin:0;min-height:100vh;background:#0f0c29}#root{min-height:100vh}h1,h2,h3{line-height:1.2}button{font-family:inherit}
