.lms-body {
  --lms-ink: #17253f;
  --lms-muted: #64748b;
  --lms-line: #e3dff0;
  --lms-brand: #6957e8;
  --lms-brand-2: #8f7cff;
}

/* The legacy design system generated a second logo mark. */
.lms-nav > a strong::before {
  content: none;
  display: none;
}

.lms-brand {
  font-family: Manrope, "DM Sans", Inter, system-ui, sans-serif;
}

.lms-brand strong {
  font-family: Manrope, "DM Sans", Inter, system-ui, sans-serif;
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -.03em;
}

.lms-brand__mark {
  flex: 0 0 auto;
  background: #6957e8;
}

.lms-nav {
  border-color: #e6e9ef;
  background: rgba(251, 250, 246, .94);
  box-shadow: 0 8px 30px rgba(40, 34, 103, .06);
}

.lms-nav__link:hover {
  background: #eeeaff;
  color: #6957e8 !important;
}

.lms-nav button,
.lms-nav__login {
  background: #10233f !important;
  box-shadow: 0 7px 16px rgba(16, 35, 63, .16);
}

.lms-curriculum-theme {
  background:
    radial-gradient(circle at 7% 0, rgba(105, 87, 232, .12), transparent 30rem),
    radial-gradient(circle at 94% 14%, rgba(169, 156, 255, .14), transparent 28rem),
    linear-gradient(180deg, #fbfaf6 0, #f6f3fb 48%, #faf8f3 100%);
  color: #17253f;
}

.lms-curriculum-theme .lms-hero,
.lms-curriculum-theme .lms-lesson-hero {
  background: linear-gradient(132deg, #17253f 0%, #263859 54%, #413777 100%);
  box-shadow: 0 25px 60px rgba(40, 34, 103, .2);
}

.lms-curriculum-theme .lms-hero::after,
.lms-curriculum-theme .lms-lesson-hero::before {
  border-color: rgba(169, 156, 255, .2);
  box-shadow:
    0 0 0 68px rgba(169, 156, 255, .035),
    0 0 0 136px rgba(169, 156, 255, .025);
}

.lms-curriculum-theme .lms-card,
.lms-curriculum-theme .lms-topic,
.lms-curriculum-theme .lms-module-card,
.lms-curriculum-theme .lms-sublesson-card,
.lms-curriculum-theme .lms-lesson,
.lms-curriculum-theme .lms-curriculum-section,
.lms-curriculum-theme .lms-lesson-toc,
.lms-curriculum-theme .lms-db-exercise {
  border-color: #e3dff0;
  box-shadow: 0 9px 28px rgba(55, 45, 110, .065);
}

.lms-curriculum-theme .lms-module-card dl div,
.lms-curriculum-theme .lms-sublesson-card dl div,
.lms-curriculum-theme .lms-rich-list li,
.lms-curriculum-theme .lms-order-intro,
.lms-curriculum-theme .lms-connector-intro {
  border-color: #e8e3f3;
  background: linear-gradient(135deg, #f6f3ff, #fbfaff);
}

.lms-curriculum-theme .lms-level,
.lms-curriculum-theme .lms-badge,
.lms-curriculum-theme .lms-module-card dd b {
  background: #eeeaff;
  color: #5947cf;
}

.lms-curriculum-theme .button-link,
.lms-curriculum-theme .lms-form button,
.lms-curriculum-theme .lms-quiz > button,
.lms-curriculum-theme .lms-order-actions button,
.lms-curriculum-theme .lms-connector-actions button,
.lms-curriculum-theme .lms-editor-footer button,
.lms-curriculum-theme .lms-toc-test {
  background: linear-gradient(135deg, #6957e8, #8f7cff);
  color: #fff !important;
  box-shadow: 0 8px 19px rgba(105, 87, 232, .2);
}

.lms-curriculum-theme .lms-sublesson-card > div > span,
.lms-curriculum-theme .lms-curriculum-heading span,
.lms-curriculum-theme .lms-toc-progress strong,
.lms-curriculum-theme .lms-db-exercise__head span,
.lms-curriculum-theme .lms-db-exercise__head h3,
.lms-curriculum-theme .lms-db-exercise__head > strong,
.lms-curriculum-theme .lms-order-intro strong,
.lms-curriculum-theme .lms-connector-intro strong {
  color: #6957e8;
}

.lms-curriculum-theme .lms-curriculum-heading h2,
.lms-curriculum-theme .lms-curriculum-body h3,
.lms-curriculum-theme .lms-curriculum-section > h2,
.lms-curriculum-theme .lms-curriculum-details h2 {
  color: #17253f;
}

.lms-curriculum-theme .lms-curriculum-icon,
.lms-curriculum-theme .lms-lesson-toc nav i,
.lms-curriculum-theme .lms-order-card > header > span,
.lms-curriculum-theme .lms-connector-card > header > span {
  background: #eeeaff;
  color: #6957e8;
}

.lms-curriculum-theme .lms-lesson-toc nav a {
  color: #475569;
}

.lms-curriculum-theme .lms-lesson-toc nav a:hover {
  background: #eeeaff;
  color: #5947cf;
}

.lms-curriculum-theme .lms-rich-list li::before {
  color: #6957e8;
}

.lms-curriculum-theme .lms-callout {
  border-color: #8f7cff;
  background: #f2efff;
}

.lms-curriculum-theme .lms-callout strong,
.lms-curriculum-theme .lms-writing-prompt strong {
  color: #5947cf;
}

.lms-curriculum-theme .lms-db-exercise__head,
.lms-curriculum-theme .lms-writing-prompt,
.lms-curriculum-theme .lms-translation p:first-child,
.lms-curriculum-theme .lms-rich-table th {
  border-color: #e3dff0;
  background: linear-gradient(135deg, #eeeaff, #faf8ff);
  color: #413777;
}

.lms-curriculum-theme .lms-form input:focus,
.lms-curriculum-theme .lms-form textarea:focus,
.lms-curriculum-theme .lms-form select:focus,
.lms-curriculum-theme .lms-text-answer:focus,
.lms-curriculum-theme .lms-long-answer:focus {
  border-color: #8f7cff;
  box-shadow: 0 0 0 4px rgba(105, 87, 232, .12);
}

/* Questions and answer choices */
.lms-curriculum-theme .lms-question,
.lms-curriculum-theme .lms-option,
.lms-curriculum-theme .lms-order-card,
.lms-curriculum-theme .lms-connector-card,
.lms-curriculum-theme .lms-inline-text-card {
  border-color: #e3dff0;
  box-shadow: 0 4px 16px rgba(55, 45, 110, .04);
}

.lms-curriculum-theme .lms-question legend span,
.lms-curriculum-theme .lms-inline-text-card > header > span {
  background: linear-gradient(135deg, #6957e8, #8f7cff);
  color: #fff;
}

.lms-curriculum-theme .lms-option:hover {
  border-color: #b7acf1;
  background: #faf8ff;
}

.lms-curriculum-theme .lms-option:has(input:checked) {
  border-color: #8f7cff;
  background: #eeeaff;
  color: #33296f;
  box-shadow: 0 0 0 3px rgba(105, 87, 232, .1);
}

.lms-curriculum-theme .lms-option input {
  accent-color: #6957e8;
}

.lms-curriculum-theme .lms-order-chip,
.lms-curriculum-theme .lms-connector-chip {
  border-color: #ddd7ee;
  color: #413777;
  box-shadow: 0 2px 7px rgba(55, 45, 110, .07);
}

.lms-curriculum-theme .lms-order-chip:hover,
.lms-curriculum-theme .lms-order-chip:focus-visible,
.lms-curriculum-theme .lms-connector-chip:hover,
.lms-curriculum-theme .lms-connector-chip:focus-visible {
  border-color: #8f7cff;
  box-shadow: 0 0 0 3px rgba(105, 87, 232, .11);
}

.lms-curriculum-theme .lms-connector-chip.is-selected,
.lms-curriculum-theme .lms-connector-drop.has-value {
  border-color: #8f7cff;
  background: #eeeaff;
  color: #4938b1;
}

.lms-curriculum-theme .lms-connector-drop,
.lms-curriculum-theme .lms-order-zone {
  border-color: #bcb2e7;
  background: #faf8ff;
}

.lms-curriculum-theme .lms-basic-exercise .is-correct,
.lms-curriculum-theme .lms-inline-text-card.is-correct,
.lms-curriculum-theme .lms-order-card.is-correct,
.lms-curriculum-theme .lms-connector-card.is-correct {
  border-color: #8f7cff;
  background: #f7f4ff;
  box-shadow: 0 0 0 3px rgba(105, 87, 232, .1);
}

.lms-curriculum-theme .lms-basic-exercise .is-correct .lms-basic-status,
.lms-curriculum-theme .lms-order-card.is-correct .lms-order-status,
.lms-curriculum-theme .lms-connector-card.is-correct .lms-connector-status {
  color: #5947cf;
}

.lms-curriculum-theme .lms-inline-text-card textarea {
  border-color: #bcb2e7;
  background: #faf8ff;
  color: #2f285a;
}

.lms-curriculum-theme .lms-inline-text-card textarea:focus {
  border-color: #8f7cff;
  outline: 3px solid rgba(105, 87, 232, .12);
}

/* Full sublesson component sweep */
.lms-curriculum-theme .lms-numbered-heading {
  border-color: #e3dff0;
  color: #17253f !important;
}

.lms-curriculum-theme .lms-numbered-heading::before {
  background: linear-gradient(180deg, #6957e8, #a99cff);
}

.lms-curriculum-theme .lms-grammar-formula {
  border-color: #ddd7ee;
  background: #fbfaff;
  box-shadow: 0 10px 28px rgba(55, 45, 110, .07);
}

.lms-curriculum-theme .lms-grammar-formula__label {
  background: linear-gradient(120deg, #17253f, #352e68);
}

.lms-curriculum-theme .lms-grammar-formula__label span {
  color: #c9c1ff;
}

.lms-curriculum-theme .lms-grammar-formula__tokens > span {
  border-color: #e3dff0;
  background: #fff;
}

.lms-curriculum-theme .lms-grammar-formula__tokens > span.is-connector {
  border-color: #c8bef3;
  background: #f0edff;
}

.lms-curriculum-theme .lms-grammar-formula__tokens > span.is-subject {
  border-color: #cbd4ed;
  background: #f2f5fc;
}

.lms-curriculum-theme .lms-grammar-formula__tokens > span.is-verb {
  border-color: #bcb0ef;
  background: #ece8ff;
}

.lms-curriculum-theme .lms-grammar-formula__tokens strong,
.lms-curriculum-theme .lms-grammar-formula__example span {
  color: #2f285a;
}

.lms-curriculum-theme .lms-grammar-formula__example {
  border-color: #e3dff0;
  background: linear-gradient(135deg, #f3f0ff, #faf8ff);
}

.lms-curriculum-theme .lms-exercise-card {
  border-color: #e3dff0;
  background: #fcfbff;
}

.lms-curriculum-theme .lms-exercise-card > header {
  border-color: #e3dff0;
  background: linear-gradient(135deg, #eeeaff, #faf8ff);
}

.lms-curriculum-theme .lms-exercise-card > header span,
.lms-curriculum-theme .lms-exercise-card > header h3 {
  color: #5947cf;
}

.lms-curriculum-theme .lms-exercise-instruction,
.lms-curriculum-theme .lms-inline-answer,
.lms-curriculum-theme .lms-curriculum-details > summary {
  border-color: #e3dff0;
  background: #f5f2ff;
  color: #413777;
}

.lms-curriculum-theme .lms-inline-answer > summary,
.lms-curriculum-theme .lms-inline-answer li p {
  color: #4938b1;
}

.lms-curriculum-theme .lms-inline-answer li,
.lms-curriculum-theme .lms-conjugation-item {
  border-color: #e3dff0;
  background: #faf8ff;
}

.lms-curriculum-theme .lms-inline-answer li > span,
.lms-curriculum-theme .lms-conjugation-item > span,
.lms-curriculum-theme .lms-order-intro > span,
.lms-curriculum-theme .lms-connector-intro > span {
  background: #6957e8;
  color: #fff;
}

.lms-curriculum-theme .lms-conjugation-item code {
  background: #eeeaff;
  color: #4938b1;
}

.lms-curriculum-theme .lms-section--objectives,
.lms-curriculum-theme .lms-section-type--assessment {
  border-left-color: #6957e8;
}

.lms-curriculum-theme .lms-activity {
  border-color: #e3dff0;
  color: #2f285a;
}

.lms-curriculum-theme .lms-activity > span {
  background: #eeeaff;
  color: #5947cf;
}

.lms-curriculum-theme .lms-editor-toolbar {
  border-color: #ddd7ee;
  background: #f3f0fa;
}

.lms-curriculum-theme .lms-editor-toolbar button {
  color: #413777;
}

.lms-curriculum-theme .lms-editor-toolbar button:hover,
.lms-curriculum-theme .lms-editor-toolbar button:focus-visible {
  border-color: #bcb2e7;
  background: #fff;
}

.lms-curriculum-theme .lms-rich-editor {
  border-color: #ddd7ee;
  color: #2f285a;
}

.lms-curriculum-theme .lms-rich-editor:focus {
  border-color: #8f7cff;
  box-shadow: inset 0 0 0 2px rgba(105, 87, 232, .1);
}

.lms-curriculum-theme .lms-rich-editor h2,
.lms-curriculum-theme .lms-rich-editor h3 {
  color: #17253f;
}

.lms-curriculum-theme .lms-rich-editor blockquote {
  border-color: #8f7cff;
  background: #f2efff;
  color: #413777;
}

.lms-curriculum-theme .lms-editor-footer span,
.lms-curriculum-theme .lms-editor-footer span.is-target {
  background: #eeeaff;
  color: #5947cf;
}

.lms-curriculum-theme .lms-db-exercise.is-completed {
  border-color: #a99cff;
  box-shadow: 0 8px 26px rgba(105, 87, 232, .11);
}

.lms-curriculum-theme .lms-db-exercise.is-completed > .lms-db-exercise__head {
  background: linear-gradient(135deg, #eae6ff, #faf8ff);
}

.lms-curriculum-theme .lms-exercise-completion {
  border-color: #c8bef3;
  color: #5947cf;
}

.lms-curriculum-theme .lms-exercise-completion > span {
  background: #6957e8;
}

.lms-curriculum-theme .lms-error-comparison {
  border-color: #e3dff0;
  box-shadow: 0 5px 18px rgba(55, 45, 110, .05);
}

.lms-curriculum-theme .lms-error-comparison > header {
  border-color: #e3dff0;
  background: #faf8ff;
}

.lms-curriculum-theme .lms-error-comparison__pair .is-correct {
  box-shadow: inset 0 -3px #8f7cff;
}

.lms-curriculum-theme .lms-error-comparison__pair .is-correct i {
  background: #eeeaff;
  color: #5947cf;
}

.lms-curriculum-theme .lms-error-comparison__pair .is-correct p strong {
  color: #5947cf;
}

/* Assessment workspace */
.lms-assessment-page {
  width: min(980px, 100%);
  margin: 0 auto;
}

.lms-assessment-page > .lms-back {
  margin: 2px 0 18px;
  color: #5947cf;
}

.lms-assessment-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px;
  gap: 34px;
  align-items: center;
  overflow: hidden;
  margin-bottom: 22px;
  padding: 40px;
  border-radius: 28px;
  background: linear-gradient(132deg, #17253f 0%, #293b62 56%, #493f83 100%);
  color: #fff;
  box-shadow: 0 25px 60px rgba(40, 34, 103, .2);
}

.lms-assessment-hero::after {
  content: "";
  position: absolute;
  right: -90px;
  top: -150px;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(169, 156, 255, .2);
  border-radius: 50%;
  box-shadow: 0 0 0 58px rgba(169, 156, 255, .035), 0 0 0 116px rgba(169, 156, 255, .025);
}

.lms-assessment-hero > * {
  position: relative;
  z-index: 1;
}

.lms-assessment-hero h1 {
  max-width: 720px;
  margin: 8px 0 13px;
  font-size: clamp(2rem, 4vw, 3.45rem);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.lms-assessment-hero > div > p:not(.eyebrow) {
  max-width: 650px;
  margin: 0;
  color: #d8dcef;
  line-height: 1.6;
}

.lms-assessment-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 24px;
}

.lms-assessment-hero__meta span {
  display: grid;
  gap: 3px;
  min-width: 104px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 11px;
  background: rgba(255,255,255,.07);
}

.lms-assessment-hero__meta small {
  color: #bfc7df;
  font-size: .63rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.lms-assessment-hero aside {
  display: grid;
  justify-items: center;
  gap: 10px;
}

.lms-assessment-hero aside > div {
  display: grid;
  place-content: center;
  width: 132px;
  height: 132px;
  border-radius: 50%;
  text-align: center;
  background: conic-gradient(#a99cff calc(var(--assessment-progress) * 1%), rgba(255,255,255,.12) 0);
  box-shadow: inset 0 0 0 13px #26385e;
}

.lms-assessment-hero aside strong {
  font-size: 1.8rem;
}

.lms-assessment-hero aside span,
.lms-assessment-hero aside small {
  color: #cbd2e6;
  font-size: .7rem;
}

.lms-assessment-page > .lms-exercise-completion {
  margin: 0 0 20px;
  border-color: #c8bef3;
  background: linear-gradient(135deg, #f0edff, #fff);
}

.lms-assessment-page > .lms-exercise-completion a {
  margin-top: 3px;
  color: #5947cf;
  font-size: .72rem;
  font-weight: 850;
  text-decoration: none;
}

.lms-assessment-quiz {
  overflow: hidden;
  border: 1px solid #e3dff0;
  border-radius: 22px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 16px 42px rgba(55,45,110,.075);
}

.lms-assessment-quiz__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 23px 27px;
  border-bottom: 1px solid #e8e3f3;
  background: linear-gradient(135deg, #eeeaff, #faf8ff);
}

.lms-assessment-quiz__heading span {
  color: #6957e8;
  font-size: .65rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .1em;
}

.lms-assessment-quiz__heading h2 {
  margin: 4px 0 0;
  color: #17253f;
}

.lms-assessment-quiz__heading > strong {
  padding: 8px 11px;
  border-radius: 10px;
  background: #fff;
  color: #5947cf;
  font-size: .76rem;
}

.lms-assessment-questions {
  display: grid;
  gap: 14px;
  padding: 24px;
}

.lms-assessment-quiz .lms-question {
  margin: 0;
  padding: 23px;
  border-radius: 16px;
  background: #fff;
}

.lms-assessment-quiz .lms-question.is-correct {
  border-color: #8fcbae;
  background: linear-gradient(135deg, #f1fbf6, #fff);
  box-shadow: 0 5px 18px rgba(35, 131, 88, .08);
}

.lms-assessment-quiz .lms-question.is-correct legend span {
  background: linear-gradient(135deg, #238358, #42aa77);
}

.lms-assessment-quiz .lms-question.is-wrong {
  border-color: #e2a09b;
  background: linear-gradient(135deg, #fff5f4, #fff);
  box-shadow: 0 5px 18px rgba(175, 61, 53, .08);
}

.lms-assessment-quiz .lms-question.is-wrong legend span {
  background: linear-gradient(135deg, #b63d35, #d96359);
}

.lms-assessment-quiz .lms-option.is-saved-wrong,
.lms-assessment-quiz .lms-option.is-saved-wrong:has(input:checked) {
  border-color: #d96359;
  background: #ffebe9;
  color: #8f2923;
  box-shadow: 0 0 0 3px rgba(199, 68, 58, .1);
}

.lms-assessment-quiz .lms-option.is-saved-wrong input {
  accent-color: #c7443a;
}

.lms-assessment-quiz .lms-option.is-saved-correct,
.lms-assessment-quiz .lms-option.is-saved-correct:has(input:checked) {
  border-color: #42a974;
  background: #e9f8f0;
  color: #176540;
  box-shadow: 0 0 0 3px rgba(35, 131, 88, .1);
}

.lms-assessment-quiz .lms-option.is-saved-correct input {
  accent-color: #238358;
}

.lms-assessment-quiz .lms-option {
  margin: 9px 0 0;
  padding: 14px 15px;
}

.lms-saved-answer {
  display: inline-block;
  margin-top: 11px;
  color: #6957e8;
  font-weight: 800;
}

.lms-saved-answer.is-wrong {
  color: #b63d35;
}

.lms-saved-answer.is-correct {
  color: #238358;
}

.lms-assessment-submit {
  position: sticky;
  bottom: 0;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 20px 25px;
  border-top: 1px solid #e3dff0;
  background: rgba(250,248,255,.96);
  backdrop-filter: blur(12px);
}

.lms-assessment-submit div {
  display: grid;
  gap: 3px;
}

.lms-assessment-submit strong {
  color: #17253f;
}

.lms-assessment-submit small {
  color: #64748b;
}

.lms-assessment-submit button {
  flex: none;
  border: 0;
  border-radius: 12px;
  padding: 13px 19px;
  background: linear-gradient(135deg, #6957e8, #8f7cff);
  color: #fff;
  font: inherit;
  font-weight: 850;
  box-shadow: 0 9px 20px rgba(105,87,232,.22);
  cursor: pointer;
}

@media (max-width: 720px) {
  .lms-assessment-hero {
    grid-template-columns: 1fr;
    padding: 28px 22px;
  }
  .lms-assessment-hero aside {
    grid-template-columns: auto 1fr;
    justify-items: start;
    align-items: center;
  }
  .lms-assessment-hero aside > div {
    width: 105px;
    height: 105px;
    box-shadow: inset 0 0 0 10px #26385e;
  }
  .lms-assessment-questions {
    padding: 14px;
  }
  .lms-assessment-submit {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Assessment result */
.lms-result-page {
  width: min(1020px, 100%);
  margin: 0 auto;
}

.lms-result-page > .lms-back {
  margin: 2px 0 18px;
  color: #5947cf;
}

.lms-result-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  gap: 36px;
  align-items: center;
  overflow: hidden;
  padding: 42px;
  border-radius: 28px;
  background: linear-gradient(132deg, #17253f 0%, #293b62 56%, #493f83 100%);
  color: #fff;
  box-shadow: 0 25px 60px rgba(40,34,103,.2);
}

.lms-result-hero::after {
  content: "";
  position: absolute;
  right: -100px;
  top: -145px;
  width: 350px;
  height: 350px;
  border: 1px solid rgba(169,156,255,.2);
  border-radius: 50%;
  box-shadow: 0 0 0 62px rgba(169,156,255,.035), 0 0 0 124px rgba(169,156,255,.025);
}

.lms-result-hero > * {
  position: relative;
  z-index: 1;
}

.lms-result-hero__status {
  display: inline-flex;
  margin: 8px 0 2px;
  padding: 7px 10px;
  border: 1px solid rgba(126,224,172,.25);
  border-radius: 99px;
  background: rgba(55,172,111,.16);
  color: #a9efc9;
  font-size: .72rem;
  font-weight: 900;
}

.lms-result-hero.is-developing .lms-result-hero__status {
  border-color: rgba(255,197,125,.26);
  background: rgba(221,139,46,.16);
  color: #ffd3a0;
}

.lms-result-hero h1 {
  max-width: 690px;
  margin: 12px 0;
  font-size: clamp(2rem,4vw,3.35rem);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.lms-result-hero > div > p:not(.eyebrow) {
  max-width: 650px;
  color: #d8dcef;
  line-height: 1.6;
}

.lms-result-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 23px;
}

.lms-result-hero__actions > a:not(.button-link) {
  color: #d9d4ff;
  font-size: .82rem;
  font-weight: 850;
  text-decoration: none;
}

.lms-result-hero aside {
  display: grid;
  justify-items: center;
  gap: 11px;
}

.lms-result-hero aside > div {
  display: grid;
  place-content: center;
  width: 145px;
  height: 145px;
  border-radius: 50%;
  text-align: center;
  background: conic-gradient(#71d69f calc(var(--result-score) * 1%), rgba(255,255,255,.12) 0);
  box-shadow: inset 0 0 0 14px #26385e;
}

.lms-result-hero aside strong {
  font-size: 2rem;
}

.lms-result-hero aside span,
.lms-result-hero aside small {
  color: #cbd2e6;
  font-size: .72rem;
}

.lms-result-metrics {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 12px;
  margin: 16px 0 26px;
}

.lms-result-metrics article {
  display: grid;
  gap: 4px;
  padding: 20px;
  border: 1px solid #e3dff0;
  border-radius: 16px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 7px 22px rgba(55,45,110,.05);
}

.lms-result-metrics span,
.lms-result-metrics small {
  color: #64748b;
  font-size: .7rem;
}

.lms-result-metrics strong {
  color: #17253f;
  font-size: 1.7rem;
}

.lms-result-metrics .is-correct strong { color: #238358; }
.lms-result-metrics .is-wrong strong { color: #b63d35; }
.lms-result-metrics .is-score strong { color: #5947cf; }

.lms-result-review > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 16px;
}

.lms-result-review > header span {
  color: #6957e8;
  font-size: .66rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .1em;
}

.lms-result-review > header h2 {
  margin: 5px 0 0;
  color: #17253f;
}

.lms-result-review > header p {
  max-width: 400px;
  margin: 0;
  color: #64748b;
  font-size: .82rem;
  line-height: 1.5;
}

.lms-result-answer-grid {
  display: grid;
  gap: 13px;
}

.lms-result-answer {
  overflow: hidden;
  border: 1px solid;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 6px 22px rgba(55,45,110,.045);
}

.lms-result-answer.is-correct { border-color: #9ad0b4; }
.lms-result-answer.is-wrong { border-color: #e2a09b; }

.lms-result-answer > header {
  display: flex;
  gap: 13px;
  align-items: flex-start;
  padding: 19px 21px;
  border-bottom: 1px solid #edf0ee;
  background: #f5fbf7;
}

.lms-result-answer.is-wrong > header { background: #fff5f4; }

.lms-result-answer > header > span {
  display: grid;
  place-items: center;
  flex: none;
  width: 31px;
  height: 31px;
  border-radius: 50%;
  background: #238358;
  color: #fff;
  font-weight: 950;
}

.lms-result-answer.is-wrong > header > span { background: #c7443a; }

.lms-result-answer > header div {
  display: grid;
  gap: 4px;
}

.lms-result-answer > header small {
  color: #718078;
  font-size: .64rem;
  font-weight: 850;
  text-transform: uppercase;
}

.lms-result-answer > header strong {
  color: #17253f;
  line-height: 1.45;
}

.lms-result-answer__response {
  display: grid;
  grid-template-columns: 105px 1fr;
  gap: 14px;
  padding: 14px 21px;
}

.lms-result-answer__response span,
.lms-result-answer > footer span {
  color: #748279;
  font-size: .65rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.lms-result-answer__response p,
.lms-result-answer > footer p {
  margin: 0;
  color: #34463d;
}

.lms-result-answer.is-wrong .lms-result-answer__response:not(.is-correct) p {
  color: #a6352e;
  text-decoration: line-through;
}

.lms-result-answer__response.is-correct {
  background: #edf9f2;
}

.lms-result-answer__response.is-correct p {
  color: #176540;
  font-weight: 800;
}

.lms-result-answer > footer {
  display: grid;
  grid-template-columns: 105px 1fr;
  gap: 14px;
  padding: 14px 21px;
  border-top: 1px solid #edf0ee;
  background: #fafbfa;
}

@media (max-width: 720px) {
  .lms-result-hero {
    grid-template-columns: 1fr;
    padding: 28px 22px;
  }
  .lms-result-hero aside {
    grid-template-columns: auto 1fr;
    justify-items: start;
    align-items: center;
  }
  .lms-result-hero aside > div {
    width: 108px;
    height: 108px;
    box-shadow: inset 0 0 0 10px #26385e;
  }
  .lms-result-metrics {
    grid-template-columns: 1fr;
  }
  .lms-result-review > header {
    align-items: flex-start;
    flex-direction: column;
  }
  .lms-result-answer__response,
  .lms-result-answer > footer {
    grid-template-columns: 1fr;
    gap: 5px;
  }
}
