/* Citizenship test practice. Brand colors; the progress bar is gold, not a status color. */
#cv-app [hidden],#cv-app[hidden]{display:none!important}
.cv-progress-wrap{margin:8px 0 16px}
.cv-progress-text{font-weight:700;margin:0 0 6px}
.cv-bar{height:10px;border-radius:999px;background:var(--border);overflow:hidden}
.cv-bar span{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.cv-modes{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.cv-mode[aria-pressed=true]{background:var(--text);color:var(--bg)}
.cv-options{display:grid;gap:10px;margin:0 0 20px;padding:14px 16px;background:var(--bg-alt);border-radius:8px}
.cv-options label{font-weight:500}
.cv-options select,.cv-options input[type=search]{font:inherit;padding:8px;border:1px solid var(--border);border-radius:6px;max-width:100%}
.cv-card{padding:20px;border:1px solid var(--border);border-radius:8px;background:var(--bg);margin:0 0 16px}
.cv-meta{font-size:.9rem;color:var(--muted);margin:0 0 6px}
.cv-q{font-family:inherit;font-size:1.3rem;font-weight:700;margin:0 0 8px}
.cv-item .cv-q{font-size:1.1rem}
.cv-answers{margin:8px 0}
.cv-score{font-weight:700;margin:0 0 10px}
.cv-star{color:var(--good);font-weight:700;white-space:nowrap}
.cv-known{font-size:.8rem;font-family:inherit;font-weight:600;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:1px 8px}
.cv-n{color:var(--muted)}
.cv-sub{margin:24px 0 8px;font-size:1.15rem}
.cv-item{padding:10px 0;border-top:1px solid var(--border)}
.citizenship-app .btn.link{border-color:transparent;background:none;text-decoration:underline;color:var(--text);padding:4px 0}

.cv-opts{display:grid;gap:8px;margin:12px 0}
.cv-opt{display:flex;gap:12px;align-items:flex-start;text-align:start;font:inherit;padding:12px 14px;border:2px solid var(--border);border-radius:8px;background:var(--bg);color:var(--text);cursor:pointer}
.cv-opt:hover:not(:disabled){border-color:var(--text)}
.cv-opt:disabled{cursor:default}
.cv-letter{flex:none;font-weight:700;width:1.4em}
.cv-opt-right{border-color:var(--good);background:var(--good-bg)}
.cv-opt-wrong{border-color:var(--bad);background:var(--bad-bg)}
.cv-verdict{font-weight:700;margin:12px 0 4px}


.citizenship-app button,.citizenship-app select,.citizenship-app input { font:inherit; }
.citizenship-app button,.citizenship-app summary { min-height:44px; cursor:pointer; }
.citizenship-app .cv-mode { min-height:48px; }
.citizenship-app .cv-options label { display:flex; align-items:center; gap:10px; min-height:44px; }
.citizenship-app input[type=checkbox] { flex:none; width:20px; height:20px; accent-color:var(--accent); }
.citizenship-app .cv-options input,.citizenship-app .cv-options select { color:var(--text); background:var(--bg); }
.citizenship-app .actions { display:flex; flex-wrap:wrap; gap:8px; }
.citizenship-app .small { font-size:.9rem; }
.citizenship-app .result { border:1px solid var(--border); padding:16px; border-radius:12px; background:var(--bg-alt); }
.citizenship-app .result-ok { background:var(--good-bg); }
.citizenship-app .result-no,.citizenship-app .result-error { background:var(--bad-bg); }
.citizenship-app button:focus-visible,.citizenship-app summary:focus-visible,.citizenship-app input:focus-visible,.citizenship-app select:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.civics-about { margin-block:16px; padding:12px 16px; border:1px solid var(--border); border-radius:12px; }
.civics-about summary { display:list-item; font-weight:600; padding-block:8px; }
@media (prefers-reduced-motion:reduce) { .cv-bar span { transition:none; } }
@media print {
 .site-notice,.family,.site-header,.site-footer,.eyebrow,.lead,.civics-about,.family-tip,.cv-progress-wrap,.cv-modes,.cv-options,#cv-app>p,.cv-say { display:none!important; }
 .cv-item { break-inside:avoid; }
}

.cv-model-list { display:grid; gap:10px; }
.cv-model-list .btn { text-align:start; white-space:normal; }
.cv-model-map { display:flex; flex-wrap:wrap; gap:6px; margin-block:16px; }
.cv-model-map .btn { min-width:44px; padding:8px; }
.cv-model-map [aria-current=step],.cv-opt[aria-pressed=true] { outline:2px solid var(--accent); outline-offset:2px; }
.cv-model-review details { padding-block:10px; border-block-end:1px solid var(--border); }
.cv-model-review summary { padding-block:8px; font-weight:600; }