
:root {
  --bg: #e6eef7 !important;
  --surface: #ffffff !important;
  --surface2: #f4f7fb !important;
  --panel: #ffffff !important;
  --panel-head: #f4f7fb !important;
  --border: #cbd8e7 !important;
  --border-2: #b7c8dc !important;
  --border2: #b7c8dc !important;
  --text: #040608 !important;
  --text-dim: #465264 !important;
  --text-dimmer: #6b7788 !important;
  --text-muted: #667386 !important;
  --muted: #667386 !important;
  --muted2: #465264 !important;
  --cyan: #4139c3 !important;
  --purple: #4139c3 !important;
  --green: #2f6b4f !important;
  --amber: #a35d17 !important;
  --red: #b34f44 !important;
  --lime: #c4f69a;
  --periwinkle: #aac4f7;
  --coral: #d66859;
  --font: 'DM Sans', sans-serif !important;
  --mono: 'DM Sans', sans-serif !important;
  --font-body: 'DM Sans', sans-serif !important;
  --font-display: 'Manrope', sans-serif !important;
  --font-mono: 'DM Sans', sans-serif !important;
}

:where(a, button, input, textarea, select):focus-visible {
  outline: 3px solid #4139c3 !important;
  outline-offset: 3px !important;
}

html, body {
  background-color: var(--bg) !important;
  background-image: linear-gradient(rgba(4,6,8,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(4,6,8,.045) 1px, transparent 1px) !important;
  background-size: 34px 34px !important;
  color: var(--text) !important;
  font-family: 'DM Sans', sans-serif !important;
}

body > nav[aria-label="Primary navigation"]:not(.course-access-bar),
header.tool-nav,
header.site {
  height: 72px !important;
  padding: 0 max(24px, calc((100vw - 1180px) / 2)) !important;
  background: #040608 !important;
  border: 0 !important;
  border-radius: 0 0 24px 24px !important;
  box-shadow: 0 12px 32px rgba(4,6,8,.14) !important;
}

.nav-logo, .brand, .brand .tag { color: #fff !important; font-family: 'Manrope', sans-serif !important; }
.nav-logo { gap: 0 !important; }
.nav-logo span { color: var(--lime) !important; }
.nav-back, nav.sitenav a { color: #cbd4df !important; }
.nav-back:hover, nav.sitenav a:hover, nav.sitenav a.current { color: var(--lime) !important; }
header.site > [data-account-label] {
  color: #cbd4df !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
header.site > [data-account-label]:hover { color: var(--lime) !important; }

.screen { min-height: calc(100vh - 72px) !important; padding: 56px 20px 90px !important; }
.setup-wrap, .quiz-wrap, .results-wrap { max-width: 880px !important; }
.setup-title, .fc-setup-header h1, .hero h1, h1, .results-grade, .fc-results h2 {
  color: #040608 !important;
  font-family: 'Manrope', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -.045em !important;
}
.setup-title, .fc-setup-header h1, .hero h1 { font-size: clamp(2.25rem, 5vw, 4rem) !important; }
.setup-sub, .fc-setup-header p, .sub { color: #465264 !important; font-size: 1rem !important; }
.section-label, .fc-config-title, .eyebrow, .chapgroup-title, .sb-title, .total-score-label {
  color: #4139c3 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
}

.chapter-group-wrap, .fc-config-card, .panel, .q-card, .total-score-box, .scoring-breakdown,
.res-stat, .review-item, .fc-results-inner, .fc-missed-item {
  background: #fff !important;
  border: 1.5px solid #c4d0df !important;
  box-shadow: 0 16px 38px rgba(28,48,73,.08) !important;
}
.chapter-group-wrap { padding: 20px; border-radius: 20px; }
.chapter-heading { color: #040608 !important; border-color: #d6e0eb !important; font-weight: 800 !important; }

.ch-btn, .qc-btn, .diff-card, .fc-chapter-btn, .fc-mode-opt, .durbtn, .chip, .option,
.res-btn, .review-toggle, .restartbtn {
  background: #f7f9fc !important;
  border: 1.5px solid #c4d0df !important;
  color: #263242 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.ch-btn:hover, .fc-chapter-btn:hover, .chip:hover, .option:hover:not(.disabled) {
  border-color: #4139c3 !important;
  color: #040608 !important;
}
.ch-btn.sel, .qc-btn.sel, .diff-card.sel, .fc-chapter-btn.selected, .fc-mode-opt.selected,
.durbtn.active, .chip.active {
  background: #4139c3 !important;
  border-color: #4139c3 !important;
  color: #fff !important;
}
.fc-chapter-btn.selected .fc-ch-num, .fc-chapter-btn.selected span, .chip.active .chapnum,
.chip.active .count { color: #fff !important; }
.fc-chapter-check { border-color: #8797aa !important; }
.fc-chapter-btn.selected .fc-chapter-check { background: var(--lime) !important; border-color: var(--lime) !important; color: #040608 !important; }

.start-btn, .next-btn, .res-btn.primary, .fc-start-btn, .startbtn {
  background: #040608 !important;
  border: 0 !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-family: 'Manrope', sans-serif !important;
  font-weight: 800 !important;
  box-shadow: 0 12px 24px rgba(4,6,8,.18) !important;
}
.start-btn:hover, .next-btn:hover, .fc-start-btn:hover, .startbtn:hover { background: #4139c3 !important; }
.start-btn:disabled, .fc-start-btn:disabled, .startbtn:disabled { background: #aab5c4 !important; color: #edf2f7 !important; box-shadow: none !important; }
.sel-link, .fc-text-btn, .selectrow a { color: #4139c3 !important; font-weight: 700 !important; }

.q-progress-bar, .fc-progress-track { background: #c9d5e3 !important; height: 8px !important; }
.q-progress-fill, .fc-progress-fill { background: #4139c3 !important; height: 8px !important; }
.q-card { border-left: 6px solid var(--periwinkle) !important; border-radius: 22px !important; padding: 28px !important; }
.q-text, .stem, .part-text, .ri-q { color: #040608 !important; }
.q-context, .ri-context { color: #536174 !important; border-color: #aac4f7 !important; }
.q-label, .q-section-tag, .q-badge, .part-label { color: #4139c3 !important; }
.diff-badge, .pill, .q-badge, .marks-badge { border-radius: 999px !important; }
.option { padding: 16px 18px !important; font-size: .96rem !important; }
.opt-letter { background: #e6eef7 !important; color: #040608 !important; border-radius: 999px !important; }
.option.correct, .feedback.correct, .ri-answer.correct { background: #e3f6d6 !important; border-color: #87b76b !important; color: #24533d !important; }
.option.wrong, .feedback.wrong, .ri-answer.wrong { background: #fae4df !important; border-color: #d66859 !important; color: #8c3e36 !important; }
.option.reveal { background: #e3f6d6 !important; color: #24533d !important; }
.feedback.timeout, .ri-answer.timeout { background: #fff1cf !important; color: #825013 !important; border-color: #e3bc69 !important; }
.pill-green { background: #e3f6d6 !important; border-color: #87b76b !important; color: #24533d !important; }
.pill-red { background: #fae4df !important; border-color: #d66859 !important; color: #8c3e36 !important; }
.total-score-val, .score-pts { color: #4139c3 !important; }

.fc-page { background: transparent !important; padding-top: 72px !important; }
.fc-setup { max-width: 930px !important; }
.fc-setup-header { text-align: left !important; }
.fc-config-card { border-radius: 22px !important; }
input[type=range].fc-slider { background: #c7d3e1 !important; }
input[type=range].fc-slider::-webkit-slider-thumb { background: #4139c3 !important; box-shadow: none !important; }
.fc-card-front { background: #fff !important; color: #040608 !important; border: 2px solid #b9c8da !important; }
.fc-card-back { background: #040608 !important; color: #fff !important; border: 2px solid #040608 !important; }
.fc-card-front *, .fc-card-front h2 { color: #040608 !important; }
.fc-card-back *, .fc-card-back li { color: #fff !important; }
.fc-card-back .fc-card-label { color: var(--lime) !important; }
.fc-action-btn { border-radius: 999px !important; }
.fc-btn-wrong { background: #fae4df !important; border-color: #d66859 !important; color: #8c3e36 !important; }
.fc-btn-correct { background: var(--lime) !important; border-color: #96c96c !important; color: #173a29 !important; }
.fc-btn-skip { background: #fff1cf !important; border-color: #e3bc69 !important; color: #825013 !important; }

main { max-width: 980px !important; padding-top: 58px !important; }
.hero { background: var(--periwinkle) !important; border: 1.5px solid #89a8dc !important; border-radius: 28px !important; padding: clamp(28px,5vw,54px) !important; }
.stat { color: #263242 !important; }
.stat .stat-num { color: #040608 !important; }
.panel { border-radius: 20px !important; overflow: hidden !important; }
.panel-head { background: #eef3f8 !important; border-color: #d3deea !important; color: #465264 !important; }
.panel-head b { color: #040608 !important; }
.chip { background: #f7f9fc !important; }
.topbar, .submitbar { background: #040608 !important; border: 0 !important; color: #fff !important; }
.topbar { top: 118px !important; border-radius: 18px !important; }
.topbar .meta, .topbar .meta b { color: #fff !important; }
.timer { color: var(--lime) !important; }
.answer-box { background: #f7f9fc !important; color: #040608 !important; border-color: #b7c8dc !important; min-height: 92px !important; }
.answer-box:focus { border-color: #4139c3 !important; box-shadow: 0 0 0 3px rgba(65,57,195,.12) !important; }
.student-ans { background: #fff1cf !important; border-color: #e5c36e !important; color: #4c391d !important; }
.student-ans b { color: #825013 !important; }
.ms-box { background: #040608 !important; border-color: #040608 !important; }
.ms-title, .tickline.miss { color: #aeb8c5 !important; }
.tickline.hit, .ms-title .awarded { color: var(--lime) !important; }
.score-num { color: #4139c3 !important; font-family: 'Manrope', sans-serif !important; }
.score-label, .score-of { color: #536174 !important; }

@media (max-width: 720px) {
  nav.sitenav { gap: 12px !important; overflow-x: auto; }
  nav.sitenav a:nth-child(2), nav.sitenav a:nth-child(3) { display: none; }
  .brand { font-size: 14px !important; }
  .screen { padding-top: 34px !important; }
  .diff-grid { grid-template-columns: 1fr 1fr !important; }
  .hero { border-radius: 20px !important; }
  .q-card { padding: 20px !important; }
  .fc-chapter-grid { grid-template-columns: 1fr !important; }
}
