:root { --card-radius: 16px; }
.card { border-radius: var(--card-radius); }
.btn-lg { border-radius: 14px; }
.choice-btn { text-align: left; white-space: normal; border-radius: 14px; }
.choice-btn.correct { border-color: rgba(25, 135, 84, .45) !important; }
.choice-btn.wrong { border-color: rgba(220, 53, 69, .45) !important; }
.muted { color: var(--bs-secondary-color); }

html[data-theme="dark"] { color-scheme: dark; }
html[data-theme="dark"] body { background: #0b1220; }
html[data-theme="dark"] .bg-white { background: #0f1a2c !important; }
html[data-theme="dark"] .card { background: #0f1a2c; border-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .border-bottom { border-color: rgba(255,255,255,.08) !important; }
code { word-break: break-word; }