:root{--bg: #0d0d0d;--surface: #1a1a1a;--border: #2e2e2e;--text-primary: #f0f0f0;--text-muted: #888888;--accent: #c8a96e;--correct: #2e7d32;--incorrect: #c62828;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{background-color:var(--bg);color:var(--text-primary);font-family:var(--font);min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased}#root{min-height:100vh;display:flex;flex-direction:column}.quiz-shell{display:flex;flex-direction:column;min-height:100vh}.quiz-header{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border);background:var(--surface)}.quiz-header img{height:32px;width:auto}.quiz-header h1{font-size:1rem;font-weight:600;color:var(--accent);letter-spacing:.04em}.quiz-main{flex:1;display:flex;flex-direction:column;align-items:center;padding:24px 16px;width:100%;max-width:760px;margin:0 auto}.progress-bar-wrap{width:100%;margin-bottom:20px}.progress-label{font-size:.8rem;color:var(--text-muted);margin-bottom:6px}.progress-bar-track{width:100%;height:6px;background:var(--border);border-radius:999px;overflow:hidden}.progress-bar-fill{height:100%;background:var(--accent);border-radius:999px;transition:width .3s ease}.card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:24px;width:100%}.intro-screen{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;padding:40px 16px;max-width:540px;margin:0 auto}.intro-screen .logo{height:48px;width:auto}.intro-screen h2{font-size:1.75rem;font-weight:700;color:var(--accent);line-height:1.25}.intro-screen p{color:var(--text-muted);font-size:.95rem;max-width:440px}.intro-screen ul{list-style:none;display:flex;flex-direction:column;gap:8px;width:100%;max-width:380px}.intro-screen ul li{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:10px 16px;font-size:.88rem;color:var(--text-muted);text-align:left}.intro-screen ul li strong{color:var(--text-primary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 28px;border-radius:8px;border:none;cursor:pointer;font-family:var(--font);font-size:.95rem;font-weight:600;letter-spacing:.02em;transition:opacity .15s,transform .1s;text-decoration:none}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:#0d0d0d}.btn-primary:hover{opacity:.9}.btn-outline{background:transparent;color:var(--text-primary);border:1px solid var(--border)}.btn-outline:hover{border-color:var(--accent);color:var(--accent)}.btn-phishing{background:#7f1d1d;color:#fecaca;border:1px solid #991b1b;flex:1}.btn-phishing:hover{background:#991b1b}.btn-phishing.selected-correct{background:var(--correct);border-color:var(--correct);color:#fff}.btn-phishing.selected-wrong{background:var(--incorrect);border-color:var(--incorrect);color:#fff}.btn-legit{background:#14432a;color:#bbf7d0;border:1px solid #166534;flex:1}.btn-legit:hover{background:#166534}.btn-legit.selected-correct{background:var(--correct);border-color:var(--correct);color:#fff}.btn-legit.selected-wrong{background:var(--incorrect);border-color:var(--incorrect);color:#fff}.btn:disabled{cursor:not-allowed;opacity:.6}.answer-row{display:flex;gap:12px;width:100%;margin-top:16px}.email-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden;width:100%}.email-meta{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:6px}.email-meta-row{display:flex;gap:8px;font-size:.85rem;align-items:baseline;flex-wrap:wrap}.email-meta-label{color:var(--text-muted);min-width:60px;flex-shrink:0}.email-meta-value{color:var(--text-primary);word-break:break-all}.email-subject{padding:14px 20px;border-bottom:1px solid var(--border);font-weight:600;font-size:1rem;color:var(--text-primary)}.email-body{padding:20px;font-size:.9rem;line-height:1.75;color:var(--text-primary);white-space:pre-wrap;word-break:break-word}.email-link-span{color:#60a5fa;text-decoration:underline;cursor:default}.reveal-panel{width:100%;margin-top:16px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:14px}.reveal-verdict{display:flex;align-items:center;gap:10px;font-size:1rem;font-weight:700}.reveal-verdict.correct{color:#4ade80}.reveal-verdict.wrong{color:#f87171}.reveal-explanation{font-size:.88rem;color:var(--text-muted);line-height:1.65}.indicator-pills{display:flex;flex-wrap:wrap;gap:8px}.pill{display:inline-block;padding:4px 12px;border-radius:999px;font-size:.75rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;background:#292215;color:var(--accent);border:1px solid #3d3210}.reveal-next-row{display:flex;justify-content:flex-end}.results-screen{display:flex;flex-direction:column;gap:24px;width:100%}.results-score-banner{text-align:center;padding:32px 24px;border-radius:10px;background:var(--surface);border:1px solid var(--border)}.results-score-banner .score-number{font-size:3.5rem;font-weight:800;color:var(--accent);line-height:1;margin-bottom:8px}.results-score-banner .score-label{font-size:.9rem;color:var(--text-muted);margin-bottom:16px}.pass-fail-badge{display:inline-block;padding:6px 22px;border-radius:999px;font-size:.85rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.pass-fail-badge.pass{background:#1b3a2a;color:#4ade80;border:1px solid #2e7d32}.pass-fail-badge.fail{background:#3a1b1b;color:#f87171;border:1px solid #c62828}.results-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:10px}.results-table{width:100%;border-collapse:collapse;font-size:.85rem}.results-table th{text-align:left;padding:12px 16px;color:var(--text-muted);font-weight:600;border-bottom:1px solid var(--border);background:var(--surface);white-space:nowrap}.results-table td{padding:12px 16px;border-bottom:1px solid var(--border);color:var(--text-primary);vertical-align:middle}.results-table tr:last-child td{border-bottom:none}.results-table tr:nth-child(2n) td{background:#ffffff05}.result-icon{font-size:1.1rem}.result-icon.correct{color:#4ade80}.result-icon.wrong{color:#f87171}.answer-badge{display:inline-block;padding:2px 10px;border-radius:4px;font-size:.78rem;font-weight:600}.answer-badge.phishing{background:#3a1b1b;color:#fca5a5}.answer-badge.legit{background:#1b3a2a;color:#86efac}.results-actions{display:flex;justify-content:center}@media(max-width:500px){.quiz-main{padding:16px 12px}.card{padding:16px}.intro-screen h2{font-size:1.4rem}.email-body{font-size:.82rem}.btn{padding:11px 20px;font-size:.88rem}.results-table th,.results-table td{padding:10px;font-size:.78rem}}