/* Focused learning surfaces. Loaded after the original lesson and quiz styles. */
:is(.lesson-page, .onboarding-page) {
  --learning-ink: #121117;
  --learning-muted: #625f68;
  --learning-line: #dedde1;
  --learning-soft: #f7f6f8;
  --learning-pink: #ed80ae;
  --learning-pink-soft: #fceaf2;
  --learning-success: #216c49;
  --learning-success-soft: #eff8f2;
  --learning-error: #a12d36;
  --learning-error-soft: #fff0f1;
  color: var(--learning-ink);
  background: #fff;
}

:is(.lesson-page, .onboarding-page) :is(h1, h2, h3) { color: var(--learning-ink); }
:is(.lesson-page, .onboarding-page) :is(button, input, textarea, select) { font-family: inherit; }
:is(.lesson-page, .onboarding-page) :is(button, a, input, textarea, select, summary):focus-visible {
  outline: 3px solid var(--learning-ink);
  outline-offset: 4px;
}
:is(.lesson-page, .onboarding-page) .text-link { color: var(--learning-muted); font-weight: 650; }
:is(.lesson-page, .onboarding-page) .text-link:hover { color: var(--learning-ink); }
:is(.lesson-page, .onboarding-page) .eyebrow { color: var(--learning-muted); font-size: 11px; font-weight: 700; letter-spacing: .1em; }
:is(.lesson-page, .onboarding-page) .button {
  min-height: 52px;
  max-width: 100%;
  padding: 13px 22px;
  border-radius: 8px;
  box-shadow: none;
  font-size: 15px;
  font-weight: 750;
  letter-spacing: 0;
  line-height: 1.5;
  white-space: normal;
  transform: none;
  transition: background .16s ease, border-color .16s ease;
}
:is(.lesson-page, .onboarding-page) .button.button-primary {
  border: 2px solid var(--learning-ink);
  color: var(--learning-ink);
  background: var(--learning-pink);
  box-shadow: none;
}
:is(.lesson-page, .onboarding-page) .button.button-primary:hover:not(:disabled) { color: var(--learning-ink); background: #f298bc; border-color: var(--learning-ink); box-shadow: none; transform: none; }
:is(.lesson-page, .onboarding-page) .button.button-primary:active:not(:disabled) { color: var(--learning-ink); background: #e46c9e; box-shadow: none; transform: none; }
:is(.lesson-page, .onboarding-page) .button:is(.button-ghost, .button-cream) { border: 1px solid var(--learning-line); color: var(--learning-ink); background: #fff; box-shadow: none; }
:is(.lesson-page, .onboarding-page) .button:is(.button-ghost, .button-cream):hover:not(:disabled) { background: var(--learning-soft); border-color: var(--learning-ink); box-shadow: none; transform: none; }
:is(.lesson-page, .onboarding-page) .button:is(.button-ghost, .button-cream):active:not(:disabled) { background: #eceaee; box-shadow: none; transform: none; }
:is(.lesson-page, .onboarding-page) .button:disabled { color: #77727d; background: #eceaee; border-color: var(--learning-line); box-shadow: none; transform: none; cursor: not-allowed; opacity: 1; }
:is(.lesson-page, .onboarding-page) .icon-button { border: 1px solid var(--learning-line); border-radius: 8px; background: #fff; color: var(--learning-ink); box-shadow: none; transform: none; }
:is(.lesson-page, .onboarding-page) .icon-button:hover { background: var(--learning-soft); }
:is(.lesson-page, .onboarding-page) .icon-button:active { background: #eceaee; box-shadow: none; transform: none; }

/* A quiet progress line leaves the question and primary action in focus. */
.lesson-page .lesson-progress, .onboarding-page .onboarding-progress,
.setup-quiz .quiz-progress-row .onboarding-progress {
  height: 6px;
  border: 0;
  border-radius: 4px;
  background: #eeecef;
  box-shadow: none;
}
.lesson-page .lesson-progress > span, .onboarding-page .onboarding-progress > span,
.setup-quiz .quiz-progress-row .onboarding-progress > span { background: var(--learning-ink); }
.lesson-page .lesson-progress > span::after, .onboarding-page .onboarding-progress > span::after { content: none; }
.lesson-page .lesson-step-label { padding: 0; background: none; color: var(--learning-muted); font-size: 12px; font-weight: 600; }
.lesson-page .lesson-progress-row > span { color: var(--learning-muted); font-size: 12px; font-weight: 600; }
.lesson-page .lesson-main { min-width: 0; }
.lesson-page .lesson-main h1 { font-size: clamp(28px, 3.4vw, 42px); font-weight: 800; line-height: 1.2; letter-spacing: -.035em; overflow-wrap: anywhere; }
.lesson-page .lesson-main .question-instruction { color: var(--learning-muted); font-size: 14px; line-height: 1.75; }
.lesson-page .lesson-footer { border-top: 1px solid var(--learning-line); color: var(--learning-muted); }

/* Lesson outline becomes a compact contents column, rather than a game path. */
.lesson-page .course-main { max-width: 1080px; grid-template-columns: 230px minmax(0, 1fr); gap: 48px; padding: 44px 32px 64px; }
.course-page .course-outline { padding: 18px; border: 1px solid var(--learning-line); border-radius: 12px; background: #fff; box-shadow: none; }
.course-page .course-outline > summary { font-size: 13px; font-weight: 750; }
.course-page .course-outline-position { color: var(--learning-muted); font-size: 11px; font-weight: 600; }
.course-page .course-outline li { border-color: var(--learning-line); gap: 10px; padding: 14px 0; color: var(--learning-muted); }
.course-page .course-block-number { width: 27px; height: 27px; flex-basis: 27px; border: 1px solid var(--learning-line); border-radius: 6px; background: #fff; color: var(--learning-muted); font-size: 11px; font-weight: 700; box-shadow: none; }
.course-page .course-outline li.is-current { color: var(--learning-ink); }
.course-page .course-outline li.is-current .course-block-number { color: var(--learning-ink); background: var(--learning-pink); border-color: var(--learning-ink); box-shadow: none; }
.course-page .course-outline li.is-done .course-block-number { color: var(--learning-success); background: var(--learning-success-soft); border-color: #afcfbb; box-shadow: none; }
.course-page .course-outline li strong { font-size: 12px; line-height: 1.55; font-weight: 650; }
.course-page .course-outline li small { font-size: 11px; line-height: 1.6; font-weight: 450; }
.course-page .course-outline-note { padding-top: 14px; color: var(--learning-muted); font-size: 11px; line-height: 1.75; }
.course-page .course-context { margin-bottom: 24px; color: var(--learning-muted); font-size: 12px; font-weight: 600; }
.course-page .course-context > span { color: var(--learning-muted); font-size: 11px; font-weight: 450; }
.course-page .course-stage-symbol { width: 34px; height: 34px; flex-basis: 34px; border: 1px solid var(--learning-line); border-radius: 8px; color: var(--learning-ink); background: var(--learning-soft); box-shadow: none; }
.course-page :is(.course-lead, .course-pace-note) { color: var(--learning-muted); font-size: 14px; line-height: 1.8; }
.course-page .course-theory-sections { padding: 26px 0; border: 0; border-top: 1px solid var(--learning-line); border-radius: 0; background: #fff; }
.course-page .course-theory-section + .course-theory-section { padding-top: 26px; margin-top: 26px; border-top: 1px solid var(--learning-line); }
.course-page .course-theory-section h2 { font-size: 21px; font-weight: 750; line-height: 1.4; letter-spacing: -.025em; }
.course-page .course-theory-section p { color: #39363f; font-size: 16px; line-height: 1.85; }
.lesson-page .formula { min-width: 0; max-width: 100%; padding: 18px 20px; border: 1px solid var(--learning-line); border-radius: 10px; background: var(--learning-soft); color: var(--learning-ink); font-size: 21px; line-height: 1.7; overflow-wrap: anywhere; }
.course-page .course-example { margin: 24px 0; padding: 24px; border: 1px solid var(--learning-line); border-radius: 16px; background: var(--learning-soft); }
.course-page .course-example h2 { font-size: 15px; font-weight: 750; }
.course-page .course-example p { color: #39363f; font-size: 15px; line-height: 1.85; }
.course-page :is(.course-notes, .course-notebook, .course-repair-question) { padding: 23px; border: 1px solid var(--learning-line); border-radius: 16px; background: #fff; box-shadow: none; }
.course-page .course-mistakes { border-color: #e5c392; background: #fffaef; }
.course-page .course-notes h2 { font-size: 15px; font-weight: 750; }
.course-page .course-notes li { color: #39363f; font-size: 14px; line-height: 1.8; }
.course-page .course-notebook h2 { font-size: 19px; font-weight: 750; }
.course-page :is(.course-notebook p, .course-notation p) { color: var(--learning-muted); line-height: 1.8; }
.course-page .course-notebook-sample { border-left: 3px solid var(--learning-pink); border-radius: 0 8px 8px 0; background: var(--learning-soft); }
.course-page .course-proof-explanation { border-left: 3px solid var(--learning-ink); border-radius: 0 8px 8px 0; background: var(--learning-soft); }
.course-page :is(.course-proof, .course-notation, .course-notation dl > div) { border-color: var(--learning-line); }
.course-page :is(.course-proof summary, .course-notation summary, .course-repair-theory > summary, .course-notebook summary) { color: var(--learning-ink); font-size: 14px; font-weight: 650; }
.course-page .course-notation code { border: 1px solid var(--learning-line); border-radius: 4px; background: #fff; }
.course-page .course-question h1 { font-size: clamp(26px, 3vw, 36px); line-height: 1.35; }
.course-page .course-practice-counter { padding: 5px 9px; border: 1px solid var(--learning-line); border-radius: 6px; color: var(--learning-muted); background: #fff; font-size: 11px; font-weight: 600; }
.course-page .course-question-heading { gap: 10px; }
.course-page .course-question-heading .eyebrow { line-height: 1.65; }
.course-page :is(.course-answer-field, .course-writing) { min-width: 0; max-width: 100%; }
.course-page :is(.course-answer-field input, .course-writing textarea) { width: 100%; max-width: 100%; min-width: 0; border: 2px solid var(--learning-line); border-radius: 8px; color: var(--learning-ink); background: #fff; box-shadow: none; font-size: 19px; }
.course-page .course-writing textarea { font-size: 16px; line-height: 1.75; }
.course-page :is(.course-answer-field input, .course-writing textarea):focus { border-color: var(--learning-ink); box-shadow: none; }
.course-page :is(.course-answer-field input, .course-writing textarea)[readonly] { background: var(--learning-soft); }
.course-page :is(.course-answer-field > p, .course-writing > p) { color: var(--learning-muted); }
.course-page .course-input-error:not(:empty) { color: var(--learning-error); }
.course-page .course-math-keys { gap: 8px; max-width: 100%; }
.course-page .course-math-keys button { min-width: 44px; min-height: 44px; border: 1px solid var(--learning-line); border-radius: 6px; background: var(--learning-soft); color: var(--learning-ink); box-shadow: none; }
.course-page .course-math-keys button:hover { border-color: var(--learning-ink); background: var(--learning-pink-soft); }
.course-page .course-continue { margin-top: 28px; }
.course-page :is(.course-pause, .course-help) { font-size: 13px; font-weight: 600; }

/* Selection, success and correction remain visually distinct, with no depth effects. */
:is(.lesson-page, .onboarding-page) .answer-options { grid-template-columns: minmax(0, 1fr); gap: 12px; }
:is(.lesson-page, .onboarding-page) .answer-options .answer-option {
  min-width: 0;
  min-height: 66px;
  max-width: 100%;
  padding: 16px 18px;
  gap: 14px;
  border: 1px solid var(--learning-line);
  border-radius: 10px;
  background: #fff;
  color: var(--learning-ink);
  box-shadow: none;
  font-size: 16px;
  font-weight: 550;
  line-height: 1.6;
  transform: none;
  transition: background .16s ease, border-color .16s ease;
}
:is(.lesson-page, .onboarding-page) .answer-options .answer-option:hover:not(:disabled) { border-color: var(--learning-ink); background: var(--learning-soft); box-shadow: none; transform: none; }
:is(.lesson-page, .onboarding-page) .answer-options .answer-option:active:not(:disabled) { background: #eeecef; box-shadow: none; transform: none; }
:is(.lesson-page, .onboarding-page) .answer-options .answer-option.is-selected,
:is(.lesson-page, .onboarding-page) .answer-options .answer-option.is-selected:is(:hover, :active):not(:disabled) { border-color: var(--learning-ink); background: var(--learning-pink-soft); color: var(--learning-ink); box-shadow: inset 0 0 0 1px var(--learning-ink); transform: none; }
:is(.lesson-page, .onboarding-page) .answer-options .answer-letter { width: 30px; height: 30px; flex: 0 0 30px; border: 1px solid var(--learning-line); border-radius: 6px; background: #fff; color: var(--learning-muted); font-size: 12px; font-weight: 700; }
:is(.lesson-page, .onboarding-page) .answer-options .is-selected .answer-letter { color: #fff; background: var(--learning-ink); border-color: var(--learning-ink); }
:is(.lesson-page, .onboarding-page) .answer-options .answer-option.is-correct { background: var(--learning-success-soft); color: var(--learning-success); border-color: var(--learning-success); box-shadow: none; }
:is(.lesson-page, .onboarding-page) .answer-options .answer-option.is-correct .answer-letter { background: var(--learning-success); color: #fff; border-color: var(--learning-success); }
:is(.lesson-page, .onboarding-page) .answer-options .answer-option.is-wrong { background: var(--learning-error-soft); color: var(--learning-error); border-color: var(--learning-error); box-shadow: none; }
:is(.lesson-page, .onboarding-page) .answer-options .answer-option.is-wrong .answer-letter { background: var(--learning-error); color: #fff; border-color: var(--learning-error); }
:is(.lesson-page, .onboarding-page) .answer-options .answer-option:disabled { cursor: default; opacity: 1; }
.lesson-page :is(.course-feedback, .recap-feedback, .answer-feedback.feedback-correct) { padding: 20px; border: 1px solid #b9d6c5; border-radius: 12px; color: var(--learning-success); background: var(--learning-success-soft); box-shadow: none; animation: none; }
.lesson-page :is(.course-repair .course-feedback, .recap-repair-note, .answer-feedback.feedback-learn) { padding: 20px; border: 1px solid #e5c392; border-radius: 12px; color: var(--learning-ink); background: #fffaef; box-shadow: none; }
.lesson-page .recap-question:has(.answer-option.is-wrong) .recap-feedback { border-color: #e5c392; color: var(--learning-ink); background: #fffaef; }
.lesson-page .recap-question:has(.answer-option.is-wrong) .recap-feedback > span { color: #865314; }
.lesson-page :is(.course-feedback h2, .recap-feedback strong, .answer-feedback strong) { color: inherit; font-size: 16px; font-weight: 750; }
.lesson-page :is(.course-feedback p, .recap-feedback p, .recap-repair-note p, .answer-feedback p) { color: #39363f; font-size: 14px; line-height: 1.85; }
.course-page .course-feedback > .icon { color: var(--learning-success); background: transparent; border-radius: 0; padding: 0; width: 22px; height: 22px; flex-basis: 22px; }
.course-page .course-repair .course-feedback > .icon { color: #865314; }
.course-page .course-self-check { color: var(--learning-ink); background: var(--learning-soft); border-color: var(--learning-line); }
.course-page .course-self-check > .icon { color: var(--learning-ink); }
.lesson-page :is(.course-result-details > div, .result-metrics > div) { border: 1px solid var(--learning-line); border-radius: 12px; background: #fff; box-shadow: none; }
.lesson-page :is(.course-result-icon, .recap-ready-check, .result-check), .course-page .course-reinforcement .course-result-icon { border: 1px solid #b9d6c5; border-radius: 12px; color: var(--learning-success); background: var(--learning-success-soft); box-shadow: none; }
.course-page .course-achievement-art { color: var(--learning-ink); }
.course-page .course-art-medal > rect { fill: var(--learning-pink); stroke: var(--learning-ink); }
.course-page .course-art-medal > circle { fill: var(--learning-ink); }
.course-page .course-art-medal > path:first-child { fill: var(--learning-pink-soft); stroke: var(--learning-ink); }
.course-page .course-subject-reminder { border-color: var(--learning-line); }

/* Recall and long-form theory reuse the same text-first treatment. */
.recap-page .recap-main { max-width: 748px; padding-top: 44px; padding-bottom: 60px; }
.recap-page .recap-question h1 { font-size: clamp(26px, 3vw, 36px); line-height: 1.35; }
.recap-page :is(.recap-lead, .recap-reassurance, .recap-source-title) { color: var(--learning-muted); }
.recap-page :is(.recap-topic, .recap-theory) { padding: 24px; border: 1px solid var(--learning-line); border-radius: 16px; background: var(--learning-soft); }
.recap-page .recap-topic h2 { font-size: 21px; font-weight: 750; }
.recap-page .recap-steps li { border-color: var(--learning-line); }
.recap-page .recap-steps li > span { border-color: var(--learning-line); border-radius: 6px; color: var(--learning-ink); background: #fff; }
.recap-page .recap-theory > p { color: #39363f; font-size: 16px; line-height: 1.85; }
.recap-page .recap-theory .formula { border-color: var(--learning-line); background: transparent; }
.lesson-page :is(.theory-card, .example-card, .inline-theory, .hint-text) { border: 1px solid var(--learning-line); border-radius: 16px; background: var(--learning-soft); box-shadow: none; }
.lesson-page .theory-visual { border-radius: 10px; background: var(--learning-pink-soft); color: var(--learning-ink); }
.lesson-page .result-next { border: 1px solid var(--learning-line); border-radius: 12px; background: var(--learning-soft); }

/* Diagrams may zoom inside their own canvas without widening the page. */
:is(.lesson-page, .onboarding-page) :is(.question-diagram, .geometry-diagram) { min-width: 0; max-width: 100%; margin: 24px 0; padding: 18px; border: 1px solid var(--learning-line); border-radius: 12px; background: #fff; color: var(--learning-ink); box-shadow: none; }
:is(.lesson-page, .onboarding-page) .question-diagram-canvas { min-width: 0; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
:is(.lesson-page, .onboarding-page) .question-diagram svg text { stroke: #fff; }
:is(.lesson-page, .onboarding-page) .geometry-diagram svg { display: block; max-width: 100%; height: auto; }
:is(.lesson-page, .onboarding-page) .question-diagram-zoom > summary { min-height: 44px; }
:is(.lesson-page, .onboarding-page) :is(.question-diagram figcaption, .geometry-diagram figcaption) { color: var(--learning-muted); }

/* One setup question at a time, with a generous editorial heading. */
.onboarding-page .onboarding-header { border-color: var(--learning-line); }
.onboarding-page .onboarding-step-label { color: var(--learning-muted); }
.setup-quiz .quiz-main { max-width: 728px; padding-top: 30px; }
.setup-quiz .quiz-stage { margin-top: 42px; }
.setup-quiz .quiz-stage h1 { max-width: 640px; color: var(--learning-ink); font-size: clamp(32px, 4.8vw, 46px); line-height: 1.13; letter-spacing: -.04em; font-weight: 800; }
.setup-quiz .quiz-lead { color: var(--learning-muted); font-size: 15px; line-height: 1.8; }
.setup-quiz .quiz-progress-row .icon-button { border: 1px solid var(--learning-line); border-radius: 8px; background: #fff; color: var(--learning-ink); }
.setup-quiz .quiz-counter { color: var(--learning-muted); font-weight: 600; }
.setup-quiz .quiz-input, .onboarding-page .form-field :is(input, select) { min-height: 60px; padding: 16px 18px; border: 2px solid var(--learning-line); border-radius: 8px; color: var(--learning-ink); background: #fff; box-shadow: none; font-weight: 500; }
.setup-quiz .quiz-input:focus, .onboarding-page .form-field :is(input, select):focus { border-color: var(--learning-ink); box-shadow: none; }
.setup-quiz .quiz-input[aria-invalid="true"], .onboarding-page .form-field :is(input, select)[aria-invalid="true"] { color: var(--learning-error); border-color: var(--learning-error); background: var(--learning-error-soft); box-shadow: none; }
.setup-quiz .quiz-input::placeholder { color: var(--learning-muted); }
.setup-quiz .quiz-answers { gap: 12px; margin-top: 30px; }
.setup-quiz .quiz-answers .quiz-answer { min-height: 82px; padding: 18px 20px; border: 1px solid var(--learning-line); border-radius: 10px; color: var(--learning-ink); background: #fff; box-shadow: none; transform: none; transition: border-color .16s ease, background .16s ease; }
.setup-quiz .quiz-answers .quiz-answer:hover:not(:disabled) { border-color: var(--learning-ink); background: var(--learning-soft); box-shadow: none; transform: none; }
.setup-quiz .quiz-answers .quiz-answer:active:not(:disabled) { background: #eeecef; box-shadow: none; transform: none; }
.setup-quiz .quiz-answers .quiz-answer:is(.is-selected, [aria-pressed="true"]),
.setup-quiz .quiz-answers .quiz-answer:is(.is-selected, [aria-pressed="true"]):is(:hover, :active):not(:disabled) { border-color: var(--learning-ink); background: var(--learning-pink-soft); box-shadow: inset 0 0 0 1px var(--learning-ink); transform: none; }
.setup-quiz .quiz-answer-key { width: 32px; height: 32px; flex-basis: 32px; border: 1px solid var(--learning-line); border-radius: 6px; color: var(--learning-muted); background: #fff; }
.setup-quiz .quiz-answer:is(.is-selected, [aria-pressed="true"]) .quiz-answer-key { color: #fff; border-color: var(--learning-ink); background: var(--learning-ink); }
.setup-quiz .quiz-answer-copy strong { font-size: 15px; font-weight: 700; }
.setup-quiz .quiz-answer-copy small { color: var(--learning-muted); font-size: 12px; line-height: 1.7; }
.setup-quiz .quiz-answer-status { color: #fff; background: var(--learning-ink); }
.setup-quiz .quiz-grades .quiz-answer { min-height: 116px; }
.setup-quiz .quiz-grades .quiz-answer-copy strong { font-size: 30px; }
.setup-quiz .quiz-grades .quiz-answer-copy small { font-size: 12px; }
.setup-quiz .quiz-ready-summary > span { border: 1px solid var(--learning-line); border-radius: 6px; color: var(--learning-muted); background: var(--learning-soft); font-weight: 550; }
.setup-quiz :is(.quiz-hint, .quiz-privacy) { color: var(--learning-muted); font-size: 12px; line-height: 1.75; }
.setup-quiz .quiz-actions > .button-primary { min-height: 52px; }
.onboarding-page .form-error { border: 1px solid var(--learning-error); border-radius: 8px; color: var(--learning-error); background: var(--learning-error-soft); }
.onboarding-page .choice-card { border-color: var(--learning-line); border-radius: 10px; background: #fff; box-shadow: none; }
.onboarding-page .choice-card:has(> input:checked) { border-color: var(--learning-ink); background: var(--learning-pink-soft); box-shadow: inset 0 0 0 1px var(--learning-ink); }

/* Diagnostic results remain honest and legible, with the question as the focal point. */
.onboarding-page .assessment-main { max-width: 820px; padding-top: 36px; }
.onboarding-page .onboarding-card { min-width: 0; padding: 32px; border: 1px solid var(--learning-line); border-radius: 16px; background: #fff; box-shadow: none; }
.onboarding-page .onboarding-card h1 { font-size: clamp(28px, 3.5vw, 40px); font-weight: 800; letter-spacing: -.035em; line-height: 1.22; }
.onboarding-page .onboarding-lead { color: var(--learning-muted); font-size: 14px; line-height: 1.8; }
.onboarding-page .adaptive-question h1 { font-size: clamp(26px, 3vw, 36px); line-height: 1.35; }
.onboarding-page .adaptive-question-tags > span { padding: 6px 10px; border: 1px solid var(--learning-line); border-radius: 6px; color: var(--learning-ink); background: var(--learning-soft); font-size: 11px; font-weight: 650; }
.onboarding-page .adaptive-question-tags > span + span { color: var(--learning-muted); background: #fff; font-weight: 500; }
.onboarding-page :is(.adaptive-foundation-note, .assessment-note, .adaptive-scope-note) { border: 1px solid var(--learning-line); border-radius: 10px; color: var(--learning-muted); background: var(--learning-soft); }
.onboarding-page .adaptive-foundation-note { border-left: 3px solid var(--learning-pink); }
.onboarding-page .adaptive-foundation-note .icon { flex: 0 0 17px; }
.onboarding-page .adaptive-skip-options button { padding: 14px; border: 1px solid var(--learning-line); border-radius: 8px; background: #fff; }
.onboarding-page .adaptive-skip-options button:hover { border-color: var(--learning-ink); background: var(--learning-soft); }
.onboarding-page .adaptive-skip-options strong { color: var(--learning-ink); font-size: 13px; font-weight: 650; }
.onboarding-page .adaptive-skip-options span { color: var(--learning-muted); }
.onboarding-page :is(.adaptive-start-points > div, .adaptive-result-metrics > div, .subject-scores > div) { border: 1px solid var(--learning-line); border-radius: 10px; background: #fff; }
.onboarding-page .adaptive-result-metrics strong { color: var(--learning-ink); }
.onboarding-page .adaptive-result-metrics strong > span { color: var(--learning-muted); }
.onboarding-page .adaptive-start-points .icon { color: var(--learning-ink); }
.onboarding-page .adaptive-start-points strong { font-size: 13px; font-weight: 700; }
.onboarding-page :is(.adaptive-result-metrics div > span, .adaptive-start-points span, .adaptive-progress-meta, .adaptive-next > span, .onboarding-privacy) { color: var(--learning-muted); font-size: 12px; }
.onboarding-page .adaptive-subject-routes { margin: 28px 0; }
.onboarding-page .adaptive-subject-routes > h2 { font-size: 23px; letter-spacing: -.025em; }
.onboarding-page .adaptive-subject-routes .personal-plan { border: 1px solid var(--learning-line); border-radius: 12px; background: #fff; box-shadow: none; }
.onboarding-page .adaptive-subject-routes .personal-plan-number { border-color: var(--learning-line); border-radius: 6px; color: var(--learning-muted); background: #fff; }
.onboarding-page .adaptive-subject-routes .personal-plan-step.is-next .personal-plan-number { border-color: var(--learning-ink); color: var(--learning-ink); background: var(--learning-pink); }
.onboarding-page .adaptive-subject-routes .personal-plan-step.is-next .personal-plan-start { border: 1px solid var(--learning-ink); border-radius: 6px; color: var(--learning-ink); background: var(--learning-pink); }
.onboarding-page .adaptive-subject-routes .adaptive-details > .button { margin-top: 18px; margin-bottom: 18px; }
.onboarding-page .assessment-score { border-radius: 12px; color: var(--learning-ink); background: var(--learning-pink-soft); }
.onboarding-page .diagnostic-recommendations > a { border-color: var(--learning-line); border-radius: 10px; background: #fff; }
.onboarding-page .diagnostic-recommendations > a:hover { border-color: var(--learning-ink); background: var(--learning-soft); }
.onboarding-page :is(.adaptive-details, .adaptive-skill, .adaptive-skip-options, .assessment-preview, .assessment-preview li, .diagnostic-explanations, .diagnostic-explanations article) { border-color: var(--learning-line); }

@media (max-width: 760px) {
  .lesson-page .course-main { grid-template-columns: minmax(0, 1fr); gap: 28px; max-width: 700px; padding: 28px 24px 48px; }
  .course-page .course-outline { position: static; padding: 14px 0; border: 0; border-bottom: 1px solid var(--learning-line); border-radius: 0; }
  .course-page .course-outline:not([open]) { padding-bottom: 14px; }
  .course-page .course-outline li { padding: 0; border: 0; }
  .course-page .course-outline li strong { font-size: 11px; }
  .course-page .course-outline li small { font-size: 10px; }
  .course-page .course-context { margin-bottom: 20px; }
  .course-page .course-theory-section p { font-size: 15px; }
  .course-page .course-theory-sections { padding: 22px 0; }
  .course-page .course-repair .course-theory-sections { padding-top: 22px; }
  .course-page :is(.course-example, .course-notes, .course-notebook, .course-repair-question) { padding: 20px; }
  .recap-page .recap-main { padding-top: 28px; padding-bottom: 44px; }
  .setup-quiz .quiz-main { padding: 22px 24px 32px; }
  .setup-quiz .quiz-stage { margin-top: 30px; }
  .onboarding-page .assessment-main { padding: 28px 24px 20px; }
  .onboarding-page .onboarding-card { padding: 25px; }
}

@media (max-width: 520px) {
  .lesson-page .lesson-main h1 { font-size: 30px; }
  .lesson-page :is(.course-question, .recap-question) h1 { font-size: 26px; line-height: 1.35; }
  .lesson-page .course-main, .recap-page .recap-main { padding-left: 18px; padding-right: 18px; }
  .course-page :is(.course-example, .course-notes, .course-notebook, .course-repair-question) { padding: 18px; border-radius: 12px; }
  .course-page .course-theory-section h2 { font-size: 20px; }
  .lesson-page .formula { padding: 16px; font-size: 19px; }
  .course-page .course-question-heading { align-items: flex-start; }
  :is(.lesson-page, .onboarding-page) .answer-options .answer-option { gap: 10px; padding: 14px; font-size: 15px; }
  :is(.lesson-page, .onboarding-page) .answer-options .answer-letter { width: 28px; height: 28px; flex-basis: 28px; }
  .lesson-page :is(.course-feedback, .recap-feedback, .recap-repair-note, .answer-feedback.feedback-correct, .answer-feedback.feedback-learn), .course-page .course-repair .course-feedback { padding: 16px; gap: 10px; border-radius: 10px; }
  :is(.lesson-page, .onboarding-page) :is(.question-diagram, .geometry-diagram) { padding: 12px; border-radius: 10px; }
  .recap-page :is(.recap-topic, .recap-theory) { padding: 18px; border-radius: 12px; }
  .recap-page .recap-topic h2 { font-size: 19px; }
  .setup-quiz .quiz-main { padding: 18px 20px 30px; }
  .setup-quiz .quiz-stage { margin-top: 28px; }
  .setup-quiz .quiz-stage h1 { font-size: 34px; }
  .setup-quiz .quiz-lead { font-size: 14px; }
  .setup-quiz .quiz-input { min-height: 60px; padding: 15px; font-size: 20px; }
  .setup-quiz .quiz-answers .quiz-answer { min-height: 78px; padding: 16px; gap: 12px; }
  .setup-quiz .quiz-grades { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .setup-quiz .quiz-grades .quiz-answer { min-height: 106px; padding: 20px 8px 16px; }
  .setup-quiz .quiz-answer-copy strong { font-size: 14px; }
  .setup-quiz .quiz-grades .quiz-answer-copy strong { font-size: 29px; }
  .setup-quiz .quiz-answer-copy small { font-size: 12px; }
  .onboarding-page .assessment-main { padding: 24px 16px 20px; }
  .onboarding-page .onboarding-card { padding: 22px 18px; border-radius: 12px; }
  .onboarding-page .onboarding-card h1 { font-size: 30px; }
  .onboarding-page .adaptive-question h1 { font-size: 25px; line-height: 1.35; }
  .onboarding-page .adaptive-progress-meta { flex-wrap: wrap; gap: 5px 12px; font-size: 11px; }
  .onboarding-page .adaptive-next { flex-direction: column; align-items: stretch; gap: 14px; }
  .onboarding-page .adaptive-next > span { max-width: none; text-align: left; }
  .onboarding-page .adaptive-skip-options { grid-template-columns: minmax(0, 1fr); }
  :is(.lesson-page, .onboarding-page) .button { min-width: 0; padding: 13px 16px; font-size: 14px; }
}

@media (max-width: 360px) {
  .lesson-page .lesson-step-label { font-size: 10px; }
  .lesson-page .lesson-main h1, .onboarding-page .onboarding-card h1 { font-size: 28px; }
  .lesson-page :is(.course-question, .recap-question) h1, .onboarding-page .adaptive-question h1 { font-size: 23px; }
  .setup-quiz .quiz-stage h1 { font-size: 31px; }
  .course-page .course-math-keys { gap: 6px; }
  .course-page .course-result-details > div { padding: 16px 12px; }
  :is(.lesson-page, .onboarding-page) .answer-options .answer-option { padding: 12px; gap: 8px; }
  .onboarding-page .adaptive-question-tags { gap: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  :is(.lesson-page, .onboarding-page) *, :is(.lesson-page, .onboarding-page) *::before, :is(.lesson-page, .onboarding-page) *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}