:root {
  color-scheme: light;
  --navy: #173847;
  --navy-2: #24576a;
  --teal: #087f73;
  --teal-hover: #066b62;
  --teal-soft: #e9f5f3;
  --bg: #f5f7f8;
  --surface: #fff;
  --text: #1f2d33;
  --muted: #66777f;
  --line: #dce3e6;
  --line-strong: #c8d3d8;
  --danger: #a93434;
  --danger-soft: #fff1f1;
  --warn: #986000;
  --warn-soft: #fff7e5;
  --shadow: 0 14px 38px rgba(23, 56, 71, .13);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* Click-through admin summary cards and their detail list. */
.metric-clickable { padding: 0 !important; overflow: hidden; }
.metric-action { width: 100%; height: 100%; padding: 17px; border: 0; background: var(--surface); color: inherit; text-align: left; }
.metric-action:hover { background: var(--teal-soft); }
.metric-action small { display: block; margin-top: 7px; color: var(--teal); font-size: .78rem; font-weight: 700; }
.metric-action small::after { content: ' ›'; font-size: 1rem; }
.metrics .urgent.has-value .metric-action { background: var(--danger-soft); }
.metrics .urgent.has-value .metric-action strong { color: var(--danger); }
.metrics .attention.has-value .metric-action { background: var(--warn-soft); }
.metrics .attention.has-value .metric-action strong { color: var(--warn); }
.student-link { padding: 0; border: 0; background: transparent; color: var(--navy-2); font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
dialog.wide-dialog { width: min(1000px,calc(100% - 28px)); max-height: 90vh; }
.admin-detail-wrap { max-height: 62vh; }
.admin-detail-wrap thead { position: sticky; top: 0; z-index: 1; background: var(--surface); }
@media(max-width:560px) {
  dialog.wide-dialog { width: 100%; max-height: 94dvh; }
  .admin-detail-wrap .mobile-card-table thead { position: absolute; }
  .metric-action { padding: 13px; }
}
* { box-sizing: border-box; }
body { min-height: 100vh; min-height: 100dvh; margin: 0; background: var(--bg); color: var(--text); font-size: 16px; line-height: 1.5; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(8, 127, 115, .22); outline-offset: 2px; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.primary, .secondary, .file-button, .icon-button { min-height: 42px; border: 1px solid transparent; border-radius: 9px; padding: 9px 15px; font-weight: 700; }
.primary { background: var(--teal); color: #fff; }
.primary:hover:not(:disabled) { background: var(--teal-hover); }
.secondary, .file-button { background: #fff; border-color: var(--line-strong); color: var(--navy); }
.login { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: var(--bg); }
.login-card { width: min(420px, 100%); padding: 32px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.brand-mark { width: 52px; height: 42px; display: grid; place-items: center; border-radius: 10px; background: var(--navy); color: #fff; font-size: .88rem; font-weight: 800; letter-spacing: .08em; white-space: nowrap; }
.brand-mark img { display: block; width: 100%; height: 100%; padding: 5px; object-fit: contain; border-radius: inherit; background: #fff; }
.eyebrow { margin: 16px 0 4px; color: var(--teal); font-size: .82rem; font-weight: 750; letter-spacing: .04em; }
.login h1, .topbar h1 { margin: 0; line-height: 1.2; }
.intro { margin: 10px 0 22px; color: var(--muted); }
.login label, .dialog-card label { font-weight: 650; }
.login > .login-card > label { display: grid; gap: 6px; margin: 13px 0; }
.login > .login-card > label.remember-login { display: flex; align-items: flex-start; gap: 9px; margin: 15px 0 3px; font-weight: 650; }
.login .remember-login input { width: 18px; min-width: 18px; height: 18px; min-height: 18px; padding: 0; margin: 2px 0 0; flex: 0 0 auto; }
#demoLoginFields > label { display: grid; gap: 6px; margin: 13px 0; }
#demoLoginFields > label.remember-login { display: flex; align-items: flex-start; gap: 9px; margin: 15px 0 3px; }
.remember-note { margin: 0 0 10px 27px; color: var(--muted); font-size: .82rem; line-height: 1.45; }
.login input, .dialog-card input, .dialog-card select, .dialog-card textarea, .class-picker select, .search { width: 100%; min-height: 44px; padding: 9px 11px; border: 1px solid var(--line-strong); border-radius: 9px; background: #fff; color: var(--text); }
.login .primary { width: 100%; margin-top: 8px; }
#dingtalkQrLoginButton { width: 100%; margin-top: 9px; }
.login-help { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--muted); font-size: .88rem; line-height: 1.65; overflow-wrap: anywhere; }
.login-help summary { min-height: 36px; color: var(--navy); cursor: pointer; font-weight: 650; }
.login-help summary:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; border-radius: 4px; }
.login-help ol { margin: 6px 0 10px; padding-left: 1.4em; }
.login-help li + li { margin-top: 8px; }
.login-help p { margin: 8px 0 0; }
.demo-tip { margin-bottom: 0; padding: 9px 11px; border-radius: 8px; background: var(--teal-soft); color: var(--navy); font-size: .88rem; }
.form-error { min-height: 1.4em; margin: 8px 0 0; color: var(--danger); font-size: .92rem; }
.entry-modes { display: flex; gap: 9px; margin-bottom: 13px; }
.entry-modes label { display: flex; align-items: center; gap: 7px; flex: 1; min-height: 42px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 9px; background: var(--bg); cursor: pointer; }
.entry-modes input { width: 18px; min-height: 18px; margin: 0; }
.app { min-height: 100vh; min-height: 100dvh; display: grid; grid-template-columns: 220px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 20px 14px; background: #f0f7fa; color: #203e4b; border-right: 1px solid #d7e3e8; display: flex; flex-direction: column; }
.brand { display: flex; align-items: center; gap: 10px; margin: 0 6px 24px; }
.brand .brand-mark { background: #fff; border: 1px solid #d7e3e8; }
.brand strong, .brand small { display: block; }
.brand small { color: #526d79; font-size: .78rem; }
.sidebar nav { display: grid; gap: 5px; }
.nav-more { display: none; }
.nav-group { margin: 13px 12px 2px; color: #536e7a; font-size: .72rem; font-weight: 750; letter-spacing: .08em; }
.nav-group:first-child { margin-top: 0; }
.nav-button { width: 100%; min-height: 44px; padding: 9px 12px; border: 1px solid #d4e1e6; border-radius: 9px; background: #fff; color: #294957; text-align: left; font-weight: 650; }
.nav-button:hover { background: #e7f3f2; border-color: #93bdb5; color: #075e54; }
.nav-button.active { background: #d8eee8; border-color: #63a998; color: #07594f; font-weight: 750; box-shadow: inset 0 -3px #087f73; }
.sidebar .nav-button { font-size: 15px; }
.nav-button:focus-visible { outline: 3px solid #4e988b; outline-offset: 2px; }
.logout { margin-top: auto; background: #fff; border-color: #bdcfd7; color: #294957; }
.logout:hover { background: #e7f3f2; border-color: #93bdb5; }
main { min-width: 0; padding: 0 28px 36px; }
.topbar { min-height: 92px; display: grid; align-content: center; gap: 10px; }
.topbar .eyebrow { margin-top: 0; }
.topbar h1 { font-size: 1.7rem; }
.topbar-actions { display: flex; align-items: center; justify-content: flex-start; gap: 10px; flex-wrap: wrap; }
.sync-control { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: .78rem; white-space: nowrap; }
.sync-button { display: grid; width: 36px; min-height: 36px; padding: 0; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: #fff; color: var(--navy); font-size: 1.18rem; line-height: 1; }
.sync-button:hover { border-color: var(--teal); background: var(--teal-soft); }
.sync-button:disabled { cursor: wait; opacity: .65; }
.class-picker { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: .9rem; }
.class-picker label { display: inline-flex; align-items: center; gap: 6px; }
.class-picker label > span { white-space: nowrap; }
.class-picker strong { padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--navy); }
.class-picker select { width: auto; min-width: 150px; }
.view { display: none; }
.view.active { display: block; }
.notice { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.notice strong { color: var(--navy); font-size: 1.08rem; }
.notice p { margin: 2px 0 0; color: var(--muted); font-size: .92rem; }
.metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; margin: 12px 0; }
.admin-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.admin-overview-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.campus-live-metrics{grid-template-columns:repeat(4,minmax(0,1fr));margin:4px 0 18px}
.campus-class-heading{font-size:15px;margin:18px 0 6px;color:var(--navy)}
.admin-growth-filters{align-items:end;flex-wrap:wrap}
.admin-growth-filters label{font-size:13px;min-width:120px}
.admin-growth-filters select{display:block;min-height:40px;margin-top:5px;max-width:220px}
.notice-target-summary{margin:0;padding:10px 12px;border-radius:8px;background:#edf4fa;color:#254b69;font-size:13px;line-height:1.65}
@media(max-width:640px){
 .campus-live-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .admin-growth-filters{width:100%}
 .admin-growth-filters label{flex:1;min-width:110px}
 .admin-growth-filters select{width:100%;max-width:none}
 .campus-class-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px}
 .campus-class-table tbody td{grid-template-columns:auto minmax(0,1fr);gap:6px;min-width:0;font-size:12px;min-height:32px}
 .campus-class-table tbody td:first-child,.campus-class-table tbody td:nth-child(4),.campus-class-table tbody td:last-child{grid-column:1/-1}
}
.admin-command-bar { align-items: stretch; padding: 16px 18px; background: var(--navy); }
.admin-command-bar > div:first-child { align-self: center; }
.admin-command-bar > div:first-child strong { color: #fff; }
.admin-command-bar > div:first-child p { color: #c9dce5; }
.admin-priority-actions { display: grid; grid-template-columns: repeat(2, minmax(150px, 1fr)); gap: 8px; min-width: min(420px, 48%); }
.priority-action { min-height: 62px; padding: 9px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 8px; background: rgba(255,255,255,.08); color: #fff; text-align: left; }
.priority-action:hover { background: rgba(255,255,255,.15); }
.priority-action span { display: block; color: #d4e6ec; font-size: .78rem; }
.priority-action strong { display: block; margin-top: 2px; color: inherit; font-size: 1.45rem; line-height: 1.1; }
.priority-action.has-value { border-color: #f0c36a; background: #fff3d6; color: #7a4300; }
.priority-action.has-value span { color: #815b25; }
.admin-analysis-controls { display: grid; gap: 10px; justify-items: start; }
.admin-scope-switch { display: grid; grid-template-columns: repeat(3, minmax(76px, 1fr)); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; }
.admin-scope-option { min-height: 40px; padding: 7px 15px; border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--navy-2); font-weight: 750; }
.admin-scope-option:last-child { border-right: 0; }
.admin-scope-option:hover { background: var(--teal-soft); }
.admin-scope-option.active { background: var(--teal); color: #fff; }
#adminAnalysisRange { display: block; margin-top: 4px; color: var(--muted); font-size: .76rem; text-align: center; }
.admin-analysis-export-actions { flex-wrap: nowrap; }
.admin-class-filters input[type="search"] { min-height: 40px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.admin-analysis-metrics { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.admin-analysis-metrics span { white-space: nowrap; }
.admin-analysis-breakdown { display: grid; gap: 18px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.admin-analysis-breakdown h3 { margin: 0 0 8px; color: var(--navy); font-size: .98rem; }
.admin-scope-note { margin: -2px 0 9px; color: #60737d; font-size: .82rem; line-height: 1.45; }
.admin-analysis-detail-panel .admin-analysis-breakdown { margin-top: 0; padding-top: 0; border-top: 0; }
.admin-distribution-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.admin-summary-table { min-width: 0; }
.admin-summary-table th, .admin-summary-table td { padding: 8px 9px; font-size: .84rem; }
.admin-certificate-metrics, .certificate-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 14px; }
.admin-certificate-metrics.has-carryover, .certificate-metrics.has-carryover { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-class-filters { align-items: center; }
.admin-notice-actions { align-items: end; }
.admin-notice-actions label { display: grid; gap: 4px; color: var(--muted); font-size: .82rem; }
.admin-notice-actions select { min-height: 42px; padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.admin-notice-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.check-filter { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--navy); font-size: .86rem; font-weight: 650; white-space: nowrap; }
.check-filter input { width: 17px; height: 17px; }
.teacher-command-bar { align-items: stretch; }
.teacher-command-intro { min-width: 210px; }
.teacher-command-intro .actions { margin-top: 10px; }
.teacher-task-actions { display: grid; grid-template-columns: repeat(2, minmax(130px, 1fr)); gap: 8px; min-width: min(360px, 46%); }
.task-action { min-height: 70px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--navy); text-align: left; }
.task-action:hover { border-color: var(--teal); background: var(--teal-soft); }
.task-action span { display: block; color: var(--muted); font-size: .78rem; }
.task-action strong, .notice .task-action strong { display: block; margin-top: 2px; color: var(--navy); font-size: 1.45rem; line-height: 1.1; }
.task-action.has-value { border-color: #e2bd71; background: var(--warn-soft); }
.task-action.has-value strong, .notice .task-action.has-value strong { color: var(--warn); }
.metrics article { min-width: 0; padding: 13px 15px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.metrics span { display: block; color: var(--muted); font-size: .84rem; }
.metrics strong { display: block; margin-top: 2px; color: var(--navy); font-size: 1.55rem; line-height: 1.2; }
.metrics strong.compact-value { font-size: .88rem; line-height: 1.55; }
.metrics .urgent.has-value { border-color: #efbaba; background: var(--danger-soft); }
.metrics .urgent.has-value strong { color: var(--danger); }
.metrics .attention.has-value { border-color: #ecd19b; background: var(--warn-soft); }
.metrics .attention.has-value strong { color: var(--warn); }
.secondary-metric { background: transparent !important; }
.panel { margin-top: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.panel-head { display: grid; gap: 10px; }
.panel-head > .actions, .panel-head > .admin-analysis-controls, .panel-head > .check-filter, .panel-head > .feature-badge, .panel-head > .primary, .panel-head > .secondary, .panel-head > .search { justify-self: start; }
.panel-head > .actions, .panel-head > .admin-analysis-controls { min-width: 0; max-width: 100%; }
.panel-head h2, .panel-head p { overflow-wrap: anywhere; }
.panel h2 { margin: 0; font-size: 1.08rem; }
.panel-head p, .empty-state p, .status-list p { margin: 3px 0 0; color: var(--muted); font-size: .92rem; }
/* Keep admin summary pages easy to scan: heading, note, label, value, then table detail. */
.view[data-panel="admin"] > .panel > .panel-head h2 { color: var(--navy); font-size: 1.18rem; font-weight: 800; line-height: 1.25; }
.view[data-panel="admin"] > .panel > .panel-head p { margin-top: 5px; color: #60737d; font-size: .86rem; font-weight: 500; }
.view[data-panel="admin"] > .panel > .metrics span { color: #526a74; font-size: .79rem; font-weight: 700; }
.view[data-panel="admin"] > .panel > .metrics strong { color: var(--teal); font-size: 1.68rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.view[data-panel="admin"] > .panel h3 { color: var(--navy-2); font-size: 1rem; font-weight: 800; }
.view[data-panel="admin"] > .panel table thead th { border-bottom: 2px solid var(--line-strong); background: #f2f7f7; color: var(--navy-2); font-size: .8rem; font-weight: 800; }
.view[data-panel="admin"] > .panel table tbody td { color: #35474f; font-size: .9rem; }
.view[data-panel="admin"] > .panel table tbody td:first-child { color: var(--navy); font-weight: 750; }
.view[data-panel="admin"] > .panel table tbody td:not(:first-child) { font-variant-numeric: tabular-nums; }
.action-list { display: grid; gap: 9px; margin-top: 13px; }
.notice-list { display: grid; gap: 9px; margin-top: 13px; overflow: visible; padding-right: 3px; }
.notice-list.is-collapsed { overflow: visible; }
.notice-list.is-collapsed .notice-card:nth-child(n+4) { display: none; }
.growth-list { display: grid; gap: 9px; margin-top: 13px; }
.growth-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.growth-card p { margin: 5px 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.growth-card small { color: var(--muted); }
.growth-filters { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 14px; }
.growth-filters label { display: grid; gap: 5px; color: var(--muted); font-size: .84rem; }
.growth-filters input, .growth-filters select { width: 100%; min-height: 42px; padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; }
.notice-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.notice-card.completed { background: #fafcfc; color: var(--muted); }
.notice-card p { margin: 3px 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.notice-card small { color: var(--muted); }
.notice-attachment { margin: 10px 0 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.notice-attachment small { color: var(--muted); }
.notice-image-attachment { display: block; max-width: 560px; }
.notice-image-attachment img { display: block; width: min(100%, 560px); max-height: 360px; object-fit: contain; object-position: left center; border: 1px solid var(--line); background: #f7fafb; border-radius: 8px; }
.notice-image-attachment figcaption { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.notice-card details { margin-top: 7px; color: var(--muted); font-size: .86rem; }
.notice-card summary { cursor: pointer; color: var(--navy-2); }
.notice-card .tag { margin-left: 7px; }
.competition-details { margin-top: 8px; }
.competition-details .table-wrap { max-width: 100%; margin-top: 7px; }
.competition-details table { min-width: 720px; }
.competition-details th, .competition-details td { padding: 7px 8px; }
.view[data-panel="notices"].active { display: flex; flex-direction: column; gap: 0; }
.view[data-panel="notices"] > .work-plan-notice-panel { order: 1; border-top: 4px solid var(--teal); }
.view[data-panel="notices"] > .competition-notice-panel { order: 2; border-top: 4px solid var(--warn); }
.view[data-panel="notices"] > .general-notice-panel { order: 3; border-top: 4px solid var(--navy-2); }
.notice-category-panel .panel-head h2 { font-size: 1.22rem; font-weight: 800; letter-spacing: .01em; }
.notice-category-panel .panel-head p { max-width: 760px; }

.evaluation-panel { padding-top: 16px; }
.evaluation-panel > .panel-head { gap: 12px; }
.evaluation-tabs { width: 100%; display: grid; grid-template-columns: repeat(3,minmax(86px,1fr)); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; }
.evaluation-tabs.admin-mode { grid-template-columns: repeat(2,minmax(86px,1fr)); }
.evaluation-tab { min-height: 40px; padding: 7px 13px; border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--navy-2); font-weight: 750; }
.evaluation-tab:last-child { border-right: 0; }
.evaluation-tab:hover { background: var(--teal-soft); }
.evaluation-tab.active { background: var(--teal); color: #fff; }
.evaluation-tab-panel { display: none; margin-top: 16px; }
.evaluation-tab-panel.active { display: block; }
.evaluation-context, .evaluation-filters { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: end; gap: 10px; }
.evaluation-context label, .evaluation-filters label, .evaluation-entry label { display: grid; gap: 5px; color: var(--muted); font-size: .86rem; font-weight: 700; }
.evaluation-context select, .evaluation-context input, .evaluation-filters select, .evaluation-filters input, .evaluation-entry textarea { width: 100%; min-height: 42px; padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.evaluation-permission-note { margin: 8px 0 12px; color: var(--muted); font-size: .86rem; }
.evaluation-presets { display: grid; gap: 8px; margin: 0 0 12px; }
.evaluation-presets > .field-label { display: block; color: var(--navy); font-weight: 800; line-height: 1.25; }
.evaluation-preset-list { width: 100%; display: flex; flex-wrap: wrap; gap: 7px; }
.evaluation-preset { min-height: 36px; padding: 6px 10px; border: 1px solid var(--line-strong); border-radius: 7px; background: #fff; color: var(--navy); font-weight: 700; }
.evaluation-preset:hover { border-color: var(--teal); background: var(--teal-soft); }
.evaluation-preset.warning { color: var(--danger); }
.evaluation-workspace { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(250px,.75fr); gap: 14px; align-items: start; }
.evaluation-students, .evaluation-entry { border: 1px solid var(--line); border-radius: 8px; background: #fafcfc; }
.evaluation-students { padding: 12px; }
.evaluation-entry { position: sticky; top: 12px; display: grid; gap: 10px; padding: 14px; }
.evaluation-list-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.evaluation-list-head .search { max-width: 340px; }
.evaluation-student-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
.evaluation-student-list.is-collapsed .evaluation-student-row:nth-child(n+13) { display: none; }
.evaluation-student-row { min-height: 48px; display: flex; align-items: center; gap: 9px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; background: #fff; cursor: pointer; }
.evaluation-student-row:has(input:checked) { border-color: var(--teal); background: var(--teal-soft); }
.evaluation-student-row input { width: 18px; height: 18px; margin: 0; flex: 0 0 auto; }
.evaluation-student-row span, .evaluation-student-row strong, .evaluation-student-row small { display: block; min-width: 0; }
.evaluation-student-row small { color: var(--muted); font-size: .76rem; }
.evaluation-absence { display: inline-block; margin-left: 5px; padding: 1px 5px; border-radius: 4px; background: var(--warn-soft); color: var(--warn); font-style: normal; font-weight: 750; }
.point-buttons { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.point-buttons button { min-height: 42px; border: 1px solid var(--line-strong); border-radius: 7px; background: #fff; color: var(--navy); font-weight: 800; }
.point-buttons button.active { border-color: var(--teal); background: var(--teal); color: #fff; }
.point-buttons button[data-evaluation-points^="-"] { color: var(--danger); }
.point-buttons button[data-evaluation-points^="-"].active { border-color: var(--danger); background: var(--danger); color: #fff; }
.selected-points { min-height: 1.4em; margin: 0; color: var(--teal); font-weight: 700; }
.evaluation-undo { border-color: var(--warn); color: var(--warn); }
.evaluation-score { font-variant-numeric: tabular-nums; }
.evaluation-score.positive { color: var(--teal); }
.evaluation-score.negative { color: var(--danger); }
.evaluation-stats-controls { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; padding-bottom: 2px; }
.evaluation-scope-switch { display: grid; grid-template-columns: repeat(4,minmax(72px,1fr)); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; }
.evaluation-scope-option { min-height: 40px; padding: 7px 13px; border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--navy-2); font-weight: 750; white-space: nowrap; }
.evaluation-scope-option:last-child { border-right: 0; }
.evaluation-scope-option:hover { background: var(--teal-soft); }
.evaluation-scope-option.active { background: var(--teal); color: #fff; }
#evaluationStatsRange { display: block; margin-top: 5px; color: var(--muted); font-size: .78rem; }
#evaluationStatsRange.invalid { color: var(--danger); font-weight: 700; }
.evaluation-chart-section { margin: 15px 0 5px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 8px; background: #fafcfc; }
.chart-head { display: grid; gap: 8px; margin-bottom: 9px; }
.chart-head h3 { margin: 0; color: var(--navy); font-size: .96rem; }
.chart-head span { color: var(--muted); font-size: .78rem; }
.evaluation-bar-chart { display: grid; gap: 8px; }
.evaluation-bar-row { display: grid; grid-template-columns: 48px minmax(0,1fr) 48px; align-items: center; gap: 8px; }
.evaluation-bar-label { color: var(--navy-2); font-size: .8rem; font-weight: 700; }
.evaluation-bar-track { height: 13px; overflow: hidden; border-radius: 999px; background: #e8eef0; }
.evaluation-bar-fill { display: block; height: 100%; min-width: 4px; border-radius: inherit; }
.evaluation-bar-fill.positive { background: var(--teal); }
.evaluation-bar-fill.negative { background: var(--danger); }
.evaluation-bar-value { text-align: right; font-size: .82rem; font-variant-numeric: tabular-nums; }
.evaluation-bar-value.positive { color: var(--teal); }
.evaluation-bar-value.negative { color: var(--danger); }
.evaluation-custom-range { display: grid; grid-template-columns: repeat(2,minmax(145px,1fr)); gap: 9px; }
.evaluation-custom-range label { display: grid; gap: 4px; color: var(--muted); font-size: .8rem; font-weight: 700; }
.evaluation-population-field { display: grid; gap: 5px; margin: 10px 0; color: var(--muted); font-size: .85rem; font-weight: 650; }
.evaluation-population-field select { width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.evaluation-custom-range input { width: 100%; min-height: 40px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.record-note { display: block; margin-top: 3px; color: var(--muted); }
.evaluation-summary-table { min-width: 820px; }
.evaluation-summary-table-wrap.is-collapsed tbody tr:nth-child(n+11) { display: none; }
.admin-summary-class-table-wrap.is-collapsed tbody tr:nth-child(n+9) { display: none; }
.admin-growth-table-wrap.is-collapsed tbody tr:nth-child(n+9) { display: none; }
.evaluation-summary-table th:not(:first-child), .evaluation-summary-table td:not(:first-child) { text-align: center; font-variant-numeric: tabular-nums; }
.compact-head h3 { margin: 0; color: var(--navy); font-size: 1rem; }
.compact-head p { margin: 4px 0 0; color: var(--muted); font-size: .86rem; }
.teacher-evaluation-metrics, .marketplace-metrics { grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 14px; }
.marketplace-toolbar { display: flex; align-items: end; gap: 10px; margin-top: 14px; }
.marketplace-toolbar label { display: grid; gap: 4px; color: var(--muted); font-size: .82rem; }
.marketplace-toolbar select { min-height: 40px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.marketplace-order-filters { display: grid; grid-template-columns: minmax(145px,.7fr) minmax(145px,.8fr) minmax(145px,.8fr) minmax(190px,1.2fr); gap: 10px; margin-top: 14px; }
.marketplace-order-filters label { display: grid; gap: 4px; color: var(--muted); font-size: .82rem; }
.marketplace-order-filters input, .marketplace-order-filters select { width: 100%; min-height: 40px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.marketplace-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 13px; }
.marketplace-product { display: flex; min-height: 156px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; justify-content: space-between; flex-direction: column; gap: 12px; }
.marketplace-product.inactive { background: #f7f8f8; opacity: .82; }
.marketplace-product h3 { margin: 9px 0 4px; color: var(--navy); font-size: 1rem; }
.marketplace-product p { display: flex; margin: 0; color: var(--muted); flex-direction: column; gap: 3px; font-size: .84rem; }
.marketplace-product p strong { color: var(--teal); font-size: 1.15rem; }
.marketplace-account-note { margin-top: 12px; }
.completion-list { margin: 6px 0 0; padding-left: 20px; }
.notice-progress { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; background: var(--teal-soft); color: var(--teal); font-size: .8rem; font-weight: 750; }
.leave-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 8px; }
.leave-card p { margin: 2px 0 0; color: var(--muted); font-size: .9rem; }
.leave-filters { display: grid; grid-template-columns: minmax(150px,.7fr) minmax(170px,.8fr) minmax(190px,1fr) auto; gap: 10px; align-items: end; margin-top: 14px; }
.leave-filters label { display: grid; gap: 4px; color: var(--muted); font-size: .82rem; }
.leave-filters input, .leave-filters select { width: 100%; min-height: 42px; padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.filter-summary { margin: 9px 0 0; color: var(--muted); font-size: .84rem; }
.status-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.status-tags .tag { margin-left: 0; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.tag { display: inline-block; margin-left: 7px; padding: 2px 7px; border-radius: 999px; background: var(--teal-soft); color: var(--teal); font-size: .75rem; }
.tag.warn { background: var(--warn-soft); color: var(--warn); }
.tag.danger { background: var(--danger-soft); color: var(--danger); }
.evaluation-revoked-tag { background: #b42318; color: #fff; font-weight: 800; }
.certificate-pending-row { background: #fff7f5; }
.certificate-pending-row td:first-child { border-left: 4px solid #c2413b; }
.certificate-pending-tag { background: #b42318; color: #fff; font-weight: 800; }
.table-wrap { overflow: auto; margin-top: 13px; -webkit-overflow-scrolling: touch; overscroll-behavior-inline: contain; }
.leave-records-table-wrap { max-height: 420px; overscroll-behavior: contain; }
.leave-records-table-wrap.is-collapsed { max-height: 365px; }
.leave-records-table-wrap.is-collapsed tbody tr:nth-child(n+9) { display: none; }
.admin-class-table-wrap.is-collapsed tbody tr:nth-child(n+9) { display: none; }
.leave-records-table-wrap thead th { position: sticky; top: 0; z-index: 1; background: #f2f7f7; }
.list-footer-actions { display: flex; justify-content: center; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line); }
.list-footer-actions .list-toggle { min-width: 190px; }
table { width: 100%; min-width: 640px; border-collapse: collapse; }
th, td { padding: 10px 11px; border-bottom: 1px solid var(--line); text-align: left; }
th { color: var(--muted); font-size: .82rem; }
.empty, .empty-state { padding: 24px; text-align: center; color: var(--muted); }
.empty-state strong { color: var(--navy); font-size: 1.05rem; }
.search { max-width: 260px; }
.file-button { display: inline-flex; align-items: center; cursor: pointer; }
.filter-row { display: flex; gap: 12px; margin-top: 14px; }
.filter-row label { display: grid; gap: 5px; min-width: min(520px,100%); color: var(--muted); font-size: .86rem; }
.filter-row select { min-height: 40px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.wide-dialog { width: min(860px, calc(100% - 28px)); }
.export-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 11px; margin-top: 14px; }
.export-grid article { padding: 15px; border: 1px solid var(--line); border-radius: 10px; }
.export-grid p { min-height: 3em; margin: 5px 0 12px; color: var(--muted); font-size: .88rem; }
.preview-status { color: var(--muted); }
.feature-note { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 10px 12px; border-radius: 9px; background: var(--teal-soft); color: var(--navy); font-size: .88rem; }
.feature-note span { color: var(--muted); }
.feature-badge { flex: 0 0 auto; padding: 4px 9px; border-radius: 999px; background: var(--warn-soft); color: var(--warn); font-size: .78rem; font-weight: 750; }
.feature-badge.ready { background: var(--teal-soft); color: var(--teal); }
.timetable-wrap { margin-top: 12px; }
.timetable-grid { table-layout: fixed; min-width: 620px; border: 1px solid var(--line); }
.timetable-grid th, .timetable-grid td { border: 1px solid var(--line); text-align: center; vertical-align: middle; }
.timetable-grid thead th { padding: 8px 5px; background: var(--navy); color: #fff; font-size: .84rem; }
.timetable-grid thead th:first-child, .timetable-grid tbody th { width: 58px; }
.timetable-grid tbody th { background: #eef3f5; color: var(--navy); font-size: .88rem; }
.timetable-grid td { height: 58px; padding: 5px 4px; background: #fff; }
.timetable-grid tbody tr:nth-child(even) td { background: #fafcfc; }
.timetable-grid td strong, .timetable-grid td small { display: block; }
.timetable-grid td strong { color: var(--navy); font-size: .86rem; line-height: 1.3; }
.timetable-grid td small { margin-top: 2px; color: var(--muted); font-size: .72rem; line-height: 1.25; }
.competition-panel .panel-head > label, .competition-panel .panel-head .actions label { display: grid; gap: 4px; color: var(--muted); font-size: .82rem; }
.competition-panel select { min-height: 40px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.competition-result-card { min-height: 72px; margin-top: 12px; padding: 13px 14px; border: 1px solid var(--line); border-radius: 8px; background: #fafcfc; }
.competition-result-card strong { color: var(--navy); }
.competition-result-card p { margin: 6px 0 0; white-space: pre-wrap; color: var(--text); }
.admin-evaluation-filters { display: flex; gap: 10px; margin-bottom: 11px; }
.admin-evaluation-filters label { display: grid; gap: 4px; color: var(--muted); font-size: .82rem; font-weight: 700; }
.admin-evaluation-filters select { min-width: 180px; min-height: 40px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.import-template-actions { margin: 10px 0; }
.competition-import-dialog .table-wrap { max-height: 42vh; }
.chart-switch { display: inline-flex; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 7px; }
.chart-switch-button { min-height: 30px; padding: 4px 9px; border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--navy-2); font-size: .78rem; font-weight: 750; }
.chart-switch-button:last-child { border-right: 0; }
.chart-switch-button.active { background: var(--teal); color: #fff; }
.evaluation-pie-chart { position: relative; width: min(220px, 72vw); aspect-ratio: 1; margin: 12px auto 4px; border-radius: 50%; }
.evaluation-pie-center { position: absolute; inset: 25%; display: grid; place-items: center; border-radius: 50%; background: #fff; color: var(--navy); font-size: .78rem; font-weight: 800; text-align: center; }
.evaluation-pie-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 12px; margin-top: 9px; color: var(--muted); font-size: .78rem; }
.evaluation-pie-legend span { display: inline-flex; align-items: center; gap: 4px; }
.evaluation-pie-legend i { width: 9px; height: 9px; border-radius: 50%; }
.phone-link { color: var(--navy-2); font-weight: 650; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.muted { color: var(--muted); }
.compact-button { min-height: 34px; padding: 5px 9px; font-size: .82rem; }
.contact-summary { display: grid; gap: 7px; min-width: 250px; }
.contact-summary-row { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.contact-relation { color: var(--muted); font-size: .82rem; }
.contact-summary-row small { flex-basis: 100%; color: var(--muted); }
.contact-editor { display: grid; gap: 10px; margin: 12px 0; }
.contact-editor-row { padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: #fafcfc; }
.contact-order { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.contact-fields { display: grid; grid-template-columns: minmax(100px,.6fr) minmax(180px,1fr) minmax(190px,1.2fr); gap: 9px; align-items: end; }
.contact-fields label { display: grid; gap: 5px; margin: 0; }
.contact-fields .primary-contact { display: flex; grid-column: 1 / -1; align-items: center; gap: 8px; min-height: 34px; color: var(--navy); }
.contact-fields .primary-contact input { width: 18px; min-height: 18px; margin: 0; }
.status-list p { padding: 10px 0; border-bottom: 1px solid var(--line); }
.status-list p:last-child { border: 0; }
.compact { margin-bottom: 0; }
dialog { width: min(680px, calc(100% - 28px)); max-height: 92vh; padding: 0; border: 0; border-radius: 14px; box-shadow: var(--shadow); overflow: auto; }
dialog::backdrop { background: rgba(12, 31, 39, .48); }
.dialog-card { padding: 20px 20px 0; }
.dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.dialog-head h2 { margin: 0; font-size: 1.35rem; }
.dialog-head p { margin: 2px 0 0; color: var(--muted); font-size: .9rem; }
.icon-button { width: 40px; min-width: 40px; padding: 0; background: #fff; border-color: var(--line); color: var(--muted); font-size: 1.35rem; }
.student-entry { margin: 0; padding: 0; border: 0; }
.field-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.field-heading span { color: var(--muted); font-size: .82rem; }
.field-label { display: block; font-weight: 700; }
.student-search-hint { min-height: 1.35em; margin: 5px 0 8px; color: var(--muted); font-size: .82rem; }
.student-candidates { display: grid; gap: 4px; max-height: 238px; min-height: 84px; padding: 4px; overflow-y: auto; border: 1px solid var(--line-strong); border-radius: 9px; background: #fff; overscroll-behavior: contain; }
.student-candidate { width: 100%; min-height: 42px; padding: 8px 10px; border: 0; border-radius: 7px; background: #fff; color: var(--text); text-align: left; }
.student-candidate:hover:not(:disabled), .student-candidate:focus-visible { background: var(--teal-soft); color: var(--navy); }
.student-candidate[aria-selected="true"] { background: var(--teal-soft); color: var(--navy); font-weight: 750; box-shadow: inset 3px 0 var(--teal); }
.student-candidate:disabled { color: #9a7777; background: #faf7f7; opacity: 1; }
.student-candidate-empty { display: grid; min-height: 74px; place-items: center; padding: 12px; color: var(--muted); text-align: center; }
.student-entry select[size] { height: auto; max-height: 238px; min-height: 84px; padding: 3px; }
.student-entry select[size] option { padding: 7px 9px; border-radius: 6px; }
.student-entry select[size] option:checked { background: var(--teal-soft); color: var(--navy); }
.student-entry select[size] option:disabled { color: #9a7777; }
.selected-student { margin-top: 8px; padding: 9px 11px; border-left: 4px solid var(--teal); border-radius: 7px; background: var(--teal-soft); color: var(--navy); font-weight: 700; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px 12px; margin-top: 12px; }
.form-grid label { display: grid; gap: 5px; }
.form-span { grid-column: 1 / -1; }
.optional { color: var(--muted); font-size: .8rem; font-weight: 500; }
.dialog-card textarea { resize: vertical; min-height: 68px; }
.confirm-line { display: flex; align-items: center; gap: 9px; min-height: 42px; margin: 10px 0 0; color: var(--navy); }
.confirm-line input { width: 20px; min-height: 20px; margin: 0; }
.leave-confirm-line { align-items: flex-start; margin-top: 12px; padding: 10px 12px; border: 2px solid #c2413b; border-radius: 8px; background: #fff1f0; color: #7f1d1d; }
.leave-confirm-line span { display: grid; gap: 2px; }
.leave-confirm-line strong { font-size: .94rem; }
.leave-confirm-line small { color: #9f3a35; font-size: .78rem; }
.refund-range-actions { align-items: end; }
.refund-range-actions label { display: grid; gap: 4px; color: var(--muted); font-size: .82rem; }
.refund-range-actions input { min-height: 40px; padding: 7px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--text); }
.dialog-actions { position: sticky; bottom: 0; display: flex; justify-content: flex-end; gap: 9px; margin: 0 -20px; padding: 12px 20px 16px; border-top: 1px solid var(--line); background: rgba(255,255,255,.97); }
.toast { position: fixed; right: 18px; bottom: 18px; z-index: 20; max-width: 360px; padding: 11px 14px; border-radius: 9px; background: #172a34; color: #fff; box-shadow: var(--shadow); opacity: 0; transform: translateY(8px); pointer-events: none; transition: .18s; }
.toast.show { opacity: 1; transform: none; }
@media (max-width: 900px) {
  .app { display: block; }
  .sidebar { position: sticky; top: 0; z-index: 10; height: auto; padding: max(13px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) 10px max(14px, env(safe-area-inset-left)); border-right: 0; border-bottom: 1px solid #d2e1e7; box-shadow: 0 3px 12px rgba(23,56,71,.08); }
  .brand { margin-bottom: 10px; }
  .sidebar nav { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; scroll-snap-type: x proximity; }
  .sidebar nav::-webkit-scrollbar { display: none; }
  .nav-group { display: none; }
  .nav-button { flex: 0 0 auto; width: auto; padding: 8px 12px; text-align: center; white-space: nowrap; scroll-snap-align: center; }
  .sidebar.has-nav-overflow nav { margin-right: 72px; padding-right: 3px; }
  .sidebar.has-nav-overflow .nav-more { position: absolute; right: 10px; bottom: 11px; z-index: 2; display: grid; min-width: 62px; min-height: 44px; padding: 0 8px; place-items: center; border: 1px solid #8bb2a8; border-radius: 9px; background: #fff; color: #075e54; font-size: .85rem; font-weight: 750; line-height: 1; box-shadow: 0 2px 8px rgba(23,56,71,.12); }
  .logout { position: absolute; right: 14px; top: 13px; min-height: 38px; }
  main { padding: 0 16px 28px; }
  .topbar { min-height: 78px; }
  .topbar-actions { flex-wrap: wrap; }
  .evaluation-workspace { grid-template-columns: 1fr; }
  .marketplace-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .marketplace-order-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .evaluation-entry { position: static; }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-command-bar { flex-direction: column; }
  .admin-priority-actions { width: 100%; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-analysis-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .admin-analysis-controls { justify-items: stretch; gap: 10px; }
  .admin-analysis-export-actions { justify-content: flex-end; }
  .admin-distribution-grid { grid-template-columns: 1fr; }
  .admin-overview-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .teacher-command-bar { flex-direction: column; }
  .teacher-task-actions { width: 100%; min-width: 0; }
  .leave-filters { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .leave-card { align-items: flex-start; flex-direction: column; }
  .notice-card { align-items: flex-start; flex-direction: column; }
  .leave-records-table-wrap { max-height: min(52vh, 380px); }
  .leave-records-table-wrap.is-collapsed { max-height: min(44vh, 320px); }
  .growth-card { flex-direction: column; }
  .export-grid { grid-template-columns: 1fr; }
}
.demo-account-choices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin: 0 0 12px; }
.demo-account-choices button { min-height: 42px; padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 7px; background: #f8fbfc; color: var(--navy); font-weight: 720; }
.demo-account-choices button:hover { background: var(--teal-soft); }
@media (max-width: 560px) {
  body { font-size: 16px; }
  .login { align-items: start; padding: max(18px, env(safe-area-inset-top)) 14px max(18px, env(safe-area-inset-bottom)); }
  .login-card { padding: 22px 18px; }
  .student-candidates { max-height: min(42vh, 320px); }
  .brand { min-height: 40px; margin-left: 0; }
  .brand .brand-mark { width: 44px; height: 36px; font-size: .78rem; }
  .brand strong { max-width: 150px; font-size: .95rem; }
  .brand small { font-size: .72rem; }
  .logout { right: 10px; padding: 7px 10px; }
  main { padding: 0 max(10px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)); }
  .topbar { min-height: auto; padding: 16px 0 12px; gap: 9px; }
  .topbar h1 { font-size: 1.45rem; }
  .topbar-actions { width: 100%; align-items: stretch; flex-direction: column-reverse; }
  .sync-control { width: 100%; justify-content: flex-end; }
  .class-picker { width: 100%; display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 7px 9px; }
  .class-picker > span { font-size: .78rem; }
  .class-picker strong, .class-picker select { width: 100%; min-width: 0; }
  .class-picker #roleSwitcher, .class-picker #campusPickerField { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 9px; }
  .notice { align-items: stretch; flex-direction: column; padding: 14px; }
  .admin-priority-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .priority-action { min-height: 58px; }
  .admin-analysis-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-certificate-metrics, .certificate-metrics, .admin-certificate-metrics.has-carryover, .certificate-metrics.has-carryover { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-analysis-controls { width: 100%; }
  .admin-scope-switch { width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .admin-scope-option { min-width: 0; padding-inline: 8px; }
  .admin-analysis-export-actions { flex-wrap: wrap; }
  .teacher-task-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .task-action { min-height: 62px; }
  .leave-filters { grid-template-columns: 1fr; }
  .leave-filters .secondary { width: 100%; }
  .notice .primary { width: 100%; }
  .metrics { gap: 8px; }
  .metrics article { padding: 11px 12px; }
  .metrics strong { font-size: 1.35rem; }
  .panel { padding: 14px; }
  .panel-head { gap: 10px; }
  .growth-filters { grid-template-columns: 1fr; }
  .growth-card .primary { width: 100%; }
  .feature-note { align-items: flex-start; flex-direction: column; gap: 2px; }
  .search { max-width: none; }
  .actions { width: 100%; }
  .actions button, .actions .file-button { flex: 1 1 calc(50% - 8px); justify-content: center; text-align: center; }
  .evaluation-panel .panel-head { gap: 12px; }
  .evaluation-tabs { width: 100%; grid-template-columns: repeat(3,minmax(0,1fr)); }
  .evaluation-tab { min-width: 0; padding-inline: 6px; }
  .evaluation-context, .evaluation-filters { grid-template-columns: 1fr; }
  .evaluation-stats-controls { align-items: stretch; flex-direction: column; }
  .evaluation-scope-switch { width: 100%; grid-template-columns: repeat(4,minmax(0,1fr)); }
  .evaluation-scope-option { min-width: 0; padding-inline: 5px; }
  .evaluation-custom-range { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .evaluation-list-head { align-items: stretch; flex-direction: column; }
  .evaluation-list-head .actions { display: grid; grid-template-columns: 1fr 1fr; }
  .teacher-evaluation-metrics, .marketplace-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .marketplace-toolbar { align-items: stretch; flex-direction: column; }
  .marketplace-grid { grid-template-columns: 1fr; }
  .marketplace-order-filters { grid-template-columns: 1fr; }
  .evaluation-student-list { grid-template-columns: 1fr; }
  .evaluation-presets { gap: 8px; }
  .entry-modes { flex-direction: column; gap: 7px; }
  dialog { inset: auto 0 0; width: 100%; max-width: none; max-height: 94dvh; margin: 0; border-radius: 16px 16px 0 0; }
  .dialog-card { padding: 16px 14px 0; }
  .form-grid { grid-template-columns: 1fr; gap: 9px; }
  .form-span { grid-column: auto; }
  .student-entry select[size] { max-height: 180px; }
  .dialog-actions { margin: 0 -14px; padding: 11px max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left)); }
  .dialog-actions button { flex: 1; }
  .toast { left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); max-width: none; }
  .mobile-card-table { min-width: 0; }
  .mobile-card-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
  .mobile-card-table tbody, .mobile-card-table tr, .mobile-card-table td { display: block; width: 100%; }
  .mobile-card-table tr { margin-bottom: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
  .mobile-card-table td { display: grid; grid-template-columns: 88px minmax(0,1fr); gap: 8px; align-items: center; min-height: 38px; padding: 6px 2px; border-bottom: 1px dashed var(--line); overflow-wrap: anywhere; }
  .mobile-card-table td:last-child { border-bottom: 0; }
  .mobile-card-table td::before { content: attr(data-label); color: var(--muted); font-size: .8rem; font-weight: 650; }
  .mobile-card-table td.empty { display: block; text-align: center; border: 0; }
  .mobile-card-table td.empty::before { content: none; }
  .contact-table .phone-link { display: inline-flex; align-items: center; justify-content: center; width: fit-content; min-height: 40px; padding: 7px 12px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--teal-soft); color: var(--navy); text-decoration: none; }
  .contact-summary { min-width: 0; }
  .contact-summary-row { align-items: flex-start; flex-direction: column; }
  .timetable-wrap { overflow: visible; }
  .timetable-grid { min-width: 0; width: 100%; }
  .timetable-grid thead th { padding: 6px 2px; font-size: .68rem; }
  .timetable-grid thead th:first-child, .timetable-grid tbody th { width: 36px; }
  .timetable-grid tbody th { padding: 4px 2px; font-size: .68rem; }
  .timetable-grid td { height: 50px; padding: 4px 2px; overflow-wrap: anywhere; }
  .timetable-grid td strong { font-size: .72rem; line-height: 1.2; }
  .timetable-grid td small { font-size: .62rem; line-height: 1.15; }
  .contact-order { align-items: flex-start; flex-direction: column; }
  .contact-fields { grid-template-columns: 1fr; }
  .contact-fields .primary-contact { grid-column: auto; }
}

/* Compact lists keep all data reachable without a long page or nested scrolling. */
.list-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px; margin:12px 0; color:var(--muted); font-size:.82rem; }
.list-pagination > div { display:flex; align-items:center; gap:10px; }
.record-list-filters { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:12px 0; }
.record-list-filters label { display:flex; align-items:center; gap:8px; }
.compact-details > summary { cursor:pointer; font-weight:700; color:var(--navy); padding:4px 0; }
.compact-details[open] > summary { margin-bottom:18px; }
@media(max-width:640px) { .list-pagination { position:sticky; top:124px; z-index:2; background:white; padding:10px 0; } .record-list-filters > input { width:100%; } }

.notice-category-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.notice-category-tabs button[aria-pressed="true"] { background: var(--teal); color: #fff; border-color: var(--teal); }
.notice-card > div { min-width: 0; width: 100%; }
.notice-card strong, .notice-attachment a { overflow-wrap: anywhere; }
.notice-image-dialog { padding: 20px; width: min(1100px, calc(100vw - 28px)); max-width: 1100px; }
.notice-image-scroll { max-height: 75vh; overflow: auto; }
.notice-image-scroll img { display: block; width: 100%; height: auto; }

/* Numbered content sections and searchable school-wide audit log. */
.panel h2[data-section-number]::before { content: attr(data-section-number); display: inline-block; color: var(--teal); font-size: 1.35em; font-weight: 850; margin-right: .12em; }
.nav-group { font-size: .84rem; font-weight: 800; }
.audit-filters { display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; gap: 12px; margin-top: 16px; align-items: end; }
.audit-filters label { display: grid; gap: 6px; min-width: 0; font-size: .84rem; color: var(--muted); }
.audit-filters input, .audit-filters select { width: 100%; min-width: 0; min-height: 42px; border: 1px solid var(--line-strong); border-radius: 8px; padding: 8px 10px; background: #fff; }
.audit-meta { display: block; color: var(--muted); font-size: .75rem; overflow-wrap: anywhere; margin-top: 4px; }
.audit-more-filters { grid-column: 1 / -1; font-size: .84rem; color: var(--muted); }
.audit-more-filters summary { cursor: pointer; padding: 6px 0; }
.view[data-panel="logs"] .panel-head { grid-template-columns: minmax(0,1fr) auto; align-items: start; }
.audit-extra-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 8px; }
@media(max-width:640px) { .audit-filters, .audit-extra-fields { grid-template-columns: repeat(2,minmax(0,1fr)); } .audit-extra-fields > label:last-child { grid-column: 1 / -1; } .panel h2[data-section-number]::before { font-size: 1.22em; } }

/* 通知正文预览与名单维护 */
.document-preview { width: min(1000px,94vw); max-width: 1000px; }
#documentPreviewContent { max-height: 65vh; overflow: auto; }
#documentPreviewContent table { min-width: 600px; }
#documentPreviewContent td { white-space: pre-wrap; max-width: 360px; }
#documentPreviewContent iframe { width: 100%; height: 62vh; border: 0; }
#actionConfirmText { white-space: pre-wrap; line-height: 1.7; }
.student-row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
#rosterForm > label { display: grid; gap: 6px; margin: 14px 0; }
@media(max-width:640px) { .document-preview { width: 100%; } }

/* 2026-10-14: shared typography, compact one-page notices, and separate chart legend. */
:root { --text:#283943; --muted:#5e707b; --line:#e0e7eb; --bg:#f5f7f9; }
body { font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
button,input,select,textarea { font-family:inherit; }
.primary,.secondary,.file-button,.nav-button { font-weight:600; font-size:.88rem; line-height:1.45; }
.topbar h1 { font-size:1.55rem; font-weight:700; letter-spacing:.01em; }
.panel { box-shadow:none; border-color:var(--line); }
.panel h2,.view[data-panel="admin"] > .panel > .panel-head h2 { font-size:1.08rem; font-weight:650; line-height:1.55; color:var(--navy); }
.panel h2[data-section-number]::before { font-size:1.16em; font-weight:700; margin-right:.18em; }
.panel-head p,.view[data-panel="admin"] > .panel > .panel-head p { font-size:.85rem; line-height:1.65; color:var(--muted); font-weight:400; }
.panel h3,.view[data-panel="admin"] > .panel h3 { font-size:.96rem; font-weight:650; }
.panel table thead th,.view[data-panel="admin"] > .panel table thead th { font-size:.8rem; font-weight:600; color:var(--muted); background:#f7f9fa; }
.panel table tbody td,.view[data-panel="admin"] > .panel table tbody td { font-size:.88rem; line-height:1.55; }
.metrics strong,.view[data-panel="admin"] > .panel > .metrics strong { font-weight:650; font-variant-numeric:tabular-nums; }
.notice-card strong,.growth-card strong { font-size:.98rem; font-weight:650; line-height:1.6; }
.notice-card p,.growth-card p { font-size:.9rem; line-height:1.7; }
.notice-card small,.growth-card small,.audit-meta { font-size:.79rem; line-height:1.65; color:var(--muted); }
.view[data-panel="notices"] > .notice-category-panel { border-top:1px solid var(--line); }
.notice-category-panel .panel-head { grid-template-columns:minmax(0,1fr) auto; gap:12px; }
.notice-category-panel .actions { align-items:end; }
.notice-category-panel .actions label { display:grid; gap:4px; min-width:0; font-size:.8rem; color:var(--muted); }
.notice-category-panel .actions select { max-width:310px; width:100%; }
.admin-notice-metrics { display:flex; flex-wrap:wrap; gap:8px 24px; margin:10px 0; }
.admin-notice-metrics article { display:flex; align-items:baseline; gap:8px; border:0; padding:0; background:transparent; }
.admin-notice-metrics strong { font-size:1rem; }
.evaluation-chart-section .chart-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
.chart-switch { flex:0 0 auto; width:max-content; }
.chart-switch-button { min-width:72px; min-height:36px; white-space:nowrap; word-break:keep-all; font-size:.84rem; font-weight:600; }
.evaluation-pie-chart { width:100%; aspect-ratio:auto; border-radius:0; margin:14px auto; background:transparent; }
.evaluation-pie-disc { position:relative; width:min(220px,65vw); aspect-ratio:1; border-radius:50%; margin:0 auto; }
.evaluation-pie-center { font-size:.9rem; font-weight:600; }
.evaluation-pie-legend { display:grid; grid-template-columns:repeat(3,max-content); gap:10px 22px; margin:18px auto 0; font-size:.84rem; }
.evaluation-pie-legend span { white-space:nowrap; }
.evaluation-pie-legend i { flex:none; }
#personalTimetableForm { max-width:540px; }
#personalSlotCurrent { margin:14px 0; }
#toggleCompletedCertificates { white-space:nowrap; }
@media(max-width:640px) {
  .notice-category-panel .panel-head { grid-template-columns:1fr; }
  .notice-category-panel .actions { width:100%; display:flex; flex-wrap:wrap; }
  .notice-category-panel .actions label { flex:1 1 100%; }
  .notice-category-panel .actions select { max-width:none; }
  .evaluation-pie-legend { grid-template-columns:repeat(2,max-content); gap:9px 18px; }
  .panel-head h2 { overflow-wrap:normal; }
  .timetable-grid thead th,.timetable-grid tbody th { font-size:.75rem; }
  .timetable-grid td strong { font-size:.78rem; line-height:1.45; }
  .timetable-grid td small { font-size:.72rem; line-height:1.4; }
}

.notice-category-panel .panel-head h2 { font-size:1.08rem; font-weight:650; }
.notice-category-panel .actions select { min-height:38px; padding:6px 9px; border:1px solid var(--line-strong); border-radius:8px; color:var(--text); background:#fff; font-size:.84rem; }
.notice-image-attachment img { width:auto; max-width:100%; max-height:180px; }

@media(max-width:640px) { .admin-evaluation-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .admin-evaluation-filters label,.admin-evaluation-filters select { min-width:0; width:100%; } }
/* Family portal: one purpose, a narrow reading width, and touch-sized controls. */
.family-mode #loginView,.family-mode #appView{display:none!important}
.family-shell{max-width:960px;margin:0 auto;padding:30px 24px 48px;color:#263747}
.family-header,.family-toolbar,.family-section-head,.family-product-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.family-brand{display:flex;align-items:center;gap:12px;min-width:0}.family-portal-icon{width:54px;height:54px;flex:none;border-radius:13px;box-shadow:0 3px 10px rgba(23,105,224,.18)}
.family-header h1{font-size:28px;font-weight:650;margin:4px 0 0;letter-spacing:.02em}
.family-header .eyebrow{color:#526c72;font-size:13px;margin:0}
.family-badge{background:#e2f0ec;color:#275f52;border-radius:20px;padding:7px 14px;font-size:13px}
.family-demo-note{font-size:12px;color:#6b737d;margin:14px 0}
.family-panel{background:white;border:1px solid #e1e8e6;border-radius:16px;padding:22px}
.family-panel h2,.family-section h2{font-size:18px;font-weight:650;margin:0}
.family-panel>p{line-height:1.7;font-size:14px}
.family-login-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.family-message{font-size:14px;line-height:1.65;color:#285e52;margin:12px 0;overflow-wrap:anywhere}
.family-message:empty{display:none}
.family-toolbar{font-size:14px;margin:16px 0}
.family-toolbar>div{display:flex;gap:8px}
.family-shell button{min-height:42px;font-weight:550}
.family-account{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px;background:#eaf4f0;border:1px solid #d6e7df;border-radius:16px}
.family-account label{display:block;font-size:13px;color:#47665e;margin-bottom:8px}
.family-account select{width:100%;min-width:210px;max-width:100%;background:white;color:#263747;opacity:1;font-size:16px;font-weight:600}
.family-account p{font-size:13px;color:#4d685f;margin:12px 0 0;line-height:1.65}
.family-points{display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0;min-width:90px}
.family-points span{font-size:13px;color:#47665e}
.family-points strong{font-size:38px;line-height:1.35;font-weight:650;color:#215e4e;font-variant-numeric:tabular-nums}
.family-selected{margin:12px 0 0;font-size:14px;line-height:1.7;color:#285e52;overflow-wrap:anywhere}
.family-section{margin-top:26px}
.family-section-head{margin-bottom:14px;flex-wrap:wrap}
.family-section-head small,.family-muted{font-size:13px;color:#64736e;line-height:1.7}
.family-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.family-product{border:1px solid #e1e8e6;background:white;border-radius:14px;padding:18px;display:flex;flex-direction:column;min-width:0}
.family-product h3{font-size:16px;line-height:1.5;font-weight:600;overflow-wrap:anywhere;margin:15px 0 10px}
.family-category,.family-stock{font-size:12px;color:#687670}
.family-category{background:#f0f5f3;border-radius:5px;padding:3px 7px}
.family-price{color:#356352;font-size:13px;margin:0 0 8px}
.family-price strong{font-size:28px;font-weight:650}
.family-quota{font-size:12px;color:#64736e;margin:0 0 18px;line-height:1.6}
.family-product button{margin-top:auto;width:100%}
.family-product button:disabled{background:#edf1ef;color:#65736d;border-color:#e0e6e3;opacity:1;cursor:default}
.family-orders{padding:0;margin:0;list-style:none}
.family-orders li{display:flex;justify-content:space-between;gap:14px;padding:16px 0;border-bottom:1px solid #e9eeeb}
.family-orders li:last-child{border:0}
.family-orders strong{display:block;font-size:14px;font-weight:550;line-height:1.6;overflow-wrap:anywhere}
.family-orders span{display:block;font-size:12px;color:#687670;line-height:1.6;margin-top:4px}
.family-order-status{flex-shrink:0;text-align:right}
.family-order-status strong{color:#356352;font-size:13px}
.family-shell details summary{padding-top:12px;font-size:14px;color:#356352;cursor:pointer}
.family-empty{font-size:14px;line-height:1.7;color:#687670;grid-column:1/-1}
.family-confirm{max-width:480px;width:calc(100% - 32px)}
.family-confirm .dialog-card{padding:24px}
.family-confirm p{line-height:1.75;font-size:14px;overflow-wrap:anywhere}
.family-confirm .family-confirm-product{font-size:17px;font-weight:600}
@media(max-width:640px){
  .family-shell{padding:22px 16px 32px}
  .family-header h1{font-size:24px}
  .family-account{padding:18px;gap:12px;align-items:flex-start}
  .family-account>div:first-child{min-width:0;flex:1}
  .family-account select{min-width:0;font-size:14px;padding:10px 24px 10px 10px}
  .family-points{min-width:64px;padding-top:1px}
  .family-points strong{font-size:32px}
  .family-account p{font-size:12px}
  .family-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .family-product{padding:13px}
  .family-product-top{align-items:flex-start;gap:6px;flex-wrap:wrap}
  .family-product h3{font-size:15px;margin-top:10px}
  .family-product button{font-size:13px;padding-left:6px;padding-right:6px}
  .family-panel{padding:18px}
  .family-confirm{inset:0;margin:auto;width:calc(100% - 32px);max-width:480px;max-height:calc(100dvh - 32px);border-radius:16px}
  .family-confirm .dialog-card{padding:20px 18px 0}
  .family-confirm .dialog-actions{margin:0 -18px;padding:12px 18px max(16px,env(safe-area-inset-bottom))}
  .family-orders li{gap:10px}
  .family-order-status{max-width:85px}
}

.family-more{text-align:center;margin-top:14px}
.family-mode .family-account select{border:1px solid #d4e3dc;border-radius:8px;min-height:42px;font-family:inherit}

/* Keep the full staff menu reachable on shorter desktop screens. */
@media(min-width:901px){
  .sidebar nav{min-height:0;overflow-y:auto;flex:1;align-content:start;scrollbar-width:thin;scrollbar-color:#72909c transparent;padding-bottom:10px}
  .sidebar .brand,.sidebar .logout{flex-shrink:0}
  .sidebar .logout{margin-top:12px}
}

/* 2026-10-14: concise classroom controls */
.point-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
.evaluation-preset-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.evaluation-preset{min-width:0;white-space:normal;line-height:1.5;padding:10px 8px;}
.leave-reason{color:var(--text);white-space:pre-wrap;overflow-wrap:anywhere;}

dialog.document-preview-dialog{width:min(1200px,96vw);max-width:1200px;max-height:92dvh;overflow:hidden;}
.document-preview{width:100%;max-width:none;display:flex;flex-direction:column;max-height:92dvh;box-sizing:border-box;}
.document-preview .dialog-head,.document-preview .dialog-actions{flex-shrink:0;}
#documentPreviewContent{min-height:80px;max-height:none;overflow:auto;flex:1;padding:6px 0 16px;}
#documentPreviewContent table{min-width:0;width:100%;border-collapse:collapse;table-layout:auto;}
#documentPreviewContent td{min-width:100px;max-width:none;border:1px solid #cbd5e1;white-space:pre-wrap;overflow-wrap:anywhere;vertical-align:top;padding:10px;}
#documentPreviewContent p{white-space:pre-wrap;line-height:1.8;margin:4px 0 10px;}
#documentPreviewContent img{display:block;max-width:100%;height:auto;max-height:none;margin:12px auto;}
#documentPreviewContent iframe{width:100%;height:68dvh;border:0;}
.preview-table-scroll{width:100%;overflow:auto;}
.preview-sheet-picker{position:sticky;top:0;background:#fff;padding:8px 0;z-index:1;}
.preview-sheet-picker select{max-width:100%;padding:8px;border:1px solid var(--line);border-radius:6px;}
.notice-image-dialog{display:none;overflow:hidden;max-height:92dvh;}
.notice-image-dialog[open]{display:flex;flex-direction:column;}
.notice-image-dialog .panel-head{flex-shrink:0;}
.notice-image-scroll{min-height:0;overflow:auto;}
.notice-image-scroll img{max-width:100%;height:auto;max-height:none;}
@media(max-width:640px){dialog.document-preview-dialog{width:100%;max-height:94dvh;}.document-preview{max-height:94dvh;}.document-preview .dialog-head h2{font-size:1.05rem;overflow-wrap:anywhere;}}
.legacy-review-scroll{max-height:40vh;margin:12px 0;}
#legacyReviewResult details{margin:14px 0;}
#legacyReviewResult summary{cursor:pointer;color:var(--navy);}

#documentPreviewContent table.preview-workbook{table-layout:fixed;}
#documentPreviewContent .preview-workbook td{min-width:0;padding:7px 5px;font-size:13px;line-height:1.6;word-break:normal;}
#documentPreviewContent .preview-workbook tr:first-child td{font-size:16px;font-weight:650;}

.preview-align-left{text-align:left;}.preview-align-right{text-align:right;}.preview-align-center{text-align:center;}.preview-align-justify{text-align:justify;}

#documentPreviewContent img.preview-fit{max-height:calc(92dvh - 210px);width:auto;object-fit:contain;}
@media(max-width:640px){#documentPreviewContent img.preview-fit{max-height:calc(94dvh - 190px);}}
/* Super administrator bulk maintenance: bounded editors and difference lists. */
.bulk-scope{border:1px solid #dce5ef;border-radius:12px;padding:12px;min-width:0}
.bulk-class-options{display:flex;flex-wrap:wrap;gap:8px 16px;max-height:130px;overflow:auto;margin-top:10px}
.bulk-class-options label{display:flex;align-items:center;gap:6px;white-space:nowrap}
.bulk-class-options input{width:18px;height:18px;min-height:18px;padding:0;margin:0}
#bulkMaintenanceForm{gap:14px;min-width:0}
#bulkMaintenanceForm details{border:1px solid #e2e8f0;border-radius:10px;padding:10px 12px}
#bulkMaintenanceForm summary{cursor:pointer;color:#334155;font-weight:600}
#bulkText{width:100%;max-width:100%;box-sizing:border-box;overflow:auto;min-height:150px;font-size:13px;line-height:1.65;font-family:ui-monospace,monospace}
.bulk-diff{max-height:280px;overflow:auto}
.bulk-diff table{table-layout:fixed;min-width:0;width:100%}
.bulk-diff td{white-space:normal;word-break:break-word;vertical-align:top;font-size:13px;line-height:1.65}
.bulk-reference{max-height:190px;overflow:auto;font-size:13px;line-height:1.6;overflow-wrap:anywhere}
.bulk-upload{margin:8px 0}
#bulkMaintenanceForm .dialog-head{position:sticky;top:0;z-index:3;background:#fff;padding:12px 0;border-bottom:1px solid var(--line)}
#bulkMaintenanceForm .dialog-head h2{font-size:1.15rem}
.admin-data-scope-summary{margin:8px 0 14px;padding:9px 12px;border-left:3px solid #3182ce;border-radius:6px;background:#f0f7ff;color:#334b65;font-size:13px;line-height:1.6}
#adminDataScopeField select{min-width:110px}
#reportScopeModeField,#reportCampusField,#reportClassField{min-width:0}
@media(max-width:640px){.topbar .class-picker{flex-wrap:wrap;max-width:100%}.admin-data-scope-summary{font-size:12px}#adminDataScopeField select{min-width:0}}

/* Mixed notice attachments: compact list, explicit per-file previews. */
.notice-card p{white-space:pre-wrap;overflow-wrap:anywhere;}
.notice-attachments{margin-top:12px;}
.attachment-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);flex-wrap:wrap;}
.attachment-label{flex:1;min-width:150px;overflow-wrap:anywhere;}
.attachment-label small{display:block;color:var(--muted);font-size:12px;margin-top:3px;}
.attachment-thumb{width:52px;height:52px;object-fit:contain;border:1px solid var(--line);border-radius:6px;}
.notice-draft-attachments{max-height:240px;overflow:auto;}
.preview-attachment-picker{display:flex;gap:10px;align-items:center;flex-shrink:0;margin:8px 0;}
.preview-attachment-picker select{min-width:0;max-width:100%;flex:1;}
.preview-download{text-decoration:none;display:inline-flex;align-items:center;}
@media(max-width:640px){.attachment-label{flex-basis:60%;}.document-preview .dialog-actions{flex-wrap:wrap;gap:6px;}.preview-attachment-picker{align-items:stretch;flex-direction:column;}}

.pdf-preview-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 0;position:sticky;top:0;background:#fff;z-index:2;}
.pdf-preview-toolbar label{display:flex;gap:5px;align-items:center;}
.pdf-preview-toolbar input{width:64px;padding:6px;}
#pdfCanvasScroll{overflow:auto;max-width:100%;}
#pdfCanvas{display:block;border:1px solid var(--line);margin:8px auto;background:#fff;}

/* 1.5: restrained colors, consistent controls, readable labels and clear feedback. */
:root{--teal:#26766c;--teal-hover:#1c6159;--teal-soft:#edf6f3;--muted:#5d6f77;--line:#dce5e8;--danger:#a13232;--shadow:0 12px 32px rgba(24,50,63,.1);}
body{line-height:1.6;}
button,input,select,textarea{letter-spacing:normal;}
.primary,.secondary,.file-button,.nav-button{font-size:.9rem;font-weight:600;line-height:1.5;}
.primary,.secondary,.file-button,.icon-button{border-radius:8px;}
.secondary:hover:not(:disabled),.file-button:hover{background:#f3f7f7;border-color:#9eb4bb;}
.primary:active:not(:disabled),.secondary:active:not(:disabled){transform:translateY(1px);}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #6caca3;outline-offset:2px;}
button,.phone-link,.attachment-label,summary{overflow-wrap:anywhere;}
.panel-head h2,.family-panel h2,.family-section h2{color:var(--navy);}
.panel-head p,.student-search-hint,.family-muted{line-height:1.7;}
.form-error:empty,.family-message:empty{min-height:0;margin:0;}
.form-error{white-space:pre-wrap;overflow-wrap:anywhere;}
.table-wrap td{overflow-wrap:anywhere;}
.record-note,.audit-meta{line-height:1.65;}
.notice-card .attachment-row .compact-button{white-space:nowrap;}
.notice-draft-attachments .attachment-row{gap:8px;padding:8px 0;}
input[type=file]{max-width:100%;font-size:13px;}
input[type=file]::file-selector-button{font:inherit;border:1px solid var(--line-strong);border-radius:6px;background:#f4f8f7;color:var(--navy);padding:7px 12px;margin-right:10px;cursor:pointer;}
.sync-control{color:var(--muted);font-size:13px;}
#exportStatus{white-space:pre-wrap;overflow-wrap:anywhere;}
.family-shell{color:var(--text);}
.family-panel,.family-product{border-radius:12px;box-shadow:none;}
.family-badge{background:var(--teal-soft);color:#245f56;white-space:nowrap;}
.family-product h3{overflow-wrap:anywhere;line-height:1.55;}
.family-quota,.family-stock{color:var(--muted);}
.family-toolbar button,.family-product button{min-height:44px;}
@media(max-width:640px){.primary,.secondary,.file-button{min-height:44px;} .family-header h1{font-size:24px;} .family-shell{padding:20px 14px 32px;} .attachment-row .attachment-label{min-width:0;flex-basis:100%;} .dialog-actions{gap:8px;} .family-toolbar{align-items:flex-start;flex-wrap:wrap;} .sync-control{font-size:12px;}}

.marketplace-metrics{grid-template-columns:repeat(5,minmax(0,1fr));}
@media(max-width:1000px){.marketplace-metrics{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:640px){.marketplace-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}.marketplace-metrics article:last-child{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;}.marketplace-metrics article:last-child strong{margin-top:0;}}

/* 1.5.1: show accounting differences only when present. */
.point-review{margin:12px 0;padding:12px;border:1px solid #d9b66d;border-radius:9px;background:#fffdf7}.point-review summary{color:#765016;font-weight:650;cursor:pointer}.point-review p{line-height:1.65;color:#655541}.point-review .table-wrap{margin:10px 0;max-height:360px}.family-point-review{margin:0 0 16px;padding:12px;border:1px solid #d9b66d;border-radius:9px;background:#fffdf7;color:#765016;line-height:1.65}.journal-error{color:#a93434!important;font-weight:650}
.restore-preview-summary .table-wrap{max-height:260px;overflow:auto}.restore-preview-summary p{line-height:1.65}.restore-preview-summary table{min-width:550px}
.family-review-batch{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:12px 0}.family-review-batch p{flex-basis:100%;margin:0}.family-review-batch label{display:flex;align-items:center;gap:6px}#familyReviewControl .filter-bar{display:flex;flex-wrap:wrap;align-items:end;gap:12px}#familyReviewControl .filter-bar label{display:grid;gap:6px}#familyReviewRows table{min-width:800px}#familyReviewRows select{max-width:280px;width:100%}.family-review-exception{background:#fff8eb}#familyReviewRows tr[hidden]{display:none}

/* Two account meanings, one source. */
.points-overview{display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,3fr);gap:14px;margin:16px 0}
.points-overview>section{border:1px solid #cfdddd;border-radius:12px;padding:16px;background:#f7fbfa}
.points-overview .growth-points-group{border-top:4px solid #267d70}
.points-overview .mall-points-group{border-top:4px solid #4d73a6;background:#f8faff}
.points-overview h3{font-size:1rem;margin:0 0 12px;color:#24434d}
.points-overview .metrics{margin:0;grid-template-columns:1fr}
.points-overview .marketplace-ledger-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
.points-overview p{font-size:.88rem;line-height:1.6;color:#52676f;margin:10px 0 0}
.points-overview .metrics article{background:#fff;box-shadow:none;min-width:0}
.marketplace-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
.point-account-search{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.point-account-table th{white-space:nowrap}
@media(max-width:760px){.points-overview{grid-template-columns:1fr}.points-overview .metrics strong{font-size:1.4rem}}
@media(max-width:400px){.points-overview>section{padding:12px}.points-overview .marketplace-ledger-metrics{gap:5px}.points-overview .metrics article{padding:10px 7px}.points-overview .metrics span{font-size:.78rem}}
.family-tabs { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:20px 0; }
.family-tabs button { min-height:48px; flex:1 1 140px; }
.family-tabs small { flex-basis:100%; color:#4a626c; }
.family-lifetime { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.family-filter { display:flex; flex-wrap:wrap; gap:12px; align-items:end; margin:16px 0; }
.family-filter label { flex:1 1 140px; display:grid; gap:6px; }
.family-filter input,.family-filter select { width:100%; min-height:44px; }
.family-orders .family-order-status { min-width:85px; }
@media(max-width:640px) { .family-lifetime { grid-template-columns:repeat(2,minmax(0,1fr)); } .family-filter label { flex-basis:42%; } .family-filter button { width:100%; } }

/* Footer: centered groups, readable spacing, whole registration links wrap. */
.platform-notice { display: grid; row-gap: 8px; padding: 20px 24px; border-top: 1px solid var(--line); background: var(--bg); color: var(--muted); text-align: center; font-size: 12px; line-height: 24px; overflow-wrap: anywhere; }
.platform-notice-brief { max-width: 600px; margin: 0 auto; text-wrap: balance; }
.platform-notice-details { width: 100%; max-width: 600px; min-width: 0; margin: 0 auto; font-size: 12px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
.platform-notice-details > summary { width: fit-content; min-height: 24px; padding: 0 6px; margin: 0 auto; cursor: pointer; font: inherit; text-underline-offset: 3px; }
.platform-notice-details > summary:hover { text-decoration: underline; }
.platform-notice-copy { padding: 10px 0 6px; text-align: center; font: inherit; }
.platform-notice-copy p { margin: 0; font: inherit; text-wrap: balance; }
.platform-notice-copy p + p { margin-top: 10px; }
.platform-notice .platform-notice-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 14px; margin: 0 auto; font-size: 12px; text-align: center; }
.platform-notice .platform-notice-registrations { gap: 8px 26px; }
.platform-notice-meta > span, .platform-notice-meta > a { white-space: nowrap; }
.platform-notice a { color: inherit; text-decoration: none; text-underline-offset: 3px; }
.platform-notice a:hover { text-decoration: underline; }
.platform-notice .platform-police-beian { display: inline-flex; align-items: center; gap: 5px; }
.platform-police-beian img { display: block; width: 14px; height: 15px; object-fit: contain; flex: 0 0 auto; }
.platform-notice a:focus-visible, .platform-notice-details > summary:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; border-radius: 2px; }
@media (max-width: 560px) { .platform-notice { padding: 18px 16px; } .platform-notice .platform-notice-meta { font-size: 11px; } }

/* Contact dialog, shared by all three public footers. */
.platform-notice .platform-email-trigger { border: 0; border-radius: 0; background: transparent; color: inherit; padding: 0; min-height: 24px; font: inherit; white-space: nowrap; cursor: pointer; box-shadow: none; }
.platform-email-trigger:hover { text-decoration: underline; text-underline-offset: 3px; }
.platform-email-trigger:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
.platform-email-dialog { width: min(360px, calc(100vw - 32px)); max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); overflow: auto; padding: 22px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); color: var(--text); text-align: center; font-size: 13px; line-height: 1.7; box-shadow: var(--shadow); }
.platform-email-dialog::backdrop { background: rgb(23 56 71 / 28%); }
.platform-email-dialog h2 { margin: 0 0 14px; font-size: 16px; }
.platform-email-dialog input { width: 100%; min-width: 0; text-align: center; font: inherit; }
.platform-email-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 16px 0; }
.platform-email-actions button, .platform-email-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 16px; border: 1px solid var(--line); border-radius: 8px; font: inherit; }
.platform-email-actions a { background: var(--teal-soft); color: var(--teal); }
.platform-email-dialog p { margin: 10px 0; font: inherit; }
#platformEmailStatus { min-height: 22px; color: var(--teal); }
.platform-email-dialog form { margin: 0; }
.platform-email-dialog .platform-email-close { background: transparent; color: var(--muted); border: 0; font: inherit; min-height: 36px; }

/* Family points overview and independently loaded shop. */
.family-account>div{width:100%}.family-account select{max-width:480px}
.family-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:20px}
.family-summary article{padding:18px;background:#edf6f2;border-radius:12px;min-width:0}
.family-summary article span{display:block;color:#47665e;font-size:14px;line-height:1.6}
.family-summary article strong{display:block;font-size:36px;color:#215e4e;line-height:1.5;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.family-balance-details{border-top:1px solid #e1e8e6;margin-top:14px}.family-balance-details .family-lifetime{margin-top:14px}
#familyRecordQuery>summary,#familyOrderHistory>summary{padding:0;font-size:18px;font-weight:650;color:var(--navy)}
#familyRecordQuery[open]>summary,#familyOrderHistory[open]>summary{margin-bottom:16px}
.family-shop-notice p{margin-bottom:0}.family-orders p{font-size:13px;line-height:1.7;margin:6px 0;overflow-wrap:anywhere}
.family-orders li.family-record-reversed .family-order-status strong{color:#687670;text-decoration:line-through}
.family-orders .family-point-negative{color:#a64040}.family-orders .family-point-positive{color:#215e4e}
@media(max-width:640px){.family-summary{gap:10px}.family-summary article{padding:14px 10px}.family-summary article strong{font-size:30px}.family-summary article span{font-size:13px}.family-balance-details .family-lifetime{grid-template-columns:1fr}.family-filter label{min-width:0}.family-orders .family-order-status{max-width:110px}.family-tabs{gap:10px}.family-tabs button{flex-basis:40%}}

.review-login-fields{display:grid;gap:12px;margin-top:14px}.review-login-fields label{display:grid;gap:6px}
@media print{body.external-review-mode>*{display:none!important}}
body.external-review-mode [id^="export"],body.external-review-mode [id^="download"],body.external-review-mode [data-view="reports"],body.external-review-mode #reportNavGroup{display:none!important}
