:root {
  --brand: #2f5bd3;
  --brand-dark: #1f3f9e;
  --brand-soft: #eaf0fd;
}
body { background: #f5f7fb; color: #1d2433; }
.bg-brand { background: var(--brand); }
.text-brand { color: var(--brand); }
.btn-primary { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-border-color: var(--brand-dark); }
.btn-brand { background: var(--brand); color: #fff; }
.btn-brand:hover { background: var(--brand-dark); color: #fff; }
.nav-pills { --bs-nav-pills-link-active-bg: var(--brand); }
.card { border: 1px solid #e3e8f2; border-radius: .75rem; }

.day-hero { background: linear-gradient(120deg, var(--brand), #5b7fe6); color: #fff; border: 0; }
.day-hero .badge { background: rgba(255,255,255,.2) !important; color: #fff !important; }
.stat .display-6 { color: var(--brand); }

.qnum { display: inline-flex; align-items: center; justify-content: center; min-width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--brand-soft); color: var(--brand); font-weight: 700; font-size: .85rem; }
.question .form-check { padding: .35rem .5rem .35rem 2rem; border-radius: .5rem; }
.question .form-check:hover { background: #f3f6fc; }
.opt-correct { background: #e6f6ec !important; }
.opt-wrong { background: #fdeaea !important; }
.explain { background: #fff8e1; border-left: 3px solid #f2b705; padding: .5rem .75rem; border-radius: .25rem; }
.passage { background: #fbfcff; border-color: #d7e0f5; }
.reading-text { line-height: 1.7; }
.gap { background: var(--brand-soft); color: var(--brand); font-weight: 700; padding: 0 .3rem; border-radius: .25rem; }

.score-ring { --p: 0; width: 92px; height: 92px; border-radius: 50%; display: grid; place-items: center;
  background: conic-gradient(var(--brand) calc(var(--p) * 1%), #e5eaf5 0); }
.score-ring span { width: 70px; height: 70px; border-radius: 50%; background: #fff; display: grid; place-items: center; font-weight: 700; font-size: 1.2rem; }

.level-bar { height: 10px; position: relative; overflow: visible; }
.level-bar .target { position: absolute; left: 60%; top: -3px; bottom: -3px; width: 2px; background: #1d2433; opacity: .5; }

.activity { display: grid; grid-template-columns: repeat(14, 1fr); gap: 4px; }
.act-cell { aspect-ratio: 1; border-radius: 4px; background: #e8ecf4; }
.act-cell.lvl1 { background: #b9cbf5; } .act-cell.lvl2 { background: #6f93ea; } .act-cell.lvl3 { background: var(--brand); }

.lesson-body table { width: 100%; margin: .5rem 0 1rem; font-size: .92rem; }
.lesson-body th, .lesson-body td { border: 1px solid #d9e0ee; padding: .4rem .55rem; vertical-align: top; }
.lesson-body th { background: var(--brand-soft); }
.lesson-body blockquote { background: #f3f6fc; border-left: 4px solid var(--brand); padding: .6rem .9rem; border-radius: .25rem; }
.lesson-body pre { background: #f6f7f9; border: 1px solid #e1e5ec; padding: .75rem; border-radius: .4rem; white-space: pre-wrap; }
.lesson-body h3 { font-size: 1.05rem; color: var(--brand); margin-top: 1rem; }
.lesson-body .answers { background: #eaf7ee; border: 1px solid #9fd3b0; padding: .5rem .75rem; border-radius: .4rem; }

.answer-box { background: #f8f9fb; border: 1px solid #e1e5ec; border-radius: .4rem; padding: .6rem .8rem; font-family: Georgia, serif; }
.model-box { background: #eef7f1; border: 1px solid #b9e0c6; border-radius: .4rem; padding: .6rem .8rem; white-space: pre-wrap; }
.ai-box { background: #f4f0ff; border: 1px solid #d6c9ff; border-radius: .5rem; padding: .75rem 1rem; }
.scene { background: #f3f6fc; border: 1px dashed #b7c6ea; padding: .75rem 1rem; border-radius: .5rem; }
.report li { font-size: .93rem; }

.timer { min-width: 150px; text-align: center; }
.timer.warn .timer-display { color: #d63939; }
.recorder { background: #fafbfe; border: 1px solid #e3e8f2; border-radius: .6rem; padding: .75rem; }
.recorder.recording { border-color: #dc3545; box-shadow: 0 0 0 3px rgba(220,53,69,.12); }
.wc-count.ok { color: #198754; } .wc-count.bad { color: #d63939; }
.plan-table td { vertical-align: middle; }

@media print {
  .no-print, .navbar, footer { display: none !important; }
  body { background: #fff; }
  .card { border: 0; }
  a { color: inherit; text-decoration: none; }
}

@media (min-width: 1200px) { .navbar .nav-link { padding-left: .55rem !important; padding-right: .55rem !important; font-size: .95rem; } }