/* Lao flag palette: red #CE1126, blue #002868, white #FFFFFF.
   Light surfaces keep the learning pages bright; flag colors carry emphasis. */
:root {
  --laos-red: #ce1126;
  --laos-red-hover: #ad0d20;
  --laos-blue: #002868;
  --laos-blue-soft: #edf3ff;
  --laos-red-soft: #fff0f2;
  --ink: #102d59;
  --ink-soft: #304f7d;
  --muted: #4d6487;
  --paper: #f8faff;
  --paper-deep: #eaf0fa;
  --white: #ffffff;
  --teal: #002868;
  --teal-dark: #002868;
  --teal-light: #edf3ff;
  --coral: #ce1126;
  --coral-dark: #ad0d20;
  --gold: #ce1126;
  --gold-light: #fff0f2;
  --line: rgba(0, 40, 104, .12);
  --shadow: 0 24px 60px rgba(0, 40, 104, .09);
  --shadow-small: 0 9px 26px rgba(0, 40, 104, .06);
}
body { background: radial-gradient(ellipse at 95% 0, #dce8ff 0, transparent 48rem), radial-gradient(ellipse at 0 18rem, #fff0f2 0, transparent 35rem), #f3f6fd; }
.site-header { background: #ffffffed; border-bottom-color: #dce5f4; }
.site-header::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #ce1126 25%, #002868 25% 75%, #ce1126 75%); }
.brand-mark { background: var(--laos-blue); color: white; box-shadow: 5px 5px 0 #f3bdc5; }
.brand-mark span { color: white; }
.brand-copy strong::after { content: ""; display: inline-block; vertical-align: middle; width: 24px; height: 16px; margin-left: 8px; border-radius: 2px; background: radial-gradient(circle at center, white 0 3.2px, transparent 3.6px), linear-gradient(#ce1126 25%, #002868 25% 75%, #ce1126 75%); }
.main-nav a[aria-current="page"] { color: var(--laos-blue); text-decoration-color: var(--laos-red); }
.user-chip { background: #edf3ff; color: var(--laos-blue); }
:focus-visible { outline-color: #476ec3; }
.button { background: var(--laos-red); color: white; border-color: var(--laos-red); box-shadow: 0 4px 0 #ce112618; }
.button:hover { background: var(--laos-red-hover); border-color: var(--laos-red-hover); box-shadow: 0 5px 0 #ce112618; }
.button-ghost, .button-light { background: white; color: var(--laos-blue); border-color: #c9d8f0; box-shadow: none; }
.button-ghost:hover, .button-light:hover { background: #edf3ff; color: var(--laos-blue); border-color: #9bb5e1; }
.status-new { background: #fff0f2; color: #a41428; }
.learning-hero { background: linear-gradient(120deg, #edf3ff, #ffffff 85%); color: var(--laos-blue); border-color: #d5e1f4; }
.learning-hero-copy .eyebrow, .hero-secondary { color: var(--laos-blue); }
.learning-hero-copy > p:not(.eyebrow), .hero-meta { color: #465a76; }
.learning-hero .button, .dashboard-v2 .resume-actions .button { background: var(--laos-red); border-color: var(--laos-red); color: white; }
.learning-hero .button:hover, .dashboard-v2 .resume-actions .button:hover { background: var(--laos-red-hover); border-color: var(--laos-red-hover); }
.image-caption { background: #fffffff0; color: var(--laos-blue); }
.coming-pill { border-color: #c9d8f0; color: var(--laos-blue); }
.daily-plan-unit { background: #fff0f2; color: #a41428; }
.daily-plan-steps > a { background: #f8faff; border-color: #e0e7f3; }
.daily-plan-steps > a:hover { background: #edf3ff; border-color: #b5caeb; }
.book-feature, .book-card, .book-progress-panel { border-color: #dce5f4; }
.book-feature:hover { background: #f2f6ff; border-color: #a9c0e6; }
.book-feature-symbol { color: var(--laos-blue); background: #edf3ff; }
.book-feature p { color: #536783; }
.book-progress { background: #e7edf8; }
.book-progress::-webkit-progress-bar { background: #e7edf8; }
.book-vocabulary .dictionary-count { background: #edf3ff; border-color: #d3e0f4; color: var(--laos-blue); }
.book-vocabulary .dictionary-count strong { color: var(--laos-blue); }
.book-vocabulary .dictionary-count span { color: #536783; }
.book-vocabulary .dictionary-search .button { background: var(--laos-red); color: white; border-color: var(--laos-red); }
.book-vocabulary .dictionary-search .button:hover { background: var(--laos-red-hover); }
.book-vocabulary .dictionary-ai { background: #edf3ff; color: var(--laos-blue); border-color: #ccdafa; }
.dictionary-unit { background: #edf3ff; color: var(--laos-blue); }
.dashboard-v2 { --dashboard-line: #dfe6f3; }
.dashboard-v2 .dashboard-welcome .muted-copy { color: #536783; }
.dashboard-library-link, .dashboard-today, .dashboard-book { background: white; }
.library-count { background: #edf3ff; color: var(--laos-blue); }
.welcome-dot { color: var(--laos-red); }
.dashboard-v2 .resume-kicker { color: #a41428 !important; }
.resume-dot { background: var(--laos-red); }
.resume-book-line, .resume-book-line span { color: #536783; }
.dashboard-v2 .dashboard-resume .resume-story { color: #465a76; }
.resume-outline { color: var(--laos-blue); }
.today-duration { background: #fff0f2; color: #a41428; }
.today-steps a:hover { background: #f2f6ff; border-color: #cfddf2; }
.today-step-number { background: #edf3ff; color: var(--laos-blue); }
.today-steps li:first-child .today-step-number { background: var(--laos-blue); color: white; }
.step-arrow { color: var(--laos-blue); }
.today-steps small, .today-note, .today-note > span { color: #586a84; }
.today-note { border-color: #e0e7f3; }
.dashboard-metrics { background: #ffffffb8; }
.metric-symbol, .metric-blue { color: var(--laos-blue); background: #edf3ff; }
.metric-gold { color: #af1125; background: #fff0f2; }
.dashboard-metric strong small, .dashboard-metric div > span { color: #586a84; }
.metric-arrow { color: var(--laos-blue); }
.metric-link:hover .metric-symbol { background: #dce8ff; }
.dashboard-book-meta, .dashboard-book-copy > p, .dashboard-book-progress { color: #536783; }
.dashboard-book-status { background: #edf3ff; color: var(--laos-blue); }
.dashboard-book-progress strong { color: var(--laos-blue); }
.dashboard-book-open, .dashboard-book-features a { background: #edf3ff; color: var(--laos-blue); border-color: #cfdcf4; }
.dashboard-book-open:hover, .dashboard-book-features a:hover { background: #dde9ff; border-color: #a4bde9; }
.dashboard-book-cover > span, .book-edition, .unit-cover-number { background: #fffffff2; color: var(--laos-blue); }
.dashboard-upcoming { background: #f3f6fd; border-color: #c4d3ed; }
.dashboard-upcoming:hover { background: #edf3ff; border-color: #a4bde9; }
.upcoming-number { color: var(--laos-blue); background: #e4edfc; }
.dashboard-upcoming strong, .dashboard-upcoming > span:last-child { color: var(--laos-blue); }
.dashboard-upcoming p { color: #586a84; }
@media (min-width: 701px) and (max-width: 999px) { .today-steps a { background: #f8faff; border-color: #e0e7f3; } }

/* Restrained editorial treatment; the flag palette stays in the accents. */
:root { --shadow-small: 0 8px 26px #00286814; --premium-border: #cedaf0; }
.site-header { min-height: 88px; background: #ffffffed; border-bottom: 1px solid var(--premium-border); }
.site-header::before { display: none; }
.brand-mark { display: flex; align-items: center; justify-content: center; gap: 2px; flex-shrink: 0; font-family: Georgia, serif; font-size: 17px; letter-spacing: -.06em; transform: none; border-radius: 13px; box-shadow: 0 3px 0 var(--laos-red); }
.brand-logo { display: block; width: 64px; height: 64px; flex-shrink: 0; object-fit: contain; }
@media (max-width: 640px) { .brand-logo { width: 52px; height: 52px; } }
.brand-copy strong { font-weight: 700; letter-spacing: -.035em; }
.brand-copy strong::after { width: 21px; height: 14px; margin-left: 9px; background: radial-gradient(circle at center, white 0 2.8px, transparent 3.2px), linear-gradient(#ce1126 25%, #002868 25% 75%, #ce1126 75%); }
.main-nav a[aria-current="page"] { text-decoration: none; position: relative; color: #002868; font-weight: 750; }
.main-nav a[aria-current="page"]::after { content: ""; position: absolute; bottom: -10px; left: 0; width: 34px; height: 3px; background: var(--laos-red); border-radius: 2px; }
.user-chip { background: #002868; color: white; border: 1px solid #002868; }
.button { border-radius: 11px; box-shadow: 0 4px 12px #ce11261c; transition: background 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.button:hover { transform: translateY(-1px); box-shadow: 0 7px 18px #ce112629; }
.button-ghost, .button-light { box-shadow: none; }
.learning-hero { background: linear-gradient(115deg, #e7efff, #fff 62%); border-color: var(--premium-border); box-shadow: 0 12px 34px #00286810; }
.learning-hero .learning-hero-image { margin: 14px 14px 14px 0; border-radius: 17px; overflow: hidden; }
.book-hero .learning-hero-image img { min-height: 312px; }
.book-hero h1 { font-family: Georgia, "Times New Roman", serif; font-weight: 500; letter-spacing: -.045em; font-size: clamp(36px, 4vw, 54px); }
.learning-heading h1 { letter-spacing: -.04em; }
.dashboard-v2 .dashboard-welcome { padding: 32px 0 26px; }
.dashboard-v2 .dashboard-welcome h1 { font-size: clamp(28px, 3vw, 38px); font-weight: 650; letter-spacing: -.04em; }
.dashboard-v2 .dashboard-welcome .eyebrow { color: #7a8596; letter-spacing: .035em; font-weight: 600; margin-bottom: 8px; }
.dashboard-v2 .dashboard-welcome .muted-copy { color: #67748a; font-size: 13px; }
.dashboard-library-link { background: white; border-color: #e1e6ef; border-radius: 10px; box-shadow: 0 2px 5px #132b5203; font-size: 12px; }
.library-count { background: #f3f5fa; border-radius: 5px; min-width: 23px; min-height: 23px; }
.dashboard-study-layout { grid-template-columns: minmax(0, 1fr) 286px; gap: 0; padding: 10px; background: white; border: 1px solid #e5e9f1; border-radius: 26px; box-shadow: 0 12px 44px #132b5207; }
.dashboard-v2 .dashboard-resume { background: transparent; border: 0; border-radius: 0; min-height: 380px; grid-template-columns: .95fr 1.1fr; box-shadow: none; }
.dashboard-v2 .dashboard-resume .learning-hero-copy { padding: 27px; }
.dashboard-v2 .resume-kicker { font-size: 11px; font-weight: 600; margin-bottom: 23px !important; color: #a01426 !important; }
.resume-dot { width: 5px; height: 5px; }
.resume-book-line { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; font-size: 11px; }
.resume-book-line a { color: #5d6d85; text-decoration: underline; text-decoration-color: #d0d8e5; text-underline-offset: 4px; }
.resume-book-line a:hover { color: var(--laos-blue); text-decoration-color: var(--laos-blue); }
.resume-book-line .resume-unit-label { color: var(--laos-blue); font-size: 10px; padding: 3px 7px; border: 1px solid #dce4f2; border-radius: 5px; background: #f7f9fd; }
.dashboard-v2 .dashboard-resume h2 { font-family: Georgia, "Times New Roman", serif; font-weight: 500; font-size: clamp(36px, 3.7vw, 49px); line-height: 1.08; letter-spacing: -.045em; margin: 18px 0 14px; text-wrap: balance; }
.dashboard-v2 .dashboard-resume .resume-story { color: #63718a; font-size: 13px; line-height: 1.7; margin-bottom: 24px; }
.dashboard-v2 .dashboard-resume .learning-hero-image { margin: 8px 14px 8px 0; border-radius: 18px; overflow: hidden; }
.dashboard-v2 .resume-actions .button { min-height: 45px; padding: 11px 18px; border-radius: 10px; box-shadow: 0 5px 14px #ce11261c; }
.resume-actions { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 16px; }
.resume-outline { color: #53647f; text-decoration: underline; text-decoration-color: #d2d9e5; text-underline-offset: 5px; }
.dashboard-v2 .dashboard-resume .image-caption { display: inline-flex; align-items: center; gap: 9px; padding: 7px 10px; border: 1px solid #ffffffa6; background: #ffffffed; border-radius: 9px; box-shadow: 0 4px 14px #132b5214; backdrop-filter: blur(10px); }
.hero-level { display: grid; place-items: center; width: 24px; height: 24px; background: var(--laos-blue); color: white; border-radius: 6px; font-size: 10px; font-weight: 700; }
.dashboard-today { border: 0; border-left: 1px solid #edf0f5; box-shadow: none; border-radius: 0; padding: 23px; margin: 12px 0; align-self: stretch; }
.today-heading .eyebrow { color: #7b8698; font-size: 11px; margin-bottom: 6px; }
.today-heading h2 { font-size: 22px; font-weight: 650; }
.today-duration { background: #f6f7fa; color: #58657a; padding: 5px 8px; border: 1px solid #edf0f5; border-radius: 6px; }
.today-steps { margin-top: 22px; gap: 11px; }
.today-steps li { position: relative; }
.today-steps a { position: relative; padding: 12px 5px; }
.today-step-number { border: 1px solid #e0e6f0; background: white; color: #59708f; border-radius: 50%; font-family: "Segoe UI", sans-serif; font-variant-numeric: tabular-nums; }
.today-steps li:first-child .today-step-number { background: #fff2f3; color: #b41529; border-color: #f4d3d8; }
.today-steps strong { font-weight: 650; }
.today-steps small { color: #758096; }
.today-note { border-color: #edf0f5; color: #718097; font-size: 10px; }
.dashboard-metrics { border: 0; border-bottom: 1px solid #e5eaf2; border-radius: 0; background: transparent; padding: 24px 0; margin-top: 0; margin-bottom: 29px; box-shadow: none; }
.dashboard-metric:first-child { padding-left: 0; }
.dashboard-metric .metric-symbol { display: none; }
.metric-symbol, .metric-blue { background: white; border: 1px solid #e2e8f3; border-radius: 11px; color: #57749e; }
.metric-gold { background: #fff8f9; border-color: #f2dce0; color: #bd3042; }
.dashboard-metric strong { font-size: 25px; font-weight: 650; font-variant-numeric: tabular-nums; }
.dashboard-section-heading h2 { font-weight: 650; font-size: 26px; }
.dashboard-section-heading .eyebrow { color: #7b8698; font-weight: 600; font-size: 11px; }
.dashboard-book { padding: 20px; border-color: var(--premium-border); border-radius: 20px; box-shadow: 0 6px 24px #132b5204; gap: 28px; }
.dashboard-book-cover { width: 145px; height: 176px; border-radius: 7px 13px 13px 7px; box-shadow: 3px 5px 13px #132b5215; }
.dashboard-book-cover::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 9px; background: linear-gradient(90deg, #132b5220, #ffffff35, transparent); pointer-events: none; }
.dashboard-book-copy h3 { font-family: Georgia, "Times New Roman", serif; font-size: 29px; font-weight: 500; letter-spacing: -.04em; }
.dashboard-book-status { background: #f4f7fc; border: 1px solid #e1e7f2; border-radius: 5px; }
.dashboard-book-open { background: white; color: var(--laos-blue); border-color: #d8e1f0; border-radius: 10px; }
.dashboard-book-features a { background: #f8faff; border-color: #e0e6f1; font-size: 11px; border-radius: 6px; }
.book-progress, .book-progress::-webkit-progress-bar { background: #edf0f6; }
.dashboard-upcoming { background: transparent; border: 0; border-top: 1px solid #e6ebf3; border-radius: 0; padding: 17px 0; }
.upcoming-number { background: #f0f3f9; color: #667c9e; font-size: 15px; font-weight: 600; }
.dashboard-upcoming strong { color: #526782; font-weight: 600; }
.dashboard-upcoming p { color: #7b879a; }
.book-card { border-color: var(--premium-border); border-radius: 20px; padding: 12px 12px 0; box-shadow: 0 5px 20px #132b5204; }
.book-cover { border-radius: 12px; }
.book-card-body { padding: 21px 8px 23px; }
.book-card-body h3 { font-family: Georgia, "Times New Roman", serif; font-size: 27px; font-weight: 500; letter-spacing: -.035em; }
.book-coming { box-shadow: none; background: #fafbfd; }
.book-coming .book-cover img { opacity: .5; }
.book-coming .book-card-body h3 { color: #687991; }
.book-feature { background: white; border-color: var(--premium-border); border-radius: 16px; box-shadow: 0 4px 18px #132b5203; }
.book-feature-symbol { background: #f5f8fe; border: 1px solid #e0e7f4; border-radius: 12px; }
.book-feature h2 { font-weight: 650; }
.photo-unit-card.unit-card { border-color: var(--premium-border); border-radius: 18px; box-shadow: 0 4px 16px #132b5204; }
.photo-unit-card .unit-cover { margin: 10px 10px 0; border-radius: 11px; }
.photo-unit-card h3 { font-family: Georgia, "Times New Roman", serif; font-size: 25px; font-weight: 500; letter-spacing: -.025em; }
.dictionary-card { border-color: var(--premium-border); box-shadow: 0 4px 16px #132b5204; }
.book-vocabulary .dictionary-count { background: white; border-color: var(--premium-border); }
.dictionary-word-row h2 { letter-spacing: -.035em; }
.vocab-flashcard-audio { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 9px; }
.vocab-voice-label { color: #405d87; font-size: 12px; margin: 9px 0 4px; }
.pronunciation-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 12px; }
.pronunciation-button, .pronunciation-actions .pronunciation-button, .dialogue-line-actions .pronunciation-button { min-height: 44px; padding: 8px 12px; border: 1px solid #bfd0ed; border-radius: 10px; background: #edf3ff; color: var(--laos-blue); font: inherit; font-size: 13px; font-weight: 650; line-height: 1.5; cursor: pointer; }
.pronunciation-button[data-pronunciation="slow"] { background: white; }
.pronunciation-button:hover { background: #dce8ff; border-color: #829eca; }
.pronunciation-button:focus-visible { outline: 3px solid var(--laos-blue); outline-offset: 3px; }
.pronunciation-button[data-voice-state="playing"] { background: #fff0f2; color: #a50e20; border-color: #e5a5af; }
.lesson-content .can-do-goals-list { display: grid; gap: 14px; list-style: none; padding: 0; }
.can-do-goals-list > .can-do-goal { min-width: 0; margin: 0; padding: 18px; border: 1px solid #d7e1f2; border-radius: 14px; background: #f7f9ff; overflow-wrap: anywhere; }
.can-do-goal-audio { margin-top: 12px; }
.lesson-content .can-do-voice-label { font-size: 13px; }
.writing-examples { min-width: 0; border: 1px solid #d7e1f2; border-radius: 14px; background: white; }
.writing-examples > summary { padding: 14px 16px; color: var(--laos-blue); font-size: 16px; font-weight: 700; cursor: pointer; }
.writing-examples > summary:focus-visible { outline: 3px solid var(--laos-blue); outline-offset: 2px; border-radius: 12px; }
.writing-examples > .vocab-voice-label { margin: 0; padding: 0 16px 14px; font-size: 13px; }
.writing-example-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0 14px 14px; }
.writing-example { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; padding: 14px; border: 1px solid #dce5f4; border-radius: 12px; background: #f6f8fe; overflow-wrap: anywhere; }
.writing-example-number { color: #526b95; font-size: 12px; font-weight: 700; }
.writing-example > strong { color: var(--laos-blue); font-size: 16px; line-height: 1.6; }
.writing-example > p { margin: 0 0 4px; color: #526789; font-size: 14px; line-height: 1.7; }
.writing-example-audio { margin-top: auto; padding-top: 4px; }
@media (max-width: 580px) {
  .writing-example-grid { grid-template-columns: minmax(0, 1fr); }
}
.dictionary-card .dictionary-example-block { margin-top: 18px; padding-top: 16px; border-top: 1px solid #e0e7f2; }
.dictionary-card .dictionary-actions { margin-top: 18px; }
.vocabulary-table .pronunciation-controls { margin-bottom: 4px; }
.listening-audio-panel { margin: 20px 0 26px; padding: 22px; border: 1px solid #bfd0ed; border-left: 4px solid var(--laos-red); border-radius: 16px; background: #f3f7ff; }
.listening-audio-panel h4 { margin: 0 0 6px; color: var(--laos-blue); font-size: 20px; }
.listening-audio-panel .pronunciation-controls { margin-top: 16px; }
.listening-question-audio { margin: 10px 0 20px; }
.listening-mc-question > .listening-question-audio { margin-bottom: 14px; }
.answer-choice {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: white;
}
.answer-choice > .answer-option {
  min-width: 0;
  min-height: 44px;
  align-self: stretch;
  align-items: center;
  border: 0;
  overflow-wrap: anywhere;
}
.answer-choice > .answer-option:is(:hover, :has(input:checked), .is-correct, .is-wrong) {
  background: transparent;
  box-shadow: none;
}
.answer-choice > .answer-option input { flex: 0 0 17px; }
.answer-choice:has(> .answer-option:hover) { border-color: #829eca; }
.answer-choice:has(input:checked) { background: #edf3ff; border-color: #829eca; }
.answer-choice:has(input:focus-visible) { outline: 3px solid var(--laos-blue); outline-offset: 2px; }
.answer-choice:has(> .answer-option.is-correct) { background: #eaf7ef; border-color: #88baa0; }
.answer-choice:has(> .answer-option.is-wrong) { background: #fff1ed; border-color: #d99b92; }
.answer-choice > .option-audio-controls { margin: 0; padding: 8px 12px 8px 0; flex-wrap: nowrap; gap: 6px; }
.option-audio-controls .pronunciation-button { padding: 8px 10px; font-size: 12px; white-space: nowrap; }
@media (max-width: 580px) {
  .answer-choice { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .answer-choice > .option-audio-controls { padding: 0 12px 10px 41px; }
}
.grammar-voice-label { margin: 8px 0 20px; }
.grammar-example-audio { margin: 10px 0 4px; }
.guide-pattern-form .grammar-example-audio { gap: 6px; }
.guide-pattern-example .grammar-example-audio { margin-top: 7px; }
.lesson-content li > .grammar-example-audio { margin-bottom: 18px; }
.pronunciation-actions { align-items: center; }
.pronunciation-actions .pronunciation-controls { margin: 0; }
.pronunciation-actions .pronunciation-record { min-height: 44px; border-radius: 10px; }
.pronunciation-study-panel > .pronunciation-voice-label { font-size: 12px; color: #405d87; }
.dialogue-sentences { display: block; margin-top: 4px; }
.dialogue-sentence { display: block; padding: 9px 10px; margin: 6px 0; border-left: 3px solid transparent; border-radius: 8px; }
.dialogue-sentence + .dialogue-sentence { border-top: 1px solid #dce5f4; }
.dialogue-sentence-text { display: block; }
.dialogue-sentence .pronunciation-controls { gap: 7px; margin-top: 9px; }
.dialogue-sentence.is-sentence-speaking { background: #edf3ff; border-left-color: var(--laos-red); }
.dialogue-coach > .dialogue-voice-label { margin: 14px 0 0; font-size: 12px; }
.vocab-flashcard-audio .vocab-audio-button { min-height: 40px; }
.vocab-flashcard { display: grid; min-height: 390px; }
.vocab-flashcard-face { position: relative; inset: auto; grid-area: 1 / 1; min-width: 0; }
.site-footer { border-top-color: var(--premium-border); font-size: 12px; }
.resume-progress { margin-top: 22px; }
.resume-progress > div { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 10px; color: #697991; margin-bottom: 7px; }
.resume-progress strong { color: var(--laos-blue); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.resume-progress .book-progress { height: 4px; }
.resume-progress p { font-size: 10px; margin: 7px 0 0; color: #77859b; }
@media (max-width: 1090px) and (min-width: 1000px) {
  .dashboard-study-layout { grid-template-columns: minmax(0, 1fr) 258px; }
  .dashboard-v2 .dashboard-resume .learning-hero-copy { padding: 25px; }
  .dashboard-v2 .dashboard-resume h2 { font-size: 37px; }
  .dashboard-today { padding: 19px; }
}
@media (max-width: 999px) and (min-width: 701px) {
  .dashboard-study-layout { grid-template-columns: minmax(0, 1fr); }
  .dashboard-v2 .dashboard-resume { min-height: 350px; grid-template-columns: 1fr 1.05fr; }
  .dashboard-v2 .dashboard-resume .learning-hero-copy { padding: 30px; }
  .dashboard-v2 .dashboard-resume h2 { font-size: 43px; }
  .dashboard-today { padding: 20px 8px 10px; margin: 8px 20px 0; border: 0; border-top: 1px solid #edf0f5; }
  .today-heading h2 { font-size: 20px; }
  .today-heading .eyebrow { display: none; }
  .today-steps { margin-top: 12px; }
  .today-steps a { background: white; border: 0; padding: 10px 0; }
}
@media (max-width: 700px) {
  .dashboard-study-layout { grid-template-columns: minmax(0, 1fr); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; gap: 16px; }
  .site-header { min-height: 88px; padding: 12px 0 8px; }
  .main-nav a[aria-current="page"]::after { bottom: 0; }
  .dashboard-v2 .dashboard-welcome { padding: 24px 0 20px; }
  .dashboard-v2 .dashboard-welcome h1 { font-size: 28px; }
  .dashboard-v2 .dashboard-welcome .muted-copy { font-size: 12px; }
  .dashboard-v2 .dashboard-resume { min-height: 0; border-radius: 22px; background: white; border: 1px solid #e5e9f1; grid-template-columns: 1fr; }
  .dashboard-v2 .dashboard-resume .learning-hero-image { margin: 12px 12px 0; border-radius: 13px; }
  .dashboard-v2 .dashboard-resume .learning-hero-image img { height: 184px; }
  .dashboard-v2 .dashboard-resume .learning-hero-copy { padding: 24px; }
  .dashboard-v2 .dashboard-resume h2 { font-size: 37px; margin-top: 14px; }
  .dashboard-v2 .resume-kicker { margin-bottom: 17px !important; }
  .dashboard-v2 .dashboard-resume .image-caption { left: 10px; bottom: 10px; padding: 5px 8px; }
  .hero-level { width: 20px; height: 20px; font-size: 9px; }
  .dashboard-today { padding: 22px 18px 14px; border-radius: 20px; border: 1px solid #e5e9f1; margin: 0; }
  .today-steps a { border: 0; border-bottom: 1px solid #edf0f5; border-radius: 0; background: white; }
  .dashboard-metrics { margin-bottom: 28px; }
  .dashboard-metric:first-child { padding-left: 10px; }
  .dashboard-metric strong { font-size: 23px; }
  .dashboard-section-heading h2 { font-size: 24px; }
  .dashboard-book { padding: 16px; gap: 14px; }
  .dashboard-book-cover { width: 88px; height: 128px; border-radius: 6px 10px 10px 6px; }
  .dashboard-book-copy h3 { font-size: 25px; }
  .dashboard-book-open { margin: 0; }
  .learning-hero .learning-hero-image { margin: 12px 12px 0; border-radius: 13px; }
  .book-hero .learning-hero-image img { min-height: 0; }
  .resume-progress { margin-top: 22px; }
}
@media (prefers-reduced-motion: reduce) { .button, .unit-card, .daily-plan-steps > a { transition: none; transform: none; } }