:root {
  color-scheme: light;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  color: #1f2f43;
  background: #f4f7fb;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: #f4f7fb; }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
button { cursor: pointer; }
[hidden] { display: none !important; }

.teacher-login-screen { min-height: 100dvh; display: grid; place-items: center; padding: 24px; background: #e9f0f7; }
.teacher-login-panel { width: min(430px, 100%); padding: 34px; border: 1px solid #d5e0eb; border-radius: 8px; background: #fff; box-shadow: 0 18px 48px rgba(27, 57, 88, .14); }
.teacher-brand { display: flex; align-items: center; gap: 12px; min-width: 0; }
.teacher-brand img { width: 44px; height: 52px; object-fit: contain; }
.teacher-brand strong, .teacher-brand span { display: block; }
.teacher-brand strong { color: #fff; font-size: 20px; }
.teacher-brand span { margin-top: 2px; color: #b8cce0; font-size: 12px; }
.teacher-brand-login strong { color: #123d68; }
.teacher-brand-login span { color: #5f7186; }
.login-heading { margin: 28px 0 22px; }
.login-heading p, .eyebrow { margin: 0 0 6px; color: #087f5b; font-size: 11px; font-weight: 800; }
.login-heading h1 { margin: 0; color: #142a43; font-size: 26px; }
.login-heading span, .page-heading span { display: block; margin-top: 7px; color: #64758a; line-height: 1.45; }
label { display: grid; gap: 6px; margin-bottom: 14px; color: #42566d; font-size: 12px; font-weight: 700; }
input, select, textarea { width: 100%; min-height: 42px; border: 1px solid #bdcad8; border-radius: 5px; background: #fff; color: #1f2f43; padding: 9px 11px; outline: none; }
input:focus, select:focus, textarea:focus { border-color: #1769c2; box-shadow: 0 0 0 3px rgba(23, 105, 194, .12); }

.focus-start-card,.focus-session-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.focus-start-card h2,.focus-session-heading h2 { margin:3px 0 5px; color:#163d65; }
.focus-start-card p { max-width:720px; color:#64758a; }
.focus-summary { display:grid; grid-template-columns:repeat(3,1fr); margin:18px 0; border:1px solid #d9e3ed; border-radius:7px; overflow:hidden; }
.focus-summary span { display:grid; gap:3px; padding:13px 16px; border-right:1px solid #d9e3ed; }
.focus-summary span:last-child { border-right:0; }
.focus-summary small { color:#6a7b8e; }
.focus-summary strong { color:#123f70; font-size:22px; }
.focus-participant-list { display:grid; gap:7px; }
.focus-participant-row { display:grid; grid-template-columns:42px minmax(180px,1fr) minmax(130px,auto) auto; align-items:center; gap:10px; padding:10px 12px; border:1px solid #dce5ee; border-radius:6px; background:#fff; }
.focus-participant-row > div { display:grid; gap:3px; }
.focus-participant-row small { color:#718093; }
.focus-student-initial { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:#e8f1fb; color:#125ca6; font-weight:800; }
.focus-state { justify-self:start; padding:5px 8px; border-radius:5px; font-size:11px; font-weight:800; }
.focus-state.success { background:#e4f6eb; color:#187a49; }
.focus-state.warning { background:#fff3d8; color:#9b6500; }
.focus-state.danger { background:#fde8e6; color:#b42318; }
@media(max-width:700px){.focus-start-card,.focus-session-heading{align-items:stretch;flex-direction:column}.focus-summary{grid-template-columns:1fr 1fr 1fr}.focus-participant-row{grid-template-columns:38px 1fr}.focus-state{grid-column:2}.focus-participant-row button{grid-column:1/-1}.focus-summary span{padding:10px 8px}}
.password-field { display: flex; border: 1px solid #bdcad8; border-radius: 5px; overflow: hidden; }
.password-field:focus-within { border-color: #1769c2; box-shadow: 0 0 0 3px rgba(23, 105, 194, .12); }
.password-field input { border: 0; box-shadow: none; }
.password-field button { border: 0; background: #eef3f8; color: #31516f; padding: 0 14px; font-size: 12px; font-weight: 700; }
.primary-command, .secondary-command, .danger-command, .text-command, .icon-command { min-height: 40px; border-radius: 5px; font-weight: 700; }
.primary-command { border: 1px solid #0f5cad; background: #0f5cad; color: #fff; padding: 9px 17px; }
.primary-command:hover { background: #0b4f97; }
.secondary-command { border: 1px solid #9eb2c6; background: #fff; color: #214e78; padding: 8px 14px; }
.danger-command { border: 1px solid #dfaaaa; background: #fff; color: #b42318; padding: 8px 14px; }
.text-command { border: 0; background: transparent; color: #1769c2; padding: 4px 6px; }
.icon-command { width: 42px; border: 1px solid #d6e0ea; background: #fff; color: #173a61; font-size: 20px; }
.form-status { min-height: 20px; margin: 10px 0 0; color: #64758a; font-size: 12px; }
.form-status.error { color: #b42318; }
.form-status.success { color: #087f5b; }

.teacher-app { min-height: 100dvh; display: grid; grid-template-columns: 216px minmax(0, 1fr); }
.teacher-sidebar { position: sticky; top: 0; height: 100dvh; display: flex; flex-direction: column; padding: 18px 10px; background: #123d68; }
.teacher-sidebar .teacher-brand { padding: 0 8px 16px; border-bottom: 1px solid rgba(255,255,255,.14); }
#teacherNavigation { display: grid; align-content: start; gap: 5px; margin-top: 12px; overflow-y: auto; scrollbar-width: thin; }
.teacher-nav-group { border-bottom: 1px solid rgba(255,255,255,.1); padding-bottom: 4px; }
.teacher-nav-group > summary { min-height: 39px; display: grid; grid-template-columns: 20px 1fr 16px; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 5px; color: #f2f7fb; cursor: pointer; font-size: 12px; font-weight: 800; list-style: none; }
.teacher-nav-group > summary::-webkit-details-marker { display: none; }
.teacher-nav-group > summary:hover { background: rgba(255,255,255,.08); }
.teacher-nav-group > summary svg { width: 18px; height: 18px; }
.teacher-nav-group > summary .nav-group-chevron { width: 15px; height: 15px; transition: transform .18s ease; }
.teacher-nav-group[open] > summary .nav-group-chevron { transform: rotate(180deg); }
.teacher-nav-group-items { display: grid; gap: 2px; padding: 2px 0 4px; }
.nav-item { width: 100%; min-height: 44px; display: flex; align-items: center; gap: 11px; border: 0; border-radius: 5px; background: transparent; color: #d7e4f0; padding: 8px 12px; text-align: left; }
.nav-item.nav-subitem { min-height: 35px; padding: 6px 12px 6px 38px; font-size: 12px; }
.nav-item.nav-root-item { min-height: 41px; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 12px; font-weight: 800; }
.nav-item.nav-root-item svg { width: 18px; height: 18px; }
.nav-item:hover, .nav-item.active { background: #1769c2; color: #fff; }
.nav-symbol { width: 22px; text-align: center; font-size: 19px; }
.sidebar-logout { margin-top: auto; min-height: 42px; border: 1px solid rgba(255,255,255,.25); border-radius: 5px; background: transparent; color: #fff; }
.teacher-workspace { min-width: 0; }
.teacher-topbar { position: sticky; top: 0; z-index: 10; min-height: 70px; display: flex; align-items: center; gap: 14px; padding: 10px 24px; border-bottom: 1px solid #d8e1eb; background: rgba(255,255,255,.96); }
.teacher-topbar > div:nth-child(2) { display: grid; gap: 3px; }
.teacher-topbar > div:nth-child(2) strong { font-size: 18px; }
.teacher-topbar > div:nth-child(2) span { color: #6c7c90; font-size: 11px; }
.topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.teacher-identity { display: flex; align-items: center; gap: 9px; padding-left: 14px; border-left: 1px solid #d8e1eb; }
.teacher-identity > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #123d68; color: #fff; font-weight: 800; }
.teacher-identity strong, .teacher-identity small { display: block; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.teacher-identity small { margin-top: 2px; color: #738397; }
#toggleTeacherMenu { display: none; }
.teacher-content { width: min(1460px, 100%); margin: 0 auto; padding: 26px; }
.teacher-view { display: none; }
.teacher-view.active-view { display: block; }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.page-heading h1 { margin: 0; color: #142a43; font-size: 27px; }
.page-heading span { font-size: 13px; }

.summary-strip { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)); border: 1px solid #d8e1eb; border-radius: 6px; background: #fff; overflow: hidden; }
.summary-item { min-height: 88px; padding: 15px 17px; border-right: 1px solid #e0e7ef; }
.summary-item:last-child { border-right: 0; }
.summary-item span, .summary-item small { display: block; color: #6c7c90; font-size: 11px; }
.summary-item strong { display: block; margin: 6px 0 3px; color: #123d68; font-size: 23px; }
.dashboard-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .8fr); gap: 18px; margin-top: 18px; }
.teacher-daily-notice { display: flex; align-items: center; gap: 14px; margin-top: 14px; border: 1px solid #efca73; border-left: 5px solid #d69a13; border-radius: 6px; background: #fff8e6; padding: 13px 16px; color: #694a05; }
.teacher-daily-notice[hidden] { display: none; }
.teacher-daily-notice strong, .teacher-daily-notice span { display: block; }
.teacher-daily-notice span { margin-top: 3px; color: #806a35; font-size: 11px; }
.daily-task-list { display: grid; gap: 10px; }
.daily-task-row { display: grid; grid-template-columns: 112px minmax(210px, 1fr) 132px; align-items: center; gap: 14px; border: 1px solid #dce5ee; border-left: 5px solid #d69a13; border-radius: 6px; background: #fff; padding: 12px; }
.daily-task-row.complete { border-left-color: #14915c; }
.daily-task-time strong, .daily-task-time span, .daily-task-main > strong { display: block; }
.daily-task-time strong { color: #145ca0; font-size: 13px; }
.daily-task-time span { margin-top: 4px; color: #718196; font-size: 11px; }
.daily-task-main > strong { color: #1a2f43; font-size: 14px; }
.daily-task-main > small { display: block; margin-top: 3px; color: #718196; font-size: 10px; }
.daily-task-statuses { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.daily-task-statuses span { border-radius: 999px; padding: 4px 8px; font-size: 10px; font-weight: 800; }
.daily-task-statuses .done { background: #e6f5ed; color: #137848; }
.daily-task-statuses .waiting { background: #fff3d8; color: #9a6500; }
.daily-task-statuses .activity { background: #e8eefc; color: #1f4fa3; }
.daily-task-row.activity { border-left: 3px solid #1f4fa3; }
.daily-task-badge { align-self: center; white-space: nowrap; border-radius: 999px; padding: 4px 10px; font-size: 10px; font-weight: 800; background: #e8eefc; color: #1f4fa3; }
.schedule-state.activity { background: #e8eefc; color: #1f4fa3; }
.daily-task-row > button { min-height: 40px; }
.work-section { border: 1px solid #d8e1eb; border-radius: 6px; background: #fff; padding: 18px; }
.lesson-inline-workspace { width: 100%; margin: 0; border-color: #a9c6df; border-left: 4px solid #1769c2; background: #fbfdff; box-shadow: 0 8px 22px rgba(22, 62, 99, .08); }
.attendance-class-picker > .lesson-inline-workspace,
.journal-lesson-list > .lesson-inline-workspace { margin: 0 0 4px; }
.lesson-inline-workspace.inline-open { animation: lesson-inline-open .18s ease-out; }
@keyframes lesson-inline-open { from { opacity: .55; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.section-heading h2 { margin: 0; color: #193552; font-size: 17px; }
.section-heading p { margin: 5px 0 0; color: #748499; font-size: 12px; }
.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.quick-grid button { min-height: 96px; border: 1px solid #d5e0eb; border-radius: 6px; background: #f9fbfd; padding: 14px; text-align: left; }
.quick-grid button:hover { border-color: #7ea9d6; background: #f1f7fd; }
.quick-grid strong, .quick-grid span { display: block; }
.quick-grid strong { color: #174d7d; }
.quick-grid span { margin-top: 7px; color: #718196; font-size: 11px; line-height: 1.4; }
.schedule-list, .data-list { display: grid; gap: 8px; }
.schedule-row { display: grid; grid-template-columns: 120px minmax(150px, 1fr) minmax(130px, .7fr) auto; align-items: center; gap: 14px; min-height: 66px; padding: 10px 12px; border: 1px solid #e0e7ef; border-left: 4px solid #1769c2; border-radius: 5px; }
.schedule-row strong, .schedule-row span, .schedule-row small { display: block; }
.schedule-row time { color: #145ca0; font-weight: 800; }
.schedule-row span { margin-top: 3px; color: #718196; font-size: 11px; }
.empty-state { padding: 38px 14px; color: #748499; text-align: center; }
.segmented-control { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.segmented-control button { min-width: 84px; min-height: 40px; border: 1px solid #bdcad8; border-radius: 5px; background: #fff; color: #42566d; padding: 7px 13px; font-weight: 700; }
.segmented-control button.active { border-color: #1769c2; background: #1769c2; color: #fff; }
.filter-bar, .report-filters { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)) auto; align-items: end; gap: 10px; margin-bottom: 16px; }
.gate-report-filters { grid-template-columns: repeat(2, minmax(150px, 220px)) minmax(0, 1fr); }
.mentoring-hub-report-filters { grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(150px, 220px)) auto; }
.gate-report-filters .report-commands { justify-self: end; }
.filter-bar label, .report-filters label { margin: 0; }
.report-commands { display: flex; align-items: center; gap: 7px; }
.report-commands button { white-space: nowrap; }
.teacher-report-mode-picker { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: 9px; margin-bottom: 14px; }
.teacher-report-mode-picker button { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; min-height: 68px; border: 1px solid #d2dde8; border-radius: 6px; background: #fff; color: #29445f; padding: 10px 12px; text-align: left; }
.teacher-report-mode-picker button:hover { border-color: #78a7d5; background: #f6faff; }
.teacher-report-mode-picker button.active { border-color: #1769c2; background: #edf6ff; box-shadow: inset 0 0 0 1px #1769c2; color: #104f8e; }
.teacher-report-mode-picker i { width: 25px; height: 25px; justify-self: center; }
.teacher-report-mode-picker span { min-width: 0; }
.teacher-report-mode-picker strong, .teacher-report-mode-picker small { display: block; letter-spacing: 0; }
.teacher-report-mode-picker strong { font-size: 13px; }
.teacher-report-mode-picker small { margin-top: 3px; color: #748499; font-size: 10px; line-height: 1.3; }
.teacher-report-panel[hidden] { display: none !important; }
.grade-report-filters { grid-template-columns: repeat(2, minmax(180px, 260px)) minmax(0, 1fr); }
.grade-report-filters .report-commands { justify-self: end; }
.mentoring-report-shortcut { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.mentoring-report-shortcut > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 6px; background: #edf6ff; color: #1769c2; }
.mentoring-report-shortcut h3, .mentoring-report-shortcut p { margin: 0; }
.mentoring-report-shortcut p { margin-top: 4px; color: #748499; font-size: 11px; }
.official-report-preview { margin-top: 14px; overflow-x: auto; border: 1px solid #cfd7df; background: #eef1f4; }
.official-report-sheet { min-width: 960px; padding: 22px 26px 18px; background: #fff; color: #111; font-family: Georgia, "Times New Roman", serif; }
.official-report-letterhead { padding-bottom: 8px; border-bottom: 2px solid #111; text-align: center; }
.official-report-letterhead strong { display: block; font-size: 15px; line-height: 1.3; }
.official-report-letterhead h3 { margin: 4px 0 1px; font-size: 17px; }
.official-document-letterhead { display: grid; grid-template-columns: 92px minmax(0, 1fr) 92px; align-items: center; gap: 12px; min-height: 116px; padding: 4px 8px 8px; border-bottom: 5px double #111; color: #111; text-align: center; font-family: Arial, sans-serif; }
.official-document-letterhead img { width: 82px; height: 88px; margin: auto; object-fit: contain; }
.official-document-letterhead span, .official-document-letterhead strong, .official-document-letterhead small { display: block; letter-spacing: 0; line-height: 1.2; }
.official-document-letterhead span { font-size: 14px; }
.official-document-letterhead strong { font-size: 16px; }
.official-document-letterhead strong:nth-of-type(2), .official-document-letterhead strong:nth-of-type(3) { font-size: 19px; }
.official-document-letterhead small { font-size: 9px; font-weight: 400; }
.official-report-title { padding: 8px 0 3px; text-align: center; }
.official-report-title h3 { margin: 0; font-size: 17px; }
.official-report-title strong { display: block; margin-top: 2px; font-size: 14px; }
.official-report-meta { display: grid; gap: 3px; margin: 11px 2px 10px; font-size: 11px; }
.official-report-meta span { display: grid; grid-template-columns: 105px 10px 1fr; }
.official-report-meta em { font-style: normal; }
.official-report-summary { display: grid; grid-template-columns: repeat(6, 1fr); margin-bottom: 12px; border: 1px solid #222; }
.official-report-summary span { min-width: 0; padding: 6px 8px; border-right: 1px solid #777; text-align: center; }
.official-report-summary span:last-child { border-right: 0; }
.official-report-summary small, .official-report-summary strong { display: block; }
.official-report-summary small { font-family: Arial, sans-serif; font-size: 11px; font-weight: 800; }
.official-report-summary strong { margin-top: 2px; font-family: Arial, sans-serif; font-size: 17px; }
.official-report-summary .present strong { color: #078a45; }
.official-report-summary .permission strong { color: #1759ba; }
.official-report-summary .sick strong, .official-report-summary .late strong { color: #a66a00; }
.official-report-summary .absent strong { color: #c41f2b; }
.seven-kaih-official-sheet { min-width: 1120px; }
.seven-kaih-official-summary { display: grid; grid-template-columns: repeat(10, minmax(88px, 1fr)); margin: 10px 0 12px; border: 1px solid #222; }
.seven-kaih-official-summary span { min-width: 0; padding: 6px 5px; border-right: 1px solid #777; text-align: center; }
.seven-kaih-official-summary span:last-child { border-right: 0; }
.seven-kaih-official-summary small, .seven-kaih-official-summary strong { display: block; font-family: Arial, sans-serif; }
.seven-kaih-official-summary small { min-height: 24px; font-size: 9px; font-weight: 800; line-height: 1.2; }
.seven-kaih-official-summary strong { margin-top: 3px; color: #0b559f; font-size: 15px; }
.official-report-matrix-wrap { overflow-x: auto; }
.official-report-matrix { width: 100%; min-width: max-content; border-collapse: collapse; font-size: 9px; }
.official-report-matrix th, .official-report-matrix td { min-width: 27px; height: 25px; padding: 3px 4px; border: 1px solid #333; text-align: center; }
.official-report-matrix th { background: #f4f5f6; font-family: Arial, sans-serif; font-weight: 800; }
.official-report-matrix th:nth-child(2), .official-report-matrix td:nth-child(2) { min-width: 78px; }
.official-report-matrix th:nth-child(3), .official-report-matrix td:nth-child(3) { min-width: 60px; }
.official-report-matrix th:nth-child(4), .official-report-matrix td:nth-child(4) { min-width: 145px; }
.seven-kaih-report-matrix { font-size: 10px; }
.seven-kaih-report-matrix th, .seven-kaih-report-matrix td { min-width: 55px; height: 26px; padding: 4px 5px; }
.seven-kaih-report-matrix th:nth-child(2), .seven-kaih-report-matrix td:nth-child(2) { min-width: 118px; }
.seven-kaih-report-matrix th:nth-child(3), .seven-kaih-report-matrix td:nth-child(3) { min-width: 210px; text-align: left; }
.seven-kaih-report-matrix th:nth-child(4), .seven-kaih-report-matrix td:nth-child(4) { min-width: 38px; text-align: center; }
.seven-kaih-report-matrix td:last-child { min-width: 105px; }
.official-report-matrix .official-student-name { text-align: left; white-space: nowrap; }
.official-report-matrix .report-code { font-family: Arial, sans-serif; font-weight: 800; }
.gate-report-code b, .gate-report-code small { display: block; }
.gate-report-code small { margin-top: 2px; color: #4d5b69; font-size: 7px; font-weight: 400; line-height: 1.25; white-space: nowrap; }
.official-report-matrix .code-I { background: #edf4ff; color: #1759ba; }
.official-report-matrix .code-S { background: #fff5d9; color: #8a5a00; }
.official-report-matrix .code-D { background: #f2edff; color: #6542a8; }
.official-report-matrix .code-A { background: #ffebed; color: #b61927; }
.official-report-matrix .code-T { background: #fff1d7; color: #9a6200; }
.official-report-footer { display: grid; grid-template-columns: 1fr 230px; gap: 30px; margin-top: 14px; font-size: 10px; }
.official-report-legend { align-self: start; padding: 8px 10px; border: 1px solid #555; }
.official-report-legend b { margin-left: 8px; }
.official-report-legend b:first-child { margin-left: 0; }
.official-report-signature { display: grid; gap: 3px; }
.official-report-signature i { display: block; height: 38px; }
.official-report-source { display: block; margin-top: 16px; font-size: 9px; }
.lesson-picker { display: flex; gap: 9px; overflow-x: auto; padding: 2px 0 8px; }
.lesson-picker button { flex: 0 0 220px; min-height: 78px; border: 1px solid #ccd7e3; border-radius: 6px; background: #fff; padding: 11px 13px; text-align: left; }
.lesson-picker button.active { border-color: #1769c2; box-shadow: inset 0 0 0 1px #1769c2; }
.lesson-picker strong, .lesson-picker span { display: block; }
.lesson-picker span { margin-top: 5px; color: #718196; font-size: 11px; }
.attendance-header { display: flex; justify-content: space-between; gap: 14px; padding-bottom: 14px; border-bottom: 1px solid #e0e7ef; }
.attendance-header h2 { margin: 0; font-size: 18px; }
.attendance-header p { margin: 5px 0 0; color: #718196; font-size: 12px; }
.attendance-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 14px 0; }
.attendance-summary.class-attendance-summary { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.attendance-summary div { padding: 10px; border: 1px solid #e0e7ef; border-radius: 5px; text-align: center; }
.attendance-summary strong, .attendance-summary span { display: block; }
.attendance-summary strong { color: #123d68; font-size: 21px; }
.attendance-summary span { margin-top: 3px; color: #718196; font-size: 10px; }
.student-attendance-list { display: grid; gap: 5px; }
.student-attendance-row { display: grid; grid-template-columns: 42px minmax(180px, 1fr) repeat(6, 62px); align-items: center; gap: 6px; min-height: 58px; padding: 7px 9px; border-bottom: 1px solid #e7edf3; }
.student-attendance-row.class-attendance-statuses { grid-template-columns: 42px minmax(180px, 1fr) repeat(6, 62px); }
.student-number { color: #718196; text-align: center; }
.student-name strong, .student-name small { display: block; }
.student-name small { margin-top: 3px; color: #7b8999; }
.status-command { min-height: 35px; border: 1px solid #cbd6e1; border-radius: 4px; background: #fff; color: #52657a; font-size: 11px; font-weight: 700; }
.mentoring-attendance-statuses .status-command { font-size: 0; }
.mentoring-attendance-statuses .status-command::after { content: attr(data-short); font-size: 12px; }
.status-command.selected[data-status="Hadir"] { border-color: #16845d; background: #16845d; color: #fff; }
.status-command.selected[data-status="Izin"] { border-color: #1769c2; background: #1769c2; color: #fff; }
.status-command.selected[data-status="Sakit"] { border-color: #c78b05; background: #c78b05; color: #fff; }
.status-command.selected[data-status="Dispen"] { border-color: #7456ad; background: #7456ad; color: #fff; }
.status-command.selected[data-status="Alpa"] { border-color: #c9362b; background: #c9362b; color: #fff; }
.status-command.selected[data-status="Terlambat"] { border-color: #d56b16; background: #d56b16; color: #fff; }
.attendance-actions { display: flex; justify-content: space-between; gap: 10px; margin-top: 16px; }
.learning-journal-form { display: grid; gap: 15px; }
.journal-lesson-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid #dce5ee; }
.journal-lesson-header p, .journal-lesson-header h2, .journal-lesson-header span { margin: 0; }
.journal-lesson-header p { color: #1769c2; font-size: 10px; font-weight: 800; }
.journal-lesson-header h2 { margin-top: 3px; color: #173a61; font-size: 19px; }
.journal-lesson-header span { display: block; margin-top: 4px; color: #718196; font-size: 12px; }
.journal-attendance { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #d5e0eb; border-radius: 5px; overflow: hidden; }
.journal-attendance span { min-width: 100px; padding: 10px 12px; text-align: center; }
.journal-attendance span + span { border-left: 1px solid #d5e0eb; }
.journal-attendance b { display: block; color: #123d68; font-size: 20px; }
.journal-warning { margin: 0; border-left: 4px solid #d99a14; background: #fff8e7; color: #6d541b; padding: 10px 12px; font-size: 12px; }
.journal-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.journal-form-grid label { margin: 0; }
.journal-form-grid label.wide { grid-column: 1 / -1; }
.journal-form-grid textarea { width: 100%; resize: vertical; }
.journal-report-section { margin-top: 18px; }
.journal-official-preview { display: grid; gap: 18px; margin-top: 14px; overflow-x: auto; border: 1px solid #cfd7df; background: #eef1f4; padding: 18px; }
.official-journal-sheet { width: 794px; min-height: 1123px; margin: 0 auto; padding: 42px 44px 34px; background: #fff; color: #111; font-family: Arial, sans-serif; box-shadow: 0 2px 12px rgba(20,42,67,.12); }
.journal-letterhead { display: grid; grid-template-columns: 82px 1fr 82px; align-items: center; min-height: 100px; padding-bottom: 8px; border-bottom: 4px double #111; text-align: center; }
.journal-letterhead::after { content: ""; }
.journal-letterhead img { width: 72px; height: 72px; object-fit: contain; }
.journal-letterhead strong { display: block; font-size: 16px; line-height: 1.3; }
.journal-letterhead strong:last-child { font-size: 19px; }
.journal-document-title { display: grid; gap: 4px; margin: 12px 0 28px; text-align: center; }
.journal-document-title strong { font-size: 17px; }
.journal-document-title span { font-size: 14px; font-weight: 700; }
.journal-document-meta { display: flex; justify-content: space-between; margin-bottom: 7px; font-size: 12px; }
.journal-table-wrap { overflow: hidden; }
.official-journal-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 8px; }
.official-journal-table th, .official-journal-table td { height: 25px; border: 1px solid #222; padding: 3px; vertical-align: top; overflow-wrap: anywhere; }
.official-journal-table th { height: 42px; text-align: center; vertical-align: middle; font-size: 8px; }
.official-journal-table th:nth-child(1) { width: 68px; }
.official-journal-table th:nth-child(2) { width: 34px; }
.official-journal-table th:nth-child(3) { width: 28px; }
.official-journal-table th:nth-child(4) { width: 65px; }
.official-journal-table th:nth-child(5) { width: 145px; }
.official-journal-table th:nth-child(6), .official-journal-table th:nth-child(7) { width: 37px; }
.official-journal-table th:nth-child(8) { width: 80px; }
.official-journal-table th:nth-child(9) { width: 95px; }
.official-journal-table td:nth-child(2), .official-journal-table td:nth-child(3), .official-journal-table td:nth-child(6), .official-journal-table td:nth-child(7) { text-align: center; }
.official-journal-table td small { display: block; margin-top: 3px; font-size: 6px; }
.journal-headmaster { width: 250px; display: grid; gap: 3px; margin: 50px 0 0 auto; font-size: 11px; }
.journal-headmaster i { height: 55px; }
.official-journal-sheet .official-report-source { margin-top: 28px; }
.mentoring-group-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.mentoring-group-heading h2, .mentoring-group-heading p { margin: 0; }
.mentoring-group-heading p { margin-top: 5px; color: #748499; font-size: 12px; }
.mentoring-report-panel { margin-top: 22px; border-top: 1px solid #dbe4ed; padding-top: 18px; }
.mentoring-report-filters { align-items: end; }
.mentoring-report-preview { margin-top: 14px; overflow-x: auto; border: 1px solid #cfd7df; background: #eef1f4; padding: 18px; }
.mentoring-official-sheet { min-width: 1040px; padding: 24px 28px; background: #fff; color: #111; font-family: Georgia, "Times New Roman", serif; }
.mentoring-report-matrix .official-student-name,
.mentoring-report-matrix .official-activity-name { text-align: left; }
.mentoring-report-matrix .official-activity-name { min-width: 130px; }
.teacher-content .mentoring-overview { grid-template-columns: 58px minmax(0, 1fr) 80px; }
.mentoring-work-menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 14px 0 4px; }
.mentoring-work-card { display: grid; grid-template-columns: 46px minmax(0, 1fr) 22px; align-items: center; gap: 12px; min-height: 76px; border: 1px solid #d8e4ee; border-radius: 8px; background: #fff; color: #173b64; padding: 12px 14px; text-align: left; cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.mentoring-work-card:hover { border-color: #7ba8cf; box-shadow: 0 8px 20px rgba(20, 61, 104, .1); transform: translateY(-1px); }
.mentoring-work-card > span:nth-child(2) { min-width: 0; }
.mentoring-work-card strong, .mentoring-work-card small { display: block; }
.mentoring-work-card strong { font-size: 14px; }
.mentoring-work-card small { margin-top: 4px; color: #6e7f92; font-size: 10px; line-height: 1.4; }
.mentoring-work-card > svg { width: 18px; color: #6f8296; }
.mentoring-work-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 7px; background: #e9f2fb; color: #0d5ba6; }
.mentoring-work-card.monitoring .mentoring-work-icon { background: #e6f5ee; color: #087f5b; }
.mentoring-work-icon svg { width: 23px; height: 23px; }
.homeroom-page-heading { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 16px; }
.homeroom-page-heading h2, .homeroom-page-heading p { margin: 0; }
.homeroom-page-heading small { color: #0d64b2; font-size: 9px; font-weight: 900; }
.homeroom-page-heading h2 { margin-top: 2px; color: #132f4c; font-size: 21px; }
.homeroom-page-heading p { margin-top: 3px; color: #6f7f90; font-size: 11px; }
.homeroom-page-badge { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #c8dbea; border-radius: 999px; background: #f4f8fc; color: #174f82; padding: 7px 10px; font-size: 10px; font-weight: 800; }
.homeroom-page-badge svg { width: 15px; height: 15px; }
.homeroom-monitoring-sheet { display: grid; gap: 18px; }
.homeroom-monitoring-sheet h3 { margin: 6px 0 0; color: #173b64; font-size: 17px; }
.homeroom-monitoring-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.homeroom-monitoring-meta label,
.homeroom-wide-field,
.homeroom-notes-grid label { display: grid; gap: 7px; color: #526174; font-size: 12px; font-weight: 700; }
.homeroom-monitoring-meta input,
.homeroom-wide-field textarea,
.homeroom-notes-grid textarea,
.homeroom-table input,
.homeroom-table select { width: 100%; border: 1px solid #d5dee9; border-radius: 10px; background: #fff; color: #1f2d3d; font: inherit; padding: 11px 12px; }
.homeroom-monitoring-meta input[readonly] { background: #f6f8fa; color: #40556a; }
.homeroom-attendance-panel { display: grid; gap: 13px; border: 1px solid #bad8ca; border-radius: 8px; background: #f7fcf9; padding: 16px; }
.homeroom-section-heading { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 11px; }
.homeroom-section-heading.compact { grid-template-columns: 38px minmax(0, 1fr); margin-top: 4px; }
.homeroom-section-heading > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 7px; background: #e3f2ea; color: #087f5b; }
.homeroom-section-heading.compact > span { width: 36px; height: 36px; background: #e9f2fb; color: #0d5ba6; }
.homeroom-section-heading svg { width: 21px; height: 21px; }
.homeroom-section-heading h3, .homeroom-section-heading p { margin: 0; }
.homeroom-section-heading h3 { color: #173b64; font-size: 15px; }
.homeroom-section-heading p { margin-top: 3px; color: #6c7d8e; font-size: 10px; }
.homeroom-section-heading > strong { color: #087f5b; font-size: 28px; }
.homeroom-attendance-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.homeroom-attendance-summary > span { display: grid; grid-template-columns: 24px minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: 8px; min-height: 58px; border: 1px solid #dce7df; border-radius: 7px; background: #fff; padding: 9px; }
.homeroom-attendance-summary svg { grid-row: 1 / 3; width: 20px; height: 20px; color: #15956b; }
.homeroom-attendance-summary small { color: #718092; font-size: 9px; }
.homeroom-attendance-summary strong { color: #173b64; font-size: 18px; }
.homeroom-attendance-summary .permission svg { color: #2469bf; }
.homeroom-attendance-summary .sick svg, .homeroom-attendance-summary .late svg { color: #bd7a06; }
.homeroom-attendance-summary .absent svg { color: #c83c3c; }
.homeroom-attendance-note { display: flex; align-items: flex-start; gap: 7px; margin: 0; border-top: 1px solid #dce9e1; padding-top: 10px; color: #4d665a; font-size: 10px; line-height: 1.5; }
.homeroom-attendance-note svg { width: 14px; height: 14px; flex: 0 0 auto; margin-top: 1px; }
.automatic-label { display: inline-flex; margin: 6px 0 0; border-radius: 999px; background: #dff3e9; color: #087f5b; padding: 3px 7px; font-size: 8px; font-weight: 900; }
.homeroom-table input[readonly], .homeroom-table .automatic-field { background: #eef8f3; color: #176446; font-weight: 700; }
#homeroomOfficialPrintHost { display: none; }
.homeroom-official-print { color: #111; background: #fff; font-family: Arial, sans-serif; }
.homeroom-print-title { margin: 9px 0 8px; text-align: center; }
.homeroom-print-title h1 { margin: 0 0 3px; font-size: 16px; letter-spacing: 0; text-decoration: underline; }
.homeroom-print-title strong { font-size: 11px; }
.homeroom-print-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 24px; margin-bottom: 8px; font-size: 9px; }
.homeroom-print-meta span { display: grid; grid-template-columns: 76px 8px minmax(0, 1fr); }
.homeroom-print-meta em { font-style: normal; }
.homeroom-print-attendance { display: grid; grid-template-columns: minmax(160px, 2fr) repeat(5, minmax(48px, .65fr)); border: 1px solid #111; margin-bottom: 9px; }
.homeroom-print-attendance > div, .homeroom-print-attendance > span { min-height: 38px; border-right: 1px solid #111; padding: 5px 7px; }
.homeroom-print-attendance > span:last-child { border-right: 0; }
.homeroom-print-attendance strong, .homeroom-print-attendance small, .homeroom-print-attendance b { display: block; }
.homeroom-print-attendance small { margin-top: 3px; font-size: 7px; }
.homeroom-print-attendance > span { text-align: center; }
.homeroom-print-attendance > span b { margin-top: 2px; font-size: 14px; }
.homeroom-official-print h2 { margin: 9px 0 4px; font-size: 10px; }
.homeroom-print-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 8px; }
.homeroom-print-table th, .homeroom-print-table td { border: 1px solid #111; padding: 3px 4px; vertical-align: top; overflow-wrap: anywhere; }
.homeroom-print-table thead th { background: #edf1f4; text-align: center; }
.homeroom-print-table.aspect th:first-child, .homeroom-print-table.aspect td:first-child { width: 25px; text-align: center; }
.homeroom-print-table.aspect th:nth-child(2) { width: 25%; }
.homeroom-print-table.weeks { margin-top: 5px; text-align: center; }
.homeroom-print-table.support th:first-child, .homeroom-print-table.support td:first-child,
.homeroom-print-table.programs th:first-child, .homeroom-print-table.programs td:first-child { width: 25px; text-align: center; }
.homeroom-print-table.notes th { width: 150px; text-align: left; }
.homeroom-print-signatures { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 16px; text-align: center; font-size: 8px; break-inside: avoid; }
.homeroom-print-signatures span, .homeroom-print-signatures strong, .homeroom-print-signatures b, .homeroom-print-signatures small { display: block; }
.homeroom-print-signatures i { display: block; height: 44px; }
.homeroom-print-source { display: block; margin-top: 10px; font-size: 7px; }
.homeroom-table { display: grid; border: 1px solid #dbe4ed; border-radius: 14px; overflow: auto; background: #fff; box-shadow: 0 8px 24px rgba(15, 42, 73, .06); }
.homeroom-table-head,
.homeroom-table-row { display: grid; gap: 0; min-width: 760px; border-bottom: 1px solid #e6edf4; }
.homeroom-table-head { background: #f3f7fb; color: #173b64; font-weight: 800; }
.homeroom-table-head span,
.homeroom-table-row > span { padding: 11px 12px; border-right: 1px solid #e6edf4; }
.homeroom-table-row { align-items: center; }
.homeroom-table-row input,
.homeroom-table-row select { border: 0; border-radius: 0; min-height: 44px; }
.homeroom-aspect-table .homeroom-table-head,
.homeroom-aspect-table .homeroom-table-row { grid-template-columns: 54px minmax(260px, 1.4fr) minmax(210px, 1fr) minmax(210px, 1fr); }
.homeroom-week-table .homeroom-table-head,
.homeroom-week-table .homeroom-table-row { grid-template-columns: 90px repeat(4, minmax(150px, 1fr)); }
.homeroom-support-table .homeroom-table-head,
.homeroom-support-table .homeroom-table-row { grid-template-columns: minmax(220px, 1.1fr) minmax(190px, 1fr) minmax(240px, 1.2fr) minmax(190px, 1fr); }
.homeroom-program-table .homeroom-table-head,
.homeroom-program-table .homeroom-table-row { grid-template-columns: minmax(280px, 1.4fr) 140px minmax(260px, 1fr); }
.homeroom-notes-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.homeroom-notes-grid label:last-child { grid-column: 1 / -1; }
.homeroom-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.member-row, .permission-row { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(110px, .5fr) auto; align-items: center; gap: 12px; padding: 11px 8px; border-bottom: 1px solid #e5ebf2; }
.member-row strong, .member-row small, .permission-row strong, .permission-row small { display: block; }
.member-row small, .permission-row small { margin-top: 3px; color: #7a899b; }
.status-pill { display: inline-flex; min-height: 26px; align-items: center; border-radius: 999px; background: #eef3f8; color: #31516f; padding: 4px 9px; font-size: 10px; font-weight: 800; }
.profile-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); border: 1px solid #d8e1eb; border-radius: 6px; background: #fff; overflow: hidden; }
.profile-summary { padding: 30px; border-right: 1px solid #e0e7ef; text-align: center; }
.profile-summary > span { width: 84px; height: 84px; display: grid; place-items: center; margin: 0 auto 15px; border-radius: 50%; background: #123d68; color: #fff; font-size: 31px; font-weight: 800; }
.profile-summary h2 { margin: 0; }
.profile-summary p { color: #718196; }
.profile-details { padding: 24px; }
.profile-details dl { margin: 0 0 22px; }
.profile-details dl div { display: grid; grid-template-columns: 170px 1fr; padding: 12px 0; border-bottom: 1px solid #e5ebf2; }
.profile-details dt { color: #718196; }
.profile-details dd { margin: 0; font-weight: 700; }
.profile-details button { margin-right: 8px; }
.online-text { color: #087f5b; }
.teacher-mobile-nav { display: none; }
dialog { width: min(480px, calc(100vw - 30px)); border: 0; border-radius: 7px; padding: 0; box-shadow: 0 22px 60px rgba(16, 39, 64, .28); }
dialog::backdrop { background: rgba(15, 34, 54, .5); }
dialog form { padding: 22px; }
.dialog-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.dialog-heading h2 { margin: 0; }
.dialog-heading button { border: 0; background: transparent; font-size: 24px; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.teacher-toast { position: fixed; right: 22px; bottom: 22px; z-index: 30; max-width: 360px; border-radius: 5px; background: #173a61; color: #fff; padding: 12px 16px; opacity: 0; pointer-events: none; transform: translateY(12px); transition: .2s ease; }
.teacher-toast.show { opacity: 1; transform: translateY(0); }

/* Android menyediakan toolbar sendiri, sehingga kerangka navigasi PWA tidak ditampilkan dua kali. */
html.embedded-android .teacher-app { display: block; min-height: 100%; }
html.embedded-android .teacher-sidebar { display: none !important; }
html.embedded-android .teacher-topbar { display: none !important; }
html.embedded-android .teacher-mobile-nav { display: none !important; }
html.embedded-android .teacher-content { width: 100%; padding: 16px 14px 24px; }
html.embedded-android .teacher-workspace { min-height: 100%; }

@media (max-width: 1050px) {
  .teacher-app { grid-template-columns: 196px minmax(0, 1fr); }
  .dashboard-layout { grid-template-columns: 1fr; }
  .daily-task-row { grid-template-columns: 96px minmax(160px, 1fr) 120px; }
  .report-filters { grid-template-columns: 1fr 1fr; }
  .report-filters button { min-height: 42px; }
  .report-commands { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .teacher-report-mode-picker { gap: 5px; }
  .teacher-report-mode-picker button { display: flex; justify-content: center; min-height: 54px; padding: 8px 5px; text-align: center; }
  .teacher-report-mode-picker i { width: 18px; height: 18px; flex: 0 0 auto; }
  .teacher-report-mode-picker strong { font-size: 10px; }
  .teacher-report-mode-picker small { display: none; }
  .teacher-app { display: block; }
  .teacher-sidebar { position: fixed; left: -250px; z-index: 25; width: 238px; transition: left .2s ease; }
  .teacher-app.menu-open .teacher-sidebar { left: 0; }
  #toggleTeacherMenu { display: block; }
  .teacher-topbar { min-height: 62px; padding: 8px 12px; }
  .teacher-topbar > div:nth-child(2) span, .teacher-identity div, #installTeacherPwa { display: none; }
  .teacher-identity { border: 0; padding: 0; }
  .teacher-content { padding: 18px 14px 90px; }
  .page-heading { align-items: flex-start; flex-direction: column; }
  .page-heading h1 { font-size: 23px; }
  .summary-strip { grid-template-columns: 1fr 1fr; }
  .summary-item:nth-child(2) { border-right: 0; }
  .summary-item:nth-child(-n+2) { border-bottom: 1px solid #e0e7ef; }
  .quick-grid { grid-template-columns: 1fr 1fr; }
  .schedule-row { grid-template-columns: 92px minmax(130px, 1fr) auto; }
  .schedule-row > div:nth-child(3) { display: none; }
  .report-filters { grid-template-columns: 1fr; }
  .report-commands { display: grid; grid-template-columns: 1fr 1fr 1fr; }
  .student-attendance-row, .student-attendance-row.class-attendance-statuses { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; padding-left: 0; padding-right: 0; }
  .student-attendance-row .student-number { grid-column: 1; }
  .student-attendance-row .student-name { grid-column: 2 / 7; }
  .student-attendance-row .status-command { grid-row: 2; }
  .student-attendance-row .status-command:nth-of-type(1) { grid-column: 1; }
  .student-attendance-row .status-command:nth-of-type(2) { grid-column: 2; }
  .student-attendance-row .status-command:nth-of-type(3) { grid-column: 3; }
  .student-attendance-row .status-command:nth-of-type(4) { grid-column: 4; }
  .student-attendance-row .status-command:nth-of-type(5) { grid-column: 5; }
  .student-attendance-row .status-command:nth-of-type(6) { grid-column: 6; }
  .status-command { font-size: 0; }
  .status-command::after { font-size: 11px; content: attr(data-short); }
  .profile-layout { grid-template-columns: 1fr; }
  .profile-summary { border-right: 0; border-bottom: 1px solid #e0e7ef; }
  .profile-details dl div { grid-template-columns: 1fr; gap: 5px; }
.teacher-mobile-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; display: grid; grid-template-columns: repeat(7, 1fr); min-height: 64px; padding-bottom: env(safe-area-inset-bottom); border-top: 1px solid #d6e0ea; background: #fff; }
  .teacher-mobile-nav button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 0; padding: 6px 2px; border: 0; background: #fff; color: #6b7a8c; font-size: 10px; }
  .teacher-mobile-nav button.active { color: #1769c2; font-weight: 800; }
}
@media print {
  @page { size: A4 landscape; margin: 8mm; }
  body.printing-teacher-report * { visibility: hidden !important; }
  body.printing-teacher-report .official-report-sheet.print-target,
  body.printing-teacher-report .official-report-sheet.print-target * { visibility: visible !important; }
  body.printing-teacher-report .official-report-sheet.print-target { position: absolute; inset: 0; width: 100%; min-width: 0; padding: 0; }
  body.printing-teacher-report .official-report-matrix { min-width: 0; font-size: 7px; }
  body.printing-teacher-report .official-report-matrix th,
  body.printing-teacher-report .official-report-matrix td { min-width: 0; height: 20px; padding: 2px; }
  body.printing-teacher-report .official-report-preview,
  body.printing-teacher-report .official-report-matrix-wrap { overflow: visible; border: 0; }
  body.printing-learning-journal * { visibility: hidden !important; }
  body.printing-learning-journal .journal-official-preview,
  body.printing-learning-journal .journal-official-preview * { visibility: visible !important; }
  body.printing-learning-journal .journal-official-preview { position: absolute; inset: 0; display: block; overflow: visible; border: 0; padding: 0; background: #fff; }
  body.printing-learning-journal .official-journal-sheet { page: journal; width: 100%; min-height: 0; margin: 0; padding: 0; box-shadow: none; break-after: page; }
  body.printing-learning-journal .official-journal-sheet:last-child { break-after: auto; }
  body.printing-gradebook-report * { visibility:hidden !important; }
  body.printing-gradebook-report .gradebook-official-sheet,
  body.printing-gradebook-report .gradebook-official-sheet * { visibility:visible !important; }
  body.printing-gradebook-report .gradebook-official-sheet { position:absolute; inset:0; width:100%; min-width:0; padding:0; }
  body.printing-gradebook-report .gradebook-official-table { font-size:8px; }
  body.printing-gradebook-report .gradebook-official-table th,
  body.printing-gradebook-report .gradebook-official-table td { height:20px; padding:2px 3px; }
  body.printing-gradebook-matrix * { visibility:hidden !important; }
  body.printing-gradebook-matrix .gradebook-official-matrix-sheet,
  body.printing-gradebook-matrix .gradebook-official-matrix-sheet * { visibility:visible !important; }
  body.printing-gradebook-matrix .gradebook-official-matrix-sheet { position:absolute; inset:0; width:100%; min-width:0; padding:0; }
  body.printing-gradebook-matrix .gradebook-matrix-document-scroll,
  body.printing-gradebook-matrix .gradebook-matrix-scroll { overflow:visible; border:0; padding:0; background:#fff; }
  body.printing-gradebook-matrix .gradebook-matrix { width:100%; min-width:0; table-layout:fixed; font-size:7px; }
  body.printing-gradebook-matrix .gradebook-matrix th,
  body.printing-gradebook-matrix .gradebook-matrix td { position:static; min-width:0; height:20px; padding:2px; }
  body.printing-gradebook-matrix .gradebook-matrix-score { width:100%; height:auto; border:0 !important; border-radius:0; background:transparent !important; box-shadow:none !important; padding:0; color:#111; font-size:7px; }
  body.printing-grade-report-center * { visibility:hidden !important; }
  body.printing-grade-report-center #gradeReportPreview,
  body.printing-grade-report-center #gradeReportPreview * { visibility:visible !important; }
  body.printing-grade-report-center #gradeReportPreview { position:absolute; inset:0; width:100%; overflow:visible; border:0; background:#fff; }
  body.printing-grade-report-center .gradebook-official-matrix-sheet { width:100%; min-width:0; padding:0; box-shadow:none; }
  body.printing-grade-report-center .gradebook-matrix { width:100%; min-width:0; table-layout:fixed; font-size:7px; }
  body.printing-grade-report-center .gradebook-matrix th,
  body.printing-grade-report-center .gradebook-matrix td { position:static; min-width:0; height:20px; padding:2px; }
  body.printing-mentoring-report * { visibility: hidden !important; }
  body.printing-mentoring-report .mentoring-official-sheet,
  body.printing-mentoring-report .mentoring-official-sheet * { visibility: visible !important; }
  body.printing-mentoring-report .mentoring-official-sheet { position: absolute; inset: 0; width: 100%; min-width: 0; padding: 0; }
  body.printing-mentoring-report .mentoring-report-matrix { min-width: 0; font-size: 7px; }
  body.printing-mentoring-report .mentoring-report-matrix th,
  body.printing-mentoring-report .mentoring-report-matrix td { min-width: 0; height: 20px; padding: 2px; }
  body.printing-mentoring-report .mentoring-report-preview,
  body.printing-mentoring-report .official-report-matrix-wrap { overflow: visible; border: 0; padding: 0; background: #fff; }
  body.printing-homeroom-monitoring * { visibility: hidden !important; }
  body.printing-homeroom-monitoring #homeroomOfficialPrintHost,
  body.printing-homeroom-monitoring #homeroomOfficialPrintHost * { visibility: visible !important; }
  body.printing-homeroom-monitoring #homeroomOfficialPrintHost { display: block; position: absolute; inset: 0; width: 100%; }
  body.printing-homeroom-monitoring .homeroom-official-print { page: homeroom-monitoring; width: 100%; padding: 0; }
  body.printing-homeroom-monitoring .homeroom-print-table tr { break-inside: avoid; }
}
@page journal { size: A4 portrait; margin: 10mm; }
@page homeroom-monitoring { size: A4 portrait; margin: 11mm; }

.gradebook-create-form { display:grid; grid-template-columns:minmax(140px,.8fr) minmax(160px,1fr) minmax(260px,1.6fr) minmax(180px,1fr) minmax(120px,.65fr) auto; gap:10px; align-items:end; }
.gradebook-create-form[hidden] { display:none; }
.gradebook-create-form label { display:grid; gap:6px; color:#53657a; font-size:12px; font-weight:700; }
.gradebook-create-form input,.gradebook-create-form select { width:100%; min-height:42px; border:1px solid #cfd9e5; border-radius:5px; background:#fff; padding:8px 10px; }
.gradebook-matrix-toolbar { display:grid; grid-template-columns:minmax(180px,1fr) minmax(210px,1.2fr) auto; gap:12px; align-items:end; }
.gradebook-matrix-toolbar label { display:grid; gap:6px; color:#53657a; font-size:12px; font-weight:700; }
.gradebook-matrix-toolbar select { width:100%; min-height:42px; border:1px solid #cfd9e5; border-radius:5px; background:#fff; padding:8px 10px; }
.gradebook-column-form { grid-template-columns:minmax(260px,1.5fr) minmax(180px,1fr) minmax(120px,.6fr) auto; margin-top:14px; padding:14px; border:1px solid #cbdbea; border-radius:6px; background:#f7faff; }
.gradebook-column-actions { display:flex; gap:8px; align-items:center; }
.gradebook-matrix-section { overflow:hidden; }
.gradebook-matrix-actions { display:flex; justify-content:flex-end; gap:8px; margin-bottom:12px; }
.gradebook-matrix-document-scroll { width:100%; overflow:auto; border:1px solid #cfd7df; background:#eef1f4; padding:12px; }
.gradebook-official-matrix-sheet { min-width:980px; padding:20px 22px; background:#fff; color:#111; font-family:Georgia,"Times New Roman",serif; }
.matrix-save-status { color:#64758a; font-size:12px; font-weight:700; }
.matrix-save-status[data-tone="saving"] { color:#9a6300; }
.matrix-save-status[data-tone="success"] { color:#087b47; }
.matrix-save-status[data-tone="error"] { color:#b42318; }
.gradebook-matrix-scroll { width:100%; overflow:auto; border:1px solid #333; }
.gradebook-matrix { width:max-content; min-width:100%; border-collapse:separate; border-spacing:0; background:#fff; }
.gradebook-matrix th,.gradebook-matrix td { height:42px; border-right:1px solid #444; border-bottom:1px solid #444; padding:5px 7px; text-align:center; }
.gradebook-matrix thead th { position:sticky; top:0; z-index:2; min-width:106px; background:#eef1f4; color:#111; font-family:Arial,sans-serif; font-size:10px; }
.gradebook-matrix thead th:nth-child(-n+5) { min-width:58px; }
.gradebook-matrix thead th:nth-child(4) { min-width:230px; }
.gradebook-matrix .gradebook-student-column { position:sticky; left:0; z-index:3; min-width:230px; max-width:230px; background:#fff; text-align:left; }
.gradebook-matrix .gradebook-student-column strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gradebook-matrix .gradebook-student-column small { color:#8290a0; }
.gradebook-matrix-heading { width:100%; border:0; background:transparent; color:inherit; cursor:pointer; }
.gradebook-matrix-heading strong,.gradebook-matrix-heading small { display:block; max-width:132px; margin:auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gradebook-matrix-heading small { margin-top:3px; color:#738296; font-size:9px; }
.gradebook-matrix-score { width:78px; height:36px; border:1px solid #c7d4e1; border-radius:4px; background:#fff; color:#173a5d; text-align:center; font-size:15px; font-weight:800; }
.gradebook-matrix-score:focus { border-color:#1769d2; outline:3px solid rgba(23,105,210,.13); }
.gradebook-matrix-score:disabled { border-color:transparent; background:#f0f3f6; color:#667587; }
.gradebook-matrix-average { min-width:82px; background:#f4f7fa; font-weight:800; }
.mobile-gradebook-editor { display:grid; gap:12px; }
.mobile-gradebook-assessment { display:grid; gap:6px; padding:12px; border:1px solid #cbdbea; border-radius:6px; background:#f5f9fd; color:#36516d; font-size:12px; font-weight:800; }
.mobile-gradebook-assessment select { width:100%; min-height:46px; border:1px solid #b9c9d9; background:#fff; padding:8px 10px; font-size:14px; font-weight:700; }
.mobile-gradebook-assessment small { color:#718094; font-weight:600; }
.mobile-gradebook-list { display:grid; gap:7px; }
.mobile-gradebook-student { min-height:68px; display:grid; grid-template-columns:32px minmax(0,1fr) 76px; align-items:center; gap:9px; border:1px solid #d8e2ec; border-radius:6px; background:#fff; padding:9px 10px; }
.mobile-gradebook-student>b { width:29px; height:29px; display:grid; place-items:center; border-radius:50%; background:#edf4fb; color:#1769c2; font-size:12px; }
.mobile-gradebook-student>span { min-width:0; display:grid; gap:3px; }
.mobile-gradebook-student strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#1c334c; font-size:14px; }
.mobile-gradebook-student small { color:#7a8999; font-size:11px; }
.mobile-gradebook-student input { width:76px; height:46px; border:1px solid #b8c8d8; border-radius:6px; text-align:center; color:#123d68; font-size:18px; font-weight:800; }
.mobile-gradebook-student input:focus { border-color:#1769c2; outline:3px solid rgba(23,105,194,.14); }
.mobile-gradebook-actions { position:sticky; bottom:76px; z-index:6; display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:10px; border:1px solid #d5e0ea; background:rgba(255,255,255,.97); box-shadow:0 -6px 18px rgba(20,50,80,.1); }
.mobile-gradebook-actions button { width:100%; min-width:0; }
.mobile-gradebook-empty { padding:22px 14px; border:1px dashed #b8c8d8; background:#f8fafc; color:#617387; text-align:center; }
html.embedded-android .mobile-gradebook-actions { bottom:8px; }
.gradebook-empty-column { min-width:220px; padding:28px !important; color:#708094; text-align:left !important; }
.gradebook-assessment-list { display:grid; border:1px solid #dce4ed; border-radius:6px; overflow:hidden; }
.gradebook-assessment-row { display:grid; grid-template-columns:minmax(0,1fr) 120px 80px; align-items:center; gap:12px; border:0; border-bottom:1px solid #e3e9f0; background:#fff; padding:13px 15px; text-align:left; }
.gradebook-assessment-row:last-child { border-bottom:0; }
.gradebook-assessment-row:hover,.gradebook-assessment-row.active { background:#f1f7ff; }
.gradebook-assessment-row span:first-child { display:grid; gap:3px; }
.gradebook-assessment-row small { color:#718094; }
.gradebook-assessment-row > b { color:#315271; font-size:12px; text-align:right; }
.gradebook-status { justify-self:start; border-radius:4px; padding:5px 8px; background:#eef2f6; color:#506174; font-size:11px; font-weight:800; }
.gradebook-status.submitted { background:#fff2d8; color:#9b6100; }.gradebook-status.published { background:#e2f6e9; color:#14733a; }
.gradebook-status.archived { background:#e2e8f0; color:#475569; }
.gradebook-workspace-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:12px; }
.gradebook-workspace-heading h2,.gradebook-workspace-heading p { margin:0; }.gradebook-workspace-heading p:last-child{margin-top:4px;color:#687b90;font-size:12px}
.gradebook-kktp { flex:0 0 74px; display:grid; place-items:center; min-height:66px; border:1px solid #b8d3ef; border-radius:6px; background:#f0f7ff; color:#1559a1; }
.gradebook-kktp small { font-size:10px; font-weight:800; }.gradebook-kktp strong{font-size:24px}
.gradebook-autosave-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; padding:8px 10px; border-left:3px solid #1c8b56; background:#f3fbf6; color:#426151; font-size:12px; }
.gradebook-autosave-bar [data-tone="warning"] { color:#9a6300; }.gradebook-autosave-bar [data-tone="success"]{color:#087b47}
.gradebook-export-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.gradebook-score-table { width:100%; border:1px solid #dce4ed; border-radius:6px; overflow:hidden; }
.gradebook-score-head,.gradebook-score-row { display:grid; grid-template-columns:minmax(230px,1.4fr) 90px 100px minmax(180px,1fr); gap:8px; align-items:center; padding:9px 12px; }
.gradebook-score-head { background:#eef4fa; color:#38526e; font-size:11px; font-weight:800; text-transform:uppercase; }
.gradebook-score-row { border-top:1px solid #e6ebf1; }
.gradebook-score-row > span { display:grid; grid-template-columns:26px 1fr; align-items:center; }
.gradebook-score-row > span b { grid-row:1/3; color:#718094; }.gradebook-score-row > span small { color:#7d8998; }
.gradebook-score-row input { min-width:0; height:38px; border:1px solid #cfdae5; border-radius:4px; padding:7px 9px; }
.gradebook-actions { display:flex; align-items:center; justify-content:flex-end; gap:9px; margin-top:14px; }
.gradebook-autosave-help { margin-right:auto; color:#63768b; font-size:12px; }
.gradebook-lock-note { color:#64758a; font-size:13px; }
.gradebook-official-preview { margin-top:22px; overflow-x:auto; border:1px solid #cfd7df; background:#eef1f4; padding:18px; }
.gradebook-official-sheet { min-width:960px; padding:24px 28px; background:#fff; color:#111; font-family:Georgia,"Times New Roman",serif; }
.gradebook-official-table { width:100%; border-collapse:collapse; font-size:9px; }
.gradebook-official-table th,.gradebook-official-table td { height:25px; border:1px solid #333; padding:3px 5px; text-align:center; }
.gradebook-official-table th { background:#f2f4f6; font-family:Arial,sans-serif; }.gradebook-official-table td:nth-child(3),.gradebook-official-table td:last-child{text-align:left}

.table-scroll { width:100%; overflow-x:auto; }
.teacher-data-table { width:100%; min-width:720px; border-collapse:collapse; }
.teacher-data-table th,.teacher-data-table td { border-bottom:1px solid #dce4ed; padding:10px 8px; text-align:left; vertical-align:middle; }
.teacher-data-table th { background:#f5f8fb; color:#3d5268; font-size:12px; }
.teacher-data-table td select,.teacher-data-table td input { width:100%; min-height:40px; border:1px solid #cdd8e4; border-radius:6px; padding:7px; background:#fff; }
.gradebook-official-footer { display:grid; grid-template-columns:1fr 260px; gap:30px; margin-top:18px; font-size:10px; }
.gradebook-official-footer div { display:grid; gap:3px; }.gradebook-official-footer i{height:38px}
@media(max-width:1050px){.gradebook-create-form{grid-template-columns:1fr 1fr 1fr}.gradebook-create-form button{min-height:42px}.gradebook-column-form{grid-template-columns:1fr 1fr}.gradebook-column-actions{grid-column:1/-1;justify-content:flex-end}}
@media(max-width:1440px){.teacher-app{grid-template-columns:190px minmax(0,1fr)}.teacher-sidebar{padding:12px 8px}.teacher-sidebar .teacher-brand{padding-inline:5px}.teacher-nav-group>summary{padding:6px;font-size:11px}.nav-item.nav-subitem{padding-left:29px;font-size:11px}.teacher-topbar{min-height:60px;padding:8px 16px}.teacher-content{padding:18px}.page-heading{margin-bottom:16px}.page-heading h1{font-size:23px}.work-section{padding:16px}.gradebook-matrix-toolbar{grid-template-columns:minmax(150px,.8fr) minmax(180px,1fr) auto}}
@media(max-width:760px){.gradebook-create-form{grid-template-columns:1fr 1fr}.gradebook-title-field{grid-column:1/-1}.gradebook-workspace-heading{align-items:flex-start}.gradebook-autosave-bar{align-items:stretch;flex-direction:column}.gradebook-export-actions{display:grid;grid-template-columns:1fr 1fr}.gradebook-score-head,.gradebook-score-row{grid-template-columns:minmax(0,1fr) 86px}.gradebook-score-head span:nth-child(n+3){display:none}.gradebook-score-row>span{grid-row:1/3}.gradebook-score-row [data-score]{grid-column:2;grid-row:1}.gradebook-score-row [data-remedial]{grid-column:2;grid-row:2}.gradebook-score-row [data-note]{grid-column:1/-1;grid-row:3}.gradebook-actions{align-items:stretch;flex-direction:column}.gradebook-actions button{width:100%}.gradebook-autosave-help{margin:0}.gradebook-official-preview,.mentoring-report-preview{padding:8px}.homeroom-monitoring-meta,.homeroom-notes-grid{grid-template-columns:1fr}.homeroom-notes-grid label:last-child{grid-column:auto}.homeroom-actions{display:grid;grid-template-columns:1fr}.homeroom-actions button{width:100%}.homeroom-table-head,.homeroom-table-row{min-width:820px}}
@media (max-width: 760px) {
  .teacher-content .mentoring-overview { grid-template-columns: 50px minmax(0, 1fr) 58px; }
  .mentoring-work-menu { grid-template-columns: 1fr; }
  .mentoring-work-card { min-height: 70px; }
  .homeroom-page-heading { grid-template-columns: 42px minmax(0, 1fr); }
  .homeroom-page-badge { grid-column: 2; justify-self: start; }
  .homeroom-attendance-panel { padding: 12px; }
  .homeroom-section-heading { grid-template-columns: 38px minmax(0, 1fr); }
  .homeroom-section-heading > strong { grid-column: 2; font-size: 24px; }
  .homeroom-attendance-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .homeroom-attendance-summary > span:last-child { grid-column: 1 / -1; }
}
@media(max-width:440px){.gradebook-create-form{grid-template-columns:1fr}.teacher-mobile-nav button{font-size:9px}}
@media(max-width:680px){.gradebook-matrix-toolbar{grid-template-columns:1fr 1fr}.gradebook-matrix-toolbar button{grid-column:1/-1}.gradebook-column-form{grid-template-columns:1fr}.gradebook-column-actions{grid-column:auto;display:grid;grid-template-columns:1fr 1fr}.gradebook-matrix .gradebook-student-column{min-width:190px;max-width:190px}.gradebook-matrix thead th{min-width:110px}.gradebook-matrix-score{width:70px}}
@media (max-width: 440px) {
  .teacher-login-screen { padding: 12px; }
  .teacher-login-panel { padding: 24px 20px; }
  .quick-grid { grid-template-columns: 1fr; }
  .daily-task-row { grid-template-columns: 1fr; }
  .daily-task-row > button { width: 100%; }
  .attendance-summary { grid-template-columns: 1fr 1fr; }
  .student-attendance-row, .student-attendance-row.class-attendance-statuses { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .member-row, .permission-row { grid-template-columns: 1fr auto; }
  .journal-lesson-header { align-items: stretch; flex-direction: column; }
  .journal-form-grid { grid-template-columns: 1fr; }
  .journal-form-grid label.wide { grid-column: auto; }
  .member-row > :nth-child(2), .permission-row > :nth-child(2) { display: none; }
}
/* Asesmen fleksibel */
.assessment-create-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; align-items:end; }
.assessment-create-grid label,.question-editor-grid label,.assessment-result-row label { display:grid; gap:6px; }
.assessment-create-grid label span,.question-editor-grid label span,.assessment-result-row label span { color:#64748b; font-size:.78rem; font-weight:700; }
.assessment-create-grid input,.assessment-create-grid select,.question-editor input,.question-editor select,.question-editor textarea,.assessment-result-row input { width:100%; min-height:44px; border:1px solid #cbd5e1; border-radius:6px; padding:10px 12px; background:#fff; color:#16263d; }
.assessment-create-grid .wide-field,.question-editor-grid .wide-field { grid-column:span 2; }
.assessment-target-field { margin:0; padding:10px 12px; border:1px solid #cbd5e1; border-radius:8px; }
.assessment-target-field legend { padding:0 5px; color:#64748b; font-size:.78rem; font-weight:700; }
.assessment-class-checklist { display:flex; flex-wrap:wrap; gap:8px; }
.assessment-class-checklist label { display:flex; grid-template-columns:auto 1fr; align-items:center; gap:7px; padding:7px 10px; border:1px solid #cbd5e1; border-radius:999px; background:#fff; cursor:pointer; }
.assessment-class-checklist input { width:16px; min-height:16px; margin:0; }
.assessment-target-preview { align-self:stretch; padding:11px 13px; border:1px solid #bfdbfe; border-radius:8px; background:#eff6ff; color:#1e3a5f; line-height:1.45; }
.assessment-publish-targets { display:grid; gap:12px; margin-bottom:16px; padding:14px; border:1px solid #a7d5bc; border-radius:8px; background:#f2fbf6; }
.assessment-publish-target-controls { display:grid; grid-template-columns:minmax(180px,260px) 1fr; gap:12px; align-items:end; }
.assessment-publish-target-controls>label { display:grid; gap:6px; }
.assessment-publish-target-controls select { min-height:44px; border:1px solid #cbd5e1; border-radius:6px; padding:10px 12px; background:#fff; }
.assessment-create-button { min-height:44px; justify-content:center; }
.assessment-layout { display:grid; grid-template-columns:minmax(280px,34%) minmax(0,1fr); gap:18px; align-items:start; }
.assessment-list-panel,.assessment-workspace { margin:0; }
.assessment-workspace-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:18px; }
.assessment-workspace-heading h2 { margin:2px 0 5px; }
.assessment-import-panel { display:grid; gap:12px; margin-bottom:16px; padding:14px; border:1px solid #bfd3e8; border-radius:8px; background:#f4f8fc; }
.assessment-settings-panel { display:grid; gap:14px; margin-bottom:16px; padding:16px; border:1px solid #cbd5e1; border-radius:8px; background:#f8fafc; }
.assessment-settings-panel .section-heading { margin:0; }
.assessment-edit-lock { display:inline-flex; align-items:center; gap:6px; color:#92400e; font-weight:700; }
.assessment-direct-import { display:grid; gap:12px; margin-top:18px; padding:15px; border:1px solid #b9dccd; border-left:4px solid #12835f; border-radius:8px; background:#f4fbf8; }
.assessment-direct-import>div:first-child { display:flex; align-items:center; gap:11px; }
.assessment-direct-import>div:first-child>span:last-child { display:grid; gap:3px; }
.assessment-direct-import small { color:#64748b; }
.assessment-direct-icon { width:40px; height:40px; display:grid; place-items:center; flex:0 0 auto; border-radius:8px; background:#dff4ea; color:#12835f; }
.assessment-direct-icon svg { width:22px; height:22px; }
.assessment-import-panel>div:first-child { display:grid; gap:3px; }.assessment-import-panel small { color:#64748b; }
.assessment-import-actions { display:flex; flex-wrap:wrap; gap:9px; align-items:center; }
.assessment-import-actions a { text-decoration:none; }
.assessment-file-picker { display:inline-flex; align-items:center; gap:7px; min-height:42px; border:1px solid #9fb5cc; border-radius:6px; padding:9px 13px; background:#fff; color:#173b63; font-weight:750; cursor:pointer; }
.assessment-file-picker input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.assessment-media-reminder { display:flex; align-items:center; gap:8px; color:#8a5300; text-align:left; }
.question-editor-list { display:grid; gap:14px; }
.question-editor { border:1px solid #d8e1ec; border-radius:8px; padding:16px; background:#f8fafc; }
.question-editor>header { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.question-editor-grid { display:grid; grid-template-columns:2fr 1fr; gap:12px; }
.question-media-editor { display:grid; grid-template-columns:minmax(220px,1fr) minmax(240px,1.4fr); gap:12px; align-items:start; }
.question-media-preview { min-height:64px; display:grid; place-items:center; border:1px dashed #b8c7d9; border-radius:7px; padding:10px; background:#fff; color:#64748b; }
.question-media-preview img,.question-media-preview video { display:block; max-width:100%; max-height:220px; border-radius:6px; }.question-media-preview audio { width:100%; }.question-media-preview a { color:#155eb7; font-weight:700; }
.question-key { display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid #d8e1ec; border-radius:7px; background:#fff; }.question-key>span,.question-key legend { color:#52667d; font-size:.8rem; font-weight:800; }.question-key select { max-width:110px; }
fieldset.question-key { flex-wrap:wrap; }.question-key label { display:flex; grid-template-columns:auto auto; align-items:center; gap:5px; }.question-key label input { width:18px; min-height:18px; }
.structured-question-editor { display:grid; gap:10px; padding:12px; border:1px solid #cbd9e8; border-radius:7px; background:#fff; }.structured-question-editor>div:first-child { display:flex; justify-content:space-between; gap:12px; }.structured-question-editor small { color:#64748b; }
.structured-question-list { display:grid; gap:8px; }.structured-question-row { display:grid; grid-template-columns:minmax(0,1fr) 170px 40px; gap:8px; align-items:center; }.structured-question-row button { width:40px; height:40px; }
.compact-command { width:max-content; min-height:38px; padding:8px 12px; }
.question-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.assessment-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; padding-top:16px; border-top:1px solid #e2e8f0; }
.success-command { display:inline-flex; align-items:center; gap:7px; min-height:42px; border:0; border-radius:6px; padding:10px 16px; background:#16875b; color:#fff; font-weight:750; }
.assessment-results { margin-top:22px; border-top:1px solid #e2e8f0; padding-top:18px; }
.assessment-roster-filters { display:flex; gap:0; margin:14px 0; overflow-x:auto; border:1px solid #cbd5e1; border-radius:6px; width:max-content; max-width:100%; background:#fff; }
.assessment-live-indicator { display:inline-flex; align-items:center; gap:6px; color:#087f5b; font-size:.75rem; font-weight:800; }.assessment-live-indicator svg { width:16px; }
.assessment-roster-filters button { display:flex; align-items:center; gap:8px; min-height:42px; border:0; border-right:1px solid #e2e8f0; padding:8px 13px; background:#fff; color:#52667d; white-space:nowrap; font-weight:750; }
.assessment-roster-filters button:last-child { border-right:0; }.assessment-roster-filters button.active { background:#0f5fba; color:#fff; }.assessment-roster-filters button b { display:grid; place-items:center; min-width:24px; height:24px; border-radius:50%; background:#e8eef5; color:#26394f; font-size:.76rem; }.assessment-roster-filters button.active b { background:#fff; color:#0f5fba; }
.assessment-roster-class { margin-top:14px; border:1px solid #d8e1ec; border-radius:7px; overflow:hidden; background:#fff; }.assessment-roster-class>header { display:flex; justify-content:space-between; align-items:center; min-height:44px; padding:9px 13px; background:#eef3f8; color:#1c3f67; }.assessment-roster-class>header span { display:flex; align-items:center; gap:8px; }.assessment-roster-class>header svg { width:18px; }.assessment-roster-class>header small { color:#64748b; }
.assessment-roster-list { display:grid; }.assessment-roster-item { border-bottom:1px solid #e7edf3; }.assessment-roster-item:last-child { border-bottom:0; }
.assessment-roster-row { display:grid; grid-template-columns:38px minmax(180px,1fr) minmax(145px,auto) auto; gap:10px; align-items:center; min-height:58px; padding:8px 12px; }.assessment-roster-number { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#edf3fa; color:#155eb7; font-size:.78rem; font-weight:850; }.assessment-roster-name { color:#26394f; }.assessment-roster-state { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }.assessment-roster-status { width:max-content; padding:5px 8px; border-radius:999px; background:#edf1f5; color:#536478; font-size:.72rem; font-weight:800; }.assessment-roster-status.not_started { background:#f1f5f9; color:#64748b; }.assessment-roster-status.in_progress { background:#e8f1ff; color:#155eb7; }.assessment-roster-status.waiting_exit { background:#fff1d8; color:#985700; }.assessment-roster-status.finished { background:#e8f6ee; color:#087f5b; }.assessment-roster-violation { display:inline-flex; align-items:center; gap:4px; width:max-content; padding:5px 8px; border-radius:999px; background:#fee2e2; color:#b42318; font-size:.72rem; font-weight:850; }.assessment-roster-violation svg { width:14px; height:14px; }
.assessment-roster-actions { display:flex; justify-content:flex-end; gap:7px; flex-wrap:wrap; }.assessment-roster-actions .compact-command { min-height:36px; padding:7px 10px; font-size:.76rem; }
.assessment-action-control { display:grid; justify-items:start; gap:3px; }.assessment-action-status { min-height:14px; max-width:150px; color:#9a5b00; font-size:.68rem; line-height:1.2; }.assessment-action-control button[aria-busy="true"] { opacity:.72; cursor:wait; }
.assessment-roster-detail { display:grid; grid-template-columns:minmax(210px,.8fr) minmax(240px,1.2fr); gap:12px; padding:12px 58px 15px; background:#f8fafc; border-top:1px solid #e7edf3; }.assessment-roster-detail[hidden] { display:none; }.assessment-roster-detail .assessment-essay-review,.assessment-roster-detail .assessment-roster-grade { grid-column:1/-1; }.assessment-objective-score,.assessment-roster-score { display:flex; justify-content:space-between; align-items:center; margin:0; padding:10px 12px; border:1px solid #d8e1ec; border-radius:6px; background:#fff; color:#52667d; }.assessment-objective-score strong,.assessment-roster-score strong { color:#0f5fba; font-size:1.05rem; }.assessment-roster-grade { display:grid; grid-template-columns:180px minmax(220px,1fr) auto; gap:10px; align-items:end; }.assessment-roster-grade label { display:grid; gap:6px; }.assessment-roster-grade label span { color:#64748b; font-size:.78rem; font-weight:700; }.assessment-roster-grade input { width:100%; min-height:42px; border:1px solid #cbd5e1; border-radius:6px; padding:9px 11px; background:#fff; }
.assessment-result-row { display:grid; grid-template-columns:minmax(180px,1fr) 110px minmax(150px,1fr) auto; gap:10px; align-items:end; padding:12px 0; border-bottom:1px solid #e2e8f0; }
.assessment-result-row>span { display:grid; gap:4px; }
.assessment-result-row small { color:#64748b; }
.assessment-result-row>b { color:#0f5fba; font-size:1.15rem; align-self:center; }
.assessment-monitor-summary { display:grid; gap:3px; padding:9px 10px; border:1px solid #b8ddce; border-radius:7px; background:#f0faf5; }.assessment-monitor-summary.review { border-color:#efc378; background:#fff8e9; color:#885100; }.assessment-monitor-summary small { color:#64748b; }
.assessment-monitor-details { grid-column:1/-1; margin-top:4px; }.assessment-monitor-details summary { cursor:pointer; color:#155eb7; font-size:.78rem; font-weight:750; }.assessment-monitor-details>div { display:grid; gap:5px; margin-top:7px; }.assessment-monitor-details span { display:flex; justify-content:space-between; gap:10px; padding-top:5px; border-top:1px solid rgba(100,116,139,.18); font-size:.76rem; }
.assessment-essay-review { grid-column:1/-1; display:grid; gap:8px; padding:10px; border-left:3px solid #2a72c7; background:#f5f9ff; }
.assessment-essay-review>div { display:grid; gap:4px; }.assessment-essay-review p { margin:0; white-space:pre-wrap; color:#334155; }
.assessment-essay-answer { padding:12px; border:1px solid #d7e3f0; border-radius:6px; background:#fff; }.assessment-essay-answer p { padding:10px 0; border-bottom:1px solid #e3eaf2; }.assessment-essay-question-score { display:grid; grid-template-columns:minmax(0,1fr) 96px auto; align-items:center; gap:9px; margin-top:4px; color:#24415f; font-weight:800; }.assessment-essay-question-score input { width:96px; min-height:40px; border:1px solid #9eb8d5; border-radius:5px; padding:7px 9px; background:#fff; text-align:center; font:inherit; }.assessment-essay-question-score small { color:#6b7d90; font-weight:600; }.assessment-essay-total { align-self:center; padding:10px 12px; border:1px solid #b9d7c8; border-radius:6px; background:#eef9f3; color:#087653; font-size:.8rem; font-weight:850; }
.assessment-essay-save-status { grid-column:1/-1; min-height:18px; color:#087653; font-size:.78rem; font-weight:750; }
@media (max-width:1000px) { .assessment-create-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .assessment-layout { grid-template-columns:1fr; } }
@media (max-width:640px) { .assessment-create-grid,.question-editor-grid,.question-options,.question-media-editor,.assessment-publish-target-controls { grid-template-columns:1fr; } .assessment-create-grid .wide-field,.question-editor-grid .wide-field { grid-column:auto; } .assessment-result-row { grid-template-columns:1fr; }.structured-question-row { grid-template-columns:1fr 110px 40px; } .assessment-import-actions>* { width:100%; justify-content:center; } .assessment-roster-row { grid-template-columns:32px minmax(0,1fr) auto; }.assessment-roster-state { grid-column:2/-1; }.assessment-roster-actions { grid-column:2/-1; justify-content:flex-start; }.assessment-roster-detail { grid-template-columns:1fr; padding:12px; }.assessment-roster-grade { grid-template-columns:1fr; }.assessment-essay-question-score { grid-template-columns:minmax(0,1fr) 82px; }.assessment-essay-question-score input { width:82px; }.assessment-essay-question-score small { grid-column:2; } }
.exam-supervision-filter{display:flex;align-items:end;gap:20px}.exam-supervision-filter label{display:grid;gap:6px;min-width:190px;color:#52677e;font-size:12px;font-weight:800}.exam-supervision-filter input{min-height:42px;border:1px solid #cad7e4;border-radius:5px;padding:8px 10px}.exam-supervision-filter div{display:grid;gap:3px}.exam-supervision-filter small{color:#718196}.exam-supervision-list{display:grid;gap:14px;margin-top:14px}.exam-supervision-card{border:1px solid #d5e0eb;border-radius:7px;background:#fff;padding:16px;box-shadow:0 4px 12px rgba(20,55,90,.05)}.exam-supervision-card>header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px}.exam-supervision-card h2{margin:0;color:#173b64;font-size:18px}.exam-supervision-card header p{margin:4px 0 0;color:#718196;font-size:12px}.exam-supervision-session{display:grid;place-items:center;min-width:62px;min-height:48px;border-radius:6px;background:#e7f0fb;color:#135a9f;font-weight:900}.exam-supervision-status{padding:7px 10px;border-radius:999px;background:#edf1f5;color:#536478;font-size:11px}.exam-supervision-status.running{background:#e6f6ee;color:#087f5b}.exam-supervision-status.finished{background:#e7f0fb;color:#135a9f}.exam-supervision-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:15px 0}.exam-supervision-metrics span{display:grid;gap:2px;padding:10px;background:#f7f9fb;border-radius:5px}.exam-supervision-metrics strong{color:#173b64;font-size:20px}.exam-supervision-metrics small{color:#718196}.exam-supervision-metrics .review{background:#fff3e2}.exam-supervision-metrics .review strong{color:#a85b00}.exam-supervision-actions{display:flex;gap:8px;flex-wrap:wrap}.exam-roster,.exam-report-form{margin-top:14px;padding-top:14px;border-top:1px solid #e2e9f0}.exam-roster-head,.exam-roster-row{display:grid;grid-template-columns:minmax(180px,1fr) 110px 130px;gap:10px;align-items:center;padding:9px 10px}.exam-roster-head{background:#eef3f8;color:#536478;font-size:11px;font-weight:900}.exam-roster-row{border-bottom:1px solid #edf1f5}.exam-roster-row>span:first-child{display:grid;gap:2px}.exam-roster-row small{color:#7b8999}.exam-roster-row b{font-size:11px;color:#697a8d}.exam-roster-row b.active{color:#087f5b}.exam-roster-row b.submitted{color:#135a9f}.exam-monitor-state{font-size:11px;color:#087f5b}.exam-monitor-state.review{color:#b45309;font-weight:800}.exam-report-form{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.exam-report-form label{display:grid;gap:5px;color:#536478;font-size:11px;font-weight:800}.exam-report-form label.wide{grid-column:1/-1}.exam-report-form input,.exam-report-form textarea{width:100%;border:1px solid #cad7e4;border-radius:5px;padding:9px 10px}.exam-report-form .form-status{align-self:center;margin:0}@media(max-width:700px){.exam-supervision-filter{align-items:stretch;flex-direction:column}.exam-supervision-filter label{min-width:0}.exam-supervision-card>header{grid-template-columns:auto 1fr}.exam-supervision-status{grid-column:1/-1;width:max-content}.exam-supervision-metrics{grid-template-columns:1fr 1fr}.exam-supervision-actions{display:grid;grid-template-columns:1fr}.exam-supervision-actions button{width:100%}.exam-roster{overflow-x:auto}.exam-roster-head,.exam-roster-row{min-width:560px}.exam-report-form{grid-template-columns:1fr}.exam-report-form label.wide{grid-column:auto}}
.seven-kaih-toolbar{display:flex;align-items:end;gap:10px;margin-bottom:16px}.seven-kaih-toolbar label{display:grid;gap:6px}.seven-kaih-toolbar input,.seven-kaih-toolbar select{min-height:42px;border:1px solid #ccd8e4;border-radius:6px;padding:0 10px;background:#fff}.seven-kaih-summary{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #d9e3ed;background:#fff;border-radius:8px;margin-bottom:14px}.seven-kaih-summary div{padding:14px;text-align:center;border-right:1px solid #e1e8ef}.seven-kaih-summary div:last-child{border-right:0}.seven-kaih-summary strong,.seven-kaih-summary span{display:block}.seven-kaih-summary strong{font-size:24px;color:#0b559f}.seven-kaih-summary span{font-size:12px;color:#6d7d8e}.seven-kaih-validation-list{display:grid;gap:7px}.seven-kaih-student{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border:1px solid #dce5ed;border-radius:7px;background:#fff}.seven-kaih-student small{display:block;color:#758394;margin-top:3px}.seven-kaih-student.validated{border-left:4px solid #16a36a}.seven-kaih-student.rejected{border-left:4px solid #e49a16}.seven-kaih-row-actions{display:flex;gap:6px;margin-top:10px}.seven-kaih-row-actions button{border:1px solid #1968ba;background:#fff;color:#145b9f;border-radius:5px;padding:8px 10px;font-weight:700}@media(max-width:680px){.seven-kaih-student{grid-template-columns:30px minmax(0,1fr) auto}.seven-kaih-row-actions button{flex:1}.seven-kaih-summary strong{font-size:20px}}
.seven-kaih-entry-details{grid-column:2/4;width:100%;border-top:1px solid #e2e9ef;padding-top:9px}.seven-kaih-entry-details summary{cursor:pointer;color:#145b9f;font-size:12px;font-weight:800}.seven-kaih-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}.seven-kaih-detail-grid p{margin:0;padding:8px;background:#f5f8fb;border-radius:5px}.seven-kaih-detail-grid b,.seven-kaih-detail-grid span{display:block;font-size:11px}.seven-kaih-detail-grid span{margin-top:3px;color:#607286}.seven-kaih-evidence{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}.seven-kaih-evidence a{display:grid;grid-template-columns:40px auto;align-items:center;gap:7px;color:#145b9f;font-size:11px;font-weight:800;text-decoration:none}.seven-kaih-evidence img{width:40px;height:40px;border-radius:5px;object-fit:cover}@media(max-width:680px){.seven-kaih-entry-details{grid-column:2/4}.seven-kaih-detail-grid{grid-template-columns:1fr 1fr}}
.seven-kaih-item-table{overflow-x:auto;margin-top:10px;padding-bottom:6px}.seven-kaih-seven-columns{display:grid;grid-template-columns:repeat(7,minmax(185px,1fr));gap:10px;min-width:1370px}.seven-kaih-habit-column{display:grid;align-content:start;gap:8px;padding:10px;border:1px solid #d8e4ef;border-radius:8px;background:#f8fbff}.seven-kaih-habit-column h4{margin:0 0 2px;color:#15385f;font-size:13px}.seven-kaih-item-row{display:grid;grid-template-columns:1fr 70px;gap:7px;align-items:end;padding:9px;border:1px solid #dce6ef;border-radius:7px;background:#fff}.seven-kaih-item-row.incomplete{background:#fff8f0;border-color:#f1d4a8}.seven-kaih-item-main{grid-column:1/-1}.seven-kaih-item-main strong,.seven-kaih-item-main span,.seven-kaih-item-row label span{display:block}.seven-kaih-item-main strong{font-size:12px;color:#14253a}.seven-kaih-item-main span{font-size:11px;color:#68788a;margin-top:3px}.seven-kaih-item-row label span{font-size:10px;text-transform:uppercase;letter-spacing:.02em;color:#7b8895;margin-bottom:4px}.seven-kaih-item-row label:first-of-type{grid-column:1/-1}.seven-kaih-item-row label:nth-of-type(3){grid-column:1/-1}.seven-kaih-item-row select,.seven-kaih-item-row input{width:100%;min-height:34px;border:1px solid #ccd8e4;border-radius:5px;background:#fff;padding:0 8px;font:inherit;font-size:12px}.seven-kaih-item-row button{min-height:34px;border:1px solid #0b559f;border-radius:5px;background:#0b559f;color:#fff;font-weight:800}.seven-kaih-mini-evidence{display:block;width:max-content;max-width:100%;margin-top:8px;color:#145b9f;font-size:11px;font-weight:800;text-decoration:none}.seven-kaih-mini-evidence img{display:block;width:96px;height:96px;border-radius:7px;object-fit:cover;border:1px solid #d1dde9;background:#fff}.seven-kaih-mini-evidence span{display:block;margin-top:3px;color:#145b9f}.seven-kaih-period-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:7px;margin:10px 0}.seven-kaih-period-summary span{border:1px solid #dce6ef;border-radius:6px;background:#fbfdff;padding:8px}.seven-kaih-period-summary b,.seven-kaih-period-summary em,.seven-kaih-period-summary strong{display:block}.seven-kaih-period-summary b{font-size:12px}.seven-kaih-period-summary em{font-size:10px;color:#778699;font-style:normal}.seven-kaih-period-summary strong{font-size:18px;color:#0b559f;margin-top:2px}.seven-kaih-period-table{width:100%;border-collapse:collapse;margin-top:8px;background:#fff}.seven-kaih-period-table th,.seven-kaih-period-table td{border:1px solid #dce6ef;padding:7px;text-align:left;font-size:12px}.seven-kaih-period-table th{background:#f3f7fb;color:#1b2b40}@media(max-width:680px){.seven-kaih-toolbar{display:grid;grid-template-columns:1fr}.seven-kaih-seven-columns{min-width:1260px;grid-template-columns:repeat(7,180px)}.seven-kaih-mini-evidence img{width:88px;height:88px}}

.self-attendance-card { display: grid; gap: 14px; }
.self-attendance-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.self-attendance-header strong { display: block; color: #142a43; font-size: 19px; }
.self-attendance-status { padding: 5px 12px; border-radius: 999px; background: #e8f0fb; color: #155eb7; font-size: 12px; font-weight: 750; text-transform: uppercase; }
.self-attendance-status.late { background: #fff4e5; color: #a35700; }
.self-attendance-status.absent { background: #fdecec; color: #b42318; }
.self-attendance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; }
.self-attendance-grid > div { display: grid; gap: 3px; padding: 11px 12px; border: 1px solid #d8e1eb; border-radius: 7px; background: #f7fafd; }
.self-attendance-grid span { color: #64758a; font-size: 12px; }
.self-attendance-grid strong { color: #142a43; font-size: 17px; }
.self-attendance-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.self-attendance-history { display: grid; gap: 6px; }
.self-attendance-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 9px 11px; border: 1px solid #e2e9f1; border-radius: 6px; font-size: 13px; }
.self-attendance-row > span:first-child { color: #142a43; font-weight: 650; }
.self-attendance-tag { padding: 3px 9px; border-radius: 999px; background: #e8f0fb; color: #155eb7; font-size: 11px; font-weight: 750; }
.self-attendance-tag.late { background: #fff4e5; color: #a35700; }
.self-attendance-tag.absent { background: #fdecec; color: #b42318; }
@media (max-width: 640px) { .self-attendance-row { grid-template-columns: minmax(0, 1fr) auto; } }

.self-leave-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; align-items: end; }
.self-leave-form label { display: grid; gap: 4px; }
.self-leave-form label > span { color: #64758a; font-size: 12px; }
.self-leave-form input, .self-leave-form select { min-height: 40px; padding: 8px 10px; border: 1px solid #bdcad8; border-radius: 5px; background: #fff; color: #142a43; font-size: 13px; }
.self-leave-reason { grid-column: 1 / -1; }
.self-leave-status { min-height: 20px; margin: 10px 0 0; color: #64758a; font-size: 12px; }
.self-leave-status.success { color: #087f5b; }
.self-leave-status.error { color: #b42318; }
.status-chip { display: inline-block; padding: 3px 9px; border-radius: 999px; background: #fff4e5; color: #a35700; font-size: 11px; font-weight: 750; white-space: nowrap; }
.status-chip.approved { background: #e7f7ef; color: #087f5b; }
.status-chip.rejected { background: #fdecec; color: #b42318; }
.status-chip.pending { background: #fff4e5; color: #a35700; }
.self-attendance-status.leave { background: #eef2ff; color: #4338ca; }
.self-attendance-tag.leave { background: #eef2ff; color: #4338ca; }
@media (max-width: 640px) { .self-leave-form { grid-template-columns: 1fr; } }