/* FPT Schools learning portal: one visual system across public, exam and staff UI. */
:root {
  --fsc-blue: #3556ad;
  --fsc-blue-deep: #153b73;
  --fsc-orange: #e76500;
  --fsc-orange-dark: #b94b00;
  --fsc-green: #237648;
  --fsc-ink: #17283e;
  --fsc-copy: #35495f;
  --fsc-muted: #596b7d;
  --fsc-canvas: #f4f7fb;
  --fsc-surface: #fff;
  --fsc-border: #dce5ef;
  --fsc-radius: 16px;
  --fsc-shadow: 0 12px 32px rgba(29, 61, 103, .075);
  --orange: var(--fsc-orange-dark);
  --orange-dark: var(--fsc-orange-dark);
  --blue: var(--fsc-blue);
  --ink: var(--fsc-ink);
  --body: var(--fsc-copy);
  --muted: var(--fsc-muted);
  --line: var(--fsc-border);
  --soft: var(--fsc-canvas);
  --canvas: var(--fsc-canvas);
  --surface: var(--fsc-surface);
  --navy: var(--fsc-blue-deep);
  --navy-soft: #26518d;
  --accent: var(--fsc-orange);
  --accent-soft: #fff2e5;
  --shadow-card: var(--fsc-shadow);
  --brand: var(--fsc-orange);
  --brand-dark: var(--fsc-orange-dark);
  --shell: min(1280px, calc(100% - 48px));
}
html { scroll-padding-top: 120px; }
body { color: var(--fsc-ink); background: var(--fsc-surface); font-size: 16px; }
button, a { touch-action: manipulation; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--fsc-orange); outline-offset: 3px;
}
.skip-link { position: fixed; z-index: 200; left: 16px; top: -80px; padding: 11px 16px; border-radius: 0 0 10px 10px; background: var(--fsc-blue-deep); color: #fff; }
.skip-link:focus { top: 0; }
.topbar { background: var(--fsc-blue); color: #fff; }
.topbar-inner { min-height: 34px; }
.topbar-links { color: #f5f8ff; }
.site-header { border-bottom: 1px solid var(--fsc-border); box-shadow: 0 5px 24px rgba(31, 57, 95, .045); }
.nav-row { min-height: 84px; height: auto; gap: 24px; }
.brand { gap: 15px; color: var(--fsc-blue-deep); }
.fschool-logo { display: block; width: 90px; height: auto; max-height: 58px; object-fit: contain; flex: 0 0 auto; }
.brand-copy { gap: 3px; border-left: 1px solid var(--fsc-border); padding-left: 14px; }
.brand-copy b { color: var(--fsc-blue-deep); font-size: 18px; letter-spacing: -.03em; }
.brand-copy small { max-width: 150px; color: var(--fsc-muted); font-size: 9px; line-height: 1.35; letter-spacing: .055em; }
.desktop-nav { gap: 5px; }
.desktop-nav button { border-radius: 10px; font-size: 13px; color: var(--fsc-copy); padding: 12px 14px; }
.desktop-nav button:hover, .desktop-nav button.active { background: #eef3fb; color: var(--fsc-blue-deep); }
.desktop-nav button.active { box-shadow: inset 0 -3px var(--fsc-orange); }
.nav-actions { gap: 10px; }
.icon-btn, .menu-btn { display: grid; place-items: center; width: 44px; height: 44px; border-color: var(--fsc-border); }
.menu-btn { display: none; }
.icon-btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.pill { min-height: 44px; border-radius: 11px; padding: 11px 18px; }
.pill.primary { background: var(--fsc-orange-dark); box-shadow: none; }
.pill.primary:hover { background: var(--fsc-orange-dark); box-shadow: 0 8px 18px rgba(185, 75, 0, .18); }
.pill.outline { border-color: var(--fsc-border); color: var(--fsc-blue-deep); }
.pill.outline:hover { background: #eef3fb; border-color: #abc3e2; }
.eyebrow.orange { color: var(--fsc-orange-dark); }

/* Public learning space */
.hero-wrap { min-height: 0; background: linear-gradient(112deg, #fff 0%, #fffaf2 55%, #e9f2ff 100%); }
.hero { min-height: 570px; gap: 28px; }
.hero h1 { max-width: 690px; color: var(--fsc-blue-deep); font-size: clamp(37px, 3.7vw, 58px); line-height: 1.13; letter-spacing: -.045em; }
.hero h1 span { color: var(--fsc-orange); }
.hero p { max-width: 600px; color: var(--fsc-copy); font-size: 16px; }
.hero-stats { gap: 0; width: fit-content; padding: 15px 18px; border: 1px solid var(--fsc-border); border-radius: 14px; background: rgba(255, 255, 255, .92); box-shadow: var(--fsc-shadow); }
.hero-stats div { min-width: 105px; padding-inline: 18px; border-right: 1px solid var(--fsc-border); }
.hero-stats div:first-child { padding-left: 0; }
.hero-stats div:last-child { border: 0; padding-right: 0; }
.hero-stats b { color: var(--fsc-blue-deep); }
.hero-art { min-height: 470px; }
.orange-orbit { background: radial-gradient(circle at 28% 25%, #ffb15b, #f47706 65%, #df5d00); box-shadow: 0 28px 70px rgba(220, 103, 11, .16); }
.book-card { box-shadow: 0 24px 50px rgba(22, 60, 99, .18); }
.book-top { background: var(--fsc-blue); }
.floating-card { border: 1px solid var(--fsc-border); box-shadow: var(--fsc-shadow); }
.section-space { padding: 70px 0; }
.section-heading h2, .page-title h1 { color: var(--fsc-blue-deep); letter-spacing: -.035em; }
.topic-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.topic-card, .course-card { border-color: var(--fsc-border); border-radius: var(--fsc-radius); box-shadow: var(--fsc-shadow); }
.topic-card:hover, .course-card:hover { border-color: #f6b574; box-shadow: 0 18px 35px rgba(33, 73, 115, .11); }
.topic-card h3, .course-body h3 { color: var(--fsc-blue-deep); }
.topic-card p, .course-body p, .page-title p { color: var(--fsc-muted); }
.tag { background: #fff0e3; color: var(--fsc-orange-dark); }
.announcement-band { background: #f2f6fc; }
.subject-home .section-heading p { color: var(--fsc-muted); margin: 10px 0 0; }
.subject-tabs { display: flex; gap: 8px; overflow-x: auto; padding: 6px 3px 12px; margin: 24px 0 20px; scrollbar-width: thin; }
.subject-tabs button { flex: 0 0 auto; min-height: 48px; padding: 10px 20px; border: 1px solid var(--fsc-border); border-radius: 999px; background: #fff; color: var(--fsc-blue-deep); font: inherit; font-weight: 700; cursor: pointer; }
.subject-tabs button[aria-selected="true"] { background: var(--fsc-blue-deep); border-color: var(--fsc-blue-deep); color: #fff; }
.subject-tabs button:focus-visible, .subject-panel button:focus-visible { outline: 3px solid var(--fsc-orange-dark); outline-offset: 3px; }
.subject-panel { min-width: 0; border: 1px solid var(--fsc-border); border-radius: var(--fsc-radius); background: #fff; padding: clamp(20px, 3vw, 36px); box-shadow: var(--fsc-shadow); }
.subject-panel-intro p { margin: 8px 0 0; color: var(--fsc-muted); }
.subject-panel-block { margin-top: 30px; }
.subject-panel-block .section-heading { margin-bottom: 18px; }
.subject-panel-block h3 { margin: 0; color: var(--fsc-blue-deep); font-size: clamp(1.25rem, 2vw, 1.6rem); }
.subject-panel-block .announcement-card h4, .subject-panel-block .topic-card h4 { margin: 12px 0; color: var(--fsc-blue-deep); font-size: 1.1rem; line-height: 1.4; }
.subject-panel-block .announcement-card p { white-space: pre-line; overflow-wrap: anywhere; }
.subject-panel-block .topic-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
@media (max-width: 650px) { .subject-panel { padding: 20px 16px; } .subject-panel-block .section-heading { align-items: flex-start; gap: 8px; } .subject-panel-block .topic-grid { grid-template-columns: 1fr; } }
.exam-band { background: linear-gradient(105deg, #183e7e, #315caa); }
.inner-page { padding-top: 52px; }
.filter-row { gap: 8px; }
.filter { min-height: 42px; border-color: var(--fsc-border); color: var(--fsc-copy); }
.filter.active { background: var(--fsc-blue-deep); border-color: var(--fsc-blue-deep); }
.search-box { border-color: var(--fsc-border); border-radius: 11px; background: #fff; }
.search-box:focus-within { border-color: var(--fsc-blue); box-shadow: 0 0 0 3px #3556ad22; }
.course-cover { height: 190px; }
.cover-1 { background: linear-gradient(130deg, #214a8d, #3c65b6); }
.cover-2 { background: linear-gradient(130deg, #bc4f00, #f18a22); }
.cover-3 { background: linear-gradient(130deg, #126b56, #299872); }
.course-body { min-height: 215px; }
.course-foot button, .topic-foot button, .text-link { color: var(--fsc-orange-dark); }
.breadcrumbs { color: var(--fsc-muted); }
.lesson-sidebar, .question-card, .exam-nav, .analysis-card, .result-grid article { border-color: var(--fsc-border); box-shadow: var(--fsc-shadow); }
.lesson-head h1 { color: var(--fsc-blue-deep); }
.lesson-back { display: flex; width: fit-content; min-height: 36px; align-items: center; margin-bottom: 18px; color: var(--fsc-orange-dark); }
.lesson-head > .eyebrow { display: block; }
.lesson-list .current { background: #edf3fd; color: var(--fsc-blue-deep); }
.lesson-list .current i { background: var(--fsc-blue); }
.lesson-tabs .active { border-color: var(--fsc-orange); color: var(--fsc-orange-dark); }
.exam-page { background: var(--fsc-canvas); }
.exam-top { border-bottom-color: var(--fsc-border); }
.brand-mini { color: var(--fsc-blue-deep); }
.q-grid button { min-width: 36px; min-height: 36px; }
.q-grid button.current { background: var(--fsc-orange-dark); }
.result-hero { border: 1px solid var(--fsc-border); background: linear-gradient(110deg, #eef4fd, #fff 72%); }
.login-art { background: linear-gradient(155deg, #1a3e80, #3561b1); }
.login-box h2 { color: var(--fsc-blue-deep); }
.login-box input { border-color: var(--fsc-border); }
.login-brand::before, .footer-brand::before { content: ""; display: block; width: 78px; height: 48px; flex: 0 0 78px; background: url("fpt-schools-logo.webp") center / contain no-repeat; }
.login-brand .brand-mark, .footer-brand .brand-mark, .login-brand .brand-copy b, .footer-brand .brand-copy b { display: none; }
.login-brand .brand-copy small, .footer-brand .brand-copy small { max-width: 120px; font-size: 10px; line-height: 1.45; }
.site-footer { background: #17365f; }
.site-footer p, .site-footer button { color: #e4edfa; }

/* Staff and admin workspaces */
.dashboard-page { background: var(--fsc-canvas); }
.dash-side { background: var(--fsc-blue-deep); border-right: 0; }
.dash-brand { gap: 9px; padding: 6px 9px 19px; border-bottom-color: #ffffff2b; }
.dash-brand .fschool-logo { width: 75px; padding: 6px; border-radius: 10px; background: #fff; }
.dash-brand .brand-copy { padding-left: 10px; border-left-color: #ffffff38; }
.dash-brand .brand-copy b { color: #fff; font-size: 17px; }
.dash-brand .brand-copy small { color: #e3edfa; }
.portal-nav-group { margin: 24px 11px 9px; color: #bbd5f2; font-size: 10px; letter-spacing: .1em; }
.dash-side nav { gap: 3px; }
.dash-side nav button { min-height: 45px; padding: 10px 12px; color: #e1ebf7; border-radius: 9px; font-size: 13px; }
.dash-side nav button::before { content: none; }
.dash-side nav .portal-nav-icon { width: 19px; height: 19px; flex: 0 0 19px; margin-right: 12px; opacity: .9; }
.dash-side nav button:hover { background: #ffffff1b; }
.dash-side nav button.active, .dash-side nav .active { background: #fff; color: var(--fsc-blue-deep); box-shadow: inset 4px 0 var(--fsc-orange); }
.dash-side nav button.active .portal-nav-icon { color: var(--fsc-orange); opacity: 1; }
.dash-side nav button span:empty { display: none; }
.back-site { color: #e3edfa; border-top-color: #ffffff31; }
.dash-main { max-width: 1680px; padding: 32px clamp(22px, 3vw, 46px) 52px; }
.dash-top { padding: 0 0 12px; border-bottom: 1px solid var(--fsc-border); }
.dash-top small { color: var(--fsc-muted); }
.dash-top h1 { color: var(--fsc-blue-deep); font-size: clamp(23px, 2vw, 31px); }
.dash-top .avatar { border: 2px solid #fff; background: #e8eff9; color: var(--fsc-blue-deep); box-shadow: 0 5px 12px #234b8521; }
.dash-stats { margin-top: 24px; }
.dash-stats article, .panel { border: 1px solid var(--fsc-border); border-radius: var(--fsc-radius); box-shadow: var(--fsc-shadow); }
.dash-stats article { min-height: 122px; padding: 19px; }
.dash-stats article b { color: var(--fsc-blue-deep); }
.dash-stats article small, .dash-stats article em { color: var(--fsc-muted); }
.stat-icon { width: 48px; height: 48px; border-radius: 12px; font-size: 21px; }
.blue-bg { background: #e9f1fc; color: #2756a0; }
.orange-bg { background: #fff0e3; color: #c45606; }
.purple-bg { background: #eeeafb; color: #684cae; }
.green-bg { background: #e7f5ee; color: #237648; }
.admin-workspace { min-height: 400px; padding: 27px 30px; }
.dashboard-page:not([data-section="overview"]) .admin-workspace { min-height: 0; }
.admin-workspace > .panel-head { margin-bottom: 22px; }
.admin-workspace > .panel-head h3 { color: var(--fsc-blue-deep); font-size: 23px; }
.cms-intro { background: #f3f7fd; border-color: var(--fsc-border); }
.cms-intro p, .workspace-subtitle { color: var(--fsc-muted); font-size: 13px; }
.cms-metrics span { border-color: var(--fsc-border); }
.admin-search-label, .admin-filter-label, .modal-form label, .staff-form label { color: var(--fsc-copy); font-size: 12px; }
.admin-search-label input, .admin-filter-label select, .modal-form input, .modal-form textarea, .modal-form select, .staff-form input, .staff-form textarea, .staff-form select { border-color: var(--fsc-border); background: #fff; color: var(--fsc-ink); font-size: 13px; }
.admin-table-wrap { border-color: var(--fsc-border); }
.admin-table th { background: #edf3fb; color: var(--fsc-blue-deep); font-size: 11px; }
.admin-table td { color: var(--fsc-copy); font-size: 12px; border-color: #eaf0f6; }
.admin-table .row-title { color: var(--fsc-blue-deep); font-size: 13px; }
.admin-table tbody tr:hover { background: #f8fbff; }
.admin-table td.row-actions button { min-height: 36px; border-color: var(--fsc-border); color: var(--fsc-blue-deep); font-size: 11px; }
.admin-table td.row-actions button:hover { border-color: #abc3e2; background: #eef4fc; color: var(--fsc-blue-deep); }
.admin-search-label input, .admin-filter-label select { font-size: 14px; }
.admin-table td, .admin-table .row-title { font-size: 13px; }
.admin-empty, .empty-state { font-size: 13px; }
.admin-pager button { min-height: 38px; }
.setting-card, .assignment-panel { border-color: var(--fsc-border); background: #f7faff; }
.settings-grid { gap: 14px; }
.overview-welcome { padding: 27px; border-color: #d4e3f6; background: linear-gradient(105deg, #eaf2ff, #fff 75%); }
.overview-welcome h2 { color: var(--fsc-blue-deep); }
.overview-shortcuts button { border-color: var(--fsc-border); }
.overview-shortcuts button:hover { border-color: #adc8ea; background: #f8fbff; }
.dashboard-page[data-section="overview"] .quick-grid button { border-color: var(--fsc-border); background: #f7faff; color: var(--fsc-orange-dark); }
.dashboard-page[data-section="overview"] .quick-grid button span { color: var(--fsc-blue-deep); }
.modal-card { border-color: var(--fsc-border); box-shadow: 0 28px 90px #18396038; }
.dashboard-page.editor-mode .dash-stats, .dashboard-page.editor-mode .dash-columns > .panel:not(.admin-workspace) { display: none; }
.dashboard-page.editor-mode .dash-columns { display: block; }
.dashboard-page.editor-mode .admin-workspace { padding: 0; overflow: hidden; min-width: 0; }
.dashboard-page.editor-mode .admin-workspace > .panel-head { display: none; }
.workspace-editor { min-width: 0; background: #fff; }
.workspace-editor-head { display: grid; justify-items: start; gap: 8px; padding: clamp(22px, 3vw, 34px); border-bottom: 1px solid var(--fsc-border); background: linear-gradient(115deg, #fff8f2, #f8fbff 72%); }
.workspace-editor-head .editor-back { min-height: 44px; padding: 0 3px; margin-bottom: 6px; font-size: 13px; }
.workspace-editor-head h2 { margin: 0; color: var(--fsc-blue-deep); font-size: clamp(23px, 2.4vw, 32px); line-height: 1.25; }
.workspace-editor-head p { margin: 0; color: var(--fsc-muted); font-size: 13px; line-height: 1.6; }
.workspace-editor-form.modal-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; padding: clamp(22px, 3vw, 34px); }
.workspace-editor-form > label, .workspace-editor-form > fieldset { min-width: 0; }
.workspace-editor-form > label.wide, .workspace-editor-form > .wide, .workspace-editor-form > .question-author-grid, .workspace-editor-form > .question-answer-editor { grid-column: 1 / -1; }
.workspace-editor-form textarea { min-height: 115px; resize: vertical; }
.workspace-editor-form .modal-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin: 10px 0 0; padding: 20px 0 0; border-top: 1px solid var(--fsc-border); }
.workspace-editor-form .cms-draft-state { grid-column: 1 / -1; margin: 0; }
.workspace-editor-form .modal-actions button { min-height: 44px; }
.workspace-editorial .editorial-form.modal-form { display: block; padding: 0; }
.workspace-editorial .editorial-section { padding: clamp(22px, 3vw, 34px); }
.workspace-editorial .editorial-form .modal-actions { margin: 0; padding: 20px clamp(22px, 3vw, 34px); background: #fff; }
.workspace-editorial .cms-draft-state { padding: 14px clamp(22px, 3vw, 34px); background: #f7faff; border-top: 1px solid var(--fsc-border); }
.lesson-editor-toolbar { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.lesson-editor-toolbar span { margin-right: 6px; color: var(--fsc-muted); font-size: 12px; font-weight: 700; }
.lesson-editor-toolbar button { min-height: 36px; padding: 7px 10px; border: 1px solid var(--fsc-border); border-radius: 8px; background: #f7faff; color: var(--fsc-blue-deep); font-size: 12px; font-weight: 700; cursor: pointer; }
.lesson-editor-toolbar button:hover { background: #e8f1ff; }
.lesson-rich-content h2, .lesson-rich-content h3 { margin: 21px 0 10px; color: var(--fsc-blue-deep); }
.lesson-rich-content p { margin: 0 0 13px; line-height: 1.7; }
.lesson-rich-content ul { margin: 0 0 15px; padding-left: 23px; line-height: 1.7; }
.lesson-rich-content blockquote { margin: 16px 0; padding: 12px 16px; border-left: 3px solid var(--fsc-orange-dark); background: #fff8f2; color: var(--fsc-blue-deep); }
.workspace-question-editor .workspace-editor-form > label small { display: block; margin-top: 3px; color: var(--fsc-muted); font-size: 11px; font-weight: 400; }
.workspace-question-editor .question-author-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.workspace-question-editor .question-answer-editor { padding: 22px; }
.question-author-preview { padding: 22px; border: 1px solid #d5e5f7; border-radius: 14px; background: #f8fbff; }
.question-author-preview[hidden] { display: none; }
.question-author-preview h3 { margin: 12px 0; color: var(--fsc-blue-deep); font-size: 17px; }
.question-author-preview blockquote { margin: 13px 0; padding: 12px; border-left: 3px solid var(--fsc-orange-dark); background: #fff; white-space: pre-wrap; }
.question-author-preview ol { display: grid; gap: 8px; margin: 12px 0; padding-left: 24px; }
.question-author-preview li, .question-preview-input { padding: 10px 12px; border: 1px solid var(--fsc-border); border-radius: 9px; background: #fff; }
.question-author-preview small { display: block; color: var(--fsc-muted); }
.course-studio .studio-overview { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 12px; }
.course-studio .studio-overview span { padding: 8px 11px; border: 1px solid #dbe7f6; border-radius: 999px; background: #fff; color: var(--fsc-blue-deep); font-size: 12px; font-weight: 700; }
.studio-body { display: grid; gap: 20px; padding: clamp(20px, 3vw, 34px); }
.studio-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; }
.studio-heading h3, .studio-module-form h3 { margin: 0 0 5px; color: var(--fsc-blue-deep); font-size: 21px; }
.studio-heading p, .studio-module-main p { margin: 0; color: var(--fsc-muted); font-size: 13px; line-height: 1.5; }
.studio-module { border: 1px solid var(--fsc-border); border-radius: 16px; overflow: hidden; background: #fff; }
.studio-module-main { display: flex; gap: 15px; padding: 22px; background: #f8fbff; }
.studio-number { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: #ffefe5; color: var(--fsc-orange-dark); font-weight: 800; }
.studio-module-main h3 { margin: 4px 0 7px; color: var(--fsc-blue-deep); font-size: 18px; }
.studio-module-actions { display: flex; gap: 8px; flex-wrap: wrap; padding: 12px 22px; border-top: 1px solid var(--fsc-border); }
.studio-module-actions button, .studio-ungrouped button { min-height: 40px; padding: 7px 11px; border: 1px solid var(--fsc-border); border-radius: 9px; background: #fff; color: var(--fsc-blue-deep); cursor: pointer; }
.studio-module-actions button:hover, .studio-ungrouped button:hover { background: #edf4ff; }
.studio-lessons { display: grid; border-top: 1px solid var(--fsc-border); }
.studio-lessons > button { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto auto; align-items: center; gap: 12px; min-height: 57px; padding: 11px 22px; border: 0; border-bottom: 1px solid #edf1f5; background: #fff; color: var(--fsc-blue-deep); text-align: left; cursor: pointer; }
.studio-lessons > button:hover { background: #f8fbff; }
.studio-lessons > button:last-child { border-bottom: 0; }
.studio-lessons span { color: var(--fsc-orange-dark); font-weight: 800; }
.studio-lessons small { color: var(--fsc-muted); }
.studio-lessons b { font-size: 12px; }
.studio-lessons p, .studio-empty { margin: 0; padding: 20px 22px; color: var(--fsc-muted); font-size: 13px; }
.studio-ungrouped { display: grid; gap: 8px; }
.studio-ungrouped button { display: flex; justify-content: space-between; align-items: center; text-align: left; }
.studio-module-form { display: grid; gap: 15px; padding: 24px; border: 1px solid var(--fsc-border); border-radius: 16px; background: #f8fbff; }
.studio-module-form label { display: grid; gap: 7px; font-size: 13px; font-weight: 700; color: var(--fsc-blue-deep); }
.studio-module-form input, .studio-module-form textarea, .studio-module-form select { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--fsc-border); border-radius: 10px; background: #fff; }
.studio-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.studio-form-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 9px; }
.course-learning-guide { display: grid; gap: 8px; margin: 15px 0; }
.course-level { width: fit-content; padding: 5px 9px; border-radius: 99px; background: #edf4ff; color: var(--fsc-blue-deep); font-size: 11px; font-weight: 700; }
.course-learning-guide details { border: 1px solid var(--fsc-border); border-radius: 10px; padding: 9px 11px; background: #fff; font-size: 12px; }
.course-learning-guide summary { cursor: pointer; color: var(--fsc-blue-deep); font-weight: 700; }
.course-learning-guide ul { margin: 9px 0 0; padding-left: 18px; line-height: 1.55; }
.course-module-group { margin-top: 8px; border-top: 1px solid var(--fsc-border); }
.course-module-heading { display: grid; gap: 3px; padding: 15px 14px 9px; color: var(--fsc-blue-deep); }
.course-module-heading span { font-size: 10px; font-weight: 800; letter-spacing: .08em; color: var(--fsc-orange-dark); }
.course-module-heading strong { font-size: 13px; line-height: 1.3; }
.course-module-heading small { color: var(--fsc-muted); font-size: 11px; }
@media (max-width: 680px) {
  .workspace-editor-form.modal-form { grid-template-columns: 1fr; gap: 16px; padding: 20px 16px; }
  .workspace-editorial .editorial-section { padding: 20px 16px; }
  .workspace-editorial .editorial-fields, .workspace-question-editor .question-author-grid { grid-template-columns: 1fr; }
  .workspace-editorial .editorial-form .modal-actions { padding: 18px 16px; }
  .workspace-editor-form .modal-actions button { flex: 1 1 auto; }
  .workspace-question-editor .question-answer-editor { padding: 16px 12px; }
  .studio-body { padding: 18px 13px; }
  .studio-module-main, .studio-module-actions { padding: 15px; }
  .studio-lessons > button { grid-template-columns: 25px minmax(0, 1fr); padding: 12px 15px; }
  .studio-lessons small, .studio-lessons b { grid-column: 2; }
  .studio-module-form { padding: 18px 15px; }
  .studio-form-row { grid-template-columns: 1fr; }
}
.modal-head { background: #f5f9ff; }
.modal-head h3 { color: var(--fsc-blue-deep); }
.modal-close { min-width: 40px; min-height: 40px; }
.empty-state, .admin-empty, .editor-empty { border-color: var(--fsc-border); background: #f7faff; color: var(--fsc-muted); }
.staff-card, .editor-pane, .editor-question { border-color: var(--fsc-border); }
.editor-intro { border-color: #d5e3f5; background: linear-gradient(110deg, #eaf2ff, #fff5e9); }
.editor-intro h2, .editor-pane-head h3, .editor-publish h3 { color: var(--fsc-blue-deep); }
.editor-bank-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.editor-bank-actions .pill { min-height: 38px; padding: 7px 12px; font-size: 12px; white-space: nowrap; }
.editor-bank-actions .pill:disabled { opacity: .5; cursor: not-allowed; }
.editor-summary b, .question-meta { color: var(--fsc-orange-dark); }
.editor-paper { background: #f7faff; }
.editor-publish { border-color: var(--fsc-border); }
.calendar-header { background: #f7faff; border-bottom-color: var(--fsc-border); }
.calendar-header h2, .calendar-detail-head h3 { color: var(--fsc-blue-deep); }
.calendar-day.selected { background: #ecf3ff; box-shadow: inset 0 0 0 2px var(--fsc-blue); }
.calendar-day.today .calendar-date { background: var(--fsc-blue-deep); }
.calendar-day.selected .calendar-date { background: var(--fsc-blue); }
.calendar-detail { background: #f8fbff; }
.toast { font-size: 13px; }

/* Feedback floats above the page and its dialogs. */
.feedback-rail {
  position: fixed;
  z-index: 130;
  top: calc(128px + env(safe-area-inset-top, 0px));
  right: max(16px, env(safe-area-inset-right, 0px));
  width: min(380px, calc(100vw - 32px));
  display: grid;
  gap: 10px;
  pointer-events: none;
}
.site-header:has(.mobile-nav.open, .course-dropdown:not([hidden]), .mobile-course-menu:not([hidden])) ~ .feedback-rail { z-index: 20; }
@media (min-width: 1101px) { body.exam-active .feedback-rail { top: auto; bottom: max(16px, env(safe-area-inset-bottom, 0px)); } }
.toast-stack {
  position: static;
  width: 100%;
  margin: 0;
  display: grid;
  gap: 8px;
}
.toast-stack:empty { display: none; }
.toast-stack .toast {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  min-width: 0;
  max-width: none;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid var(--fsc-border);
  background: #fff;
  color: var(--fsc-blue-deep);
  box-shadow: 0 18px 48px rgba(21, 59, 115, .23), 0 3px 10px rgba(21, 59, 115, .08);
  animation: toast-corner-in .2s ease-out;
}
.toast-stack .toast.success { border-left-color: #2e8253; }
.toast-stack .toast.error { border-left-color: #bc4742; background: #fff8f7; color: #792c27; }
.toast-mark { display: grid; place-items: center; flex: none; width: 25px; height: 25px; border-radius: 50%; background: #e4f5eb; color: #1c7844; font-size: 15px; font-weight: 800; }
.toast.error .toast-mark { background: #fbe5e2; color: #a93630; }
.toast-copy { display: grid; gap: 3px; min-width: 0; line-height: 1.45; overflow-wrap: anywhere; }
.toast-copy strong { font-size: 12px; line-height: 1.2; }
.toast-copy span { font-size: 13px; font-weight: 500; }
@keyframes toast-corner-in { from { transform: translateX(12px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .toast-stack .toast { animation: none; } }
.connection-notice[hidden] { display: none !important; }
.connection-notice {
  width: min(100% - 32px, 1190px);
  margin: 12px auto;
  padding: 13px 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 20px;
  border: 1px solid #d9af67;
  border-left: 4px solid var(--fsc-orange);
  border-radius: 12px;
  background: #fff8eb;
  color: #513714;
  font-size: 12px;
  line-height: 1.6;
}
.connection-notice-copy { flex: 1 1 300px; display: grid; gap: 2px; }
.connection-notice strong { font-size: 13px; }
.connection-retry {
  min-height: 44px;
  flex: 0 0 auto;
  border: 1px solid #a56320;
  border-radius: 10px;
  padding: 10px 16px;
  background: #fff;
  color: #643d15;
  font: inherit;
  font-weight: 700;
}
.connection-retry:hover { background: #ffedcf; }
.connection-retry:focus-visible { outline: 3px solid var(--fsc-blue); outline-offset: 3px; }
@media (max-width: 680px) {
  .feedback-rail { top: calc(108px + env(safe-area-inset-top, 0px)); right: max(12px, env(safe-area-inset-right, 0px)); width: min(360px, calc(100vw - 24px)); }
  .connection-notice { margin-block: 8px; padding: 12px; }
  .connection-retry { width: 100%; }
}

/* Personal assistant: floating, non-modal support that preserves the current workspace. */
.assistant-launcher[hidden], .assistant-chat[hidden] { display: none !important; }
.assistant-launcher { position: fixed; z-index: 90; right: max(22px, env(safe-area-inset-right)); bottom: max(22px, env(safe-area-inset-bottom)); display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 11px 18px; border: 1px solid #fff5; border-radius: 999px; background: var(--fsc-blue-deep); color: #fff; font-family: inherit; font-size: 13px; font-weight: 700; box-shadow: 0 12px 34px #153b7360; cursor: pointer; }
.assistant-launcher:hover { background: var(--fsc-blue); transform: translateY(-2px); }
.assistant-launcher svg { width: 22px; height: 22px; fill: var(--fsc-orange); }
.assistant-chat { position: fixed; z-index: 91; right: max(22px, env(safe-area-inset-right)); bottom: calc(88px + env(safe-area-inset-bottom)); width: min(410px, calc(100vw - 32px)); height: min(650px, calc(100dvh - 116px)); display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--fsc-border); border-radius: 20px; background: #fff; box-shadow: 0 24px 80px #153b7352; }
.assistant-chat-head { display: flex; align-items: center; gap: 12px; padding: 15px 17px; background: var(--fsc-blue-deep); color: #fff; }
.assistant-chat-mark { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 38px; border-radius: 12px; background: var(--fsc-orange); font-size: 23px; }
.assistant-chat-head div { min-width: 0; flex: 1; }
.assistant-chat-head h2 { margin: 0; color: #fff; font-size: 16px; line-height: 1.35; }
.assistant-chat-head p { margin: 2px 0 0; color: #d8e8fc; font-size: 11px; }
.assistant-chat-head button { width: 36px; height: 36px; border: 0; border-radius: 10px; background: #ffffff20; color: #fff; font-size: 25px; cursor: pointer; }
.assistant-chat-head button:hover { background: #ffffff37; }
.assistant-chat-head button:disabled { opacity: .45; cursor: wait; }
.assistant-chat-head p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.assistant-thread-list[hidden] { display: none !important; }
.assistant-thread-list { max-height: 220px; overflow-y: auto; border-bottom: 1px solid var(--fsc-border); background: #f8fbff; }
.assistant-thread-list-head { display: flex; justify-content: space-between; gap: 8px; padding: 12px 16px 8px; color: var(--fsc-blue-deep); font-size: 12px; }
.assistant-thread-list-head span { color: var(--fsc-muted); font-size: 10px; }
.assistant-thread-row { display: flex; align-items: stretch; margin: 3px 8px; border: 1px solid transparent; border-radius: 10px; }
.assistant-thread-row:hover, .assistant-thread-row.active { border-color: #cbdcf0; background: #fff; }
.assistant-thread-row > button:first-child { flex: 1; min-width: 0; padding: 9px 10px; border: 0; background: transparent; text-align: left; cursor: pointer; }
.assistant-thread-row strong, .assistant-thread-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.assistant-thread-row strong { color: var(--fsc-blue-deep); font-size: 12px; }
.assistant-thread-row small { margin-top: 3px; color: var(--fsc-muted); font-size: 10px; }
.assistant-thread-row .assistant-thread-delete { width: 36px; border: 0; border-radius: 8px; background: transparent; color: #9a4f3e; font-size: 20px; cursor: pointer; }
.assistant-thread-row .assistant-thread-delete:hover { background: #fff0ea; }
.assistant-thread-empty { margin: 0; padding: 15px 16px 20px; color: var(--fsc-muted); font-size: 12px; }
.assistant-quick-forms { display: flex; gap: 7px; padding: 9px 14px; border-bottom: 1px solid var(--fsc-border); background: #fff; }
.assistant-quick-forms button { min-height: 34px; padding: 6px 11px; border: 1px solid #c9d9ec; border-radius: 999px; background: #f8fbff; color: var(--fsc-blue-deep); font: inherit; font-size: 11px; font-weight: 700; cursor: pointer; }
.assistant-quick-forms button:hover { border-color: var(--fsc-orange); background: #fff6ee; }
@media (max-width: 430px) { .assistant-chat-head { gap: 6px; padding: 11px; } .assistant-chat-head button { width: 32px; height: 32px; flex: 0 0 32px; } .assistant-chat-mark { width: 32px; height: 32px; flex-basis: 32px; } }
.assistant-chat-context { padding: 0 16px; border-bottom: 1px solid var(--fsc-border); background: #f8fbff; }
.assistant-chat-context summary { padding: 12px 0; color: var(--fsc-blue-deep); font-size: 12px; font-weight: 700; cursor: pointer; }
.assistant-chat-context p { margin: 0 0 9px; color: var(--fsc-muted); font-size: 11px; line-height: 1.5; }
#assistantNotesOptions { display: grid; gap: 7px; max-height: 100px; overflow: auto; padding-bottom: 12px; }
#assistantNotesOptions label { display: flex; gap: 8px; align-items: center; color: var(--fsc-copy); font-size: 12px; }
.assistant-chat .assistant-messages { flex: 1; align-content: start; max-height: none; min-height: 0; margin: 0; padding: 18px; overflow: auto; gap: 16px; background: #fff; }
.assistant-empty { align-self: center; margin-top: 30px; padding: 0 12px; text-align: center; }
.assistant-empty > span { display: grid; place-items: center; width: 52px; height: 52px; margin: 0 auto 13px; border-radius: 16px; background: #fff0e3; color: var(--fsc-orange-dark); font-size: 27px; }
.assistant-empty h3 { margin: 0 0 7px; color: var(--fsc-blue-deep); font-size: 16px; }
.assistant-empty p { padding: 0; background: none; color: var(--fsc-muted); font-size: 12px; line-height: 1.6; }
.assistant-suggestions { display: flex; justify-content: center; flex-wrap: wrap; gap: 7px; margin-top: 16px; }
.assistant-suggestions button { min-height: 35px; padding: 7px 10px; border: 1px solid #bfcfe4; border-radius: 9px; background: #f6f9ff; color: var(--fsc-blue-deep); font-size: 11px; cursor: pointer; }
.assistant-message { max-width: 87%; min-width: 0; }
.assistant-message.user { justify-self: end; }
.assistant-message span { display: block; margin: 0 0 5px; color: var(--fsc-muted); font-size: 10px; font-weight: 700; }
.assistant-message.user span { text-align: right; }
.assistant-message p { margin: 0; padding: 11px 13px; border-radius: 14px 14px 14px 4px; background: #eef3fa; color: var(--fsc-ink); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; white-space: pre-wrap; }
.assistant-message.user p { border-radius: 14px 14px 4px 14px; background: var(--fsc-blue-deep); color: #fff; }
.assistant-chat .proposal-card { max-width: 100%; border-color: #f1c69e; }
.assistant-chat .proposal-card h4 { margin: 5px 0; color: var(--fsc-blue-deep); font-size: 13px; }
.assistant-chat .proposal-card p { margin: 6px 0; color: var(--fsc-copy); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.assistant-chat .proposal-card small { color: var(--fsc-muted); line-height: 1.5; }
.proposal-kicker { color: var(--fsc-orange-dark); font-size: 10px; font-weight: 800; letter-spacing: .05em; }
.proposal-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.assistant-chat .proposal-actions button { min-height: 40px; margin: 0; padding: 9px 12px; background: var(--fsc-orange-dark); color: #fff; font-size: 11px; }
.assistant-chat .proposal-actions button[data-proposal-dismiss] { border: 1px solid #d6e0ec; background: #fff; color: var(--fsc-blue-deep); }
.assistant-review .modal-card { width: min(580px,100%); }
.assistant-review-hint { grid-column: 1/-1; margin: 0; padding: 11px 13px; border-radius: 10px; background: #eff5fd; color: var(--fsc-blue-deep); font-size: 12px; line-height: 1.6; }
.assistant-review .modal-form label { font-size: 12px; }
.assistant-review .modal-form input, .assistant-review .modal-form select, .assistant-review .modal-form textarea { font-size: 14px; }
.assistant-inline-card { display: grid; gap: 11px; padding: 16px; border: 1px solid #cdddf0; border-radius: 16px; background: #f8fbff; box-shadow: 0 5px 16px #153b730c; }
.assistant-inline-card h3 { margin: -5px 0 0; color: var(--fsc-blue-deep); font-size: 16px; }
.assistant-inline-hint { margin: 0; padding: 0; background: none; color: var(--fsc-muted); font-size: 11px; line-height: 1.5; }
.assistant-inline-card label { display: grid; gap: 5px; color: var(--fsc-blue-deep); font-size: 12px; font-weight: 700; }
.assistant-inline-card label small { color: var(--fsc-muted); font-size: 11px; font-weight: 400; line-height: 1.45; }
.assistant-inline-card label b { display: inline; color: var(--fsc-orange-dark); }
.assistant-inline-card input, .assistant-inline-card select, .assistant-inline-card textarea { width: 100%; min-height: 43px; padding: 9px 11px; border: 1px solid #bdcde1; border-radius: 9px; background: #fff; color: var(--fsc-ink); font: inherit; font-size: 13px; font-weight: 400; }
.assistant-inline-card textarea { min-height: 82px; resize: vertical; }
.assistant-inline-card details { padding-top: 4px; border-top: 1px solid var(--fsc-border); }
.assistant-inline-card details summary { margin: 5px 0; padding: 7px 0; color: var(--fsc-blue-deep); font-size: 12px; font-weight: 700; cursor: pointer; }
.assistant-inline-card details label { margin-top: 10px; }
.assistant-inline-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 3px; }
.assistant-inline-actions button { min-height: 42px; padding: 9px 12px; border: 0; border-radius: 10px; background: var(--fsc-orange-dark); color: #fff; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.assistant-inline-actions button[data-assistant-form-dismiss] { border: 1px solid #cbd9e9; background: #fff; color: var(--fsc-blue-deep); }
.assistant-chat-composer { display: grid; gap: 7px; padding: 12px 15px 15px; border-top: 1px solid var(--fsc-border); background: #fff; }
.assistant-chat-composer label { color: var(--fsc-blue-deep); font-size: 11px; font-weight: 700; }
.assistant-chat-composer > div { display: flex; align-items: end; gap: 8px; padding: 7px; border: 1px solid #bfcfe4; border-radius: 13px; }
.assistant-chat-composer > div:focus-within { border-color: var(--fsc-blue); box-shadow: 0 0 0 3px #3556ad22; }
.assistant-chat-composer textarea { min-height: 46px; max-height: 120px; flex: 1; resize: vertical; padding: 6px; border: 0; outline: 0; font: inherit; font-size: 13px; }
.assistant-chat-composer textarea:focus-visible { outline: 0; }
.assistant-chat-composer button { width: 38px; height: 38px; flex: 0 0 38px; border: 0; border-radius: 10px; background: var(--fsc-orange-dark); color: #fff; font-size: 19px; cursor: pointer; }
.assistant-chat-composer button:disabled { opacity: .6; cursor: wait; }
.assistant-chat-composer small { color: var(--fsc-muted); font-size: 10px; }

@media (max-width: 1180px) {
  .dash-main { padding: 26px 24px 42px; }
  .dash-side { position: fixed; z-index: 80; left: 0; top: 0; bottom: 0; width: min(310px, 86vw); height: 100dvh; display: flex; transform: translateX(-105%); transition: transform .24s ease; }
  .dashboard-page.menu-open .dash-side { transform: translateX(0); }
  .portal-menu-btn { display: grid; place-items: center; }
}
@media (max-width: 980px) {
  .nav-row { min-height: 72px; }
  .menu-btn { display: grid; }
  .hero { min-height: auto; padding: 58px 0; }
  .hero-art { min-height: 390px; }
  .topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dash-columns { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .assistant-launcher { right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); }
  .assistant-chat { right: 8px; bottom: calc(76px + env(safe-area-inset-bottom)); width: calc(100vw - 16px); height: min(660px, calc(100dvh - 92px - env(safe-area-inset-bottom))); border-radius: 16px; }
  .assistant-review-hint { grid-column: auto; }
  :root { --shell: min(100% - 32px, 1280px); }
  .nav-row { gap: 8px; }
  .fschool-logo { width: 66px; }
  .brand { gap: 8px; }
  .brand-copy { padding-left: 8px; }
  .brand-copy b { font-size: 15px; }
  .brand-copy small { max-width: 93px; font-size: 7px; }
  .hero { padding: 45px 0 30px; }
  .hero h1 { font-size: clamp(32px, 8.5vw, 42px); }
  .hero-art { min-height: 320px; transform: scale(.78); margin: -22px -12%; }
  .hero-stats { width: 100%; justify-content: space-around; margin-top: 20px; padding-inline: 10px; }
  .hero-stats div { min-width: 0; flex: 1; text-align: center; padding-inline: 8px; }
  .section-space { padding: 50px 0; }
  .topic-grid { grid-template-columns: 1fr; }
  .course-grid { grid-template-columns: 1fr; }
  .inner-page { padding-top: 35px; }
  .dash-main { padding: 19px 14px 34px; }
  .dash-top { gap: 9px; }
  .dash-top h1 { font-size: 21px; }
  .dash-stats article { min-height: 105px; padding: 14px; }
  .admin-workspace { padding: 18px; }
  .dashboard-page:not([data-section="overview"]) .admin-workspace { min-height: 0; }
  .admin-workspace > .panel-head h3 { font-size: 20px; }
  .admin-table tbody { grid-template-columns: 1fr; }
  .admin-table td { font-size: 12px; }
  .admin-table tbody tr:has(td[colspan]) { display: block; }
  .admin-table td[colspan] { display: block; padding: 0; border: 0; }
  .admin-table td[colspan]::before { display: none; }
  .admin-table td[colspan] .admin-empty { width: 100%; }
  .editor-columns, .editor-settings, .editor-extra { grid-template-columns: 1fr; }
  .editor-intro { align-items: flex-start; }
  .editor-intro p { max-width: 22ch; }
  .editor-summary { min-width: 76px; padding: 12px 7px; }
  .calendar-day { min-height: 66px; }
  .login-art { min-height: 240px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* FPT Schools UX refresh: clear identity, readable controls, responsive workspaces. */
body { -webkit-font-smoothing: antialiased; }
.site-header { background: #fff; }
.topbar-inner { gap: 16px; font-size: 12px; letter-spacing: .01em; }
.nav-row { justify-content: space-between; }
.brand { flex-shrink: 0; }
.nav-actions { min-width: 0; flex-shrink: 1; }
#accountBtn {
  max-width: clamp(124px, 15vw, 220px);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-shrink: 1;
  font-weight: 700;
}
.desktop-nav button, .mobile-nav button { min-height: 44px; font-weight: 700; }
.pill, .filter, .admin-pager button, .row-actions button { transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease; }
.hero-actions .pill { min-height: 48px; }
.student-workspace { padding-block: clamp(22px, 4vw, 42px); }
.student-workspace[hidden] { display: none; }
body.student-mode .page[data-page="home"] .hero-wrap { display: none; }
.student-workspace-head { margin-bottom: 18px; }
.student-workspace-head h2 { margin: 6px 0; color: var(--fsc-blue-deep); font-size: clamp(24px, 3vw, 34px); line-height: 1.25; }
.student-workspace-head p { margin: 0; color: var(--fsc-muted); }
.student-workspace-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.student-workspace-card { min-width: 0; display: flex; flex-direction: column; gap: 9px; padding: 22px; border: 1px solid var(--fsc-border); border-radius: var(--fsc-radius); background: #fff; box-shadow: var(--fsc-shadow); }
.student-card-kicker { color: var(--fsc-orange-dark); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.student-workspace-card h3 { margin: 0; color: var(--fsc-blue-deep); font-size: 17px; line-height: 1.35; overflow-wrap: anywhere; }
.student-workspace-card h3 + h3 { font-size: 15px; }
.student-workspace-card p { margin: 0; color: var(--fsc-copy); font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; }
.student-workspace-card button { align-self: flex-start; min-height: 44px; margin-top: auto; }
.student-progress { display: grid; gap: 6px; color: var(--fsc-muted); font-size: 12px; }
.student-progress .progress { height: 7px; }
.student-workspace-loading { grid-column: 1/-1; padding: 22px; border-radius: var(--fsc-radius); background: var(--fsc-canvas); color: var(--fsc-muted); }
@media (max-width: 900px) { .student-workspace-cards { grid-template-columns: 1fr; } .student-workspace-card { padding: 18px; } }
.hero-copy .eyebrow { color: var(--fsc-orange-dark); letter-spacing: .085em; }
.hero-copy h1 { text-wrap: balance; }
.course-card, .topic-card { overflow: hidden; }
.course-card .course-body, .topic-card { min-width: 0; }
.course-card .course-body h3, .topic-card h3 { overflow-wrap: anywhere; }
.course-foot button, .topic-foot button { min-height: 44px; border-radius: 8px; }
.filter:focus-visible, .admin-table-wrap:focus-visible { outline: 3px solid var(--fsc-orange); outline-offset: 2px; }

/* Administrative information density with deliberate, readable hierarchy. */
.dashboard-page, .dash-main, .admin-workspace, .panel { min-width: 0; }
.dash-side { overscroll-behavior: contain; }
.dash-side nav button { font-size: 13px; line-height: 1.5; text-align: left; white-space: normal; word-break: normal; }
.dash-side nav button:hover { color: #fff; }
.dash-side nav button.active:hover { color: var(--fsc-blue-deep); }
.portal-nav-group { line-height: 1.45; }
.dash-top { min-width: 0; }
.dash-top > div { min-width: 0; }
.dash-top h1 { overflow-wrap: anywhere; line-height: 1.3; text-wrap: balance; }
.dash-stats { gap: 14px; }
.dash-stats article, .overview-shortcuts button, .quick-grid button { transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease; }
.dash-stats article:hover { transform: none; box-shadow: 0 12px 28px rgba(29,61,103,.09); }
.dashboard-page .panel { min-width: 0; }
.dashboard-page .panel-head { min-width: 0; flex-wrap: wrap; }
.dashboard-page .panel-head > div { min-width: 0; }
.cms-intro { border-radius: 12px; }
.cms-intro p { line-height: 1.65; font-size: 13px; }
.cms-metrics span { background: #fff; font-size: 12px; }
.admin-toolbar { flex-wrap: wrap; align-items: end; gap: 12px; }
.admin-search-label { flex: 1 1 260px; min-width: 190px; }
.admin-filter-label { flex: 0 1 190px; }
.admin-search-label, .admin-filter-label { font-size: 12px; }
.admin-search-label input, .admin-filter-label select { min-height: 46px; border-color: #bccde2; font-size: 14px; }
.admin-search-label input::placeholder { color: #63758b; }
.admin-toolbar .status-badge { margin-left: auto; padding: 9px 12px; border: 1px solid #d6e3f1; border-radius: 999px; background: #f0f5fc; color: var(--fsc-blue-deep); font-size: 12px; font-weight: 700; }
.admin-table-wrap { max-width: 100%; scrollbar-color: #aabfd8 #f6f9fc; }
.admin-table th { padding: 14px 12px; font-size: 12px; letter-spacing: .025em; }
.admin-table td, .admin-table .row-title { padding: 13px 12px; font-size: 13px; line-height: 1.6; }
.admin-table .row-title { font-weight: 700; }
.admin-table td.row-actions { white-space: normal; }
.admin-table td.row-actions button, .admin-pager button { min-height: 44px; padding: 9px 12px; font-size: 12px; font-weight: 700; }
.admin-table td.row-actions button[data-delete-id] { border-color: #f1cfcf; color: #9b3030; }
.admin-table td.row-actions button[data-delete-id]:hover { border-color: #d98888; background: #fff4f4; color: #852424; }
.admin-empty { font-size: 14px; line-height: 1.7; }
.admin-pager { font-size: 13px; }
.modal-form input, .modal-form textarea, .modal-form select, .staff-form input, .staff-form textarea, .staff-form select { min-height: 44px; font-size: 14px; }
.portal-close, .portal-menu-btn { min-width: 44px; min-height: 44px; }

@media (min-width: 1181px) {
  .dashboard-page.active { grid-template-columns: 280px minmax(0, 1fr); }
  .dash-side { padding-inline: 18px; }
  .dash-side nav button { font-size: 13.5px; }
  .admin-workspace { padding: 30px clamp(22px, 2.5vw, 38px); }
}
@media (max-width: 1180px) {
  .nav-row { gap: 14px; }
  .dash-side { box-shadow: 16px 0 42px rgba(13,31,61,.2); }
  .portal-scrim { backdrop-filter: blur(2px); }
  .portal-menu-btn { display: grid; place-items: center; }
  body.portal-nav-open { overflow: hidden; }
}
@media (max-width: 1100px) {
  #adminBtn { display: none !important; }
  .nav-actions .icon-btn { display: none; }
  .desktop-nav { display: none; }
  .menu-btn { display: grid; place-items: center; flex: 0 0 44px; }
  .mobile-nav.open { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px 20px 20px; }
}
@media (max-width: 980px) {
  .nav-row { min-height: 76px; }
  .mobile-nav { border-top: 1px solid var(--fsc-border); box-shadow: 0 18px 30px rgba(21,59,115,.1); }
  .mobile-nav.open { padding-block: 9px; }
  .mobile-nav button { padding-block: 13px; text-align: left; }
  .hero { align-items: center; }
  .hero-copy { min-width: 0; }
  .hero h1 { font-size: clamp(33px, 5vw, 48px); }
}
@media (max-width: 900px) {
  .admin-table-wrap { overflow: visible; }
  .admin-table { min-width: 0; }
  .admin-table tbody { grid-template-columns: 1fr; }
  .admin-table tr { border: 1px solid var(--fsc-border); box-shadow: 0 6px 20px rgba(21,59,115,.05); }
  .admin-table td { min-width: 0; padding: 10px 0; font-size: 13px; }
  .admin-table td::before { color: #4a627e; font-size: 12px; }
  .admin-table td.row-actions { flex-wrap: wrap; justify-content: flex-start; }
  .admin-table td.row-actions button { min-width: 76px; }
  .admin-toolbar .status-badge { margin-left: 0; }
  .cms-metrics { gap: 7px; }
}
@media (max-width: 680px) {
  :root { --shell: min(100% - 32px, 1280px); }
  .topbar { display: none; }
  .nav-actions #accountBtn { display: inline-flex; align-items: center; justify-content: center; }
  .nav-row { min-height: 68px; gap: 8px; }
  .fschool-logo { width: 72px; }
  .brand-copy { padding-left: 9px; }
  .brand-copy b { font-size: 15px; }
  .brand-copy small { max-width: 90px; font-size: 8px; letter-spacing: 0; }
  .nav-actions { gap: 6px; margin-left: auto; }
  #accountBtn { max-width: min(30vw, 124px); padding-inline: 9px; font-size: 12px; }
  .menu-btn { width: 44px; min-width: 44px; height: 44px; }
  .hero { padding-top: 40px; }
  .hero p { font-size: 15px; line-height: 1.7; }
  .hero-actions { align-items: stretch; }
  .hero-actions .pill { min-height: 48px; }
  .hero-stats { padding: 12px 7px; }
  .hero-stats div { padding-inline: 7px; }
  .section-heading { gap: 14px; }
  .section-heading h2 { font-size: clamp(24px, 7vw, 30px); }
  .dash-main { padding: 20px 14px 38px; }
  .dash-top { grid-template-columns: 44px minmax(0, 1fr) 44px; }
  .dash-top h1 { font-size: clamp(19px, 5.5vw, 23px); }
  .dash-top small { font-size: 11px; }
  .dash-stats { gap: 10px; }
  .dash-stats article { min-height: 116px; }
  .admin-workspace { padding: 18px 14px; }
  .admin-workspace > .panel-head { align-items: flex-start; }
  .admin-workspace > .panel-head h3 { font-size: 20px; line-height: 1.35; }
  #adminCreateBtn { max-width: 100%; min-height: 44px; white-space: normal; }
  .admin-toolbar { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; }
  .admin-search-label { min-width: 0; grid-column: 1/-1; }
  .admin-filter-label { min-width: 0; }
  .admin-filter-label select { min-width: 0; max-width: 100%; }
  .admin-toolbar .status-badge { justify-self: end; white-space: nowrap; }
  .admin-table td { grid-template-columns: minmax(88px, 35%) minmax(0,1fr); gap: 8px; }
  .admin-table td.row-actions { grid-template-columns: none; }
  .admin-table td.row-actions button { flex: 1 1 76px; }
  .admin-pager { flex-wrap: wrap; }
  .settings-grid { grid-template-columns: 1fr; }
  .modal-card { max-width: calc(100vw - 20px); }
}
@media (max-width: 365px) {
  .nav-actions #accountBtn { display: none; }
  .brand-copy small { display: none; }
  .nav-actions { gap: 4px; }
  .hero-stats div { padding-inline: 5px; }
  .dash-stats article { padding: 12px; }
  .admin-toolbar { grid-template-columns: 1fr; }
  .admin-filter-label, .admin-toolbar .status-badge { grid-column: 1/-1; justify-self: stretch; }
}
.student-course-card{grid-column:1/-1}
.student-course-progress{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.student-course-progress button{display:grid;gap:10px;width:100%;min-width:0;min-height:72px;margin:0;padding:14px;border:1px solid var(--fsc-border);border-radius:12px;background:var(--fsc-canvas);text-align:left;color:var(--fsc-blue-deep)}
.student-course-progress button:hover,.student-course-progress button:focus-visible{border-color:var(--fsc-orange)}
.student-course-progress button span:first-child{display:grid;gap:3px;min-width:0}.student-course-progress b{font-size:14px;overflow-wrap:anywhere}.student-course-progress small{color:var(--fsc-muted)}
.student-course-progress .progress{display:block;width:100%;height:7px;margin:0}
@media(max-width:680px){.student-course-progress{grid-template-columns:1fr}}
.lesson-preview-backdrop{z-index:1002}.lesson-preview-card{max-width:760px;max-height:min(85vh,850px);overflow:auto}.lesson-preview-card .lesson-rich-content{font-size:15px;line-height:1.75;white-space:normal;overflow-wrap:anywhere}.lesson-preview-meta{color:var(--fsc-muted);font-size:13px}.lesson-preview-links{display:flex;flex-wrap:wrap;gap:14px;margin-top:20px}.lesson-preview-links a{color:var(--fsc-blue-deep);font-weight:700}
.analytics-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}.analytics-filters label{display:grid;gap:5px;min-width:0;font-size:12px;font-weight:700}.analytics-filters select{width:100%;min-height:44px;border:1px solid var(--fsc-border);border-radius:10px;background:#fff;padding:8px;color:var(--fsc-blue-deep)}.analytics-row{grid-template-columns:minmax(0,1fr) auto auto;align-items:center;font-size:12px}.analytics-row>span:first-child{overflow-wrap:anywhere}.analytics-meter{grid-column:1/-1;height:5px;border-radius:9px;background:#e7edf2;overflow:hidden}.analytics-meter i{display:block;height:100%;background:var(--fsc-orange)}@media(max-width:800px){.analytics-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:440px){.analytics-filters{grid-template-columns:1fr}}
.admin-bulk-bar{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:10px 0 14px}.admin-bulk-bar span{font-size:13px;font-weight:700;color:var(--fsc-blue-deep);margin-right:auto}.admin-bulk-bar button{min-height:44px}.admin-table input[data-bulk-user]{width:20px;height:20px;accent-color:var(--fsc-orange)}.bulk-review ul{max-height:280px;overflow:auto;padding:0;list-style:none;border:1px solid var(--fsc-border);border-radius:12px}.bulk-review li{display:flex;flex-wrap:wrap;gap:6px 12px;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--fsc-border)}.bulk-review li:last-child{border:0}.bulk-review li small{color:var(--fsc-muted)}
.pill.danger{background:#b84040;color:#fff}.pill.danger:hover{background:#963333}
.login-page .password input { padding-right: 74px; }
.login-password-toggle { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border: 0; border-radius: 6px; background: transparent; color: #153b73; padding: 8px; font-size: 12px; font-weight: 700; }
.login-password-toggle:focus-visible { outline: 3px solid #153b73; outline-offset: 2px; }

/* Compact mobile discovery: show subject content sooner and keep every tab visible. */
@media (max-width: 680px) {
  .page[data-page="home"] .hero { display: block; min-height: 0; padding: 28px 0 26px; }
  .page[data-page="home"] .hero-art { display: none; }
  .page[data-page="home"] .hero h1 { font-size: clamp(29px, 8vw, 35px); line-height: 1.13; margin: 10px 0 12px; }
  .page[data-page="home"] .hero p { margin: 0; font-size: 14px; line-height: 1.55; }
  .page[data-page="home"] .hero-actions { margin: 18px 0 0; gap: 8px; }
  .page[data-page="home"] .hero-stats { margin-top: 18px; }
  .subject-home.section-space { padding-block: 34px; }
  .subject-home > .section-heading { margin-bottom: 12px; }
  .subject-tabs { flex-wrap: wrap; overflow: visible; gap: 8px; margin: 12px 0 18px; padding: 0; }
  .subject-tabs button { min-height: 44px; padding: 8px 14px; font-size: 13px; line-height: 1.3; }
  .subject-panel { padding: 20px 16px; }
  .subject-panel-block { margin-top: 22px; }
  .subject-panel-block .section-heading { margin-bottom: 12px; }
  .subject-panel-block .announcement-card, .subject-panel-block .topic-card { padding: 16px; }
  .subject-panel-block .topic-icon { width: 42px; height: 42px; margin-bottom: 10px; font-size: 15px; }
  .subject-panel-block .topic-card h4 { margin-block: 9px; }
  .subject-panel-block .topic-card p { margin-bottom: 12px; }
  .subject-panel-block .text-link { min-height: 44px; padding: 8px; }
  .course-cover { height: 140px; min-height: 0; padding: 20px; }
  .course-cover b { font-size: 19px; line-height: 1.25; }
  .course-body { min-height: 0; padding: 17px; }
  .course-body h3 { font-size: 17px; }
  .course-foot button { min-height: 44px; }
  .exam-band-inner { grid-template-columns: 1fr; padding-block: 38px; }
  .exam-band-inner .score-ring { display: none; }
  .site-footer { padding-top: 30px; }
  .footer-grid { gap: 24px; }
}

/* Course navigation and a consistent, gentle color for each subject. */
.tone-peach { --subject-bg: #fff0e4; --subject-ink: #793916; --subject-border: #edc4a8; --subject-accent: #c45b20; }
.tone-lavender { --subject-bg: #f1ecff; --subject-ink: #4c397b; --subject-border: #d7c9f2; --subject-accent: #7657ab; }
.tone-mint { --subject-bg: #e6f7ee; --subject-ink: #245b43; --subject-border: #bae3cd; --subject-accent: #277650; }
.tone-sky { --subject-bg: #e8f3ff; --subject-ink: #254d77; --subject-border: #bfdaf3; --subject-accent: #366fa9; }
.tone-lemon { --subject-bg: #fff7dc; --subject-ink: #69521b; --subject-border: #eedda5; --subject-accent: #8a6920; }
.nav-course-group { position: relative; }
.desktop-nav [data-course-menu-toggle] { display: inline-flex; align-items: center; gap: 7px; }
.course-chevron { display: block; width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s ease; }
[data-course-menu-toggle][aria-expanded="true"] .course-chevron { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .course-chevron { transition: none; } }
.course-dropdown[hidden], .mobile-course-menu[hidden] { display: none; }
.course-dropdown { position: absolute; top: calc(100% + 8px); left: 0; z-index: 40; width: min(310px, calc(100vw - 32px)); display: grid; gap: 8px; padding: 14px; border: 1px solid var(--fsc-border); border-radius: 16px; background: #fff; box-shadow: 0 18px 40px rgba(21,59,115,.16); }
.course-menu-label { margin: 8px 2px 0; padding-top: 11px; border-top: 1px solid var(--fsc-border); color: var(--fsc-muted); font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.course-dropdown-subjects, .mobile-subject-links { display: grid; gap: 8px; }
.desktop-nav .course-dropdown button, .mobile-course-menu button { width: 100%; min-height: 44px; border-radius: 10px; text-align: left; font-size: 14px; }
.desktop-nav .course-dropdown button[data-course-all], .mobile-course-menu button[data-course-all] { color: var(--fsc-blue-deep); font-weight: 800; background: #f1f5fb; }
.nav-subject, .filter.tone-peach, .filter.tone-lavender, .filter.tone-mint, .filter.tone-sky, .filter.tone-lemon { border: 1px solid var(--subject-border); background: var(--subject-bg); color: var(--subject-ink); }
.desktop-nav .course-dropdown .nav-subject, .mobile-nav .mobile-course-menu .nav-subject { border: 1px solid var(--subject-border); background: var(--subject-bg); color: var(--subject-ink); }
.desktop-nav .course-dropdown .nav-subject, .mobile-nav .mobile-course-menu .nav-subject { display: flex; align-items: center; gap: 10px; }
.nav-subject::before { content: ""; flex: 0 0 10px; width: 10px; height: 10px; border-radius: 50%; background: var(--subject-accent); box-shadow: 0 0 0 3px #ffffffb8; }
.desktop-nav .course-dropdown .nav-subject:hover, .mobile-course-menu .nav-subject:hover, .nav-subject[aria-current="true"] { background: var(--subject-bg); color: var(--subject-ink); box-shadow: inset 4px 0 var(--subject-accent); }
.desktop-nav button:focus-visible, .mobile-nav button:focus-visible { outline: 3px solid var(--fsc-orange-dark); outline-offset: 2px; }
.subject-panel.tone-peach, .subject-panel.tone-lavender, .subject-panel.tone-mint, .subject-panel.tone-sky, .subject-panel.tone-lemon { border-top: 4px solid var(--subject-border); }
.subject-panel .subject-panel-intro .eyebrow { color: var(--subject-accent); }
.subject-panel .subject-panel-intro { padding: 18px 20px; border: 1px solid var(--subject-border); border-radius: 12px; background: var(--subject-bg); }
.subject-panel .subject-panel-intro p { color: var(--subject-ink); line-height: 1.55; }
.subject-panel .topic-icon.tone-peach, .subject-panel .topic-icon.tone-lavender, .subject-panel .topic-icon.tone-mint, .subject-panel .topic-icon.tone-sky, .subject-panel .topic-icon.tone-lemon, .tag.tone-peach, .tag.tone-lavender, .tag.tone-mint, .tag.tone-sky, .tag.tone-lemon { background: var(--subject-bg); color: var(--subject-ink); }
.course-cover.tone-peach, .course-cover.tone-lavender, .course-cover.tone-mint, .course-cover.tone-sky, .course-cover.tone-lemon { background: linear-gradient(135deg, var(--subject-bg), #fff); border-bottom: 1px solid var(--subject-border); }
.course-cover.tone-peach::after, .course-cover.tone-lavender::after, .course-cover.tone-mint::after, .course-cover.tone-sky::after, .course-cover.tone-lemon::after { display: none; }
.course-cover.tone-peach b, .course-cover.tone-lavender b, .course-cover.tone-mint b, .course-cover.tone-sky b, .course-cover.tone-lemon b, .course-cover.tone-peach span, .course-cover.tone-lavender span, .course-cover.tone-mint span, .course-cover.tone-sky span, .course-cover.tone-lemon span { color: var(--subject-ink); }
.filter.tone-peach.active, .filter.tone-lavender.active, .filter.tone-mint.active, .filter.tone-sky.active, .filter.tone-lemon.active { background: var(--subject-ink); border-color: var(--subject-ink); color: #fff; }
@media (max-width: 1100px) {
  .mobile-course-group { grid-column: 1 / -1; min-width: 0; }
  .mobile-course-group > button { width: 100%; display: flex; align-items: center; justify-content: space-between; }
  .mobile-course-menu { display: grid; gap: 8px; padding: 8px 0 12px; }
  .mobile-course-menu .course-menu-label { margin-top: 4px; }
  .mobile-subject-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mobile-course-menu .nav-subject { padding: 9px 12px; white-space: normal; }
}
@media (max-width: 380px) { .mobile-subject-links { grid-template-columns: 1fr; } }
.teacher-subject-summary{display:grid;gap:1.25rem;margin:0 0 1.5rem;padding:1.5rem;border:1px solid #dce5ee;border-radius:1.25rem;background:linear-gradient(135deg,#f9fbff,#fff8f2)}
.teacher-subject-summary h3{margin:.3rem 0;color:#143b70;font-size:1.3rem}
.teacher-subject-summary p{margin:0;color:#66788b}
.teacher-subject-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.8rem}
.teacher-subject-cards article{display:grid;gap:.35rem;padding:1rem;border:1px solid #e0e8f0;border-radius:1rem;background:#fff;box-shadow:0 6px 20px rgba(22,54,91,.04)}
.teacher-subject-cards strong{color:#173b6b}.teacher-subject-cards span,.teacher-subject-cards small{color:#66788b}
.dashboard-page[data-section="overview"] .admin-workspace{display:block}
.dashboard-page[data-section="overview"] .admin-workspace>.panel-head{display:none}
#teacherSubjectHighlights:empty{display:none}

.subject-panel[class*="design-layout-"]{background:var(--design-bg,#fff);border-color:color-mix(in srgb,var(--design-accent,#ad4207) 22%,#dce5ee)}
.subject-panel[class*="design-layout-"] .subject-panel-intro .eyebrow,.subject-panel[class*="design-layout-"] .subject-panel-intro h3,.subject-panel[class*="design-layout-"] .subject-panel-block h3{color:var(--design-accent,#ad4207)}
.subject-panel-intro h3{margin:.45rem 0;font-size:clamp(1.5rem,2.5vw,2.2rem);line-height:1.2;color:#173b6b}
.subject-panel[class*="design-layout-"] .announcement-card,.subject-panel[class*="design-layout-"] .topic-card{border-radius:1rem}
.subject-panel.design-card-outline .announcement-card,.subject-panel.design-card-outline .topic-card{box-shadow:none;border:2px solid color-mix(in srgb,var(--design-accent) 30%,#dce5ee)}
.subject-panel.design-card-flat .announcement-card,.subject-panel.design-card-flat .topic-card{box-shadow:none;border-color:transparent;background:color-mix(in srgb,var(--design-bg) 50%,white)}
.subject-panel.design-density-compact{padding:18px}.subject-panel.design-density-compact .subject-panel-block{margin-top:17px}.subject-panel.design-density-compact .announcement-card,.subject-panel.design-density-compact .topic-card{padding:14px}
.subject-panel.design-layout-compact .topic-grid,.subject-panel.design-layout-compact .announcement-grid{grid-template-columns:1fr}
.subject-panel.design-layout-compact .topic-card,.subject-panel.design-layout-compact .announcement-card{display:grid;gap:.25rem}
.subject-panel.design-layout-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;align-items:start}
.subject-panel.design-layout-grid .subject-panel-intro{grid-column:1/-1}.subject-panel.design-layout-grid .subject-panel-block{min-width:0}
.subject-panel [hidden]{display:none!important}
@media(max-width:800px){.subject-panel.design-layout-grid{display:block}}

.design-studio{display:grid;gap:22px}.design-studio-head{display:flex;justify-content:space-between;align-items:end;gap:18px}.design-studio-head h2{margin:.3rem 0;color:#173b6b}.design-studio-head p{max-width:680px;color:#66788b;margin:.35rem 0}.design-studio-head>label{min-width:220px;font-weight:700;color:#304963}
.design-studio-grid{display:grid;grid-template-columns:minmax(260px,390px) minmax(0,1fr);gap:22px;align-items:start}.design-controls{display:grid;gap:15px}.design-controls fieldset{display:grid;gap:13px;margin:0;padding:19px;border:1px solid #dce5ee;border-radius:17px;background:#fff}.design-controls legend{padding:0 8px;color:#b34a07;font-weight:800}.design-controls label{display:grid;gap:7px;font-size:.9rem;font-weight:700;color:#304963}.design-controls input:not([type="checkbox"]),.design-controls select,.design-controls textarea,.design-studio-head select{width:100%;min-height:44px;border:1px solid #d7e2ed;border-radius:10px;background:#fff;padding:9px 11px;color:#18385f;font:inherit}.design-controls textarea{resize:vertical}.design-color-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.design-controls input[type="color"]{padding:4px;width:100%;height:46px}.design-controls label.design-toggle{display:flex;align-items:center;gap:10px;font-weight:600}.design-toggle input{width:18px;height:18px;accent-color:#ad4207}
.design-preview-wrap{border:1px solid #dce5ee;border-radius:18px;background:#f5f8fc;padding:15px}.design-preview-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 14px}.design-preview-head div{display:grid}.design-preview-head strong{color:#173b6b}.design-preview-head small{color:#66788b}.design-preview-head span{font-size:.78rem;color:#b34a07;font-weight:700}.design-preview{min-height:370px;box-shadow:0 12px 36px rgba(20,59,112,.07)}.design-preview .subject-panel-block h4{margin:0 0 12px;color:#173b6b}.design-preview .topic-grid,.design-preview .announcement-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}.design-preview .topic-card,.design-preview .announcement-card{min-width:0}
.design-studio-actions{position:sticky;bottom:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;border:1px solid #dce5ee;border-radius:16px;background:rgba(255,255,255,.97);box-shadow:0 -8px 25px rgba(20,59,112,.06)}.design-studio-actions>span{font-size:.85rem;color:#66788b}.design-studio-actions>div{display:flex;flex-wrap:wrap;gap:9px}
@media(max-width:1000px){.design-studio-grid{grid-template-columns:1fr}.design-studio-head{align-items:start;flex-direction:column}.design-studio-head>label{width:100%}}
@media(max-width:650px){.design-studio-actions{position:static;align-items:stretch;flex-direction:column}.design-studio-actions>div{display:grid;grid-template-columns:1fr 1fr}.design-studio-actions [data-design-action="restore"]{grid-column:1/-1}.design-studio-actions button{min-height:44px}.design-preview{padding:18px 14px}}

.exam-import{display:grid;gap:20px;max-width:1120px}.exam-import .editor-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.exam-import .editor-topline span{color:#60748b;font-size:.85rem}.import-upload,.import-review{border:1px solid #dce5ee;border-radius:18px;background:#fff;padding:clamp(17px,3vw,28px)}.import-upload h3,.import-review h3{margin:.3rem 0;color:#153b73}.import-upload-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}.import-upload label,.import-review label{display:grid;gap:7px;color:#2c4562;font-size:.88rem;font-weight:700}.import-upload label.import-file{grid-column:1/-1}.import-upload input,.import-upload select,.import-review input,.import-review textarea,.import-review select{width:100%;min-height:44px;border:1px solid #d8e3ed;border-radius:10px;background:#fff;color:#193a64;padding:10px 12px;font:inherit}.import-upload input[type="file"]{padding:9px}.import-upload input[type="file"]::file-selector-button{border:0;border-radius:8px;background:#eaf2ff;color:#153b73;padding:8px 12px;margin-right:10px;font-weight:700;cursor:pointer}.import-hint,.import-review-head p{color:#66788b;line-height:1.6;font-size:.88rem}.import-upload-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.import-upload-actions span,.import-commit p{color:#66788b;font-size:.85rem}.import-empty{padding:35px 16px;text-align:center;color:#718398;border:1px dashed #d5e2ef;border-radius:12px;background:#f8fbff}.import-review{scroll-margin-top:20px}.import-review-head,.import-commit{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.import-warning,.import-issues{padding:10px 13px;border-radius:10px;background:#fff3e7;color:#9a3e05;font-weight:700;font-size:.83rem}.import-exam-meta{display:grid;grid-template-columns:minmax(0,2fr) minmax(120px,1fr);gap:14px;margin:20px 0}.import-question-list{display:grid;gap:16px}.import-question{display:grid;gap:13px;border:1px solid #dce5ee;border-radius:15px;padding:18px;background:#fbfdff;scroll-margin-top:20px}.import-question header{display:flex;align-items:center;justify-content:space-between;gap:8px}.import-question header span{display:inline-flex;align-items:center;border-radius:8px;background:#fff0e6;color:#ae4306;padding:6px 10px;font-weight:800}.import-question header button{border:0;background:transparent;color:#aa4610;font-weight:700}.import-question-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.import-question textarea{resize:vertical;min-height:72px}.import-question .import-answer-hint{color:#66788b;line-height:1.45}.import-question details{border-top:1px solid #dce5ee;padding-top:10px}.import-question details summary{color:#153b73;font-weight:700;cursor:pointer}.import-question details label{margin-top:12px}.import-commit{margin-top:20px;padding-top:16px;border-top:1px solid #dce5ee}.import-commit p{margin:0}
@media(max-width:700px){.import-upload-fields,.import-exam-meta,.import-question-row{grid-template-columns:1fr}.import-upload-actions button,.import-commit button{width:100%}.import-review-head{align-items:flex-start}.exam-editor .editor-topline [data-editor-action="import"]{min-height:40px}}
.exam-monitor-note{max-width:1180px;margin:12px auto;padding:10px 18px;color:#52647b;font-size:.86rem;line-height:1.5;background:#f4f8fc;border:1px solid #dce8f3;border-radius:12px}
.exam-monitor{display:grid;gap:20px}.exam-monitor-intro{padding:24px;border-radius:20px;background:linear-gradient(130deg,#fff8f1,#f3f8ff);border:1px solid #e7eaf1}.exam-monitor-intro h2{margin:6px 0 8px;color:#163766}.exam-monitor-intro p{max-width:760px;color:#556780;line-height:1.6;margin:0}.exam-monitor-filters{display:flex;flex-wrap:wrap;gap:14px}.exam-monitor-filters label{display:grid;gap:7px;min-width:min(100%,220px);color:#354b66;font-weight:700}.exam-monitor-filters select{min-height:44px;padding:8px 12px;border:1px solid #d7e2ee;border-radius:12px;background:#fff;color:#203c60}.exam-monitor-list{display:grid;gap:12px}.exam-monitor-event{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;background:#fff;border:1px solid #dce6ef;border-radius:16px;box-shadow:0 5px 20px rgba(28,54,83,.04)}.exam-monitor-event h3{margin:6px 0 3px;color:#163766}.exam-monitor-event p{margin:0 0 5px;color:#53667d}.exam-monitor-event small,.exam-monitor-footnote{color:#63758a}.exam-monitor-kind{display:inline-flex;padding:4px 9px;border-radius:999px;background:#fff1e7;color:#a4470a;font-size:.8rem;font-weight:700}.exam-monitor-action span{color:#236c50;font-weight:700}.exam-monitor-footnote{font-size:.83rem;margin:0}
@media(max-width:640px){.exam-monitor-event{align-items:flex-start;flex-direction:column}.exam-monitor-action,.exam-monitor-action button{width:100%}.exam-monitor-note{margin:10px 14px}}
.lesson-block-toolbar{display:flex;flex-wrap:wrap;gap:8px;padding:0 0 18px}.lesson-block-toolbar button{min-height:40px;padding:8px 12px;border:1px solid #d9e3ef;border-radius:10px;background:#f7faff;color:#173a68;font-weight:700;cursor:pointer}.lesson-block-toolbar button:hover,.lesson-block-toolbar button:focus-visible{border-color:#ea7a3c;background:#fff7f0}.lesson-block-list{display:grid;gap:14px;margin-bottom:20px}.lesson-block-empty{padding:30px;border:1px dashed #cbd9e8;border-radius:16px;background:#f8fbff;text-align:center;color:#61758e}.lesson-block-card{border:1px solid #dce6f0;border-radius:16px;background:#fff;box-shadow:0 5px 16px rgba(22,47,78,.04);overflow:hidden}.lesson-block-card:focus-within{border-color:#ee9d69}.lesson-block-head{display:flex;align-items:center;gap:9px;padding:12px 16px;background:#f4f8fd;border-bottom:1px solid #e2eaf3;color:#1d416e}.lesson-block-handle{font-size:1.15rem;color:#8a9db3;cursor:grab}.lesson-block-number{font-size:.78rem;font-weight:800;color:#b4490c}.lesson-block-actions{display:flex;gap:5px;margin-left:auto}.lesson-block-actions button{min-width:34px;min-height:34px;border:1px solid #d9e3ee;border-radius:9px;background:#fff;color:#244a76;cursor:pointer}.lesson-block-actions button:disabled{opacity:.4;cursor:not-allowed}.lesson-block-fields{display:grid;gap:14px;padding:18px}.lesson-block-fields label{display:grid;gap:7px;color:#344d69;font-weight:700}.lesson-block-fields input,.lesson-block-fields textarea,.lesson-block-fields select{width:100%;min-height:44px;padding:10px 12px;border:1px solid #d5e1ee;border-radius:11px;background:#fff;color:#1b3659;font:inherit}.lesson-block-fields textarea{min-height:85px;resize:vertical}.lesson-block-help{margin:0;color:#64778e;font-size:.9rem}.lesson-block-heading{margin:28px 0 14px;color:#173b6d}.lesson-block-text{margin:16px 0}.lesson-block-video{aspect-ratio:16/9;margin:20px 0;border-radius:16px;overflow:hidden;background:#13263d}.lesson-block-video iframe{display:block;width:100%;height:100%;border:0}.lesson-block-resource{display:flex;align-items:center;gap:12px;margin:16px 0;padding:16px;border:1px solid #d8e6f2;border-radius:14px;background:#f4f9ff;color:#174676;text-decoration:none}.lesson-block-resource span{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#e3f0fc;font-size:1.2rem}.lesson-block-resource small{margin-left:auto;color:#60758d}.lesson-practice{margin:24px 0;padding:22px;border:1px solid #dce7f0;border-radius:18px;background:#fbfdff}.lesson-practice h3{margin:9px 0 17px;color:#173966}.lesson-practice-options{display:grid;gap:9px;margin-bottom:16px}.lesson-practice-options label{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1px solid #dbe5ef;border-radius:11px;background:#fff;cursor:pointer}.lesson-practice-options label:has(input:checked){border-color:#e87835;background:#fff8f2}.lesson-practice-options span{font-weight:800;color:#b45215}.lesson-practice-short{display:grid;gap:7px;margin-bottom:15px;font-weight:700}.lesson-practice-short input{min-height:44px;padding:10px 12px;border:1px solid #d9e4ef;border-radius:10px;font:inherit}.lesson-practice-feedback{margin:12px 0 0;min-height:1.4em;color:#586a80}.lesson-practice-feedback.correct{color:#176546}.lesson-practice-feedback.incorrect{color:#a64412}
@media(max-width:640px){.lesson-block-toolbar button{flex:1 1 calc(50% - 8px)}.lesson-block-card{border-radius:13px}.lesson-block-head{padding:10px}.lesson-block-fields{padding:14px}.lesson-block-resource{flex-wrap:wrap}.lesson-block-resource small{margin-left:0}}
@media(max-width:980px){.page[data-page="lesson"] .lesson-main{order:1}.page[data-page="lesson"] .lesson-sidebar{order:2}}
.subject-custom-block{margin-top:22px;padding:clamp(18px,2.6vw,28px);border:1px solid color-mix(in srgb,var(--design-accent,#ad4207) 23%,#dce5ee);border-radius:18px;background:color-mix(in srgb,var(--design-bg,#fff8f2) 55%,white);overflow-wrap:anywhere}.subject-custom-block h3{margin:0 0 8px;color:var(--design-accent,#ad4207);font-size:clamp(1.1rem,2vw,1.45rem)}.subject-custom-block p{margin:0;white-space:pre-line;line-height:1.65;color:#354b64}.subject-custom-block a{display:inline-flex;align-items:center;min-height:44px;margin-top:10px;color:var(--design-accent,#ad4207);font-weight:800;text-decoration:underline;text-underline-offset:3px}.subject-panel.design-layout-grid .subject-custom-block{grid-column:1/-1}
.design-custom-editor>p,.design-custom-empty{margin:0;color:#61758c;font-size:.88rem;line-height:1.5}.design-custom-editor>#designAddSection{justify-self:start;min-height:42px}.design-custom-card{display:grid;gap:12px;padding:15px;border:1px solid #d9e5f1;border-radius:14px;background:#f8fbff}.design-custom-card+.design-custom-card{margin-top:12px}.design-custom-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#173b6b}.design-custom-card-head>div{display:flex;gap:5px}.design-custom-card-head button{min-width:36px;min-height:36px;border:1px solid #d4e1ed;border-radius:9px;background:#fff;color:#23507d;cursor:pointer}.design-custom-card-head button:disabled{opacity:.45;cursor:not-allowed}
.lesson-practice-help{color:#586e86;font-size:.9rem}.lesson-practice-order{display:grid;gap:9px;list-style:none;counter-reset:practice-step;padding:0;margin:0 0 16px}.lesson-practice-order li{counter-increment:practice-step;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #dbe5ef;border-radius:11px;background:#fff}.lesson-practice-order li:before{content:counter(practice-step,decimal-leading-zero);color:#b45215;font-weight:800}.lesson-practice-order li>span{flex:1;overflow-wrap:anywhere}.lesson-practice-order li>div{display:flex;gap:5px}.lesson-practice-order button{min-width:38px;min-height:38px;border:1px solid #d8e3ee;border-radius:9px;background:#f5f9fe;color:#174676;cursor:pointer}
