:root {
  color-scheme: light;
  --ink: #172033;
  --muted: #687386;
  --paper: #f4f6fa;
  --panel: #ffffff;
  --line: #dfe4ec;
  --green: #5b4ff6;
  --green-2: #eeecff;
  --orange: #ff9f66;
  --red: #c84b5b;
  --navy: #11182a;
  --violet: #7c6df8;
  --cyan: #5fd7df;
  --shadow: 0 18px 50px rgba(20, 28, 48, .09);
  --topbar: rgba(255,255,255,.88);
  --control: #ffffff;
  --surface-soft: #f7f8fb;
  --surface-subtle: #fbfcfe;
  --surface-hover: #f8f7ff;
  --notice-bg: #172033;
  --notice-ink: #ffffff;
  font-family: var(--chloe-font-ui);
  color: var(--ink);
  background: var(--paper);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #edf1ff;
  --muted: #a6afc4;
  --paper: #0c1120;
  --panel: #151c2f;
  --line: #2c3650;
  --green: #a79dff;
  --green-2: #29264c;
  --orange: #ffad78;
  --red: #ff8794;
  --navy: #070b15;
  --violet: #9c91ff;
  --cyan: #6fe5ed;
  --shadow: 0 18px 50px rgba(0, 0, 0, .32);
  --topbar: rgba(12,17,32,.9);
  --control: #101728;
  --surface-soft: #11182a;
  --surface-subtle: #182038;
  --surface-hover: #202947;
  --notice-bg: #edf1ff;
  --notice-ink: #11182a;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: var(--paper); font-weight: 400; letter-spacing: -.006em; }
button, input, textarea, select { font: inherit; }
button {
  border: 0; border-radius: .8rem; padding: .8rem 1.15rem; cursor: pointer;
  color: white; background: var(--green); font-weight: 600;
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
}
button:hover { filter: brightness(.97); transform: translateY(-1px); }
button.secondary { background: var(--green-2); color: var(--green); }
button.ghost { background: transparent; color: var(--green); padding-inline: 0; }
button:disabled { opacity: .55; cursor: wait; }
input, textarea, select {
  width: 100%; border: 1px solid var(--line); border-radius: .75rem; padding: .78rem .85rem;
  background: var(--control); color: var(--ink);
}
input:focus, textarea:focus, select:focus { outline: 3px solid rgba(91,79,246,.13); border-color: var(--green); }
textarea { resize: vertical; }
label { display: grid; gap: .4rem; font-weight: 500; font-size: .92rem; }
label.check { display: flex; align-items: center; }
label.check input { width: auto; }
form { display: grid; gap: 1rem; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3, strong { font-weight: 600; }
h1 { margin-bottom: 0; font-size: 1.15rem; line-height: 1; letter-spacing: -.02em; }
h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.14; letter-spacing: -.035em; }
h3 { font-size: 1.12rem; line-height: 1.3; letter-spacing: -.018em; }
.topbar, footer {
  display: flex; align-items: center; justify-content: space-between; gap: 2rem;
  padding: 1rem clamp(1rem, 4vw, 4rem); border-bottom: 1px solid var(--line);
}
.topbar {
  display: grid; grid-template-columns: minmax(10rem, 1fr) auto minmax(10rem, 1fr);
  gap: 1rem; padding-block: .65rem; background: var(--topbar); backdrop-filter: blur(18px);
  position: sticky; top: 0; z-index: 10;
}
.brand { min-width: 11rem; display: flex; align-items: center; gap: .65rem; }
.brand-mark { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: .65rem; color: white; background: linear-gradient(145deg, var(--violet), #4235dc); font-size: .82rem; font-weight: 850; box-shadow: 0 6px 16px rgba(91,79,246,.24); }
.brand h1 { font-size: .9rem; font-weight: 600; letter-spacing: -.01em; }
.student-nav {
  display: flex; align-items: center; gap: .15rem; padding: .2rem;
  background: var(--surface-soft); border: 1px solid var(--line); border-radius: .72rem;
}
.student-nav .nav-button {
  min-width: 5.2rem; min-height: 2.15rem; padding: .45rem .8rem; border-radius: .55rem; background: transparent;
  color: var(--muted); font-size: .82rem; font-weight: 550;
}
.student-nav .nav-button:hover { color: var(--ink); background: var(--surface-hover); transform: none; }
.student-nav .nav-button.active {
  background: #5b4ff6; color: #fff; box-shadow: 0 5px 14px rgba(91,79,246,.3);
}
.student-nav .nav-button.active:hover { color: #fff; background: #5145eb; }
.eyebrow, .kicker { font-size: .66rem; letter-spacing: .13em; font-weight: 650; color: var(--green); margin-bottom: .55rem; }
.userbar { position: relative; display: flex; justify-self: end; align-items: center; }
.account-menu { position: relative; }
.account-menu summary {
  display: flex; align-items: center; gap: .5rem; min-width: 9.2rem; min-height: 2.55rem; padding: .5rem .72rem;
  border: 1px solid var(--line); border-radius: .68rem; color: var(--ink); background: var(--panel);
  font-size: .82rem; font-weight: 700; cursor: pointer; list-style: none;
}
.account-menu summary::-webkit-details-marker { display: none; }
.account-menu[open] summary { border-color: var(--violet); }
.menu-chevron { margin-left: auto; color: var(--muted); font-size: .85rem; transition: transform .16s ease; }
.account-menu[open] .menu-chevron { transform: rotate(180deg); }
.account-menu-panel {
  position: absolute; top: calc(100% + .5rem); right: 0; z-index: 30; display: grid; gap: .35rem;
  width: 14rem; padding: .65rem; border: 1px solid var(--line); border-radius: .85rem;
  background: var(--panel); box-shadow: var(--shadow);
}
.theme-picker { display: grid; gap: .35rem; padding: .35rem; color: var(--muted); font-size: .72rem; }
.theme-picker select { width: 100%; padding: .55rem 1.8rem .55rem .65rem; border-radius: .62rem; font-size: .82rem; }
.account-action {
  width: 100%; padding: .62rem .7rem; border-radius: .6rem; color: var(--ink); background: transparent;
  text-align: left; font-size: .82rem; font-weight: 650;
}
.account-action:hover { background: var(--surface-soft); transform: none; }
.account-action.danger { color: var(--red); }
main { width: min(1180px, calc(100% - 2.5rem)); margin: 0 auto; padding: 2rem 0 5rem; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
.notice {
  position: fixed; right: 1rem; top: 6.5rem; max-width: min(30rem, calc(100vw - 2rem)); z-index: 40;
  border: 1px solid rgba(255,255,255,.2); border-radius: 1rem; padding: 1rem 1.2rem;
  background: var(--notice-bg); color: var(--notice-ink); box-shadow: 0 18px 50px rgba(0,0,0,.28);
  font-weight: 700; line-height: 1.45;
}
.notice.error { background: #9f3545; color: #fff; }
.bootstrap-view { display: grid; place-items: center; align-content: center; gap: .8rem; min-height: 55vh; color: var(--muted); }
.bootstrap-view p { margin: 0; font-size: .82rem; }
.bootstrap-spinner { width: 2rem; height: 2rem; border: 3px solid var(--line); border-top-color: var(--violet); border-radius: 50%; animation: bootstrap-spin .7s linear infinite; }
@keyframes bootstrap-spin { to { transform: rotate(360deg); } }
.auth-card {
  min-height: 72vh; display: grid; grid-template-columns: 1.15fr .85fr; overflow: hidden;
  align-items: stretch; background: var(--panel); border: 1px solid var(--line);
  border-radius: 1.75rem; box-shadow: var(--shadow);
}
.auth-intro { position: relative; overflow: hidden; padding: clamp(3rem, 7vw, 6rem); color: white; background: linear-gradient(145deg, #11182a 0%, #24284d 66%, #513fd3 135%); }
.auth-intro::after { position: absolute; right: -8rem; bottom: -9rem; width: 24rem; height: 24rem; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; content: ""; }
.auth-intro .kicker { color: #a99fff; }
.auth-intro h2 { max-width: 11ch; margin: 1.2rem 0; }
.auth-intro .muted { max-width: 34rem; color: rgba(255,255,255,.68); line-height: 1.7; }
.auth-orbit { display: grid; place-items: center; width: 5rem; height: 5rem; margin-bottom: 4rem; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; }
.auth-orbit span { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--violet); font-size: .75rem; font-weight: 800; }
.login-form { align-content: center; padding: clamp(2rem, 6vw, 5rem); }
.login-form h3 { margin-bottom: 0; font-size: 1.7rem; }
.login-form button[type="submit"] { padding-block: .95rem; box-shadow: 0 10px 24px rgba(91,79,246,.2); }
.hero { display: flex; justify-content: space-between; gap: 2rem; align-items: end; margin-bottom: 2.5rem; }
.hero h2 { margin-bottom: 1rem; }
.layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(18rem, .5fr); gap: 2rem; align-items: start; }
.student-layout > aside { position: sticky; top: 8rem; }
.student-dashboard { display: grid; gap: 1.25rem; }
.dashboard-welcome { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: .25rem .15rem .2rem; }
.dashboard-welcome h2 { max-width: 24ch; margin-bottom: .4rem; font-size: clamp(1.55rem, 2vw, 1.9rem); }
.dashboard-welcome p:last-child { margin-bottom: 0; }
.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;
}
.home-workspaces { display: grid; gap: 1.5rem; }
.home-workspace {
  overflow: hidden; padding: clamp(1.1rem, 2vw, 1.4rem); border: 1px solid var(--line);
  border-radius: 1.1rem; background: var(--panel); box-shadow: 0 8px 22px rgba(23,32,51,.045);
}
.school-workspace { border-top: 4px solid var(--orange); }
.self-study-workspace { border-top: 4px solid var(--violet); }
.workspace-heading { display: grid; grid-template-columns: minmax(0, 1fr); gap: .65rem; margin-bottom: .85rem; }
.workspace-heading .kicker { margin-bottom: .35rem; }
.workspace-heading h2 { max-width: 32ch; margin-bottom: .3rem; font-size: clamp(1.15rem, 1.6vw, 1.3rem); }
.workspace-heading p:last-child { max-width: 48rem; margin-bottom: 0; color: var(--muted); font-size: .8rem; line-height: 1.45; }
.workspace-number {
  display: grid; place-items: center; width: 2.8rem; height: 2.8rem; border-radius: .85rem;
  color: #8c4c25; background: #fff0e5; font-size: .72rem; font-weight: 850;
}
.self-study-workspace .workspace-number { color: var(--green); background: var(--green-2); }
.school-conversation { display: grid; gap: .65rem; padding: .75rem; border-radius: .95rem .95rem 0 0; background: var(--surface-soft); }
.school-message { max-width: min(42rem, 88%); padding: .7rem .8rem; border: 1px solid var(--line); border-radius: .78rem; background: var(--panel); font-size: .82rem; line-height: 1.45; }
.school-message strong { display: block; margin-bottom: .25rem; }
.school-message p { margin-bottom: 0; color: var(--muted); }
.school-message.student { justify-self: end; border-color: transparent; color: white; background: var(--green); }
.school-message.student p { color: white; }
.school-composer { gap: .75rem; padding: .8rem; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 1.1rem 1.1rem; }
.school-course-row { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: .7rem; }
.school-course-row label { gap: .3rem; color: var(--muted); font-size: .76rem; }
.school-course-row select { min-height: 2.65rem; padding-block: .58rem; color: var(--ink); font-size: .82rem; font-weight: 650; }
.school-message-field textarea { min-height: 6rem; border: 0; padding: .65rem; background: transparent; box-shadow: none; }
.school-message-field textarea:focus { outline: 0; }
.school-composer-actions { display: flex; align-items: center; gap: .7rem; padding-top: .65rem; border-top: 1px solid var(--line); }
.school-composer-actions > button { margin-left: auto; }
.attachment-button {
  display: inline-flex; width: auto; padding: .65rem .8rem; border: 1px solid var(--line);
  border-radius: .7rem; color: var(--green); background: var(--surface-soft); cursor: pointer;
}
.school-confirmation, .school-ready, .self-study-panel { margin-top: 1rem; padding: 1.2rem; border: 1px solid var(--line); border-radius: 1.05rem; background: var(--surface-soft); }
.confirmation-intro h3, .confirmation-intro p:last-child { margin-bottom: .35rem; }
.school-task-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: .9rem 0; }
.school-task-summary > div { display: grid; gap: .25rem; padding: .75rem .85rem; border: 1px solid var(--line); border-radius: .7rem; background: var(--panel); }
.school-task-summary span { color: var(--muted); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.school-task-summary strong { font-size: .84rem; line-height: 1.4; }
.school-task-summary > div:nth-child(2), .school-task-summary > div:last-child { grid-column: 1 / -1; }
.school-confirm-actions { justify-content: flex-end; }
.school-ready { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; border-color: #a9d4c1; background: #f4fbf7; }
.school-ready h3, .school-ready p:last-child { margin-bottom: .3rem; }
.school-ready button { flex: 0 0 auto; }
.self-study-entries { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.self-study-entry {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .75rem;
  min-height: 5.5rem; padding: .85rem; border: 1px solid var(--line); color: var(--ink);
  background: var(--surface-subtle); text-align: left;
}
.self-study-entry:hover { border-color: #8b83e7; background: var(--surface-hover); box-shadow: 0 10px 24px rgba(30,36,58,.07); }
.self-study-entry strong, .self-study-entry small { display: block; }
.self-study-entry strong { margin-bottom: .22rem; font-size: .85rem; }
.self-study-entry small { color: var(--muted); font-size: .74rem; font-weight: 500; line-height: 1.4; }
.self-study-entry i { color: var(--muted); font-style: normal; }
.entry-icon { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: .65rem; color: var(--green); background: var(--green-2); font-size: .82rem; font-weight: 850; }
.self-study-panel { background: var(--surface-soft); }
.self-study-panel h3 { margin-bottom: .4rem; }
.panel-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.panel-heading h3 { margin-bottom: .8rem; }
.dashboard-stats { display: grid; grid-template-columns: repeat(3, minmax(6.5rem, 1fr)); min-width: 23rem; overflow: hidden; border: 1px solid var(--line); border-radius: .9rem; background: var(--panel); }
.dashboard-stats div { padding: .8rem 1rem; border-left: 1px solid var(--line); }
.dashboard-stats div:first-child { border-left: 0; }
.dashboard-stats strong { display: block; margin-bottom: .18rem; font-size: 1.15rem; }
.dashboard-stats span { color: var(--muted); font-size: .68rem; }
.tutor-launch-card { position: relative; display: grid; grid-template-columns: minmax(15rem, .62fr) minmax(30rem, 1.38fr); gap: 2rem; padding: 1.5rem; border: 1px solid var(--line); border-radius: 1.25rem; color: var(--ink); background: var(--panel); box-shadow: 0 12px 34px rgba(23,32,51,.06); }
.tutor-launch-card::before { position: absolute; top: 0; bottom: 0; left: 0; width: .3rem; border-radius: 1.25rem 0 0 1.25rem; background: linear-gradient(#6558f6, #8c7df8); content: ""; }
.tutor-launch-copy { position: relative; align-self: center; }
.tutor-launch-copy h2 { max-width: 16ch; margin: .65rem 0; font-size: 1.7rem; }
.tutor-launch-copy > p { max-width: 30rem; margin-bottom: 1rem; color: var(--muted); font-size: .84rem; line-height: 1.55; }
.deeptutor-badge { display: inline-flex; align-items: center; gap: .5rem; color: var(--green); font-size: .65rem; font-weight: 850; letter-spacing: .1em; }
.deeptutor-badge span { width: .5rem; height: .5rem; border-radius: 50%; background: #35b987; box-shadow: 0 0 0 4px rgba(53,185,135,.12); }
.feature-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .75rem; }
.feature-chips span { padding: .38rem .55rem; border: 1px solid var(--line); border-radius: .55rem; color: var(--muted); background: var(--surface-soft); font-size: .66rem; }
.direct-launch-row { display: grid; gap: .45rem; justify-items: start; margin-top: 1rem; }
.direct-launch-row p { margin: 0; color: var(--muted); font-size: .68rem; line-height: 1.4; }
.deeptutor-direct-button { padding: .7rem 1rem; background: var(--green); box-shadow: 0 8px 18px rgba(91,79,246,.18); }
.quick-start-form { position: relative; align-self: center; padding: 1.15rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface-soft); }
.quick-start-form label { color: #4f5a6d; font-size: .72rem; }
.quick-start-form input, .quick-start-form select { min-height: 2.65rem; border-color: var(--line); color: var(--ink); background: var(--control); cursor: pointer; }
.quick-start-form input { cursor: text; }
.quick-start-form select option { color: var(--ink); background: var(--control); }
.quick-start-form input::placeholder { color: #98a1b0; }
.quick-start-row { display: grid; grid-template-columns: .7fr 1.3fr; gap: .75rem; }
.goal-search-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: .75rem; padding: .7rem; border: 1px solid var(--line); border-radius: .8rem; background: var(--panel); }
.goal-search-tools.hidden { display: none; }
.goal-search-tools label { margin: 0; }
.goal-search-tools input { margin-bottom: 0; background: var(--control); }
.goal-search-tools .field-note { float: none; align-self: center; max-width: 10rem; line-height: 1.35; text-align: right; }
.quick-start-footer { display: grid; grid-template-columns: 7rem 1fr; gap: .75rem; align-items: end; }
.quick-start-footer button { min-height: 2.65rem; background: #5b4ff6; box-shadow: 0 8px 18px rgba(91,79,246,.18); }
.field-note { float: right; color: #98a1b0; font-weight: 500; }
.form-hint { margin: -.25rem 0 0; color: #8b94a4; font-size: .64rem; line-height: 1.45; }
.subject-shelf { padding: 1.25rem; border: 1px solid var(--line); border-radius: 1.35rem; background: var(--panel); }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; margin-bottom: 1rem; }
.section-heading h3, .section-heading p { margin-bottom: 0; }
.text-button { padding: .35rem 0; border-radius: 0; color: var(--green); background: transparent; font-size: .8rem; }
.home-subjects { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; }
.home-subject { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .75rem; min-width: 0; padding: .8rem; border: 1px solid var(--line); color: var(--ink); background: var(--surface-subtle); text-align: left; }
.home-subject:hover { border-color: #7770cb; background: var(--surface-hover); box-shadow: 0 10px 24px rgba(30,36,58,.07); }
.home-subject-symbol { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: .75rem; color: #5b4ff6; background: #eeecff; font-size: .82rem; font-weight: 850; }
.home-subject.green .home-subject-symbol { color: #248967; background: #e3f6ef; }
.home-subject.cyan .home-subject-symbol { color: #187b86; background: #e1f7f9; font-size: .62rem; }
.home-subject.orange .home-subject-symbol { color: #b6612f; background: #fff0e5; }
.home-subject.violet .home-subject-symbol { color: #7951b9; background: #f3eaff; }
.home-subject strong, .home-subject small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-subject strong { margin-bottom: .2rem; font-size: .8rem; }
.home-subject small { color: var(--muted); font-size: .66rem; }
.home-subject i { color: #a1a8b6; font-style: normal; }
.dashboard-content { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(18rem, .55fr); gap: 1.5rem; align-items: start; }
.today-column, .tools-column { min-width: 0; }
.today-heading { padding: .7rem .2rem 0; }
.icon-button { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; padding: 0; border: 1px solid var(--line); color: var(--ink); background: var(--panel); font-size: 1.1rem; }
.tools-column { position: sticky; top: 6.6rem; }
.tool-intro-card { padding: 1.2rem; border: 1px solid var(--line); border-left: 4px solid var(--green); border-radius: 1rem; color: var(--ink); background: var(--panel); }
.tool-intro-card .kicker { color: var(--green); }
.tool-intro-card h3 { margin-bottom: .55rem; }
.tool-intro-card .muted { margin-bottom: 0; color: var(--muted); font-size: .78rem; line-height: 1.5; }
.empty-plan { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .9rem; padding: 1.05rem; border: 1px dashed var(--line); border-radius: 1rem; background: var(--panel); }
.empty-plan-icon { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: .75rem; color: #278261; background: #e5f5ee; font-weight: 850; }
.empty-plan strong { display: block; margin-bottom: .2rem; font-size: .82rem; }
.empty-plan p { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.45; }
.learning-tools {
  overflow: hidden; margin: .8rem 0 0; border: 1px solid var(--line); border-radius: 1rem;
  background: var(--panel);
}
.learning-tools > summary {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .75rem; padding: 1rem; cursor: pointer; color: var(--ink); list-style: none;
}
.learning-tools > summary::-webkit-details-marker { display: none; }
.learning-tools > summary::after { content: "+"; color: var(--muted); font-size: 1.2rem; }
.learning-tools[open] > summary::after { content: "–"; }
.learning-tools > summary strong, .learning-tools > summary small { display: block; }
.learning-tools > summary strong { margin-bottom: .18rem; font-size: .82rem; }
.learning-tools > summary small { color: var(--muted); font-size: .68rem; font-weight: 500; }
.tool-icon { display: grid; place-items: center; width: 2.3rem; height: 2.3rem; border-radius: .7rem; color: var(--green); background: var(--green-2); font-size: 1rem; font-weight: 800; }
.learning-tools .panel { margin: 0; border-width: 1px 0 0; border-radius: 0; box-shadow: none; }
.panel { background: var(--panel); border: 1px solid var(--line); padding: 1.35rem; border-radius: 1.2rem; box-shadow: 0 10px 30px rgba(31,49,42,.04); margin-bottom: 1rem; }
.panel.compact { padding: 1rem 1.2rem; }
.panel.compact p { margin-bottom: 0; }
.panel.warning { border-color: var(--orange); background: #fff8ef; }
.panel.optional { border-color: #b8d7c8; background: #f3faf6; }
.active-quick-check {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  margin: 0 0 1rem; padding: 1rem 1.15rem; border: 1px solid #bdb5ff; border-radius: 1rem;
  background: linear-gradient(115deg, rgba(91,79,246,.12), rgba(48,184,139,.1));
}
.active-quick-check > div:first-child { display: grid; gap: .2rem; min-width: 0; }
.active-quick-check p { margin: 0; color: #5b4ff6; }
.active-quick-check strong { overflow-wrap: anywhere; font-size: 1rem; }
.active-quick-check span { color: var(--muted); font-size: .78rem; font-weight: 500; }
.active-quick-check-count { margin-left: .45rem; }
.active-quick-check-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .6rem; }
.session-return-hint { padding: .75rem .85rem; border-radius: .75rem; background: rgba(91,79,246,.1); color: var(--ink); font-size: .86rem; }
.learning-map-panel { max-height: 32rem; overflow: auto; }
.knowledge-progress-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.knowledge-progress-heading h3, .knowledge-progress-heading p { margin-bottom: 0; }
.home-topic-list {
  --knowledge-grid: minmax(18rem, 2.2fr) minmax(7rem, .75fr) minmax(7.5rem, .75fr) minmax(5.5rem, .55fr) minmax(9rem, .95fr) minmax(11rem, 1.1fr) minmax(8.5rem, .75fr);
  overflow: hidden; border: 1px solid var(--line); border-radius: 1rem; background: var(--panel);
}
.knowledge-progress-header,
.knowledge-progress-row {
  display: grid;
  grid-template-columns: var(--knowledge-grid);
  gap: .75rem; align-items: center;
}
.knowledge-progress-header { padding: .65rem 1rem; color: var(--muted); background: var(--surface-soft); font-size: .74rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.knowledge-progress-row { min-height: 4.25rem; padding: .72rem 1rem; border-top: 1px solid var(--line); }
.knowledge-progress-row:first-of-type { border-top: 0; }
.knowledge-progress-name, .knowledge-progress-cell { min-width: 0; }
.knowledge-progress-name > small, .knowledge-progress-cell > small { display: none; }
.knowledge-progress-name strong, .knowledge-progress-cell strong { display: block; overflow-wrap: anywhere; font-size: .9rem; font-weight: 500; line-height: 1.4; }
.knowledge-stage { padding: .28rem .58rem; border-radius: 999px; background: var(--control); color: var(--muted); font-size: .84rem; font-weight: 600; }
.knowledge-progress-row.learning .knowledge-stage,
.knowledge-progress-row.exposed .knowledge-stage,
.knowledge-progress-row.developing .knowledge-stage { background: #e9f2ff; color: #315f99; }
.knowledge-progress-row.proficient .knowledge-stage,
.knowledge-progress-row.mastered .knowledge-stage { background: var(--green-2); color: var(--green); }
.knowledge-progress-row.review_needed .knowledge-stage { background: #fff0df; color: #8a4a15; }
.knowledge-progress-row.check-in-progress { background: rgba(91,79,246,.045); }
.knowledge-progress-row.check-in-progress .knowledge-stage { background: rgba(91,79,246,.14); color: #5145cd; }
.knowledge-progress-row.learning-in-progress { background: rgba(48,184,139,.06); }
.knowledge-progress-row.learning-in-progress .knowledge-stage { background: var(--green-2); color: var(--green); }
.knowledge-progress-row.attention-focus { position: relative; background: rgba(91,79,246,.1); box-shadow: inset .24rem 0 #5b4ff6; }
.knowledge-score { color: var(--ink); font-weight: 500; white-space: nowrap; }
.knowledge-progress-bar { display: block; width: 100%; height: .3rem; margin-top: .3rem; overflow: hidden; border-radius: 999px; background: var(--control); }
.knowledge-progress-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #5b4ff6, var(--green)); }
.knowledge-progress-row .quick-check { padding: .58rem .78rem; white-space: nowrap; font-size: .88rem; }
.knowledge-next-action, .continue-learning, .move-next-point { padding: 0; border: 0; border-radius: .25rem; background: transparent; color: #5b4ff6; font: 500 .9rem/1.4 var(--chloe-font-ui); text-align: left; cursor: pointer; }
.knowledge-next-action:hover, .continue-learning:hover, .move-next-point:hover { color: #4338ca; text-decoration: underline; text-underline-offset: .18rem; }
.knowledge-next-action:focus-visible, .continue-learning:focus-visible, .move-next-point:focus-visible { outline: 3px solid rgba(91,79,246,.22); outline-offset: .2rem; }
.knowledge-next-action:disabled, .continue-learning:disabled, .move-next-point:disabled { color: var(--muted); cursor: wait; text-decoration: none; }
.knowledge-next-cell > span { display: block; overflow-wrap: anywhere; font-size: .9rem; font-weight: 500; line-height: 1.4; }
.wide-panel { grid-column: 1 / -1; }
.wide-dialog { width: min(70rem, 90vw); }
.material-list { max-height: 28rem; overflow: auto; }
.material-chunk { border-top: 1px solid var(--line); padding: 1rem 0; }
.chunk-preview, .assessment-prompt { white-space: pre-wrap; }
.material-chunk, .chunk-preview, .assessment-prompt {
  font-family: var(--chloe-font-reading);
  font-optical-sizing: auto;
}
.source-images {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: .75rem;
  margin-top: .75rem;
}
.source-image {
  width: 100%;
  max-height: 420px;
  object-fit: contain;
  border: 1px solid var(--line);
  border-radius: .75rem;
  background: var(--control);
}
.plan-stream { margin-bottom: 1.5rem; }
.stream-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: .8rem; }
.stream-heading h3, .stream-heading p { margin-bottom: 0; }
.source-badge { border-radius: 999px; padding: .35rem .7rem; font-size: .75rem; font-weight: 800; }
.source-badge.school { background: #f8dec9; color: #7a3e16; }
.source-badge.self-study { background: var(--green-2); color: var(--green); }
.task-list { display: grid; gap: 1rem; }
.task {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1.2rem;
  padding: 1.2rem; background: var(--panel); border: 1px solid var(--line); border-radius: 1rem;
  box-shadow: 0 8px 24px rgba(25,32,52,.04);
}
.task-index { width: 2.6rem; height: 2.6rem; border-radius: .8rem; display: grid; place-items: center; background: var(--green-2); color: var(--green); font-weight: 850; }
.school-rhythm { display: grid; gap: 1.15rem; margin-bottom: 1rem; padding: 1.25rem; }
.rhythm-heading, .rhythm-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.rhythm-heading h2, .rhythm-heading p, .rhythm-section-heading h3 { margin: 0; }
.rhythm-heading { align-items: flex-start; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.rhythm-heading h2 { font-size: clamp(1.45rem, 2.4vw, 1.85rem); font-weight: 560; }
.rhythm-heading .muted { margin-top: .3rem; font-size: .78rem; line-height: 1.5; }
.rhythm-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .5rem; }
.school-date-nav { display: flex; align-items: stretch; gap: .25rem; padding: .25rem; border: 1px solid var(--line); border-radius: .7rem; background: var(--surface-subtle); }
.school-date-field { display: grid; gap: .08rem; margin: 0; color: var(--muted); font-size: .52rem; font-weight: 500; line-height: 1; text-transform: uppercase; letter-spacing: .08em; }
.school-date-field input { min-height: 1.65rem; margin: 0; padding: .12rem .3rem; border: 0; color: var(--ink); background: transparent; font-size: .72rem; font-weight: 500; }
.date-step { width: 1.85rem; min-height: 1.85rem; padding: 0; border: 0; color: var(--green); background: transparent; font-size: 1.15rem; font-weight: 500; }
.date-step:hover { background: var(--surface-hover); transform: none; }
.school-date-nav .text-button { align-self: center; padding: .3rem .45rem; font-size: .68rem; }
.refresh-rhythm { min-height: 2.4rem; padding: .5rem .72rem; font-size: .72rem; }
.rhythm-section-heading { margin-bottom: .55rem; }
.rhythm-section-heading h3 { font-size: .95rem; font-weight: 560; }
.rhythm-section-heading span { color: var(--muted); font-size: .7rem; }
.rhythm-grid { display: flex; flex-direction: column; gap: 1.25rem; }
.rhythm-plan-column { display: grid; gap: 1.15rem; }
.schoolwork-status, .after-school-section { min-width: 0; }
.school-calendar-host .rhythm-grid { gap: 1.25rem; }
.school-calendar-host .timetable-section,
.school-calendar-host .rhythm-plan-column { grid-column: 1 / -1; width: 100%; }
.school-calendar-host .rhythm-plan-column { gap: 0; }
.school-calendar-host .schoolwork-status { padding-top: 1.1rem; border-top: 1px solid var(--line); }
.home-after-school { margin-bottom: 1rem; padding: 1rem 1.25rem; }
.home-after-school .plan-stream { margin-bottom: 0; }
.today-schedule { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.schedule-period { min-width: 0; }
.schedule-period h4 { margin: 0 0 .35rem; color: var(--muted); font-size: .62rem; font-weight: 550; letter-spacing: .08em; text-transform: uppercase; }
.schedule-period-list { border-top: 1px solid var(--line); }
.schedule-slot { display: grid; grid-template-columns: 4.7rem minmax(0, 1fr) auto; gap: .8rem; align-items: center; min-height: 3.75rem; padding: .58rem .15rem; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; color: var(--ink); background: transparent; text-align: left; box-shadow: none; }
.schedule-slot.lesson-slot:hover { color: var(--ink); background: var(--surface-hover); transform: none; }
.schedule-slot time { display: grid; gap: .08rem; color: var(--ink); font-size: .76rem; font-weight: 560; font-variant-numeric: tabular-nums; }
.schedule-slot time small { margin: 0; font-size: .63rem; }
.schedule-course { min-width: 0; }
.schedule-course strong { display: block; overflow: hidden; font-size: .82rem; font-weight: 550; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.schedule-slot small { display: block; margin-top: .12rem; overflow: hidden; color: var(--muted); font-size: .66rem; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.schedule-slot em { color: var(--green); font-size: .65rem; font-style: normal; font-weight: 500; white-space: nowrap; }
.schedule-slot.break { opacity: .58; }
.schedule-slot.break em { color: var(--muted); }
.empty-schedule { padding: 1rem; border-radius: .8rem; background: var(--surface-soft); color: var(--muted); }
.rhythm-plan-column .plan-stream { margin-bottom: 0; }
.plan-stream.compact { display: grid; gap: .4rem; }
.plan-stream.compact .task { grid-template-columns: 1.65rem minmax(0, 1fr) auto; gap: .65rem; padding: .65rem 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
.plan-stream.compact .task-index { width: 1.75rem; height: 1.75rem; border-radius: .55rem; font-size: .75rem; }
.plan-stream.compact .task-main { min-width: 0; }
.plan-stream.compact .task .kicker { margin: 0 0 .12rem; font-size: .54rem; font-weight: 600; line-height: 1.2; }
.plan-stream.compact .task h3 { margin: 0; font-size: .78rem; font-weight: 550; line-height: 1.35; }
.plan-stream.compact .task-meta-row { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem .65rem; margin-top: .28rem; }
.plan-stream.compact .meta { gap: .3rem .65rem; font-size: .68rem; }
.plan-stream.compact .tag { padding: .16rem .4rem; }
.plan-stream.compact .task-actions { display: block; min-width: 7rem; }
.plan-stream.compact .task-actions button { width: 100%; padding: .45rem .62rem; white-space: nowrap; font-size: .68rem; }
.plan-stream.compact .task-more { position: relative; }
.plan-stream.compact .task-more > summary { font-size: .68rem; text-align: left; }
.plan-stream.compact .task-more-panel { position: absolute; z-index: 20; top: calc(100% + .4rem); left: 0; width: min(23rem, 72vw); padding: .75rem; border: 1px solid var(--line); border-radius: .75rem; background: var(--panel); box-shadow: var(--shadow); }
.plan-stream.compact .task-more-panel .topic-row { margin-top: .5rem; }
.plan-stream.compact .empty-plan { gap: .65rem; padding: .7rem; border-style: solid; border-radius: .7rem; background: var(--surface-subtle); }
.plan-stream.compact .empty-plan-icon { width: 1.8rem; height: 1.8rem; border-radius: .55rem; font-size: .75rem; }
.plan-stream.compact .empty-plan strong { margin: 0; font-size: .74rem; }
.plan-stream.compact .empty-plan p { font-size: .68rem; line-height: 1.35; }
.school-calendar-host .school-rhythm { margin: 0 0 1.2rem; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.school-workspace { border-top: 0; }
.panel-soft, .lesson-panel { padding: 1rem; border: 1px solid var(--line); border-radius: .8rem; background: var(--surface-subtle); }
.lesson-study-builder { display: grid; gap: .8rem; margin: 0 0 1rem; padding: 1rem 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; }
.lesson-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.lesson-section-heading h3, .lesson-section-heading p { margin: 0; }
.lesson-section-heading h3 { font-weight: 560; }
.lesson-study-form { display: grid; grid-template-columns: 1.25fr repeat(3, minmax(8rem, .65fr)) auto; gap: .55rem; align-items: end; }
.lesson-study-form label { gap: .25rem; color: var(--muted); font-size: .68rem; font-weight: 500; }
.lesson-study-form input, .lesson-study-form select, .lesson-study-form button { min-height: 2.5rem; }
.lesson-selection-list { display: grid; gap: .35rem; }
.lesson-selection { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .65rem; padding: .6rem 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; font-weight: 400; }
.lesson-selection input { width: 1rem; }
.lesson-selection small { display: block; margin-top: .15rem; color: var(--muted); font-weight: 500; }
.school-assignment-intake { margin-top: 1rem; }
.school-assignment-intake > summary { cursor: pointer; padding: .8rem 0; color: var(--green); font-size: .78rem; font-weight: 550; }
.lesson-workspace { display: grid; gap: 1rem; border-top: 0; }
.lesson-back { justify-self: start; }
.lesson-header { display: flex; align-items: start; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.lesson-header h2, .lesson-header p { margin-bottom: .25rem; }
.lesson-header h2 { font-size: clamp(1.45rem, 2.4vw, 1.9rem); font-weight: 560; }
.lesson-status { padding: .36rem .6rem; border-radius: 999px; color: var(--violet); background: rgba(124,109,248,.1); font-size: .68rem; font-weight: 550; }
.lesson-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.lesson-panel { display: grid; gap: .75rem; }
.lesson-panel h3, .lesson-panel p { margin: 0; }
.lesson-panel h3 { font-size: .98rem; font-weight: 560; }
.lesson-panel > .muted { font-size: .74rem; line-height: 1.55; }
.lesson-reflection-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.lesson-reflection-form label { gap: .25rem; color: var(--muted); font-size: .7rem; font-weight: 500; }
.lesson-reflection-text, .lesson-reflection-form .check-row, .lesson-reflection-form button { grid-column: 1 / -1; }
.check-row { display: flex !important; flex-direction: row; align-items: center; }
.check-row input { width: 1rem; }
.lesson-upload-form { display: grid; gap: .65rem; }
.lesson-upload-form button,
.lesson-reflection-form button,
#lesson-note-save {
  justify-self: start; width: auto; min-height: 2.35rem; padding: .58rem .85rem;
  border: 1px solid var(--line); color: var(--ink); background: var(--control);
  font-size: .72rem; font-weight: 520; box-shadow: none;
}
.lesson-upload-form button:hover,
.lesson-reflection-form button:hover,
#lesson-note-save:hover { border-color: #7770cb; background: var(--surface-hover); }
.lesson-assets { display: grid; gap: .35rem; }
.lesson-asset { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .55rem 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; color: var(--ink); background: transparent; font-size: .74rem; }
.lesson-asset small { color: var(--muted); }
.lesson-note-panel textarea { width: 100%; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .78rem; line-height: 1.55; }
.lesson-knowledge-list { display: grid; gap: .35rem; }
.lesson-knowledge { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .62rem 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; }
.lesson-knowledge small { display: block; margin-top: .12rem; color: var(--muted); }
.lesson-knowledge.confirmed { box-shadow: inset 2px 0 var(--green); padding-left: .65rem; }
.lesson-knowledge.rejected { opacity: .55; }
.knowledge-actions { display: flex; gap: .35rem; }
.knowledge-actions button { min-height: 0; padding: .4rem .55rem; font-size: .68rem; }
.lesson-primary-actions { display: flex; justify-content: flex-end; }
.plan-stream.compact .empty-plan .text-button { font-size: .7rem; white-space: nowrap; }
.task h3 { margin-bottom: .3rem; }
.task-actions { display: grid; gap: .55rem; min-width: 9rem; }
.task-more > summary { cursor: pointer; color: var(--green); font-size: .82rem; font-weight: 750; text-align: center; }
.task-more[open] { display: grid; gap: .4rem; }
.task-rationale { margin: .6rem 0 0; color: var(--muted); font-size: .78rem; line-height: 1.4; }
.task-more button { margin-top: .45rem; width: 100%; }
.meta { display: flex; flex-wrap: wrap; gap: .5rem 1rem; color: var(--muted); font-size: .86rem; }
.tag { background: #eef1f6; border-radius: 999px; padding: .25rem .55rem; }
.topic-row { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .75rem; }
.tag.topic { background: #e9f2ff; color: #315f99; }
.session-shell { width: min(850px, 100%); margin: 2rem auto; }
.stage { display: inline-block; background: var(--green-2); color: var(--green); padding: .35rem .7rem; border-radius: 999px; font-weight: 750; }
.chat { display: grid; gap: 1rem; min-height: 12rem; margin: 2rem 0; }
.bubble { max-width: 85%; padding: 1rem 1.15rem; border-radius: 1.2rem; white-space: pre-wrap; line-height: 1.55; }
.bubble.student { margin-left: auto; background: var(--green); color: white; border-bottom-right-radius: .3rem; }
.bubble.tutor { background: var(--panel); border: 1px solid var(--line); border-bottom-left-radius: .3rem; font-family: var(--chloe-font-reading); font-optical-sizing: auto; }
.action-row { display: flex; flex-wrap: wrap; gap: .7rem; }
.parent-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.parent-grid .panel:last-child { grid-column: 1 / -1; }
.approval { border-top: 1px solid var(--line); padding: 1rem 0; }
.approval-actions { display: flex; gap: .5rem; }
.status-row { display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); padding: .65rem 0; }
.mastery { border-top: 1px solid var(--line); padding: .8rem 0; }
.journey-hero {
  display: grid; grid-template-columns: 1fr auto; gap: 1.5rem; align-items: end; margin-bottom: 1.25rem;
  padding: clamp(1.25rem, 3vw, 2rem); border-radius: 1.4rem; color: white;
  background:
    radial-gradient(circle at 82% 20%, rgba(255,255,255,.18), transparent 18rem),
    linear-gradient(135deg, #193e35, #26745c 64%, #ef8d4d 160%);
  box-shadow: var(--shadow);
}
.journey-hero .kicker, .journey-hero .muted { color: rgba(255,255,255,.72); }
.journey-hero h2 { max-width: none; margin-bottom: .5rem; font-size: clamp(1.4rem, 2vw, 1.75rem); }
.journey-progress {
  min-width: 8rem; padding: .85rem; text-align: center; border: 1px solid rgba(255,255,255,.25);
  border-radius: 1rem; background: rgba(255,255,255,.1); backdrop-filter: blur(8px);
}
.journey-progress strong { display: block; font-family: var(--chloe-font-reading); font-size: 1.7rem; }
.journey-progress span { font-size: .76rem; color: rgba(255,255,255,.76); }
.subject-tabs { display: flex; gap: .55rem; margin: 0 0 .85rem; overflow-x: auto; padding-bottom: .2rem; }
.subject-tab {
  display: flex; align-items: center; gap: .5rem; padding: .62rem .85rem; background: var(--panel); color: var(--muted);
  border: 1px solid var(--line); border-radius: .72rem; white-space: nowrap; font-size: .84rem;
}
.subject-tab span { display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: #ece9df; color: var(--ink); }
.subject-tab:hover { border-color: #7c6df8; background: var(--surface-hover); transform: none; }
.subject-tab.active { background: #5b4ff6; color: #fff; border-color: #5b4ff6; box-shadow: 0 6px 16px rgba(91,79,246,.25); }
.subject-tab.active span { background: rgba(255,255,255,.2); color: #fff; }
.home-learning-picker { display: grid; gap: .9rem; padding: 1rem; }
.home-picker-grid { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: .8rem; }
.home-learning-picker label { gap: .35rem; color: var(--muted); font-size: .78rem; }
.home-learning-picker select { min-height: 2.75rem; padding-block: .62rem; color: var(--ink); font-size: .84rem; font-weight: 650; }
.home-learning-picker .form-hint { margin: -.1rem 0 0; }
.home-topic-field { display: grid; gap: .55rem; }
.home-topic-field h3 { margin: 0; color: var(--muted); font-size: .78rem; }
.home-topic-item, .home-topic-empty {
  min-height: 2.65rem; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: .65rem;
  background: var(--surface-soft); color: var(--ink); font-size: .82rem; font-weight: 650;
}
.home-topic-empty { color: var(--muted); font-weight: 550; }
.journey-summary { display: grid; grid-template-columns: minmax(0, 1fr) minmax(15rem, .7fr); gap: 2rem; align-items: center; padding: 1.6rem; }
.journey-summary h3, .journey-summary p { margin-bottom: .35rem; }
.journey-bar { height: .8rem; border-radius: 999px; background: #e7e4da; overflow: hidden; }
.journey-bar span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--orange), #f1b84b); transition: width .5s ease; }
.journey-map { position: relative; display: grid; gap: .9rem; margin: 1.4rem 0; }
.journey-map::before { content: ""; position: absolute; left: 1.55rem; top: 2rem; bottom: 2rem; width: 2px; background: var(--line); z-index: -1; }
.checkpoint {
  display: grid; grid-template-columns: 3.2rem 1fr; gap: 1rem; padding: 1.2rem;
  border: 1px solid var(--line); border-radius: 1.25rem; background: var(--panel); box-shadow: 0 8px 24px rgba(31,49,42,.04);
}
.checkpoint-marker { display: flex; justify-content: center; }
.checkpoint-marker span {
  display: grid; place-items: center; width: 3.1rem; height: 3.1rem; border-radius: 50%;
  background: #ebe8de; border: 4px solid var(--paper); color: var(--muted); font-size: .78rem; font-weight: 850;
}
.checkpoint.learning { border-color: #e5b681; background: #fffaf2; }
.checkpoint.learning .checkpoint-marker span { background: #f9d7ad; color: #754219; }
.checkpoint.review { border-color: #dfa89e; background: #fff7f5; }
.checkpoint.review .checkpoint-marker span { background: #f4d2cb; color: var(--red); }
.checkpoint.passed { border-color: #9dc8b2; background: #f5fbf7; }
.checkpoint.passed .checkpoint-marker span { background: var(--green); color: white; }
.checkpoint-heading { display: flex; justify-content: space-between; gap: 1rem; align-items: start; }
.checkpoint-heading h3, .checkpoint-heading p { margin-bottom: .25rem; }
.checkpoint-status { border-radius: 999px; padding: .35rem .65rem; background: #ece9df; color: var(--muted); font-size: .72rem; font-weight: 800; white-space: nowrap; }
.checkpoint.learning .checkpoint-status { background: #f9d7ad; color: #754219; }
.checkpoint.review .checkpoint-status { background: #f4d2cb; color: var(--red); }
.checkpoint.passed .checkpoint-status { background: var(--green-2); color: var(--green); }
.checkpoint-details { margin-top: .5rem; }
.checkpoint-details summary { cursor: pointer; color: var(--green); font-size: .84rem; font-weight: 750; }
.checkpoint-skills { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.skill-chip { display: inline-flex; align-items: center; gap: .4rem; padding: .4rem .6rem; border-radius: .7rem; background: #efede6; color: var(--muted); font-size: .78rem; }
.skill-chip i { width: .5rem; height: .5rem; border-radius: 50%; background: #b5bbb7; }
.skill-chip.learning i { background: var(--orange); }
.skill-chip.review i { background: var(--red); }
.skill-chip.passed i { background: var(--green); }
.skill-chip.more { color: var(--green); font-weight: 750; }
.next-checkpoint { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.6rem; border-color: #e5b681; background: #fff8ef; }
.next-checkpoint h3, .next-checkpoint p { margin-bottom: .3rem; }
.journey-loading { display: flex; align-items: center; justify-content: center; gap: .8rem; min-height: 8rem; }
.journey-loading p { margin: 0; }
.journey-loading span { width: 1rem; height: 1rem; border-radius: 50%; background: var(--orange); animation: pulse 1s ease-in-out infinite alternate; }
@keyframes pulse { to { transform: scale(1.6); opacity: .35; } }
.ok { color: var(--green); font-weight: 750; }
.bad { color: var(--red); font-weight: 750; }
code { display: block; overflow-wrap: anywhere; padding: .8rem; background: #eee9dc; border-radius: .6rem; margin-bottom: 1rem; }
footer { border-top: 1px solid rgba(24,32,29,.12); border-bottom: 0; color: var(--muted); font-size: .8rem; }
dialog {
  width: min(92vw, 30rem); border: 0; border-radius: 1.25rem; padding: 0;
  color: var(--ink); background: var(--panel);
  box-shadow: 0 24px 80px rgba(22,34,31,.25);
}
dialog::backdrop { background: rgba(18,30,27,.52); backdrop-filter: blur(4px); }
.dialog-form { display: grid; gap: 1rem; padding: 2rem; }

:root[data-theme="dark"] .panel.warning,
:root[data-theme="dark"] .next-checkpoint { border-color: #76583c; background: #2c241d; }
:root[data-theme="dark"] .panel.optional { border-color: #3d6859; background: #172821; }
:root[data-theme="dark"] .source-badge.school { background: #4a3021; color: #ffc69f; }
:root[data-theme="dark"] .tag { background: #252e43; }
:root[data-theme="dark"] .tag.topic { background: #1b304b; color: #9cc9ff; }
:root[data-theme="dark"] .subject-tab span,
:root[data-theme="dark"] .checkpoint-status,
:root[data-theme="dark"] .skill-chip,
:root[data-theme="dark"] code { background: #242c40; }
:root[data-theme="dark"] .subject-tab.active span { background: rgba(255,255,255,.18); color: #fff; }
:root[data-theme="dark"] .journey-bar { background: #30384b; }
:root[data-theme="dark"] .checkpoint-marker span { background: #283147; }
:root[data-theme="dark"] .checkpoint.learning { border-color: #76583c; background: #2c241d; }
:root[data-theme="dark"] .checkpoint.review { border-color: #70424a; background: #2c1d22; }
:root[data-theme="dark"] .checkpoint.passed { border-color: #376753; background: #172821; }
:root[data-theme="dark"] .checkpoint.learning .checkpoint-marker span,
:root[data-theme="dark"] .checkpoint.learning .checkpoint-status { background: #5a4027; color: #ffd1a5; }
:root[data-theme="dark"] .checkpoint.review .checkpoint-marker span,
:root[data-theme="dark"] .checkpoint.review .checkpoint-status { background: #542d36; color: #ffb1bb; }
:root[data-theme="dark"] .home-subject.green .home-subject-symbol,
:root[data-theme="dark"] .empty-plan-icon { background: #173d31; color: #75d5b2; }
:root[data-theme="dark"] .home-subject.cyan .home-subject-symbol { background: #163942; color: #72dce7; }
:root[data-theme="dark"] .home-subject.orange .home-subject-symbol { background: #493023; color: #ffc09a; }
:root[data-theme="dark"] .home-subject.violet .home-subject-symbol { background: #34284d; color: #c5a7ff; }
:root[data-theme="dark"] .workspace-number { color: #ffc09a; background: #493023; }
:root[data-theme="dark"] .school-ready { border-color: #376753; background: #172821; }

@media (max-width: 1100px) {
  .dashboard-welcome { align-items: flex-start; flex-direction: column; }
  .dashboard-stats { width: 100%; min-width: 0; }
  .tutor-launch-card { grid-template-columns: 1fr; }
  .tutor-launch-copy h2 { max-width: 16ch; }
  .home-subjects { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lesson-study-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
  .topbar { display: flex; flex-wrap: wrap; gap: .8rem; }
  .brand { min-width: 0; flex: 1; }
  .student-nav { order: 3; width: 100%; }
  .student-nav .nav-button { flex: 1; }
  .auth-card, .layout, .parent-grid, .journey-summary, .dashboard-content { grid-template-columns: 1fr; }
  .home-picker-grid { grid-template-columns: 1fr; }
  .rhythm-grid, .today-schedule { grid-template-columns: 1fr; }
  .lesson-detail-grid, .lesson-reflection-form, .lesson-study-form { grid-template-columns: 1fr; }
  .lesson-reflection-text, .lesson-reflection-form .check-row, .lesson-reflection-form button { grid-column: auto; }
  .rhythm-heading { align-items: flex-start; flex-direction: column; }
  .rhythm-actions { width: 100%; justify-content: space-between; }
  .active-quick-check { align-items: flex-start; flex-direction: column; }
  .active-quick-check-actions { justify-content: flex-start; }
  .knowledge-progress-heading { align-items: flex-start; flex-direction: column; }
  .knowledge-progress-header { display: none; }
  .knowledge-progress-row { grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(6rem, .75fr)); }
  .knowledge-progress-name { grid-column: 1 / -1; }
  .knowledge-progress-name > small, .knowledge-progress-cell > small { display: block; margin-bottom: .18rem; color: var(--muted); font-size: .62rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
  .knowledge-progress-row .quick-check { justify-self: start; }
  .auth-intro { padding: 2.2rem; }
  .auth-orbit { margin-bottom: 2.5rem; }
  .login-form { padding: 2.2rem; }
  .dashboard-welcome h2 { font-size: 1.7rem; }
  .tutor-launch-card { padding: 1.35rem; border-radius: 1.25rem; }
  .quick-start-row { grid-template-columns: 1fr; }
  .self-study-entries { grid-template-columns: 1fr; }
  .school-task-summary { grid-template-columns: 1fr; }
  .school-task-summary > div { grid-column: auto !important; }
  .school-course-row { grid-template-columns: 1fr; }
  .home-subjects { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tools-column { position: static; }
  .student-layout > aside { position: static; }
  .parent-grid .panel:last-child { grid-column: auto; }
  .hero { align-items: start; flex-direction: column; }
  .task { grid-template-columns: auto 1fr; }
  .task-actions { grid-column: 1 / -1; }
  .plan-stream.compact .task { grid-template-columns: 1.75rem minmax(0, 1fr) auto; }
  .plan-stream.compact .task-actions { grid-column: auto; }
  .journey-hero { grid-template-columns: 1fr; }
  .journey-progress { justify-self: start; }
  .checkpoint-heading, .next-checkpoint { align-items: flex-start; flex-direction: column; }
  footer { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 520px) {
  main { width: min(100% - 1.25rem, 1320px); padding-top: 1.25rem; }
  .topbar { padding-inline: .75rem; }
  .brand { min-width: 0; gap: .5rem; }
  .brand-mark { width: 2.1rem; height: 2.1rem; }
  .brand h1 { font-size: .84rem; }
  .userbar { gap: .6rem; }
  .account-menu summary { min-width: 0; font-size: .78rem; }
  .account-menu-panel { width: min(14rem, calc(100vw - 1.5rem)); }
  .dashboard-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dashboard-stats div { padding: .8rem .7rem; }
  .dashboard-stats span { font-size: .6rem; }
  .dashboard-stats strong { font-size: 1.15rem; }
  .tutor-launch-copy > p, .feature-chips { display: none; }
  .optional-focus:not(.required-focus) { display: none; }
  .goal-search-tools { grid-template-columns: 1fr; }
  .goal-search-tools .field-note { max-width: none; text-align: left; }
  .quick-start-footer { grid-template-columns: 1fr; }
  .workspace-heading { grid-template-columns: 1fr; }
  .school-composer-actions { align-items: stretch; flex-wrap: wrap; }
  .school-composer-actions > button { width: 100%; margin-left: 0; }
  .school-ready { align-items: stretch; flex-direction: column; }
  .home-subjects { grid-template-columns: 1fr; }
  .knowledge-progress-row { grid-template-columns: 1fr; }
  .knowledge-progress-name { grid-column: auto; }
  .empty-plan { grid-template-columns: auto 1fr; }
  .empty-plan .text-button { grid-column: 1 / -1; justify-self: start; }
  .school-date-nav { width: 100%; }
  .school-date-field { flex: 1; }
  .school-date-field input { width: 100%; }
  .refresh-rhythm { width: 100%; }
  .schedule-slot { grid-template-columns: 4.1rem minmax(0, 1fr); gap: .65rem; }
  .schedule-slot em { grid-column: 2; margin-top: -.25rem; }
  .plan-stream.compact .task { grid-template-columns: 1.65rem minmax(0, 1fr); }
  .plan-stream.compact .task-actions { grid-column: 2; justify-self: start; }
  .plan-stream.compact .task-actions button { width: auto; }
  .plan-stream.compact .task-more-panel { position: static; width: 100%; margin-top: .4rem; box-shadow: none; }
}
