*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f0f1a;--surface:#1a1a2e;--surface2:#16213e;--border:#2a2a4a;--text:#e2e8f0;--text-muted:#94a3b8;--green:#00e5a0;--red:#ff4757;--yellow:#ffd32a;--blue:#4fc3f7;--sans:system-ui, "Segoe UI", Roboto, sans-serif}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased}#root{flex-direction:column;min-height:100vh;display:flex}.app{flex-direction:column;flex:1;display:flex}.home{flex-direction:column;flex:1;width:100%;max-width:480px;margin:0 auto;padding:24px 16px 40px;display:flex}.home-header{text-align:center;margin-bottom:32px}.home-logo{margin-bottom:8px;font-size:48px}.home-title{letter-spacing:-.5px;background:linear-gradient(135deg,#00e5a0,#4fc3f7);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:32px;font-weight:800}.home-subtitle{color:var(--text-muted);margin-top:6px;font-size:14px}.category-list{flex-direction:column;gap:14px;display:flex}.category-card{background:var(--surface);border:1px solid var(--border);cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:16px;align-items:center;gap:16px;padding:20px;transition:transform .15s,box-shadow .15s;display:flex}.category-card:active{transform:scale(.97)}.category-icon{border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:60px;height:60px;font-size:36px;display:flex}.category-info{text-align:left;flex:1}.category-title{color:var(--text);margin-bottom:4px;font-size:16px;font-weight:700}.category-desc{color:var(--text-muted);margin-bottom:8px;font-size:12px}.category-meta{color:var(--text-muted);gap:10px;font-size:11px;display:flex}.category-arrow{color:var(--text-muted);font-size:20px}.quiz{flex-direction:column;flex:1;width:100%;max-width:480px;margin:0 auto;padding:0 0 32px;display:flex}.quiz-header{justify-content:space-between;align-items:center;gap:12px;padding:16px 16px 0;display:flex}.quiz-progress-text{color:var(--text-muted);white-space:nowrap;font-size:13px}.quiz-score-badge{color:var(--green);white-space:nowrap;font-size:13px;font-weight:700}.timer-bar-wrap{background:var(--border);height:6px;margin:12px 0 0}.timer-bar-fill{border-radius:0 3px 3px 0;height:100%;transition:width 1s linear,background-color .3s}.mute-btn{background:var(--surface2);border:1px solid var(--border);cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:8px;padding:4px 8px;font-size:16px;line-height:1;transition:opacity .15s}.mute-btn:active{opacity:.7}.question-card{flex-direction:column;flex:1;padding:20px 16px 16px;display:flex}.question-number{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;font-size:12px;font-weight:600}.question-text{color:var(--text);margin-bottom:24px;font-size:18px;font-weight:700;line-height:1.45}.options-list{flex-direction:column;gap:12px;display:flex}.option-btn{background:var(--surface);border:2px solid var(--border);cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:left;border-radius:14px;align-items:center;gap:14px;width:100%;padding:16px;transition:border-color .15s,background .15s,transform .1s;display:flex}.option-btn:not(.answered):active{transform:scale(.98)}.option-btn.answered{cursor:default}.option-btn.correct{border-color:var(--green);background:#00e5a01f}.option-btn.wrong{border-color:var(--red);background:#ff47571f}.option-letter{background:var(--surface2);text-transform:uppercase;width:32px;height:32px;color:var(--text-muted);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;transition:background .15s,color .15s;display:flex}.option-btn.correct .option-letter{background:var(--green);color:#000}.option-btn.wrong .option-letter{background:var(--red);color:#fff}.option-text{color:var(--text);font-size:15px;font-weight:500;line-height:1.4}.explanation{color:var(--text);border-radius:12px;margin:16px 16px 0;padding:14px 16px;font-size:13px;line-height:1.5;animation:.25s slideUp}.explanation.correct-ex{border-left:4px solid var(--green);background:#00e5a01f}.explanation.wrong-ex{border-left:4px solid var(--red);background:#ff47571f}.explanation.timeout-ex{border-left:4px solid var(--yellow);background:#ffd32a1f}.score-bar-wrap{align-items:center;gap:10px;margin:0 16px;display:flex}.score-bar-track{background:var(--border);border-radius:4px;flex:1;height:8px;overflow:hidden}.score-bar-fill{background:var(--green);border-radius:4px;height:100%;transition:width .4s}.score-bar-label{color:var(--text-muted);white-space:nowrap;font-size:12px}.result{text-align:center;flex-direction:column;flex:1;align-items:center;width:100%;max-width:480px;margin:0 auto;padding:40px 16px;display:flex}.result-emoji{margin-bottom:16px;font-size:72px}.result-title{color:var(--text);margin-bottom:8px;font-size:28px;font-weight:800}.result-grade{margin-bottom:4px;font-size:48px;font-weight:900}.result-score-text{color:var(--text-muted);margin-bottom:32px;font-size:16px}.result-stats{grid-template-columns:1fr 1fr 1fr;gap:12px;width:100%;margin-bottom:32px;display:grid}.result-stat{background:var(--surface);border:1px solid var(--border);border-radius:14px;flex-direction:column;gap:4px;padding:16px 8px;display:flex}.result-stat-value{font-size:24px;font-weight:800}.result-stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:11px}.result-btn{cursor:pointer;-webkit-tap-highlight-color:transparent;border:none;border-radius:14px;width:100%;margin-bottom:12px;padding:16px;font-size:16px;font-weight:700;transition:opacity .15s,transform .1s}.result-btn:active{opacity:.85;transform:scale(.98)}.btn-whatsapp{color:#fff;background:#25d366}.btn-home{background:var(--surface);border:1px solid var(--border);color:var(--text)}@keyframes slideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:.3s fadeIn}