*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--navy: #0a1628;--navy-light: #1e3a5f;--accent: #2563eb;--white: #ffffff;--off-white: #f8fafc;--border: #e2e8f0;--text-main: #0a1628;--text-muted: #64748b;--success: #16a34a;--error: #dc2626;--radius: 12px;--shadow: 0 4px 24px rgba(10, 22, 40, .1)}body{font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--off-white);color:var(--text-main);min-height:100vh}#app{min-height:100vh;display:flex;flex-direction:column}nav{background:var(--navy);padding:0 2rem;height:64px;display:flex;align-items:center;justify-content:space-between}.nav-logo{color:var(--white);font-size:1.2rem;font-weight:700}.nav-home-btn{display:none;background:transparent;border:1px solid rgba(255,255,255,.4);color:var(--white);padding:.45rem .9rem;border-radius:8px;cursor:pointer}.nav-home-btn.visible{display:inline-block}.page{display:none;width:100%;padding:2.25rem 1.25rem;align-items:center;flex-direction:column}.page.active{display:flex}.home-hero{text-align:center;margin-bottom:2rem}.home-hero h1{color:var(--navy);margin-bottom:.5rem}.home-hero p{color:var(--text-muted)}.quiz-grid{width:100%;max-width:920px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}.quiz-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem;box-shadow:var(--shadow)}.quiz-card-title{font-weight:700;color:var(--navy);margin-bottom:.35rem}.quiz-card-meta{color:var(--text-muted);font-size:.9rem;margin-bottom:.9rem}.quiz-card-btn,.btn-primary{background:var(--navy);color:var(--white);border:0;border-radius:8px;padding:.6rem 1rem;cursor:pointer}.quiz-container{width:100%;max-width:700px;display:flex;flex-direction:column;gap:1rem}.quiz-title{color:var(--text-muted);font-size:.9rem;text-transform:uppercase;letter-spacing:.05em}.quiz-progress-bar{height:6px;background:var(--border);border-radius:999px;overflow:hidden;margin-top:.5rem}.quiz-progress-fill{height:100%;background:var(--accent);transition:width .25s ease}.quiz-counter{color:var(--text-muted);font-size:.85rem;text-align:right;margin-top:.35rem}.question-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:1.4rem;box-shadow:var(--shadow)}.question-image-wrap{display:none;width:100%;height:220px;border:1px solid var(--border);border-radius:10px;background:#f1f5f9;margin-bottom:1rem;overflow:hidden}.question-image-wrap.visible{display:flex;align-items:center;justify-content:center}.question-image{width:100%;height:100%;object-fit:contain}.question-text{color:var(--navy);font-weight:700;margin-bottom:1rem}.choices-list{list-style:none;display:grid;gap:.65rem}.choice-btn{width:100%;text-align:left;border:1px solid var(--border);border-radius:8px;background:var(--off-white);padding:.7rem .8rem;cursor:pointer}.choice-btn.correct{border-color:var(--success);color:var(--success)}.choice-btn.incorrect{border-color:var(--error);color:var(--error)}.choice-label{display:inline-flex;width:22px;height:22px;border-radius:999px;background:var(--border);align-items:center;justify-content:center;margin-right:.55rem;font-size:.75rem;font-weight:700}.next-btn{align-self:flex-end;background:var(--navy);color:var(--white);border:0;border-radius:8px;padding:.6rem 1rem;opacity:0;pointer-events:none}.next-btn.visible{opacity:1;pointer-events:auto}.results-container{width:100%;max-width:560px;background:var(--white);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:2rem;text-align:center}.results-title{color:var(--navy);font-weight:700;font-size:1.4rem}.results-score{color:var(--accent);font-size:3rem;font-weight:700;margin:.25rem 0}.results-label,.results-message{color:var(--text-muted)}.results-actions{margin-top:1rem;display:flex;gap:.75rem;justify-content:center}.btn-secondary{background:transparent;border:1px solid var(--navy);color:var(--navy);border-radius:8px;padding:.6rem 1rem;cursor:pointer}@media(max-width:640px){.question-image-wrap{height:180px}}