/* Home School's own visual system. The shared base only supplies learning UI. */
/* IBM Plex Sans Thai is self-hosted (OFL). See fonts/OFL.txt. */
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-thai-400.woff2") format("woff2");
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-thai-500.woff2") format("woff2");
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-thai-600.woff2") format("woff2");
  unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-ext-400.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-ext-500.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-ext-600.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-400.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-500.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/ibm-plex-sans-thai-latin-600.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  color-scheme: light;
  --bg: #f7f8f4;
  --surface: #fff;
  --surface-raised: #f0f4ec;
  --line: #dce3d8;
  --line-soft: #e8ece4;
  --text: #233729;
  --muted: #536451;
  --quiet: #596853;
  --accent: #2e6449;
  --accent-hover: #244e39;
  --accent-soft: #eaf1e5;
  --accent-soft-2: #dfe9d8;
  --accent-ink: #fff;
  --ring: #326c50;
  --danger: #a52e28;
  --radius: 14px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --gutter: 40px;
  --section-gap: 32px;
  --tab-bar: 64px;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --display-size: 34px;
  font-family: "IBM Plex Sans Thai", system-ui, "Leelawadee UI", Tahoma, sans-serif;
}
html { background: var(--bg); scroll-padding-top: 155px; }
body.homeschool-app { min-height: 100vh; min-height: 100dvh; font-family: "IBM Plex Sans Thai", system-ui, "Leelawadee UI", Tahoma, sans-serif; font-size: 16px; line-height: 1.6; font-weight: 400; }
.homeschool-app button, .homeschool-app .button, .homeschool-app input, .homeschool-app select { min-height: 44px; }
.homeschool-app h1, .homeschool-app h2, .homeschool-app h3, .homeschool-app h4 { color: var(--text); letter-spacing: -.025em; line-height: 1.4; }
.homeschool-app input, .homeschool-app select, .homeschool-app textarea { font-size: 16px; background: var(--surface); color: var(--text); border-color: var(--line); }
.homeschool-app .learning-form input:not([type="checkbox"]), .homeschool-app .learning-form select, .homeschool-app .learning-form textarea,
.homeschool-app .hs-setup-step > select, .homeschool-app .hs-setup-area select, .homeschool-app .hs-guardian-settings select { border: 1px solid #85947e; }
.homeschool-app input[type="checkbox"] { min-height: 20px; width: 20px; height: 20px; accent-color: var(--accent); }
.homeschool-app [hidden], body.homeschool-app #homeSchool[hidden] { display: none !important; }
.homeschool-app svg { width: 23px; height: 23px; flex: 0 0 auto; }
.homeschool-app :focus-visible { outline: 3px solid var(--ring); outline-offset: 4px; }
.homeschool-app :focus { scroll-margin-top: 155px; scroll-margin-bottom: 110px; }
.homeschool-header { position: sticky; top: 0; z-index: 35; display: flex; align-items: center; gap: 12px; min-height: calc(76px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) max(24px, env(safe-area-inset-right)) 0 max(24px, env(safe-area-inset-left)); background: var(--bg); border-bottom: 1px solid var(--line); }
.homeschool-header .brand { margin-right: auto; font-size: 22px; gap: 10px; letter-spacing: -.055em; }
.homeschool-header .brand > span { display: inline; }
.homeschool-header .brand-mark { width: 32px; height: 32px; border: none; border-radius: 10px; background: var(--accent); color: #fff; display: grid; place-items: center; }
.homeschool-header button, .homeschool-header .account { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 10px; background: transparent; color: var(--text); font-size: 14px; font-weight: 600; text-decoration: none; }
.homeschool-header .account { margin: 0; }
.homeschool-header-actions { display: flex; align-items: center; gap: 10px; }
.homeschool-main { width: min(100%, 1104px); margin: 0 auto; padding: var(--space-7) var(--gutter) var(--space-9); }
.homeschool-header button:hover, .homeschool-header .account:hover { background: var(--surface-raised); }
.homeschool-app .layout, body.homeschool-app.homeschool-route .layout { min-height: calc(100vh - 76px); padding: 36px 32px 72px; }
.homeschool-app .watch-column, body.homeschool-app.homeschool-route .watch-column { width: 100%; max-width: 1040px; margin: 0 auto; }
body.homeschool-app.homeschool-route #homeSchool { max-width: none; padding: 0 0 20px; border: none; }
.homeschool-app .saved-head { align-items: center; gap: 20px; margin-bottom: 28px; }
.homeschool-app .saved-head h2, .homeschool-app .saved-head h1 { font-size: var(--display-size); font-weight: 600; line-height: 1.4; margin: 0; max-width: none; }
.homeschool-app .eyebrow { color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .12em; margin-bottom: 10px; }
.homeschool-app .private-badge { color: var(--accent); background: #eaf1e5; border: 1px solid #ccd9c4; white-space: nowrap; font-size: 12px; padding: 5px 10px; border-radius: 8px; }
.homeschool-app .hs-profile-button { background: #fff; color: var(--text); border-radius: 10px; border-color: var(--line); }
.homeschool-app .hs-header-actions { align-items: center; gap: 10px; }
.homeschool-app .hs-nav { position: static; flex: 1 1 auto; justify-content: center; z-index: 1; background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; gap: 4px; margin: 0; min-width: 0; backdrop-filter: none; }
.homeschool-app .hs-nav-btn { flex: 0 1 auto; flex-direction: row; gap: 8px; min-height: 44px; padding: 8px 10px; border: 0; border-bottom: 2px solid transparent; border-radius: var(--radius-sm); font-size: 14px; line-height: 1.3; color: var(--muted); font-weight: 600; }
.homeschool-app .hs-nav-btn [aria-hidden] { display: inline-flex; }
.homeschool-app .hs-nav-btn:hover { background: #edf1e8; color: var(--text); }
.homeschool-app .hs-nav-btn[aria-current="page"] { background: transparent; color: var(--accent); border-bottom-color: var(--accent); }
.homeschool-app #hsLangToggle, .homeschool-app #hsGuardianBtn { display: none; }
.homeschool-app .button { min-height: 46px; padding: 10px 19px; font-size: 15px; font-weight: 650; border-radius: 10px; text-decoration: none; }
.homeschool-app .button-primary { background: var(--accent); color: #fff; border: 1px solid var(--accent); }
.homeschool-app .button-primary:hover { background: var(--accent-hover); }
.homeschool-app .button-secondary { background: #fff; color: var(--text); border: 1px solid #bccab7; }
.homeschool-app .button-secondary:hover { background: #edf2e8; }
.homeschool-app .text-button { color: var(--accent); }
.homeschool-app .danger-text { color: var(--danger); }
.hs-startup, #hsStartup { max-width: 700px; margin: 55px auto 60px; padding: clamp(24px, 6vw, 58px); border: 1px solid var(--line); border-radius: 24px; background: var(--surface); }
#hsStartup h1 { font-size: clamp(32px, 5vw, 52px); max-width: 13ch; margin: 14px 0 20px; line-height: 1.4; font-weight: 600; }
#hsStartup p { color: var(--muted); max-width: 43ch; margin: 0 0 28px; }
#hsStartup .button { display: inline-flex; align-items: center; justify-content: center; }
.hs-startup-features { display: flex; flex-wrap: wrap; gap: 10px 20px; margin: 28px 0 0; padding: 24px 0 0; list-style: none; border-top: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.hs-assistant { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); margin: 0 0 25px; padding: 0 18px; }
.hs-assistant > summary { min-height: 52px; display: list-item; align-content: center; cursor: pointer; color: var(--muted); font-size: 14px; padding: 14px 0; }
.hs-assistant[open] { padding-bottom: 18px; }
.hs-resources { margin-top: 24px; border: 1px solid var(--line); padding: 4px 20px 20px; border-radius: 14px; background: var(--surface); }
.hs-resources > summary { min-height: 52px; padding: 14px 0; cursor: pointer; font-weight: 600; }
.hs-resources:not([open]) { padding-bottom: 4px; }
.hs-resource { padding: 18px 0; border-top: 1px solid var(--line); }
.hs-resource a { color: var(--accent); font-weight: 650; overflow-wrap: anywhere; }
.hs-resource p { color: var(--muted); font-size: 14px; margin: 4px 0 0; overflow-wrap: anywhere; }
.hs-assistant .learn-ask { margin-top: 8px; }
.homeschool-app .learning-onboarding { max-width: 640px; margin: 0 auto; padding: clamp(22px, 4vw, 36px); border: 1px solid var(--line); border-radius: 20px; background: #fff; display: block; }
.homeschool-app .learning-onboarding h3 { font-size: clamp(24px, 3vw, 30px); margin: 0 0 12px; }
.homeschool-app .learning-onboarding p { color: var(--muted); max-width: 50ch; }
.homeschool-app .learning-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.hs-setup-step { display: grid; gap: 10px; }
.hs-setup-step > label { font-weight: 600; font-size: 15px; }
.hs-setup-step > select { width: 100%; min-height: 50px; margin-bottom: 10px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.hs-setup-step > .button { margin-top: 10px; }
.hs-setup-progress { font-size: 13px; color: var(--accent) !important; font-weight: 650; margin: 10px 0; }
.homeschool-app .learning-interests { margin: 0; padding: 0; gap: 10px; }
.homeschool-app .learning-interests legend { font-size: 16px; margin-bottom: 12px; }
.homeschool-app .learning-interests > label { min-height: 48px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; background: #f8faf5; font-size: 15px; }
.homeschool-app .learning-interests > label:focus-within { outline: 2px solid var(--ring); outline-offset: 2px; }
.homeschool-app .learning-interests .learning-custom-interest { flex-basis: 100%; padding: 0; background: transparent; }
.homeschool-app #learningCustomInterests { min-height: 48px; width: 100%; background: #fff; border: 0; border-radius: 10px; padding: 10px 12px; }
.hs-setup-area { margin: 10px 0; font-size: 14px; }
.hs-setup-area summary { min-height: 44px; padding: 10px 0; cursor: pointer; color: var(--muted); }
.hs-setup-area label { display: block; margin: 8px 0; }
.hs-setup-area select { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px; }
.hs-setup-actions { display: flex; gap: 12px; justify-content: space-between; margin-top: 12px; }
.hs-setup-actions .button-primary { flex: 1; }
.homeschool-app .hs-today-grid { grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 32px; }
.homeschool-app .hs-today-card { padding: 24px; gap: 12px; border-radius: 18px; box-shadow: none; background: #fff; }
.homeschool-app .hs-today-card:first-child { grid-column: 1 / -1; background: #eaf1e5; border-color: #cddbc5; padding: clamp(24px, 4vw, 36px); }
.homeschool-app .hs-today-card:first-child h3 { color: var(--accent); font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }
.homeschool-app .hs-today-card:first-child .hs-today-card-head { margin: 8px 0 24px; gap: 20px; }
.homeschool-app .hs-today-card:first-child .hs-today-card-head strong { font-size: clamp(23px, 3vw, 31px); font-weight: 650; }
.homeschool-app .hs-today-card h3 { font-size: 19px; }
.homeschool-app .hs-today-card p { margin: 8px 0 16px; font-size: 15px; color: var(--muted); }
.homeschool-app .hs-today-card:not(:first-child) .button { background: #fff; color: var(--accent); border: 1px solid #bccab7; }
.homeschool-app .mastery-ring { background: conic-gradient(var(--accent) calc(var(--pct) * 1%), #d2dec9 0); }
.homeschool-app .mastery-ring::after { background: #eaf1e5; }
.homeschool-app .learning-companion, .homeschool-app .project-hero, .homeschool-app .hs-skill-detail, .homeschool-app .hs-practice-card, .homeschool-app .learning-guardian, .homeschool-app .hs-subject-block, .homeschool-app .my-learning, .homeschool-app .hs-local-week, .homeschool-app .other-projects { background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: none; padding: clamp(18px, 3vw, 28px); }
.homeschool-app .hs-skill-row { background: #f8faf6; padding: 14px; border-color: var(--line); border-radius: 12px; text-align: left; }
.homeschool-app .hs-skill-row.is-recommended { background: #eaf1e5; border-color: #b6cba9; }
.homeschool-app .hs-skill-row.is-locked { opacity: .8; }
.homeschool-app .hs-skill-main strong { font-size: 16px; }
.homeschool-app .hs-practice-choice { min-height: 52px; background: #f8faf6; font-size: 16px; }
.homeschool-app .hs-practice-choice:hover { background: #eef4e9; }
.homeschool-app .hs-practice-choice.is-correct { background: #e6f2df; color: #244523; border-color: #6b915d; }
.homeschool-app .hs-practice-choice.is-wrong { background: #fbeceb; color: #832c26; border-color: #b1675f; }
.homeschool-app .learning-video, .homeschool-app .hs-today-video { background: #fff; border-color: var(--line); border-radius: 12px; }
.homeschool-app .learning-video .learning-video-meta, .homeschool-app .hs-today-video small { font-size: 13px; }
.homeschool-app .hs-sheet-overlay { background: #18231766; z-index: 60; }
.homeschool-app .hs-sheet { background: var(--surface); box-shadow: 0 20px 80px #23372926; max-height: 90vh; max-height: 90dvh; border-color: var(--line); }
.homeschool-app .hs-sheet-close { color: var(--text); background: var(--surface-raised); }
.homeschool-app .hs-panel { min-width: 0; }
.homeschool-app .hs-guardian-settings { display: grid; gap: 12px; }
.homeschool-app .hs-guardian-settings label { display: grid; gap: 6px; }
.homeschool-app .hs-guardian-settings select { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 10px; }
.homeschool-app .learning-settings-toggle, .homeschool-app .learning-check { font-size: 15px; gap: 12px; }
.homeschool-footer { max-width: 1040px; margin: 0 auto; padding: 20px 32px 32px; color: var(--muted); font-size: 13px; display: flex; flex-wrap: wrap; gap: 18px; border-top: 1px solid var(--line); }
.homeschool-footer p { margin: 0; flex: 1 1 240px; }
.homeschool-footer a { color: var(--muted); }
.homeschool-footer summary { min-height: 44px; cursor: pointer; display: list-item; padding: 10px 0; }
.homeschool-app .hs-skill-main, .homeschool-app .hs-interest-header, .homeschool-app .hs-today-card > div { min-width: 0; }
.homeschool-app .learning-watch-status, .homeschool-app .subtle { color: var(--muted); }
.homeschool-app .hs-skill-meta { font-size: 13px; }
.homeschool-app .hs-learn-interests { margin-bottom: 32px; }
.homeschool-app .hs-interest-practice { padding: clamp(16px, 3vw, 26px); border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.homeschool-app .hs-interest-practice h3 { margin-top: 0; }
.homeschool-app .hs-skill-video-status { font-size:12px; color:#48684f; margin-top:5px; }
.hs-more-relation { color:#d5e9c5; font-weight:650; }
.homeschool-app .hs-inquiry { padding:clamp(18px,3vw,30px); background:#fff; border:1px solid var(--line); border-radius:18px; }
.homeschool-app .hs-inquiry h3 { margin:0 0 10px; font-size:clamp(23px,3vw,32px); }
.homeschool-app .hs-inquiry-eyebrow { color:#365944; font-size:12px; font-weight:750; letter-spacing:.1em; }
.homeschool-app .hs-inquiry-focus { font-weight:650; }
.homeschool-app .hs-inquiry-situation { padding:18px; background:#edf4e8; border-radius:12px; margin:20px 0; }
.homeschool-app .hs-inquiry-situation p { margin-bottom:0; }
.homeschool-app .hs-inquiry :is(p,blockquote) { overflow-wrap:anywhere; white-space:pre-line; }
.homeschool-app .hs-inquiry :is(details,nav) { margin:18px 0; }
.homeschool-app .hs-inquiry summary { cursor:pointer; padding:12px 0; min-height:44px; font-weight:650; }
.homeschool-app .hs-inquiry-reading blockquote { max-height:240px; overflow:auto; padding:12px; margin:12px 0; background:#f7f8f4; }
.homeschool-app .hs-inquiry-steps { display:grid; gap:8px; }
.homeschool-app .hs-inquiry-steps label { font-size:14px; }
.homeschool-app .hs-inquiry-steps select { box-sizing:border-box; width:100%; min-height:48px; padding:10px; font:inherit; background:#f6f7f2; color:#304337; border:1px solid var(--line); border-radius:10px; }
.homeschool-app .hs-inquiry > label { display:block; font-size:20px; font-weight:700; }
.homeschool-app .hs-inquiry textarea { display:block; box-sizing:border-box; width:100%; min-height:150px; resize:vertical; font:inherit; line-height:1.7; padding:14px; border:1px solid #8a9e8d; border-radius:12px; background:#fff; color:#203427; }
.homeschool-app .hs-inquiry textarea:focus-visible { outline:3px solid #699d76; outline-offset:3px; }
.homeschool-app .hs-inquiry-actions { display:flex; flex-wrap:wrap; gap:10px; }
.homeschool-app .hs-inquiry-consent { display:flex; align-items:flex-start; gap:12px; line-height:1.7; margin:10px 0 18px; }
.homeschool-app .hs-inquiry-consent input { flex:0 0 22px; width:22px; height:22px; margin-top:3px; }
.homeschool-app .hs-inquiry-feedback { border-left:3px solid #658b68; padding:2px 18px; margin-top:18px; }
.homeschool-app .hs-inquiry-status { min-height:1.6em; }
.homeschool-app .hs-foundations > summary { cursor:pointer; min-height:48px; padding:16px 0; font-weight:650; }
@media(max-width:480px) { .homeschool-app .hs-inquiry-actions button { flex:1 1 auto; } }
.homeschool-app .hs-interest-reading { padding: 16px; margin: 16px 0; background: #f1f6ec; border-radius: 12px; }
.homeschool-app .hs-interest-reading p { margin-bottom: 0; white-space: pre-line; }
.homeschool-app .hs-interest-source { margin-bottom: 22px; overflow-wrap: anywhere; }
.homeschool-app .hs-interest-source summary { cursor: pointer; padding: 10px 0; min-height: 44px; }
.homeschool-app .hs-source-excerpt { font-size: 14px; white-space: pre-line; }
.homeschool-app .hs-interest-question { font-size: 19px; line-height: 1.6; }
.homeschool-app .hs-interest-choices { display: grid; gap: 10px; }
.homeschool-app .hs-interest-practice button { scroll-margin-block: 110px; }
.homeschool-app .hs-interest-practice > .button { margin: 12px 8px 0 0; }
.homeschool-app .hs-interest-evidence { margin: 16px 0; padding: 12px 16px; border-left: 3px solid var(--accent); background: #f8faf6; font-size: 14px; }
.homeschool-app .hs-interest-objective, .homeschool-app .hs-interest-result { font-weight: 600; }
.homeschool-app .hs-video-review-basis { color: var(--accent); font-weight: 600; font-size: 12px; }
.homeschool-app .hs-video-review-summary { font-size: 13px; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; max-height: 4.5em; overflow: hidden; }
.homeschool-app .hs-video-review-detail { margin: 12px 0; padding: 14px 18px; color: #233729; background: #f1f6ec; border-radius: 12px; }
.homeschool-app .hs-video-review-detail summary { cursor: pointer; min-height: 44px; padding: 8px 0; }
.homeschool-app .hs-video-review-detail p, .homeschool-app .hs-video-review-detail a { color: #233729 !important; }
.homeschool-app .hs-video-review-detail blockquote { margin: 12px 0; font-size: 14px; }
.homeschool-app .hs-learn-interests h2 { margin: 0 0 8px; }
.homeschool-app .hs-learn-interests p { margin: 0 0 16px; }
.homeschool-app .hs-learn-topics { display: flex; flex-wrap: wrap; gap: 10px; }
.homeschool-app .hs-learn-topic { min-height: 44px; max-width: 100%; padding: 10px 18px; border: 1px solid #bccab7; border-radius: 24px; background: #eef4e9; color: var(--text); font: inherit; text-align: left; overflow-wrap: anywhere; cursor: pointer; }
.homeschool-app .hs-learn-topic:hover { background: #e0ecd8; border-color: var(--accent); }
.homeschool-app .hs-learn-topics:has([data-content-kind]) { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px; }
.homeschool-app .hs-learn-topic:has([data-content-kind]) { padding: 18px; border-radius: 16px; background: #fff; font-weight: 650; }
.homeschool-app .hs-learn-topic [data-content-kind] { display: block; margin-top: 7px; font-size: 12px; font-weight: 400; line-height: 1.5; color: #58634f; }
.homeschool-app .hs-learn-topic [data-ready="true"] { color: #276044; }
.homeschool-app #hsContentPreparationStatus { margin: 18px 0 8px; font-size: 13px; }
.homeschool-app .hs-subjects-head { display: block; }
.homeschool-app .hs-subjects-head h2 { margin-bottom: 6px; }
.homeschool-app .hs-subjects-head p { margin: 0 0 16px; }
.homeschool-app .hs-watch-overlay { background: #17231bed; color: #fff; }
.homeschool-app .hs-watch-overlay h3, .homeschool-app .hs-watch-overlay p { color: #fff; }
body.homeschool-app.is-playing { background: #101710; color: #f4f7f1; }
body.homeschool-app.is-playing .layout { padding: 0; }
body.homeschool-app.is-playing .homeschool-main { width: 100%; max-width: none; padding: 0; }
body.homeschool-app.is-playing .homeschool-header, body.homeschool-app.is-playing .homeschool-footer { display: none; }
body.homeschool-app.is-playing #playerArea { background: #101710; }
body.homeschool-app.is-playing .player-back { display: inline-flex !important; background: #fff; color: #233729; border-color: #dce3d8; box-shadow: none; }
body.homeschool-app.is-playing .player-home, body.homeschool-app.is-playing .player-swipe-handle { display: none !important; }
body.homeschool-app.is-playing .feature-info { color: #f4f7f1; }
body.homeschool-app.is-playing .feature-info h2 { color: #fff; }
body.homeschool-app.is-playing .feature-info .eyebrow, body.homeschool-app.is-playing .feature-info > p { color: #d1dcce; }
body.homeschool-app.is-playing .inline-consent { color: #233729; background: #f4f7ef; border-color: #bccab7; }
body.homeschool-app.is-playing .inline-consent a { color: #2e6449; }
body.homeschool-app.is-playing #playerTitle { color: #fff; }
body.homeschool-app.is-playing .player-area .button-secondary { background: #243125; color: #fff; border-color: #536451; }
body.homeschool-app.is-playing .player-tools .icon-button { color: #fff; border-color: #879b7e; background: #243125; }
body.homeschool-app.is-playing .learning-reflection, body.homeschool-app.is-playing .discussion-panel, body.homeschool-app.is-playing .challenge-panel { color: var(--text); }
/* Keep app navigation and reviewed alternatives outside the YouTube frame. */
body.homeschool-app.is-playing #playerArea { display: block; min-height: 100vh; min-height: 100dvh; padding: max(16px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)); box-sizing: border-box; }
.homeschool-app .hs-player-toolbar { display: flex; align-items: center; gap: 12px; max-width: 1540px; margin: 0 auto 24px; min-width: 0; }
body.homeschool-app.is-playing .hs-player-toolbar .player-back { position: static; flex-shrink: 0; min-height: 44px; font-size: 14px; padding: 8px 14px; }
.homeschool-app .hs-player-brand { margin-right: auto; font-size: 18px; font-weight: 700; color: #fff; }
.homeschool-app .hs-player-brand span { display: block; font-size: 11px; font-weight: 500; color: #b7c9b3; letter-spacing: .1em; text-transform: uppercase; }
body.homeschool-app.is-playing .hs-player-toolbar .player-tools { position: static; width: auto; height: auto; max-width: none; pointer-events: auto; }
body.homeschool-app.is-playing #fullscreenButton { position: static; min-height: 44px; padding: 10px 12px; border-radius: 12px; }
.homeschool-app .hs-more-button { min-height: 44px; padding: 10px 16px; border: 1px solid #819679; border-radius: 12px; background: #dcedcf; color: #203423; font: inherit; font-weight: 650; cursor: pointer; }
.homeschool-app .hs-player-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; align-items: start; gap: 28px; max-width: 1540px; margin: 0 auto; }
.homeschool-app .hs-player-main { min-width: 0; }
body.homeschool-app.is-playing #playerArea .player-shell { width: 100%; max-width: none; border-radius: 16px; overflow: hidden; }
body.homeschool-app.is-playing #playerArea .media-frame { width: 100%; max-width: none; max-height: none; min-height: 200px; aspect-ratio: 16 / 9; margin: 0; border-radius: 16px; }
.homeschool-app .hs-player-caption { padding: 22px 0 12px; }
.homeschool-app .hs-player-caption > span { font-size: 11px; letter-spacing: .12em; color: #bbd8ab; }
.homeschool-app .hs-player-caption h1 { margin: 7px 0; color: #fff; font-size: clamp(19px, 2vw, 27px); line-height: 1.4; overflow-wrap: anywhere; }
.homeschool-app .hs-player-caption p { color: #bbcab7; font-size: 13px; margin: 8px 0; }
.homeschool-app #hsPlayerReview .hs-video-review-detail { margin: 8px 0 0; border-radius: 14px; }
.homeschool-app .hs-more-videos { padding: 22px; border: 1px solid #394b36; border-radius: 20px; background: #1b281c; color: #eef5e9; min-width: 0; }
.homeschool-app .hs-more-head { display: flex; align-items: start; gap: 8px; }
.homeschool-app .hs-more-head h2 { margin: 0; font-size: 19px; line-height: 1.5; color: #fff; }
.homeschool-app .hs-more-head button { margin: -8px -10px 0 auto; flex-shrink: 0; width: 44px; min-height: 44px; border: 0; border-radius: 10px; background: transparent; color: #fff; font-size: 25px; cursor: pointer; }
.homeschool-app .hs-more-videos > p { color: #c9d6c3; font-size: 13px; line-height: 1.6; }
.homeschool-app .hs-more-videos label { display: block; font-size: 12px; margin: 20px 0 7px; color: #c9d6c3; }
.homeschool-app #hsVideoTopic { width: 100%; min-height: 46px; border: 1px solid #6a8062; border-radius: 10px; padding: 10px; background: #263726; color: #fff; font: inherit; }
.homeschool-app #hsMoreVideosList { display: grid; gap: 12px; }
.homeschool-app .hs-more-card { width: 100%; display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 12px; padding: 10px; background: #253425; color: #fff; border: 1px solid #4d6246; border-radius: 12px; font: inherit; text-align: left; cursor: pointer; }
.homeschool-app .hs-more-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 7px; }
.homeschool-app .hs-more-card strong { display: block; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.homeschool-app .hs-more-card small { display: block; color: #c9d6c3; font-size: 12px; margin-top: 5px; }
.homeschool-app .hs-more-card .hs-more-play { color: #c5e6ad; font-weight: 650; }
.homeschool-app .hs-more-card:hover, .homeschool-app .hs-more-card:focus-visible { border-color: #c5e6ad; background: #30472d; }
.homeschool-app .hs-more-videos .hs-more-note { border-top: 1px solid #43553d; padding-top: 16px; margin: 22px 0 0; font-size: 12px; }
.homeschool-app #playerArea.hs-more-hidden .hs-player-layout { grid-template-columns: minmax(0, 1fr); max-width: 1200px; }
body.homeschool-app.is-playing #playerArea:fullscreen { display: block; width: 100%; height: 100%; overflow-y: auto; background: #101710; }
body.homeschool-app.is-playing #playerArea:fullscreen .media-frame { max-height: none; }
@media (max-width: 1050px) {
  .homeschool-app .hs-player-layout { grid-template-columns: minmax(0, 1fr); gap: 16px; max-width: 900px; }
  .homeschool-app #hsMoreVideosList { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  body.homeschool-app.is-playing #playerArea { padding-left: 12px; padding-right: 12px; }
  .homeschool-app .hs-player-toolbar { gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
  .homeschool-app .hs-player-brand { display: none; }
  .homeschool-app #hsMoreVideosButton { margin-left: auto; font-size: 13px; padding: 9px 12px; }
  body.homeschool-app.is-playing #fullscreenButton span { display: none; }
  .homeschool-app .hs-more-videos { padding: 18px; }
  .homeschool-app #hsMoreVideosList { grid-template-columns: minmax(0, 1fr); }
  .homeschool-app .hs-more-card { grid-template-columns: 100px minmax(0, 1fr); }
}
@media (max-width: 360px) {
  .homeschool-app #playerBackLabel { display: none; }
  body.homeschool-app.is-playing .hs-player-toolbar .player-back { width: 44px; justify-content: center; padding: 8px; }
  .homeschool-app .hs-more-card { grid-template-columns: 80px minmax(0, 1fr); }
}
@media (min-width: 1200px) {
  .homeschool-header { padding-left: max(var(--gutter), calc((100vw - 1104px) / 2 + var(--gutter))); padding-right: max(var(--gutter), calc((100vw - 1104px) / 2 + var(--gutter))); }
}
@media (max-width: 899px) {
  :root { --gutter: 20px; --display-size: 26px; }
  .homeschool-main { padding: var(--space-4) var(--gutter) calc(var(--tab-bar) + env(safe-area-inset-bottom)); }
  .homeschool-header { min-height: calc(64px + env(safe-area-inset-top)); padding-left: max(var(--gutter), env(safe-area-inset-left)); padding-right: max(var(--gutter), env(safe-area-inset-right)); gap: 8px; }
  .homeschool-header .brand { font-size: 20px; gap: 7px; }
  body.homeschool-app.homeschool-route .layout { padding: var(--space-6) var(--gutter) calc(var(--tab-bar) + env(safe-area-inset-bottom)); }
  .homeschool-app .saved-head { display: block; margin-bottom: var(--space-6); }
  .homeschool-app .hs-nav { position: fixed; top: auto; left: 0; right: 0; bottom: 0; z-index: 30; border-top: 1px solid var(--line-soft); border-bottom: 0; border-radius: 0; box-sizing: border-box; min-height: calc(var(--tab-bar) + env(safe-area-inset-bottom)); padding: 0 max(4px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(4px, env(safe-area-inset-left)); margin: 0; gap: 0; background: var(--surface); justify-content: stretch; }
  .homeschool-app .hs-nav-btn { flex: 1 1 20%; min-width: 0; flex-direction: column; gap: 2px; font-size: 11px; line-height: 1.3; padding: 6px 2px; min-height: var(--tab-bar); border: 0; border-radius: var(--radius-sm); }
  .homeschool-app .hs-nav-btn[aria-current="page"] { background: var(--accent-soft); border-bottom-color: transparent; }
  .homeschool-app .hs-nav-btn svg { width: 21px; height: 21px; }
  .homeschool-app .hs-today-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .homeschool-app .learning-path-grid, .homeschool-app .stat-tiles { min-width: 0; }
  .homeschool-app .learning-onboarding { padding: 22px var(--gutter); }
  #hsStartup { margin: 12px auto 30px; padding: 28px var(--gutter); }
  #hsStartup h1 { font-size: 34px; }
  .homeschool-footer { margin: 0 var(--gutter) calc(var(--tab-bar) + env(safe-area-inset-bottom)); padding: 20px 0 16px; }
  .homeschool-app .hs-skill-row { gap: 10px; padding: 12px; }
}
@media (max-width: 360px) {
  .homeschool-header .brand { font-size: 18px; }
  .homeschool-header .brand-mark { width: 27px; height: 27px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
@media (forced-colors: active) { .homeschool-app .hs-nav-btn[aria-current="page"] { outline: 2px solid Highlight; } .homeschool-app .button { border: 1px solid ButtonText; } }
@media print { .homeschool-header, .homeschool-footer, .hs-nav, .hs-assistant { display: none !important; } body.homeschool-app .layout { padding: 0; } }

.hs-import-library{margin-bottom:24px}.hs-import-toolbar{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}.hs-import-library label{display:block;margin:16px 0}.hs-import-library select{max-width:100%;min-height:44px}.hs-import-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px}.hs-import-card{border:1px solid #d5dfd0;border-radius:16px;padding:20px;min-width:0;overflow-wrap:anywhere;background:#fff}.hs-import-card h3{font-size:18px;line-height:1.5}.hs-import-state{font-weight:700}.hs-import-approved{color:#2e6449}.hs-import-needs_parent,.hs-import-rejected{color:#80521c}.hs-import-card details{margin-top:16px}.hs-import-card summary{cursor:pointer;min-height:44px}.hs-import-card form{display:grid;gap:12px;margin-top:14px}.hs-import-card :is(input,textarea,select){width:100%;padding:12px;border:1px solid #8a9e81;border-radius:10px;font:inherit;box-sizing:border-box;min-width:0}.hs-import-card textarea{min-height:100px}

.extension-bridge{max-width:620px;margin:80px auto;padding:24px}

/* Header avatar menu and the quiet assistant bar. */
.homeschool-header .brand { margin-right: 12px; }
.hs-avatar-menu { position: relative; margin-left: auto; }
.homeschool-header .hs-avatar-button { width: 44px; height: 44px; min-height: 44px; padding: 0; border: 1px solid var(--line-soft); border-radius: var(--radius-pill); background: var(--accent-soft); color: var(--accent); font-weight: 600; font-size: 14px; line-height: 1; }
.homeschool-header .hs-avatar-button:hover { background: var(--accent-soft-2); }
.hs-avatar-mark { display: grid; place-items: center; width: 100%; height: 100%; }
.hs-avatar-mark svg { width: 22px; height: 22px; }
.hs-avatar-popover { position: absolute; top: calc(100% + 8px); right: 0; z-index: 40; min-width: 220px; display: grid; gap: 4px; padding: 8px; border: 1px solid var(--line-soft); border-radius: var(--radius-md); background: var(--surface); box-shadow: 0 18px 48px #23372926; opacity: 0; translate: 0 -6px; }
.hs-avatar-popover.is-open { opacity: 1; translate: 0 0; }
.hs-avatar-popover:not(.is-open) { pointer-events: none; }
.homeschool-header .hs-avatar-popover button,
.homeschool-header .hs-avatar-popover .account { width: 100%; min-height: 44px; justify-content: flex-start; gap: 8px; padding: 8px 12px; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--text); font-size: 15px; font-weight: 500; line-height: 1.5; text-align: left; text-decoration: none; }
.homeschool-header .hs-avatar-popover button:hover,
.homeschool-header .hs-avatar-popover .account:hover { background: var(--surface-raised); }
.homeschool-header .hs-avatar-popover .private-badge { justify-self: start; margin: 4px 8px; }
.homeschool-app .hs-assistant.hs-assistant-quiet { position: relative; margin: 0; padding: 0 8px 0 16px; border: 1px solid var(--line-soft); border-radius: var(--radius-pill); background: var(--surface); box-shadow: none; min-width: 0; max-width: 100%; box-sizing: border-box; }
.homeschool-app .hs-assistant.hs-assistant-quiet[open] > summary { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; }
.homeschool-app .hs-assistant.hs-assistant-quiet .learn-ask { display: flex; align-items: center; gap: 8px; width: 100%; min-width: 0; margin: 0; padding: 0; border: 0; background: transparent; box-sizing: border-box; }
.homeschool-app .hs-assistant.hs-assistant-quiet .learn-ask input { flex: 1; min-width: 0; min-height: 48px; padding: 8px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.homeschool-app .hs-assistant.hs-assistant-quiet .learn-ask .button { min-width: 0; min-height: 44px; padding: 8px 12px; border: 0; background: transparent; color: var(--accent); font-weight: 600; }
.homeschool-app .hs-assistant.hs-assistant-quiet:has(#learnAskThread:not([hidden])),
.homeschool-app .hs-assistant.hs-assistant-quiet:has(#learnAskConfirm:not([hidden])) { padding: 12px 16px 16px; border-radius: var(--radius-lg); }

/* ==========================================================================
   Zen system (2026-10-23). Calm, not empty: whitespace, one clear primary
   action per screen, a quiet green palette, one spacing and type scale, and
   soft motion only when the reader allows it. Every surface below uses it.
   ========================================================================== */
:root {
  --fs-xs: 13px;
  --fs-sm: 14px;
  --fs-md: 16px;
  --fs-lg: 19px;
  --fs-xl: 24px;
  --fs-2xl: 30px;
  --zen-gap: 48px;
  --zen-gap-sm: 24px;
  --card-radius: 20px;
  --thumb-radius: 14px;
  --soft-fill: #f1f5ee;
  --hairline: #e4eae0;
}
@media (max-width: 899px) { :root { --zen-gap: 36px; --zen-gap-sm: 20px; --fs-2xl: 26px; --fs-xl: 21px; } }

/* Page title: the date on Today, the tab name elsewhere. */
.homeschool-app .saved-head { margin-bottom: var(--zen-gap-sm); }
body.homeschool-app[data-hs-tab="interest"] .saved-head { display: none; }

/* Section rhythm shared by every tab. */
.homeschool-app .hs-section-title { margin: 0 0 4px; font-size: var(--fs-lg); font-weight: 600; line-height: 1.45; letter-spacing: -.01em; }
.homeschool-app .hs-section-intro { margin: 0 0 var(--space-5); color: var(--muted); font-size: var(--fs-sm); line-height: 1.6; max-width: 60ch; }
.homeschool-app .hs-section-eyebrow { margin: 0 0 4px; color: var(--muted); font-size: var(--fs-xs); font-weight: 500; letter-spacing: .02em; }
body.homeschool-app .hs-panel > * + * { margin-top: var(--zen-gap); }
body.homeschool-app .hs-panel > .button-secondary:first-child + * { margin-top: var(--space-4); }
body.homeschool-app #homeSchool > .hs-assistant { margin-bottom: var(--zen-gap-sm); }
.homeschool-app .learning-companion { max-width: none; }
.homeschool-app .text-button { min-height: 44px; padding: 8px 4px; border: 0; background: transparent; font: inherit; font-weight: 600; cursor: pointer; }
.homeschool-app .hs-quiet-button { min-height: 44px; padding: 8px 14px; border: 0; background: transparent; color: var(--accent); font-size: var(--fs-sm); font-weight: 600; }
.homeschool-app .hs-quiet-button:hover { background: var(--accent-soft); }

/* ---- Video cards: large thumbnails, quiet text, nothing dropped. -------- */
.homeschool-app .hs-video-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 248px), 1fr)); gap: 28px 20px; min-width: 0; }
.homeschool-app .learning-video.hs-video-card { position: relative; display: flex; flex-direction: column; align-items: stretch; gap: 0; min-width: 0; padding: 0 0 4px; border: 0; border-radius: var(--thumb-radius); background: transparent; box-shadow: none; overflow: visible; color: var(--text); text-align: left; cursor: pointer; }
.homeschool-app .hs-video-card :is(strong, span, small) { margin: 0; }
.homeschool-app .hs-video-card .hs-video-media { position: relative; display: block; overflow: hidden; border-radius: var(--thumb-radius); background: var(--accent-soft); }
.homeschool-app .hs-video-card .hs-video-media img { display: block; width: 100%; margin: 0; aspect-ratio: 16 / 9; object-fit: cover; background: var(--accent-soft); }
.homeschool-app .hs-video-card .hs-video-play { position: absolute; left: 12px; bottom: 12px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--radius-pill); background: #ffffffee; color: var(--accent); }
.homeschool-app .hs-video-card .hs-video-play svg { width: 18px; height: 18px; fill: currentColor; }
/* Before video permission the placeholder already draws a play mark. */
.homeschool-app .hs-video-card img[src^="data:"] + .hs-video-play { display: none; }
.homeschool-app .hs-video-card .hs-video-title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-top: 12px; font-size: var(--fs-md); font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.homeschool-app .hs-video-card .hs-video-source { margin-top: 4px; color: var(--muted); font-size: var(--fs-xs); line-height: 1.5; }
.homeschool-app .hs-video-card .hs-video-reason { margin-top: 6px; color: var(--accent); font-size: var(--fs-xs); font-weight: 500; letter-spacing: 0; text-transform: none; line-height: 1.5; }
.homeschool-app .hs-video-card .hs-video-review-basis { margin-top: 6px; color: var(--accent); font-size: 12px; font-weight: 500; }
.homeschool-app .hs-video-card .hs-video-review-summary { margin-top: 2px; color: var(--muted); font-size: var(--fs-xs); -webkit-line-clamp: 2; max-height: 3em; }
.homeschool-app .hs-video-card .learning-video-progress { margin: 10px 0 0; height: 3px; background: var(--hairline); }
.homeschool-app .hs-video-card .learning-video-badge { top: 10px; right: 10px; margin: 0; padding: 2px 10px; color: #fff; background: var(--accent); font-size: 12px; font-weight: 600; }
.homeschool-app .hs-video-card:hover .hs-video-title { color: var(--accent); }
.homeschool-app .hs-video-card:focus-visible { outline-offset: 6px; border-radius: var(--thumb-radius); }
.homeschool-app .hs-see-more { display: flex; align-items: center; justify-content: center; min-height: 48px; margin: var(--space-7) auto 0; padding: 10px 24px; border: 1px solid var(--line); border-radius: var(--radius-pill); background: var(--surface); color: var(--text); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
.homeschool-app .hs-see-more:hover { background: var(--accent-soft); border-color: #bccab7; }
.homeschool-app .hs-video-loading, .homeschool-app .hs-today-loading { margin: 0; padding: var(--space-5); color: var(--muted); font-size: var(--fs-sm); }

/* ---- Today: date, one hero, today's clips, a short "what else". -------- */
.homeschool-app .hs-today-zen { display: grid; gap: var(--zen-gap); min-width: 0; }
.homeschool-app .hs-today-videos { display: grid; gap: var(--zen-gap); min-width: 0; margin: 0; }
.homeschool-app .hs-today-next .hs-section-title { margin-bottom: var(--space-4); }
.homeschool-app .hs-today-card.hs-today-hero { display: block; margin: 0; padding: 0; overflow: hidden; border: 1px solid var(--hairline); border-radius: 24px; background: var(--surface); box-shadow: none; }
.homeschool-app .hs-today-hero-slot { min-width: 0; }
.homeschool-app .hs-today-hero .hs-today-hero-video { padding: 0; border-radius: 0; }
.homeschool-app .hs-today-hero .hs-today-hero-video .hs-video-media { border-radius: 0; }
.homeschool-app .hs-today-hero .hs-today-hero-video .hs-video-play { left: 50%; top: 50%; bottom: auto; translate: -50% -50%; width: 64px; height: 64px; }
.homeschool-app .hs-today-hero .hs-today-hero-video .hs-video-play svg { width: 26px; height: 26px; }
.homeschool-app .hs-today-hero .hs-today-hero-video > :not(.hs-video-media) { margin-left: 20px; margin-right: 20px; }
.homeschool-app .hs-today-hero .hs-today-hero-video .hs-video-title { margin-top: 16px; font-size: var(--fs-xl); line-height: 1.4; -webkit-line-clamp: 3; }
.homeschool-app .hs-today-hero .hs-today-hero-video .hs-video-review-summary { -webkit-line-clamp: 2; }
.homeschool-app .hs-today-hero .hs-today-hero-video .learning-video-progress { display: none; }
.homeschool-app .hs-today-hero-progress { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: #ffffff99; }
.homeschool-app .hs-today-hero-progress::before { content: ""; display: block; width: calc(var(--pct, 0) * 1%); height: 100%; background: var(--accent); }
.homeschool-app .hs-today-hero .hs-today-card-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin: 16px 0 0; padding: 16px 20px 20px; border-top: 1px solid var(--hairline); }
.homeschool-app .hs-today-skill { display: grid; gap: 2px; min-width: 0; }
.homeschool-app .hs-today-skill-label { color: var(--muted); font-size: var(--fs-xs); }
.homeschool-app .hs-today-skill strong { font-size: var(--fs-md); font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.homeschool-app .hs-today-skill-meter { display: flex; align-items: center; gap: 10px; margin-top: 6px; color: var(--muted); font-size: var(--fs-xs); }
.homeschool-app .hs-today-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-left: auto; }
.homeschool-app .hs-today-practice { min-height: 44px; padding: 8px 20px; border: 0; border-radius: var(--radius-pill); background: var(--accent); color: #fff; font: inherit; font-size: 15px; font-weight: 600; line-height: 1.4; cursor: pointer; }
.homeschool-app .hs-today-practice:hover { background: var(--accent-hover); }
.homeschool-app .hs-today-hero-slot .learning-idea-fallback { padding: 28px 20px 8px; }
.homeschool-app .hs-today-hero-slot .learning-idea-fallback p { margin: 0 0 16px; color: var(--muted); font-size: var(--fs-sm); line-height: 1.6; max-width: 52ch; }
.homeschool-app .hs-today-hero-slot .learning-idea-fallback .button { height: auto; white-space: normal; }
.homeschool-app .hs-today-clips .hs-section-intro { margin-bottom: var(--space-6); }
.homeschool-app .hs-today-more .hs-section-title { margin-bottom: var(--space-4); }
.homeschool-app .hs-today-quiet-list { list-style: none; margin: 0; padding: 0; overflow: hidden; border: 1px solid var(--hairline); border-radius: var(--card-radius); background: var(--surface); }
.homeschool-app .hs-today-quiet-row { position: relative; display: grid; gap: 2px; width: 100%; min-height: 56px; padding: 14px 48px 14px 20px; border: 0; border-top: 1px solid var(--hairline); border-radius: 0; background: transparent; color: var(--text); font: inherit; font-size: 15px; font-weight: 500; line-height: 1.5; text-align: left; white-space: normal; cursor: pointer; }
.homeschool-app .hs-today-quiet-row::after { content: "›"; position: absolute; right: 20px; top: 50%; translate: 0 -50%; color: var(--muted); font-size: 22px; }
.homeschool-app .hs-today-quiet-row:hover { background: var(--soft-fill); }
.homeschool-app .hs-today-quiet-list li:first-child .hs-today-quiet-row { border-top: 0; }
.homeschool-app .hs-today-quiet-kind { color: var(--muted); font-size: var(--fs-xs); font-weight: 500; }
.homeschool-app .hs-today-quiet-row.is-muted span { color: var(--muted); font-weight: 400; }
.homeschool-app .hs-today-assistant-slot:empty { display: none; }
@media (min-width: 900px) {
  .homeschool-app .hs-today-hero .hs-today-hero-video { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-auto-rows: min-content; column-gap: 32px; align-content: start; }
  .homeschool-app .hs-today-hero .hs-today-hero-video .hs-video-media { grid-column: 1; grid-row: 1 / span 8; }
  .homeschool-app .hs-today-hero .hs-today-hero-video > :not(.hs-video-media) { grid-column: 2; margin-left: 0; margin-right: 28px; }
  .homeschool-app .hs-today-hero .hs-today-hero-video .hs-video-title { margin-top: 32px; font-size: 26px; }
  .homeschool-app .hs-today-hero .hs-today-card-head { margin-top: 0; padding: 20px 28px; }
}

/* ---- Progress: one slim bar everywhere. -------------------------------- */
.homeschool-app .hs-skill-progress { position: relative; display: block; flex: 0 0 auto; width: 120px; max-width: 100%; height: 6px; overflow: hidden; border-radius: var(--radius-pill); background: #e3eadf; }
.homeschool-app .hs-skill-progress::before { content: ""; display: block; width: calc(var(--pct, 0) * 1%); height: 100%; border-radius: inherit; background: var(--accent); }
.homeschool-app .hs-skill-progress.is-mastered::before { background: #3f8a5c; }

/* ---- Learn (Subjects): interests, then a clean skill list. ------------- */
.homeschool-app .hs-learn-interests { margin-bottom: 0; }
.homeschool-app .hs-learn-interests h2, .homeschool-app .hs-subjects-head h2 { font-size: var(--fs-lg); font-weight: 600; margin: 0 0 4px; }
.homeschool-app .hs-learn-interests > p.subtle { margin: 0 0 var(--space-5); font-size: var(--fs-sm); }
.homeschool-app .hs-learn-topics:has([data-content-kind]) { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 12px; }
.homeschool-app .hs-learn-topic:has([data-content-kind]) { min-height: 88px; padding: 16px 18px; border: 1px solid var(--hairline); border-radius: 16px; background: var(--surface); font-weight: 600; }
.homeschool-app .hs-learn-topic:has([data-content-kind]):hover { border-color: #b9cbb0; background: var(--soft-fill); }
.homeschool-app .hs-content-status-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: var(--space-4); }
.homeschool-app #hsContentPreparationStatus { margin: 0; color: var(--muted); font-size: var(--fs-xs); }
.homeschool-app .hs-subjects-head { margin-bottom: var(--space-6); }
.homeschool-app .hs-subjects-head p { margin: 0; font-size: var(--fs-sm); }
.homeschool-app .hs-subject-block { margin: 0 0 var(--zen-gap); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.homeschool-app .hs-panel > .hs-subject-block + .hs-subject-block { margin-top: 0; }
.homeschool-app .hs-subject-block > h3 { margin: 0; font-size: var(--fs-md); font-weight: 600; }
.homeschool-app .hs-subject-summary { margin: 2px 0 var(--space-4); color: var(--muted); font-size: var(--fs-xs); }
.homeschool-app .hs-subject-block .hs-skill-list, .homeschool-app .interest-section .hs-skill-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 10px; }
.homeschool-app .hs-skill-row { display: block; width: 100%; min-height: 56px; padding: 14px 16px; border: 1px solid var(--hairline); border-radius: 14px; background: var(--surface); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.homeschool-app .hs-skill-row:hover { border-color: #b9cbb0; background: var(--soft-fill); }
.homeschool-app .hs-skill-row.is-recommended { border-color: #b6cba9; background: var(--soft-fill); }
.homeschool-app .hs-skill-row .hs-skill-main { display: grid; gap: 6px; min-width: 0; }
.homeschool-app .hs-skill-row .hs-skill-main strong { font-size: 15px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.homeschool-app .hs-skill-row .hs-skill-progress { width: 100%; height: 4px; }
.homeschool-app .hs-skill-row .hs-skill-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--muted); font-size: var(--fs-xs); }
.homeschool-app .hs-skill-next { padding: 1px 10px; border-radius: var(--radius-pill); background: var(--accent-soft-2); color: var(--accent); font-size: 12px; font-weight: 600; }
.homeschool-app .hs-skill-row .hs-skill-video-status { margin: 0; color: #4f6b55; font-size: 12px; }
.homeschool-app .hs-based-on { color: var(--muted); font-size: var(--fs-xs); max-width: 70ch; }

/* ---- Lesson (skill detail): video first, then practice. ---------------- */
.homeschool-app .hs-skill-detail { display: grid; gap: var(--zen-gap); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.homeschool-app .hs-skill-detail-head { display: grid; gap: 6px; justify-items: start; }
.homeschool-app .hs-skill-detail-head h2 { margin: 0; font-size: var(--fs-2xl); font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.homeschool-app .hs-skill-detail-head .hs-skill-progress { width: 160px; }
.homeschool-app .hs-skill-detail-actions { margin-top: var(--space-4); }
.homeschool-app .hs-lesson-videos { margin-top: 0; }
.homeschool-app .hs-lesson-videos .hs-section-title { margin-bottom: var(--space-5); font-size: var(--fs-lg); }
.homeschool-app .hs-lesson-video { min-width: 0; overflow: visible; }
.homeschool-app .hs-lesson-thinking { margin: var(--space-7) 0 0; padding: 18px 20px; border-radius: 16px; background: var(--soft-fill); color: var(--text); font-size: 15px; line-height: 1.7; }
.homeschool-app .hs-skill-practice { display: grid; justify-items: start; gap: 4px; padding: clamp(20px, 3vw, 32px); border: 1px solid var(--hairline); border-radius: var(--card-radius); background: var(--surface); }
.homeschool-app .hs-skill-practice .hs-section-intro { margin-bottom: var(--space-4); }
.homeschool-app .hs-panel > .button-secondary:first-child { min-height: 44px; padding: 8px 4px; border: 0; background: transparent; color: var(--accent); }
.homeschool-app .hs-practice-card { display: grid; gap: 12px; max-width: 760px; padding: clamp(20px, 4vw, 36px); border: 1px solid var(--hairline); border-radius: var(--card-radius); }
.homeschool-app .hs-practice-card h3 { margin: 4px 0 8px; font-size: var(--fs-lg); line-height: 1.6; }
.homeschool-app .hs-practice-choice { width: 100%; min-height: 56px; padding: 12px 18px; border: 1px solid var(--line); border-radius: 14px; text-align: left; }
.homeschool-app .hs-result-banner { font-weight: 600; }

/* ---- Interest page: video grid first. --------------------------------- */
.homeschool-app .interest-page-head { display: grid; justify-items: start; gap: 8px; margin-bottom: var(--space-7); }
.homeschool-app .interest-page-title { gap: 12px; }
.homeschool-app .interest-page-emoji { font-size: 28px; }
.homeschool-app .interest-page-title h2 { font-size: var(--fs-2xl); font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.homeschool-app #panelInterest > .interest-page-head + * { margin-top: 0; }
.homeschool-app .interest-section { margin-bottom: 0; }
.homeschool-app .hs-interest-videos > [data-content-kind] { margin: 0 0 var(--space-5); font-size: var(--fs-xs); }
.homeschool-app .hs-foundations { border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.homeschool-app .hs-foundations > summary, .homeschool-app #panelInterest > details.interest-section > summary { min-height: 56px; padding: 16px 0; font-weight: 600; cursor: pointer; }
.homeschool-app .hs-foundations[open] { padding-bottom: var(--space-6); }
.homeschool-app #panelInterest > details.interest-section { border-bottom: 1px solid var(--hairline); }
.homeschool-app #panelInterest > .hs-foundations + details.interest-section { margin-top: 0; border-top: 0; }
.homeschool-app .hs-keep-going-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: var(--space-4); }
.homeschool-app .hs-keep-going-actions .button { height: auto; white-space: normal; }
.homeschool-app .concept-pill-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-3); }
.homeschool-app .concept-pill { min-height: 44px; padding: 8px 14px; border: 1px solid var(--hairline); border-radius: var(--radius-pill); background: var(--surface); color: var(--text); font: inherit; font-size: var(--fs-sm); cursor: pointer; }

/* ---- Explore, Projects, Journal, Guardian: the same calm cards. -------- */
.homeschool-app .learning-companion, .homeschool-app .project-hero, .homeschool-app .learning-guardian, .homeschool-app .my-learning, .homeschool-app .local-week, .homeschool-app .other-projects, .homeschool-app .hs-import-library { padding: clamp(20px, 3vw, 32px); border: 1px solid var(--hairline); border-radius: var(--card-radius); background: var(--surface); box-shadow: none; }
.homeschool-app :is(.learning-companion, .project-hero, .learning-guardian, .my-learning, .local-week, .hs-import-library) h3 { font-size: var(--fs-lg); font-weight: 600; }
.homeschool-app .local-week { gap: var(--space-5); }
.homeschool-app .local-week-head .eyebrow { margin: 0; font-size: 12px; letter-spacing: .08em; }
.homeschool-app .weather-strip { grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: 8px; }
.homeschool-app .weather-day { min-width: 0; min-height: 44px; padding: 12px 4px; border: 1px solid var(--hairline); border-radius: 14px; background: var(--soft-fill); color: var(--text); }
.homeschool-app .weather-day:hover { border-color: #b9cbb0; }
.homeschool-app .weather-banner, .homeschool-app .weather-attribution, .homeschool-app .activity-caution { color: var(--muted); font-size: var(--fs-xs); }
.homeschool-app .activity-list { grid-template-columns: repeat(auto-fill, minmax(min(100%, 248px), 1fr)); gap: 20px; }
.homeschool-app .activity-card { border: 1px solid var(--hairline); border-radius: 16px; background: var(--surface); }
.homeschool-app .activity-card img, .homeschool-app .activity-cover { background: var(--soft-fill); }
.homeschool-app .indoor-ideas { padding: 18px 20px; border-radius: 16px; background: var(--soft-fill); }
.homeschool-app .indoor-ideas ul { margin: 8px 0 16px; padding-left: 20px; }
.homeschool-app .learning-video-explorer { margin: 0; padding: 0 clamp(20px, 3vw, 32px); border: 1px solid var(--hairline); border-radius: var(--card-radius); background: var(--surface); }
.homeschool-app .learning-video-explorer > summary { display: flex; align-items: center; min-height: 64px; font-size: var(--fs-md); font-weight: 600; }
.homeschool-app .learning-video-explorer[open] { padding-bottom: clamp(20px, 3vw, 32px); }
.homeschool-app .learning-video-explorer .learning-path-group { margin-top: var(--space-7); }
.homeschool-app .learning-video-explorer .learning-path-group h4 { margin: 0 0 var(--space-4); font-size: var(--fs-md); }
.homeschool-app .learning-caution { color: var(--muted); font-size: var(--fs-xs); }
.homeschool-app .my-learning-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.homeschool-app .stat-tile { padding: 14px 10px; border: 0; border-radius: 14px; background: var(--soft-fill); }
.homeschool-app .stat-tile-num { color: var(--accent); }
.homeschool-app .stat-tile span:last-child { font-size: 12px; }
.homeschool-app .garden-card, .homeschool-app .skill-mastery-card { border: 1px solid var(--hairline); border-radius: 16px; background: var(--surface); }
.homeschool-app .garden-icon { min-height: 44px; border-color: var(--hairline); background: var(--surface); }
.homeschool-app .garden-icon-mastered { background: var(--accent-soft); }
.homeschool-app .my-learning-body { display: grid; gap: var(--space-7); }
.homeschool-app .hs-mylearning-legacy > * + *, .homeschool-app .hs-mylearning-root + * { margin-top: var(--zen-gap-sm); }
.homeschool-app .hs-resources { margin-top: var(--zen-gap-sm); border-color: var(--hairline); border-radius: var(--card-radius); }
.homeschool-app .hs-guardian-settings, .homeschool-app .hs-interest-manager { padding: clamp(20px, 3vw, 32px); border: 1px solid var(--hairline); border-radius: var(--card-radius); background: var(--surface); }
.homeschool-app #panelGuardian > * + * { margin-top: var(--zen-gap-sm); }
.homeschool-app .hs-interest-manage-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 0; border-top: 1px solid var(--hairline); }
.homeschool-app .hs-interest-manage-row > span { flex: 1 1 160px; min-width: 0; overflow-wrap: anywhere; }
.homeschool-app .hs-import-reason { color: var(--muted); font-size: var(--fs-sm); }

/* ---- Navigation: quiet labels, one clear current tab. ------------------ */
.homeschool-app .hs-nav-btn { transition: none; }
.homeschool-app .hs-nav-btn:focus-visible { outline-offset: 0; }

/* ---- Soft motion, only when allowed. ----------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .hs-avatar-popover { transition: opacity 240ms var(--ease), translate 240ms var(--ease); }
  .homeschool-app button:active { transform: scale(.985); transition: transform 160ms var(--ease); }
  .homeschool-app .hs-video-card { animation: hs-zen-rise 360ms var(--ease) both; }
  .homeschool-app .hs-video-card .hs-video-media img { transition: transform 420ms var(--ease); }
  .homeschool-app .hs-video-card:hover .hs-video-media img { transform: scale(1.025); }
  .homeschool-app .hs-today-zen > *, .homeschool-app .hs-today-videos > * { animation: hs-zen-rise 360ms var(--ease) both; }
  .homeschool-app .hs-today-zen > :nth-child(2) { animation-delay: 60ms; }
  .homeschool-app :is(.hs-skill-row, .hs-learn-topic, .hs-today-quiet-row, .hs-see-more) { transition: background-color 200ms var(--ease), border-color 200ms var(--ease); }
}
@keyframes hs-zen-rise { from { opacity: 0; translate: 0 6px; } to { opacity: 1; translate: 0 0; } }

/* Imported resource review uses the same theme tokens in light and dark mode. */
.homeschool-app .hs-import-card{background:var(--surface-raised,var(--surface));color:var(--text);border-color:var(--hairline);display:flex;flex-direction:column;gap:10px;align-self:start;padding:20px}
.homeschool-app .hs-import-card :is(h3,p){margin:0;color:inherit}.homeschool-app .hs-import-card h3{line-height:1.6}
.homeschool-app .hs-import-card :is(.subtle,.hs-import-reason){color:var(--muted)}
.homeschool-app .hs-import-card .hs-import-state{font-size:14px;color:var(--text);background:var(--accent-soft);padding:6px 10px;border-radius:9px;align-self:flex-start}
.homeschool-app .hs-import-card :is(input,textarea,select),.homeschool-app .hs-import-unlock input,.homeschool-app .hs-import-filters select{background:var(--bg);color:var(--text);border:1px solid var(--hairline);border-radius:10px;min-height:44px;font:inherit;padding:10px;max-width:100%;box-sizing:border-box}
.homeschool-app .hs-import-filters{display:flex;flex-wrap:wrap;gap:12px 20px}.homeschool-app .hs-import-filters label{display:grid;gap:6px;margin:10px 0;min-width:0;max-width:100%}
.homeschool-app .hs-import-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:8px}.homeschool-app .hs-import-actions :is(button,a){min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.homeschool-app .hs-import-actions .hs-import-remove{margin-inline-start:auto}.homeschool-app .hs-import-card details{margin-top:0}.homeschool-app .hs-import-card summary{display:flex;align-items:center;color:var(--muted);font-size:14px}
.homeschool-app .hs-import-unlock{display:flex;flex-wrap:wrap;gap:12px;align-items:end;padding:16px;border:1px solid var(--hairline);border-radius:14px;margin:12px 0;background:var(--accent-soft)}
.homeschool-app .hs-import-unlock label{display:grid;gap:8px;margin:0;flex:1 1 240px}.homeschool-app .hs-import-unlock p{flex-basis:100%;margin:0}
.homeschool-app .hs-import-notice{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 16px;background:var(--accent-soft);border-radius:12px;margin:12px 0;color:var(--text)}
.homeschool-app .hs-import-unlocked{font-size:14px;color:var(--muted)}
@media(max-width:600px){.homeschool-app .hs-import-toolbar{gap:8px}.homeschool-app .hs-import-toolbar .button{padding:10px 12px}.homeschool-app .hs-import-filters label{flex:1 1 180px}.homeschool-app .hs-import-card{padding:16px}}