:root {
  --ink: #10213f;
  --muted: #586b8d;
  --line: #dce6f5;
  --paper: #ffffff;
  --canvas: #f4f7fc;
  --blue: #3f83f8;
  --blue-dark: #2364d9;
  --blue-soft: #e9f2ff;
  --green: #119d68;
  --green-soft: #e8f8f1;
  --rose: #d94f70;
  --rose-soft: #fff0f4;
  --violet: #7c5bc8;
  --violet-soft: #f2edff;
  --amber: #b66b15;
  --amber-soft: #fff4df;
  --radius: 22px;
  --shadow: 0 14px 42px rgba(35, 73, 126, .09);
}

* { box-sizing: border-box; }

html {
  max-width: 100%;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-width: 0;
  margin: 0;
  color: var(--ink);
  background: var(--canvas);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 18px;
  line-height: 1.58;
  -webkit-font-smoothing: antialiased;
}

img, video, canvas, svg { max-width: 100%; }
pre { max-width: 100%; overflow-x: auto; }
a, p, li, dd, h1, h2, h3, h4 { min-width: 0; overflow-wrap: break-word; word-break: normal; }
a { -webkit-tap-highlight-color: rgba(63, 131, 248, .16); }
a:focus-visible { outline: 3px solid #ffbf47; outline-offset: 3px; border-radius: 8px; }

a { color: var(--blue-dark); text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
a:hover { color: #174aa8; }

h1, h2, h3, h4 { margin: 0; color: #0b1c38; line-height: 1.2; }
h1 { font-size: clamp(2rem, 4vw, 3.35rem); letter-spacing: -.04em; }
h2 { font-size: clamp(1.45rem, 2.5vw, 2rem); letter-spacing: -.025em; }
h3 { font-size: 1.12rem; }
p { margin: .65em 0; }
ul, ol { margin: .65em 0; padding-left: 1.45em; }
li + li { margin-top: .45em; }

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100;
  padding: 10px 14px;
  border-radius: 12px;
  color: white;
  background: var(--ink);
  transform: translateY(-160%);
}
.skip-link:focus { transform: translateY(0); }

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 80px;
  padding: 12px max(22px, calc((100vw - 1540px) / 2));
  border-bottom: 1px solid rgba(214, 226, 243, .9);
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(16px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  min-height: 44px;
  color: var(--ink);
  text-decoration: none;
}
.brand-mark {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  border-radius: 16px;
  color: white;
  background: linear-gradient(140deg, #55a6ff, #326ff0);
  box-shadow: 0 9px 22px rgba(63, 131, 248, .25);
  font-size: .83rem;
  font-weight: 900;
  letter-spacing: .02em;
}
.brand strong, .brand small { display: block; }
.brand strong { font-size: 1.05rem; }
.brand small { color: var(--muted); font-size: .78rem; }
.grade-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 15px;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--ink);
  background: #fff;
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
}
.grade-switch-compact { display: none; }

.topbar-context { display: grid; min-width: 0; max-width: 620px; flex: 1; gap: 1px; margin: 0 clamp(24px, 5vw, 78px); }
.topbar-context small { color: var(--muted); font-size: .68rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.topbar-context strong { overflow: hidden; color: #203858; font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.topbar-actions { display: flex; flex: none; align-items: center; gap: 9px; }
.parent-mode-button { display: inline-flex; min-height: 44px; align-items: center; gap: 7px; padding: 9px 13px; border: 1px solid #cbdcf1; border-radius: 13px; color: #294b75; background: #f8fbff; font: inherit; font-size: .78rem; cursor: pointer; }
.parent-mode-button[aria-pressed="true"] { border-color: #86c9a7; color: #087149; background: #effaf4; }
.parent-mode-button:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }

.shell { display: grid; grid-template-columns: 78px minmax(0, 1fr); max-width: 1540px; min-height: calc(100vh - 80px); margin: 0 auto; transition: grid-template-columns .2s ease; }
body.sidebar-expanded .shell { grid-template-columns: 260px minmax(0, 1fr); }
.shell-landing { display: block; min-height: 100vh; max-width: none; }
.shell-landing .content { width: 100%; max-width: none; padding: 0; }
.sidebar {
  position: sticky;
  top: 80px;
  align-self: start;
  min-height: calc(100vh - 80px);
  padding: 20px 10px 32px;
  border-right: 1px solid var(--line);
  background: #fff;
  overflow: hidden;
}
body.sidebar-expanded .sidebar { padding-inline: 22px; }
.sidebar-toggle { display: flex; width: 100%; min-height: 44px; align-items: center; justify-content: center; gap: 10px; margin: 0 0 14px; padding: 8px; border: 1px solid #d5e1f2; border-radius: 12px; color: #315985; background: #f8fbff; font: inherit; font-size: .76rem; font-weight: 800; cursor: pointer; }
.sidebar-toggle svg { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.sidebar-toggle span { display: none; white-space: nowrap; }
.sidebar-toggle:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
body.sidebar-expanded .sidebar-toggle { justify-content: flex-start; }
body.sidebar-expanded .sidebar-toggle svg { transform: rotate(180deg); }
body.sidebar-expanded .sidebar-toggle span { display: inline; }
.sidebar-note { margin: 0 8px 24px; }
.sidebar-note strong { display: block; color: var(--blue-dark); font-size: 1.25rem; letter-spacing: .14em; }
.sidebar-note span { color: var(--muted); font-size: .76rem; }
.sidebar nav { display: grid; gap: 7px; }
.sidebar nav a,
.mobile-nav a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 10px 13px;
  border-radius: 14px;
  color: #273a5b;
  font-size: .92rem;
  font-weight: 700;
  text-decoration: none;
}
.sidebar nav a { justify-content: center; }
body.sidebar-expanded .sidebar nav a { justify-content: flex-start; }
.sidebar .nav-label-full { display: none; white-space: nowrap; }
body.sidebar-expanded .sidebar .nav-label-full { display: inline; }
.sidebar nav a svg { width: 25px; height: 25px; flex: none; }
.sidebar nav a:hover { background: var(--blue-soft); }
.sidebar nav a.is-active { color: #fff; background: var(--blue); box-shadow: 0 8px 20px rgba(63, 131, 248, .22); }
.nav-label-mobile { display: none; }
.mobile-nav { display: none; }

[data-parent-only][hidden] { display: none !important; }
.topic-status select:disabled { opacity: .82; color: #354b6a; background: #f5f8fc; cursor: default; }
.parent-dialog { width: min(470px, calc(100vw - 28px)); padding: 0; border: 0; border-radius: 22px; color: var(--ink); box-shadow: 0 24px 80px rgba(16,33,63,.28); }
.parent-dialog::backdrop { background: rgba(16,33,63,.62); backdrop-filter: blur(3px); }
.parent-dialog-form { display: grid; gap: 14px; padding: 28px; }
.parent-dialog-form h2, .parent-dialog-form p { margin: 0; }
.parent-dialog-form > p { color: var(--muted); }
.parent-dialog-icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 15px; background: var(--blue-soft); font-size: 1.35rem; }
.parent-dialog-form label { display: grid; gap: 6px; color: #365276; font-size: .8rem; font-weight: 800; }
.parent-dialog-form input { width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid #bdd0e9; border-radius: 12px; color: var(--ink); background: #fff; font: inherit; }
.parent-dialog-form input:focus { outline: 3px solid rgba(63,131,248,.24); border-color: var(--blue); }
.parent-dialog-error { min-height: 1.4em; color: #b1324f !important; font-size: .8rem; font-weight: 750; }
.parent-dialog-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.parent-dialog-actions button { min-height: 46px; border: 1px solid #c8d8eb; border-radius: 12px; color: #2b4a73; background: #fff; font: inherit; font-weight: 800; cursor: pointer; }
.parent-dialog-actions button.primary { border-color: var(--blue); color: #fff; background: var(--blue); }
.parent-dialog-form > small { color: #71829d; font-size: .68rem; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.content { width: 100%; min-width: 0; padding: 44px clamp(24px, 4vw, 68px) 90px; }
.content > *, .panel > *, .lesson-section > *, .attestation-dialog > * { min-width: 0; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; color: var(--muted); font-size: .84rem; }
.breadcrumbs a { color: var(--muted); }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; margin-bottom: 30px; }
.page-heading .lead { max-width: 810px; color: var(--muted); font-size: 1.03rem; }
.eyebrow { margin: 0 0 8px; color: var(--blue-dark); font-size: .76rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.hero-badge { display: grid; min-width: 116px; padding: 15px; place-items: center; border: 1px solid #cfe0fb; border-radius: 19px; background: var(--blue-soft); text-align: center; }
.hero-badge strong { color: var(--blue-dark); font-size: 2rem; line-height: 1; }
.hero-badge span { color: var(--muted); font-size: .72rem; }

.landing {
  min-height: 100vh;
  padding: clamp(28px, 6vw, 82px) clamp(20px, 6vw, 90px);
  background:
    radial-gradient(circle at 10% 10%, rgba(89, 171, 255, .24), transparent 35%),
    radial-gradient(circle at 90% 20%, rgba(139, 97, 209, .17), transparent 31%),
    linear-gradient(150deg, #f8fbff 0%, #eef5ff 100%);
}
.landing-inner { width: min(1120px, 100%); margin: 0 auto; }
.landing-logo { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 65px; color: var(--ink); text-decoration: none; }
.landing h1 { max-width: 870px; }
.landing-lead { max-width: 760px; color: var(--muted); font-size: 1.1rem; }
.grade-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-top: 38px; }
.grade-card { position: relative; overflow: hidden; min-height: 315px; padding: clamp(25px, 4vw, 42px); border: 1px solid rgba(203, 220, 242, .95); border-radius: 30px; color: var(--ink); background: rgba(255,255,255,.94); box-shadow: var(--shadow); text-decoration: none; }
.grade-card::after { content: ''; position: absolute; right: -40px; bottom: -70px; width: 230px; height: 230px; border-radius: 50%; background: var(--blue-soft); }
.grade-card.grade-two::after { background: var(--green-soft); }
.grade-number { position: relative; z-index: 1; display: block; color: var(--blue); font-size: 4.8rem; font-weight: 900; line-height: .9; letter-spacing: -.08em; }
.grade-two .grade-number { color: var(--green); }
.grade-card h2 { position: relative; z-index: 1; margin-top: 14px; font-size: 1.65rem; }
.grade-card p { position: relative; z-index: 1; max-width: 470px; color: var(--muted); }
.grade-card strong { position: absolute; z-index: 1; right: 28px; bottom: 26px; color: var(--blue-dark); }
.grade-two strong { color: #087c52; }
.landing-note { margin-top: 26px; color: var(--muted); font-size: .87rem; }

.hero-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, .7fr);
  gap: 22px;
  margin-bottom: 24px;
}
.hero-copy, .hero-side, .panel, .day-card, .lesson-section, .answer-lesson, .checklist-subject, .schedule-table, .callout {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  box-shadow: var(--shadow);
}
.hero-copy { padding: clamp(28px, 4vw, 48px); background: linear-gradient(145deg, #fff, #f1f7ff); }
.hero-copy h1, .hero-copy h2 { max-width: 760px; }
.hero-copy .lead { color: var(--muted); font-size: 1.08rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.primary-link, .secondary-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 11px 17px;
  border-radius: 14px;
  font-weight: 800;
  text-decoration: none;
}
.primary-link { color: white; background: var(--blue); box-shadow: 0 8px 18px rgba(63, 131, 248, .22); }
.primary-link:hover { color: white; background: var(--blue-dark); }
.secondary-link { border: 1px solid #cbdcf5; color: var(--blue-dark); background: white; }
.hero-side { display: grid; align-content: center; gap: 16px; padding: 26px; }
.hero-stat { display: grid; grid-template-columns: 66px 1fr; align-items: center; gap: 13px; }
.hero-stat strong { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 19px; color: var(--blue-dark); background: var(--blue-soft); font-size: 1.45rem; }
.hero-stat span { color: var(--muted); font-size: .86rem; }

.section-title { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 42px 0 18px; }
.section-title p { max-width: 620px; margin: 0; color: var(--muted); font-size: .9rem; }
.anchor-nav {
  position: sticky;
  top: 92px;
  z-index: 9;
  display: flex;
  gap: 8px;
  margin: 0 0 20px;
  padding: 10px;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 8px 22px rgba(35,73,126,.08);
  scrollbar-width: thin;
}
.anchor-nav a { display: inline-flex; flex: none; align-items: center; min-height: 44px; padding: 8px 12px; border-radius: 11px; background: var(--blue-soft); font-size: .82rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.link-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.link-card { display: grid; grid-template-columns: 56px 1fr auto; gap: 16px; align-items: center; min-height: 124px; padding: 19px; border: 1px solid var(--line); border-radius: 19px; color: var(--ink); background: white; text-decoration: none; }
.link-card > *, .hero-panel > *, .lesson-row > *, .materials-list > *, .video-list > * { min-width: 0; }
.link-card:hover { border-color: #9ec2f8; box-shadow: 0 12px 30px rgba(35, 91, 170, .09); transform: translateY(-1px); }
.link-card .card-icon { display: grid; width: 56px; height: 56px; place-items: center; border-radius: 17px; color: var(--blue-dark); background: var(--blue-soft); font-weight: 900; }
.link-card strong, .link-card small { display: block; }
.link-card small { margin-top: 4px; color: var(--muted); line-height: 1.35; }
.link-arrow { color: var(--blue); font-size: 1.4rem; }

.week-grid { display: grid; grid-template-columns: repeat(5, minmax(155px, 1fr)); gap: 13px; }
.week-link { min-height: 110px; padding: 17px; border: 1px solid var(--line); border-radius: 17px; color: var(--ink); background: white; text-decoration: none; }
.week-link strong, .week-link span { display: block; }
.week-link strong { color: var(--blue-dark); font-size: 1.22rem; }
.week-link span { margin-top: 5px; color: var(--muted); font-size: .78rem; line-height: 1.35; }
.week-link:hover { border-color: #91b9f4; background: var(--blue-soft); }
.week-link.has-holiday { border-color: #efc76f; background: linear-gradient(155deg, #fffdf7, #fff8e8); }
.week-link .week-date { color: #365d8a; font-weight: 750; }
.week-link .week-holiday,
.week-holiday {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 4px 8px;
  border-radius: 999px;
  color: #81520a;
  background: #fff0c6;
  font-size: .69rem;
  font-weight: 850;
  line-height: 1.25;
}
.calendar-break-card {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 86px;
  padding: 17px 20px;
  border: 1px solid #d7c1f5;
  border-radius: 18px;
  background: linear-gradient(120deg, #fbf7ff, #f2eaff);
  box-shadow: 0 8px 22px rgba(94, 52, 151, .07);
}
.calendar-break-icon { display: grid; flex: none; width: 48px; height: 48px; place-items: center; border-radius: 15px; background: #e8d8ff; font-size: 1.45rem; }
.calendar-break-card strong,
.calendar-break-card small { display: block; }
.calendar-break-card strong { color: #503176; font-size: 1rem; }
.calendar-break-card small { margin-top: 4px; color: #765f93; font-size: .8rem; }

.panel { padding: clamp(22px, 3.2vw, 34px); }
.panel + .panel, .callout + .panel { margin-top: 20px; }
.panel h2 + p { color: var(--muted); }
.callout { padding: 22px 25px; }
.callout-blue { border-color: #bed8fb; background: var(--blue-soft); }
.callout-green { border-color: #bae7d3; background: var(--green-soft); }
.callout-amber { border-color: #f2d49a; background: var(--amber-soft); }
.callout h2, .callout h3 { margin-bottom: 6px; }

.fixed-schedule { display: grid; grid-template-columns: repeat(5, minmax(170px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 5px; }
.fixed-day { min-width: 170px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.fixed-day h3 { margin-bottom: 12px; }
.fixed-day ol { padding-left: 1.2em; font-size: .83rem; }
.fixed-day li span { display: block; color: var(--muted); font-size: .75rem; }

.vacation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.vacation-card { padding: 18px; border: 1px solid #b9d8f7; border-radius: 16px; background: #ecf7ff; }
.vacation-card strong, .vacation-card span { display: block; }
.vacation-card span { margin-top: 3px; color: var(--muted); font-size: .83rem; }

.topic-subject { margin-top: 34px; scroll-margin-top: 100px; }
.topic-subject > header { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.subject-chip { display: grid; width: 45px; height: 45px; place-items: center; border-radius: 14px; color: white; background: var(--blue); font-weight: 900; }
.topic-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; counter-reset: topic; }
.topic-card { position: relative; min-height: 102px; padding: 17px 18px 17px 58px; border: 1px solid var(--line); border-radius: 17px; background: white; }
.topic-card::before { counter-increment: topic; content: counter(topic); position: absolute; top: 17px; left: 16px; display: grid; width: 30px; height: 30px; place-items: center; border-radius: 10px; color: var(--blue-dark); background: var(--blue-soft); font-size: .75rem; font-weight: 900; }
.topic-card strong, .topic-card h3 { display: block; }
.topic-card h3 { font-size: 1rem; }
.topic-card span { display: block; margin-top: 4px; color: var(--muted); font-size: .78rem; }
.video-dot { display: inline-flex !important; width: max-content; margin-top: 8px !important; padding: 3px 8px; border-radius: 999px; color: #7a5304 !important; background: #fff0c3; font-size: .68rem !important; font-weight: 800; }

.subject-jump {
  position: sticky;
  top: 92px;
  z-index: 8;
  display: flex;
  gap: 8px;
  margin-bottom: 24px;
  padding: 10px;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 8px 22px rgba(35,73,126,.08);
}
.subject-jump a { flex: none; min-height: 44px; padding: 9px 12px; border-radius: 11px; background: var(--blue-soft); font-size: .86rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.subject-jump a[aria-current="location"] { color: #fff; background: var(--blue); box-shadow: 0 6px 16px rgba(60,130,246,.28); }
.subject-jump a:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.topic-filter-panel {
  margin-bottom: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(35,73,126,.06);
}
.topic-filter-panel h2 { margin: 0 0 12px; font-size: 1rem; }
.topic-filter-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.topic-filter-button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #bdcce0;
  border-radius: 12px;
  color: #29476d;
  background: #fff;
  font: inherit;
  font-size: .86rem;
  font-weight: 800;
  cursor: pointer;
}
.topic-filter-button b { display: grid; min-width: 25px; min-height: 25px; padding: 2px 6px; place-items: center; border-radius: 999px; color: #385a86; background: var(--blue-soft); font-size: .74rem; }
.topic-filter-button:hover { border-color: var(--blue); }
.topic-filter-button[aria-pressed="true"] { border-color: var(--blue); color: #fff; background: var(--blue); box-shadow: 0 5px 14px rgba(60,130,246,.22); }
.topic-filter-button[aria-pressed="true"] b { color: var(--blue-dark); background: #fff; }
.topic-filter-button:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.topic-filter-summary { margin: 10px 0 0; color: var(--muted); font-size: .82rem; }
.topic-filter-empty { margin: 24px 0; padding: 24px; border: 1px dashed #b8c8dc; border-radius: 16px; color: var(--muted); background: #fff; text-align: center; }
[data-topic-filter-scope] [hidden], .subject-jump a[hidden] { display: none !important; }
.topic-subject-simple { margin-top: 24px; padding: clamp(20px, 3vw, 32px); scroll-margin-top: 170px; border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: var(--shadow); }
.topic-subject-simple > h2 { padding-bottom: 14px; border-bottom: 2px solid var(--blue-soft); }
.topic-group { margin-top: 24px; }
.topic-group h3 { margin-bottom: 10px; color: #264e87; }
.topic-master-list { margin: 0; padding: 0; list-style: none; counter-reset: exact-topic; }
.topic-row {
  counter-increment: exact-topic;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-height: 62px;
  margin: 0;
  padding: 9px 10px;
  border-top: 1px solid #e7edf6;
  border-radius: 12px;
  transition: background-color .15s ease, border-color .15s ease;
}
.topic-row:first-child { border-top-color: transparent; }
.topic-index::before { content: counter(exact-topic); display: grid; width: 32px; height: 32px; place-items: center; border-radius: 10px; color: var(--blue-dark); background: var(--blue-soft); font-size: .75rem; font-weight: 900; }
.topic-row-main { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 7px 9px; }
.topic-row-main a { min-width: 0; color: var(--ink); font-weight: 650; text-decoration: none; }
.topic-row-main a:hover { color: var(--blue-dark); text-decoration: underline; }
.lesson-video-indicator {
  display: inline-flex;
  min-height: 28px;
  flex: none;
  align-items: center;
  gap: 4px;
  padding: 3px 8px 3px 5px;
  border: 1px solid #f1c3bd;
  border-radius: 999px;
  color: #bd3e35;
  background: #fff2ef;
  font-size: .7rem;
  font-weight: 850;
  line-height: 1;
}
.lesson-video-indicator svg { width: 20px; height: 20px; flex: none; }
.lesson-video-indicator b { font: inherit; }
.topic-status { position: relative; z-index: 2; display: inline-flex; max-width: 100%; }
.topic-status select {
  min-height: 44px;
  max-width: 100%;
  padding: 8px 34px 8px 11px;
  border: 1px solid #bdcce0;
  border-radius: 12px;
  color: #344a69;
  background: #fff;
  font: inherit;
  font-size: .82rem;
  font-weight: 750;
}
.topic-status select:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
[data-topic-card].status-done { border-color: #9dd8bc; background: var(--green-soft); }
[data-topic-card].status-done .topic-index::before { color: #fff; background: var(--green); }
[data-topic-card].status-done .topic-status select { border-color: #86cbaa; color: #087149; background: #f5fffa; }
[data-topic-card].status-later { border-color: #efcb86; background: var(--amber-soft); }
[data-topic-card].status-later .topic-index::before { color: #fff; background: var(--amber); }
[data-topic-card].status-later .topic-status select { border-color: #dfb766; color: #83500d; background: #fffcf4; }

.days-stack { display: grid; gap: 18px; }
.day-card { overflow: hidden; break-inside: avoid; }
.day-head { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 18px 22px; color: white; background: linear-gradient(125deg, #458cf7, #3977e4); }
.day-head h2 { color: white; }
.day-head span { font-size: .8rem; opacity: .9; }
.lesson-row { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 19px 22px; border-top: 1px solid var(--line); }
.lesson-row:first-child { border-top: 0; }
.lesson-time { color: var(--muted); font-size: .78rem; font-weight: 800; }
.lesson-main strong, .lesson-main h3, .lesson-main small { display: block; }
.lesson-main strong, .lesson-main h3 { font-size: 1rem; }
.lesson-subject-line { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 9px; }
.lesson-subject-line h3 { margin: 0; }
.lesson-main small { margin-top: 3px; color: var(--muted); font-size: .79rem; }
.lesson-main p { margin: 8px 0 0; font-size: .88rem; }
.lesson-topic-link { display: inline-block; margin-top: 3px; color: var(--ink); font-weight: 650; text-decoration: none; }
.lesson-topic-link:hover { color: var(--blue-dark); text-decoration: underline; }
.lesson-topic-items { display: grid; gap: 7px; margin-top: 8px; }
.lesson-topic-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 9px; border: 1px solid #e2eaf5; border-radius: 13px; background: #fbfdff; }
.lesson-topic-item .lesson-topic-link { margin: 0; }
.lesson-open { white-space: nowrap; font-size: .84rem; font-weight: 800; }
.lesson-marks { grid-column: 2 / -1; margin-top: 1px; }
.lesson-marks ul { display: flex; flex-wrap: wrap; gap: 7px 16px; margin: 0; padding: 0; list-style: none; color: var(--muted); font-size: .72rem; }
.movement-row { padding: 13px 22px; border-top: 1px dashed #cbd8eb; color: var(--muted); background: #f8fbff; font-size: .78rem; }
.optional-label { display: inline-flex; margin-left: 7px; padding: 2px 7px; border-radius: 999px; color: #8a5608; background: #fff0cd; font-size: .67rem; }
.week-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 24px; }
.week-nav a { padding: 17px; border: 1px solid var(--line); border-radius: 15px; background: white; text-decoration: none; font-weight: 750; }
.week-nav a:last-child { text-align: right; }
.lesson-hero { position: relative; overflow: hidden; margin-bottom: 22px; padding: clamp(26px, 4vw, 45px); border: 1px solid #c7dcf9; border-radius: 27px; background: linear-gradient(140deg, #eaf4ff, #f9fcff); }
.lesson-hero::after { content: ''; position: absolute; right: -70px; bottom: -110px; width: 270px; height: 270px; border-radius: 50%; background: rgba(63,131,248,.09); }
.lesson-meta { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 15px; }
.lesson-meta span { padding: 5px 10px; border: 1px solid #c6daf7; border-radius: 999px; color: #3e5f8e; background: rgba(255,255,255,.7); font-size: .72rem; font-weight: 800; }
.lesson-meta .lesson-video-indicator { display: inline-flex; padding: 4px 9px 4px 6px; border-color: #f1c3bd; color: #bd3e35; background: #fff2ef; }
.lesson-hero h1 { position: relative; z-index: 1; max-width: 900px; }
.lesson-hero > .topic-status { margin-top: 20px; }
.combined-topic-summary { position: relative; z-index: 1; display: grid; gap: 7px; max-width: 900px; margin-top: 18px; }
.combined-topic-summary span { padding: 10px 13px; border: 1px solid #c9dcf6; border-radius: 12px; background: rgba(255,255,255,.76); font-weight: 650; }
.lesson-hero.status-done { border-color: #91d3b4; background: linear-gradient(140deg, #e9f9f1, #fbfffd); }
.lesson-hero.status-later { border-color: #efc978; background: linear-gradient(140deg, #fff4df, #fffdf9); }
.lesson-goal { position: relative; z-index: 1; max-width: 900px; color: #405879; }
.lesson-section { margin-top: 18px; padding: clamp(22px, 3.5vw, 36px); break-inside: avoid; }
.lesson-section > header { display: grid; grid-template-columns: 46px 1fr; gap: 13px; align-items: start; margin-bottom: 18px; }
.lesson-section > header > span { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 14px; color: var(--blue-dark); background: var(--blue-soft); font-weight: 900; }
.lesson-section > header p { margin: 4px 0 0; color: var(--muted); font-size: .8rem; }
.lesson-section > .simple-section-heading { display: block; margin-bottom: 18px; }
.lesson-section .body-copy > p { max-width: 920px; }
.material-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.material-toolbar h2, .material-toolbar h3 { margin: 0; }
.material-toolbar h3 { color: #264e87; }
.speech-controls { display: inline-flex; max-width: min(100%, 540px); flex: 0 1 auto; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.speech-toggle, .speech-stop { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 7px; padding: 8px 13px; border: 1px solid #b9cff0; border-radius: 12px; color: #175ebd; background: #f3f8ff; font: inherit; font-size: .79rem; cursor: pointer; }
.speech-toggle { flex: 1 1 155px; }
.speech-toggle b, .speech-stop b { font-weight: 850; }
.speech-toggle:hover, .speech-stop:hover { border-color: var(--blue); background: #e9f3ff; }
.speech-toggle[aria-pressed="true"] { border-color: #3479df; color: white; background: #3479df; }
.speech-stop { color: #8c3340; border-color: #ebc9cf; background: #fff6f7; }
.speech-toggle:focus-visible, .speech-stop:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.speech-toggle:disabled { color: #73839a; border-color: #d6dfeb; background: #f3f5f8; cursor: not-allowed; }
.speech-stop[hidden] { display: none; }
.speech-voice { display: inline-flex; min-width: 0; flex: 0 1 175px; }
.speech-voice[hidden] { display: none; }
.speech-voice select { width: 100%; min-height: 42px; padding: 7px 31px 7px 10px; overflow: hidden; border: 1px solid #c8d8eb; border-radius: 12px; color: #315579; background: #fff; font: inherit; font-size: .75rem; font-weight: 750; text-overflow: ellipsis; cursor: pointer; }
.speech-voice select:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.speech-disclosure, .speech-status { flex: 1 1 100%; color: #6b7e98; font-size: .66rem; line-height: 1.25; text-align: right; }
.speech-status { color: #315579; font-weight: 750; }
.speech-status:empty { display: none; }
.material-points { display: grid; max-width: 960px; gap: 12px; }
.material-point { padding: 16px 18px; border: 1px solid #d4e2f3; border-left: 5px solid #78aaf0; border-radius: 14px; background: #fbfdff; }
.material-point:nth-child(3) { border-left-color: #3f83f8; background: #f6faff; }
.material-point:nth-child(4) { border-left-color: #e1a13a; background: #fffaf1; }
.material-point:nth-child(5) { border-left-color: #38a878; background: #f5fcf8; }
.material-point-label { display: inline-flex; margin-bottom: 7px; color: #315d91; font-size: .72rem; font-weight: 900; letter-spacing: .045em; text-transform: uppercase; }
.material-point p { margin: 0; }
.material-point p > strong { display: block; margin-bottom: 5px; color: #102748; font-size: 1.02rem; line-height: 1.48; }
.material-point p > span { color: #334f72; }
.material-inline-example { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; margin-top: 11px !important; padding: 11px 13px; border: 1px solid #bfd5f0; border-radius: 11px; background: #eef6ff; }
.material-inline-example b { color: #145eae; }
.lesson-section > .topic-part-heading { display: flex; grid-template-columns: none; justify-content: space-between; gap: 18px; align-items: center; padding-bottom: 16px; border-bottom: 2px solid var(--blue-soft); }
.topic-part-heading h2 { max-width: 760px; }
.topic-part-block + .topic-part-block { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.topic-part-block > h3 { margin-bottom: 14px; color: #264e87; }
.exercise-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.exercise-toolbar h2, .exercise-toolbar h3 { margin: 0; color: #264e87; }
.print-exercises-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 8px; padding: 9px 14px; border: 1px solid #b9cff0; border-radius: 12px; color: #185ebf; background: #f4f8ff; font: inherit; font-size: .82rem; font-weight: 800; cursor: pointer; }
.print-exercises-button:hover { border-color: var(--blue); background: #eaf3ff; }
.print-exercises-button:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.print-exercise-title { display: none; }
.exercise-print-root { display: none; }
.lesson-section > header.print-exercise-title { display: none; }
.topic-part.status-done { border-color: #91d3b4; background: linear-gradient(140deg, #f0fbf6, #fff); }
.topic-part.status-later { border-color: #efc978; background: linear-gradient(140deg, #fff8eb, #fff); }
.recall-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.recall-list li { padding: 8px 11px; border: 1px solid #d7e3f4; border-radius: 12px; background: #f8fbff; font-size: .85rem; }

.lesson-visual { margin: 22px 0 0; padding: 18px; border-radius: 17px; background: #f6f9fe; text-align: center; }
.lesson-visual figcaption { margin-top: 10px; color: var(--muted); font-size: .77rem; }
.lesson-visual svg { display: block; width: min(520px, 100%); max-height: 180px; margin: 0 auto; }
.addition-facts-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.addition-facts-grid span { padding: 10px 12px; border: 1px solid #bdd4f2; border-radius: 10px; color: #173657; background: #fff; font-weight: 800; text-align: center; }
.lesson-visual svg line, .lesson-visual svg path, .lesson-visual svg circle, .lesson-visual svg ellipse { fill: none; stroke: #4b83d6; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.lesson-visual svg text { fill: #315d9e; stroke: none; font-size: 18px; font-weight: 800; text-anchor: middle; }
.visual-words > div, .project-steps, .letter-cards, .timeline { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; }
.visual-words span, .project-steps span, .letter-cards span { padding: 11px 15px; border: 1px solid #c8dcef; border-radius: 12px; color: #285c9f; background: white; font-weight: 900; }
.letter-cards span { min-width: 70px; font-size: 1.4rem; }
.timeline i { width: 65px; height: 3px; background: #d08a35; }
.timeline b { padding: 10px 14px; border-radius: 12px; color: #7b4608; background: #ffe8c2; }

.example-grid { display: grid; gap: 14px; }
.example-card { position: relative; padding: 22px 22px 22px 68px; border: 1px solid #d8e4f5; border-radius: 17px; background: #fbfdff; }
.number-chip { position: absolute; top: 20px; left: 18px; display: grid; width: 34px; height: 34px; place-items: center; border-radius: 11px; color: white; background: var(--blue); font-weight: 900; }
.example-card h3 { margin-bottom: 8px; }
.example-prompt { color: #314767; font-weight: 700; }
.example-card ol { color: #334967; }
.example-answer { margin-top: 12px; padding-top: 10px; border-top: 1px dashed #cbd7e8; color: #17583f; }
.example-answer > summary { font-weight: 850; cursor: pointer; }
.example-answer > p { margin-bottom: 0; }

.practice-stack { display: grid; gap: 13px; }
.homework-choice-note { margin: 0; padding: 12px 14px; border: 1px solid #b8d8c9; border-radius: 12px; color: #27644d; background: #f0faf5; }
.task-level { padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: #fbfdff; }
.task-level h3 { margin-bottom: 9px; }
.task-level.basic { border-left: 5px solid var(--blue); }
.task-level.standard { border-left: 5px solid var(--violet); }
.task-level.optional { border-left: 5px solid #e3a23b; background: #fffdf8; }
.task-level.writing { border-left: 5px solid var(--rose); background: #fffafb; }
.task-level blockquote { margin: 13px 0 0; padding: 16px 18px; border: 0; border-radius: 14px; background: white; box-shadow: inset 0 0 0 1px #eadce1; white-space: pre-line; }
.task-instruction { color: var(--muted); }
.oral-list { padding-left: 1.6em; }
.oral-list li { padding: 6px 0; }

.materials-list, .video-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.materials-list article, .video-list article { padding: 18px; border: 1px solid var(--line); border-radius: 15px; background: #fbfdff; }
.materials-list p, .video-list p { color: var(--muted); font-size: .82rem; }
.materials-list h3, .video-list h3 { font-size: 1rem; }
.pages-line { padding-top: 9px; border-top: 1px dashed #cbd6e7; }
.video-platform { display: inline-flex; margin-bottom: 9px; padding: 3px 8px; border-radius: 999px; color: var(--blue-dark); background: var(--blue-soft); font-size: .68rem; font-weight: 900; }
.video-list a { font-size: .86rem; font-weight: 800; }
.video-list a, .materials-list a { display: inline-flex; align-items: center; min-height: 44px; }
.video-open-link { width: fit-content; gap: 9px; padding: 6px 10px 6px 7px; border: 1px solid #c9d9ef; border-radius: 12px; background: white; text-decoration: none; }
.video-open-link:hover { border-color: var(--blue); background: #f3f8ff; }
.video-open-link:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.video-open-link b { font-size: .9em; }
.video-logo { display: inline-grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; overflow: hidden; border-radius: 9px; }
.video-logo svg { display: block; width: 24px; height: 24px; }
.video-logo-youtube { background: #fff0f0; }
.video-logo-youtube rect { fill: #ff0033; }
.video-logo-youtube path { fill: white; }
.video-logo-rutube { background: #111; }
.video-logo-rutube rect { fill: #111; }
.video-logo-rutube path { fill: none; stroke: white; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.video-logo-rutube .rutube-accent { stroke: #ff2c9c; stroke-width: 2.4; }
.video-logo-vk { background: #eef6ff; }
.video-logo-vk rect { fill: #2787f5; }
.video-logo-vk path { fill: white; }
.video-logo-sotvorchestvo { background: #eef7ff; }
.video-logo-sotvorchestvo circle:first-child { fill: #ff8500; }
.video-logo-sotvorchestvo path { fill: white; }
.video-logo-sotvorchestvo .sotvorchestvo-accent { fill: #38a7f0; }
.video-logo-default { background: var(--blue-soft); }
.video-logo-default rect { fill: #4388ef; }
.video-logo-default path { fill: white; }
.resources-compact { padding-block: clamp(15px, 2vw, 20px); }
.resources-compact > header { margin-bottom: 9px; }
.resources-compact > header h2 { color: #314e73; font-size: 1.12rem; letter-spacing: -.01em; }
.compact-resource-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.compact-resource-groups > div > h3 { margin: 0 0 7px; color: #526b8d; font-size: .76rem; letter-spacing: .035em; text-transform: uppercase; }
.compact-resource-list { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; padding: 0; list-style: none; }
.compact-resource-list li { min-width: 0; border-top: 1px solid #e1e9f4; }
.compact-resource-list li:last-child { border-bottom: 1px solid #e1e9f4; }
.compact-resource-list li > a, .compact-resource-list li > div { display: grid; width: 100%; min-height: 44px; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 8px 4px; color: var(--ink); background: transparent; text-decoration: none; }
.compact-resource-list li > a:hover { color: var(--blue-dark); background: #f7faff; }
.compact-resource-list li > a:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.compact-resource-list strong, .compact-resource-list small { display: block; min-width: 0; }
.compact-resource-list strong { font-size: .84rem; line-height: 1.3; }
.compact-resource-list small { margin-bottom: 2px; color: #66809f; font-size: .68rem; font-weight: 800; }
.compact-resource-list li > a > b, .compact-resource-list li > div > b { color: var(--blue); }
.compact-resource-list .video-open-link { border: 0; border-radius: 0; }
.compact-resource-list .video-logo, .compact-resource-icon { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 8px; }
.compact-resource-list .video-logo { flex-basis: 26px; }
.compact-resource-icon { color: #2b67b2; background: #eaf3ff; }
.compact-resource-icon svg { width: 18px; height: 18px; }
.muted { color: var(--muted); }

.tutor-sheet { display: grid; gap: 18px; margin-top: 8px; }
.tutor-sheet p { margin: 0; }
.tutor-sheet strong { display: block; margin-bottom: 9px; }
.tutor-sheet span { display: block; min-height: 34px; color: #536989; border-bottom: 2px solid #9bb4d6; letter-spacing: .08em; }

.subject-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 18px 0 0; }
.subject-facts div { padding: 15px; border: 1px solid var(--line); border-radius: 14px; background: #fafcff; }
.subject-facts dt { color: var(--blue-dark); font-size: .72rem; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.subject-facts dd { margin: 4px 0 0; }

.print-checks, .master-checklist { margin: 0; padding: 0; list-style: none; }
.print-checks { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.print-checks li { color: #314664; font-size: .85rem; }
.print-checks li span, .master-checklist li span { margin-right: 8px; color: var(--blue-dark); font-size: 1.15em; }
.master-checklist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 20px; }
.master-checklist li { break-inside: avoid; padding: 8px 0; border-bottom: 1px solid #ebf0f7; }

.checklist-subject { margin-top: 22px; padding: clamp(22px, 3vw, 34px); }
.checklist-subject > h2 { padding-bottom: 13px; border-bottom: 2px solid var(--blue-soft); }
.checklist-subject article { margin-top: 25px; }
.checklist-subject article h3 { margin-bottom: 11px; color: #264e87; }

.answer-warning { margin-bottom: 20px; padding: 18px 22px; border: 1px solid #f0d499; border-radius: 16px; color: #68450d; background: #fff7e6; }
.answer-lesson { margin-top: 16px; padding: 22px; break-inside: avoid; }
.answer-lesson > header { padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.answer-lesson > header p { margin: 4px 0 0; color: var(--muted); font-size: .78rem; }
.answer-day { margin-top: 28px; scroll-margin-top: 170px; }
.answer-day > h2 { padding: 0 2px 10px; border-bottom: 2px solid var(--blue-soft); }
.answer-fields { display: grid; gap: 10px; margin-top: 12px; }
.answer-fields section { padding: 13px 15px; border-radius: 12px; background: #f8fbff; }
.answer-fields h4 { color: #315c95; font-size: .78rem; text-transform: none; }
.answer-fields p { margin: 5px 0; }

.books-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.book-card { padding: 21px; border: 1px solid var(--line); border-radius: 17px; background: white; }
.book-card .book-subject { display: inline-flex; margin-bottom: 9px; padding: 3px 8px; border-radius: 999px; color: var(--blue-dark); background: var(--blue-soft); font-size: .69rem; font-weight: 900; }
.book-card p { color: var(--muted); font-size: .84rem; }

.attestation-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; counter-reset: attestation; }
.attestation-steps article { position: relative; padding: 56px 20px 20px; border: 1px solid var(--line); border-radius: 17px; background: white; }
.attestation-steps article::before { counter-increment: attestation; content: counter(attestation); position: absolute; top: 17px; left: 18px; display: grid; width: 29px; height: 29px; place-items: center; border-radius: 9px; color: white; background: var(--blue); font-weight: 900; }
.attestation-steps p { color: var(--muted); font-size: .84rem; }
.attestation-list { margin: 0; padding: clamp(20px, 3vw, 32px); list-style: none; border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: var(--shadow); }
.attestation-list li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; padding: 10px 0; border-bottom: 1px solid #e7edf6; }
.attestation-list li:last-child { border-bottom: 0; }
.attestation-list li span { color: var(--blue-dark); font-size: 1.2em; }
.achievements-panel { margin-top: 28px; padding: clamp(22px,3vw,34px); border-color: #a8dcc3; background: linear-gradient(135deg,#effaf4 0%,#fff 58%,#edf5ff 100%); }
.achievements-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.achievements-heading h2 { margin: 2px 0 8px; }
.achievements-heading p:last-child { max-width: 720px; margin: 0; color: var(--muted); }
.achievements-star { display: grid; width: 58px; height: 58px; flex: none; place-items: center; border-radius: 18px; background: #fff3c4; box-shadow: 0 8px 22px rgba(142,99,0,.12); font-size: 1.75rem; }
.achievements-overview { display: grid; grid-template-columns: auto minmax(240px,1fr); gap: 22px; align-items: center; margin: 24px 0; }
.achievement-percent { display: grid; min-width: 116px; min-height: 92px; place-content: center; padding: 14px 18px; border: 1px solid #96d5b7; border-radius: 20px; color: #075d3c; background: #fff; text-align: center; }
.achievement-percent strong { font-size: clamp(1.65rem,4vw,2.35rem); line-height: 1; }
.achievement-percent span { margin-top: 6px; color: var(--muted); font-size: .76rem; font-weight: 800; }
.achievement-main-progress > span { display: block; height: 15px; overflow: hidden; border-radius: 999px; background: #dce6f1; box-shadow: inset 0 0 0 1px rgba(36,91,74,.07); }
.achievement-main-progress > span i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#087149,#21ad6f); transition: width .25s ease; }
.achievement-main-progress p { margin: 10px 0 0; color: var(--muted); }
.achievement-main-progress b { color: #075d3c; }
.achievement-badges { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.achievement-badge { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 11px; align-items: center; min-width: 0; padding: 13px; border: 1px solid #d6e0ec; border-radius: 16px; color: #657387; background: rgba(255,255,255,.62); filter: grayscale(.75); opacity: .72; }
.achievement-badge > span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; background: #e9eef5; font-size: 1.35rem; }
.achievement-badge strong,.achievement-badge small { display: block; }
.achievement-badge strong { overflow-wrap: anywhere; font-size: .9rem; }
.achievement-badge small { margin-top: 3px; color: inherit; font-size: .75rem; }
.achievement-badge.is-unlocked { border-color: #83ceaa; color: #075d3c; background: #fff; filter: none; opacity: 1; box-shadow: 0 8px 22px rgba(13,146,87,.1); }
.achievement-badge.is-unlocked > span { background: #dff9ec; }
.home-weeks { margin-top: 34px; }
.home-weeks h2 { margin-bottom: 16px; }

/* Self-contained lesson diagrams. They are deliberately local and printable. */
.study-visual {
  margin: 24px 0 2px;
  padding: clamp(16px, 2.5vw, 24px);
  overflow: hidden;
  border: 1px solid #cfe0f5;
  border-radius: 18px;
  background: linear-gradient(145deg, #f8fbff, #eef6ff);
  break-inside: avoid;
}
.study-visual svg, .study-main-image { display: block; width: 100%; height: auto; max-height: 520px; object-fit: contain; }
.study-visual svg path, .study-visual svg rect, .study-visual svg circle, .study-visual svg ellipse { vector-effect: non-scaling-stroke; }
.study-visual figcaption { margin-top: 14px; color: #49627f; font-size: .9rem; line-height: 1.55; }
.study-visual figcaption a { font-weight: 750; }
.multiplication-table-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 10px 18px; margin-bottom: 14px; }
.multiplication-table-heading strong { color: #12345f; font-size: 1.08rem; }
.multiplication-table-heading span { color: #536b89; font-size: .82rem; }
.multiplication-table-wrap { width: 100%; overflow-x: auto; border: 1px solid #9fc0e6; border-radius: 14px; background: #fff; scrollbar-color: #8fb7e8 #eef5fd; touch-action: pan-x; }
.multiplication-table { width: 100%; min-width: 620px; border-collapse: separate; border-spacing: 0; table-layout: fixed; color: #122b4b; background: #fff; font-variant-numeric: tabular-nums; }
.multiplication-table.is-compact { min-width: 560px; }
.multiplication-table th, .multiplication-table td { height: 46px; padding: 7px 4px; border-right: 1px solid #c5d8ed; border-bottom: 1px solid #c5d8ed; text-align: center; }
.multiplication-table tr > :last-child { border-right: 0; }
.multiplication-table tbody tr:last-child > * { border-bottom: 0; }
.multiplication-table thead th { color: #fff; background: #3c82f6; font-weight: 900; }
.multiplication-table thead th:first-child { position: sticky; left: 0; z-index: 3; background: #245eb7; }
.multiplication-table tbody th { position: sticky; left: 0; z-index: 2; color: #174f98; background: #e8f2ff; font-weight: 900; }
.multiplication-table td { font-size: .94rem; font-weight: 750; }
.multiplication-table tbody tr:nth-child(even) td { background: #f6faff; }
.multiplication-table td.is-square { color: #075d3c; background: #dcf6ea !important; font-weight: 900; }
.multiplication-table-guide { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 14px 0 0; }
.multiplication-table-guide span, .multiplication-table-guide strong { display: grid; min-width: 42px; min-height: 42px; padding: 6px; place-items: center; border-radius: 11px; }
.multiplication-table-guide span { border: 1px solid #b9d1ed; background: #fff; }
.multiplication-table-guide strong { color: #075d3c; background: #dcf6ea; }
.multiplication-table-guide b { color: #315d91; }
.study-chips { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: 10px; }
.study-chips span {
  display: grid; min-height: 54px; padding: 10px 15px; place-items: center;
  border: 1px solid #bcd3ee; border-radius: 13px; background: #fff; font-weight: 750; text-align: center;
}
.study-chips.flow-chips span { position: relative; flex: 1 1 150px; }
.study-chips.flow-chips span:not(:last-child)::after { content: '→'; position: absolute; right: -11px; top: 50%; z-index: 1; color: var(--blue); transform: translate(50%,-50%); }
.visual-equation { margin: 17px 0 0; font-size: clamp(1.05rem, 2.5vw, 1.35rem); font-weight: 850; text-align: center; }
.visual-legend { margin-top: 12px; text-align: center; }
.fraction-board, .geometry-board, .mini-chart, .illustrated-text-card {
  display: grid; grid-template-columns: minmax(160px, .7fr) minmax(240px, 1.3fr); align-items: center; gap: 22px;
}
.fraction-number { display: grid; width: 78px; margin: 0 auto; place-items: center; font-size: 2rem; font-weight: 900; }
.fraction-number i { display: block; width: 70px; height: 3px; background: #163a66; }
.fraction-strip { display: grid; grid-template-columns: repeat(4, 1fr); min-height: 70px; overflow: hidden; border: 3px solid #315d91; border-radius: 10px; }
.fraction-strip > * { border-right: 2px solid #315d91; background: #62a6f8; }
.fraction-strip > i { border-right: 0; background: #fff; }
.fraction-board dl { grid-column: 1 / -1; display: grid; gap: 8px; margin: 0; }
.fraction-board dl div { display: grid; grid-template-columns: 44px 1fr; gap: 10px; }
.fraction-board dt { font-weight: 900; }
.fraction-board dd { margin: 0; }
.geometry-board > div { display: grid; gap: 5px; }
.geometry-board > div span { margin-bottom: 8px; color: var(--muted); }
.place-value-table, .mini-chart table { width: 100%; border-collapse: collapse; background: #fff; }
.place-value-table th, .place-value-table td, .mini-chart th, .mini-chart td { padding: 10px; border: 1px solid #a9c6e7; text-align: center; }
.place-value-table td { font-size: 1.65rem; font-weight: 900; }
.place-value-classes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.place-value-class { overflow: hidden; border: 1px solid #9fc0e6; border-radius: 14px; background: #fff; }
.place-value-class h4 { margin: 0; padding: 9px 12px; color: #174f98; background: #eaf3ff; font-size: .83rem; text-align: center; }
.place-value-labels, .place-value-digits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.place-value-labels span { padding: 7px 3px; border-bottom: 1px solid #c4d7ee; color: #536b89; font-size: .66rem; text-align: center; }
.place-value-labels span + span, .place-value-digits b + b { border-left: 1px solid #c4d7ee; }
.place-value-digits b { padding: 10px 4px; color: #10243f; font-size: 1.45rem; text-align: center; }
.study-visual-placevalue .visual-equation { display: grid; gap: 6px; }
.study-visual-placevalue .visual-equation span { color: #405d80; font-size: .82rem; font-weight: 650; }
.mini-chart .bars { display: flex; min-height: 160px; align-items: end; justify-content: center; gap: 18px; }
.mini-chart .bars i { display: grid; width: 44px; height: var(--h); min-height: 35px; place-items: start center; padding-top: 6px; border-radius: 8px 8px 0 0; color: #fff; background: var(--blue); font-style: normal; font-weight: 850; }
.formula-triangle { display: grid; width: 190px; margin: 0 auto 18px; place-items: center; clip-path: polygon(50% 0,100% 100%,0 100%); background: #dcecff; }
.formula-triangle > b { padding-top: 30px; font-size: 2rem; }
.formula-triangle > span { display: grid; width: 100%; grid-template-columns: 1fr 1fr; padding: 14px 28px 25px; border-top: 3px solid #315d91; text-align: center; }
.morpheme-word { display: flex; justify-content: center; font-size: clamp(1.7rem, 5vw, 3rem); font-weight: 900; }
.morpheme-word span { padding: 5px 8px; border-bottom: 6px solid; }
.morpheme-word .prefix { border-color: #547edb; }.morpheme-word .root { border-color: #e05267; }.morpheme-word .suffix { border-color: #7c56c2; }.morpheme-word .ending { border-color: #2f9b68; }
.morpheme-key { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; margin-top: 14px; color: var(--muted); }
.sentence-example, .punctuation-sample, .speech-bubble { margin: 0; padding: 18px; border-radius: 14px; background: #fff; font-size: clamp(1.15rem, 3vw, 1.65rem); text-align: center; }
.sentence-links { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.sentence-links span, .concept-columns span, .story-map span, .word-picture-grid span, .animal-group-grid span { padding: 15px; border: 1px solid #c3d8ef; border-radius: 13px; background: #fff; text-align: center; }
.sound-tree { display: grid; max-width: 560px; grid-template-columns: 1fr 1fr; gap: 10px; margin: 18px auto 0; }
.sound-tree b { grid-column: 1 / -1; text-align: center; }
.sound-tree span { padding: 14px; border-radius: 12px; background: #fff; text-align: center; }
.concept-columns, .story-map, .word-picture-grid, .animal-group-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.concept-columns.four, .story-map, .animal-group-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
.concept-columns span, .story-map span { display: grid; gap: 6px; }
.concept-columns em, .word-picture-grid em, .animal-group-grid em { font-style: normal; }
.word-picture-grid { grid-template-columns: repeat(4, minmax(90px,1fr)); }
.word-picture-grid span { display: grid; gap: 7px; }
.word-picture-grid b, .animal-group-grid b { font-size: 2rem; }
.animal-group-grid span { display: grid; gap: 4px; }
.animal-group-grid i { color: var(--muted); font-size: .82rem; font-style: normal; }
.story-map span b { color: var(--blue-dark); }
.text-plan-card, .grammar-formula, .century-rule { display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; max-width: 680px; margin: 16px auto 0; padding: 16px; border-radius: 14px; background: #fff; }
.grammar-formula { grid-template-columns: 1fr 1fr; }
.grammar-formula b, .grammar-formula span { padding: 9px 12px; border-radius: 9px; background: #edf5ff; }
.century-rule { grid-template-columns: repeat(2, 1fr); }
.history-line { display: flex; align-items: center; gap: 10px; }
.history-line i { flex: 1; height: 4px; background: #315d91; }
.history-line span, .history-line b { white-space: nowrap; }
.study-map-canvas { position: relative; width: 100%; }
.study-map-canvas img { display: block; width: 100%; height: auto; }
.study-map-routes { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 1px 1px #fff); pointer-events: none; }
.study-map-marker { position: absolute; left: var(--x); top: var(--y); padding: 4px 7px; border: 2px solid #fff; border-radius: 999px; color: #fff; background: #d94c52; box-shadow: 0 2px 8px #17395a66; font-size: clamp(.56rem, 1.4vw, .82rem); font-weight: 900; transform: translate(-50%,-50%); }
.study-route-map .study-map-marker { z-index: 2; }
.study-map-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 12px; }
.study-map-legend span { display: inline-flex; align-items: center; gap: 7px; color: var(--blue-dark); font-size: .88rem; font-weight: 800; }
.study-map-legend i { width: 25px; height: 4px; border-radius: 999px; background: var(--route-color); }
.technology-card-wrap { overflow-x: auto; border: 1px solid #bfd4ec; border-radius: 14px; background: #fff; }
.technology-card { width: 100%; min-width: 700px; border-collapse: collapse; }
.technology-card th, .technology-card td { padding: 10px 12px; border: 1px solid #d7e4f2; text-align: left; vertical-align: top; }
.technology-card th { color: #17395f; background: #eaf4ff; }
.technology-card td:first-child, .technology-card td:nth-child(4) { text-align: center; font-weight: 900; }
.technology-card .technology-warning td { color: #7f3c11; background: #fff1d2; }
.cut-layout-board { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.cut-layout-board section { padding: 14px; border: 1px solid #bfd4ec; border-radius: 14px; background: #fff; }
.cut-layout-board h4, .cut-layout-board p { margin: 0 0 10px; }
.cut-layout-board p { color: var(--muted); font-size: .88rem; }
.cut-layout-board svg { display: block; width: 100%; height: auto; }
.cut-sheet { fill: #fff8dc; stroke: #315d91; stroke-width: 3; }
.cut-part { fill: #72aaf0; stroke: #28578f; stroke-width: 2; }
.cut-part-alt { fill: #8dd19b; stroke: #397849; stroke-width: 2; }
.cut-waste { fill: none; stroke: #d46b61; stroke-width: 3; stroke-dasharray: 7 5; }
.cut-remnant { fill: #f3e3a1; stroke: #9b7b24; stroke-width: 2; stroke-dasharray: 6 4; }
.cut-layout-board text { fill: #6e5311; font-size: 17px; font-weight: 800; text-anchor: middle; }
.compass-rose { position: relative; display: grid; width: 230px; height: 230px; grid-template: 1fr 1fr 1fr / 1fr 1fr 1fr; margin: 0 auto; place-items: center; border: 2px solid #a6c3e5; border-radius: 50%; background: #fff; }
.compass-rose b:first-child { grid-column: 2; }.compass-rose span:nth-child(2) { grid-column: 3; grid-row: 2; }.compass-rose b:nth-child(3) { grid-column: 2; grid-row: 3; }.compass-rose span:nth-child(4) { grid-column: 1; grid-row: 2; }
.compass-rose i { position: absolute; width: 15px; height: 130px; clip-path: polygon(50% 0,100% 48%,62% 48%,62% 100%,38% 100%,38% 48%,0 48%); background: linear-gradient(#df4e55 0 50%,#315d91 50%); }
.earth-layers, .orbit-diagram, .solar-diagram, .photosynthesis, .plant-diagram { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; min-height: 150px; }
.earth-layers span { display: grid; width: 180px; height: 180px; place-items: center; border: 22px solid #77bce9; border-radius: 50%; background: #e7a45e; box-shadow: inset 0 0 0 24px #f3d36b; font-weight: 900; text-align: center; }
.solar-diagram { position: relative; min-height: 230px; }
.solar-diagram b { font-size: 3rem; }.solar-diagram span { font-size: 2.4rem; }.solar-diagram em { font-size: 1.5rem; font-style: normal; }
.photosynthesis span, .photosynthesis b, .plant-diagram span { padding: 11px 14px; border-radius: 12px; background: #fff; }
.color-wheel { display: grid; width: 220px; height: 220px; grid-template-columns: repeat(2,1fr); margin: 0 auto; overflow: hidden; border-radius: 50%; transform: rotate(45deg); }
.color-wheel span:nth-child(1) { background:#e4444b }.color-wheel span:nth-child(2) { background:#f2c83d }.color-wheel span:nth-child(3) { background:#4b79e0 }.color-wheel span:nth-child(4) { background:#70b852 }.color-wheel span:nth-child(5) { background:#eb8b34 }.color-wheel span:nth-child(6) { background:#8a59c4 }
.state-symbols-board p { margin: 12px 0 0; }
.illustrated-scene { min-height: 170px; display: grid; place-items: center; border-radius: 14px; background: #dff0ff; font-size: 3rem; }
.hydrosphere-diagram { display: grid; grid-template-columns: repeat(5, minmax(120px,1fr)); gap: 10px; }
.hydrosphere-diagram span { display: grid; min-height: 92px; place-items: center; padding: 13px; border: 1px solid #a9d7ed; border-radius: 14px; color: #123d68; background: linear-gradient(145deg,#f0fbff,#d9f2ff); font-weight: 800; text-align: center; }
.atmosphere-diagram { display: grid; grid-template-columns: 78fr 21fr minmax(90px,1fr); min-height: 150px; overflow: hidden; border: 1px solid #bad4ee; border-radius: 16px; }
.atmosphere-diagram div { display: grid; align-content: center; justify-items: center; min-width: 0; padding: 14px 8px; color: #123153; background: #cfe9ff; text-align: center; }
.atmosphere-diagram div:nth-child(2) { background: #a9d5ff; }
.atmosphere-diagram div:nth-child(3) { background: #e8f3ff; }
.atmosphere-diagram b { font-size: clamp(1.2rem,2.6vw,2rem); }
.atmosphere-diagram span { font-size: .82rem; font-weight: 800; }
.model-trio, .earth-spheres, .water-bodies { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.model-trio > div, .earth-spheres > span, .water-bodies > span { display: grid; align-content: start; gap: 7px; min-width: 0; padding: 14px; border: 1px solid #bad3ed; border-radius: 14px; background: #fff; text-align: center; }
.model-trio svg { min-height: 130px; }
.model-trio span, .earth-spheres em, .water-bodies em { color: var(--muted); font-size: .86rem; font-style: normal; line-height: 1.45; }
.earth-spheres, .water-bodies { grid-template-columns: repeat(4,minmax(0,1fr)); }
.earth-spheres b, .water-bodies b { color: var(--blue-dark); }
.weather-table-wrap { overflow-x: auto; border: 1px solid #bad3ed; border-radius: 14px; background: #fff; }
.weather-table { width: 100%; min-width: 680px; border-collapse: collapse; }
.weather-table th, .weather-table td { padding: 12px; border-right: 1px solid #d7e4f3; border-bottom: 1px solid #d7e4f3; text-align: left; }
.weather-table th { color: var(--blue-dark); background: #eaf4ff; }
.weather-table th:last-child, .weather-table td:last-child { border-right: 0; }
.weather-table tbody tr:last-child td { border-bottom: 0; }

.chat-assistant { margin: 18px 0 22px; overflow: hidden; border: 1px solid #bcd9f7; border-radius: var(--radius); background: #eaf4ff; box-shadow: var(--shadow); }
.lesson-chat-panel > summary { display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 14px; min-height: 82px; padding: 16px 20px; cursor: pointer; list-style: none; }
.lesson-chat-panel > summary::-webkit-details-marker { display: none; }
.lesson-chat-panel > summary:focus-visible { outline: 3px solid #ffbf47; outline-offset: -3px; border-radius: var(--radius); }
.lesson-chat-panel > summary > span:first-child { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 15px; color: #fff; background: var(--blue); font-size: .75rem; font-weight: 900; }
.lesson-chat-panel > summary strong, .lesson-chat-panel > summary small { display: block; }
.lesson-chat-panel > summary small { margin-top: 2px; color: #49627f; font-size: .82rem; }
.lesson-chat-panel > summary > b { padding: 7px 10px; color: var(--blue-dark); font-size: .78rem; }
.lesson-chat-panel[open] > summary { border-bottom: 1px solid #c6daf0; }
.lesson-chat-panel[open] > summary > b { font-size: 0; }
.lesson-chat-panel[open] > summary > b::after { content: 'Свернуть'; font-size: .78rem; }
.lesson-chat-body { padding: 18px 20px 20px; }
.chat-modes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.chat-mode-button { display: grid; grid-template-columns: 34px 1fr; gap: 2px 10px; min-width: 0; min-height: 66px; padding: 11px 13px; border: 1px solid #c6daf0; border-radius: 13px; color: var(--ink); background: #fff; font: inherit; text-align: left; cursor: pointer; }
.chat-mode-button > span { grid-row: 1 / span 2; display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: var(--blue-dark); background: var(--blue-soft); font-weight: 900; }
.chat-mode-button strong, .chat-mode-button small { min-width: 0; }
.chat-mode-button strong { font-size: .9rem; }
.chat-mode-button small { color: var(--muted); font-size: .76rem; }
.chat-mode-button.is-active { border-color: var(--blue); box-shadow: inset 0 0 0 1px var(--blue); }
.chat-mode-button.is-active > span { color: #fff; background: var(--blue); }
.chat-mode-button:focus-visible, .chat-form button:focus-visible, .chat-form textarea:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.chat-mode-button:disabled, .chat-form button:disabled, .chat-form textarea:disabled { opacity: .65; cursor: wait; }
.chat-thread { display: grid; max-height: 430px; gap: 10px; margin-top: 14px; padding: 14px; overflow-y: auto; border: 1px solid #cbdcf1; border-radius: 14px; background: #fff; }
.chat-welcome { margin: 0; color: #4a6484; font-size: .86rem; }
.chat-message { width: min(86%, 760px); padding: 11px 13px; border-radius: 13px; background: #f1f6fc; }
.chat-message-user { justify-self: end; color: #fff; background: #3479df; }
.chat-message strong { display: block; margin-bottom: 3px; font-size: .7rem; }
.chat-message p { margin: 0; white-space: pre-wrap; }
.chat-message.is-loading { color: #49627f; animation: chat-pulse 1.2s ease-in-out infinite alternate; }
@keyframes chat-pulse { to { opacity: .55; } }
@media (prefers-reduced-motion: reduce) {
  .chat-message.is-loading { animation: none; }
}
.chat-form { margin-top: 12px; }
.chat-form label, .chat-form textarea { display: block; width: 100%; }
.chat-form textarea { min-height: 74px; resize: vertical; padding: 11px 13px; border: 1px solid #b9cfea; border-radius: 13px; color: var(--ink); background: #fff; font: inherit; font-size: .94rem; }
.chat-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 9px; }
.chat-form-actions button { min-height: 44px; padding: 9px 14px; border: 1px solid #bfd1ea; border-radius: 11px; font: inherit; font-size: .82rem; font-weight: 800; cursor: pointer; }
.chat-send { color: #fff; border-color: var(--blue) !important; background: var(--blue); }
.chat-clear { color: #315579; background: #fff; }
.chat-form-actions span { margin-left: auto; color: var(--muted); font-size: .74rem; }
.chat-error { min-height: 1.4em; margin: 7px 0 0; color: #a42e43; font-size: .8rem; font-weight: 750; }
.chat-privacy { margin: 4px 0 0; color: #667a96; font-size: .72rem; }
.reading-texts { display: grid; gap: 16px; margin-top: 24px; }
.reading-text { padding: clamp(18px, 3vw, 28px); border: 1px solid #d2deed; border-radius: 17px; background: #fffdf8; box-shadow: 0 8px 24px rgba(45,73,110,.07); }
.reading-text header { display: grid; grid-template-columns: 38px 1fr; align-items: center; gap: 10px; margin-bottom: 15px; }
.reading-text header span { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 11px; color: #fff; background: #9b66d3; font-weight: 900; }
.reading-text h3 { margin: 0; }
.reading-text p { margin: 0 0 13px; font-family: Georgia, 'Times New Roman', serif; font-size: 1.06rem; line-height: 1.75; }
.reading-text p:last-child { margin-bottom: 0; }

.attestation-overall { display: grid; grid-template-columns: minmax(0,1fr) minmax(220px,320px); align-items: center; gap: 22px; margin-bottom: 18px; padding: 22px; border: 1px solid #98d7b9; border-radius: 19px; background: linear-gradient(135deg,#effaf4,#f9fffc); box-shadow: 0 12px 32px rgba(17,157,104,.1); }
.attestation-overall h2 { margin: 0; }
.attestation-overall p { margin: 4px 0 0; color: var(--muted); }
.attestation-progress-list > li { display: block; min-width: 0; padding: 0; }
.attestation-progress-list > li.has-review { border: 1px solid #e4b354; border-radius: 15px; background: var(--amber-soft); box-shadow: inset 5px 0 0 #d99124; }
.attestation-progress-list > li.has-review .attestation-open:hover { background: #fff4d7; }
.attestation-open { display: grid; width: 100%; grid-template-columns: minmax(0,1fr) minmax(130px,190px); align-items: center; gap: 20px; padding: 17px 18px; border: 0; color: var(--ink); background: transparent; font: inherit; text-align: left; cursor: pointer; }
.attestation-open > *, .attestation-item-copy, .attestation-dialog li > *, .attestation-dialog li a { min-width: 0; }
.attestation-open:hover { background: #f6faff; }
.attestation-item-copy { display: grid; gap: 4px; }
.attestation-item-copy strong { font-size: 1rem; line-height: 1.45; }
.attestation-item-copy small { color: var(--muted); }
.attestation-item-copy .attestation-review-note { width: max-content; max-width: 100%; padding: 4px 8px; border-radius: 999px; color: #7d4b05; background: #ffe2a3; font-weight: 850; }
.attestation-item-progress, .attestation-total, .attestation-dialog-progress { min-width: 120px; }
.attestation-total .schedule-progress-track { height: 14px; }
.attestation-total > span:first-child { min-width: 72px; padding: 8px 12px; color: #fff; background: var(--green); font-size: 1.18rem; }
.schedule-progress.is-complete .schedule-progress-track i { background: #0d9257; }
.attestation-dialog { width: min(820px,calc(100vw - 30px)); max-width: none; max-height: min(84vh,800px); padding: 0; overflow: hidden; border: 0; border-radius: 22px; color: var(--ink); background: #fff; box-shadow: 0 26px 90px rgba(9,31,65,.3); }
.attestation-dialog[open] { display: grid; grid-template-rows: auto auto minmax(0,1fr); }
.attestation-dialog::backdrop { background: rgba(7,24,48,.6); backdrop-filter: blur(3px); }
.attestation-dialog > header { display: flex; align-items: start; justify-content: space-between; gap: 16px; padding: 22px 24px 17px; border-bottom: 1px solid var(--line); }
.attestation-dialog > header p { margin: 0 0 5px; color: var(--blue-dark); font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.attestation-dialog > header h2 { margin: 0; font-size: 1.35rem; }
.attestation-dialog > header button { display: grid; width: 44px; height: 44px; flex: none; place-items: center; border: 1px solid #bed1e8; border-radius: 12px; color: var(--blue-dark); background: #f7faff; font-size: 1.4rem; cursor: pointer; }
.attestation-dialog-progress { margin: 18px 24px 4px; }
.attestation-dialog ol { display: grid; min-height: 0; gap: 9px; margin: 0; padding: 16px 24px 25px; overflow: auto; list-style: none; }
.attestation-dialog li { display: grid; grid-template-columns: minmax(0,1fr) minmax(145px,200px); align-items: center; gap: 14px; padding: 13px; border: 1px solid #d7e4f3; border-radius: 13px; background: #f8fbff; }
.attestation-dialog li a { display: grid; width: 100%; gap: 3px; overflow-wrap: break-word; }
.attestation-dialog li a span { color: var(--muted); font-size: .76rem; }
.attestation-dialog li.status-done { border-color: #a9dcbc; background: #effaf4; }

@media (max-width: 700px) {
  .fraction-board, .geometry-board, .mini-chart, .illustrated-text-card { grid-template-columns: 1fr; }
  .concept-columns, .concept-columns.four, .story-map, .animal-group-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .word-picture-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .hydrosphere-diagram { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .atmosphere-diagram { grid-template-columns: 1fr; }
  .model-trio, .earth-spheres, .water-bodies { grid-template-columns: 1fr; }
  .study-chips.flow-chips span:not(:last-child)::after { display: none; }
  .history-line { align-items: stretch; flex-direction: column; }
  .history-line i { width: 4px; min-height: 35px; margin-left: 20px; }
  .history-line span, .history-line b { white-space: normal; }
  .chat-modes { grid-template-columns: 1fr; }
  .lesson-chat-panel > summary { grid-template-columns: 42px minmax(0,1fr); min-height: 74px; padding: 14px; }
  .lesson-chat-panel > summary > span:first-child { width: 42px; height: 42px; border-radius: 13px; }
  .lesson-chat-panel > summary > b { display: none; }
  .lesson-chat-body { padding: 14px; }
  .chat-message { width: 94%; }
  .chat-form-actions span { width: 100%; margin-left: 0; }
  .attestation-overall, .attestation-open, .attestation-dialog li { grid-template-columns: minmax(0,1fr); }
  .attestation-dialog { inset: 7px; width: auto; max-width: calc(100vw - 14px); max-height: calc(100dvh - 14px); margin: auto; border-radius: 17px; }
  .attestation-dialog > header { padding: 17px 15px 13px; }
  .attestation-dialog > header > div { min-width: 0; }
  .attestation-dialog > header h2 { overflow-wrap: break-word; }
  .attestation-dialog-progress { margin-inline: 15px; }
  .attestation-dialog ol { padding: 13px 15px 20px; }
  .attestation-item-progress, .attestation-total { width: 100%; }
  .attestation-dialog-progress { width: auto; }
  .attestation-dialog li .topic-status, .attestation-dialog li .topic-status select { width: 100%; }
}

/* Editable weekly template ------------------------------------------------ */
.schedule-page .content { padding-top: 26px; }
.schedule-page .breadcrumbs { margin-bottom: 8px; }
.schedule-page .page-heading { margin-bottom: 16px; }
.schedule-editor-panel { padding-top: 25px; }
.schedule-editor-heading,
.generated-week-heading,
.day-head-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.schedule-editor-heading { align-items: flex-start; margin-bottom: 20px; }
.schedule-editor-heading > div { max-width: 790px; }
.schedule-editor-heading p:not(.eyebrow) { margin: 8px 0 0; color: var(--muted); font-size: .91rem; }
.schedule-library-link { display: inline-flex; margin-top: 10px; font-size: .84rem; font-weight: 850; }
.schedule-reset,
.schedule-print,
.week-page-tools button,
.week-page-tools a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid #bfd3f1;
  border-radius: 12px;
  color: var(--blue-dark);
  background: #fff;
  font: inherit;
  font-size: .81rem;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}
.schedule-reset:hover,
.schedule-print:hover,
.week-page-tools button:hover,
.week-page-tools a:hover { border-color: #80aef0; background: var(--blue-soft); }
.schedule-template-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(170px, 1fr));
  gap: 11px;
  align-items: start;
}
.schedule-template-grid > .fixed-schedule { grid-column: 1 / -1; }
.schedule-loading-preview {
  grid-column: 1 / -1;
  display: flex;
  min-height: 110px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 1px dashed #b8cfea;
  border-radius: 17px;
  color: #315985;
  background: #f8fbff;
}
.schedule-loading-preview > span { width: 18px; height: 18px; border: 3px solid #cfe0f5; border-top-color: var(--blue); border-radius: 50%; animation: schedule-spin .8s linear infinite; }
@keyframes schedule-spin { to { transform: rotate(360deg); } }
.template-day {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #cfe0f5;
  border-radius: 17px;
  background: #fafdff;
}
.template-day > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 15px 11px; }
.template-day > header h3 { font-size: .95rem; }
.template-day > header span { display: grid; min-width: 28px; height: 28px; place-items: center; border-radius: 9px; color: var(--blue-dark); background: var(--blue-soft); font-size: .72rem; font-weight: 900; }
.template-day ol { display: grid; gap: 8px; margin: 0; padding: 0 10px; list-style: none; }
.template-day li {
  display: grid;
  grid-template-columns: 15px minmax(0, 1fr);
  gap: 5px 7px;
  align-items: center;
  padding: 8px;
  border: 1px solid #d9e5f5;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(35, 73, 126, .04);
}
.template-day li.is-dragging { opacity: .45; }
.template-day li.is-required-slot { border-left: 4px solid #4a8df5; }
.template-day li.is-extra-slot { border-color: #c9e7d8; background: #f7fffb; }
.template-drag { grid-row: 1 / 4; align-self: stretch; display: grid; place-items: center; color: #8ba0c0; cursor: grab; line-height: 1; }
.template-row-fields { display: grid; min-width: 0; gap: 6px; }
.template-slot-label { color: #587497; font-size: .64rem; font-weight: 850; line-height: 1.25; }
.template-day select {
  width: 100%;
  min-height: 44px;
  padding: 7px 26px 7px 9px;
  border: 1px solid #cbdcf2;
  border-radius: 9px;
  color: var(--ink);
  background: #fff;
  font: inherit;
  font-size: .76rem;
  font-weight: 750;
}
.template-day select:disabled { color: #087149; opacity: 1; background: #f3fff9; }
.template-comment { display: grid; gap: 5px; }
.template-comment span { color: #496a5c; font-size: .63rem; font-weight: 800; }
.template-comment input {
  width: 100%;
  min-height: 42px;
  padding: 8px 9px;
  border: 1px solid #bddccc;
  border-radius: 9px;
  color: var(--ink);
  background: #fff;
  font: inherit;
  font-size: .72rem;
}
.template-comment input:focus { border-color: #4ca578; outline: 3px solid rgba(58, 170, 111, .15); }
.template-move { grid-column: 2; }
.template-move select { min-height: 42px; color: #385b87; font-size: .7rem; font-weight: 700; }
.template-row-actions { grid-column: 2; display: flex; gap: 5px; }
.template-row-actions button,
.tutor-lock {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  padding: 0;
  border: 1px solid #d3e0f2;
  border-radius: 9px;
  color: #345b91;
  background: #f7faff;
  font: inherit;
  font-size: .86rem;
  font-weight: 900;
}
.template-row-actions button { cursor: pointer; }
.template-row-actions button:disabled { cursor: not-allowed; opacity: .38; }
.template-row-actions button:hover { border-color: #91b7ee; background: var(--blue-soft); }
.template-row-actions [data-row-remove] { margin-left: auto; color: #b22d4d; background: var(--rose-soft); }
.tutor-lock { color: #087149; border-color: #bee4d2; background: var(--green-soft); }
.add-subject-button {
  width: calc(100% - 20px);
  min-height: 41px;
  margin: 10px;
  padding: 7px 9px;
  border: 1px dashed #9ebeea;
  border-radius: 11px;
  color: var(--blue-dark);
  background: #f4f8ff;
  font: inherit;
  font-size: .73rem;
  font-weight: 850;
  cursor: pointer;
}
.add-subject-button:hover { border-style: solid; background: var(--blue-soft); }
.add-subject-button:disabled { cursor: not-allowed; opacity: .58; }
.schedule-summary { margin: 16px 0 0; color: #315985; font-size: .86rem; font-weight: 750; }
.schedule-warning { margin: 12px 0 0; padding: 13px 15px; border: 1px solid #efcc87; border-radius: 12px; color: #70460b; background: #fff8e9; font-size: .84rem; }
.weeks-panel-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.weeks-panel-heading p { max-width: 780px; margin: 7px 0 0; color: var(--muted); font-size: .88rem; }
.attestation-date-control { display: grid; min-width: 220px; gap: 5px; padding: 11px 13px; border: 1px solid #c6d9ef; border-radius: 14px; color: var(--blue-dark); background: #f6faff; font-size: .78rem; font-weight: 850; }
.attestation-date-control input { width: 100%; min-height: 44px; padding: 7px 9px; border: 1px solid #b8cde6; border-radius: 9px; color: var(--ink); background: #fff; font: inherit; font-size: .9rem; }
.attestation-date-control small { color: var(--muted); font-size: .68rem; font-weight: 650; }
.schedule-forecast {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid #a9dec4;
  border-radius: 15px;
  color: #086c45;
  background: linear-gradient(130deg, #edfaf3, #fbfffd);
}
.schedule-forecast > span { font-size: 1.35rem; }
.schedule-forecast strong { display: block; }
.schedule-forecast p { margin: 3px 0 0; color: #3f6e5b; font-size: .8rem; }
.schedule-forecast.is-late { border-color: #efc276; color: #85520a; background: linear-gradient(130deg, #fff9e9, #fffdf8); }
.schedule-forecast.is-late p { color: #805f2e; }
.schedule-forecast.is-incomplete { border-color: #c8d5e7; color: #385b87; background: linear-gradient(130deg, #f5f8fc, #fbfdff); }
.schedule-forecast.is-incomplete p { color: #58708f; }
.tutor-note { margin: 12px 0 0; padding: 11px 14px; border-radius: 12px; color: #087149; background: var(--green-soft); font-size: .83rem; }
.generated-week-heading { margin-bottom: 18px; }
.generated-week-panel[hidden] { display: none; }
.week-page-tools { display: flex; justify-content: flex-end; gap: 9px; margin: -18px 0 14px; }
.empty-school-day { margin: 0; padding: 18px 22px; color: var(--muted); font-size: .86rem; }
.schedule-review-badge { display: inline-flex; margin: 4px 0 7px; padding: 3px 8px; border-radius: 999px; color: #087149; background: var(--green-soft); font-size: .68rem; font-weight: 850; }
.week-page-date { margin: -14px 0 18px; color: #3c608a; font-size: .88rem; font-weight: 800; }
.day-card.is-holiday { border-color: #efc87d; box-shadow: 0 12px 30px rgba(158, 105, 14, .09); }
.day-card.is-holiday .day-head { background: linear-gradient(125deg, #397edc, #6f72dc); }
.day-head-title { flex-wrap: wrap; justify-content: flex-start; }
.day-head-title h2 { margin-right: auto; }
.day-date { font-weight: 800; }
.day-head .week-holiday { color: #70460b; background: #fff2c9; opacity: 1; }
.optional-activity-row { border-left: 4px solid #34a56d; background: linear-gradient(90deg, #f4fff9, #fff 32%); }
.optional-badge { display: inline-flex; width: fit-content; margin: 3px 0 6px; padding: 3px 8px; border-radius: 999px; color: #087149; background: var(--green-soft); font-size: .68rem; font-weight: 850; }
.schedule-comment { margin: 2px 0 0; color: #3f6253; font-size: .83rem; }
.assessment-schedule-row { border-left: 4px solid #8b5fd2; background: linear-gradient(90deg, #faf7ff, #fff 34%); }
.assessment-schedule-badge { display: inline-flex; width: fit-content; margin: 0 0 6px; padding: 3px 8px; border-radius: 999px; color: #563584; background: #eee3ff; font-size: .68rem; font-weight: 850; }

/* Voluntary assessment library ----------------------------------------- */
.assessment-library-intro,
.assessment-cadence {
  margin-bottom: 18px;
  padding: clamp(20px, 3vw, 28px);
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--shadow);
}
.assessment-library-intro { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-color: #afdcc5; background: linear-gradient(130deg, #effaf4, #fff); }
.assessment-library-intro p { max-width: 780px; margin: 7px 0 0; color: #46675a; }
.assessment-library-intro > a { display: inline-flex; flex: none; min-height: 44px; align-items: center; padding: 9px 14px; border: 1px solid #8fcfaf; border-radius: 12px; color: #087149; background: #fff; font-weight: 850; text-decoration: none; }
.assessment-cadence > h2 { margin-bottom: 14px; }
.assessment-cadence > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.assessment-cadence p { margin: 0; padding: 13px; border: 1px solid #d8e4f3; border-radius: 13px; background: #f8fbff; }
.assessment-cadence strong,
.assessment-cadence span { display: block; }
.assessment-cadence strong { color: var(--blue-dark); font-size: .84rem; }
.assessment-cadence span { margin-top: 4px; color: var(--muted); font-size: .75rem; }
.assessment-cadence .assessment-cadence-note { margin-top: 13px; border-color: #e3cf9d; color: #6f5524; background: #fffaf0; }
.assessment-cadence .assessment-cadence-note strong { display: inline; }
.assessment-cadence .assessment-cadence-note a { display: inline; }
.assessment-filter { position: sticky; top: 90px; z-index: 7; display: flex; gap: 8px; margin-bottom: 16px; padding: 10px; overflow-x: auto; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.97); box-shadow: 0 8px 22px rgba(35,73,126,.08); }
.assessment-filter button { display: inline-flex; flex: none; min-height: 44px; align-items: center; gap: 8px; padding: 8px 12px; border: 0; border-radius: 11px; color: #2d527e; background: var(--blue-soft); font: inherit; font-size: .8rem; font-weight: 800; cursor: pointer; }
.assessment-filter button[aria-pressed="true"] { color: #fff; background: var(--blue); }
.assessment-filter b { display: grid; min-width: 24px; height: 24px; place-items: center; border-radius: 8px; background: rgba(255,255,255,.7); font-size: .7rem; }
.assessment-filter button[aria-pressed="true"] b { color: var(--blue-dark); }
.assessment-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; align-items: start; }
.assessment-card { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 19px; background: #fff; box-shadow: 0 9px 24px rgba(35,73,126,.07); scroll-margin-top: 170px; }
.assessment-card.is-added { border-color: #79c89f; box-shadow: 0 9px 24px rgba(24,130,78,.1); }
.assessment-card.is-ready { border-color: #79c89f; box-shadow: inset 5px 0 0 #24a36c, 0 9px 24px rgba(24,130,78,.1); }
.assessment-card.needs-review { border-color: #e2b75c; box-shadow: inset 5px 0 0 #d99124, 0 9px 24px rgba(169,110,24,.09); }
.assessment-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.assessment-card h2 { margin-top: 7px; font-size: 1.12rem; line-height: 1.3; }
.assessment-type,
.assessment-week,
.assessment-meta span { display: inline-flex; width: fit-content; padding: 4px 8px; border-radius: 999px; font-size: .69rem; font-weight: 850; }
.assessment-type { color: #563584; background: #eee3ff; }
.assessment-week { flex: none; color: #315985; background: var(--blue-soft); }
.assessment-description { margin: 13px 0 0; color: #526c8b; font-size: .86rem; }
.assessment-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.assessment-meta span { color: #087149; background: var(--green-soft); }
.assessment-content { margin-top: 14px; border: 1px solid #d5e2f3; border-radius: 13px; background: #fbfdff; }
.assessment-content > summary { min-height: 46px; padding: 12px 14px; color: var(--blue-dark); font-weight: 850; cursor: pointer; }
.assessment-content-body { padding: 0 16px 16px; font-size: .86rem; }
.assessment-content-body h3 { margin: 14px 0 6px; font-size: .94rem; }
.assessment-content-body ul,
.assessment-content-body ol { margin: 0; padding-left: 1.35em; }
.assessment-content-body li + li { margin-top: 7px; }
.assessment-content-body p { margin: 0; }
.assessment-readiness { display: grid; gap: 2px; margin-top: 12px; padding: 10px 12px; border: 1px solid #d8e3f2; border-radius: 11px; color: #526987; background: #f8fbff; }
.assessment-readiness strong { font-size: .78rem; }
.assessment-readiness span { font-size: .76rem; }
.assessment-readiness.is-ready { border-color: #94d3b3; color: #087149; background: #effaf4; }
.assessment-readiness.needs-review { border-color: #e6c174; color: #8a5b11; background: #fff8e8; }
.assessment-answer { margin-top: 14px; padding: 11px 13px; border: 1px solid #efd396; border-radius: 11px; background: #fff9e9; }
.assessment-answer > summary { color: #7a4d0b; font-weight: 850; cursor: pointer; }
.adult-answer-intro { margin: 12px 0; padding: 10px 12px; border-radius: 10px; color: #654c22; background: rgba(255,255,255,.72); }
.adult-solution-list { display: grid; gap: 11px; padding: 0; list-style: none; }
.adult-solution-list > li { margin: 0; padding: 12px; border: 1px solid #efdcae; border-radius: 10px; background: #fff; }
.adult-solution-list h4 { margin-bottom: 7px; color: #70480d; }
.adult-solution-list p + p { margin-top: 7px; }
.adult-task-context { color: #4e607b; }
.adult-creative-guide { display: grid; gap: 10px; margin-top: 12px; padding: 12px; border: 1px solid #efdcae; border-radius: 10px; background: #fff; }
.assessment-actions { display: grid; grid-template-columns: 90px minmax(145px, .8fr) 1fr auto; gap: 9px; align-items: end; margin-top: 15px; padding-top: 15px; border-top: 1px solid #e0e8f3; }
.assessment-actions label { display: grid; gap: 5px; }
.assessment-actions label > span { color: #58708f; font-size: .66rem; font-weight: 850; }
.assessment-actions input,
.assessment-actions select,
.assessment-actions button { min-height: 44px; border: 1px solid #c6d8ef; border-radius: 10px; background: #fff; font: inherit; font-size: .75rem; font-weight: 800; }
.assessment-actions input,
.assessment-actions select { width: 100%; padding: 7px 9px; color: var(--ink); }
.assessment-actions button { padding: 8px 11px; color: var(--blue-dark); cursor: pointer; }
.assessment-actions .assessment-add { color: #fff; border-color: var(--blue); background: var(--blue); }
.assessment-actions .assessment-remove { color: #a62d4a; border-color: #efc1ce; background: #fff5f7; }
.assessment-actions .assessment-print { grid-column: 1 / -1; color: #315985; background: #f7faff; }
.assessment-remove[hidden], .assessment-card[hidden], .assessment-empty[hidden] { display: none !important; }
.assessment-state { grid-column: 1 / -1; margin: 0; color: #087149; font-size: .75rem; font-weight: 800; }
.assessment-state.is-error { color: #a14719; }
.assessment-empty { padding: 22px; border: 1px dashed #b8cce6; border-radius: 15px; color: var(--muted); text-align: center; }
.assessment-print-root { display: none; }
.generated-week-print-root { display: none; }

.schedule-progress { display: grid; grid-template-columns: auto minmax(48px, 1fr); gap: 9px; align-items: center; min-width: 92px; }
.schedule-progress > span:first-child { display: inline-flex; min-width: 52px; min-height: 28px; align-items: center; justify-content: center; padding: 4px 8px; border-radius: 999px; color: #087149; background: var(--green-soft); font-size: .82rem; font-weight: 900; line-height: 1; }
.schedule-progress-track { display: block; height: 10px; overflow: hidden; border-radius: 999px; background: #dce6f1; box-shadow: inset 0 0 0 1px rgba(36,91,74,.06); }
.schedule-progress-track i { display: block; width: 0; height: 100%; border-radius: inherit; background: #0d9257; transition: width .25s ease; }
.day-head { display: block; }
.day-head-title { color: inherit; }
.day-progress { grid-template-columns: 56px 1fr; width: min(280px, 100%); margin-top: 11px; }
.day-progress > span:first-child { color: #075d3c; background: #dff9ec; }
.day-progress .schedule-progress-track { background: rgba(255,255,255,.3); }
.day-progress .schedule-progress-track i { background: #aef1ca; }
.week-progress { grid-template-columns: 56px 1fr; margin-top: 11px; }
.week-link .week-progress > span:first-child { margin: 0; color: #087149; font-size: .8rem; }
.week-link .week-progress .schedule-progress-track { margin: 0; }
.week-overall-progress { display: grid; grid-template-columns: auto minmax(220px,360px); align-items: center; justify-content: end; gap: 16px; margin: -7px 0 15px; padding: 14px 16px; border: 1px solid #a8dcc3; border-radius: 16px; color: #087149; background: linear-gradient(135deg,#effaf4,#fbfffd); }
.week-overall-progress strong { font-size: .9rem; }
.week-total-progress { width: min(320px,100%); }
.week-total-progress > span:first-child { min-width: 64px; color: #fff; background: var(--green); font-size: 1rem; }
.weeks-panel { scroll-margin-top: 88px; }
.vacation-panel { margin-top: 22px; }

@media (max-width: 1120px) {
  .shell { grid-template-columns: 78px minmax(0, 1fr); }
  body.sidebar-expanded .shell { grid-template-columns: 215px minmax(0, 1fr); }
  body.sidebar-expanded .sidebar { padding-inline: 14px; }
  .content { padding-inline: 30px; }
  .week-grid { grid-template-columns: repeat(4, minmax(145px, 1fr)); }
  .fixed-schedule { grid-template-columns: repeat(5, 190px); }
  .schedule-template-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
  body.has-course-nav { padding-bottom: 0; }
  .topbar {
    min-height: 68px;
    padding: 9px max(18px, env(safe-area-inset-right)) 9px max(18px, env(safe-area-inset-left));
  }
  .brand-mark { width: 44px; height: 44px; border-radius: 14px; }
  .topbar-context { display: none; }
  .shell { display: block; min-height: auto; }
  .sidebar { display: none; }
  .content { width: 100%; max-width: 1000px; margin: 0 auto; padding: 34px 28px calc(102px + env(safe-area-inset-bottom)); }
  .mobile-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 30;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    padding: 6px max(10px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
    border-top: 1px solid var(--line);
    background: rgba(255,255,255,.97);
    box-shadow: 0 -8px 28px rgba(31,66,115,.1);
    backdrop-filter: blur(16px);
  }
  .mobile-nav a {
    display: grid;
    min-height: 62px;
    gap: 2px;
    padding: 6px 4px;
    place-items: center;
    border-radius: 12px;
    font-size: .76rem;
    line-height: 1.1;
    text-align: center;
  }
  .mobile-nav a svg { width: 23px; height: 23px; }
  .mobile-nav .nav-label-full { display: none; }
  .mobile-nav .nav-label-mobile { display: inline; }
  .mobile-nav a.is-active { color: var(--blue-dark); background: var(--blue-soft); }
  .breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; }
  .anchor-nav { top: 78px; }
  .lesson-open { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 10px; }
  .fixed-schedule { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; }
  .fixed-day { min-width: 0; }
  .schedule-page .content { padding-top: 20px; }
  .schedule-template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  body { font-size: 17px; }
  .topbar { min-height: 68px; padding: 9px 15px; }
  .brand-mark { width: 44px; height: 44px; border-radius: 14px; }
  .brand strong { font-size: .94rem; }
  .brand small { font-size: .69rem; }
  .grade-switch { padding: 8px 11px; font-size: .78rem; }
  .parent-mode-button { width: 44px; justify-content: center; padding-inline: 8px; }
  .parent-mode-button b { display: none; }
  .content { padding: 25px 18px calc(110px + env(safe-area-inset-bottom)); }
  .page-heading { display: block; }
  .hero-badge { display: inline-flex; gap: 8px; min-width: 0; margin-top: 14px; }
  .hero-badge strong { font-size: 1.2rem; }
  .hero-panel, .attestation-steps { grid-template-columns: 1fr; }
  .landing { padding: 27px 17px 50px; }
  .landing-logo { margin-bottom: 46px; }
  .grade-card { min-height: 260px; }
  .week-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lesson-row { grid-template-columns: 56px minmax(0, 1fr) auto; padding: 17px 15px; }
  .lesson-open { grid-column: 3; grid-row: 1; white-space: normal; align-self: center; }
  .lesson-marks { grid-column: 1 / -1; }
  .master-checklist { grid-template-columns: 1fr; }
  .lesson-section { padding: 21px 17px; }
  .example-card { padding: 20px 17px 20px 58px; }
  .schedule-editor-heading { display: block; }
  .schedule-reset { width: 100%; margin-top: 14px; }
  .week-page-tools { margin-top: -8px; }
  .assessment-list { grid-template-columns: 1fr; }
  .assessment-cadence > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .material-toolbar { align-items: stretch; flex-direction: column; gap: 11px; }
  .speech-controls { display: flex; width: 100%; justify-content: flex-start; }
  .speech-toggle, .speech-stop { min-height: 46px; }
  .speech-voice { flex: 1 1 150px; }
  .speech-voice select { min-height: 46px; }
  .place-value-classes { grid-template-columns: 1fr; }
  .cut-layout-board { grid-template-columns: 1fr; }
  .content { padding-inline: 14px; }
  .topic-filter-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .achievements-overview { grid-template-columns: 1fr; gap: 13px; }
  .achievement-percent { min-height: 78px; }
  .achievement-badges { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .topic-filter-button { justify-content: space-between; min-width: 0; padding-inline: 10px; }
  .hero-panel, .link-grid, .grade-grid, .topic-list, .materials-list, .video-list, .books-grid, .vacation-grid, .subject-facts, .attestation-steps { grid-template-columns: 1fr; }
  .fixed-schedule { grid-template-columns: 1fr; }
  .schedule-template-grid { grid-template-columns: 1fr; }
  .week-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-title { display: block; }
  .section-title p { margin-top: 6px; }
  .page-heading { margin-bottom: 22px; }
  .compact-resource-groups { grid-template-columns: 1fr; gap: 13px; }
  .lesson-row { grid-template-columns: 1fr; gap: 9px; }
  .lesson-time { display: inline-flex; width: max-content; padding: 3px 8px; border-radius: 999px; background: var(--blue-soft); }
  .lesson-open {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 9px 13px;
    border: 1px solid #cbdcf5;
    border-radius: 12px;
    background: #f8fbff;
    text-align: center;
  }
  .lesson-row > .topic-status, .lesson-open { grid-column: 1; grid-row: auto; }
  .lesson-row > .topic-status, .lesson-row > .topic-status select { width: 100%; }
  .lesson-marks { grid-column: 1; }
  .lesson-main strong, .lesson-main h3 { font-size: 1.03rem; }
  .lesson-main small, .lesson-time, .lesson-marks ul, .movement-row, .week-link span, .topic-card span,
  .lesson-section > header p, .materials-list p, .video-list p, .book-card p, .answer-lesson > header p,
  .answer-fields h4, .attestation-steps p, .fixed-day li span { font-size: .84rem; }
  .lesson-main p, .fixed-day ol { font-size: .94rem; }
  .day-head { flex-wrap: wrap; padding: 16px; }
  .movement-row { padding-inline: 16px; }
  .week-nav a { display: flex; align-items: center; min-height: 52px; }
  .week-nav a:last-child { justify-content: flex-end; }
  .subject-jump { top: 76px; margin-inline: -4px; }
  .topic-subject-simple { padding: 20px 15px; }
  .topic-row { grid-template-columns: 34px minmax(0, 1fr); align-items: start; padding: 12px 6px; }
  .topic-row > .topic-status { grid-column: 2; width: 100%; }
  .topic-row > .topic-status select { width: 100%; }
  .lesson-topic-item { grid-template-columns: 1fr; gap: 8px; }
  .lesson-topic-item .topic-status, .lesson-topic-item .topic-status select { width: 100%; }
  .lesson-section > .topic-part-heading { display: grid; grid-template-columns: 1fr; align-items: start; }
  .topic-part-heading .topic-status, .topic-part-heading .topic-status select { width: 100%; }
  .exercise-toolbar { align-items: stretch; flex-direction: column; }
  .print-exercises-button { width: 100%; }
  .week-page-tools { display: grid; grid-template-columns: 1fr 1fr; }
  .week-page-tools > * { width: 100%; }
  .generated-week-heading { display: block; }
  .schedule-print { width: 100%; margin-top: 12px; }
  .template-day select, .template-move select, .template-comment input, .template-row-actions button, .tutor-lock, .add-subject-button { min-height: 44px; }
  .template-row-actions button, .tutor-lock { width: 44px; height: 44px; }
  .weeks-panel-heading { display: block; }
  .attestation-date-control { width: 100%; margin-top: 14px; }
  .schedule-forecast { align-items: flex-start; }
  .calendar-break-card { min-height: 78px; padding: 14px 16px; }
  .assessment-library-intro { display: block; }
  .assessment-library-intro > a { width: 100%; justify-content: center; margin-top: 14px; }
  .assessment-filter { top: 76px; margin-inline: -3px; }
  .assessment-card { padding: 16px 14px; }
  .assessment-card > header { display: block; }
  .assessment-week { margin-top: 9px; }
  .assessment-actions { grid-template-columns: 90px minmax(0, 1fr); }
  .assessment-actions .assessment-add,
  .assessment-actions .assessment-remove,
  .assessment-actions .assessment-print { grid-column: 1 / -1; }
  .week-overall-progress { grid-template-columns: 1fr; justify-content: stretch; margin-top: 0; }
  .week-total-progress { width: 100%; }
  .attestation-list { padding: 10px; }
  .attestation-open { gap: 12px; padding: 15px 12px; }
}

@media (max-width: 430px) {
  .material-point { padding: 14px; }
  .material-inline-example { grid-template-columns: 1fr; gap: 3px; }
  body { font-size: 17px; }
  .addition-facts-grid { grid-template-columns: 1fr; }
  body.has-course-nav { padding-bottom: 0; }
  h1 { font-size: 1.75rem; line-height: 1.15; }
  h2 { font-size: 1.35rem; }
  .topbar { padding: 8px max(11px, env(safe-area-inset-right)) 8px max(11px, env(safe-area-inset-left)); }
  .brand { gap: 9px; }
  .brand-mark { width: 40px; height: 40px; border-radius: 12px; font-size: .75rem; }
  .brand strong { font-size: .88rem; }
  .brand small { display: none; }
  .grade-switch { min-height: 44px; padding: 7px 10px; }
  .grade-switch-wide { display: none; }
  .grade-switch-compact { display: inline; }
  .mobile-nav {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    padding-right: max(7px, env(safe-area-inset-right));
    padding-left: max(7px, env(safe-area-inset-left));
  }
  .mobile-nav a { display: grid; min-height: 58px; gap: 2px; padding: 5px 1px; place-items: center; font-size: .61rem; line-height: 1; white-space: nowrap; }
  .mobile-nav a svg { width: 20px; height: 20px; flex: none; }
  .landing { padding: 23px 14px 38px; }
  .content { padding: 21px 12px calc(82px + env(safe-area-inset-bottom)); }
  .topic-filter-panel { padding: 12px; }
  .topic-filter-button { padding-inline: 8px; font-size: .78rem; }
  .landing-logo { margin-bottom: 34px; }
  .landing-lead { font-size: 1rem; }
  .grade-grid { margin-top: 25px; }
  .grade-card { min-height: 230px; border-radius: 23px; }
  .grade-number { font-size: 4rem; }
  .week-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .week-link { min-height: 96px; padding: 14px; }
  .week-link .week-holiday { white-space: normal; }
  .calendar-break-icon { width: 42px; height: 42px; border-radius: 13px; font-size: 1.2rem; }
  .assessment-cadence > div { grid-template-columns: 1fr; }
  .link-card { grid-template-columns: 48px 1fr; min-height: 106px; }
  .link-card .card-icon { width: 48px; height: 48px; }
  .link-arrow { display: none; }
  .achievements-heading { display: block; }
  .achievements-star { width: 48px; height: 48px; margin-top: 14px; border-radius: 14px; }
  .achievement-badge { grid-template-columns: 36px minmax(0,1fr); padding: 11px; }
  .achievement-badge > span { width: 36px; height: 36px; border-radius: 11px; font-size: 1.15rem; }
  .hero-copy, .hero-side, .panel { padding: 22px 18px; }
  .lesson-hero { padding: 22px 17px; border-radius: 21px; }
  .lesson-hero h1 { font-size: 1.68rem; overflow-wrap: break-word; }
  .lesson-meta { gap: 6px; }
  .lesson-meta span { padding: 4px 8px; }
  .multiplication-table-heading { display: grid; }
  .multiplication-table { min-width: 590px; }
  .multiplication-table.is-compact { min-width: 540px; }
  .multiplication-table th, .multiplication-table td { height: 42px; padding: 6px 3px; font-size: .78rem; }
  .multiplication-table-guide span, .multiplication-table-guide strong { min-width: 38px; min-height: 38px; }
  .lesson-section { padding: 19px 14px; border-radius: 18px; }
  .lesson-section > header { grid-template-columns: 39px 1fr; }
  .lesson-section > header > span { width: 38px; height: 38px; border-radius: 12px; }
  .lesson-section > header.print-exercise-title { display: none; }
  .exercise-toolbar h2, .exercise-toolbar h3 { font-size: 1.35rem; }
  .example-card { padding: 17px; }
  .number-chip { position: static; margin-bottom: 10px; }
  .task-level { padding: 16px 14px; }
  .task-level blockquote { padding: 14px; }
  .lesson-visual { padding: 12px; }
  .materials-list article, .video-list article, .book-card, .answer-lesson { padding: 16px 14px; }
  .print-checks { display: grid; gap: 6px; }
  .attestation-overall { gap: 15px; padding: 18px 15px; }
  .attestation-overall p { font-size: .9rem; }
  .attestation-total > span:first-child { min-width: 68px; font-size: 1.05rem; }
  .attestation-dialog > header h2 { font-size: 1.08rem; line-height: 1.25; }
  .attestation-dialog ol { padding-inline: 10px; }
  .attestation-dialog li { gap: 10px; padding: 12px 10px; }
}

@media (max-width: 360px) {
  .brand strong { font-size: .81rem; }
  .grade-switch { padding-inline: 8px; font-size: .73rem; }
  .week-grid { grid-template-columns: 1fr; }
  .achievement-badges { grid-template-columns: 1fr; }
  .week-link { min-height: 82px; }
  .week-nav { grid-template-columns: 1fr; }
  .week-nav a:last-child { justify-content: flex-start; text-align: left; }
}

@media print {
  @page { size: A4 portrait; margin: 11mm; }
  :root { --ink: #000; --muted: #333; --line: #bbb; }
  body, body.has-course-nav { padding: 0; color: #000; background: #fff; font-size: 10.5pt; line-height: 1.38; }
  .topbar, .sidebar, .mobile-nav, .breadcrumbs, .anchor-nav, .subject-jump, .hero-actions, .week-nav, .no-print, .speech-controls, .chat-assistant { display: none !important; }
  .shell { display: block; max-width: none; min-height: 0; }
  .content { width: auto; max-width: none; padding: 0; }
  h1 { font-size: 22pt; }
  h2 { font-size: 16pt; }
  h3 { font-size: 12pt; }
  a { color: #000; text-decoration: none; }
  .page-heading, .lesson-hero { margin-bottom: 6mm; }
  .hero-panel, .link-grid, .grade-grid, .week-grid { display: block; }
  .page-heading, .lesson-hero, .lesson-section, .day-card, .answer-lesson, .checklist-subject, .panel { box-shadow: none; }
  .day-card, .fixed-day { margin-bottom: 5mm; border-radius: 4mm; break-inside: avoid; }
  .day-head { padding: 4mm 5mm; color: #000; background: #e8eff8; }
  .day-head h2 { color: #000; }
  .lesson-row { grid-template-columns: 16mm 1fr; gap: 3mm; padding: 3.5mm 5mm; }
  .lesson-open { display: none; }
  .lesson-topic-item { grid-template-columns: 1fr 42mm; break-inside: avoid; }
  .topic-status select { min-height: 8mm; padding: 1.5mm 2mm; border-color: #888; font-size: 8pt; }
  .lesson-marks { grid-column: 1 / -1; }
  .lesson-marks ul { font-size: 8pt; }
  .movement-row { padding: 3mm 5mm; }
  .lesson-section { margin-top: 5mm; padding: 6mm; border-radius: 4mm; page-break-inside: auto; }
  .lesson-section > header { margin-bottom: 4mm; }
  .lesson-visual { break-inside: avoid; }
  .multiplication-table-wrap { overflow: visible; }
  .multiplication-table, .multiplication-table.is-compact { min-width: 0; font-size: 8pt; }
  .multiplication-table th, .multiplication-table td { height: auto; padding: 2.2mm .7mm; font-size: 8pt; }
  .material-point, .example-card, .task-level, .materials-list article, .video-list article, .answer-fields > section { break-inside: avoid; }
  .answer-lesson { break-inside: auto; }
  .answer-lesson > header { break-after: avoid; }
  .video-list a::after, .materials-list a::after { content: ' (' attr(href) ')'; font-size: 8pt; overflow-wrap: anywhere; }
  .print-checks { display: grid; grid-template-columns: 1fr 1fr; gap: 2mm 8mm; }
  .master-checklist { grid-template-columns: 1fr 1fr; }
  .checklist-subject { page-break-before: always; }
  .checklist-subject:first-of-type { page-break-before: auto; }
  .print-week .day-card { break-inside: avoid; }
  .print-week .days-stack { display: block; }
  body.print-generated-week-only > *:not(.generated-week-print-root) { display: none !important; }
  body.print-generated-week-only .generated-week-print-root { display: block !important; position: static !important; width: 100%; margin: 0; padding: 0; border: 0; box-shadow: none; }
  .schedule-progress-track { border: 1px solid #aaa; }
  body.print-exercises-only > *:not(.exercise-print-root) { display: none !important; }
  body.print-exercises-only .exercise-print-root { display: block !important; position: static !important; width: 100%; margin: 0; padding: 0; }
  body.print-exercises-only .print-exercise-target { display: block !important; position: static !important; width: 100%; margin: 0; padding: 0; border: 0; background: #fff; box-shadow: none; }
  body.print-exercises-only .exercise-toolbar { display: none !important; }
  body.print-exercises-only .print-exercise-title { display: block !important; margin-bottom: 7mm; padding-bottom: 4mm; border-bottom: 1px solid #999; }
  body.print-exercises-only .print-exercise-title p { margin: 0 0 2mm; font-size: 9pt; font-weight: 700; }
  body.print-exercises-only .print-exercise-title h1 { margin: 0 0 3mm; font-size: 18pt; }
  body.print-exercises-only .print-exercise-title h2 { margin: 0; font-size: 14pt; }
  body.print-exercises-only .practice-stack { gap: 4mm; }
  body.print-exercises-only .task-level { padding: 4mm; border: 1px solid #888; background: #fff; }
  body.print-assessment-only > *:not(.assessment-print-root) { display: none !important; }
  body.print-assessment-only .assessment-print-root { display: block !important; position: static !important; width: 100%; margin: 0; padding: 0; }
  body.print-assessment-only .assessment-card { display: block !important; padding: 0; border: 0; box-shadow: none; }
  body.print-assessment-only .assessment-card > header { display: block; padding-bottom: 4mm; border-bottom: 1px solid #888; }
  body.print-assessment-only .assessment-week { margin-top: 2mm; }
  body.print-assessment-only .assessment-content { border: 0; background: #fff; }
  body.print-assessment-only .assessment-content > summary { display: none; }
  body.print-assessment-only .assessment-content-body { display: block !important; padding: 0; font-size: 10.5pt; }
  body.print-assessment-only .assessment-content-body h3 { break-after: avoid; }
  body.print-assessment-only .assessment-content-body li { break-inside: avoid; }
}

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