:root {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif;
  color: #152238;
  background: #f4f7fb;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; background: #f4f7fb; color: #152238; }
a { color: #1558a6; text-decoration: none; }
button, input, select { font: inherit; }
button, .btn { min-height: 40px; }
.app-shell { display: grid; grid-template-columns: 250px minmax(0,1fr); min-height: 100vh; }
.sidebar { background: #102f5b; color: white; padding: 22px 16px; display: flex; flex-direction: column; gap: 24px; }
.brand { display: flex; gap: 12px; align-items: center; }
.brand-mark { width: 44px; height: 44px; border-radius: 12px; background: white; color: #102f5b; display: grid; place-items: center; font-weight: 800; font-size: 22px; }
.brand strong, .brand small { display: block; }
.brand small { opacity: .75; margin-top: 4px; }
.sidebar nav { display: grid; gap: 7px; }
.sidebar nav a { color: white; padding: 11px 13px; border-radius: 9px; opacity: .86; }
.sidebar nav a.active, .sidebar nav a:hover { background: rgba(255,255,255,.13); opacity: 1; }
.sidebar-note { margin-top: auto; font-size: 12px; opacity: .65; line-height: 1.7; }
.content { min-width: 0; padding: 30px; }
.page-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
h1 { margin: 0 0 6px; font-size: 30px; }
h2 { margin: 0 0 16px; font-size: 20px; }
p { margin: 0; line-height: 1.8; color: #607087; }
.panel { background: white; border: 1px solid #dbe4ef; border-radius: 14px; padding: 20px; margin-bottom: 18px; }
.grid-2 { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.stats-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-bottom: 18px; }
.stat { background: white; border: 1px solid #dbe4ef; border-radius: 13px; padding: 17px; }
.stat span { display: block; color: #6f7e91; font-size: 13px; margin-bottom: 6px; }
.stat strong { font-size: 27px; }
.stat.good { border-color: #9fd5bd; background: #f2fbf7; }
.stat.bad { border-color: #e8a5a5; background: #fff6f6; }
.flow-row { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.flow-row div { padding: 14px; background: #f7f9fc; border-radius: 10px; display: flex; gap: 10px; align-items: center; }
.flow-row b { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #e5edf7; }
.flow-row span { font-size: 13px; line-height: 1.5; }
label { display: grid; gap: 6px; font-size: 13px; font-weight: 600; margin-bottom: 12px; }
input, select { width: 100%; min-height: 42px; border: 1px solid #cbd7e6; border-radius: 8px; padding: 8px 10px; background: white; color: #152238; }
input:focus, select:focus { outline: 2px solid #6ea7e7; outline-offset: 1px; }
.form-row { display: grid; grid-template-columns: repeat(auto-fit,minmax(130px,1fr)); gap: 10px; }
.check { display: flex; align-items: center; gap: 8px; }
.check input { width: 18px; min-height: 18px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 14px; border-radius: 8px; border: 1px solid #c8d4e2; background: white; color: #173a67; cursor: pointer; }
.btn:hover { filter: brightness(.98); }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn.primary { background: #1558a6; color: white; border-color: #1558a6; }
.btn.success { background: #19724d; color: white; border-color: #19724d; }
.btn.danger { background: #fff5f5; color: #9b2c2c; border-color: #f0c6c6; }
.btn.small { min-height: 32px; padding: 5px 9px; font-size: 12px; }
.btn.big { min-height: 48px; padding-inline: 22px; font-weight: 700; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; }
.hint { color: #718197; display: block; line-height: 1.6; margin: -3px 0 12px; }
.notice { border-radius: 10px; padding: 12px 15px; margin-bottom: 16px; }
.notice.ok { background: #eef9f4; border: 1px solid #b9e2cf; color: #175a3f; }
.notice.error { background: #fff1f1; border: 1px solid #efc2c2; color: #8b2525; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: right; padding: 11px 10px; border-bottom: 1px solid #e5ebf2; font-size: 13px; vertical-align: middle; }
th { color: #586b83; background: #f7f9fc; font-weight: 700; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { border: 1px solid #cbd8e6; border-radius: 999px; background: #f8fafc; padding: 8px 12px; cursor: pointer; color: #32465f; }
.period-list { display: grid; gap: 8px; }
.period-card { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; border: 1px solid #dce5ef; border-radius: 9px; padding: 11px; }
.period-card.noninstruction { background: #fff8e8; border-color: #ead8a7; }
.engine-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.engine-summary div { padding: 13px; border-inline-start: 3px solid #c5d5e8; }
.engine-summary span, .engine-summary b { display: block; }
.engine-summary span { color: #718197; font-size: 12px; margin-bottom: 5px; }
.engine-summary b { line-height: 1.7; font-size: 13px; }
.result-card { border-radius: 14px; padding: 22px; margin-bottom: 18px; border: 1px solid; }
.result-card.success { background: #f0faf6; border-color: #9fd5bd; }
.result-card.failure { background: #fff5f5; border-color: #e7b0b0; }
.result-stats { display: flex; gap: 20px; margin: 12px 0; }
.errors { line-height: 1.8; }
.toolbar { display: flex; gap: 16px; align-items: end; flex-wrap: wrap; }
.toolbar label { margin: 0; min-width: 180px; }
.selection-info { margin-inline-start: auto; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 12px; color: #64768d; }
.timetable-wrap { overflow-x: auto; background: white; border: 1px solid #dbe4ef; border-radius: 14px; }
.timetable { min-width: 1000px; table-layout: fixed; }
.timetable th, .timetable td { text-align: center; min-width: 125px; height: 92px; border: 1px solid #e4eaf1; padding: 6px; }
.timetable th.sticky { position: sticky; right: 0; z-index: 2; min-width: 85px; background: #f2f6fb; }
.noninstruction-head, .noninstruction-cell { background: #fff8e8 !important; color: #765e23; }
.lesson { width: 100%; height: 100%; min-height: 76px; border: 1px solid #bfd2e7; background: #f1f6fc; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; cursor: pointer; color: #173a67; }
.lesson span { font-size: 11px; color: #526a84; }
.lesson small { font-size: 10px; }
.lesson.selected { outline: 3px solid #2f78c7; background: #e3effc; }
.lesson.locked { border-style: dashed; border-color: #9b7626; }
.empty { color: #bdc6d1; }

@media (max-width: 900px) {
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { position: static; }
  .sidebar nav { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .content { padding: 18px; }
  .grid-2, .stats-grid, .engine-summary, .flow-row { grid-template-columns: 1fr; }
  .page-head { align-items: stretch; flex-direction: column; }
}

/* v0.2 authentication / commercial control */
.public-content { min-height: 100%; padding: 40px 18px; display: grid; place-items: center; }
.login-shell { width: min(440px, 100%); margin: 0 auto; }
.login-card { background: var(--panel, #fff); border: 1px solid var(--border, #d9dee7); border-radius: 18px; padding: 28px; }
.login-brand { margin-bottom: 26px; }
.login-form { display: grid; gap: 14px; }
.login-form .big { width: 100%; justify-content: center; }
.link-button { border: 0; background: transparent; color: inherit; cursor: pointer; padding: 4px 0; text-decoration: underline; font: inherit; }
.actions.wrap { flex-wrap: wrap; }
.auth-message { max-width: 520px; margin: 70px auto; }
.sidebar-note { display: grid; gap: 5px; }

.interactive-form { display: block; }

/* v0.2.8 separated master-data registers */
.action-card { display:block; color:inherit; text-decoration:none; transition:border-color .15s ease, transform .15s ease; }
.action-card:hover { border-color:#9fb7d3; transform:translateY(-1px); }
.action-card p { margin-bottom:0; }
.period-inline-form { display:grid; grid-template-columns:1.4fr .7fr 1fr .9fr .9fr auto; gap:8px; align-items:center; }
.period-inline-form input, .period-inline-form select { min-width:0; width:100%; }
td form { margin:0; }
@media (max-width:900px) { .period-inline-form { grid-template-columns:1fr 1fr; } }

/* v0.3.2 — safe manual timetable editing */
.cell-edit-link{display:block;margin-top:.35rem;font-size:.78rem;text-decoration:none;white-space:nowrap}
.manual-source .result-stats{align-items:stretch}
.conflict-panel.safe{border-inline-start:5px solid #1d7a46}
.conflict-panel.blocked{border-inline-start:5px solid #a92f2f}
.issue-list{display:grid;gap:.55rem;margin:.8rem 0 1rem}
.issue{padding:.7rem .85rem;border-radius:.65rem;border:1px solid var(--border,#d8dde5)}
.issue.error{background:rgba(169,47,47,.08)}
.issue.warning{background:rgba(180,126,0,.09)}
.suggestion-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem}
.suggestion-card{display:flex;flex-direction:column;gap:.3rem;padding:.9rem;border:1px solid var(--border,#d8dde5);border-radius:.75rem;text-decoration:none;color:inherit;background:rgba(127,127,127,.04)}
.suggestion-card:hover{border-color:currentColor}
.manual-apply-form{margin-top:1rem}

/* v0.3.3 master-data inline editors */
.row-editor { min-width: 150px; }
.row-editor > summary { cursor: pointer; list-style: none; display: inline-flex; align-items: center; justify-content: center; }
.row-editor > summary::-webkit-details-marker { display: none; }
.mini-edit-form { margin-top: .65rem; min-width: 260px; display: grid; gap: .55rem; padding: .75rem; border: 1px solid var(--border, #d7dce2); border-radius: 10px; background: var(--card, #fff); }
.mini-edit-form label { display: grid; gap: .25rem; font-size: .9rem; }
.mini-edit-form input { width: 100%; }

/* v0.3.4 — reliable section switching and A4 operational reports */
.print-only { display: none; }
.report-summary { display:flex; flex-wrap:wrap; gap:12px; padding:12px 14px; margin-bottom:16px; background:#fff; border:1px solid #dbe4ef; border-radius:10px; }
.report-summary span, .report-summary b { padding-inline-end:12px; border-inline-end:1px solid #dbe4ef; }
.report-actions-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.report-action-card { display:flex; flex-direction:column; gap:7px; min-height:105px; padding:17px; border:1px solid #d7e1ec; border-radius:13px; background:#fff; color:inherit; }
.report-action-card:hover { border-color:#8caed2; }
.report-action-card strong { color:#173a67; font-size:16px; }
.report-action-card span { color:#667990; font-size:13px; line-height:1.6; }
.print-report-title { text-align:center; margin:0 0 12px; }
.print-report-title h1 { margin:0 0 4px; font-size:22px; }
.print-report-title p { margin:0; }
.report-table-wrap { width:100%; overflow-x:auto; }
.report-table { width:100%; border-collapse:collapse; table-layout:fixed; background:#fff; }
.report-table th, .report-table td { border:1px solid #cfd8e4; padding:6px; text-align:center; vertical-align:middle; font-size:12px; }
.report-table th { background:#f3f6fa; color:#253a53; }
.report-table td b, .report-table td small, .report-table th small { display:block; }
.report-table td small, .report-table th small { margin-top:3px; color:#607087; font-weight:400; }
.school-wide-table th:first-child { width:100px; }
.school-wide-table td { height:52px; }
.section-week-table th:first-child { width:85px; }
.section-week-table td { height:68px; }
.teacher-week-table th:first-child { width:145px; }
.teacher-week-table th:last-child, .teacher-week-table th:nth-last-child(2) { width:58px; }
.teacher-day-cell { text-align:right !important; vertical-align:top !important; }
.teacher-slot { display:grid; grid-template-columns:auto 1fr; gap:1px 6px; padding:3px 0; border-bottom:1px dotted #d5dde7; }
.teacher-slot:last-child { border-bottom:0; }
.teacher-slot b { grid-row:1 / span 2; min-width:24px; color:#173a67; }
.teacher-slot span { font-weight:600; }
.teacher-slot small { margin:0 !important; }
.center { text-align:center !important; }
.print-page { margin-bottom:22px; }

@media (max-width:900px) {
  .report-actions-grid { grid-template-columns:1fr; }
}

@media print {
  @page { size: A4 landscape; margin: 7mm; }
  :root, body { background:#fff !important; color:#000 !important; }
  .sidebar, .no-print, .cell-edit-link { display:none !important; }
  .print-only { display:block !important; }
  .app-shell { display:block !important; min-height:0 !important; }
  .content { padding:0 !important; }
  .panel, .timetable-wrap { border:0 !important; border-radius:0 !important; box-shadow:none !important; }
  .timetable-wrap, .report-table-wrap { overflow:visible !important; }
  .timetable { min-width:0 !important; width:100% !important; table-layout:fixed !important; }
  .timetable th, .timetable td { min-width:0 !important; height:auto !important; padding:4px !important; font-size:9pt !important; }
  .timetable th.sticky { position:static !important; }
  .lesson { min-height:0 !important; height:auto !important; border:0 !important; background:transparent !important; padding:2px !important; color:#000 !important; }
  .lesson span { color:#333 !important; font-size:8pt !important; }
  .report-table th, .report-table td { padding:4px !important; font-size:8.5pt !important; color:#000 !important; }
  .report-table td small, .report-table th small { color:#333 !important; font-size:7.5pt !important; }
  .print-report-title h1 { font-size:15pt !important; }
  .print-report-title p { font-size:9pt !important; color:#333 !important; }
  .school-wide-table td { height:12mm !important; }
  .section-week-table td { height:18mm !important; }
  .teacher-slot { padding:1px 0 !important; }
  .teacher-week-table th:first-child { width:32mm !important; }
  .teacher-week-table th:last-child, .teacher-week-table th:nth-last-child(2) { width:12mm !important; }
  .print-page { break-after:page; page-break-after:always; margin:0; }
  .print-page:last-child { break-after:auto; page-break-after:auto; }
  .teacher-report { break-inside:auto; }
  a { color:#000 !important; text-decoration:none !important; }
}

/* v0.3.5 — one-page weekly master matrices */
.one-page-matrix { background:#fff; }
.compact-title { margin-bottom:7px; }
.compact-title h1 { font-size:18px; }
.compact-title p { font-size:11px; color:#596b80; }
.matrix-table th, .matrix-table td { padding:2px 3px; font-size:9px; line-height:1.05; }
.matrix-table td { height:21px; }
.matrix-table td b { font-size:9px; white-space:nowrap; }
.matrix-table td small { font-size:7.5px; margin-top:1px; white-space:nowrap; }
.matrix-table .day-col { width:54px; }
.matrix-table .period-col, .school-master-table .period-col { width:30px; }
.matrix-day { font-weight:700; background:#eaf0f7 !important; }
.matrix-period { font-weight:700; background:#f6f8fb !important; }
.teacher-matrix-table { min-width:max(100%, 900px); }
.teacher-matrix-table thead th:not(.day-col):not(.period-col) { min-width:48px; font-size:8px; overflow:hidden; text-overflow:ellipsis; }
.section-matrix-table thead th:not(.day-col):not(.period-col) { min-width:56px; }
.matrix-legend { display:flex; flex-wrap:wrap; gap:3px 9px; margin-top:6px; font-size:8.5px; line-height:1.25; }
.matrix-legend span { white-space:nowrap; }
.school-master-table th, .school-master-table td { padding:3px; }
.school-master-table .period-col { width:42px; }
.school-master-cell { vertical-align:top !important; padding:2px !important; }
.school-master-line { display:grid; grid-template-columns:30px 1fr 24px; align-items:center; gap:2px; border-bottom:1px dotted #d8dee7; padding:1px 2px; font-size:8px; line-height:1.05; }
.school-master-line:last-child { border-bottom:0; }
.school-master-line b { font-size:8px; white-space:nowrap; }
.school-master-line span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.school-master-line small { margin:0 !important; font-size:7px !important; white-space:nowrap; }

@media print {
  @page { size:A4 landscape; margin:4mm; }
  .one-page-matrix { width:100% !important; height:auto !important; break-inside:avoid !important; page-break-inside:avoid !important; }
  .one-page-matrix .report-table-wrap { overflow:visible !important; }
  .compact-title { margin-bottom:2mm !important; }
  .compact-title h1 { font-size:10pt !important; margin:0 !important; }
  .compact-title p { font-size:6.5pt !important; margin:1mm 0 0 !important; }
  .matrix-table { width:100% !important; min-width:0 !important; table-layout:fixed !important; }
  .matrix-table th, .matrix-table td { padding:.45mm .35mm !important; font-size:4.9pt !important; line-height:1.0 !important; height:auto !important; }
  .matrix-table td b { font-size:5pt !important; }
  .matrix-table td small { font-size:4.1pt !important; margin-top:.2mm !important; }
  .matrix-table .day-col { width:11mm !important; }
  .matrix-table .period-col { width:5mm !important; }
  .teacher-matrix-table thead th:not(.day-col):not(.period-col),
  .section-matrix-table thead th:not(.day-col):not(.period-col) { min-width:0 !important; font-size:4.6pt !important; overflow:hidden !important; }
  .matrix-legend { margin-top:1.5mm !important; gap:.5mm 2mm !important; font-size:4.2pt !important; line-height:1.1 !important; }
  .school-master-table { width:100% !important; table-layout:fixed !important; }
  .school-master-table th, .school-master-table td { padding:.55mm !important; font-size:5pt !important; }
  .school-master-table .period-col { width:8mm !important; }
  .school-master-line { grid-template-columns:9mm 1fr 7mm !important; gap:.3mm !important; padding:.25mm .4mm !important; font-size:4.5pt !important; line-height:1 !important; }
  .school-master-line b { font-size:4.5pt !important; }
  .school-master-line small { font-size:3.8pt !important; }
}

/* ===== Smart drag & drop timetable editor ===== */
.drag-help { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.drag-help > span:first-of-type { flex:1; min-width:260px; }
.drag-legend { display:flex; align-items:center; gap:6px; font-size:.88rem; }
.drag-legend i { width:15px; height:15px; display:inline-block; border-radius:4px; border:1px solid currentColor; }
.legend-valid { background:#dcfce7; color:#15803d; }
.legend-invalid { background:#fee2e2; color:#b91c1c; margin-inline-start:8px; }
.drag-status { display:grid; gap:8px; margin-bottom:12px; border-inline-start:4px solid #2563eb; }
.drag-status > div:first-child { display:flex; gap:7px; flex-wrap:wrap; }
.drag-evaluating { color:#1d4ed8; font-weight:700; }
.drag-hover-result { padding:8px 10px; border-radius:8px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.drag-hover-result.valid { background:#dcfce7; color:#166534; }
.drag-hover-result.invalid { background:#fee2e2; color:#991b1b; }
.drag-hover-result small { width:100%; }
.drag-timetable td { position:relative; transition:background-color .12s ease, box-shadow .12s ease; }
.drag-timetable td.drop-valid { background:#dcfce7 !important; box-shadow:inset 0 0 0 2px #22c55e; }
.drag-timetable td.drop-invalid { background:#fee2e2 !important; box-shadow:inset 0 0 0 2px #ef4444; }
.drag-timetable td.drop-noop { background:#f1f5f9 !important; box-shadow:inset 0 0 0 2px #94a3b8; }
.drag-timetable td.drop-origin { background:#dbeafe !important; box-shadow:inset 0 0 0 2px #3b82f6; }
.drag-timetable td.drop-pending { background:#f8fafc; }
.draggable-lesson[draggable="true"] { cursor:grab; }
.draggable-lesson[draggable="true"]:active { cursor:grabbing; opacity:.72; }
.drag-handle { display:block; margin-top:4px; opacity:.7; font-size:.72rem; }
.drag-target-overlay { position:absolute; inset:3px; z-index:4; border-radius:7px; padding:5px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; pointer-events:none; line-height:1.15; }
.drag-target-overlay.valid { background:rgba(220,252,231,.95); color:#166534; border:1px solid #22c55e; }
.drag-target-overlay.invalid { background:rgba(254,226,226,.96); color:#991b1b; border:1px solid #ef4444; }
.drag-target-overlay.noop { background:rgba(241,245,249,.96); color:#475569; border:1px solid #94a3b8; }
.drag-target-overlay b { font-size:.78rem; }
.drag-target-overlay small { font-size:.64rem; margin-top:3px; max-height:2.4em; overflow:hidden; }
@media (max-width: 760px) {
  .drag-target-overlay small { display:none; }
  .drag-target-overlay b { font-size:.7rem; }
}
@media print {
  .drag-help, .drag-status, .drag-target-overlay, .drag-handle { display:none !important; }
  .drag-timetable td { background:transparent !important; box-shadow:none !important; }
}

/* v0.3.6.1 - reliable native drag/drop (Chromium/Edge + Blazor Server) */
.drag-token-form { display:none !important; }
.draggable-lesson[draggable="true"] {
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: element;
}
.draggable-lesson[draggable="true"]:active { cursor: grabbing; }
.draggable-lesson.is-dragging { opacity:.55; outline:2px dashed #2563eb; }
.drag-status.info { border-inline-start-color:#2563eb; }
.drag-status.valid { border-inline-start-color:#16a34a; background:#f0fdf4; }
.drag-status.invalid { border-inline-start-color:#dc2626; background:#fef2f2; }
.drag-timetable td.drop-hover { box-shadow:inset 0 0 0 3px #0f172a; }

/* v0.3.7 — CP-SAT smart chain repair */
.legend-smart { background:#fef3c7; color:#b45309; margin-inline-start:8px; }
.drag-status.smart { border-inline-start-color:#d97706; background:#fffbeb; }
.drag-timetable td.drop-smart { background:#fef3c7 !important; box-shadow:inset 0 0 0 2px #f59e0b; }
.drag-timetable td.drop-smart-pending { background:#fff7ed !important; box-shadow:inset 0 0 0 2px #f59e0b; }
.drag-target-overlay.smart { background:rgba(254,243,199,.97); color:#92400e; border:1px solid #f59e0b; }
.drag-target-overlay.smart-pending { background:rgba(255,247,237,.96); color:#9a3412; border:1px dashed #f59e0b; }
@media print {
  .drag-timetable td.drop-smart, .drag-timetable td.drop-smart-pending { background:transparent !important; box-shadow:none !important; }
}

/* v0.3.8 — adjacency controls and visual block identity */
.adjacency-badge{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .45rem;border-radius:999px;font-size:.78rem;font-weight:700;white-space:nowrap}
.adjacency-badge.single{background:#eef2f7;color:#52606d}
.adjacency-badge.linked{background:#e7f5ff;color:#0b5f8a;border:1px solid #b6e0fe}
.assignment-actions{display:flex;gap:.4rem;align-items:flex-start;flex-wrap:wrap}
.inline-editor summary{list-style:none;cursor:pointer}.inline-editor summary::-webkit-details-marker{display:none}
.edit-card{min-width:420px;max-width:650px;margin-top:.5rem;padding:.75rem;border:1px solid #d9e2ec;border-radius:.75rem;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.08);position:absolute;z-index:40}
.form-row.compact{gap:.55rem}.form-row.compact label{min-width:120px}
.lesson.linked-block{outline:2px solid rgba(14,116,144,.22);outline-offset:-2px}
.block-badge{display:block;margin:.18rem auto 0;padding:.12rem .35rem;border-radius:999px;background:#e0f2fe;color:#075985;font-weight:800;font-size:.72rem;width:max-content;max-width:100%}
@media(max-width:900px){.edit-card{position:static;min-width:0;max-width:none}}
@media print{.block-badge{background:transparent!important;border:0!important;color:#111!important;padding:0}}


/* v0.3.8.1 — human-readable optimization settings */
.settings-title-row{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:.7rem}
.optimization-grid{display:grid;grid-template-columns:repeat(2,minmax(260px,1fr));gap:.9rem;margin:1rem 0}
.setting-card{display:grid;gap:.45rem;padding:.9rem 1rem;border:1px solid #dbe4ef;border-radius:.8rem;background:#fbfdff}
.setting-card .setting-name{font-weight:800;color:#173a67}
.setting-card small{color:#667990;line-height:1.55;min-height:2.8em}
.setting-card select,.setting-card input{width:100%;margin:0}
.settings-note{margin:.85rem 0 1rem;padding:.75rem .9rem;border-radius:.65rem;background:#f5f8fc;border:1px solid #dbe4ef;color:#40556f;line-height:1.6}
@media(max-width:900px){.optimization-grid{grid-template-columns:1fr}}

/* v0.3.8.2 - adjacency management from Subjects */
.adjacency-manager-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.55rem 0;border-bottom:1px solid #e5e7eb}
.adjacency-manager-row:last-child{border-bottom:0}
.adjacency-manager-row>div{min-width:220px;flex:1}
.adjacency-manager-row small{display:block;color:#64748b;margin-top:.15rem}

/* v0.4.0 import UI */
.notice.warn { background:#fff8e8; border:1px solid #ead7a2; color:#765e23; }
.page-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.plan-detail-card { margin-top:10px; max-height:420px; overflow:auto; min-width:620px; }
.plan-detail-card table { width:100%; }
@media (max-width:900px){ .plan-detail-card{min-width:0;} }

/* ============================================================
   v0.4.2 — JW / جدولي visual identity
   Brand: #0F1B2D navy / #1E3A6B blue / #C89D4A gold /
          #16A085 teal / #E6E8EC light neutral
   ============================================================ */
:root {
  --jw-navy:#0F1B2D;
  --jw-blue:#1E3A6B;
  --jw-gold:#C89D4A;
  --jw-gold-soft:#F4E7C8;
  --jw-teal:#16A085;
  --jw-light:#E6E8EC;
  --jw-paper:#F7F9FC;
  --jw-ink:#16263B;
  --jw-line:#D9E2EC;
  --jw-shadow:0 14px 38px rgba(15,27,45,.09);
  color:var(--jw-ink);
  background:var(--jw-paper);
}
body {
  background:
    radial-gradient(circle at 12% 8%, rgba(30,58,107,.055), transparent 28%),
    linear-gradient(180deg,#f9fbfd 0%,#f3f6fa 100%);
  color:var(--jw-ink);
}
a { color:var(--jw-blue); }
.app-shell { grid-template-columns:268px minmax(0,1fr); background:#f4f7fb; }
.app-workspace { min-width:0; min-height:100vh; display:flex; flex-direction:column; }
.sidebar {
  position:sticky; top:0; height:100vh; overflow:auto;
  background:
    linear-gradient(180deg,rgba(255,255,255,.03),transparent 24%),
    linear-gradient(180deg,#142845 0%,var(--jw-navy) 100%);
  padding:20px 15px 16px; gap:14px;
  border-inline-end:1px solid rgba(200,157,74,.26);
  box-shadow:8px 0 28px rgba(15,27,45,.08);
}
.sidebar::after {
  content:""; position:absolute; inset:auto 0 0 0; height:90px; pointer-events:none;
  background:linear-gradient(155deg,transparent 0 48%,rgba(200,157,74,.16) 49% 51%,transparent 52%),
             linear-gradient(25deg,transparent 0 68%,rgba(63,129,190,.12) 69% 71%,transparent 72%);
}
.brand-lockup { display:block; padding:5px 7px 2px; border-radius:14px; }
.brand-lockup:hover { background:rgba(255,255,255,.045); }
.brand-logo { width:100%; max-width:215px; height:auto; display:block; filter:drop-shadow(0 5px 13px rgba(0,0,0,.16)); }
.brand-role { color:#d7e2ee; opacity:.72; font-size:10px; letter-spacing:1.35px; padding:0 10px 8px; direction:ltr; text-align:left; }
.sidebar nav { gap:5px; }
.sidebar nav a {
  position:relative; color:#e7edf4; padding:7px 9px; border-radius:11px; opacity:.94;
  border:1px solid transparent; transition:.16s ease; font-size:13px;
  display:flex; align-items:center; gap:10px; min-height:43px; text-decoration:none;
}
.sidebar nav a::before { display:none !important; content:none !important; }
.sidebar nav a.active,.sidebar nav a:hover {
  background:linear-gradient(90deg,rgba(30,86,151,.48),rgba(255,255,255,.07));
  border-color:rgba(255,255,255,.09); opacity:1; color:#fff;
  transform:translateX(-1px);
}
.nav-icon {
  width:30px; height:30px; flex:0 0 30px; border-radius:9px;
  display:inline-flex; align-items:center; justify-content:center;
  color:#f5c66e; background:linear-gradient(145deg,rgba(200,157,74,.24),rgba(200,157,74,.09));
  border:1px solid rgba(230,191,114,.22); box-shadow:0 3px 10px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.06);
  transition:.16s ease;
}
.nav-icon svg { width:19px; height:19px; display:block; fill:currentColor; stroke:none; }
.nav-icon svg .nav-icon-cut { fill:none; stroke:#142845; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }
.nav-icon svg .nav-icon-cut-fill { fill:#142845; }
.nav-label { min-width:0; line-height:1.25; font-weight:650; }
.sidebar nav a.active .nav-icon,.sidebar nav a:hover .nav-icon {
  color:#fff1c9; background:linear-gradient(145deg,#bd8c34,#8f6625);
  border-color:rgba(255,228,171,.55); box-shadow:0 5px 14px rgba(0,0,0,.22),0 0 0 3px rgba(200,157,74,.10);
  transform:scale(1.05);
}
.sidebar nav a.active .nav-icon svg .nav-icon-cut,.sidebar nav a:hover .nav-icon svg .nav-icon-cut { stroke:#3b2b12; }
.sidebar nav a.active .nav-icon svg .nav-icon-cut-fill,.sidebar nav a:hover .nav-icon svg .nav-icon-cut-fill { fill:#3b2b12; }
.sidebar-note { position:relative; z-index:1; margin-top:auto; padding:12px; border-top:1px solid rgba(255,255,255,.08); opacity:.88; }
.sidebar-user { color:#fff; font-weight:700; }
.link-button { color:#d8e5f3; }
.topbar {
  min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:9px 28px; background:rgba(255,255,255,.88); backdrop-filter:blur(14px);
  border-bottom:1px solid #e0e7ef; position:sticky; top:0; z-index:35;
}
.topbar-product { display:flex; align-items:center; gap:9px; direction:ltr; }
.topbar-product img { width:37px; height:37px; }
.topbar-product strong,.topbar-product small { display:block; }
.topbar-product strong { color:var(--jw-navy); letter-spacing:1.4px; font-size:13px; }
.topbar-product small { color:#73849a; font-size:9px; margin-top:2px; }
.topbar-user { display:flex; align-items:center; gap:8px; color:#52657a; font-size:12px; }
.status-dot { width:7px; height:7px; border-radius:50%; background:var(--jw-teal); box-shadow:0 0 0 4px rgba(22,160,133,.12); }
.content { position:relative; isolation:isolate; flex:1; padding:27px 30px 38px; }
.content::before {
  content:""; position:fixed; z-index:-1; pointer-events:none; inset:18% 7% auto auto;
  width:min(570px,44vw); aspect-ratio:700/430;
  background:none; opacity:0;
}
h1 { color:var(--jw-navy); letter-spacing:-.3px; }
h2 { color:#243b58; }
.panel,.stat,.timetable-wrap,.report-action-card {
  border-color:var(--jw-line); box-shadow:0 6px 19px rgba(15,27,45,.035);
}
.panel { background:rgba(255,255,255,.94); }
.btn { border-color:#cbd7e3; color:var(--jw-blue); border-radius:9px; }
.btn.primary { background:linear-gradient(135deg,var(--jw-blue),#16335d); border-color:var(--jw-blue); box-shadow:0 6px 14px rgba(30,58,107,.16); }
.btn.success { background:var(--jw-teal); border-color:var(--jw-teal); }
input:focus,select:focus { outline:2px solid rgba(30,58,107,.32); border-color:#6a8db7; }
th { color:#40556f; background:#f2f5f9; }
.timetable thead th { background:#edf2f8; color:#1e3654; border-bottom:2px solid rgba(30,58,107,.18); }
.timetable th.sticky { background:#e8eef6; color:var(--jw-navy); }
.noninstruction-head,.noninstruction-cell { background:#fbf5e8 !important; color:#74591f !important; }
.lesson.selected { outline:3px solid var(--jw-gold); background:#fff9ec; }
.lesson.linked-block { outline-color:rgba(22,160,133,.34); }
.block-badge { background:#e7f7f3; color:#0b715e; }
.report-action-card { border-top:3px solid transparent; }
.report-action-card:hover { border-color:#a9bcd2; border-top-color:var(--jw-gold); box-shadow:var(--jw-shadow); }
.stat strong { color:var(--jw-navy); }

/* Login */
.public-content { min-height:100vh; padding:0; display:block; }
.login-stage {
  min-height:100vh; display:grid; grid-template-columns:minmax(360px,1.05fr) minmax(390px,.95fr);
  align-items:center; position:relative; overflow:hidden; padding:52px max(5vw,36px); gap:clamp(40px,7vw,110px);
  background:
    radial-gradient(circle at 12% 80%,rgba(22,160,133,.08),transparent 28%),
    radial-gradient(circle at 90% 10%,rgba(30,58,107,.12),transparent 31%),
    linear-gradient(135deg,#f9fbfd 0%,#eef3f8 100%);
}
.login-digital-bg { position:absolute; inset:0; pointer-events:none; opacity:.52; }
.login-digital-bg::before,.login-digital-bg::after { content:""; position:absolute; width:42vw; height:42vw; border:1px solid rgba(76,142,202,.12); transform:rotate(45deg); }
.login-digital-bg::before { left:-22vw; bottom:-24vw; box-shadow:30px -30px 0 rgba(30,58,107,.025),60px -60px 0 rgba(30,58,107,.02); }
.login-digital-bg::after { right:-26vw; top:-28vw; box-shadow:-30px 30px 0 rgba(200,157,74,.025),-60px 60px 0 rgba(30,58,107,.02); }
.login-brand-panel { position:relative; z-index:2; max-width:610px; direction:rtl; }
.login-hero-logo { width:min(500px,92%); display:block; margin-bottom:18px; direction:ltr; }
.login-kicker { direction:ltr; text-align:left; color:var(--jw-gold); font-size:11px; font-weight:800; letter-spacing:2.2px; margin:8px 0 24px; }
.login-brand-panel h2 { font-size:clamp(25px,3vw,40px); max-width:570px; margin-bottom:12px; }
.login-brand-panel p { max-width:560px; color:#60758c; font-size:15px; }
.login-trust-row { direction:ltr; display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.login-trust-row span { border:1px solid #d6e1ec; background:rgba(255,255,255,.72); border-radius:999px; padding:7px 11px; font-size:9px; font-weight:800; letter-spacing:1px; color:#48617c; }
.login-card {
  position:relative; z-index:3; width:min(430px,100%); justify-self:center; border:1px solid rgba(197,210,224,.88);
  background:rgba(255,255,255,.93); backdrop-filter:blur(16px); border-radius:22px; padding:32px;
  box-shadow:0 28px 65px rgba(15,27,45,.13); overflow:hidden;
}
.login-card::before { content:""; position:absolute; top:0; inset-inline:0; height:4px; background:linear-gradient(90deg,var(--jw-blue),var(--jw-gold),var(--jw-teal)); }
.login-card-mark { width:58px; height:58px; display:block; margin:0 auto 9px; }
.login-card-title { direction:ltr; text-align:center; margin-bottom:20px; }
.login-card-title strong,.login-card-title small { display:block; }
.login-card-title strong { letter-spacing:2.2px; color:var(--jw-navy); font-size:12px; }
.login-card-title small { color:#8a99aa; font-size:8px; letter-spacing:1.4px; margin-top:4px; }
.login-card h1 { text-align:center; font-size:25px; margin-bottom:5px; }
.login-card > .hint { text-align:center; margin-bottom:20px; }
.login-form { gap:10px; }
.login-form label { color:#435970; }
.login-form input { min-height:46px; background:#fbfcfe; }
.login-card-footer { direction:ltr; text-align:center; color:#95a2b1; font-size:9px; letter-spacing:.55px; margin-top:20px; padding-top:15px; border-top:1px solid #e7ecf1; }

/* Branded reports + real printed watermark */
.print-report { position:relative; isolation:isolate; background:#fff; overflow:hidden; }
.print-report > *:not(.report-watermark) { position:relative; z-index:1; }
.report-watermark {
  position:absolute; z-index:0; pointer-events:none; width:47%; max-width:610px; height:auto;
  left:50%; top:52%; transform:translate(-50%,-50%) rotate(-8deg); opacity:.27;
}
.report-brand-strip { direction:ltr; display:flex; align-items:center; justify-content:space-between; gap:15px; border-bottom:1px solid #e0e6ed; padding:5px 2px 7px; margin-bottom:7px; }
.report-brand-strip img { width:148px; max-height:43px; object-fit:contain; object-position:left center; }
.report-brand-strip span { color:#8190a2; font-size:9px; text-transform:uppercase; letter-spacing:1px; }
.report-brand-footer { direction:ltr; text-align:center; margin-top:6px; padding-top:5px; border-top:1px solid #e5e9ee; color:#8a97a6; font-size:8px; letter-spacing:.75px; }
.report-table { background:rgba(255,255,255,.88); }
.report-table th { background:#edf2f7; color:#263d59; }
.matrix-day { background:#e8eef6 !important; color:var(--jw-navy) !important; }
.matrix-period { background:#f6f1e7 !important; color:#705621 !important; }
.timetable-print-report { overflow:visible; }

@media (max-width:900px) {
  .app-shell { display:block; }
  .sidebar { position:static; height:auto; overflow:visible; }
  .brand-logo { max-width:190px; }
  .sidebar nav { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .topbar { padding:8px 17px; position:static; }
  .content { padding:18px; }
  .content::before { width:74vw; inset:30% 10% auto auto; opacity:.07; }
  .login-stage { grid-template-columns:1fr; padding:30px 18px; gap:25px; }
  .login-brand-panel { text-align:center; margin:auto; }
  .login-hero-logo { margin-inline:auto; }
  .login-kicker { text-align:center; }
  .login-trust-row { justify-content:center; }
}
@media (max-width:580px) {
  .sidebar nav { grid-template-columns:1fr; }
  .topbar-product small { display:none; }
  .login-brand-panel h2 { font-size:24px; }
  .login-card { padding:25px 20px; }
}

@media print {
  /* Keep the watermark as an IMG element, so it prints even when browser background graphics are disabled. */
  .topbar { display:none !important; }
  .content::before { display:none !important; }
  .print-report { overflow:visible !important; }
  .report-watermark {
    display:block !important; width:43% !important; max-width:none !important;
    left:50% !important; top:54% !important; transform:translate(-50%,-50%) rotate(-9deg) !important;
    opacity:.30 !important; filter:grayscale(1) !important;
  }
  .report-brand-strip { display:flex !important; margin:0 0 1.3mm !important; padding:0 0 1mm !important; border-bottom:.25mm solid #cfd6de !important; }
  .report-brand-strip img { width:33mm !important; height:auto !important; }
  .report-brand-strip span { font-size:4.5pt !important; color:#555 !important; }
  .report-brand-footer { display:block !important; margin-top:1.2mm !important; padding-top:.8mm !important; font-size:4.2pt !important; color:#666 !important; }
  .timetable-wrap { background:transparent !important; }
  .report-table,.timetable { background:rgba(255,255,255,.82) !important; }
  .report-table th,.timetable th { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}


/* v0.4.3 — period/day structure management */
.period-create-panel{border-top:3px solid var(--jw-gold,#C89D4A)}
.section-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.period-create-form{display:grid;grid-template-columns:repeat(6,minmax(130px,1fr));gap:.75rem;align-items:end}
.period-create-form label,.period-editor label{display:flex;flex-direction:column;gap:.3rem;font-weight:700;font-size:.86rem}
.period-create-form label small{font-weight:400;color:#667085}
.period-create-actions{display:flex;align-items:end}
.period-quick-help{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:1rem}
.period-quick-help span{background:#f6f8fb;border:1px solid #e4e9f1;border-radius:10px;padding:.55rem .75rem;font-size:.83rem;color:#344054}
.period-count{background:#eef3f9;color:#1E3A6B;border-radius:999px;padding:.45rem .8rem;font-weight:800;font-size:.82rem}
.periods-table .period-sequence{min-width:74px;text-align:center}
.periods-table .period-sequence strong{display:block;font-size:1.15rem;color:#0F1B2D}
.periods-table .period-sequence span{display:inline-block;margin-top:.25rem;padding:.15rem .45rem;border-radius:999px;background:#edf2f7;color:#475467;font-size:.72rem}
.period-editor{display:grid;grid-template-columns:1.4fr .7fr 1fr .85fr .85fr auto;gap:.55rem;align-items:end}
.period-editor label span{font-size:.72rem;color:#667085;font-weight:700}
.period-order-actions{white-space:nowrap;text-align:center}
.period-order-actions form{display:inline-block;margin:0 .1rem}
.icon-btn{min-width:36px;font-size:1.05rem;padding:.35rem .55rem}
.period-delete-cell{text-align:center}
.period-row.period-kind-1 td:first-child{border-right:4px solid #C89D4A}
.period-row.period-kind-2 td:first-child{border-right:4px solid #16A085}
.period-row.period-kind-3 td:first-child,.period-row.period-kind-4 td:first-child{border-right:4px solid #98A2B3}
.period-row.period-kind-0 td:first-child{border-right:4px solid #1E3A6B}
button:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:1100px){.period-create-form{grid-template-columns:repeat(3,minmax(140px,1fr))}.period-editor{grid-template-columns:repeat(3,minmax(130px,1fr))}}
@media(max-width:700px){.period-create-form,.period-editor{grid-template-columns:1fr 1fr}.period-create-actions{grid-column:1/-1}}

/* v0.4.4 — approved JW parent identity + product naming system */
.brand-logo { max-width:220px; margin-inline:auto; }
.topbar-product strong { color:var(--jw-gold); font-size:15px; font-weight:800; letter-spacing:0; }
.topbar-product small { direction:ltr; letter-spacing:.45px; }
.login-hero-logo { max-width:480px; }
.login-card-mark { object-fit:contain; }
.report-brand-strip img { object-fit:contain; }

.global-print-watermark { display:none; }
@media print {
  .global-print-watermark {
    display:block !important; position:fixed; z-index:-1; pointer-events:none;
    width:42%; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-8deg);
    opacity:.24; filter:grayscale(1);
  }
}

/* ============================================================
   v0.4.4 — Approved JW master identity / product-name system
   The emblem never changes. Product name is injected below it.
   ============================================================ */
.app-workspace { position:relative; isolation:isolate; }
.content { z-index:1; }
.content::before { display:none !important; }

.jw-brand-lockup {
  width:100%; max-width:420px; display:flex; flex-direction:column; align-items:center;
  justify-content:center; direction:rtl; line-height:1; margin-inline:auto;
}
.jw-brand-lockup .jw-emblem {
  display:block; width:62%; max-width:285px; height:auto; object-fit:contain;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.13));
}
.jw-product-row { width:78%; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; margin-top:2px; }
.jw-product-line { display:block; height:1.5px; background:linear-gradient(90deg,transparent,var(--jw-gold),transparent); }
.jw-product-name { color:var(--jw-gold); font-size:clamp(24px,3vw,40px); font-family:Tahoma,"Segoe UI",Arial,sans-serif; font-weight:700; line-height:1.15; white-space:nowrap; }
.jw-descriptor { margin-top:10px; direction:ltr; color:#64758a; font-size:10px; font-weight:700; letter-spacing:3.2px; white-space:nowrap; }
.jw-brand-lockup.theme-dark .jw-descriptor { color:#c1ccd9; }

/* Sidebar keeps the exact JW emblem with product name below it. */
.sidebar .jw-brand-lockup.compact { max-width:218px; }
.sidebar .jw-brand-lockup.compact .jw-emblem { width:66%; max-width:142px; }
.sidebar .jw-brand-lockup.compact .jw-product-row { width:92%; gap:8px; }
.sidebar .jw-brand-lockup.compact .jw-product-name { font-size:25px; }
.sidebar .jw-brand-lockup.compact .jw-descriptor { font-size:7px; letter-spacing:1.55px; margin-top:7px; }

/* Login hero */
.login-brand-panel .jw-brand-lockup.hero { max-width:480px; margin-inline:0 auto; }
.login-brand-panel .jw-brand-lockup.hero .jw-emblem { width:61%; max-width:300px; }
.login-brand-panel .jw-brand-lockup.hero .jw-product-name { font-size:42px; }
.login-brand-panel .jw-brand-lockup.hero .jw-descriptor { font-size:11px; letter-spacing:3.6px; }

/* Screen watermark: real emblem + dynamic product name. */
.app-watermark {
  position:fixed; z-index:0; pointer-events:none; right:6.5%; top:24%; width:min(460px,38vw);
  display:flex; flex-direction:column; align-items:center; opacity:.055; filter:grayscale(1);
  transform:rotate(-7deg); user-select:none;
}
.app-watermark img { width:72%; height:auto; }
.app-watermark strong { margin-top:-8px; color:#33465c; font:700 48px/1.1 Tahoma,"Segoe UI",Arial,sans-serif; }
.app-watermark span { margin-top:8px; color:#5e6f82; font:700 10px/1 Arial,sans-serif; letter-spacing:3px; direction:ltr; }

/* Printed reports use the same exact emblem and product-name placement. */
.report-watermark {
  position:absolute; z-index:0; pointer-events:none; left:50%; top:53%; width:47%; max-width:520px;
  transform:translate(-50%,-50%) rotate(-8deg); opacity:.10; filter:grayscale(1);
  display:flex; flex-direction:column; align-items:center; user-select:none;
}
.report-watermark img { width:76%; height:auto; }
.report-watermark strong { margin-top:-8px; color:#566475; font:700 54px/1.05 Tahoma,"Segoe UI",Arial,sans-serif; }
.report-watermark span { margin-top:8px; color:#6c7988; font:700 10px/1 Arial,sans-serif; letter-spacing:3px; direction:ltr; }

.report-brand-strip .jw-brand-lockup.compact { margin:0; width:112px; max-width:112px; }
.report-brand-strip .jw-brand-lockup.compact .jw-emblem { width:62px !important; max-width:62px !important; height:auto !important; }
.report-brand-strip .jw-brand-lockup.compact .jw-product-row { width:102px; gap:5px; margin-top:-2px; }
.report-brand-strip .jw-brand-lockup.compact .jw-product-name { font-size:15px; }
.report-brand-strip .jw-brand-lockup.compact .jw-product-line { height:1px; }

/* Product identity in top bar */
.topbar-product strong { color:var(--jw-gold); font-size:16px; font-family:Tahoma,"Segoe UI",Arial,sans-serif; font-weight:800; letter-spacing:0; }
.topbar-product small { color:#6b7d91; }

.global-print-watermark {
  display:none;
}

@media (max-width:900px) {
  .app-watermark { width:70vw; right:15%; top:35%; opacity:.035; }
  .login-brand-panel .jw-brand-lockup.hero { margin-inline:auto; }
  .sidebar .jw-brand-lockup.compact { max-width:205px; }
}

@media print {
  .app-watermark { display:none !important; }
  .report-watermark {
    display:flex !important; width:42% !important; max-width:none !important; left:50% !important; top:54% !important;
    transform:translate(-50%,-50%) rotate(-8deg) !important; opacity:.095 !important; filter:grayscale(1) !important;
  }
  .report-watermark img { width:74% !important; height:auto !important; }
  .report-watermark strong { font-size:28pt !important; color:#596675 !important; }
  .report-watermark span { font-size:5pt !important; letter-spacing:1.6pt !important; color:#6e7884 !important; }
  .report-brand-strip .jw-brand-lockup.compact { width:27mm !important; max-width:27mm !important; }
  .report-brand-strip .jw-brand-lockup.compact .jw-emblem { width:14mm !important; max-width:14mm !important; height:auto !important; }
  .report-brand-strip .jw-brand-lockup.compact .jw-product-row { width:25mm !important; gap:1.2mm !important; }
  .report-brand-strip .jw-brand-lockup.compact .jw-product-name { font-size:8pt !important; }
  .global-print-watermark {
    display:flex !important; position:fixed; z-index:-1; pointer-events:none; width:42%; left:50%; top:50%;
    transform:translate(-50%,-50%) rotate(-8deg); opacity:.09; filter:grayscale(1);
    flex-direction:column; align-items:center;
  }
  .global-print-watermark img { width:74% !important; height:auto !important; }
  .global-print-watermark strong { font:700 30pt/1 Tahoma,"Segoe UI",Arial,sans-serif; color:#5b6774; }
  .global-print-watermark span { margin-top:2mm; font:700 5pt/1 Arial,sans-serif; letter-spacing:1.6pt; color:#6f7a86; direction:ltr; }
}

/* v0.4.5 — branded WhatsApp contact signature */
.brand-contact,
.sidebar-contact {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  white-space:nowrap;
}
.brand-contact img,
.sidebar-contact img {
  width:15px;
  height:15px;
  flex:0 0 auto;
}
.brand-contact span,
.sidebar-contact span {
  direction:rtl;
}
.brand-contact strong,
.sidebar-contact strong {
  font-weight:800;
  letter-spacing:.25px;
}
.brand-footer-main { display:block; }
.report-brand-footer .brand-contact {
  margin-inline-start:10px;
  padding-inline-start:10px;
  border-inline-start:1px solid #d8dee6;
  vertical-align:middle;
}
.login-card-footer .brand-contact {
  margin-top:7px;
  color:#66778b;
  font-size:10px;
}
.login-card-footer .brand-contact img { width:16px; height:16px; }
.sidebar-contact {
  justify-content:flex-start;
  color:#dce7f1;
  font-size:11px;
  margin-top:2px;
}
.sidebar-contact img { width:16px; height:16px; }
.sidebar-contact strong { color:#fff; }
@media print {
  .report-brand-footer .brand-contact {
    display:inline-flex !important;
    margin-inline-start:2mm !important;
    padding-inline-start:2mm !important;
    border-inline-start:.2mm solid #bbb !important;
    font-size:4.2pt !important;
  }
  .report-brand-footer .brand-contact img {
    width:3mm !important;
    height:3mm !important;
    print-color-adjust:exact;
    -webkit-print-color-adjust:exact;
  }
}


/* v0.4.7 — clickable WhatsApp contact */
.whatsapp-link {
  text-decoration:none;
  cursor:pointer;
  transition:transform .15s ease, opacity .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.whatsapp-link:hover {
  text-decoration:none;
  transform:translateY(-1px);
}
.sidebar-contact.whatsapp-link {
  color:#eaf3f8;
  border:1px solid rgba(22,160,133,.28);
  background:rgba(22,160,133,.08);
  padding:7px 9px;
  border-radius:9px;
  margin-top:8px;
}
.sidebar-contact.whatsapp-link:hover {
  color:#fff;
  background:rgba(22,160,133,.16);
  border-color:rgba(22,160,133,.48);
  box-shadow:0 6px 16px rgba(0,0,0,.10);
}
.brand-contact.whatsapp-link { color:inherit; font-weight:700; }
.login-card-footer .whatsapp-link:hover { color:#0f8f72; }
@media print {
  .whatsapp-link { color:inherit !important; text-decoration:none !important; }
}

/* v0.4.8 — clearer study-plan adjacency guidance */
.adjacency-help {
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px;
  margin:4px 0 2px; padding:11px 13px; border:1px solid #dce5ef; border-radius:11px;
  background:linear-gradient(135deg,#f8fbff,#f2f7fb); color:#344b66; font-size:12px;
}
.adjacency-help strong { color:var(--jw-navy); flex-basis:100%; }
.adjacency-help span { background:#fff; border:1px solid #e1e8f0; border-radius:8px; padding:5px 8px; }
.adjacency-help span b { color:#9b6e22; }
.adjacency-help small { color:#64788e; flex-basis:100%; }

/* v0.5.0 — plan-driven teacher assignments */
.plan-authority-panel { border-inline-start:4px solid var(--jw-gold,#c89d4a); }
.plan-authority-flow { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:8px 0 10px; }
.plan-authority-flow span { background:#f7fafc; border:1px solid #dbe4ee; border-radius:10px; padding:8px 11px; font-weight:700; color:#243a54; }
.plan-authority-flow b { color:#b9852d; }
.assignment-teacher-picker { display:flex; flex-wrap:wrap; align-items:end; gap:12px; }
.assignment-teacher-picker label { min-width:280px; flex:1; }
.assignment-picker-hint { flex-basis:100%; margin-top:-2px; }
.teacher-load-strip { display:flex; flex-wrap:wrap; gap:9px; margin-top:12px; }
.teacher-load-strip span { background:#f7fafc; border:1px solid #dbe4ee; border-radius:9px; padding:7px 10px; font-size:12px; }
.active-teacher-context {
  position:sticky; top:76px; z-index:22; margin:-4px 0 18px; padding:11px 14px;
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  border:1px solid rgba(200,157,74,.48); border-inline-start:5px solid var(--jw-gold,#c89d4a); border-radius:13px;
  background:rgba(255,253,247,.97); box-shadow:0 10px 28px rgba(20,40,69,.12); backdrop-filter:blur(10px);
}
.active-teacher-context-main { display:flex; align-items:center; gap:10px; min-width:240px; }
.active-teacher-context-main strong { color:var(--jw-navy,#0f2f57); font-size:16px; }
.active-context-label { display:inline-flex; padding:4px 8px; border-radius:999px; background:#f4e7c8; color:#79571d; font-size:11px; font-weight:800; white-space:nowrap; }
.active-teacher-context-stats { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.active-teacher-context-stats span { background:#fff; border:1px solid #e3e7ec; border-radius:9px; padding:6px 9px; font-size:11px; color:#566b80; }
.active-teacher-context-stats b { color:#173653; }
.assignment-section-block { margin:16px 0 20px; border:1px solid #dce5ef; border-radius:13px; overflow:hidden; background:#fff; }
.assignment-section-block h3 { margin:0; padding:11px 14px; background:#f6f9fc; border-bottom:1px solid #dce5ef; color:#173653; }
.assignment-section-block h3 small { font-weight:500; color:#6d7f91; margin-inline-start:8px; }
.assignment-plan-table .choice-col { width:70px; text-align:center; }
.assignment-choice { width:19px; height:19px; accent-color:#b9852d; cursor:pointer; }
.plan-value-badge { display:inline-flex; min-width:32px; justify-content:center; padding:4px 8px; border-radius:999px; background:#edf4fb; color:#153b63; font-weight:800; }
.status-badge { display:inline-flex; align-items:center; gap:4px; padding:4px 8px; margin:2px; border-radius:999px; border:1px solid #d9e2ec; background:#f7f9fb; color:#566b80; font-size:11px; font-weight:700; }
.status-badge.available { background:#eef9f5; border-color:#bfe7d9; color:#15785f; }
.status-badge.ok { background:#eef9f5; border-color:#a9dccb; color:#116b56; }
.status-badge.assigned { background:#fff7e7; border-color:#ead09b; color:#8a611c; }
.status-badge.error { background:#fff0f0; border-color:#e8b4b4; color:#9d3434; }
.status-badge.plan-source { background:#f5f0e5; border-color:#dfc58f; color:#77531b; }
.assignment-conflict-row { background:#fff8f8; }
.sticky-save-bar { position:sticky; bottom:10px; z-index:5; margin-top:14px; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 12px; border:1px solid #d7e0ea; border-radius:12px; background:rgba(255,255,255,.96); box-shadow:0 8px 26px rgba(18,39,60,.10); backdrop-filter:blur(6px); }
@media (max-width:900px) {
  .active-teacher-context { top:8px; }
}
@media (max-width:760px) {
  .sticky-save-bar { position:static; flex-direction:column; align-items:stretch; }
  .assignment-teacher-picker label { min-width:100%; }
  .active-teacher-context { align-items:stretch; }
  .active-teacher-context-main { min-width:0; justify-content:space-between; }
  .active-teacher-context-stats { width:100%; }
}

/* v0.5.1 — per-class/day instructional capacity */
.section-capacity-panel { border-inline-start:4px solid var(--jw-teal,#16a085); }
.section-capacity-table th,
.section-capacity-table td { text-align:center; vertical-align:middle; }
.section-capacity-table td:first-child { text-align:start; min-width:150px; }
.capacity-grade { display:block; margin-top:3px; font-size:10px; }
.capacity-select { min-width:92px; padding:6px 8px; font-weight:700; }
.capacity-note { margin-top:12px; }
.section-closed-cell {
  background:repeating-linear-gradient(135deg,#f2f4f6,#f2f4f6 7px,#e9edf1 7px,#e9edf1 14px) !important;
  color:#7f8b97 !important;
}
.section-closed-label { font-size:10px; font-weight:800; color:#7b8793; white-space:nowrap; }
.section-closed-conflict { outline:2px solid #c86c57; outline-offset:-2px; }
.section-slot-warning { display:block; margin-bottom:4px; color:#9d3f31; font-weight:800; line-height:1.25; }
.section-closed-line { opacity:.62; background:#eef1f4; }
.section-closed-line.section-closed-conflict { opacity:1; background:#fff0eb; }
@media (max-width:900px) {
  .section-capacity-table { min-width:820px; }
}
@media print {
  .section-closed-cell,
  .section-closed-line {
    background:#eceff2 !important;
    print-color-adjust:exact;
    -webkit-print-color-adjust:exact;
  }
  .section-closed-conflict { outline:1pt solid #8c4a3f !important; }
}
.capacity-copy-select { min-width:118px; padding:6px 8px; border-style:dashed; color:#6e531f; font-weight:700; }

/* v0.5.2 — study-plan-driven automatic class day capacity */
.capacity-auto-rule { margin-bottom: .8rem; }
.capacity-auto-form { margin-bottom: 1rem; }
.manual-capacity-details { margin-top: .5rem; border-top: 1px solid rgba(15,27,45,.10); padding-top: .8rem; }
.manual-capacity-details > summary { cursor: pointer; width: fit-content; list-style: none; }
.manual-capacity-details > summary::-webkit-details-marker { display: none; }
.manual-capacity-details[open] > summary { margin-bottom: .8rem; }


/* v0.5.3 — approved master reports: classes across / teachers across */
.report-action-primary { border-top-color:var(--jw-gold,#c89d4a); background:linear-gradient(180deg,#fffdf8,#fff); }
.report-action-card span b { color:#263d59; }
.matrix-primary { display:block; font-weight:800; color:#142f4d; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.matrix-secondary { display:block; color:#53667b; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.matrix-legends { display:grid; gap:3px; margin-top:5px; }
.teacher-column-head span,.teacher-column-head small { display:block; margin:0; line-height:1.05; }
.teacher-column-head span { font-weight:800; }
.teacher-column-head small { color:#52667b; font-weight:600; }
.matrix-density-normal th,.matrix-density-normal td { font-size:9.5px; }
.matrix-density-normal td b { font-size:9.6px; }
.matrix-density-normal td small { font-size:8px; }
.matrix-density-dense th,.matrix-density-dense td { font-size:8.5px; }
.matrix-density-ultra th,.matrix-density-ultra td { font-size:7.8px; }
.matrix-density-ultra td b { font-size:7.9px; }
.matrix-density-ultra td small { font-size:6.9px; }
@media print {
  .matrix-density-normal th,.matrix-density-normal td { font-size:5.8pt !important; padding:.55mm .45mm !important; }
  .matrix-density-normal td b { font-size:6pt !important; }
  .matrix-density-normal td small { font-size:5.1pt !important; }
  .matrix-density-dense th,.matrix-density-dense td { font-size:4.9pt !important; padding:.43mm .32mm !important; }
  .matrix-density-dense td b { font-size:5.05pt !important; }
  .matrix-density-dense td small { font-size:4.35pt !important; }
  .matrix-density-ultra th,.matrix-density-ultra td { font-size:4.15pt !important; padding:.32mm .22mm !important; }
  .matrix-density-ultra td b { font-size:4.25pt !important; }
  .matrix-density-ultra td small { font-size:3.7pt !important; }
  .teacher-column-head span { font-size:inherit !important; }
  .teacher-column-head small { font-size:90% !important; margin-top:.15mm !important; color:#222 !important; }
  .matrix-legends { gap:.5mm !important; margin-top:1mm !important; }
  .matrix-legends .matrix-legend { margin-top:0 !important; }
}

/* v0.5.9 - teacher-centered assignment workspace */
.teacher-assignment-summary{border-inline-start:4px solid var(--gold,#c89d4a)}
.teacher-assignment-table tfoot th{background:#f5f7fa;font-weight:800}
.all-assignments-details>summary{cursor:pointer;padding:.35rem 0;font-size:1.02rem}
.all-assignments-details[open]>summary{margin-bottom:.75rem}
.assignment-teacher-picker select{min-width:min(100%,32rem)}

/* v0.6.0 - independent sixth/seventh fairness and flexible seventh rotation */

/* v0.6.4 — visible study plans + individual teacher distribution sheets */
.study-plans-browser { display:grid; gap:14px; }
.study-plan-card { border:1px solid #d9e2ec; border-radius:14px; background:#fff; overflow:hidden; }
.study-plan-card.active-plan { border-top:4px solid var(--jw-gold,#C89D4A); }
.study-plan-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:14px 16px; background:#f8fafc; border-bottom:1px solid #e5eaf0; }
.study-plan-card-head h3 { margin:0 0 6px; color:#173a67; }
.study-plan-meta { display:flex; flex-wrap:wrap; gap:7px 14px; color:#617286; font-size:.86rem; }
.plan-active-badge { color:#176b4b; font-weight:800; }
.study-plan-full-table-wrap { max-height:560px; overflow:auto; }
.study-plan-full-table { width:100%; border-collapse:collapse; }
.study-plan-full-table th,.study-plan-full-table td { padding:8px 10px; border-bottom:1px solid #e8edf3; text-align:center; }
.study-plan-full-table th { position:sticky; top:0; z-index:1; background:#edf2f7; color:#263d59; }
.study-plan-full-table td:nth-child(1),.study-plan-full-table td:nth-child(2) { text-align:right; }

.teacher-report-toolbar { display:flex; align-items:end; gap:12px; flex-wrap:wrap; }
.teacher-report-toolbar label { min-width:300px; }
.individual-teacher-reports { display:grid; gap:22px; }
.individual-teacher-report { border:1px solid #dbe3ec; border-radius:12px; padding:12px; box-shadow:0 8px 22px rgba(15,27,45,.06); }
.teacher-sheet-title { margin-bottom:8px; }
.teacher-sheet-title h1 { font-size:17px; margin-bottom:3px; }
.teacher-sheet-title h2 { margin:0 0 3px; color:#173a67; font-size:21px; }
.teacher-sheet-title p { color:#617286; }
.teacher-sheet-summary { display:flex; justify-content:center; flex-wrap:wrap; gap:7px 18px; padding:7px 10px; margin:0 0 9px; border:1px solid #e1e7ee; border-radius:9px; background:#f8fafc; font-size:12px; }
.individual-teacher-table { table-layout:fixed; }
.individual-teacher-table th,.individual-teacher-table td { height:63px; }
.individual-teacher-table thead th small { display:block; font-size:8px; color:#69798c; margin-top:2px; }
.teacher-sheet-day-col { width:78px; }
.teacher-sheet-day { background:#eaf0f7 !important; color:#173a67 !important; font-weight:800; }
.individual-teacher-table td strong,.individual-teacher-table td span { display:block; }
.individual-teacher-table td strong { color:#173a67; font-size:12px; }
.individual-teacher-table td span { margin-top:4px; font-size:10px; color:#5d6f83; }
.teacher-sheet-teaching { background:rgba(255,255,255,.90); }
.teacher-sheet-waiting { background:#fff8e8 !important; }
.teacher-sheet-waiting strong { color:#8a6114 !important; }
.teacher-sheet-note { margin-top:7px; color:#7a8795; font-size:9px; text-align:center; }

@media print {
  .study-plan-card { break-inside:auto !important; box-shadow:none !important; }
  .study-plan-full-table-wrap { max-height:none !important; overflow:visible !important; }
  .study-plan-full-table th { position:static !important; }
  .individual-teacher-reports { display:block !important; }
  .individual-teacher-report { border:0 !important; border-radius:0 !important; padding:0 !important; box-shadow:none !important; }
  .individual-teacher-table th,.individual-teacher-table td { height:19mm !important; padding:1.2mm !important; font-size:8pt !important; }
  .individual-teacher-table td strong { font-size:8pt !important; }
  .individual-teacher-table td span { font-size:7pt !important; margin-top:.7mm !important; }
  .teacher-sheet-day-col { width:18mm !important; }
  .teacher-sheet-title h1 { font-size:11pt !important; }
  .teacher-sheet-title h2 { font-size:14pt !important; margin:0 !important; }
  .teacher-sheet-title p { font-size:7pt !important; }
  .teacher-sheet-summary { margin:1.2mm 0 2mm !important; padding:1mm !important; font-size:7pt !important; border:.2mm solid #cfd6de !important; }
  .teacher-sheet-note { font-size:5pt !important; margin-top:1.5mm !important; }
}

/* v0.6.5 — economical distribution sheets: four teacher/section timetables per A4 landscape page */
.distribution-report-pages{display:grid;gap:18px}
.distribution-print-page{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.distribution-print-page.distribution-one-up{grid-template-columns:1fr}
.distribution-sheet{border:1px dashed #aeb8c4;border-radius:8px;padding:8px;box-shadow:0 5px 16px rgba(15,27,45,.05);min-width:0}
.distribution-brand-row{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #dce3ea;padding-bottom:4px;margin-bottom:4px}
.distribution-brand-row .jw-brand-lockup{transform-origin:right center}
.distribution-brand-row span{font-size:9px;color:#8a6728;font-weight:800}
.distribution-sheet-title{text-align:center;margin:0 0 4px;line-height:1.1}
.distribution-sheet-title strong{display:block;font-size:10px;color:#52657b}
.distribution-sheet-title h2{margin:2px 0;font-size:16px;color:#173a67}
.distribution-sheet-title small{display:block;font-size:8px;color:#6d7d8f}
.distribution-summary{display:flex;justify-content:center;gap:5px 11px;flex-wrap:wrap;margin:3px 0 5px;font-size:8px;color:#45596f}
.distribution-summary span{white-space:nowrap}
.distribution-mini-table{width:100%;border-collapse:collapse;table-layout:fixed;background:rgba(255,255,255,.88)}
.distribution-mini-table th,.distribution-mini-table td{border:1px solid #cfd8e2;text-align:center;vertical-align:middle;padding:2px;height:36px;font-size:8px;line-height:1.05;overflow:hidden}
.distribution-mini-table thead th{background:#edf2f7;color:#213a56;font-weight:800}
.distribution-mini-table tbody th{background:#f3f6f9;color:#24405f;font-weight:800}
.distribution-mini-table td b,.distribution-mini-table td small{display:block;overflow:hidden;text-overflow:ellipsis}
.distribution-mini-table td b{font-size:8px;white-space:nowrap;color:#173a67}
.distribution-mini-table td small{font-size:7px;margin-top:2px;color:#5d6f83;white-space:nowrap}
.distribution-day-col{width:54px}
.distribution-waiting{background:#fff7e3!important}
.distribution-waiting b{color:#8a6114!important}
.distribution-outside{background:#eef1f4!important;color:#8b949e!important}
.outside-label{font-size:7px;font-weight:700}
.distribution-sheet-footer{text-align:center;margin-top:4px;padding-top:3px;border-top:1px solid #e2e7ed;color:#7a8795;font-size:7px}
.distribution-one-up .distribution-sheet{max-width:100%;padding:12px}
.distribution-one-up .distribution-mini-table th,.distribution-one-up .distribution-mini-table td{height:62px;font-size:10px;padding:5px}
.distribution-one-up .distribution-mini-table td b{font-size:11px}
.distribution-one-up .distribution-mini-table td small{font-size:9px}
.distribution-one-up .distribution-sheet-title h2{font-size:22px}

@media print{
  @page{size:A4 landscape;margin:4mm}
  .distribution-report-pages{display:block!important}
  .distribution-print-page{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:repeat(2,minmax(0,1fr))!important;gap:0!important;width:100%!important;height:202mm!important;margin:0!important;break-after:page!important;page-break-after:always!important}
  .distribution-print-page:last-child{break-after:auto!important;page-break-after:auto!important}
  .distribution-sheet{height:101mm!important;min-height:0!important;box-sizing:border-box!important;border:.22mm dashed #8f98a3!important;border-radius:0!important;padding:1.5mm!important;box-shadow:none!important;overflow:hidden!important;break-inside:avoid!important;page-break-inside:avoid!important}
  .distribution-sheet .report-watermark{width:30%!important;opacity:.12!important}
  .distribution-brand-row{height:7mm!important;margin:0 0 .7mm!important;padding:0 0 .6mm!important;border-bottom:.18mm solid #cfd6de!important}
  .distribution-brand-row .jw-brand-lockup{transform:scale(.68)!important;transform-origin:right center!important;max-width:34mm!important}
  .distribution-brand-row span{font-size:4.6pt!important}
  .distribution-sheet-title{margin:0 0 .7mm!important}
  .distribution-sheet-title strong{font-size:5.5pt!important}
  .distribution-sheet-title h2{font-size:8.6pt!important;margin:.3mm 0!important}
  .distribution-sheet-title small{font-size:4.7pt!important}
  .distribution-summary{margin:.6mm 0 .9mm!important;gap:.6mm 2mm!important;font-size:4.7pt!important;line-height:1!important}
  .distribution-mini-table{width:100%!important;table-layout:fixed!important}
  .distribution-mini-table th,.distribution-mini-table td{height:11mm!important;padding:.35mm!important;font-size:5.2pt!important;line-height:1.02!important;color:#000!important}
  .distribution-mini-table td b{font-size:5.4pt!important;white-space:nowrap!important}
  .distribution-mini-table td small{font-size:4.6pt!important;margin-top:.35mm!important;white-space:nowrap!important;color:#333!important}
  .distribution-mini-table thead th,.distribution-mini-table tbody th{print-color-adjust:exact!important;-webkit-print-color-adjust:exact!important}
  .distribution-day-col{width:13mm!important}
  .distribution-outside{background:#eceff2!important;print-color-adjust:exact!important;-webkit-print-color-adjust:exact!important}
  .outside-label{font-size:4.5pt!important}
  .distribution-sheet-footer{margin-top:.6mm!important;padding-top:.4mm!important;font-size:4.2pt!important;line-height:1!important}

  .distribution-print-page.distribution-one-up{display:block!important;height:auto!important}
  .distribution-one-up .distribution-sheet{height:auto!important;min-height:194mm!important;border:0!important;padding:0!important}
  .distribution-one-up .distribution-brand-row{height:auto!important}
  .distribution-one-up .distribution-brand-row .jw-brand-lockup{transform:none!important;max-width:none!important}
  .distribution-one-up .distribution-sheet-title strong{font-size:9pt!important}
  .distribution-one-up .distribution-sheet-title h2{font-size:14pt!important}
  .distribution-one-up .distribution-sheet-title small{font-size:7pt!important}
  .distribution-one-up .distribution-summary{font-size:7pt!important;margin:1.2mm 0 2mm!important}
  .distribution-one-up .distribution-mini-table th,.distribution-one-up .distribution-mini-table td{height:19mm!important;padding:1.2mm!important;font-size:8pt!important}
  .distribution-one-up .distribution-mini-table td b{font-size:8pt!important}
  .distribution-one-up .distribution-mini-table td small{font-size:7pt!important;margin-top:.7mm!important}
  .distribution-one-up .distribution-day-col{width:18mm!important}
  .distribution-one-up .distribution-sheet-footer{font-size:5pt!important;margin-top:1.5mm!important}
}

/* v0.6.8 duty constraints */
.inline-duty-form{display:flex;flex-wrap:wrap;align-items:end;gap:.45rem;min-width:520px}.inline-duty-form label{margin:0}.inline-duty-form input[type=number]{width:84px}.inline-duty-form .check{white-space:nowrap}

/* v0.6.9 — compact 4-up reports: branding must never cover teacher/section names. */
.distribution-mini-logo{display:block;width:26px;height:26px;object-fit:contain;flex:0 0 auto}
.compact-report-brand{justify-content:space-between;min-height:0}
.compact-report-brand + .distribution-sheet-title{position:relative;z-index:2}

@media print{
  .distribution-four-up .report-watermark{display:none!important}
  .distribution-four-up .distribution-brand-row{height:5mm!important;margin:0 0 .5mm!important;padding:0 0 .35mm!important;overflow:hidden!important}
  .distribution-four-up .distribution-mini-logo{width:4.3mm!important;height:4.3mm!important;object-fit:contain!important}
  .distribution-four-up .distribution-brand-row span{font-size:4.2pt!important;line-height:1!important}
  .distribution-four-up .distribution-sheet-title{margin:.15mm 0 .65mm!important;min-height:8mm!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
  .distribution-four-up .distribution-sheet-title h2{position:relative!important;z-index:3!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;padding:0 .5mm!important}
}


/* v0.7.0 — school identity, stronger contact and destructive-action confirmation */
.school-dashboard-identity {
  display:flex; align-items:center; gap:10px; width:max-content; max-width:100%;
  margin:0 0 14px; padding:9px 13px; border:1px solid #d7e2ee; border-radius:12px;
  background:linear-gradient(135deg,#fff,#f5f8fc); box-shadow:0 5px 16px rgba(25,55,90,.05);
}
.school-dashboard-identity span { color:#77889b; font-size:11px; font-weight:700; }
.school-dashboard-identity strong { color:var(--jw-navy,#173a67); font-size:17px; line-height:1.2; }
.sidebar-contact.whatsapp-link {
  opacity:1; font-size:12px; font-weight:700; border-color:rgba(34,197,94,.55);
  background:rgba(34,197,94,.17); padding:9px 10px; box-shadow:0 5px 14px rgba(0,0,0,.10);
}
.sidebar-contact.whatsapp-link img { width:19px; height:19px; }
.sidebar-contact.whatsapp-link strong { font-size:12px; }
.confirm-dialog { border:0; padding:0; border-radius:14px; max-width:520px; width:calc(100% - 28px); box-shadow:0 22px 70px rgba(12,30,55,.28); }
.confirm-dialog::backdrop { background:rgba(10,25,45,.48); }
.confirm-dialog-body { padding:22px; }
.confirm-dialog-body h2 { margin-bottom:9px; color:#8f2626; }
.confirm-dialog-body p { color:#4f6176; }
.confirm-dialog-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:20px; }
.confirm-dialog-actions form { margin:0; }
@media (max-width:600px) {
  .school-dashboard-identity { width:100%; }
  .confirm-dialog-actions { flex-direction:column-reverse; }
  .confirm-dialog-actions .btn { width:100%; }
}
.sidebar-note { opacity:1; }
.sidebar-note > .sidebar-user,
.sidebar-note > small,
.sidebar-note > form { opacity:.82; }
.brand-contact.whatsapp-link { opacity:1; font-weight:700; }
.login-card-footer .brand-contact.whatsapp-link {
  color:#0f6f5d; font-size:11.5px; padding:6px 9px; border:1px solid #cce9df;
  border-radius:8px; background:#f3fbf8;
}

/* v0.7.2 — per-version adjacency detach/relink */
.block-action-confirm{display:flex;align-items:center;justify-content:space-between;gap:18px;border-inline-start:4px solid #b7791f}
.block-action-confirm p{margin:.35rem 0 0;color:#586b82;max-width:850px}
.lesson.detached-block{outline:2px dashed rgba(183,121,31,.42);outline-offset:-2px}
.detached-block-badge{display:block;margin:.18rem auto 0;padding:.12rem .35rem;border-radius:999px;background:#fff7db;color:#8a5a00;font-weight:800;font-size:.72rem;width:max-content;max-width:100%}
@media (max-width:900px){.block-action-confirm{align-items:flex-start;flex-direction:column}}
@media print{.detached-block-badge{background:transparent!important;border:0!important;color:#111!important;padding:0}}


/* v0.7.3 — direct adjacency controls inside timetable cells */
.block-inline-action{display:block;width:calc(100% - .45rem);margin:.28rem auto 0;padding:.28rem .38rem;border-radius:7px;border:1px solid #d6dee8;background:#fff;font-size:.74rem;font-weight:800;cursor:pointer;line-height:1.25}
.block-inline-action.detach{border-color:#d9b56c;background:#fffaf0;color:#7b5200}
.block-inline-action.relink{border-color:#8dc7b7;background:#f1fbf7;color:#126451}
.block-inline-action:hover{filter:brightness(.98);transform:translateY(-1px)}
@media print{.block-inline-action{display:none!important}}


/* v0.7.4 — keep adjacency actions inside the visible timetable cell */
.lesson-cell-stack{display:flex;flex-direction:column;gap:.22rem;width:100%;height:100%;min-height:0;align-items:stretch;justify-content:center}
.lesson-cell-stack.has-adjacency-action{justify-content:flex-start}
.lesson-cell-stack.has-adjacency-action .lesson{height:auto;min-height:54px;flex:1 1 auto;padding:4px 3px}
.lesson-cell-stack.has-adjacency-action .block-badge,.lesson-cell-stack.has-adjacency-action .detached-block-badge{font-size:.66rem;margin-top:.08rem}
.lesson-cell-stack.has-adjacency-action .drag-handle{font-size:.65rem}
.lesson-cell-stack .block-inline-action{flex:0 0 auto;width:100%;margin:0;padding:.22rem .3rem;min-height:25px;position:relative;z-index:3}
.lesson-cell-stack .cell-edit-link{margin-top:0}
.drag-timetable td:has(.lesson-cell-stack.has-adjacency-action){height:118px}
@media print{.lesson-cell-stack{display:block!important;height:auto!important}.lesson-cell-stack .lesson{height:auto!important;min-height:0!important}}


/* v0.7.5 — keep adjacency confirmation visible at the current scroll position */
.block-action-confirm{
  position:fixed;
  top:20px;
  left:50%;
  transform:translateX(-50%);
  width:min(920px,calc(100vw - 32px));
  max-height:calc(100vh - 40px);
  overflow:auto;
  z-index:10050;
  background:#fff;
  border:1px solid #e6c878;
  box-shadow:0 18px 50px rgba(15,27,45,.28);
}
.block-action-confirm::before{content:"";position:fixed;inset:0;z-index:-1;background:rgba(15,27,45,.28);pointer-events:none}
@media (max-width:900px){.block-action-confirm{top:10px;width:calc(100vw - 20px);max-height:calc(100vh - 20px)}}


/* v0.7.6 — native server-post adjacency actions; independent of Blazor circuit */
.block-inline-form{display:block;width:100%;margin:0;padding:0}
.block-inline-form .block-inline-action{width:100%;margin:0}


/* ============================================================
   v0.7.7 — Approved master visual identity / Jadwali product
   Gold J + silver W sailboat, deep navy digital-ocean language.
   ============================================================ */
:root {
  --jw-navy:#071b35;
  --jw-blue:#123f72;
  --jw-gold:#d3a54c;
  --jw-gold-strong:#e2b760;
  --jw-silver:#c9d0d9;
  --jw-paper:#f5f8fc;
}

body { background:#f3f6fa; }

/* Master shell */
.sidebar {
  background:
    radial-gradient(circle at 18% 8%,rgba(211,165,76,.14),transparent 26%),
    linear-gradient(180deg,#0b2b51 0%,#071b35 54%,#06162a 100%);
  border-inline-start:1px solid rgba(211,165,76,.20);
  box-shadow:-14px 0 32px rgba(6,22,42,.10) inset;
}
.sidebar nav a {
  position:relative; border:1px solid transparent; opacity:.88;
  transition:background .16s ease,border-color .16s ease,opacity .16s ease,transform .16s ease;
}
.sidebar nav a.active,
.sidebar nav a:hover {
  background:linear-gradient(90deg,rgba(211,165,76,.16),rgba(255,255,255,.07));
  border-color:rgba(211,165,76,.18); opacity:1;
}
.sidebar nav a.active::after {
  content:""; position:absolute; inset-block:9px; inset-inline-end:2px; width:3px;
  border-radius:4px; background:linear-gradient(180deg,#f0c46c,#b98428);
  box-shadow:0 0 12px rgba(211,165,76,.30);
}
.sidebar-note { opacity:.88; color:#c7d3df; }
.sidebar-note > small { color:#8fa2b7; }
.sidebar-user { color:#f3f6fa; font-weight:800; }
.topbar {
  background:rgba(255,255,255,.94);
  border-bottom:1px solid rgba(211,165,76,.28);
  box-shadow:0 8px 24px rgba(7,27,53,.045);
  backdrop-filter:blur(12px);
}
.topbar-product img {
  width:42px; height:42px; object-fit:contain;
  filter:drop-shadow(0 4px 9px rgba(7,27,53,.12));
}
.topbar-product strong { color:#9f7424; }
.topbar-product small { color:#6f8094; }

/* Parent emblem + product label. The product is visually separate from the master mark. */
.jw-brand-lockup {
  width:100%; max-width:420px; display:flex; flex-direction:column;
  align-items:center; justify-content:center; direction:rtl; line-height:1; margin-inline:auto;
}
.jw-brand-lockup .jw-emblem {
  display:block; width:74%; max-width:318px; height:auto; object-fit:contain;
  filter:drop-shadow(0 10px 20px rgba(2,13,28,.20));
}
.jw-product-row {
  width:72%; display:flex; flex-direction:row; align-items:center; justify-content:flex-start;
  gap:10px; margin-top:4px; direction:rtl;
}
.jw-product-name {
  color:var(--jw-gold-strong); font-size:clamp(23px,2.8vw,39px);
  font-family:Tahoma,"Segoe UI",Arial,sans-serif; font-weight:700;
  line-height:1.1; white-space:nowrap; text-shadow:0 2px 7px rgba(7,27,53,.14);
}
.jw-product-line {
  display:block; flex:1; height:1px;
  background:linear-gradient(90deg,transparent,rgba(211,165,76,.75));
}
.jw-descriptor {
  width:72%; margin-top:8px; direction:ltr; text-align:right;
  color:#718399; font-size:9px; font-weight:700; letter-spacing:2.4px; white-space:nowrap;
}
.jw-brand-lockup.theme-dark .jw-descriptor { color:#91a4b8; }

.sidebar .jw-brand-lockup.compact { max-width:218px; margin-top:-4px; }
.sidebar .jw-brand-lockup.compact .jw-emblem { width:76%; max-width:154px; }
.sidebar .jw-brand-lockup.compact .jw-product-row { width:78%; margin-top:1px; }
.sidebar .jw-brand-lockup.compact .jw-product-name { font-size:22px; }
.sidebar .jw-brand-lockup.compact .jw-descriptor { width:78%; font-size:6.5px; letter-spacing:1.25px; margin-top:6px; }

/* corporate mark first; Jadwale/Jadwali is a lateral product label. */
.sidebar .jw-brand-lockup.compact.lateral { max-width:232px; align-items:stretch; margin-top:-4px; }
.sidebar .jw-brand-lockup.compact.lateral .jw-lateral-main {
  display:grid; grid-template-columns:minmax(94px,1.18fr) minmax(76px,.82fr);
  align-items:end; gap:7px; width:100%; direction:ltr;
}
.sidebar .jw-brand-lockup.compact.lateral .jw-emblem {
  width:100%; max-width:142px; justify-self:end; margin:0;
}
.sidebar .jw-brand-lockup.compact.lateral .jw-lateral-product {
  align-self:end; padding-bottom:10px; text-align:left; direction:ltr; min-width:0;
}
.sidebar .jw-brand-lockup.compact.lateral .jw-latin-name {
  display:block; color:#d3a54c; font:700 13px/1.05 Arial,"Segoe UI",sans-serif;
  letter-spacing:2.2px; white-space:nowrap;
}
.sidebar .jw-brand-lockup.compact.lateral .jw-arabic-name {
  display:block; margin-top:5px; color:#d3a54c; font:700 18px/1.05 Tahoma,"Segoe UI",Arial,sans-serif;
  text-align:right; direction:rtl; white-space:nowrap;
}
.sidebar .jw-brand-lockup.compact.lateral .jw-descriptor {
  width:100%; margin-top:4px; text-align:center; font-size:6.1px; letter-spacing:1.35px;
}

/* Login: use the approved full identity artwork, while the login card remains clean. */
.login-stage {
  background:
    radial-gradient(circle at 8% 70%,rgba(211,165,76,.11),transparent 28%),
    radial-gradient(circle at 88% 15%,rgba(18,63,114,.20),transparent 34%),
    linear-gradient(135deg,#07182f 0%,#0a2b50 58%,#071b35 100%);
}
.login-digital-bg { opacity:.16; }
.login-brand-panel { max-width:700px; }
.login-identity-hero {
  display:block; width:min(720px,100%); max-height:485px; object-fit:contain;
  object-position:center; border-radius:18px;
  filter:drop-shadow(0 26px 48px rgba(0,0,0,.24));
}
.login-brand-panel h2 { color:#f4f7fb; margin-top:18px; }
.login-brand-panel p { color:#b3c3d4; }
.login-trust-row span {
  color:#dce7f1; border-color:rgba(211,165,76,.24);
  background:rgba(7,27,53,.34); backdrop-filter:blur(8px);
}
.login-card {
  border-color:rgba(211,165,76,.23);
  box-shadow:0 30px 72px rgba(1,12,26,.30);
}
.login-card::before {
  background:linear-gradient(90deg,#123f72,#d3a54c,#c9d0d9);
}
.login-card-mark { width:66px; height:66px; }
.login-card-title strong { color:#9f7424; letter-spacing:2.8px; }

/* Screen watermark: ownership signal, not decoration. */
.app-watermark {
  position:fixed; z-index:0; pointer-events:none;
  right:8%; top:28%; width:min(390px,32vw);
  display:flex; flex-direction:column; align-items:center;
  opacity:.033; filter:grayscale(.55); transform:rotate(-5deg);
  user-select:none;
}
.app-watermark img { width:78%; height:auto; }
.app-watermark .jw-watermark-meta {
  width:78%; display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-top:-2px; color:#203a58;
}
.app-watermark strong { color:#203a58; font:700 30px/1 Tahoma,"Segoe UI",Arial,sans-serif; }
.app-watermark span { color:#203a58; font:600 9px/1 Tahoma,"Segoe UI",Arial,sans-serif; letter-spacing:0; direction:rtl; }

/* Printed watermark deliberately small/faint so it never obscures teacher/class names. */
.report-watermark {
  position:absolute; z-index:0; pointer-events:none; left:50%; top:55%;
  width:30%; max-width:330px; transform:translate(-50%,-50%) rotate(-6deg);
  opacity:.055; filter:grayscale(1); display:flex; flex-direction:column;
  align-items:center; user-select:none;
}
.report-watermark img { width:78%; height:auto; }
.report-watermark .jw-watermark-meta {
  width:78%; display:flex; align-items:center; justify-content:center; gap:8px; margin-top:-2px;
}
.report-watermark strong { color:#4f5c6a; font:700 24px/1 Tahoma,"Segoe UI",Arial,sans-serif; }
.report-watermark span { color:#4f5c6a; font:600 7px/1 Tahoma,"Segoe UI",Arial,sans-serif; direction:rtl; }

/* Report header uses the same parent emblem and product label without overpowering data. */
.report-brand-strip .jw-brand-lockup.compact { margin:0; width:122px; max-width:122px; }
.report-brand-strip .jw-brand-lockup.compact .jw-emblem { width:74px !important; max-width:74px !important; height:auto !important; }
.report-brand-strip .jw-brand-lockup.compact .jw-product-row { width:105px; gap:5px; margin-top:-1px; }
.report-brand-strip .jw-brand-lockup.compact .jw-product-name { font-size:14px; }
.report-brand-strip .jw-brand-lockup.compact .jw-descriptor { display:none; }
.report-brand-footer { color:#748294; }
.brand-footer-main { color:inherit; }

/* Keep the economic four-up layouts especially clean. */
.distribution-sheet .report-watermark,
.four-up-sheet .report-watermark,
.economic-report .report-watermark {
  width:20% !important; opacity:.038 !important;
}

@media (max-width:900px) {
  .login-stage { grid-template-columns:1fr; }
  .login-identity-hero { width:min(680px,100%); margin-inline:auto; }
  .app-watermark { width:58vw; right:21%; opacity:.024; }
}
@media (max-width:580px) {
  .login-identity-hero { max-height:330px; }
  .sidebar .jw-brand-lockup.compact .jw-emblem { max-width:138px; }
}
@media (max-width:580px) {
  .sidebar .jw-brand-lockup.compact.lateral .jw-lateral-main { grid-template-columns:minmax(82px,1.15fr) minmax(70px,.85fr); gap:5px; }
  .sidebar .jw-brand-lockup.compact.lateral .jw-emblem { max-width:128px; }
  .sidebar .jw-brand-lockup.compact.lateral .jw-latin-name { font-size:11px; letter-spacing:1.8px; }
  .sidebar .jw-brand-lockup.compact.lateral .jw-arabic-name { font-size:16px; }
}

@media print {
  .report-watermark {
    display:flex !important; width:27% !important; max-width:none !important;
    left:50% !important; top:56% !important;
    transform:translate(-50%,-50%) rotate(-6deg) !important;
    opacity:.05 !important; filter:grayscale(1) !important;
  }
  .report-watermark img { width:78% !important; height:auto !important; }
  .report-watermark strong { font-size:14pt !important; color:#5f6974 !important; }
  .report-watermark span { font-size:4.3pt !important; color:#68727d !important; }
  .global-print-watermark {
    display:flex !important; position:fixed; z-index:-1; pointer-events:none;
    width:28%; left:50%; top:54%; transform:translate(-50%,-50%) rotate(-6deg);
    opacity:.045; filter:grayscale(1); flex-direction:column; align-items:center;
  }
  .global-print-watermark img { width:78% !important; height:auto !important; }
  .global-print-watermark .jw-watermark-meta { width:78%; display:flex; justify-content:center; gap:2mm; }
  .global-print-watermark strong { font:700 15pt/1 Tahoma,"Segoe UI",Arial,sans-serif; color:#5f6974; }
  .global-print-watermark span { font:600 4.5pt/1 Tahoma,"Segoe UI",Arial,sans-serif; color:#68727d; direction:rtl; }
}

/* v0.7.8 — teacher-centric live editing */
.teacher-edit-toolbar{align-items:end}
.teacher-edit-report .print-report-title{margin-bottom:.55rem}
.teacher-edit-summary{display:flex;gap:.55rem;flex-wrap:wrap;margin:0 0 .65rem}
.teacher-edit-summary span{background:#f8fafc;border:1px solid #dbe4ef;border-radius:999px;padding:.32rem .65rem;font-size:.8rem}
.teacher-timetable .lesson span{font-weight:700;color:#31516f}
.teacher-waiting-cell{background:#fffaf0}
.teacher-waiting-badge{display:flex;flex-direction:column;gap:.12rem;align-items:center;justify-content:center;min-height:54px;color:#8a5a00}
.teacher-waiting-badge small{font-size:.65rem;color:#8c6a2d;text-align:center}
.cell-edit-actions{display:flex;gap:.28rem;justify-content:center;align-items:center;flex-wrap:wrap}
.cell-edit-actions .cell-edit-link{display:inline-flex;padding:.12rem .28rem;border-radius:.35rem;background:#f8fafc;border:1px solid #dbe4ef;font-size:.68rem}
@media print{
  .teacher-edit-summary{display:none!important}
  .teacher-waiting-cell{background:transparent!important}
}

/* v0.7.9 — readable A4 school-wide master report */
@media print {
  .school-master-report.one-page-matrix {
    width:100% !important;
    break-inside:avoid !important;
    page-break-inside:avoid !important;
  }
  .school-master-report.multi-page-matrix {
    break-inside:auto !important;
    page-break-inside:auto !important;
    overflow:visible !important;
  }
  .school-master-report.multi-page-matrix .school-master-table thead {
    display:table-header-group !important;
  }
  .school-master-report.multi-page-matrix .school-master-table tr {
    break-inside:avoid !important;
    page-break-inside:avoid !important;
  }

  .school-master-report .compact-title { margin-bottom:1.2mm !important; }
  .school-master-report .compact-title h1 { font-size:10.5pt !important; line-height:1.05 !important; }
  .school-master-report .compact-title p { font-size:6.2pt !important; margin-top:.6mm !important; }
  .school-master-report .report-brand-strip { margin-bottom:.8mm !important; padding-bottom:.6mm !important; }
  .school-master-report .school-master-table { width:100% !important; table-layout:fixed !important; }
  .school-master-report .school-master-table th,
  .school-master-report .school-master-table td { padding:.35mm !important; }
  .school-master-report .school-master-table .period-col { width:7mm !important; }
  .school-master-report .school-master-cell { padding:.2mm !important; vertical-align:top !important; }
  .school-master-report .school-master-line {
    grid-template-columns:9mm minmax(0,1fr) 8mm !important;
    gap:.35mm !important;
    line-height:1.02 !important;
    padding:.22mm .35mm !important;
  }
  .school-master-report .school-master-line span,
  .school-master-report .school-master-line small,
  .school-master-report .school-master-line b {
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  .school-master-report .school-master-footer {
    margin-top:.7mm !important;
    padding-top:.45mm !important;
    font-size:4pt !important;
    line-height:1 !important;
  }
  .school-master-report .school-master-footer .brand-contact {
    margin-top:.25mm !important;
  }

  /* Adaptive density: keep ordinary school reports readable instead of forcing 4pt text. */
  .school-master-report.report-density-roomy .school-master-line,
  .school-master-report.report-density-roomy .school-master-line b { font-size:6.4pt !important; }
  .school-master-report.report-density-roomy .school-master-line small { font-size:5.4pt !important; }

  .school-master-report.report-density-standard .school-master-line,
  .school-master-report.report-density-standard .school-master-line b { font-size:5.8pt !important; }
  .school-master-report.report-density-standard .school-master-line small { font-size:4.9pt !important; }

  .school-master-report.report-density-dense .school-master-line,
  .school-master-report.report-density-dense .school-master-line b { font-size:5.1pt !important; }
  .school-master-report.report-density-dense .school-master-line small { font-size:4.4pt !important; }

  /* More than 12 sections is considered genuine pagination pressure: preserve readability and
     let print pagination occur rather than shrinking the report indefinitely. */
  .school-master-report.report-density-compact .school-master-line,
  .school-master-report.report-density-compact .school-master-line b { font-size:5pt !important; }
  .school-master-report.report-density-compact .school-master-line small { font-size:4.3pt !important; }
}

/* v0.8.1 timetable version management */
.version-name-editor { min-width: 270px; }
.inline-edit { display: inline-flex; gap: .4rem; align-items: center; }
.inline-edit input { min-width: 190px; max-width: 320px; }
@media (max-width: 760px) {
  .version-name-editor, .inline-edit, .inline-edit input { width: 100%; max-width: none; }
  .inline-edit { align-items: stretch; }
}

/* v0.8.2 schedule quality diagnostics */
.quality-head,.quality-inline,.quality-inline-metrics,.quality-metrics,.quality-issue>div{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.quality-head{justify-content:space-between}
.quality-score{min-width:94px;text-align:center;border:1px solid var(--border,#d9dee7);border-radius:14px;padding:10px 14px;background:#fff}
.quality-score strong{font-size:1.8rem;line-height:1}.quality-score span{font-size:.8rem;margin-inline-start:4px}
.quality-score.excellent,.quality-score.good{border-color:#9fd8b4}.quality-score.warn{border-color:#e4c46f}.quality-score.bad{border-color:#e3a5a5}
.quality-metrics{margin:12px 0}.quality-metrics span,.quality-inline-metrics span{background:var(--surface-soft,#f6f8fb);border-radius:999px;padding:6px 10px}
.quality-issues{display:grid;gap:8px}.quality-issue{border:1px solid var(--border,#d9dee7);border-radius:10px;padding:10px 12px;background:#fff}.quality-issue p{margin:5px 0 0}
.quality-badge{font-size:.78rem;border-radius:999px;padding:3px 8px}.quality-badge.constraint{background:#eef2f7}.quality-badge.improvable{background:#fff4d8}
.quality-inline{justify-content:space-between}.quality-inline>div:first-child span{font-size:1.15rem;font-weight:800}


/* v0.8.4 — whole-school timetable version management */
.timetable-manager-note { display:flex; gap:.75rem; align-items:flex-start; flex-wrap:wrap; }
.timetable-manager-note b { min-width:170px; }
.timetable-versions-table td { vertical-align:top; }
.timetable-versions-table .table-actions { gap:.35rem; flex-wrap:wrap; min-width:220px; }
.timetable-versions-table .approved-row { box-shadow: inset -4px 0 0 var(--success, #198754); }
.compact-stats { margin:0; }
.status-badge.neutral { background:#eef1f5; color:#536174; }
@media (max-width: 900px) {
  .timetable-versions-table .table-actions { min-width:170px; }
}


/* v0.8.6 — desktop sidebar must expose navigation, contact, rights and logout without page scrolling */
@media (min-width:901px) {
  .app-shell { min-height:100vh; }
  .sidebar {
    position:sticky; top:0; height:100vh; min-height:0; overflow:hidden;
    padding:clamp(8px,1.1vh,12px) 12px; gap:clamp(5px,.8vh,9px);
  }
  .sidebar .jw-brand-lockup.compact {
    max-width:190px; margin:0 auto; flex:0 0 auto;
  }
  .sidebar .jw-brand-lockup.compact .jw-emblem { width:62%; max-width:112px; }
  .sidebar .jw-brand-lockup.compact .jw-product-row { width:74%; margin-top:0; }
  .sidebar .jw-brand-lockup.compact .jw-product-name { font-size:18px; }
  .sidebar .jw-brand-lockup.compact .jw-descriptor { margin-top:3px; font-size:5.7px; }
  .sidebar nav {
    display:grid; gap:clamp(1px,.25vh,3px); min-height:0; flex:1 1 auto; align-content:start;
  }
  .sidebar nav a {
    min-height:0; padding:clamp(4px,.52vh,6px) 8px; border-radius:7px;
    font-size:clamp(11px,1.42vh,12.5px); line-height:1.15; gap:7px;
  }
  .nav-icon { width:25px; height:25px; min-width:25px; border-radius:7px; }
  .nav-icon svg { width:16px; height:16px; }
  .sidebar-note {
    margin-top:0; flex:0 0 auto; padding:clamp(5px,.65vh,8px) 5px 2px;
    gap:2px; line-height:1.25; font-size:10.5px;
  }
  .sidebar-note form { line-height:1; }
  .sidebar-note .link-button { padding:2px 0; }
  .sidebar-contact.whatsapp-link { min-height:0; padding:4px 6px; gap:5px; }
  .sidebar-contact.whatsapp-link img { width:15px; height:15px; }
  .sidebar-contact.whatsapp-link span, .sidebar-contact.whatsapp-link strong { font-size:10.5px; }
  .sidebar-note > small { font-size:9px; line-height:1.2; }
}
@media (min-width:901px) {
  .sidebar .brand-role { padding:0 4px 2px; font-size:8px; line-height:1.1; }
}
@media (min-width:901px) and (max-height:720px) {
  .sidebar { padding:6px 10px; gap:3px; }
  .sidebar .jw-brand-lockup.compact .jw-emblem { max-width:86px; }
  .sidebar .jw-brand-lockup.compact .jw-product-name { font-size:16px; }
  .sidebar .jw-brand-lockup.compact .jw-descriptor,
  .sidebar .brand-role { display:none; }
  .sidebar nav { gap:0; }
  .sidebar nav a { padding:3px 7px; font-size:10.8px; }
  .nav-icon { width:22px; height:22px; min-width:22px; }
  .nav-icon svg { width:14px; height:14px; }
  .sidebar-note { padding:4px 4px 0; font-size:9.5px; line-height:1.1; }
  .sidebar-contact.whatsapp-link { padding:2px 4px; }
  .sidebar-contact.whatsapp-link span { display:none; }
  .sidebar-note > small { font-size:8.4px; }
}

/* v0.8.7 — clearer timetable lifecycle: active work vs archive */
.workflow-note { border-inline-start:4px solid var(--primary,#123d70); }
.workflow-note span { line-height:1.8; }
.archive-panel { margin-top:18px; background:var(--surface-soft,#f7f9fc); }
.archive-panel h2 { margin-bottom:2px; }
.timetable-versions-table small.hint { display:block; margin-top:4px; }

/* v0.8.8 — approved/archived timetables are immutable; edit through a draft clone */
.approved-readonly { display:flex; align-items:center; justify-content:space-between; gap:16px; border:1px solid #d7b45a; background:#fffaf0; }
.approved-readonly p { margin:.35rem 0 0; }
@media (max-width: 800px) { .approved-readonly { align-items:stretch; flex-direction:column; } }


/* v0.8.9 — keep ordinary 7-period school-wide reports on one readable A4 landscape page.
   The tightening is scoped only to the school-wide report and only while it is still in
   the supported one-page range (<= 12 sections). Multi-page reports keep the prior rules. */
@media print {
  .school-master-report.one-page-matrix.fit-seven-periods {
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .report-brand-strip {
    min-height:0 !important;
    margin:0 0 .35mm !important;
    padding:0 0 .3mm !important;
    line-height:.9 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .report-brand-strip .brand-lockup {
    transform:scale(.82);
    transform-origin:right center;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .compact-title {
    margin:0 0 .45mm !important;
    padding:0 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .compact-title h1 {
    margin:0 !important;
    font-size:9pt !important;
    line-height:1 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .compact-title p {
    margin:.2mm 0 0 !important;
    font-size:5.3pt !important;
    line-height:1 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .report-table-wrap {
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .school-master-table {
    border-collapse:collapse !important;
    border-spacing:0 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .school-master-table thead th {
    padding:.18mm .25mm !important;
    font-size:5.2pt !important;
    line-height:.95 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .school-master-table tbody th,
  .school-master-report.one-page-matrix.fit-seven-periods .school-master-table tbody td {
    padding:.06mm .15mm !important;
    line-height:.92 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .school-master-cell {
    padding:.03mm .1mm !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .school-master-line {
    grid-template-columns:8.2mm minmax(0,1fr) 7.2mm !important;
    gap:.18mm !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 .18mm !important;
    line-height:.9 !important;
    border-bottom-width:.12mm !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-roomy .school-master-line,
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-roomy .school-master-line b { font-size:5.7pt !important; }
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-roomy .school-master-line small { font-size:4.8pt !important; }
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-standard .school-master-line,
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-standard .school-master-line b { font-size:5.2pt !important; }
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-standard .school-master-line small { font-size:4.4pt !important; }
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-dense .school-master-line,
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-dense .school-master-line b { font-size:4.65pt !important; }
  .school-master-report.one-page-matrix.fit-seven-periods.report-density-dense .school-master-line small { font-size:3.95pt !important; }
  .school-master-report.one-page-matrix.fit-seven-periods .section-closed-label {
    font-size:3.9pt !important;
    line-height:.9 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .school-master-footer {
    margin:.25mm 0 0 !important;
    padding:.2mm 0 0 !important;
    font-size:3.7pt !important;
    line-height:.9 !important;
  }
  .school-master-report.one-page-matrix.fit-seven-periods .school-master-footer .brand-contact {
    margin-top:0 !important;
    font-size:3.7pt !important;
  }
}

/* v0.8.10 — unified adaptive A4 print policy for every timetable report.
   Goal: keep each logical report/sheet intact on one readable landscape A4 page whenever physically possible.
   Density tightens in this order: whitespace -> cell padding -> headings/legend -> bounded font reduction.
   Large batches (teacher/section distribution sheets) keep one logical sheet intact and paginate only between sheets. */
@media print {
  @page { size:A4 landscape; margin:3mm; }

  /* Shared report chrome: reclaim vertical space before shrinking table text. */
  .print-report { box-sizing:border-box !important; max-width:100% !important; }
  .print-report .report-brand-strip { min-height:0 !important; margin:0 0 .45mm !important; padding:0 0 .35mm !important; }
  .print-report .report-brand-strip .brand-lockup { transform:scale(.84); transform-origin:right center; }
  .print-report .compact-title,
  .timetable-print-report .print-report-title { margin:0 0 .7mm !important; padding:0 !important; }
  .print-report .compact-title h1,
  .timetable-print-report .print-report-title h1 { margin:0 !important; font-size:9.5pt !important; line-height:1 !important; }
  .print-report .compact-title p,
  .timetable-print-report .print-report-title p { margin:.25mm 0 0 !important; font-size:5.5pt !important; line-height:1 !important; }

  /* Whole teacher/section matrices: one A4 sheet, with existing density classes deciding legible font size. */
  .teacher-matrix-report.one-page-matrix,
  .section-matrix-report.one-page-matrix {
    width:100% !important; height:auto !important; margin:0 !important; padding:0 !important;
    break-inside:avoid-page !important; page-break-inside:avoid !important;
  }
  .teacher-matrix-report .report-table-wrap,
  .section-matrix-report .report-table-wrap { margin:0 !important; padding:0 !important; overflow:visible !important; }
  .teacher-matrix-report .matrix-table,
  .section-matrix-report .matrix-table { width:100% !important; min-width:0 !important; table-layout:fixed !important; border-collapse:collapse !important; }
  .teacher-matrix-report .matrix-table th,
  .teacher-matrix-report .matrix-table td,
  .section-matrix-report .matrix-table th,
  .section-matrix-report .matrix-table td { line-height:.92 !important; height:auto !important; }
  .teacher-matrix-report .matrix-legend,
  .section-matrix-report .matrix-legend { margin-top:.55mm !important; gap:.25mm 1.2mm !important; font-size:3.9pt !important; line-height:1 !important; }
  .teacher-matrix-report .matrix-legends,
  .section-matrix-report .matrix-legends { margin-top:.25mm !important; }

  /* Normal timetable views (teacher/class/manual timetable): keep the table intact and compact. */
  .timetable-print-report {
    width:100% !important; max-width:100% !important; margin:0 !important; padding:0 !important;
    break-inside:avoid-page !important; page-break-inside:avoid !important;
  }
  .timetable-print-report .timetable { width:100% !important; table-layout:fixed !important; border-collapse:collapse !important; }
  .timetable-print-report .timetable th,
  .timetable-print-report .timetable td { padding:.55mm .45mm !important; line-height:.98 !important; height:auto !important; }
  .timetable-print-report .lesson { min-height:0 !important; padding:.3mm !important; line-height:.98 !important; }
  .timetable-print-report .lesson b { font-size:6.2pt !important; }
  .timetable-print-report .lesson small { font-size:5pt !important; }

  /* Individual teacher/class sheets: never split one schedule across two pages.
     Four-up remains 2x2; pagination is allowed only between complete sheets/pages. */
  .distribution-sheet {
    break-inside:avoid-page !important; page-break-inside:avoid !important;
  }
  .distribution-mini-table { width:100% !important; table-layout:fixed !important; border-collapse:collapse !important; }
  .distribution-mini-table th,
  .distribution-mini-table td { line-height:.92 !important; }
  .distribution-print-page { break-inside:avoid-page !important; page-break-inside:avoid !important; }

  /* Do not let a footer/legend alone create an otherwise empty trailing page. */
  .print-report footer,
  .school-master-footer,
  .distribution-sheet-footer { break-before:avoid-page !important; page-break-before:avoid !important; }
}


/* v0.8.11 — inline system-admin school account editing */
.school-edit-row > td { background: #f8fbff; padding: 0.8rem !important; }
.school-edit-card { border: 1px solid #dbe6f3; border-radius: 14px; padding: 1rem; background: #fff; }
.school-edit-title { display: flex; gap: .6rem; align-items: baseline; flex-wrap: wrap; margin-bottom: .8rem; }
.school-edit-title span { color: #64748b; font-size: .88rem; }
.school-edit-grid { display: grid; grid-template-columns: repeat(4, minmax(160px, 1fr)); gap: .75rem; margin-bottom: .8rem; }
.school-edit-grid label { display: grid; gap: .35rem; font-size: .85rem; font-weight: 700; color: #334155; }
.school-edit-grid input { width: 100%; }
@media (max-width: 1000px) { .school-edit-grid { grid-template-columns: repeat(2, minmax(160px, 1fr)); } }
@media (max-width: 650px) { .school-edit-grid { grid-template-columns: 1fr; } }

/* v0.8.14 — guided school-admin workflow */
.work-center-head { align-items:center; }
.workflow-progress { padding:16px 18px; }
.workflow-progress-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:10px; }
.workflow-progress-head div { display:grid; gap:3px; }
.workflow-progress-head strong { color:#173a67; font-size:16px; }
.workflow-progress-head span { color:#728398; font-size:12px; }
.workflow-progress-head > b { color:#173a67; font-size:20px; }
.workflow-progress-track { height:9px; border-radius:999px; background:#e8edf3; overflow:hidden; direction:rtl; }
.workflow-progress-track span { display:block; height:100%; border-radius:inherit; background:#1d6a54; transition:width .2s ease; }
.guided-workflow { display:grid; gap:10px; margin:14px 0; }
.workflow-step { display:grid; grid-template-columns:48px minmax(0,1fr); gap:14px; padding:15px 17px; border:1px solid #dce4ed; border-radius:14px; background:#fff; box-shadow:0 2px 10px rgba(23,58,103,.035); }
.workflow-step.complete { border-color:#cfe2da; background:linear-gradient(90deg,#fff 0,#fbfefd 100%); }
.workflow-step-number { width:42px; height:42px; border-radius:50%; display:grid; place-items:center; background:#e9eef5; color:#173a67; font-weight:900; font-size:17px; }
.workflow-step.complete .workflow-step-number { background:#dff1e9; color:#176348; }
.workflow-step-body { min-width:0; }
.workflow-step-title { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.workflow-step-title h2 { margin:0; font-size:17px; color:#173a67; }
.workflow-step-body p { margin:6px 0 10px; color:#5f7084; line-height:1.7; font-size:13px; }
.workflow-state { flex:0 0 auto; padding:4px 9px; border-radius:999px; background:#f1f4f8; color:#68798c; font-size:11px; font-weight:800; }
.workflow-step.complete .workflow-state { background:#e5f4ed; color:#176348; }
.workflow-step-actions { display:flex; gap:7px; flex-wrap:wrap; }
.workflow-step-actions .btn { padding:6px 10px; font-size:12px; }
.work-attention { border-right:4px solid #b57a22; }
.work-attention h2 { margin-top:0; }
@media (max-width:720px) {
  .workflow-step { grid-template-columns:38px minmax(0,1fr); padding:12px; gap:9px; }
  .workflow-step-number { width:34px; height:34px; font-size:14px; }
  .workflow-step-title { align-items:flex-start; }
  .workflow-step-title h2 { font-size:15px; }
  .workflow-progress-head { align-items:flex-start; }
}
\n\n/* explicit generation lifecycle feedback */\n.generation-status-card {\n  display:grid; grid-template-columns:64px 1fr; gap:18px; align-items:start;\n  margin:0 0 22px; padding:20px 22px; border:1px solid var(--line, #d8e1ee);\n  border-radius:18px; background:#fff; box-shadow:0 12px 30px rgba(15, 45, 82, .08);\n}\n.generation-status-card.is-working { border-color:#b8d4f5; background:linear-gradient(135deg,#f8fbff,#eef6ff); }\n.generation-status-card.is-success { border-color:#9bd5b2; background:linear-gradient(135deg,#f7fff9,#ecfaf1); }\n.generation-status-card.is-error { border-color:#efb1b1; background:#fff7f7; }\n.generation-status-icon { width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center;\n  background:#fff; border:1px solid rgba(25,76,132,.16); font-size:30px; font-weight:800; }\n.generation-status-card.is-success .generation-status-icon { color:#16713b; }\n.generation-status-card.is-error .generation-status-icon { color:#b42318; }\n.generation-status-body h2 { margin:0 0 6px; font-size:1.25rem; }\n.generation-status-body p { margin:0 0 14px; line-height:1.8; }\n.generation-spinner { display:inline-block; width:30px; height:30px; border:4px solid rgba(20,77,139,.18); border-top-color:#144d8b; border-radius:50%; animation:generation-spin .8s linear infinite; }\n@keyframes generation-spin { to { transform:rotate(360deg); } }\n.generation-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:14px 0 10px; }\n.generation-step { display:flex; align-items:center; gap:8px; padding:9px 10px; border-radius:12px; background:rgba(255,255,255,.72); opacity:.55; }\n.generation-step span { width:26px; height:26px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; border:1px solid #a8b7c9; flex:none; }\n.generation-step.active { opacity:1; outline:2px solid #84b5e8; }\n.generation-step.done { opacity:1; color:#176b3a; }\n.generation-step.done span { background:#e5f7ec; border-color:#83c89e; }\n.generation-step.failed { opacity:1; color:#b42318; }\n.generation-job-meta { display:block; margin-top:8px; direction:rtl; }\n.generation-status-actions { margin-top:10px; }\n.generation-submit-overlay { position:fixed; inset:0; z-index:10000; background:rgba(8,19,35,.38); backdrop-filter:blur(2px);\n  display:flex; align-items:center; justify-content:center; padding:20px; }\n.generation-submit-overlay[hidden] { display:none !important; }\n.generation-submit-box { width:min(560px,95vw); display:flex; gap:16px; align-items:center; background:#fff; border-radius:18px; padding:22px 24px; box-shadow:0 22px 70px rgba(0,0,0,.22); }\n.generation-submit-box strong { display:block; font-size:1.15rem; margin-bottom:5px; }\n@media (max-width:700px) {\n  .generation-status-card { grid-template-columns:1fr; }\n  .generation-status-icon { width:48px; height:48px; }\n  .generation-steps { grid-template-columns:1fr; }\n}\n
/* explicit approval for safe but degraded assignment distribution */
.generation-status-card.is-warning { border-color:#e9c46a; background:linear-gradient(135deg,#fffdf5,#fff8df); }
.generation-status-card.is-warning .generation-status-icon { color:#9a6700; }
.degraded-approval-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:14px 0 8px; }
.degraded-approval-actions .btn.secondary { text-decoration:none; }

/* generation state follows the school across navigation */
.generation-global-banner {
  position:sticky; top:0; z-index:35; margin:0; padding:10px 18px;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  border-bottom:1px solid #b8d4f5; background:linear-gradient(90deg,#f6fbff,#edf6ff);
  box-shadow:0 6px 18px rgba(15,45,82,.08);
}
.generation-global-banner.done { border-color:#9bd5b2; background:linear-gradient(90deg,#f7fff9,#ecfaf1); }
.generation-global-banner.failed { border-color:#efb1b1; background:#fff7f7; }
.generation-global-main { display:flex; align-items:center; gap:11px; min-width:0; }
.generation-global-main strong { display:block; color:#123d6d; margin-bottom:2px; }
.generation-global-banner.done .generation-global-main strong { color:#176b3a; }
.generation-global-banner.failed .generation-global-main strong { color:#9b1c1c; }
.generation-global-main small { display:block; line-height:1.55; color:#52677f; }
.generation-global-actions { display:flex; align-items:center; gap:8px; flex:none; }
.generation-global-mark { width:30px; height:30px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#fff; font-weight:900; }
.generation-spinner.compact { width:24px; height:24px; border-width:3px; flex:none; }
@media (max-width:760px) {
  .generation-global-banner { align-items:flex-start; flex-direction:column; padding:10px 12px; }
  .generation-global-actions { width:100%; }
  .generation-global-actions .btn { flex:1; text-align:center; }
}

/* SystemAdmin solver operations dashboard */
.solver-monitor-head{align-items:flex-start}
.monitor-window-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 16px}
.monitor-window-bar small{margin-inline-start:auto;color:#718197}
.monitor-health-strip{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 18px;border-radius:14px;margin-bottom:16px;border:1px solid #dbe4ef;background:#fff}
.monitor-health-strip>div:first-child{display:flex;align-items:center;gap:10px}.monitor-health-strip strong,.monitor-health-strip small{display:block}.monitor-health-strip small{margin-top:3px;color:#607087}
.monitor-health-strip.good{background:#f2fbf7;border-color:#9fd5bd}.monitor-health-strip.warn{background:#fff9ea;border-color:#e4c46f}.monitor-health-strip.bad{background:#fff4f4;border-color:#e8a5a5}
.monitor-health-dot{width:11px;height:11px;border-radius:50%;background:#198754;box-shadow:0 0 0 5px rgba(25,135,84,.1)}.monitor-health-strip.warn .monitor-health-dot{background:#b88100}.monitor-health-strip.bad .monitor-health-dot{background:#b02a37}
.monitor-live-load{display:flex;gap:8px;flex-wrap:wrap}.monitor-live-load span{background:rgba(255,255,255,.75);border:1px solid rgba(127,145,165,.22);border-radius:999px;padding:6px 10px;font-size:12px}.monitor-live-load b{font-size:14px;margin-inline-start:4px}
.monitor-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}
.monitor-kpi{background:#fff;border:1px solid #dbe4ef;border-radius:14px;padding:15px;min-height:112px}.monitor-kpi span,.monitor-kpi strong,.monitor-kpi small{display:block}.monitor-kpi span{font-size:12px;color:#65778d}.monitor-kpi strong{font-size:25px;margin:7px 0 5px}.monitor-kpi small{color:#7a899a;line-height:1.5}.monitor-kpi.good{border-inline-start:4px solid #198754}.monitor-kpi.warn{border-inline-start:4px solid #c08a16}.monitor-kpi.bad{border-inline-start:4px solid #b02a37}
.monitor-grid{align-items:start}.monitor-table code{font-size:11px;color:#36526f}.monitor-subline{display:block;color:#8794a3;margin-top:2px}
.monitor-decision-list{display:grid;gap:9px}.monitor-decision-list>div{display:grid;grid-template-columns:1fr auto;gap:3px 12px;padding:10px 12px;border:1px solid #e2e8ef;border-radius:10px;background:#fafbfd}.monitor-decision-list span{color:#61748b}.monitor-decision-list b{font-size:15px}.monitor-decision-list small{grid-column:1/-1;color:#8491a0}
.monitor-note{margin-top:12px;margin-bottom:0;background:#f2f7fc;border:1px solid #ccdae9;color:#36526f}.monitor-recent-wrap{max-height:520px;overflow:auto}.monitor-recent-wrap thead th{position:sticky;top:0;z-index:1}
@media(max-width:1200px){.monitor-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.monitor-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.monitor-health-strip{align-items:flex-start;flex-direction:column}.monitor-window-bar small{margin-inline-start:0}}
@media(max-width:560px){.monitor-kpis{grid-template-columns:1fr}}

/* race-free monitoring filters and responsive refresh state */
.monitor-filter-divider{width:1px;height:28px;background:#dbe4ef;display:inline-block}
.monitor-current-panel{margin-bottom:14px}
.monitor-current-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.monitor-current-grid>div{padding:12px 14px;border:1px solid #dfe7f0;border-radius:12px;background:#fbfcfe}
.monitor-current-grid span,.monitor-current-grid b,.monitor-current-grid small{display:block}
.monitor-current-grid span{font-size:12px;color:#65778d}.monitor-current-grid b{font-size:22px;margin:5px 0}.monitor-current-grid small{font-size:11px;color:#8190a0;line-height:1.45}
.monitor-scope-note{margin:0 0 14px;line-height:1.8}.monitor-scope-note code{font-size:11px}
.monitor-section-title{margin:6px 0 10px}
@media(max-width:900px){.monitor-current-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.monitor-filter-divider{display:none}}
@media(max-width:560px){.monitor-current-grid{grid-template-columns:1fr}}


/* solver monitor filters use real GET navigation, independent of Blazor click events */
.monitor-window-bar a.btn { text-decoration:none; }

/* secure SystemAdmin test tenant + diagnostics */
.system-test-banner{margin:14px 18px 0;padding:12px 16px;border:1px solid rgba(173,119,20,.32);border-radius:14px;background:rgba(255,244,208,.94);display:flex;align-items:center;justify-content:space-between;gap:16px;position:relative;z-index:4}.system-test-banner>div{display:flex;flex-direction:column;gap:2px}.system-test-banner strong{font-size:15px}.system-test-banner span{font-size:12px;color:#6d561d}.system-diagnostic-overlay{margin:10px 18px 0;padding:14px 16px;border-radius:14px;border:1px dashed rgba(62,91,126,.45);background:rgba(244,248,252,.96);position:relative;z-index:4}.system-diagnostic-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.system-diagnostic-head>div{display:flex;flex-direction:column;gap:2px}.system-diagnostic-head small{color:#64748b}.diagnostic-live{font-size:11px;font-weight:700;padding:4px 8px;border-radius:999px;background:#e2e8f0}.diagnostic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.diagnostic-grid>div{padding:8px 9px;border:1px solid #e2e8f0;border-radius:10px;background:#fff;min-width:0}.diagnostic-grid span{display:block;font-size:10px;color:#64748b;margin-bottom:2px}.diagnostic-grid b{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.diagnostic-message{margin-top:10px}.diagnostic-message summary{cursor:pointer;font-weight:700;font-size:12px}.diagnostic-message pre{white-space:pre-wrap;word-break:break-word;max-height:180px;overflow:auto;background:#0f172a;color:#e2e8f0;padding:10px;border-radius:10px;font-size:11px;direction:ltr;text-align:left}.diagnostic-empty{font-size:12px;color:#64748b}.system-test-badge{margin-inline-start:7px}.system-test-admin-panel{border-color:rgba(173,119,20,.3)}.account-security-panel{max-width:760px}.account-password-form{max-width:620px}
@media(max-width:900px){.diagnostic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.system-test-banner{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.diagnostic-grid{grid-template-columns:1fr}}

/* critical mutations are normal server POSTs, so forms must behave like action buttons. */
.inline-action-form{display:inline-flex;align-items:center;margin:0;gap:.35rem}
.inline-action-details{display:inline-block;margin-top:.35rem}
.inline-action-details>summary{list-style:none;cursor:pointer;width:max-content}
.inline-action-details>summary::-webkit-details-marker{display:none}
.inline-action-details[open] .inline-edit{margin-top:.45rem;display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.server-action-form input[type="text"]{min-width:14rem}

/* live Worker boot/resource telemetry */
.monitor-workers-panel{margin-bottom:14px}.monitor-workers-panel .monitor-table th,.monitor-workers-panel .monitor-table td{white-space:nowrap}
.monitor-resource-grid{margin-bottom:18px}.worker-metric-legend{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0 12px}.worker-metric-legend span{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:#607087}.worker-metric-legend code{font-size:10px}
.metric-series-dot{width:9px;height:9px;border-radius:50%;display:inline-block;background:currentColor}.worker-chart-block{margin-top:14px}.worker-chart-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}.worker-chart-head span{font-size:11px;color:#7b8999}.worker-chart-frame{position:relative;padding-inline-start:38px;border:1px solid #e0e7ef;border-radius:12px;background:#fbfcfe;overflow:hidden}.worker-chart-frame svg{display:block;width:100%;height:154px;overflow:visible}.metric-grid-line{stroke:#dfe6ee;stroke-width:1;vector-effect:non-scaling-stroke}.metric-series-line{fill:none;stroke:currentColor;stroke-width:2.2;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}.chart-y{position:absolute;inset-inline-start:5px;font-size:9px;color:#8b97a5;z-index:1}.chart-y.top{top:3px}.chart-y.mid{top:50%;transform:translateY(-50%)}.chart-y.bottom{bottom:3px}.worker-chart-axis{display:flex;justify-content:space-between;font-size:10px;color:#8995a2;margin-top:4px;padding-inline-start:38px}
.metric-series-0{color:#1d5f92}.metric-series-1{color:#8b5b23}.metric-series-2{color:#4d7a54}.metric-series-3{color:#76558d}.metric-series-4{color:#9a4f55}.metric-series-5{color:#4d7580}
@media(max-width:900px){.monitor-resource-grid{grid-template-columns:1fr}.monitor-workers-panel .table-wrap{overflow:auto}.worker-chart-frame svg{height:130px}}


/* password guidance and security UX */
.password-input-wrap { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.45rem; align-items:center; }
.password-input-wrap input { min-width:0; width:100%; }
.password-toggle { min-height:40px; padding:.45rem .7rem; border:1px solid var(--border,#d7dce2); border-radius:8px; background:var(--card,#fff); color:inherit; cursor:pointer; font:inherit; }
.password-toggle:hover { border-color:#8caed2; }
.password-policy { margin:.2rem 0 .8rem; padding:.8rem 1rem; border:1px solid #d7e1ec; border-radius:10px; background:#f8fafc; }
.password-policy.compact { padding:.6rem .8rem; }
.password-policy ul { margin:.4rem 0 0; padding-inline-start:1.25rem; display:grid; gap:.3rem; }
.password-policy li { color:#7a4b00; }
.password-policy li::marker { content:'○  '; }
.password-policy li.ok { color:#166534; }
.password-policy li.ok::marker { content:'✓  '; }
.password-strength { display:grid; grid-template-columns:auto auto minmax(80px,1fr); gap:.55rem; align-items:center; font-size:.9rem; }
.password-strength i { display:block; height:7px; background:#e5e7eb; border-radius:999px; overflow:hidden; }
.password-strength em { display:block; height:100%; width:0; background:#9ca3af; transition:width .18s ease; }
.password-strength em[data-level='weak'] { background:#b91c1c; }
.password-strength em[data-level='medium'] { background:#a16207; }
.password-strength em[data-level='strong'] { background:#15803d; }
.password-strength b[data-level='weak'] { color:#b91c1c; }
.password-strength b[data-level='medium'] { color:#a16207; }
.password-strength b[data-level='strong'] { color:#15803d; }
.password-match-ok { color:#166534; }
.password-match-error { color:#b91c1c; }
@media (max-width:520px) { .password-strength { grid-template-columns:auto auto; } .password-strength i { grid-column:1 / -1; } }

/* touch/hover field help. Never rely on hover alone. */
.field-help {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    margin-inline-start: .25rem;
    padding: 0;
    border: 1px solid color-mix(in srgb, currentColor 28%, transparent);
    border-radius: 999px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: .78rem;
    cursor: help;
    vertical-align: middle;
}
.field-help::after {
    content: attr(data-help-text);
    position: absolute;
    z-index: 50;
    inset-inline-end: 0;
    top: calc(100% + .45rem);
    width: min(19rem, 76vw);
    padding: .65rem .75rem;
    border: 1px solid var(--border, #cbd5e1);
    border-radius: .7rem;
    background: var(--surface, #ffffff);
    color: var(--text, #102038);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .14);
    font-size: .82rem;
    font-weight: 500;
    line-height: 1.65;
    white-space: normal;
    text-align: start;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.field-help.is-open::after,
.field-help:focus-visible::after { opacity: 1; visibility: visible; }
@media (hover: hover) and (pointer: fine) {
    .field-help:hover::after { opacity: 1; visibility: visible; }
}

/* grouped study-plan import/export */
.plan-preview-meta { display:flex; flex-wrap:wrap; gap:8px 14px; margin:8px 0 12px; color:#52677e; }
.plan-preview-meta span { background:#f7f9fc; border:1px solid #e0e7ef; border-radius:9px; padding:7px 10px; }
.plan-preview-summary { margin-bottom:14px; }
.plan-preview-detail .plan-grade-row td { background:#e8eef8; color:#17315b; text-align:right; border-top:2px solid #d5dfeb; }
@media (max-width: 720px) {
  .plan-preview-meta { display:grid; grid-template-columns:1fr 1fr; }
  .plan-preview-meta span { min-width:0; }
}

/* manual-first study plan editor */
.manual-plan-principle-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.manual-plan-principle-grid>div{display:grid;gap:4px;padding:12px 14px;border:1px solid #dde6ef;border-radius:12px;background:#f8fafc}.manual-plan-principle-grid strong{color:#173a67}.manual-plan-principle-grid span{font-size:.86rem;color:#62748a;line-height:1.55}.manual-plan-meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0 18px}.manual-plan-meta-grid label,.manual-level-name label{display:grid;gap:6px}.manual-plan-meta-grid input,.manual-level-name input,.manual-plan-table input,.manual-plan-table select{width:100%;min-height:40px}.manual-level-list{display:grid;gap:16px}.manual-level-card{border:1px solid #dbe4ee;border-radius:14px;overflow:hidden;background:#fff}.manual-level-head{display:grid;grid-template-columns:minmax(260px,1fr) auto auto;gap:12px;align-items:end;padding:14px;background:#f7f9fc;border-bottom:1px solid #e2e8f0}.manual-level-summary{display:grid;gap:2px;text-align:center;color:#607087;font-size:.82rem}.manual-level-summary b{color:#173a67;font-size:.9rem}.manual-plan-table{width:100%;border-collapse:collapse}.manual-plan-table th,.manual-plan-table td{padding:8px 9px;vertical-align:middle}.manual-plan-table th{background:#eef3f8;color:#2f4662;white-space:nowrap}.manual-plan-table td:first-child{min-width:220px}.manual-level-card>.btn{margin:10px 14px 14px}.manual-plan-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid #e3e8ef}.manual-plan-save-side{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.manual-plan-save-side span{color:#66778a;font-size:.88rem}.plan-level-chips{display:flex;gap:8px;flex-wrap:wrap}.plan-level-chips span{padding:7px 10px;border:1px solid #d9e2ec;border-radius:999px;background:#f7f9fc;color:#314d6d;font-size:.86rem}.inline-label-help{display:inline-flex;align-items:center}.manual-plan-editor .section-title-row{align-items:flex-start}
@media(max-width:900px){.manual-plan-principle-grid{grid-template-columns:1fr 1fr}.manual-level-head{grid-template-columns:1fr auto}.manual-level-summary{grid-row:2;grid-column:1/-1;text-align:start;display:flex;gap:12px}.manual-plan-actions{align-items:stretch;flex-direction:column}.manual-plan-save-side{justify-content:space-between}}
@media(max-width:620px){.manual-plan-principle-grid,.manual-plan-meta-grid{grid-template-columns:1fr}.manual-level-head{grid-template-columns:1fr}.manual-level-head>.btn{justify-self:start}.manual-level-summary{grid-column:1}.manual-plan-table{min-width:720px}.manual-plan-save-side{align-items:stretch;flex-direction:column}.manual-plan-save-side .btn{width:100%}}

/* internal support center */
.support-form textarea,
.support-reply-form textarea { width: 100%; resize: vertical; }
.support-thread-panel { display: grid; gap: 1rem; }
.support-thread { display: grid; gap: .8rem; }
.support-message { max-width: 86%; padding: .9rem 1rem; border-radius: 14px; border: 1px solid var(--line, #d7dde6); background: #fff; }
.support-message.from-school { margin-inline-start: auto; background: #f7f9fc; }
.support-message.from-support { margin-inline-end: auto; background: #f2f7ff; }
.support-message header { display: flex; gap: .75rem; justify-content: space-between; align-items: baseline; margin-bottom: .45rem; }
.support-message header span { font-size: .78rem; opacity: .7; }
.support-message p { margin: 0; white-space: pre-wrap; line-height: 1.8; }
.support-attachments { margin-top: .7rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.support-admin-actions { display: flex; justify-content: flex-end; }
.selected-row { outline: 2px solid rgba(30, 90, 160, .22); outline-offset: -2px; }

/* teacher timetable sharing */
.share-summary-panel { display: flex; gap: 1rem; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.share-summary-panel > div:first-child { display: grid; gap: .2rem; }
.share-summary-panel > div:first-child span { font-size: .82rem; opacity: .7; }
.teacher-sharing-table td { vertical-align: top; }
.teacher-sharing-table td > small { display: block; margin-top: .25rem; }
.teacher-sharing-table .inline-edit { min-width: 240px; }
.teacher-sharing-table .inline-edit input { min-width: 145px; }
.share-link-actions,
.sharing-primary-actions { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.whatsapp-share-btn { white-space: nowrap; }

/* Public, tokenized teacher timetable view */
.public-share-shell { min-height: 100vh; background: #f4f6f9; display: flex; flex-direction: column; }
.public-share-header { padding: 18px clamp(16px, 4vw, 44px); background: #fff; border-bottom: 1px solid #e1e5eb; }
.public-share-header .brand-lockup { display: inline-flex; max-width: 190px; }
.public-share-content { width: min(1180px, calc(100% - 24px)); margin: 24px auto; flex: 1; }
.public-share-footer { width: min(1180px, calc(100% - 24px)); margin: 0 auto 20px; }
.public-share-card { overflow: hidden; }
.public-teacher-title { text-align: center; display: grid; gap: .3rem; margin-bottom: 1rem; }
.public-teacher-title > span { font-weight: 700; opacity: .75; }
.public-teacher-title h1 { margin: 0; }
.public-share-summary { justify-content: center; margin-bottom: 1rem; }
.public-teacher-table { min-width: 700px; }
.public-teacher-table td { min-width: 82px; }
.public-share-note { margin-top: 1rem; }
.public-share-error { text-align: center; padding: 3rem 1.5rem; }

@media (max-width: 760px) {
    .support-message { max-width: 96%; }
    .teacher-sharing-table { min-width: 920px; }
    .public-share-content { width: min(100% - 12px, 1180px); margin-top: 12px; }
    .public-share-header { padding: 12px 16px; }
    .public-teacher-table { font-size: .82rem; }
    .public-teacher-table th,
    .public-teacher-table td { padding: .42rem .3rem; }
}

/* secure school-wide timetable sharing */
.general-share-panel { display: grid; gap: 1rem; border-inline-start: 4px solid #254f7f; }
.general-share-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.general-share-head > div { display: grid; gap: .3rem; }
.general-share-head h2 { margin: 0; }
.general-share-head .eyebrow { font-size: .78rem; font-weight: 800; color: #254f7f; }
.general-share-link-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .55rem; align-items: center; }
.general-share-url { width: 100%; direction: ltr; text-align: left; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.general-share-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.compact-notice { margin: 0; }
.public-general-sheet { overflow: hidden; }
.public-general-wrap { max-height: none; }
.public-general-table { min-width: 860px; }
.public-general-table .school-master-line { min-width: 0; grid-template-columns: minmax(3.2rem, auto) 1fr minmax(2.6rem, auto); gap: .3rem; padding: .22rem .3rem; font-size: .76rem; line-height: 1.25; }
.public-general-table .school-master-line b { min-width: 3.2rem; font-size: .76rem; }
.public-general-table .school-master-line small { font-size: .66rem !important; }
.public-general-table th, .public-general-table td { padding: .35rem; }
@media (max-width: 760px) {
    .general-share-head { flex-direction: column; }
    .general-share-link-row { grid-template-columns: 1fr; }
    .general-share-actions { align-items: stretch; }
    .general-share-actions > .btn,
    .general-share-actions > form,
    .general-share-actions > form > .btn { width: 100%; }
    .public-general-table { min-width: 780px; font-size: .78rem; }
}


/* adaptive WhatsApp launcher */
.whatsapp-launch-panel { display: grid; gap: .7rem; border-inline-start: 4px solid #128c7e; }
.whatsapp-launch-copy { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; }
.whatsapp-launch-copy > div:first-child { display: grid; gap: .25rem; }
.whatsapp-launch-copy h2 { margin: 0; }
.whatsapp-launch-copy .eyebrow { font-size: .78rem; font-weight: 800; color: #0f766e; }
.whatsapp-mode-field { display: grid; gap: .35rem; min-width: 230px; }
.whatsapp-mode-field > span { font-size: .8rem; font-weight: 700; color: #42566d; }
.whatsapp-mode-field select { width: 100%; min-height: 40px; }
.whatsapp-launch-note { font-size: .86rem; }
@media (max-width: 760px) {
    .whatsapp-launch-copy { flex-direction: column; align-items: stretch; }
    .whatsapp-mode-field { min-width: 0; }
}


/* explicit WhatsApp send confirmation */
.share-status-stack { display: grid; gap: .22rem; align-content: start; }
.share-status-stack small { color: #6b7b8e; line-height: 1.45; }
.status-badge.opened { background: #eef4fb; border-color: #bfd1e7; color: #244f7c; }
.share-confirm-block { display: grid; gap: .3rem; min-width: 170px; }
.share-confirm-block[hidden] { display: none !important; }
.share-confirm-hint { font-size: .76rem; line-height: 1.45; color: #5e6f82; max-width: 210px; }
.share-confirm-btn { white-space: nowrap; }
@media (max-width: 760px) {
    .share-confirm-block { min-width: 0; }
    .share-confirm-hint { max-width: none; }
}

/* general timetable explicit share confirmation */
.general-share-workflow { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; justify-content: space-between; padding: .8rem .9rem; border: 1px solid var(--border, #d9e2ec); border-radius: .8rem; background: rgba(247, 250, 252, .75); }
.general-share-workflow .share-status-stack { min-width: 12rem; }
@media (max-width: 720px) {
    .general-share-workflow { align-items: stretch; }
    .general-share-workflow > * { width: 100%; }
    .general-share-workflow .sharing-primary-actions,
    .general-share-workflow .sharing-primary-actions > .btn,
    .general-share-workflow .share-confirm-block,
    .general-share-workflow .share-confirm-block form,
    .general-share-workflow .share-confirm-block .btn { width: 100%; }
}

/* one general share link with administrator-selected timetable views */
.general-share-view-config { display:grid; gap:.75rem; padding:.9rem; border:1px solid var(--border, #d9e2ec); border-radius:.85rem; background:rgba(247,250,252,.82); }
.general-share-view-config h3 { margin:0; font-size:1rem; }
.general-share-view-form { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; align-items:stretch; }
.general-view-option { display:flex; gap:.55rem; align-items:flex-start; padding:.7rem .75rem; border:1px solid var(--border, #d9e2ec); border-radius:.75rem; background:#fff; cursor:pointer; }
.general-view-option input { margin-top:.22rem; inline-size:1rem; block-size:1rem; flex:0 0 auto; }
.general-view-option span { display:grid; gap:.15rem; }
.general-view-option strong { font-size:.9rem; }
.general-view-option small { color:var(--muted, #667085); line-height:1.45; }
.general-share-view-form > .btn { align-self:center; justify-self:start; }
.public-share-view-tabs { display:flex; flex-wrap:wrap; justify-content:center; gap:.45rem; margin:.2rem 0 1rem; padding:.35rem; border:1px solid var(--border, #d9e2ec); border-radius:.85rem; background:#f7f9fc; }
.public-share-view-tab { display:inline-flex; align-items:center; justify-content:center; min-height:2.35rem; padding:.45rem .85rem; border-radius:.65rem; color:#344054; text-decoration:none; font-weight:800; border:1px solid transparent; }
.public-share-view-tab:hover { background:#fff; border-color:#d6deea; }
.public-share-view-tab.active { background:#173f6f; color:#fff; box-shadow:0 4px 12px rgba(23,63,111,.16); }
.public-share-view-heading { display:flex; align-items:center; justify-content:center; gap:.45rem; margin:0 0 .65rem; font-size:.88rem; }
.public-share-view-heading span { color:var(--muted, #667085); }
.public-general-matrix-wrap { max-height:none; }
.public-general-matrix { min-width:900px; }
.public-share-legends { margin-top:.7rem; }

@media (max-width: 760px) {
    .general-share-view-form { grid-template-columns:1fr; }
    .general-share-view-form > .btn { width:100%; justify-self:stretch; }
    .public-share-view-tabs { display:grid; grid-template-columns:1fr; }
    .public-share-view-tab { width:100%; }
    .public-general-matrix { min-width:820px; }
}

/* compact sharing workspace and deterministic WhatsApp launch */
.share-page-head { margin-bottom:.65rem; }
.share-command-bar { display:grid; grid-template-columns:auto minmax(260px,360px) minmax(240px,1fr); gap:.8rem 1rem; align-items:end; padding:.8rem 1rem; border-inline-start:4px solid #128c7e; }
.share-command-version { display:grid; gap:.15rem; min-width:180px; }
.share-command-version span,.field-label { font-size:.78rem; color:#66778a; font-weight:700; }
.share-command-version strong { color:#173a67; }
.whatsapp-mode-field.compact { min-width:0; }
.whatsapp-mode-field.compact select { min-height:38px; }
.share-command-bar .whatsapp-launch-note { align-self:center; margin:0; }
.compact-share-panel { gap:.75rem; }
.compact-view-form { grid-template-columns:repeat(3,minmax(150px,1fr)) auto; gap:.45rem; }
.general-view-option.compact-option { padding:.5rem .65rem; align-items:center; }
.general-view-option.compact-option input { margin-top:0; }
.general-share-primary-row { display:flex; gap:.55rem; flex-wrap:wrap; align-items:center; }
.general-share-primary-row > .general-share-workflow { flex:1 1 430px; }
.compact-workflow { padding:.55rem .7rem; }
.share-secondary-details { border-top:1px dashed #d9e2ec; padding-top:.5rem; }
.share-secondary-details summary { cursor:pointer; color:#45617f; font-weight:700; font-size:.84rem; }
.share-secondary-content { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin-top:.6rem; }
.share-secondary-content .general-share-url { flex:1 1 420px; min-width:220px; }
.teacher-share-workspace { display:grid; gap:.8rem; }
.teacher-share-toolbar { display:flex; justify-content:space-between; gap:1rem; align-items:center; flex-wrap:wrap; }
.teacher-share-toolbar h2 { margin:.15rem 0 0; }
.teacher-share-toolbar .eyebrow { color:#254f7f; font-size:.78rem; font-weight:800; }
.teacher-picker-row { display:flex; gap:.65rem; align-items:end; justify-content:space-between; flex-wrap:wrap; padding:.65rem .75rem; border:1px solid #dce5ef; border-radius:.8rem; background:#f8fafc; }
.teacher-picker-field { display:grid; gap:.3rem; flex:1 1 360px; }
.teacher-picker-field > span { font-size:.78rem; color:#52677e; font-weight:800; }
.teacher-picker-field select { width:100%; min-height:42px; }
.teacher-picker-nav { display:flex; gap:.4rem; flex-wrap:wrap; }
.compact-prepare-all { justify-self:start; }
.teacher-share-card { display:grid; gap:.75rem; padding:.9rem; border:1px solid #d6e0eb; border-radius:1rem; background:#fff; box-shadow:0 3px 14px rgba(25,55,90,.04); }
.teacher-share-card-head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; border-bottom:1px solid #e7edf4; padding-bottom:.65rem; }
.teacher-share-card-head > div:first-child { display:grid; gap:.2rem; }
.teacher-share-card-head > div:first-child strong { font-size:1.05rem; color:#15385f; }
.teacher-share-card-head > div:first-child small { color:#718096; }
.teacher-share-card-grid { display:grid; grid-template-columns:minmax(250px,1.1fr) minmax(180px,.8fr) minmax(250px,1fr); gap:.75rem; align-items:end; }
.teacher-share-card-grid > section { display:grid; gap:.35rem; align-content:start; min-width:0; }
.teacher-phone-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.4rem; }
.teacher-phone-form input { min-width:0 !important; width:100%; }
.teacher-share-send-section .sharing-primary-actions { align-items:flex-start; }
.teacher-link-details { margin-top:.1rem; }

@media (max-width: 980px) {
    .share-command-bar { grid-template-columns:1fr 1fr; }
    .share-command-bar .whatsapp-launch-note { grid-column:1/-1; }
    .compact-view-form { grid-template-columns:repeat(3,1fr); }
    .compact-view-form > .btn { grid-column:1/-1; justify-self:start; }
    .teacher-share-card-grid { grid-template-columns:1fr 1fr; }
    .teacher-share-send-section { grid-column:1/-1; }
}
@media (max-width: 680px) {
    .share-command-bar { grid-template-columns:1fr; }
    .share-command-bar .whatsapp-launch-note { grid-column:1; }
    .compact-view-form { grid-template-columns:1fr; }
    .compact-view-form > .btn { grid-column:1; width:100%; }
    .general-share-primary-row > .btn { flex:1 1 auto; }
    .teacher-picker-row { align-items:stretch; }
    .teacher-picker-nav { width:100%; }
    .teacher-picker-nav .btn { flex:1; }
    .teacher-share-card-head { flex-direction:column; }
    .teacher-share-card-grid { grid-template-columns:1fr; }
    .teacher-share-send-section { grid-column:1; }
    .teacher-share-card .sharing-primary-actions,
    .teacher-share-card .sharing-primary-actions > .btn,
    .teacher-share-card .share-confirm-block,
    .teacher-share-card .share-confirm-block form,
    .teacher-share-card .share-confirm-block .btn { width:100%; }
    .share-secondary-content { align-items:stretch; }
    .share-secondary-content form,
    .share-secondary-content form .btn { width:100%; }
}


/* WhatsApp native HTTPS links; no launcher JavaScript dependency */
.whatsapp-direct-help { display:grid; gap:.18rem; align-content:center; }
.whatsapp-direct-help > span { font-size:.78rem; color:#52677e; font-weight:800; }
.whatsapp-direct-help > strong { color:#0f766e; font-size:.9rem; }
@media (max-width:680px) {
    .general-share-workflow .sharing-primary-actions > .whatsapp-share-btn { width:100%; }
}

/* mobile/tablet shell + touch timetable editing */
.mobile-nav-toggle,
.mobile-nav-backdrop,
.mobile-bottom-nav { display:none; }
.drag-status-cancel { display:none; }

@media (max-width:1024px) {
  html.mobile-nav-lock,
  html.mobile-nav-lock body { overflow:hidden; }
  .app-shell { display:block; min-height:100vh; }
  .sidebar {
    position:fixed !important;
    top:0; right:0; bottom:0; left:auto;
    width:min(86vw,320px); height:100dvh !important;
    z-index:1200; overflow-y:auto !important; overscroll-behavior:contain;
    transform:translateX(105%); transition:transform .22s ease;
    box-shadow:-18px 0 46px rgba(5,20,38,.22);
    padding:18px 14px 28px;
  }
  .app-shell.mobile-nav-open .sidebar { transform:translateX(0); }
  .sidebar nav { grid-template-columns:1fr !important; }
  .sidebar nav a { min-height:46px; }
  .mobile-nav-backdrop {
    position:fixed; inset:0; z-index:1190; border:0; padding:0;
    background:rgba(4,16,31,.48); backdrop-filter:blur(2px); cursor:default;
  }
  .app-shell.mobile-nav-open .mobile-nav-backdrop { display:block; }
  .topbar {
    position:sticky !important; top:0; z-index:1000;
    min-height:58px; padding:7px 14px !important;
    display:grid; grid-template-columns:auto 1fr auto; gap:10px;
  }
  .mobile-nav-toggle {
    display:inline-flex; width:44px; height:44px; border:1px solid #d8e1eb; border-radius:11px;
    background:#fff; align-items:center; justify-content:center; flex-direction:column; gap:4px;
    padding:0; color:#173a67; box-shadow:0 3px 10px rgba(15,45,82,.06);
  }
  .mobile-nav-toggle span { display:block; width:20px; height:2px; border-radius:2px; background:currentColor; }
  .topbar-product { justify-self:start; }
  .topbar-user { justify-self:end; }
  .content { padding:18px 16px 30px !important; }
  .btn, button, select, input, textarea { touch-action:manipulation; }
  .btn { min-height:42px; }
  .btn.small { min-height:40px; }
}

@media (max-width:700px) {
  .topbar { grid-template-columns:auto 1fr; }
  .topbar-user { display:none; }
  .topbar-product { justify-self:end; }
  .topbar-product img { width:34px; height:34px; }
  .content { padding:14px 12px 92px !important; }
  .page-head { align-items:stretch; flex-direction:column; gap:12px; margin-bottom:14px; }
  .page-head h1 { font-size:1.35rem; margin-bottom:4px; }
  .page-head .actions { width:100%; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .page-head .actions > a,
  .page-head .actions > button,
  .page-head .actions > form { min-width:0; width:100%; }
  .page-head .actions > form .btn { width:100%; }
  .toolbar { display:grid; grid-template-columns:1fr; gap:10px; align-items:stretch; padding:12px; }
  .toolbar label { width:100%; min-width:0; }
  .toolbar select { width:100%; min-height:44px; }
  .selection-info { margin-inline-start:0; width:100%; display:grid; grid-template-columns:1fr 1fr; gap:7px; }
  .selection-info .btn { grid-column:1/-1; }
  .quality-inline-metrics { display:grid; grid-template-columns:1fr; }
  .approved-readonly .btn { width:100%; }
  .mobile-bottom-nav {
    position:fixed; right:8px; left:8px; bottom:max(8px, env(safe-area-inset-bottom)); z-index:1050;
    height:64px; display:grid; grid-template-columns:repeat(5,1fr); align-items:stretch;
    border:1px solid rgba(203,215,227,.96); border-radius:18px; background:rgba(255,255,255,.96);
    box-shadow:0 12px 36px rgba(9,35,66,.18); backdrop-filter:blur(18px); overflow:hidden;
  }
  .mobile-bottom-nav a,
  .mobile-bottom-nav button {
    border:0; background:transparent; color:#5c6f85; text-decoration:none; min-width:0;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:5px 2px;
    font-family:inherit;
  }
  .mobile-bottom-nav span { font-size:1.18rem; line-height:1; }
  .mobile-bottom-nav b { font-size:.68rem; white-space:nowrap; }
  .mobile-bottom-nav a.active { color:#173a67; background:#f3f7fc; }
}

/* keep the original horizontal timetable on touch devices.
   Mobile/tablet retain the desktop grid shape with native horizontal scrolling, while
   the tap-to-move/tap-to-swap controls from 6.8 remain available. */
@media (max-width:900px) {
  .edit-timetable-wrap {
    overflow-x:auto !important; overflow-y:visible;
    -webkit-overflow-scrolling:touch; overscroll-behavior-inline:contain;
    border:1px solid #dbe4ef; border-radius:14px; background:#fff;
    scrollbar-gutter:stable;
  }
  .edit-timetable-wrap .drag-timetable {
    min-width:1000px !important; width:100% !important; table-layout:fixed;
  }
  .edit-timetable-wrap .drag-timetable th.sticky {
    position:sticky !important; right:0; z-index:6;
    box-shadow:-6px 0 12px rgba(15,45,82,.06);
  }
  .edit-timetable-wrap .drag-timetable thead th.sticky { z-index:8; }
  .edit-timetable-wrap .drag-timetable .lesson-cell-stack { min-height:76px; }
  .edit-timetable-wrap .drag-timetable .lesson { min-height:70px; }
  .edit-timetable-wrap .drag-timetable .drag-target-overlay { border-radius:8px; }
  .drag-help { padding:10px 12px; margin-bottom:10px; }
  .drag-help > span:first-of-type { display:none; }
  .drag-help > b { font-size:.86rem; }
  .drag-help > b::after { content:' اضغط «نقل / تبديل» داخل الحصة، ثم اضغط الموضع الهدف.'; font-weight:500; color:#5f7186; }
  .drag-legend { width:100%; font-size:.72rem; justify-content:flex-start; }
  .drag-handle {
    display:flex !important; align-items:center; justify-content:center; width:100%; min-height:38px;
    margin-top:4px; padding:7px 9px; border-radius:8px; background:#e9f1fb; border:1px solid #c8d9ec;
    color:#173a67; opacity:1 !important; font-size:.78rem !important; font-weight:800; cursor:pointer;
  }
  /* 6.61-hf1: keep move/swap status away from the last timetable day.
     The status surface does not consume taps; only Cancel remains interactive. */
  .drag-status {
    position:fixed; z-index:1080;
    top:max(8px, env(safe-area-inset-top)); bottom:auto !important;
    left:50%; right:auto; transform:translateX(-50%);
    width:min(520px, calc(100vw - 20px)); margin:0 !important;
    display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:auto auto;
    column-gap:10px; row-gap:2px; align-items:center;
    padding:9px 10px 9px 12px; max-height:none; overflow:hidden;
    box-shadow:0 8px 24px rgba(8,30,56,.18);
    border-radius:12px; background:rgba(255,255,255,.97);
    backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
    pointer-events:none;
  }
  .drag-status > div:first-child {
    grid-column:1; grid-row:1; padding:0 !important; min-width:0;
  }
  .drag-status > div:first-child b { font-size:.82rem; line-height:1.2; }
  #drag-status-text {
    grid-column:1; grid-row:2; min-width:0;
    font-size:.74rem; line-height:1.35; color:#5f7186;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  .drag-status-cancel {
    display:inline-flex; position:static; grid-column:2; grid-row:1 / span 2;
    align-self:center; min-height:34px !important; padding:6px 10px !important;
    pointer-events:auto;
  }
  .draggable-lesson.is-dragging { outline:3px solid #2f78c7; outline-offset:1px; }
}

@media (max-width:700px) {
  .drag-status {
    top:max(6px, env(safe-area-inset-top)); bottom:auto !important;
    width:calc(100vw - 16px);
  }
}

/* 6.61-hf1 safety override: never anchor move/swap status at the bottom on touch layouts. */
@media screen and (max-width:900px) {
  #drag-status.drag-status { bottom:auto !important; }
}
@media screen {
  .lesson:disabled { opacity:1; cursor:default; }
}


/* WhatsApp contact: sidebar on desktop, floating shortcut on touch layouts only */
.app-whatsapp-contact {
    display: none;
    position: fixed;
    inset-inline-start: 18px;
    bottom: 18px;
    z-index: 930;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--line, #d7dde6);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .14);
    color: var(--text, #172033);
    text-decoration: none;
    font-weight: 700;
}
.app-whatsapp-contact img { width: 22px; height: 22px; flex: 0 0 auto; }
.app-whatsapp-contact:hover { transform: translateY(-1px); box-shadow: 0 10px 28px rgba(15, 23, 42, .18); }
@media (max-width: 900px) {
    .app-whatsapp-contact {
        display: inline-flex;
        bottom: calc(74px + env(safe-area-inset-bottom));
        inset-inline-start: 12px;
        width: 46px;
        height: 46px;
        min-height: 46px;
        padding: 10px;
        justify-content: center;
    }
    .app-whatsapp-contact span { display: none; }
    .app-whatsapp-contact img { width: 25px; height: 25px; }
}
/* 6.13 — distinguish authenticated-but-forbidden routes from unauthenticated access. */
.access-denied { text-align: center; }
.access-denied-code {
    width: 72px;
    height: 72px;
    margin: 0 auto 14px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: .04em;
    background: rgba(185, 28, 28, .08);
    border: 1px solid rgba(185, 28, 28, .18);
    color: #991b1b;
}
.access-denied .hint { max-width: 430px; margin-inline: auto; }



/* Session inactivity warning. Keep this independent from timetable/editor interaction layers. */
.session-guard{position:relative;z-index:1400}
.session-warning[hidden]{display:none!important}
.session-warning{position:fixed;top:max(14px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(620px,calc(100vw - 28px));display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 18px;border-radius:14px;background:#fff8df;border:1px solid #d8b85f;color:#3a2c0b;box-shadow:0 18px 45px rgba(7,17,31,.24);z-index:1401}
.session-warning>div:first-child{display:flex;flex-direction:column;gap:3px}
.session-warning>div:first-child span{font-size:.9rem}
.session-warning-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.session-warning-actions form{margin:0}
@media (max-width:700px){.session-warning{top:max(10px,env(safe-area-inset-top));align-items:stretch;flex-direction:column;gap:10px}.session-warning-actions{width:100%}.session-warning-actions .btn,.session-warning-actions form{flex:1}.session-warning-actions form .btn{width:100%}}


/* Registration and license-visibility UI. Keep public cache identifiers opaque. */
.registration-stage { max-width: 680px; margin: 1.5rem auto; }
.registration-card { display: grid; gap: 1rem; }
.registration-step { font-size: .86rem; font-weight: 700; opacity: .72; }
.registration-links, .registration-secondary-actions { display: flex; gap: .65rem; flex-wrap: wrap; align-items: center; }
.registration-privacy-note { font-size: .88rem; opacity: .78; line-height: 1.7; }
.verification-code-input { direction: ltr; text-align: center; letter-spacing: .42rem; font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.registration-admin-panel { margin-bottom: 1rem; }
.registration-settings-form { display: grid; gap: .9rem; }
.registration-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1rem; }
.registration-settings-grid > * { min-width: 0; }
.school-admin-email { display: block; margin-top: .2rem; opacity: .72; direction: ltr; text-align: start; overflow-wrap: anywhere; }
.school-license-visibility-note { margin: -.3rem 0 1rem; font-size: .86rem; opacity: .74; }
@media (max-width: 720px) {
  .registration-stage { margin: .75rem auto; }
  .registration-settings-grid { grid-template-columns: 1fr; }
  .verification-code-input { letter-spacing: .28rem; }
}

/* Account contact details (6.19). */
.account-contact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; align-items:start; }
.account-contact-card { min-width:0; padding:1rem; border:1px solid rgba(148,163,184,.28); border-radius:14px; background:rgba(255,255,255,.62); }
.account-contact-card h3 { margin-top:0; }
.contact-verification-state { margin-top:.7rem; font-size:.9rem; opacity:.8; }
@media (max-width:720px) { .account-contact-grid { grid-template-columns:1fr; } }


/* Calm login recovery and self-service password reset. */
.login-password-actions { display:flex; justify-content:flex-start; margin-top:-.35rem; }
.login-password-actions a { font-size:.9rem; font-weight:750; text-decoration:none; }
.login-password-actions a:hover { text-decoration:underline; }
.login-entry-divider { display:flex; align-items:center; gap:.7rem; color:#7a8797; font-size:.82rem; margin:.2rem 0; }
.login-entry-divider::before, .login-entry-divider::after { content:""; height:1px; background:rgba(148,163,184,.32); flex:1; }
.login-registration-link { justify-content:center; }
.login-create-school { min-height:40px; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
.login-forgot-hint { margin:.15rem 0 0; font-size:.82rem; line-height:1.65; opacity:.7; }
/* Password-recovery pages reuse the full login grid. Do not cap the whole grid to 680px:
   its two minimum-width columns would overflow and push the recovery card off-screen. */
.recovery-stage { width:100%; max-width:none; margin:0; }
.recovery-card { display:grid; gap:1rem; min-width:0; }
.recovery-stage .login-brand-panel { min-width:0; }
.recovery-back { text-align:center; font-size:.9rem; }
.recovery-back a { text-decoration:none; font-weight:700; }
.recovery-back a:hover { text-decoration:underline; }
@media (max-width:720px) { .recovery-stage { margin:0; } }

/* v0.9.0-rc8.25.7.6.21 — public virtual tour. Isolated from tenant/application UI. */
.login-tour-cta {
  display:flex; flex-direction:column; align-items:flex-start; width:max-content; max-width:100%;
  margin-top:18px; padding:10px 16px; color:#f8fbff; border-color:rgba(211,165,76,.55);
  background:rgba(7,27,53,.52); box-shadow:0 10px 26px rgba(0,0,0,.12); text-decoration:none;
}
.login-tour-cta span { font-weight:800; font-size:13px; }
.login-tour-cta small { margin-top:3px; color:#afc1d4; font-size:9px; }
.login-tour-cta:hover { border-color:#d3a54c; background:rgba(14,45,79,.72); }

.tour-stage {
  min-height:100vh; direction:rtl; color:#243b58;
  background:linear-gradient(145deg,#f5f8fb 0%,#eef3f8 58%,#f8fafc 100%);
}
.tour-topbar {
  min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:12px clamp(18px,4vw,54px); position:sticky; top:0; z-index:30;
  background:rgba(7,27,53,.97); border-bottom:1px solid rgba(211,165,76,.24);
  box-shadow:0 10px 28px rgba(3,18,37,.12); backdrop-filter:blur(14px);
}
.tour-brand { display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; min-width:0; }
.tour-brand img { width:48px; height:48px; object-fit:contain; }
.tour-brand span,.tour-brand strong,.tour-brand small { display:block; }
.tour-brand strong { color:#d3a54c; font-size:19px; }
.tour-brand small { margin-top:2px; color:#9fb1c5; font-size:9px; letter-spacing:.4px; }
.tour-top-actions { display:flex; align-items:center; gap:9px; flex-wrap:wrap; justify-content:flex-end; }
.tour-top-actions .btn { color:#e7eef6; border-color:rgba(255,255,255,.22); background:rgba(255,255,255,.04); }
.tour-top-actions .btn.primary { background:linear-gradient(135deg,#b9832c,#d3a54c); border-color:#d3a54c; color:#071b35; }
.tour-demo-badge { border:1px solid rgba(211,165,76,.30); color:#d9e4ef; background:rgba(211,165,76,.07); border-radius:999px; padding:7px 11px; font-size:10px; font-weight:700; }

.tour-shell { display:grid; grid-template-columns:260px minmax(0,1fr); min-height:calc(100vh - 74px); direction:rtl; }
.tour-sidebar {
  background:linear-gradient(180deg,#0b2848,#071b35); color:#dce7f2; padding:22px 16px;
  border-left:1px solid rgba(211,165,76,.18); display:flex; flex-direction:column; gap:18px;
}
.tour-school-card { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid rgba(211,165,76,.18); border-radius:14px; background:rgba(255,255,255,.035); }
.tour-school-mark { width:38px; height:38px; border-radius:11px; display:grid; place-items:center; flex:0 0 auto; background:linear-gradient(145deg,#d3a54c,#9d6d20); color:#071b35; font-weight:900; }
.tour-school-card strong,.tour-school-card small { display:block; }
.tour-school-card strong { color:#fff; font-size:12px; }
.tour-school-card small { color:#91a5ba; font-size:9px; margin-top:3px; }
.tour-sidebar nav { display:grid; gap:5px; }
.tour-sidebar nav a { display:flex; align-items:center; gap:10px; min-height:44px; padding:9px 11px; border-radius:10px; color:#b9c9d9; text-decoration:none; border:1px solid transparent; }
.tour-sidebar nav a span { width:24px; text-align:center; color:#d3a54c; font-size:17px; }
.tour-sidebar nav a b { font-size:11px; }
.tour-sidebar nav a:hover,.tour-sidebar nav a.active { color:#fff; background:rgba(255,255,255,.07); border-color:rgba(211,165,76,.20); }
.tour-sidebar nav a.active { box-shadow:inset -3px 0 #d3a54c; }
.tour-sidebar-cta { margin-top:auto; display:grid; gap:7px; padding:14px; border-radius:14px; background:rgba(211,165,76,.09); border:1px solid rgba(211,165,76,.20); }
.tour-sidebar-cta strong { color:#f4d18a; font-size:12px; }
.tour-sidebar-cta span { color:#9fb2c7; font-size:9px; line-height:1.7; }
.tour-sidebar-cta .btn { margin-top:4px; color:#fff; text-align:center; }

.tour-workspace { min-width:0; padding:24px clamp(18px,3.3vw,44px) 34px; }
.tour-context-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; }
.tour-context-bar > div { display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; }
.tour-context-kicker { color:#9f7424; font-size:10px; font-weight:800; }
.tour-context-bar strong { color:#132f51; font-size:14px; }
.tour-context-note { color:#72859b; font-size:9px; }

.tour-hero-card {
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr); gap:28px; align-items:center;
  padding:clamp(24px,4vw,44px); border-radius:22px; color:#fff; overflow:hidden; position:relative;
  background:radial-gradient(circle at 92% 10%,rgba(211,165,76,.16),transparent 30%),linear-gradient(135deg,#071b35,#0d355e);
  box-shadow:0 22px 48px rgba(6,28,53,.13);
}
.tour-hero-card::after { content:""; position:absolute; left:-120px; bottom:-150px; width:320px; height:320px; border:1px solid rgba(211,165,76,.13); border-radius:50%; }
.tour-eyebrow { display:inline-block; color:#d3a54c; font-weight:800; font-size:10px; margin-bottom:6px; }
.tour-hero-card h1,.tour-section-head h1 { margin:3px 0 9px; }
.tour-hero-card h1 { color:#fff; font-size:clamp(26px,3vw,39px); line-height:1.3; }
.tour-hero-card p { color:#b8c8d8; max-width:640px; line-height:1.9; font-size:13px; }
.tour-hero-actions { display:flex; gap:9px; flex-wrap:wrap; margin-top:18px; }
.tour-hero-actions .btn { color:#eaf1f7; border-color:rgba(255,255,255,.21); background:rgba(255,255,255,.04); }
.tour-hero-actions .btn.primary { background:linear-gradient(135deg,#b9832c,#d3a54c); color:#071b35; border-color:#d3a54c; }
.tour-mini-timetable { position:relative; z-index:1; border:1px solid rgba(211,165,76,.25); border-radius:17px; padding:13px; background:rgba(4,20,40,.55); box-shadow:0 18px 36px rgba(0,0,0,.20); }
.tour-mini-head { display:flex; justify-content:space-between; gap:10px; padding:4px 3px 11px; }
.tour-mini-head strong { font-size:11px; }
.tour-mini-head span { color:#a7bacd; font-size:8px; }
.tour-mini-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.tour-mini-grid span { min-height:54px; display:grid; place-items:center; text-align:center; border-radius:9px; color:#d9e6f1; font-size:9px; font-weight:700; background:rgba(255,255,255,.065); border:1px solid rgba(255,255,255,.07); }
.tour-mini-grid span:nth-child(2n) { background:rgba(211,165,76,.10); }

.tour-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:16px 0; }
.tour-metrics article { min-width:0; padding:17px; border-radius:15px; background:#fff; border:1px solid #dce5ee; box-shadow:0 8px 22px rgba(15,45,75,.04); }
.tour-metrics span,.tour-metrics b,.tour-metrics small { display:block; }
.tour-metrics span { color:#9f7424; font-size:25px; font-weight:900; }
.tour-metrics b { color:#1d3858; margin-top:3px; font-size:11px; }
.tour-metrics small { color:#8797a8; margin-top:4px; font-size:8px; }

.tour-feature-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.tour-feature-grid a { min-width:0; display:flex; gap:12px; align-items:center; padding:16px; border:1px solid #dce5ee; border-radius:15px; background:#fff; text-decoration:none; color:inherit; transition:transform .15s ease,border-color .15s ease; }
.tour-feature-grid a:hover { transform:translateY(-2px); border-color:#d3a54c; }
.tour-feature-icon { min-width:43px; height:43px; padding:0 7px; display:grid; place-items:center; border-radius:11px; color:#9f7424; background:#fbf5e8; font-size:10px; font-weight:900; letter-spacing:.4px; }
.tour-feature-grid strong,.tour-feature-grid small { display:block; }
.tour-feature-grid strong { color:#1c3859; font-size:11px; }
.tour-feature-grid small { color:#7b8da0; font-size:8px; line-height:1.65; margin-top:4px; }

.tour-section-head { display:flex; justify-content:space-between; align-items:flex-end; gap:18px; margin-bottom:16px; }
.tour-section-head h1 { color:#153657; font-size:27px; }
.tour-section-head p { color:#74879a; font-size:11px; margin:0; }
.tour-status { display:flex; align-items:center; gap:7px; border:1px solid #cde8df; background:#f0faf7; color:#16745f; border-radius:999px; padding:8px 11px; font-size:9px; font-weight:800; white-space:nowrap; }
.tour-status span { width:7px; height:7px; border-radius:50%; background:#16a085; box-shadow:0 0 0 4px rgba(22,160,133,.11); }
.tour-table-card,.tour-list-card,.tour-import-card,.tour-whatsapp-preview,.tour-report-print { background:#fff; border:1px solid #dce5ee; border-radius:17px; box-shadow:0 8px 24px rgba(15,45,75,.045); }
.tour-table-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px 17px; border-bottom:1px solid #e4ebf2; }
.tour-table-toolbar strong,.tour-table-toolbar small { display:block; }
.tour-table-toolbar strong { font-size:11px; color:#1b3b5e; }
.tour-table-toolbar small { color:#8595a6; font-size:8px; margin-top:3px; }
.tour-table-chips { display:flex; gap:6px; flex-wrap:wrap; }
.tour-table-chips span { border-radius:999px; padding:6px 9px; background:#f3f6f9; border:1px solid #dce5ee; color:#5d7289; font-size:8px; }
.tour-table-scroll { overflow-x:auto; }
.tour-timetable { width:100%; min-width:760px; border-collapse:collapse; table-layout:fixed; }
.tour-timetable th,.tour-timetable td { border:1px solid #e0e7ef; padding:10px 7px; text-align:center; vertical-align:middle; }
.tour-timetable thead th { color:#244564; background:#edf3f8; font-size:9px; }
.tour-timetable tbody th { width:54px; color:#8b6a2c; background:#fbf7ed; font-size:9px; }
.tour-timetable td { height:62px; background:#fff; }
.tour-timetable td:nth-child(2n) { background:#fbfcfe; }
.tour-timetable td strong,.tour-timetable td small { display:block; }
.tour-timetable td strong { color:#224769; font-size:9px; }
.tour-timetable td small { color:#8b9cac; margin-top:4px; font-size:7px; }
.tour-table-note { padding:11px 16px; color:#7a8c9e; background:#f8fafc; border-top:1px solid #e5ebf2; border-radius:0 0 17px 17px; font-size:8px; line-height:1.7; }

.tour-dual-grid,.tour-import-grid,.tour-share-layout { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.tour-list-card { padding:15px; }
.tour-list-title { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:2px 2px 12px; border-bottom:1px solid #e6ecf2; }
.tour-list-title strong { color:#173858; font-size:12px; }
.tour-list-title span { color:#8597a8; font-size:8px; }
.tour-person-row,.tour-section-row,.tour-share-row { display:flex; align-items:center; gap:10px; min-height:57px; padding:9px 2px; border-bottom:1px solid #eef2f6; }
.tour-person-row:last-child,.tour-section-row:last-child,.tour-share-row:last-child { border-bottom:0; }
.tour-person-row > div,.tour-section-row > div,.tour-share-row > div { min-width:0; flex:1; }
.tour-person-row strong,.tour-person-row small,.tour-section-row strong,.tour-section-row small,.tour-share-row strong,.tour-share-row small { display:block; }
.tour-person-row strong,.tour-section-row strong,.tour-share-row strong { color:#23415f; font-size:10px; }
.tour-person-row small,.tour-section-row small,.tour-share-row small { color:#8596a7; font-size:8px; margin-top:3px; }
.tour-person-row > b,.tour-section-row > b { color:#93702d; background:#fbf5e8; border-radius:999px; padding:5px 8px; font-size:7px; }
.tour-avatar { width:36px; height:36px; border-radius:50%; display:grid; place-items:center; flex:0 0 auto; color:#8a6523; background:#fbf5e8; font-weight:900; }
.tour-section-row > span:first-child { color:#a47a2d; font-size:18px; }

.tour-import-card { padding:22px; position:relative; overflow:hidden; }
.tour-import-icon { width:52px; height:52px; display:grid; place-items:center; border-radius:13px; color:#9b7126; background:#fbf4e4; border:1px solid #ead7ad; font-size:9px; font-weight:900; letter-spacing:.4px; }
.tour-import-card h2 { margin:13px 0 7px; color:#193959; font-size:16px; }
.tour-import-card p { color:#74879a; font-size:10px; line-height:1.8; min-height:38px; }
.tour-file-row { display:flex; align-items:center; gap:10px; padding:11px; margin:14px 0; background:#f8fafc; border:1px dashed #cdd9e5; border-radius:12px; }
.tour-file-row > div { flex:1; min-width:0; }
.tour-file-row strong,.tour-file-row small { display:block; direction:ltr; text-align:right; }
.tour-file-row strong { color:#334f6d; font-size:9px; }
.tour-file-row small { color:#8a9aaa; font-size:7px; margin-top:3px; direction:rtl; }
.tour-file-row > b { color:#187862; font-size:7px; }
.tour-import-result { display:grid; gap:3px; margin-top:11px; padding:10px 12px; border-radius:10px; background:#f0faf7; border:1px solid #cce8df; }
.tour-import-result strong { color:#16745f; font-size:9px; }
.tour-import-result span { color:#668679; font-size:8px; }
.tour-highlight { display:flex; align-items:flex-start; gap:12px; padding:16px; margin-top:16px; border-radius:15px; border:1px solid #ead9b5; background:#fffbf2; }
.tour-highlight > span { color:#b17d25; font-size:20px; }
.tour-highlight strong { color:#6f551e; font-size:11px; }
.tour-highlight p { color:#8b7954; font-size:9px; margin:4px 0 0; }

.tour-report-options { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:15px; }
.tour-report-options article { display:flex; gap:10px; align-items:center; padding:13px; border-radius:13px; background:#fff; border:1px solid #dde6ef; }
.tour-report-options article > span { width:35px; height:35px; display:grid; place-items:center; border-radius:9px; background:#fbf5e8; color:#9b7229; font-size:9px; font-weight:900; }
.tour-report-options strong,.tour-report-options small { display:block; }
.tour-report-options strong { color:#25435f; font-size:9px; }
.tour-report-options small { color:#8a9aaa; font-size:7px; margin-top:3px; }
.tour-report-print { position:relative; padding:20px; overflow:hidden; }
.tour-report-print::after { content:"JADWALE"; position:absolute; inset:45% auto auto 50%; transform:translate(-50%,-50%) rotate(-11deg); color:#173b5d; opacity:.035; font-size:70px; font-weight:900; pointer-events:none; }
.tour-print-brand { display:flex; direction:ltr; align-items:center; gap:9px; border-bottom:1px solid #dfe6ed; padding-bottom:8px; }
.tour-print-brand img { width:42px; height:42px; }
.tour-print-brand strong,.tour-print-brand small { display:block; }
.tour-print-brand strong { color:#9f7424; font-size:13px; letter-spacing:1.1px; }
.tour-print-brand small { color:#7e8e9e; font-size:7px; direction:rtl; }
.tour-print-title { text-align:center; margin:14px 0; }
.tour-print-title h2 { color:#183957; margin:0; font-size:17px; }
.tour-print-title p { color:#7b8d9f; font-size:8px; margin:4px 0 0; }
.tour-print-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.tour-print-table th,.tour-print-table td { border:1px solid #dbe3eb; text-align:center; padding:8px 4px; font-size:8px; }
.tour-print-table th { background:#edf3f8; color:#294a69; }
.tour-print-table tbody th { background:#f8f4eb; color:#80642a; }
.tour-print-footer { text-align:center; border-top:1px solid #e1e7ed; margin-top:10px; padding-top:7px; color:#8b99a8; font-size:7px; }

.tour-whatsapp-preview { min-height:385px; padding:16px; background:linear-gradient(145deg,#f7faf8,#edf7f1); }
.tour-wa-head { display:flex; align-items:center; gap:10px; border-bottom:1px solid #d8e7dd; padding-bottom:12px; }
.tour-wa-head > span { width:39px; height:39px; display:grid; place-items:center; border-radius:50%; background:#1a9b65; color:#fff; font-weight:900; font-size:9px; }
.tour-wa-head strong,.tour-wa-head small { display:block; }
.tour-wa-head strong { color:#245542; font-size:11px; }
.tour-wa-head small { color:#739281; font-size:7px; margin-top:3px; }
.tour-wa-message { max-width:84%; margin:22px 0 15px auto; padding:13px; border-radius:13px 13px 3px 13px; background:#dff4e6; box-shadow:0 5px 16px rgba(33,91,63,.06); }
.tour-wa-message strong { color:#245b44; font-size:10px; }
.tour-wa-message p { color:#456d59; font-size:9px; line-height:1.8; }
.tour-wa-message small { color:#7a9b89; font-size:7px; }
.tour-wa-empty { min-height:260px; display:grid; place-items:center; align-content:center; gap:8px; color:#7c9a8a; text-align:center; }
.tour-wa-empty span { font-size:30px; }
.tour-wa-empty p { font-size:9px; }
.tour-share-row .btn { flex:0 0 auto; font-size:8px; padding:6px 8px; }

.tour-bottom-cta { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:18px; padding:16px 18px; border-radius:15px; color:#dce7f2; background:#0a294a; border:1px solid rgba(211,165,76,.19); }
.tour-bottom-cta strong,.tour-bottom-cta span { display:block; }
.tour-bottom-cta strong { color:#fff; font-size:11px; }
.tour-bottom-cta span { color:#91a7bc; font-size:8px; margin-top:3px; }
.tour-bottom-cta > div:last-child { display:flex; gap:8px; flex-wrap:wrap; }
.tour-bottom-cta .btn { color:#e5edf5; border-color:rgba(255,255,255,.22); }
.tour-bottom-cta .btn.primary { color:#071b35; background:linear-gradient(135deg,#b9832c,#d3a54c); border-color:#d3a54c; }

@media (max-width:1100px) {
  .tour-shell { grid-template-columns:220px minmax(0,1fr); }
  .tour-hero-card { grid-template-columns:1fr; }
  .tour-metrics,.tour-feature-grid,.tour-report-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .login-tour-cta { margin-inline:auto; align-items:center; }
  .tour-topbar { position:static; align-items:flex-start; }
  .tour-demo-badge { display:none; }
  .tour-shell { display:block; }
  .tour-sidebar { padding:12px; border-left:0; border-bottom:1px solid rgba(211,165,76,.18); }
  .tour-school-card,.tour-sidebar-cta { display:none; }
  .tour-sidebar nav { grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
  .tour-sidebar nav a { justify-content:center; flex-direction:column; min-height:58px; gap:3px; text-align:center; padding:6px; }
  .tour-sidebar nav a b { font-size:8px; }
  .tour-sidebar nav a.active { box-shadow:inset 0 -3px #d3a54c; }
  .tour-workspace { padding:17px 13px 28px; }
  .tour-context-bar,.tour-section-head,.tour-bottom-cta { align-items:flex-start; flex-direction:column; }
  .tour-context-note { display:none; }
  .tour-hero-card { padding:22px 17px; }
  .tour-metrics,.tour-feature-grid,.tour-dual-grid,.tour-import-grid,.tour-share-layout,.tour-report-options { grid-template-columns:1fr; }
  .tour-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tour-report-print { padding:12px; overflow-x:auto; }
  .tour-print-table { min-width:690px; }
  .tour-bottom-cta > div:last-child { width:100%; }
}
@media (max-width:480px) {
  .tour-topbar { padding:10px 12px; }
  .tour-brand small { display:none; }
  .tour-top-actions .btn:not(.primary) { display:none; }
  .tour-sidebar nav { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tour-metrics { grid-template-columns:1fr 1fr; }
  .tour-mini-grid { grid-template-columns:repeat(2,1fr); }
}

@media print {
  .tour-stage { min-height:0 !important; background:#fff !important; color:#111 !important; }
  .tour-topbar,.tour-sidebar,.tour-context-bar,.tour-section-head,.tour-report-options,.tour-bottom-cta { display:none !important; }
  .tour-shell { display:block !important; min-height:0 !important; }
  .tour-workspace { padding:0 !important; }
  .tour-workspace > * { display:none !important; }
  .tour-workspace > .tour-report-print { display:block !important; border:0 !important; box-shadow:none !important; padding:4mm !important; }
  .tour-report-print::after { opacity:.045 !important; font-size:54pt !important; }
  .tour-print-brand img { width:16mm !important; height:16mm !important; }
  .tour-print-brand strong { font-size:12pt !important; }
  .tour-print-brand small { font-size:6pt !important; }
  .tour-print-title h2 { font-size:14pt !important; }
  .tour-print-title p { font-size:7pt !important; }
  .tour-print-table th,.tour-print-table td { padding:2.2mm 1mm !important; font-size:7pt !important; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .tour-print-footer { font-size:5.5pt !important; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.22 — modern public entry + richer virtual tour
   ============================================================ */
.login-stage-modern {
  grid-template-columns:minmax(470px,1.18fr) minmax(390px,.82fr);
  padding:clamp(28px,4vw,58px) clamp(28px,6vw,88px);
  gap:clamp(34px,6vw,92px);
  background:
    radial-gradient(circle at 78% 18%,rgba(48,108,168,.18),transparent 26%),
    radial-gradient(circle at 17% 82%,rgba(200,157,74,.10),transparent 28%),
    linear-gradient(145deg,#071a31 0%,#0d2a4b 56%,#102f52 100%);
}
.login-stage-modern .login-digital-bg { opacity:.72; }
.login-stage-modern .login-digital-bg::before,
.login-stage-modern .login-digital-bg::after { border-color:rgba(200,157,74,.10); }
.login-brand-modern { max-width:760px; color:#fff; }
.login-brand-modern .jw-brand-lockup.hero { max-width:340px; margin:0 0 20px auto; }
.login-brand-modern .jw-brand-lockup.hero .jw-emblem { width:58%; max-width:190px; }
.login-brand-modern .jw-brand-lockup.hero .jw-product-name { color:#d8ad5d; font-size:32px; }
.login-brand-modern .jw-brand-lockup.hero .jw-descriptor { color:#9fb2c8; font-size:8px; letter-spacing:2.7px; }
.login-brand-copy { text-align:right; max-width:710px; margin-right:auto; }
.login-brand-eyebrow { display:inline-flex; padding:6px 11px; border:1px solid rgba(216,173,93,.35); border-radius:999px; color:#edc981; background:rgba(216,173,93,.07); font-size:11px; font-weight:800; }
.login-brand-modern h2 { margin:15px 0 10px; color:#fff; font-size:clamp(31px,3.2vw,52px); line-height:1.25; letter-spacing:-1px; }
.login-brand-modern p { max-width:680px; color:#c4d2e2; font-size:16px; line-height:1.9; }
.login-feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; margin-top:24px; max-width:750px; }
.login-feature-card { min-height:92px; display:flex; align-items:center; gap:11px; padding:14px; border:1px solid rgba(255,255,255,.13); border-radius:15px; background:rgba(4,20,38,.34); box-shadow:inset 0 1px 0 rgba(255,255,255,.035); color:#eef5fb; text-decoration:none; transition:.18s ease; }
.login-feature-card > span { flex:0 0 38px; height:38px; display:grid; place-items:center; border:1px solid rgba(216,173,93,.35); border-radius:11px; color:#efc56f; background:rgba(216,173,93,.08); font-size:12px; font-weight:900; direction:ltr; }
.login-feature-card strong,.login-feature-card small { display:block; }
.login-feature-card strong { color:#fff; font-size:13px; }
.login-feature-card small { margin-top:4px; color:#9fb3c9; font-size:10px; line-height:1.5; }
.login-feature-card.accent { border-color:rgba(216,173,93,.34); background:linear-gradient(135deg,rgba(216,173,93,.10),rgba(4,20,38,.36)); }
.login-feature-card.tour-card { border-color:rgba(216,173,93,.6); background:linear-gradient(135deg,rgba(193,137,43,.24),rgba(11,44,77,.48)); }
.login-feature-card.tour-card:hover { transform:translateY(-2px); border-color:#e1b35d; box-shadow:0 10px 28px rgba(0,0,0,.16); }
.login-card-modern { width:min(440px,100%); padding:30px 32px; border:1px solid rgba(255,255,255,.62); background:rgba(255,255,255,.965); box-shadow:0 30px 80px rgba(0,0,0,.28); }
.login-card-modern::before { background:linear-gradient(90deg,#d5a24b,#f3d18b,#b87b21); }
.login-card-brand { display:flex; align-items:center; justify-content:center; gap:10px; direction:ltr; margin-bottom:14px; }
.login-card-modern .login-card-mark { width:52px; height:52px; margin:0; }
.login-card-modern .login-card-title { text-align:left; margin:0; }
.login-card-modern .login-card-title strong { color:#1b3657; font-size:13px; }
.login-card-modern h1 { font-size:28px; margin-top:7px; }
.login-card-modern .login-form input { min-height:49px; border-radius:10px; }
.login-card-modern .login-main-button { min-height:48px; background:linear-gradient(135deg,#c58b2f,#dfad58); border-color:#c28a32; box-shadow:0 9px 20px rgba(174,118,35,.22); }
.login-create-school-visible { width:100%; min-height:46px; display:flex; align-items:center; justify-content:center; font-weight:800; border-color:#284e78; background:#fff; color:#183b62; text-decoration:none; }
.login-tour-mobile { display:none; width:100%; margin-top:9px; text-align:center; text-decoration:none; }
.login-entry-divider { display:flex; align-items:center; gap:12px; margin:15px 0 12px; color:#8b99a8; font-size:11px; }
.login-entry-divider::before,.login-entry-divider::after { content:""; height:1px; flex:1; background:#e2e8ef; }
.login-password-actions { margin-top:-2px; text-align:right; }
.login-password-actions a { color:#1c4e83; font-weight:750; font-size:12px; text-decoration:none; }
.login-password-actions a:hover { text-decoration:underline; }
.login-forgot-hint { margin:12px 0 0; color:#8794a3; font-size:10px; line-height:1.65; text-align:center; }

.tour-feature-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
.tour-editor-heading { align-items:center; }
.tour-editor-actions { display:flex; gap:8px; flex-wrap:wrap; }
.tour-editor-guide { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; margin-bottom:13px; }
.tour-editor-guide > div { display:grid; grid-template-columns:38px 1fr; column-gap:10px; align-items:center; padding:12px 14px; border:1px solid #d9e3ed; border-radius:14px; background:#fff; }
.tour-editor-guide > div > span { grid-row:1/3; width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:#eef3f8; color:#173c65; font-weight:900; }
.tour-editor-guide strong,.tour-editor-guide small { display:block; }
.tour-editor-guide small { color:#718398; font-size:10px; margin-top:3px; }
.tour-editor-status { margin:0 0 13px; padding:11px 14px; border-radius:11px; border:1px solid #d8e3ee; background:#f7fafc; color:#48627e; font-size:12px; font-weight:700; }
.tour-editor-status[data-tone="ok"] { border-color:#b9dfd2; background:#edf9f5; color:#11715d; }
.tour-editor-status[data-tone="warn"] { border-color:#efd49c; background:#fff8e8; color:#8b641a; }
.tour-chain-preview { display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:13px; padding:13px; border:1px solid #dac28d; border-radius:14px; background:linear-gradient(135deg,#fffaf0,#f7f9fc); }
.tour-chain-step { min-width:0; flex:1; display:flex; align-items:center; gap:9px; padding:10px; border:1px solid #e1e7ee; border-radius:11px; background:#fff; }
.tour-chain-step > span { width:29px; height:29px; display:grid; place-items:center; flex:0 0 29px; border-radius:50%; background:#edf2f7; color:#1b426e; font-weight:900; }
.tour-chain-step strong,.tour-chain-step small { display:block; }
.tour-chain-step small { margin-top:3px; color:#7a8999; font-size:9px; }
.tour-chain-step.success { border-color:#b6ddcf; }
.tour-chain-step.success > span { background:#e5f7f1; color:#08735c; }
.tour-chain-arrow { color:#b3893f; font-size:20px; font-weight:900; }
.tour-editor-card { border:1px solid #d7e0e9; border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 10px 28px rgba(15,43,72,.05); }
.tour-editor-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 15px; border-bottom:1px solid #e1e8ef; background:#f8fafc; }
.tour-editor-toolbar strong,.tour-editor-toolbar small { display:block; }
.tour-editor-toolbar small { margin-top:3px; color:#7c8b9c; font-size:9px; }
.tour-editor-pills { display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.tour-editor-pills span { padding:5px 8px; border:1px solid #d6e0ea; border-radius:999px; background:#fff; color:#536a83; font-size:9px; font-weight:800; }
.tour-edit-slot { min-width:150px; padding:6px !important; background:#f8fafc; transition:.16s ease; }
.tour-lesson-card { position:relative; min-height:80px; display:flex; flex-direction:column; justify-content:center; gap:3px; padding:11px 34px 10px 10px; border:1px solid #ccd9e5; border-radius:11px; background:linear-gradient(145deg,#fff,#f2f6fa); cursor:grab; user-select:none; box-shadow:0 3px 10px rgba(12,47,82,.05); transition:.15s ease; }
.tour-lesson-card:active { cursor:grabbing; }
.tour-lesson-card strong { color:#173b63; font-size:12px; }
.tour-lesson-card small { color:#677d94; font-size:9px; }
.tour-lesson-card em { color:#9a7a38; font-size:8px; font-style:normal; margin-top:2px; }
.tour-lock-button { position:absolute; top:6px; right:6px; width:24px; height:24px; display:grid; place-items:center; padding:0; border:0; border-radius:7px; background:#eef3f7; cursor:pointer; font-size:12px; }
.tour-lesson-card.tour-locked { border-color:#dcc78f; background:#fffaf0; cursor:not-allowed; }
.tour-lesson-card.tour-dragging { opacity:.46; transform:scale(.98); }
.tour-edit-slot.tour-drop-target { background:#eaf4ff; outline:2px dashed #5e8cbc; outline-offset:-4px; }
.tour-edit-slot.tour-selected-slot { background:#fff6df; outline:2px solid #d4a64f; outline-offset:-3px; }
.tour-lesson-card.tour-just-moved { animation:tourMoved .85s ease; }
@keyframes tourMoved { 0%{box-shadow:0 0 0 0 rgba(21,132,108,.35)} 50%{box-shadow:0 0 0 7px rgba(21,132,108,.10)} 100%{box-shadow:0 3px 10px rgba(12,47,82,.05)} }

@media (max-width:1100px) {
  .login-stage-modern { grid-template-columns:1fr 420px; padding-inline:28px; gap:32px; }
  .login-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tour-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .login-stage-modern { grid-template-columns:1fr; padding:26px 18px; }
  .login-brand-modern { order:2; width:100%; }
  .login-card-modern { order:1; }
  .login-brand-modern .jw-brand-lockup.hero { margin-inline:auto; }
  .login-brand-copy { text-align:center; margin-inline:auto; }
  .login-brand-modern p { margin-inline:auto; }
  .login-feature-grid { max-width:680px; margin-inline:auto; }
  .login-feature-card.tour-card { display:none; }
  .login-tour-mobile { display:block; }
  .tour-editor-guide { grid-template-columns:1fr; }
  .tour-chain-preview { flex-direction:column; align-items:stretch; }
  .tour-chain-arrow { transform:rotate(90deg); text-align:center; }
}
@media (max-width:560px) {
  .login-feature-grid { grid-template-columns:1fr; }
  .login-feature-card { min-height:76px; }
  .login-card-modern { padding:25px 20px; }
  .tour-editor-toolbar { align-items:flex-start; flex-direction:column; }
  .tour-editor-pills { justify-content:flex-start; }
  .tour-edit-slot { min-width:132px; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.23 — public-entry UX, registration layout,
   explicit demo-mode framing and tour visual refinement.
   ============================================================ */
.login-feature-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.login-tour-primary {
  margin-top:11px; display:flex; align-items:center; gap:12px; width:100%; padding:13px 15px;
  border:1px solid #d5a64e; border-radius:12px; color:#183b62; text-decoration:none;
  background:linear-gradient(135deg,#fffaf0,#fff 62%); box-shadow:0 7px 18px rgba(167,113,33,.09);
  transition:.16s ease;
}
.login-tour-primary:hover { transform:translateY(-1px); border-color:#b9852c; box-shadow:0 10px 24px rgba(167,113,33,.14); }
.login-tour-primary > span:last-child { min-width:0; flex:1; }
.login-tour-primary strong,.login-tour-primary small { display:block; }
.login-tour-primary strong { color:#173b63; font-size:13px; }
.login-tour-primary small { margin-top:3px; color:#718399; font-size:9.5px; line-height:1.55; }
.login-tour-play { flex:0 0 36px; width:36px; height:36px; display:grid; place-items:center; border-radius:50%; color:#071b35; background:linear-gradient(135deg,#e7bd6c,#c58b2f); font-size:12px; }

.login-stage.registration-stage-modern {
  width:100%; max-width:none; margin:0; min-height:100vh; overflow:hidden;
  grid-template-columns:minmax(430px,1fr) minmax(360px,440px); gap:clamp(38px,6vw,90px);
  padding:44px max(5vw,34px);
}
.registration-stage-modern .registration-brand-modern { max-width:690px; }
.registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero { max-width:330px; margin:0 0 18px auto; }
.registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero .jw-emblem { width:58%; max-width:185px; }
.registration-stage-modern .registration-brand-modern .jw-product-name { color:#d8ad5d; }
.registration-stage-modern .registration-brand-modern .jw-descriptor { color:#98aec5; }
.registration-hero-step { display:inline-flex; padding:6px 10px; border:1px solid rgba(216,173,93,.34); border-radius:999px; color:#edc981; background:rgba(216,173,93,.07); font-size:10px; font-weight:900; }
.registration-stage-modern .registration-brand-modern h2 { margin:14px 0 9px; color:#fff; font-size:clamp(29px,3vw,46px); }
.registration-stage-modern .registration-brand-modern p { color:#bdccdc; line-height:1.85; }
.registration-card-modern { width:min(440px,100%); padding:28px 30px; background:rgba(255,255,255,.975); border-color:rgba(255,255,255,.62); box-shadow:0 30px 78px rgba(0,0,0,.28); }
.registration-card-modern .login-card-mark { width:50px; height:50px; }
.registration-card-modern .login-card-title { margin-bottom:12px; }
.registration-card-modern h1 { font-size:26px; }
.registration-card-modern .registration-step { color:#9a7127; text-align:center; opacity:1; }
.registration-card-modern .login-form input { min-height:48px; }
.registration-help-card { max-width:590px; margin-top:24px; padding:14px 15px; border:1px solid rgba(216,173,93,.25); border-radius:13px; background:rgba(4,20,38,.26); }
.registration-help-card strong,.registration-help-card span,.registration-help-card a { display:block; }
.registration-help-card strong { color:#fff; font-size:12px; }
.registration-help-card span { margin-top:4px; color:#aebfd1; font-size:10px; line-height:1.6; }
.registration-help-card a { margin-top:8px; color:#efc670; font-size:10px; font-weight:850; text-decoration:none; }
.registration-service-state { display:grid; gap:4px; }
.registration-service-state strong,.registration-service-state span { display:block; }
.registration-service-state span { font-size:10px; line-height:1.6; }
.registration-fallback-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:-3px; }
.registration-fallback-actions .btn { text-decoration:none; text-align:center; }
.contact-transport-note { display:grid; gap:3px; margin:.65rem 0; padding:.65rem .75rem; border:1px solid #ead7ad; border-radius:10px; background:#fff8e9; }
.contact-transport-note strong { color:#755719; font-size:.86rem; }
.contact-transport-note span { color:#8b7445; font-size:.76rem; line-height:1.55; }

.tour-mode-strip {
  position:sticky; top:74px; z-index:29; display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:9px clamp(18px,4vw,54px); color:#503b0f; background:linear-gradient(90deg,#fff5d8,#fffbef);
  border-bottom:1px solid #e1c16e; box-shadow:0 7px 18px rgba(80,59,15,.07);
}
.tour-mode-strip > div { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.tour-mode-strip strong { font-size:11px; }
.tour-mode-strip span:not(.tour-mode-dot) { color:#7e6a3e; font-size:9px; }
.tour-mode-strip a { color:#61470f; font-size:9px; font-weight:900; text-decoration:none; border-bottom:1px solid rgba(97,71,15,.35); }
.tour-mode-dot { width:9px; height:9px; border-radius:50%; background:#d79b2e; box-shadow:0 0 0 4px rgba(215,155,46,.14); }
.tour-shell { min-height:calc(100vh - 118px); }
.tour-demo-badge { font-weight:900; color:#fff3cf; border-color:#d9a945; background:rgba(211,165,76,.15); }
.tour-context-bar { border-color:#d9e3ed; background:rgba(255,255,255,.92); box-shadow:0 6px 20px rgba(12,39,68,.045); }
.tour-context-kicker { color:#a27627 !important; font-weight:900 !important; }
.tour-context-progress { display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.tour-context-progress span { padding:5px 9px; border:1px solid #dce5ee; border-radius:999px; color:#7d8d9d; background:#f8fafc; font-size:8px; font-weight:850; }
.tour-context-progress span.active { color:#704f12; border-color:#dfc27f; background:#fff7e4; }
.tour-tour-notice { display:flex; align-items:center; gap:12px; margin-bottom:14px; padding:13px 15px; border:1px solid #e4cc92; border-radius:14px; background:linear-gradient(135deg,#fffaf0,#fff); }
.tour-tour-notice > span { flex:0 0 52px; height:34px; display:grid; place-items:center; border-radius:9px; color:#fff; background:#b9862c; font-size:9px; font-weight:950; letter-spacing:1px; }
.tour-tour-notice strong,.tour-tour-notice p { display:block; }
.tour-tour-notice strong { color:#594211; font-size:11px; }
.tour-tour-notice p { margin:3px 0 0; color:#806e49; font-size:9px; line-height:1.55; }
.tour-app-window { box-shadow:0 14px 34px rgba(13,43,75,.07); border-color:#ccd9e5; }
.tour-window-chrome { direction:ltr; display:flex; align-items:center; gap:6px; min-height:31px; padding:6px 10px; border-bottom:1px solid #dce5ed; background:#edf2f6; }
.tour-window-chrome > span { width:8px; height:8px; border-radius:50%; background:#cbd5df; }
.tour-window-chrome > span:first-child { background:#d6a54c; }
.tour-window-chrome > span:nth-child(2) { background:#83a5c2; }
.tour-window-chrome > span:nth-child(3) { background:#8bb7a8; }
.tour-window-chrome b { margin-left:auto; color:#718297; font-size:8px; font-weight:800; direction:rtl; }
.tour-sidebar nav a.active { background:linear-gradient(135deg,rgba(211,165,76,.18),rgba(255,255,255,.04)); border-color:rgba(211,165,76,.42); }
.tour-sidebar nav a.active b { color:#fff4d6; }

@media (max-width:900px) {
  .login-stage.registration-stage-modern { grid-template-columns:1fr; min-height:auto; overflow:visible; padding:26px 18px 34px; }
  .registration-stage-modern .registration-brand-modern { order:2; width:100%; text-align:center; margin-inline:auto; }
  .registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero { margin-inline:auto; }
  .registration-stage-modern .registration-brand-modern p { margin-inline:auto; }
  .registration-stage-modern .login-trust-row { justify-content:center; }
  .registration-help-card { margin-inline:auto; text-align:center; }
  .registration-stage-modern .registration-card-modern { order:1; justify-self:center; }
  .tour-mode-strip { top:0; position:sticky; }
}
@media (max-width:560px) {
  .registration-stage-modern .registration-card-modern { padding:23px 18px; }
  .registration-fallback-actions { grid-template-columns:1fr; }
  .tour-mode-strip { align-items:flex-start; flex-direction:column; gap:5px; padding:8px 12px; }
  .tour-context-progress { width:100%; }
  .tour-tour-notice { align-items:flex-start; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.24 — unified public surfaces + responsive
   virtual-tour shell + persistent exit control.
   ============================================================ */

/* Public pages always own the full viewport; never inherit a centered card canvas. */
.public-tour-content {
  width:100%; max-width:none; min-width:0; margin:0; padding:0; display:block; overflow-x:hidden;
}
.tour-stage { width:100%; max-width:none; margin:0; min-width:0; }
.tour-topbar,.tour-mode-strip,.tour-shell { width:100%; max-width:none; margin-inline:0; }
.tour-workspace { width:100%; max-width:none; margin:0; }
.tour-workspace > * { min-width:0; }

/* A permanent, unmistakable way out of demo mode. */
.tour-exit-fab {
  position:fixed; z-index:90; inset-inline-start:18px; bottom:18px;
  display:flex; align-items:center; gap:10px; min-height:52px; max-width:min(270px,calc(100vw - 28px));
  padding:8px 12px; border:1px solid rgba(211,165,76,.75); border-radius:14px;
  color:#fff; background:linear-gradient(135deg,rgba(7,27,53,.98),rgba(16,57,96,.98));
  box-shadow:0 14px 38px rgba(3,18,37,.28),0 0 0 3px rgba(211,165,76,.09);
  text-decoration:none; backdrop-filter:blur(12px); direction:rtl;
}
.tour-exit-fab:hover { transform:translateY(-1px); border-color:#efc670; box-shadow:0 17px 42px rgba(3,18,37,.34),0 0 0 4px rgba(211,165,76,.12); }
.tour-exit-icon {
  flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border-radius:10px;
  color:#071b35; background:linear-gradient(135deg,#efc670,#c98e2e); font-size:18px; font-weight:950;
}
.tour-exit-copy,.tour-exit-copy strong,.tour-exit-copy small { display:block; min-width:0; }
.tour-exit-copy strong { color:#fff; font-size:11px; white-space:nowrap; }
.tour-exit-copy small { margin-top:2px; color:#b9cadd; font-size:8px; white-space:nowrap; }
.tour-mode-exit { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border:1px solid rgba(97,71,15,.22); border-radius:999px; background:rgba(255,255,255,.45); }

/* Keep every tour view on the same visual axis and width. */
.tour-shell { grid-template-columns:250px minmax(0,1fr); }
.tour-sidebar { min-width:0; }
.tour-workspace { padding:24px clamp(20px,3.2vw,48px) 92px; }
.tour-context-bar,.tour-tour-notice,.tour-hero-card,.tour-metrics,.tour-feature-grid,
.tour-section-head,.tour-table-card,.tour-editor-guide,.tour-editor-status,.tour-chain-preview,
.tour-editor-card,.tour-dual-grid,.tour-import-grid,.tour-highlight,.tour-report-options,
.tour-report-print,.tour-share-layout,.tour-bottom-cta {
  width:100%; max-width:1320px; margin-inline:auto;
}
.tour-context-bar { margin-bottom:18px; }
.tour-tour-notice { margin-bottom:14px; }
.tour-metrics { margin-top:16px; margin-bottom:16px; }
.tour-highlight,.tour-bottom-cta { margin-top:16px; }
.tour-section-head { margin-bottom:16px; }

/* Desktop tour chrome: visually stable across every section. */
.tour-topbar { padding-inline:clamp(20px,3.2vw,48px); }
.tour-mode-strip { padding-inline:clamp(20px,3.2vw,48px); }
.tour-sidebar nav a { min-height:46px; }
.tour-context-bar { min-height:46px; padding:8px 12px; border:1px solid #dce5ee; border-radius:12px; }
.tour-section-head { min-height:72px; padding:2px 2px 0; }

/* Login: tighter vertical rhythm, clearer hierarchy, less stretching. */
.login-stage-modern { align-items:center; min-height:100svh; padding-block:34px; }
.login-brand-modern { align-self:center; max-width:760px; }
.login-brand-modern .jw-brand-lockup.hero { margin-bottom:12px; }
.login-brand-copy { max-width:700px; }
.login-brand-copy h2 { max-width:690px; line-height:1.34; margin-top:12px; margin-bottom:9px; }
.login-brand-copy p { max-width:690px; line-height:1.75; }
.login-feature-grid { max-width:760px; gap:10px; margin-top:20px; }
.login-feature-card { min-height:78px; padding:13px 14px; }
.login-card-modern { width:min(440px,100%); padding:26px 28px; }
.login-card-modern .login-card-brand { margin-bottom:8px; }
.login-card-modern .login-card-mark { width:50px; height:50px; margin:0; }
.login-card-modern .login-card-title { margin:0; text-align:left; }
.login-card-modern h1 { margin-top:12px; }
.login-card-modern > .hint { margin-bottom:15px; }
.login-card-modern .login-form { gap:8px; }
.login-card-modern .login-form label { margin-bottom:8px; }
.login-entry-divider { margin-block:8px; }
.login-create-school-visible { min-height:44px; }
.login-tour-primary { margin-top:9px; }
.login-forgot-hint { margin-top:10px; }
.login-card-modern .login-card-footer { margin-top:13px; padding-top:11px; }

/* Registration mirrors the login card proportions and field language. */
.login-stage.registration-stage-modern {
  grid-template-columns:minmax(0,1fr) minmax(390px,460px); align-items:center;
  padding:36px max(5vw,34px); gap:clamp(34px,5vw,78px); min-height:100svh;
}
.registration-stage-modern .registration-brand-modern { align-self:center; max-width:720px; }
.registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero { max-width:300px; margin-bottom:12px; }
.registration-stage-modern .registration-brand-modern h2 { line-height:1.32; margin-top:12px; }
.registration-stage-modern .registration-brand-modern p { max-width:650px; }
.registration-card-modern { width:min(460px,100%); padding:26px 28px; align-self:center; }
.registration-card-brand { display:flex; align-items:center; justify-content:center; gap:10px; direction:ltr; margin-bottom:9px; }
.registration-card-brand .login-card-mark { width:50px; height:50px; margin:0; flex:0 0 auto; }
.registration-card-brand .login-card-title { margin:0; text-align:left; }
.registration-card-modern h1 { margin-top:7px; margin-bottom:6px; }
.registration-card-modern > .hint { max-width:360px; margin:0 auto 16px; }
.registration-card-modern .login-form { gap:8px; }
.registration-card-modern .login-form label { margin-bottom:8px; text-align:right; }
.registration-card-modern .login-form input { min-height:48px; border-radius:9px; background:#fbfcfe; }
.registration-card-modern .login-form .btn.big { min-height:48px; }
.registration-service-state { text-align:right; }
.registration-fallback-actions { margin-top:8px; }
.registration-links { margin-top:12px; }
.registration-privacy-note { text-align:center; margin-top:8px; font-size:9px; }
.registration-card-modern .login-card-footer { margin-top:13px; padding-top:11px; }

/* Tablet: one coherent content column; tour navigation becomes a compact horizontal rail. */
@media (max-width:980px) {
  .login-stage-modern,.login-stage.registration-stage-modern {
    grid-template-columns:1fr; min-height:auto; overflow:visible; gap:26px; padding:24px 18px 34px;
  }
  .login-card-modern,.registration-card-modern { order:1; justify-self:center; }
  .login-brand-modern,.registration-stage-modern .registration-brand-modern { order:2; width:min(760px,100%); margin-inline:auto; text-align:center; }
  .login-brand-modern .jw-brand-lockup.hero,.registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero { margin-inline:auto; }
  .login-brand-copy,.login-brand-modern p,.registration-stage-modern .registration-brand-modern p { margin-inline:auto; }
  .login-trust-row,.registration-stage-modern .login-trust-row { justify-content:center; }
  .login-feature-grid { margin-inline:auto; }
  .registration-help-card { margin-inline:auto; text-align:center; }

  .tour-topbar { position:sticky; top:0; min-height:64px; padding:9px 14px; }
  .tour-mode-strip { position:sticky; top:64px; z-index:29; }
  .tour-shell { display:block; min-height:0; }
  .tour-sidebar {
    position:sticky; top:103px; z-index:25; display:block; padding:7px 10px;
    border-left:0; border-bottom:1px solid rgba(211,165,76,.18); overflow:hidden;
  }
  .tour-school-card,.tour-sidebar-cta { display:none; }
  .tour-sidebar nav {
    display:flex; flex-wrap:nowrap; gap:6px; overflow-x:auto; overflow-y:hidden; padding-bottom:2px;
    scrollbar-width:thin; scroll-snap-type:x proximity;
  }
  .tour-sidebar nav a {
    flex:0 0 auto; min-width:132px; min-height:44px; justify-content:center; flex-direction:row;
    padding:7px 10px; text-align:center; scroll-snap-align:start; white-space:nowrap;
  }
  .tour-sidebar nav a span { width:auto; font-size:14px; }
  .tour-sidebar nav a b { font-size:9px; }
  .tour-sidebar nav a.active { box-shadow:inset 0 -3px #d3a54c; }
  .tour-workspace { padding:16px 14px 90px; }
  .tour-context-bar { min-height:0; }
  .tour-hero-card { grid-template-columns:1fr; }
  .tour-metrics,.tour-feature-grid,.tour-report-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Phone: retain hierarchy, avoid horizontal page overflow; only timetable regions scroll. */
@media (max-width:620px) {
  .login-stage-modern,.login-stage.registration-stage-modern { padding:14px 10px 26px; gap:18px; }
  .login-card-modern,.registration-card-modern { width:100%; max-width:100%; border-radius:17px; padding:21px 16px; }
  .login-card-modern .login-card-mark,.registration-card-brand .login-card-mark { width:44px; height:44px; }
  .login-card-modern h1,.registration-card-modern h1 { font-size:23px; }
  .login-brand-modern,.registration-stage-modern .registration-brand-modern { padding-inline:8px; }
  .login-feature-grid { grid-template-columns:1fr; }
  .login-feature-card { min-height:68px; }
  .registration-fallback-actions { grid-template-columns:1fr; }

  .tour-topbar { min-height:58px; padding:7px 10px; }
  .tour-brand img { width:40px; height:40px; }
  .tour-brand strong { font-size:16px; }
  .tour-brand small,.tour-demo-badge { display:none; }
  .tour-top-actions { gap:5px; }
  .tour-top-actions .btn { min-height:34px; padding:6px 9px; font-size:9px; }
  .tour-top-actions .btn:not(.primary) { display:none; }
  .tour-mode-strip { top:58px; padding:7px 10px; gap:5px; }
  .tour-mode-strip > div { gap:5px; }
  .tour-mode-strip strong { font-size:10px; }
  .tour-mode-strip span:not(.tour-mode-dot) { display:none; }
  .tour-mode-exit { font-size:8px !important; }
  .tour-sidebar { top:94px; padding:6px 8px; }
  .tour-sidebar nav a { min-width:118px; min-height:40px; padding:6px 8px; }
  .tour-workspace { padding:12px 9px 88px; }
  .tour-context-bar { padding:7px 9px; gap:8px; }
  .tour-context-progress { width:100%; }
  .tour-context-progress span { padding:4px 7px; }
  .tour-tour-notice { align-items:flex-start; padding:11px; }
  .tour-tour-notice > span { flex-basis:44px; }
  .tour-hero-card { padding:18px 14px; border-radius:16px; }
  .tour-hero-card h1 { font-size:25px; }
  .tour-hero-card p { font-size:11px; }
  .tour-metrics,.tour-feature-grid,.tour-dual-grid,.tour-import-grid,.tour-share-layout,.tour-report-options { grid-template-columns:1fr; }
  .tour-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tour-section-head { min-height:0; align-items:flex-start; flex-direction:column; gap:9px; }
  .tour-section-head h1 { font-size:23px; }
  .tour-table-toolbar,.tour-editor-toolbar { align-items:flex-start; flex-direction:column; }
  .tour-editor-guide { grid-template-columns:1fr; }
  .tour-chain-preview { flex-direction:column; align-items:stretch; }
  .tour-chain-arrow { transform:rotate(90deg); text-align:center; }
  .tour-report-print { padding:10px; overflow-x:auto; }
  .tour-print-table { min-width:690px; }
  .tour-bottom-cta { align-items:flex-start; flex-direction:column; }
  .tour-bottom-cta > div:last-child { width:100%; }
  .tour-exit-fab { inset-inline-start:10px; bottom:10px; min-height:46px; padding:6px 9px; border-radius:12px; }
  .tour-exit-icon { flex-basis:30px; width:30px; height:30px; font-size:16px; }
  .tour-exit-copy strong { font-size:10px; }
  .tour-exit-copy small { display:none; }
}

@media print {
  .tour-exit-fab,.tour-mode-strip { display:none !important; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.25 — unified login/registration composition.
   Keeps public authentication screens on one visual system and
   improves desktop/tablet/phone balance without touching app logic.
   ============================================================ */
.login-stage-modern,
.login-stage.registration-stage-modern {
  display:block;
  width:100%;
  max-width:none;
  min-height:100svh;
  margin:0;
  padding:0;
  overflow-x:hidden;
}
.public-auth-frame {
  position:relative;
  z-index:2;
  width:min(1440px,calc(100% - 64px));
  min-height:100svh;
  margin-inline:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(400px,450px);
  align-items:center;
  gap:clamp(46px,6vw,92px);
  padding-block:34px;
  direction:rtl;
}
.public-auth-frame > .login-brand-panel {
  width:100%;
  max-width:780px;
  margin:0;
  justify-self:start;
}
.public-auth-frame > .login-card {
  width:100%;
  max-width:450px;
  justify-self:end;
  margin:0;
}
.public-auth-frame-registration > .registration-brand-modern { max-width:760px; }
.public-auth-frame-registration > .registration-card-modern { max-width:450px; }

/* Login hero: balanced 3 + 2 feature composition, less empty space. */
.login-brand-modern .jw-brand-lockup.hero { max-width:300px; margin-bottom:10px; }
.login-brand-copy { max-width:720px; }
.login-brand-copy h2 {
  max-width:720px;
  font-size:clamp(34px,3.25vw,52px);
  line-height:1.28;
  margin:10px 0 8px;
}
.login-brand-copy p { max-width:700px; font-size:15px; line-height:1.8; }
.login-feature-grid {
  width:100%; max-width:760px;
  display:grid; grid-template-columns:repeat(6,minmax(0,1fr));
  gap:10px; margin-top:18px;
}
.login-feature-card { grid-column:span 2; min-height:74px; padding:12px 13px; }
.login-feature-card:nth-last-child(-n+2) { grid-column:span 3; }
.login-feature-card strong { font-size:11px; }
.login-feature-card small { font-size:8.5px; line-height:1.45; }
.login-card-modern { padding:25px 27px; }
.login-card-modern h1 { margin-top:9px; font-size:27px; }
.login-card-modern > .hint { line-height:1.65; }
.login-card-modern .notice { margin-block:8px; }
.login-tour-primary { margin-top:8px; padding:11px 13px; }
.login-tour-primary strong { font-size:12px; }
.login-tour-primary small { font-size:9px; }
.login-forgot-hint { font-size:9px; line-height:1.55; }

/* Registration uses the same proportions, rhythm, card language and visual weight. */
.registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero {
  max-width:300px; margin:0 0 12px auto;
}
.registration-stage-modern .registration-brand-modern h2 {
  margin:10px 0 8px; font-size:clamp(34px,3.1vw,50px); line-height:1.28;
}
.registration-stage-modern .registration-brand-modern p {
  max-width:690px; margin:0; color:#c3d1df; font-size:15px; line-height:1.8;
}
.registration-card-modern { padding:25px 27px; gap:10px; }
.registration-card-modern .registration-step {
  margin-top:2px; color:#9b7229; font-size:10px; font-weight:900; text-align:center;
}
.registration-card-modern h1 { margin:3px 0 5px; font-size:27px; }
.registration-card-modern > .hint { max-width:370px; margin:0 auto 12px; line-height:1.65; }
.registration-card-modern .notice { margin-block:6px; }
.registration-card-modern .login-form label { color:#40576f; font-size:11px; font-weight:800; }
.registration-card-modern .login-form input,
.registration-card-modern .password-input-wrap input {
  min-height:49px; border-radius:10px; background:#fbfcfe;
}
.registration-main-button { min-height:48px; background:linear-gradient(135deg,#c58b2f,#dfad58); border-color:#c28a32; }
.registration-links { justify-content:center; margin-top:8px; font-size:11px; }
.registration-privacy-note { margin-top:5px; color:#748499; font-size:8.7px; line-height:1.6; }

.registration-journey {
  width:100%; max-width:760px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px; margin-top:20px;
}
.registration-journey-card {
  min-width:0; min-height:78px; display:flex; align-items:center; gap:10px;
  padding:12px 13px; border:1px solid rgba(255,255,255,.13); border-radius:14px;
  background:rgba(4,20,38,.30); box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.registration-journey-card > span {
  flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center;
  border-radius:10px; border:1px solid rgba(211,165,76,.35); color:#efca80;
  background:rgba(211,165,76,.08); font-size:12px; font-weight:950;
}
.registration-journey-card strong,.registration-journey-card small { display:block; }
.registration-journey-card strong { color:#f4f7fb; font-size:11px; }
.registration-journey-card small { margin-top:3px; color:#9fb1c5; font-size:8.5px; line-height:1.45; }
.registration-journey-card.active { border-color:rgba(211,165,76,.55); background:rgba(211,165,76,.10); }
.registration-journey-card.active > span { color:#071b35; background:linear-gradient(135deg,#efc670,#c88d2d); }
.registration-journey-card.done > span { color:#e9fff8; border-color:rgba(50,177,142,.38); background:rgba(24,139,111,.28); }
.registration-tour-link {
  width:100%; max-width:560px; margin-top:12px; display:flex; align-items:center; gap:10px;
  padding:10px 12px; border:1px solid rgba(211,165,76,.25); border-radius:12px;
  background:rgba(4,20,38,.23); color:#dbe7f2; text-decoration:none;
}
.registration-tour-link > span {
  flex:0 0 32px; width:32px; height:32px; display:grid; place-items:center; border-radius:50%;
  color:#071b35; background:linear-gradient(135deg,#e8bd6c,#c58b2f); font-size:10px;
}
.registration-tour-link strong,.registration-tour-link small { display:block; }
.registration-tour-link strong { font-size:10.5px; color:#fff; }
.registration-tour-link small { margin-top:2px; font-size:8.5px; color:#a8bbce; line-height:1.45; }
.registration-paused-panel {
  display:flex; align-items:center; gap:10px; margin:2px 0 4px; padding:11px 12px;
  border:1px solid #e2d1a6; border-radius:11px; background:#fffaf0;
}
.registration-paused-icon {
  flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center; border-radius:10px;
  color:#735318; background:#f6e6bf; font-size:17px;
}
.registration-paused-panel strong,.registration-paused-panel small { display:block; }
.registration-paused-panel strong { color:#594211; font-size:10.5px; }
.registration-paused-panel small { margin-top:2px; color:#806f4b; font-size:8.7px; line-height:1.5; }
.registration-fallback-actions { grid-template-columns:1fr 1fr; gap:8px; margin-top:3px; }
.registration-fallback-actions .btn { min-height:41px; display:flex; align-items:center; justify-content:center; }

/* Keep the three registration steps visually identical. */
.registration-card-brand { margin-bottom:6px; }
.registration-card-brand .login-card-title { margin-bottom:0; }
.registration-secondary-actions { justify-content:center; }
.registration-setup-card { max-width:470px !important; }
.registration-setup-form { gap:7px !important; }
.registration-setup-form .password-policy.compact { margin-block:1px 3px; }

/* Medium desktop / landscape tablets: preserve two columns until they genuinely no longer fit. */
@media (max-width:1220px) {
  .public-auth-frame {
    width:min(1120px,calc(100% - 44px));
    grid-template-columns:minmax(0,1fr) minmax(380px,430px);
    gap:34px;
  }
  .login-brand-copy h2,.registration-stage-modern .registration-brand-modern h2 { font-size:clamp(31px,4vw,44px); }
  .login-feature-card { min-height:70px; }
}

/* Tablets: one centered flow. Login/registration card first, marketing second. */
@media (max-width:940px) {
  .public-auth-frame {
    width:min(760px,calc(100% - 32px)); min-height:auto; grid-template-columns:1fr;
    gap:22px; padding-block:22px 30px;
  }
  .public-auth-frame > .login-card,
  .public-auth-frame > .login-brand-panel { width:100%; max-width:680px; justify-self:center; }
  .public-auth-frame > .login-card { max-width:460px; order:1; }
  .public-auth-frame > .login-brand-panel { order:2; text-align:center; }
  .login-brand-modern .jw-brand-lockup.hero,
  .registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero { margin-inline:auto; }
  .login-brand-copy { margin-inline:auto; text-align:center; }
  .login-brand-copy p,.registration-stage-modern .registration-brand-modern p { margin-inline:auto; }
  .login-feature-grid,.registration-journey { margin-inline:auto; }
  .registration-tour-link { margin-inline:auto; text-align:right; }
}

/* Phones: compact, touch-safe, no horizontal public-page overflow. */
@media (max-width:620px) {
  .public-auth-frame { width:100%; padding:10px 10px 22px; gap:16px; }
  .public-auth-frame > .login-card { max-width:100%; }
  .login-card-modern,.registration-card-modern { padding:20px 16px; border-radius:17px; }
  .login-card-modern h1,.registration-card-modern h1 { font-size:23px; }
  .login-card-modern .login-card-brand,.registration-card-brand { margin-bottom:5px; }
  .login-card-modern .login-card-mark,.registration-card-brand .login-card-mark { width:43px; height:43px; }
  .login-feature-grid { grid-template-columns:1fr 1fr; gap:8px; }
  .login-feature-card,.login-feature-card:nth-last-child(-n+2) { grid-column:span 1; min-height:68px; padding:10px; }
  .login-feature-card:last-child { grid-column:1 / -1; }
  .registration-journey { grid-template-columns:1fr; gap:7px; }
  .registration-journey-card { min-height:62px; }
  .registration-tour-link { max-width:100%; }
  .registration-fallback-actions { grid-template-columns:1fr; }
  .login-brand-copy h2,.registration-stage-modern .registration-brand-modern h2 { font-size:28px; }
  .login-brand-copy p,.registration-stage-modern .registration-brand-modern p { font-size:12px; line-height:1.7; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.26 — refined premium public login visual balance
   Approved visual direction: lighter navy, centered hero hierarchy,
   artistic five-service rail, clearer actions and responsive balance.
   ============================================================ */
.login-stage-modern,
.login-stage.registration-stage-modern {
  background:
    radial-gradient(circle at 77% 16%,rgba(104,164,220,.23),transparent 27%),
    radial-gradient(circle at 15% 82%,rgba(218,175,90,.10),transparent 27%),
    linear-gradient(145deg,#12385e 0%,#1a4a78 54%,#245d8d 100%);
}
.login-stage-modern .login-digital-bg { opacity:.52; }
.login-stage-modern .login-digital-bg::before,
.login-stage-modern .login-digital-bg::after { border-color:rgba(234,193,109,.14); }

.public-auth-frame-login {
  width:min(1540px,calc(100% - 72px));
  grid-template-columns:minmax(0,1fr) minmax(430px,470px);
  gap:clamp(54px,6.4vw,108px);
}
.public-auth-frame-login > .login-brand-modern {
  max-width:900px;
  justify-self:center;
  text-align:center;
}
.login-brand-modern .jw-brand-lockup.hero {
  max-width:315px;
  margin:0 auto 12px;
}
.login-brand-copy {
  width:100%;
  max-width:860px;
  margin-inline:auto;
  text-align:center;
}
.login-brand-eyebrow {
  padding:7px 15px;
  border-color:rgba(239,197,111,.58);
  background:rgba(13,48,81,.30);
  color:#f3cc79;
  box-shadow:0 6px 18px rgba(5,24,43,.10),inset 0 1px 0 rgba(255,255,255,.06);
}
.login-brand-copy h2 {
  max-width:850px;
  margin:18px auto 9px;
  font-size:clamp(39px,3.55vw,58px);
  line-height:1.18;
  letter-spacing:-1.35px;
  text-wrap:balance;
  text-shadow:0 5px 24px rgba(3,23,42,.18);
}
.login-title-break { display:block; }
.login-brand-divider {
  width:170px;
  height:16px;
  margin:2px auto 8px;
  position:relative;
}
.login-brand-divider::before,
.login-brand-divider::after {
  content:"";
  position:absolute;
  top:7px;
  width:67px;
  height:1px;
  background:linear-gradient(90deg,transparent,#e7b85e);
}
.login-brand-divider::before { left:0; }
.login-brand-divider::after { right:0; transform:scaleX(-1); }
.login-brand-divider > span {
  position:absolute;
  left:50%; top:3px;
  width:9px; height:9px;
  border:2px solid #edbd61;
  transform:translateX(-50%) rotate(45deg);
  box-shadow:0 0 14px rgba(237,189,97,.33);
}
.login-brand-copy p {
  max-width:790px;
  margin:0 auto;
  color:#d4e0ec;
  font-size:15.5px;
  line-height:1.9;
  text-align:center;
}

/* Five-card service rail: one visual language, stronger readability. */
.login-feature-grid {
  width:100%;
  max-width:900px;
  margin:28px auto 0;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
  direction:rtl;
}
.login-feature-card,
.login-feature-card:nth-last-child(-n+2) {
  grid-column:span 1;
  position:relative;
  min-height:178px;
  padding:18px 12px 15px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:11px;
  overflow:hidden;
  text-align:center;
  border:1px solid rgba(239,190,96,.48);
  border-radius:15px;
  background:linear-gradient(180deg,rgba(19,63,101,.74),rgba(10,42,72,.66));
  box-shadow:0 13px 34px rgba(4,27,49,.12),inset 0 1px 0 rgba(255,255,255,.055);
}
.login-feature-card::before {
  content:"";
  position:absolute;
  inset:-1px;
  pointer-events:none;
  background:radial-gradient(circle at 50% 0%,rgba(247,201,112,.12),transparent 34%);
}
.login-feature-card::after {
  content:"";
  position:absolute;
  bottom:-2px;
  left:50%;
  width:44px;
  height:4px;
  transform:translateX(-50%);
  border-radius:50%;
  background:#efbd61;
  filter:blur(3px);
  opacity:.75;
}
.login-feature-card > span {
  position:relative;
  z-index:1;
  flex:0 0 58px;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:14px;
  color:#efbd61;
  background:transparent;
  font-size:29px;
  font-weight:900;
  line-height:1;
  text-shadow:0 0 18px rgba(238,187,91,.18);
}
.login-feature-card.feature-import > span,
.login-feature-card.feature-share > span,
.login-feature-card.feature-print > span {
  font-size:15px;
  border:1px solid rgba(239,190,96,.55);
  background:rgba(237,186,88,.07);
}
.login-feature-card > div { position:relative; z-index:1; min-width:0; }
.login-feature-card strong { color:#fff; font-size:13.5px; line-height:1.5; }
.login-feature-card small {
  max-width:145px;
  margin:7px auto 0;
  color:#c6d5e5;
  font-size:9.7px;
  line-height:1.65;
}
.login-feature-card.accent {
  border-color:rgba(245,199,109,.68);
  background:linear-gradient(180deg,rgba(29,78,115,.84),rgba(11,46,78,.72));
}
.login-feature-card:hover {
  transform:translateY(-2px);
  border-color:rgba(247,201,112,.75);
  box-shadow:0 17px 38px rgba(3,24,44,.18),inset 0 1px 0 rgba(255,255,255,.07);
}

/* Login card: retain the familiar form, add subtle premium finish and clearer CTA hierarchy. */
.public-auth-frame-login > .login-card-modern {
  max-width:470px;
  padding:29px 31px 27px;
  border-radius:20px;
  border-color:rgba(242,204,126,.74);
  background:linear-gradient(180deg,rgba(255,255,255,.985),rgba(249,251,253,.985));
  box-shadow:0 34px 82px rgba(3,23,42,.23);
}
.login-card-modern::before { height:3px; }
.login-card-modern h1 { color:#102b4a; font-size:29px; letter-spacing:-.3px; }
.login-card-modern > .hint { color:#75879c; font-size:12.5px; line-height:1.72; }
.login-card-modern .login-form label { color:#384f69; font-weight:800; }
.login-card-modern .login-form input {
  border-color:#cbd8e5;
  background:#fff;
  box-shadow:inset 0 1px 2px rgba(10,44,76,.025);
}
.login-card-modern .login-form input:focus {
  border-color:#d2a34b;
  box-shadow:0 0 0 3px rgba(210,163,75,.12);
}
.login-card-modern .login-main-button {
  background:linear-gradient(135deg,#c98d2c,#e3b157);
  box-shadow:0 10px 23px rgba(170,112,28,.22);
}
.login-create-school-visible {
  position:relative;
  border-color:#294f77;
  border-radius:10px;
  box-shadow:0 4px 12px rgba(15,52,86,.04);
}
.login-create-school-visible::before {
  content:"▦";
  margin-left:8px;
  color:#315b86;
  font-size:14px;
}
.login-tour-primary {
  border-color:#daa443;
  border-radius:11px;
  background:linear-gradient(90deg,#fffaf0,#fffdf8);
  box-shadow:0 5px 14px rgba(182,126,38,.06);
}
.login-card-modern .login-card-footer { opacity:.92; }

@media (max-width:1320px) {
  .public-auth-frame-login {
    width:min(1220px,calc(100% - 46px));
    grid-template-columns:minmax(0,1fr) minmax(405px,455px);
    gap:38px;
  }
  .login-brand-copy h2 { font-size:clamp(35px,4vw,47px); }
  .login-feature-grid {
    max-width:720px;
    grid-template-columns:repeat(6,minmax(0,1fr));
  }
  .login-feature-card,
  .login-feature-card:nth-last-child(-n+2) {
    grid-column:span 2;
    min-height:135px;
    padding:13px 10px 12px;
  }
  .login-feature-card:nth-last-child(-n+2) { grid-column:span 3; }
  .login-feature-card > span { flex-basis:44px; width:44px; height:44px; font-size:22px; }
  .login-feature-card.feature-import > span,
  .login-feature-card.feature-share > span,
  .login-feature-card.feature-print > span { font-size:12px; }
}

@media (max-width:940px) {
  .public-auth-frame-login { width:min(780px,calc(100% - 28px)); gap:26px; }
  .public-auth-frame-login > .login-brand-modern { max-width:760px; }
  .login-brand-copy h2 { font-size:clamp(34px,6vw,45px); }
  .login-title-break { display:none; }
  .login-feature-grid { max-width:700px; }
}

@media (max-width:620px) {
  .login-stage-modern,
  .login-stage.registration-stage-modern {
    background:linear-gradient(160deg,#17426d 0%,#245f90 100%);
  }
  .public-auth-frame-login { width:100%; padding-inline:10px; }
  .public-auth-frame-login > .login-card-modern { padding:20px 16px; border-radius:17px; }
  .login-brand-copy h2 { font-size:29px; line-height:1.28; }
  .login-brand-divider { width:130px; }
  .login-brand-divider::before,.login-brand-divider::after { width:48px; }
  .login-feature-grid { grid-template-columns:1fr 1fr; gap:9px; }
  .login-feature-card,
  .login-feature-card:nth-last-child(-n+2) {
    grid-column:span 1;
    min-height:124px;
    padding:12px 9px;
  }
  .login-feature-card:last-child { grid-column:1 / -1; }
  .login-feature-card strong { font-size:12px; }
  .login-feature-card small { font-size:9px; }
  .login-feature-card > span { flex-basis:42px; width:42px; height:42px; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.27 — full-site visual identity + iPhone-first public entry
   Approved direction: lighter navy, restrained gold, calm white surfaces,
   consistent spacing/radii/shadows, and login controls visible first on phones.
   Visual-only layer: no application/business behavior is changed here.
   ============================================================ */
:root {
  --jw-navy:#173f67;
  --jw-blue:#245d8d;
  --jw-gold:#d3a54c;
  --jw-gold-strong:#e6ba62;
  --jw-paper:#f4f7fb;
  --jw-ink:#18314d;
  --jw-line:#dbe5ef;
  --jw-surface:#ffffff;
  --jw-surface-soft:#f8fafc;
  --jw-radius:16px;
  --jw-shadow:0 14px 38px rgba(15,45,78,.08);
  --jw-shadow-strong:0 24px 60px rgba(11,39,69,.14);
}
html,body { max-width:100%; overflow-x:hidden; }
body { background:var(--jw-paper); color:var(--jw-ink); }

/* Authenticated application shell — one visual language across the site. */
.app-shell { background:linear-gradient(180deg,#f5f8fb 0%,#eef3f8 100%); }
.sidebar {
  background:
    radial-gradient(circle at 50% -10%,rgba(100,164,220,.16),transparent 34%),
    linear-gradient(180deg,#1a456f 0%,#12375d 58%,#102f52 100%);
  border-inline-start:1px solid rgba(255,255,255,.06);
  box-shadow:-8px 0 28px rgba(8,31,57,.06);
}
.sidebar nav a {
  border:1px solid transparent;
  border-radius:11px;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.sidebar nav a.active,.sidebar nav a:hover {
  border-color:rgba(230,186,98,.24);
  background:linear-gradient(90deg,rgba(230,186,98,.16),rgba(255,255,255,.07));
  transform:translateX(-1px);
}
.topbar {
  min-height:66px;
  background:rgba(255,255,255,.94);
  border-bottom:1px solid #dfe7f0;
  box-shadow:0 8px 26px rgba(13,43,75,.045);
  backdrop-filter:blur(16px);
}
.content {
  width:100%;
  max-width:1560px;
  margin-inline:auto;
  padding:30px clamp(20px,2.7vw,42px) 42px;
}
.page-head {
  padding:2px 2px 15px;
  border-bottom:1px solid rgba(211,165,76,.18);
}
.page-head h1,h1 { color:#173f67; }
.page-head p { color:#6f8195; }
.panel,.stat,.report-action-card,.timetable-wrap,.report-summary,.action-card,.suggestion-card,.period-card {
  border-color:var(--jw-line);
  border-radius:var(--jw-radius);
  background:rgba(255,255,255,.96);
  box-shadow:var(--jw-shadow);
}
.panel { padding:clamp(16px,1.8vw,24px); }
.stat { border-top:2px solid rgba(211,165,76,.30); }
.stat strong { color:#173f67; }
.btn {
  border-radius:10px;
  border-color:#cbd8e5;
  background:#fff;
  color:#234f7a;
  box-shadow:0 3px 10px rgba(19,56,91,.035);
  transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease,background .14s ease;
}
.btn:hover { transform:translateY(-1px); box-shadow:0 7px 17px rgba(19,56,91,.075); }
.btn.primary {
  background:linear-gradient(135deg,#245d8d,#173f67);
  border-color:#245d8d;
  color:#fff;
  box-shadow:0 8px 18px rgba(29,76,119,.16);
}
input,select,textarea {
  border-color:#cbd8e5;
  border-radius:10px;
  background:#fff;
  color:#18314d;
}
input:focus,select:focus,textarea:focus {
  outline:none;
  border-color:#c99b43;
  box-shadow:0 0 0 3px rgba(211,165,76,.13);
}
th { background:#f1f5f9; color:#405b78; }
.table-wrap,.report-table-wrap,.timetable-wrap { -webkit-overflow-scrolling:touch; }
.notice { border-radius:12px; }
.chip { border-color:#d5e0ea; background:#f8fafc; }

/* Public authentication family — exactly the approved visual direction. */
.login-stage-modern,
.login-stage.registration-stage-modern {
  min-height:100svh;
  overflow-x:hidden;
  overflow-y:auto;
  background:
    radial-gradient(circle at 77% 15%,rgba(114,176,226,.24),transparent 29%),
    radial-gradient(circle at 14% 82%,rgba(230,186,98,.10),transparent 28%),
    linear-gradient(145deg,#17456f 0%,#225b89 56%,#2c6b9d 100%);
}
.public-auth-frame,
.public-auth-frame-login {
  max-width:1540px;
}
.login-card-modern,.registration-card-modern {
  border-color:rgba(232,196,124,.75);
  background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(249,251,253,.99));
  box-shadow:0 28px 74px rgba(8,36,64,.20);
}
.login-brand-copy h2,.registration-stage-modern .registration-brand-modern h2 {
  text-shadow:0 5px 22px rgba(5,31,57,.13);
}
.login-feature-card {
  border-color:rgba(239,194,105,.48);
  background:linear-gradient(180deg,rgba(32,88,133,.68),rgba(18,61,98,.60));
  box-shadow:0 12px 28px rgba(6,32,58,.10),inset 0 1px 0 rgba(255,255,255,.06);
}

/* Tour uses the same surface, radius, spacing and accent language. */
.tour-stage { background:linear-gradient(145deg,#f5f8fb 0%,#eef3f8 56%,#f8fafc 100%); color:#26425f; }
.tour-topbar { background:rgba(23,63,103,.97); border-bottom-color:rgba(230,186,98,.25); }
.tour-mode-strip { border-color:rgba(211,165,76,.28); box-shadow:0 7px 20px rgba(16,50,82,.05); }
.tour-sidebar { border-inline-start:1px solid #e1e9f1; }
.tour-sidebar nav a { border-radius:11px; }
.tour-sidebar nav a.active { border-color:rgba(211,165,76,.35); background:linear-gradient(90deg,#fff9ed,#fff); }
.tour-context-bar,.tour-tour-notice,.tour-hero-card,.tour-metric,.tour-feature-card,
.tour-table-card,.tour-editor-guide,.tour-editor-status,.tour-chain-preview,.tour-editor-card,
.tour-dual-grid > *, .tour-import-grid > *, .tour-highlight,.tour-report-options > *,
.tour-report-print,.tour-share-layout > *, .tour-bottom-cta {
  border-radius:var(--jw-radius);
  border-color:var(--jw-line);
  box-shadow:var(--jw-shadow);
}

/* iPad + iPhone landscape: never keep the public form beside the marketing hero.
   The login/registration card is deliberately the FIRST viewport content. */
@media (max-width:1100px), (max-height:680px) and (max-width:1180px) {
  .public-auth-frame,
  .public-auth-frame-login,
  .public-auth-frame-registration {
    display:flex !important;
    flex-direction:column !important;
    width:min(760px,calc(100% - 28px)) !important;
    min-height:auto !important;
    gap:22px !important;
    padding-top:max(18px,env(safe-area-inset-top)) !important;
    padding-bottom:max(30px,env(safe-area-inset-bottom)) !important;
  }
  .public-auth-frame > .login-card,
  .public-auth-frame-login > .login-card-modern,
  .public-auth-frame-registration > .registration-card-modern {
    order:1 !important;
    width:min(470px,100%) !important;
    max-width:470px !important;
    margin-inline:auto !important;
    align-self:center !important;
  }
  .public-auth-frame > .login-brand-panel,
  .public-auth-frame-login > .login-brand-modern,
  .public-auth-frame-registration > .registration-brand-modern {
    order:2 !important;
    width:100% !important;
    max-width:760px !important;
    margin-inline:auto !important;
    align-self:center !important;
    text-align:center !important;
  }
  .login-brand-copy,.registration-stage-modern .registration-brand-modern { text-align:center !important; }
  .login-brand-copy p,.registration-stage-modern .registration-brand-modern p { margin-inline:auto !important; }
}

/* iPhone portrait: form controls visible immediately, safe-area aware, no accidental zoom/overflow. */
@media (max-width:700px) {
  .login-stage-modern,
  .login-stage.registration-stage-modern {
    min-height:100dvh;
    padding:0 !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
    background:linear-gradient(160deg,#1b4d79 0%,#2a6797 100%);
  }
  .public-auth-frame,
  .public-auth-frame-login,
  .public-auth-frame-registration {
    width:100% !important;
    padding:max(10px,env(safe-area-inset-top)) 10px max(24px,env(safe-area-inset-bottom)) !important;
    gap:18px !important;
  }
  .public-auth-frame > .login-card,
  .public-auth-frame-login > .login-card-modern,
  .public-auth-frame-registration > .registration-card-modern {
    width:100% !important;
    max-width:520px !important;
    border-radius:18px !important;
    padding:18px 15px 20px !important;
    box-shadow:0 16px 40px rgba(7,31,55,.18) !important;
  }
  .login-card-modern .login-card-brand,.registration-card-brand { margin-bottom:4px !important; }
  .login-card-modern .login-card-mark,.registration-card-brand .login-card-mark { width:42px !important; height:42px !important; }
  .login-card-modern h1,.registration-card-modern h1 { margin-top:6px !important; font-size:23px !important; }
  .login-card-modern > .hint,.registration-card-modern > .hint { margin-bottom:11px !important; font-size:11.5px !important; }
  .login-form { gap:7px !important; }
  .login-form label { margin-bottom:6px !important; font-size:11px !important; }
  .login-form input,.login-form select,.login-form textarea,.password-input-wrap input {
    min-height:47px !important;
    font-size:16px !important; /* prevents iOS Safari focus zoom */
  }
  .login-password-actions { margin-top:0 !important; }
  .login-main-button,.registration-main-button,.login-create-school-visible { min-height:47px !important; }
  .login-entry-divider { margin:10px 0 9px !important; }
  .login-tour-primary { margin-top:8px !important; padding:10px 11px !important; }
  .login-forgot-hint { margin-top:8px !important; }
  .login-card-modern .login-card-footer,.registration-card-modern .login-card-footer { margin-top:10px !important; padding-top:9px !important; }
  .public-auth-frame-login > .login-brand-modern,
  .public-auth-frame-registration > .registration-brand-modern {
    padding:4px 4px 0 !important;
  }
  .login-brand-modern .jw-brand-lockup.hero,
  .registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero { max-width:235px !important; margin:0 auto 8px !important; }
  .login-brand-eyebrow { font-size:9px !important; padding:5px 9px !important; }
  .login-brand-copy h2,.registration-stage-modern .registration-brand-modern h2 {
    margin:10px auto 7px !important;
    font-size:27px !important;
    line-height:1.28 !important;
  }
  .login-title-break { display:none !important; }
  .login-brand-divider { margin-bottom:5px !important; }
  .login-brand-copy p,.registration-stage-modern .registration-brand-modern p {
    font-size:11.5px !important;
    line-height:1.7 !important;
  }
  .login-feature-grid { grid-template-columns:1fr 1fr !important; gap:8px !important; margin-top:14px !important; }
  .login-feature-card,.login-feature-card:nth-last-child(-n+2) {
    grid-column:span 1 !important;
    min-height:112px !important;
    padding:10px 8px !important;
  }
  .login-feature-card:last-child { grid-column:1 / -1 !important; min-height:98px !important; }
  .login-feature-card > span { flex-basis:36px !important; width:36px !important; height:36px !important; font-size:18px !important; }
  .login-feature-card.feature-import > span,.login-feature-card.feature-share > span,.login-feature-card.feature-print > span { font-size:10px !important; }
  .login-feature-card strong { font-size:11.5px !important; }
  .login-feature-card small { font-size:8.7px !important; line-height:1.5 !important; }

  /* Authenticated pages on phones: consistent surface spacing and safe fixed navigation. */
  .content { padding:14px 10px calc(88px + env(safe-area-inset-bottom)) !important; }
  .panel,.stat,.report-action-card,.timetable-wrap,.report-summary,.action-card,.suggestion-card,.period-card { border-radius:14px; }
  .panel { padding:14px !important; margin-bottom:13px; }
  .page-head { gap:9px; padding-bottom:11px; margin-bottom:13px; }
  .page-head h1 { font-size:1.32rem; line-height:1.35; }
  .page-head p { font-size:.78rem; }
  .actions,.page-head .actions { gap:7px; }
  .btn { min-height:43px; }
  .mobile-bottom-nav { bottom:max(7px,env(safe-area-inset-bottom)); }
  .topbar { padding-top:max(7px,env(safe-area-inset-top)) !important; min-height:calc(58px + env(safe-area-inset-top)); }
}

/* Very small phones: single service column and full-width action hierarchy. */
@media (max-width:390px) {
  .public-auth-frame,.public-auth-frame-login,.public-auth-frame-registration { padding-inline:8px !important; }
  .public-auth-frame-login > .login-card-modern,.public-auth-frame-registration > .registration-card-modern { padding-inline:13px !important; }
  .login-feature-grid { grid-template-columns:1fr !important; }
  .login-feature-card,.login-feature-card:nth-last-child(-n+2),.login-feature-card:last-child { grid-column:1 !important; min-height:86px !important; }
  .registration-fallback-actions { grid-template-columns:1fr !important; }
}

@media print {
  .sidebar,.topbar,.mobile-bottom-nav,.mobile-nav-toggle,.app-whatsapp-contact { box-shadow:none !important; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.28 — fluid mobile public-entry refinement
   Same markup and identity at every size: the page reflows naturally,
   with no alternate mobile page and no desktop visual regression.
   ============================================================ */
@media (max-width:1100px) {
  .public-auth-frame-login,
  .public-auth-frame-registration {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    width:min(760px,calc(100% - 24px)) !important;
    gap:clamp(18px,3vw,26px) !important;
    margin-inline:auto !important;
    box-sizing:border-box !important;
  }
  .public-auth-frame-login > *,
  .public-auth-frame-registration > * { min-width:0 !important; }

  /* The same login card is first in the flow; only its placement changes. */
  .public-auth-frame-login > .login-card-modern,
  .public-auth-frame-registration > .registration-card-modern {
    order:1 !important;
    width:min(100%,470px) !important;
    max-width:470px !important;
    justify-self:center !important;
    align-self:start !important;
    box-sizing:border-box !important;
  }
  .public-auth-frame-login > .login-brand-modern,
  .public-auth-frame-registration > .registration-brand-modern {
    order:2 !important;
    width:100% !important;
    max-width:760px !important;
    justify-self:center !important;
    box-sizing:border-box !important;
  }
}

@media (max-width:700px) {
  .login-stage-modern,
  .login-stage.registration-stage-modern {
    min-height:100dvh !important;
    height:auto !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }
  .public-auth-frame-login,
  .public-auth-frame-registration {
    width:100% !important;
    padding:
      max(8px,env(safe-area-inset-top))
      clamp(8px,2.8vw,14px)
      max(22px,env(safe-area-inset-bottom)) !important;
    gap:clamp(14px,4vw,20px) !important;
  }
  .public-auth-frame-login > .login-card-modern,
  .public-auth-frame-registration > .registration-card-modern {
    width:min(100%,500px) !important;
    max-width:500px !important;
    padding:clamp(15px,4vw,20px) clamp(13px,4vw,18px) !important;
    border-radius:clamp(15px,4vw,18px) !important;
    margin:0 auto !important;
  }

  /* Form dimensions are fluid, not device-specific. */
  .login-card-modern .login-card-brand,
  .registration-card-brand { gap:clamp(7px,2.5vw,10px) !important; }
  .login-card-modern .login-card-mark,
  .registration-card-brand .login-card-mark {
    width:clamp(38px,10vw,44px) !important;
    height:clamp(38px,10vw,44px) !important;
  }
  .login-card-modern h1,
  .registration-card-modern h1 {
    font-size:clamp(22px,6.1vw,25px) !important;
    line-height:1.25 !important;
  }
  .login-card-modern > .hint,
  .registration-card-modern > .hint {
    font-size:clamp(11px,3vw,12px) !important;
    line-height:1.65 !important;
  }
  .login-form,
  .registration-card-modern form { width:100% !important; min-width:0 !important; }
  .login-form label,
  .registration-card-modern label { min-width:0 !important; }
  .login-form input,
  .login-form select,
  .login-form textarea,
  .password-input-wrap,
  .password-input-wrap input,
  .registration-card-modern input,
  .registration-card-modern select,
  .registration-card-modern textarea {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    font-size:16px !important;
  }
  .password-input-wrap { display:flex !important; }
  .password-input-wrap input { flex:1 1 auto !important; }
  .password-toggle { flex:0 0 auto !important; }
  .login-main-button,
  .registration-main-button,
  .login-create-school-visible,
  .login-tour-primary,
  .registration-fallback-actions .btn {
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }
  .login-tour-primary { align-items:center !important; }
  .login-tour-primary > span:last-child { min-width:0 !important; }
  .login-tour-primary strong,
  .login-tour-primary small { overflow-wrap:anywhere !important; }

  /* The marketing area remains the same design, but scales continuously. */
  .public-auth-frame-login > .login-brand-modern,
  .public-auth-frame-registration > .registration-brand-modern {
    padding-inline:clamp(2px,2vw,8px) !important;
  }
  .login-brand-modern .jw-brand-lockup.hero,
  .registration-stage-modern .registration-brand-modern .jw-brand-lockup.hero {
    width:min(70vw,235px) !important;
    max-width:235px !important;
  }
  .login-brand-copy h2,
  .registration-stage-modern .registration-brand-modern h2 {
    max-width:18ch !important;
    margin-inline:auto !important;
    font-size:clamp(25px,7.3vw,31px) !important;
    line-height:1.28 !important;
    letter-spacing:-.35px !important;
    overflow-wrap:normal !important;
  }
  .login-brand-copy p,
  .registration-stage-modern .registration-brand-modern p {
    max-width:42ch !important;
    font-size:clamp(10.8px,3vw,12px) !important;
    line-height:1.72 !important;
  }
  .login-feature-grid {
    width:100% !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:clamp(7px,2.4vw,10px) !important;
    margin-top:clamp(12px,4vw,17px) !important;
  }
  .login-feature-card,
  .login-feature-card:nth-last-child(-n+2) {
    grid-column:span 1 !important;
    min-width:0 !important;
    min-height:clamp(96px,28vw,116px) !important;
    padding:clamp(9px,2.8vw,12px) clamp(7px,2.4vw,10px) !important;
  }
  .login-feature-card:last-child { grid-column:1 / -1 !important; }
  .login-feature-card small { max-width:100% !important; overflow-wrap:anywhere !important; }
}

/* Only genuinely narrow screens collapse the service rail to one column. */
@media (max-width:340px) {
  .login-feature-grid { grid-template-columns:1fr !important; }
  .login-feature-card,
  .login-feature-card:nth-last-child(-n+2),
  .login-feature-card:last-child { grid-column:1 !important; min-height:84px !important; }
}

/* v0.9.0-rc8.25.7.6.29 — immediate feedback while transactional email is being accepted. */
button.verification-submit-busy {
  position:relative;
  cursor:wait !important;
  opacity:.84;
  padding-inline-start:2.35rem !important;
}
button.verification-submit-busy::before {
  content:"";
  position:absolute;
  inset-inline-start:.85rem;
  top:50%;
  width:.9rem;
  height:.9rem;
  margin-top:-.45rem;
  border:2px solid currentColor;
  border-inline-end-color:transparent;
  border-radius:50%;
  animation:verification-submit-spin .72s linear infinite;
}
@keyframes verification-submit-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) {
  button.verification-submit-busy::before { animation-duration:1.5s; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.32 — account identity, logout clarity and
   public-auth Arabic typography refinement.
   ============================================================ */
.login-stage,
.login-stage-modern,
.login-stage.registration-stage-modern,
.recovery-stage {
  font-family:Tahoma,"Segoe UI Variable","Segoe UI",Arial,sans-serif;
}
.login-brand-copy h2,
.login-card-modern h1,
.registration-card-modern h1,
.recovery-card h1 { font-weight:800; letter-spacing:0; }
.login-brand-copy p,
.login-card-modern .hint,
.registration-card-modern .hint,
.recovery-card .hint { font-weight:500; }

.sidebar-note {
  gap:8px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.14);
}
.sidebar-identity {
  display:grid;
  gap:3px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:11px;
  background:rgba(255,255,255,.055);
}
.sidebar-identity strong {
  color:#fff;
  font-size:13px;
  font-weight:800;
  line-height:1.45;
  overflow-wrap:anywhere;
}
.sidebar-identity span {
  color:#cbd9e8;
  font-size:10.5px;
  font-weight:650;
  line-height:1.5;
  overflow-wrap:anywhere;
}
.sidebar-logout-form { margin:0; opacity:1 !important; }
.sidebar-logout-button {
  width:100%; min-height:37px; padding:7px 10px;
  display:flex; align-items:center; justify-content:center; gap:8px;
  border:1px solid rgba(232,198,132,.42); border-radius:9px;
  background:rgba(219,174,88,.09); color:#f3dfb3;
  font:inherit; font-size:11.5px; font-weight:800; cursor:pointer;
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.sidebar-logout-button svg {
  width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.9;
  stroke-linecap:round; stroke-linejoin:round;
}
.sidebar-logout-button:hover,
.sidebar-logout-button:focus-visible {
  background:rgba(219,174,88,.18); border-color:rgba(244,211,145,.72);
  transform:translateY(-1px); outline:none;
}
.topbar-user { color:#243d59; font-size:12px; gap:9px; }
.topbar-user-copy { display:grid; gap:1px; min-width:0; text-align:right; }
.topbar-user-copy strong {
  color:#183a5d; font-size:12.5px; font-weight:850; line-height:1.35;
  max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.topbar-user-copy small {
  color:#5d7187; font-size:10px; font-weight:650; line-height:1.3;
  max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

.account-profile-panel { max-width:960px; }
.account-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }
.account-section-head p { max-width:760px; }
.account-profile-form { max-width:900px; }
.account-profile-grid {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 16px; align-items:start;
}
.account-profile-grid label:last-child { grid-column:1 / -1; }
.account-profile-grid .hint { margin:2px 0 0; font-size:11.5px; }

@media (max-width:720px) {
  .account-profile-grid { grid-template-columns:1fr; }
  .account-profile-grid label:last-child { grid-column:auto; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.33 — recovery flow uses the exact public-login
   visual identity, layout system and responsive behavior.
   ============================================================ */
.recovery-stage.login-stage-modern {
  width:100%;
  max-width:none;
  margin:0;
}
.recovery-auth-frame { align-items:center; }
.recovery-auth-frame > .recovery-card {
  width:min(470px,100%);
  max-width:470px;
  gap:.78rem;
}
.recovery-card .registration-step { margin-bottom:-.15rem; }
.recovery-card .login-main-button { width:100%; }
.recovery-card .registration-secondary-actions { justify-content:center; }
@media (max-width:1100px) {
  .recovery-auth-frame > .recovery-card {
    order:1 !important;
    justify-self:center !important;
  }
  .recovery-auth-frame > .login-brand-modern { order:2 !important; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.34 — refined login credentials + mobile
   navigation orientation cue after each successful sign-in.
   ============================================================ */
.login-form-refined { gap:9px; }
.login-form-refined .login-field-label {
  display:grid;
  gap:6px;
  margin:0;
  color:#344e69;
  font-size:11.5px;
  font-weight:800;
  line-height:1.45;
}
.login-input-shell {
  position:relative;
  display:block !important;
  width:100%;
  min-width:0;
}
.login-input-shell .login-input-icon {
  position:absolute;
  z-index:2;
  inset-inline-start:13px;
  top:50%;
  width:20px;
  height:20px;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  color:#6d8197;
  pointer-events:none;
}
.login-input-shell .login-input-icon svg {
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.login-card-modern .login-input-shell > input,
.login-card-modern .login-input-shell.password-input-wrap > input {
  width:100%;
  min-width:0;
  min-height:50px;
  padding-inline-start:45px;
  padding-inline-end:14px;
  border:1px solid #cbd8e5;
  border-radius:11px;
  background:#fff;
  color:#183a5d;
  font-weight:650;
  box-shadow:inset 0 1px 2px rgba(10,44,76,.025);
}
.login-card-modern .login-input-shell > input::placeholder {
  color:#8d9aaa;
  opacity:1;
  font-weight:500;
}
.login-card-modern .login-input-shell > input:focus {
  border-color:#d2a34b;
  box-shadow:0 0 0 3px rgba(210,163,75,.12);
  outline:none;
}
.login-input-shell.login-password-input > input {
  padding-inline-end:52px !important;
}
.login-password-eye {
  position:absolute;
  z-index:3;
  inset-inline-end:7px;
  top:50%;
  width:40px;
  height:40px;
  min-height:40px;
  padding:0;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#60778f;
  box-shadow:none;
}
.login-password-eye:hover,
.login-password-eye:focus-visible {
  border:0;
  background:#f1f5f8;
  color:#1d527e;
  outline:2px solid transparent;
}
.login-password-eye svg {
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.login-password-eye .eye-closed { display:none; }
.login-password-eye[aria-pressed="true"] .eye-open { display:none; }
.login-password-eye[aria-pressed="true"] .eye-closed { display:block; }
.login-password-eye-label {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}
.login-form-refined .login-password-actions {
  margin-top:-1px;
  padding-inline:2px;
}
.login-form-refined .login-password-actions a {
  font-size:11.5px;
  font-weight:750;
}

@media (max-width:700px) {
  .login-form-refined .login-field-label { font-size:11px !important; gap:5px; }
  .login-card-modern .login-input-shell > input,
  .login-card-modern .login-input-shell.password-input-wrap > input {
    min-height:49px !important;
    font-size:16px !important;
  }
  .login-input-shell .login-input-icon { inset-inline-start:12px; }
  .login-password-eye { width:42px; height:42px; min-height:42px; inset-inline-end:4px; }
}

@media (prefers-reduced-motion:reduce) and (max-width:1024px) {
  .sidebar { transition-duration:.01ms !important; }
}
\n\n/* ============================================================\n   v0.9.0-rc8.25.7.6.35 — timetable edit affordance refinement\n   Presentation-only: contextual selection strip, clearer selected/locked\n   states and more discoverable per-cell shortcuts.\n   ============================================================ */\n.edit-selection-strip {\n  position:sticky; top:76px; z-index:23;\n  display:grid; grid-template-columns:minmax(260px,1fr) minmax(330px,1.2fr) auto;\n  align-items:center; gap:13px; margin:0 0 12px; padding:11px 13px;\n  border:1px solid #cfdbe8; border-radius:15px;\n  background:rgba(255,255,255,.97); box-shadow:0 10px 28px rgba(16,52,88,.10);\n  backdrop-filter:blur(12px);\n}\n.edit-selection-guide { display:flex; align-items:center; gap:10px; min-width:0; }\n.edit-selection-step {\n  width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center;\n  border-radius:50%; background:#edf3f9; border:1px solid #ccd9e7;\n  color:#274d76; font-size:14px; font-weight:900;\n}\n.edit-selection-guide strong,.edit-selection-guide small { display:block; }\n.edit-selection-guide strong { color:#173b63; font-size:.88rem; }\n.edit-selection-guide small { margin-top:2px; color:#6e8196; font-size:.72rem; line-height:1.55; }\n.edit-selection-picks { margin:0; display:grid; grid-template-columns:1fr 1fr auto; gap:7px; width:100%; }\n.selection-chip {\n  min-width:0; display:grid; gap:2px; padding:7px 9px; border:1px solid #dbe4ed;\n  border-radius:10px; background:#f8fafc; color:#6d7f92;\n}\n.selection-chip small { font-size:.65rem; }\n.selection-chip b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#334e69; font-size:.75rem; }\n.selection-chip.active { border-color:#d5a64e; background:#fff9ec; box-shadow:inset 0 0 0 1px rgba(213,166,78,.14); }\n.selection-clear { align-self:stretch; min-height:42px; }\n.edit-selection-actions { display:flex; gap:7px; align-items:center; justify-content:flex-end; flex-wrap:wrap; }\n.edit-selection-actions form { margin:0; }\n.edit-selection-actions .btn { min-height:40px; white-space:nowrap; }\n.edit-selection-strip[data-selection-count="1"] { border-color:#d7bd82; box-shadow:0 10px 28px rgba(135,93,26,.11); }\n.edit-selection-strip[data-selection-count="1"] .edit-selection-step { background:#fff4d8; border-color:#dcb965; color:#7a550c; }\n.edit-selection-strip[data-selection-count="2"] { border-color:#8dbda8; box-shadow:0 10px 28px rgba(18,101,77,.11); }\n.edit-selection-strip[data-selection-count="2"] .edit-selection-step { background:#eaf8f2; border-color:#8ac5ae; color:#176b56; }\n\n.drag-timetable .lesson.selected {\n  outline:3px solid #d3a54d !important; outline-offset:1px;\n  background:linear-gradient(180deg,#fffaf0,#fff4d9) !important;\n  box-shadow:0 7px 18px rgba(143,99,27,.14);\n}\n.drag-timetable .lesson.locked {\n  border:1px dashed #a77920; background:linear-gradient(180deg,#fffaf1,#fff8e8);\n}\n.drag-timetable .lesson.locked::after { content:"مقفلة"; color:#8a6117; font-size:.62rem; font-weight:800; }\n.cell-edit-actions { margin-top:2px; gap:5px; }\n.cell-edit-actions .cell-edit-link {\n  min-height:27px; align-items:center; justify-content:center; margin:0; padding:4px 7px;\n  border-radius:8px; border:1px solid #d6e0ea; background:#fff; color:#3d5873;\n  font-size:.67rem; font-weight:800; text-decoration:none; line-height:1.15;\n}\n.cell-edit-actions .cell-edit-link:hover,.cell-edit-actions .cell-edit-link:focus-visible {\n  border-color:#c9a45c; background:#fff9ef; color:#6e4b0d;\n}\n\n@media (max-width:1100px) {\n  .edit-selection-strip { grid-template-columns:1fr 1fr; top:70px; }\n  .edit-selection-actions { grid-column:1/-1; justify-content:stretch; }\n  .edit-selection-actions form { flex:1 1 180px; }\n  .edit-selection-actions .btn { width:100%; }\n}\n@media (max-width:700px) {\n  .edit-selection-strip {\n    top:67px; grid-template-columns:1fr; gap:8px; margin-inline:-4px; padding:9px 10px; border-radius:13px;\n  }\n  .edit-selection-guide small { font-size:.67rem; }\n  .edit-selection-picks { grid-template-columns:1fr 1fr; }\n  .selection-clear { grid-column:1/-1; min-height:34px; padding-block:5px; }\n  .edit-selection-actions { grid-column:auto; display:grid; grid-template-columns:1fr 1fr; gap:6px; }\n  .edit-selection-actions form { min-width:0; }\n  .edit-selection-actions .btn { min-height:39px; padding-inline:7px; font-size:.73rem; }\n  .cell-edit-actions .cell-edit-link { min-height:30px; padding:5px 7px; }\n}\n@media print { .edit-selection-strip { display:none !important; } }\n

/* ============================================================
   v0.9.0-rc8.25.7.6.36 — mobile/tablet experience redesign
   Presentation/navigation only. No solver, database or service behavior changes.
   ============================================================ */

/* Public entry: two unmistakable routes, followed by the selected sign-in task. */
.public-entry-stack {
  width:min(500px,100%);
  display:grid;
  gap:12px;
  align-content:center;
}
.public-entry-heading {
  display:grid;
  gap:2px;
  padding-inline:3px;
  color:#fff;
}
.public-entry-heading > span {
  color:#f0c979;
  font-size:10px;
  font-weight:900;
  letter-spacing:.05em;
}
.public-entry-heading > strong { font-size:21px; line-height:1.35; }
.public-entry-heading > small { color:#c7d6e6; font-size:11.5px; line-height:1.65; }
.public-entry-chooser {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.entry-choice-card {
  min-width:0;
  min-height:96px;
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:12px 13px;
  border:1px solid rgba(255,255,255,.26);
  border-radius:15px;
  text-decoration:none;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.entry-choice-card:hover,
.entry-choice-card:focus-visible { transform:translateY(-1px); outline:none; }
.entry-choice-login {
  background:rgba(255,255,255,.12);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.entry-choice-login:hover,
.entry-choice-login:focus-visible { border-color:rgba(255,255,255,.62); background:rgba(255,255,255,.16); }
.entry-choice-register {
  border-color:#e2b75f;
  background:linear-gradient(135deg,#fffaf0,#fff 72%);
  color:#173a62;
  box-shadow:0 9px 24px rgba(5,29,54,.12);
}
.entry-choice-register:hover,
.entry-choice-register:focus-visible { border-color:#f2c66d; box-shadow:0 12px 30px rgba(5,29,54,.18); }
.entry-choice-icon {
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:13px;
}
.entry-choice-login .entry-choice-icon { background:rgba(255,255,255,.11); color:#f3cd7d; }
.entry-choice-register .entry-choice-icon { background:#fff2d4; color:#9a6817; }
.entry-choice-icon svg {
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.entry-choice-card > span:last-child { min-width:0; display:grid; gap:1px; }
.entry-choice-card small { font-size:9.5px; font-weight:800; opacity:.78; }
.entry-choice-card strong { font-size:13.5px; line-height:1.4; }
.entry-choice-card em { font-style:normal; font-size:9.8px; line-height:1.45; opacity:.78; }
.public-entry-stack .entry-login-card {
  width:100%;
  max-width:none;
  padding:24px 27px 22px;
  border-radius:20px;
  border:1px solid rgba(242,204,126,.76);
  background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(249,251,253,.99));
  box-shadow:0 30px 70px rgba(3,23,42,.22);
}
.entry-login-label {
  width:max-content;
  max-width:100%;
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin:1px 0 3px;
  padding:4px 8px;
  border-radius:999px;
  background:#edf4fb;
  color:#2c547b;
  font-size:9.5px;
  font-weight:850;
}
.entry-login-label span { color:#2f8a69; font-size:7px; }
.public-entry-stack .entry-login-card h1 { margin-top:4px; }
.public-entry-stack .login-card-footer { margin-top:7px; }
.entry-tour-card {
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:68px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:14px;
  color:#fff;
  background:rgba(6,35,62,.2);
  text-decoration:none;
  backdrop-filter:blur(8px);
}
.entry-tour-card:hover,
.entry-tour-card:focus-visible { border-color:rgba(239,193,103,.7); background:rgba(6,35,62,.3); outline:none; }
.entry-tour-play {
  width:36px;height:36px;display:grid;place-items:center;border-radius:50%;
  background:rgba(239,190,96,.16);color:#efc46f;font-size:13px;
}
.entry-tour-card > span:nth-child(2) { min-width:0; display:grid; gap:1px; }
.entry-tour-card small { color:#bfd0e1; font-size:9.5px; }
.entry-tour-card strong { font-size:12.5px; }
.entry-tour-card em { color:#c9d8e7; font-size:9.5px; font-style:normal; line-height:1.45; }
.entry-tour-card > b { color:#efc46f; font-size:18px; }

/* Navigation hierarchy: the sidebar itself teaches the product architecture. */
.nav-section-label {
  margin:7px 9px 2px;
  padding-top:7px;
  border-top:1px solid rgba(255,255,255,.07);
  color:#8fa9c4;
  font-size:8px;
  font-weight:900;
  letter-spacing:.04em;
}
.main-nav > .nav-section-label:first-child { border-top:0; padding-top:0; margin-top:0; }
.mobile-sidebar-intro,
.topbar-mobile-context,
.mobile-section-heading,
.mobile-home-command,
.generation-mobile-command,
.mobile-timetable-guide { display:none; }

/* Tablet is a first-class layout: persistent navigation, not a phone drawer. */
@media (min-width:701px) and (max-width:1180px) {
  .app-shell {
    display:grid !important;
    grid-template-columns:232px minmax(0,1fr) !important;
    min-height:100vh;
    background:#f4f7fb;
  }
  .sidebar {
    position:sticky !important;
    top:0 !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;
    width:auto !important;
    height:100vh !important;
    min-height:100vh;
    transform:none !important;
    overflow-y:auto !important;
    padding:10px 10px 16px !important;
    box-shadow:-7px 0 25px rgba(5,25,47,.09);
    z-index:40;
  }
  .sidebar .brand-lockup { margin-bottom:2px; }
  .sidebar .brand-role { display:block !important; font-size:7px !important; }
  .sidebar nav { grid-template-columns:1fr !important; gap:2px !important; }
  .sidebar nav a { min-height:37px !important; padding:6px 8px !important; font-size:10.5px !important; }
  .sidebar nav a .nav-icon { width:24px; height:24px; flex-basis:24px; }
  .nav-section-label { font-size:7.5px; margin-top:5px; padding-top:5px; }
  .sidebar-note { padding:8px 5px 0 !important; }
  .mobile-nav-toggle,.mobile-nav-backdrop,.mobile-bottom-nav { display:none !important; }
  html.mobile-nav-lock, html.mobile-nav-lock body { overflow:auto !important; }
  .app-workspace { min-width:0; }
  .topbar { position:sticky !important; top:0; z-index:35; min-height:58px; padding:7px 15px !important; }
  .content { padding:18px 18px 36px !important; }
  .setup-navigation-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mobile-home-command { display:block; margin-bottom:16px; }
}

/* Phone shell: one clear top context + one clear bottom task bar. */
@media (max-width:700px) {
  body { background:#f4f7fb; }
  .topbar {
    min-height:60px !important;
    grid-template-columns:auto minmax(0,1fr) auto !important;
    align-items:center;
    gap:8px !important;
    padding:7px 9px !important;
    border-bottom:1px solid #dfe7ef;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(16px);
  }
  .mobile-nav-toggle {
    width:auto !important;
    min-width:64px;
    height:42px !important;
    padding:0 9px !important;
    display:flex !important;
    flex-direction:row !important;
    gap:7px !important;
    border-color:#ccd9e6 !important;
    border-radius:11px !important;
    color:#173c66 !important;
  }
  .mobile-nav-toggle b { display:block; font-size:10px; font-weight:900; }
  .mobile-nav-burger { width:18px; height:16px; display:grid !important; align-content:space-between; }
  .mobile-nav-burger i { display:block; width:18px; height:2px; border-radius:2px; background:currentColor; }
  .topbar-product { justify-self:start !important; }
  .topbar-product img { width:31px !important; height:31px !important; }
  .topbar-product > div { display:none; }
  .topbar-mobile-context {
    display:grid;
    min-width:0;
    justify-self:stretch;
    gap:0;
    text-align:right;
  }
  .topbar-mobile-context small,
  .topbar-mobile-context strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .topbar-mobile-context small { color:#73869a; font-size:8.5px; font-weight:700; }
  .topbar-mobile-context strong { color:#173b63; font-size:11.5px; font-weight:900; }
  .sidebar {
    width:min(89vw,336px) !important;
    padding:12px 12px 22px !important;
  }
  .mobile-sidebar-intro {
    display:block;
    margin:3px 0 7px;
    padding:10px 10px 9px;
    border:1px solid rgba(230,191,112,.28);
    border-radius:13px;
    background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.03));
  }
  .mobile-sidebar-intro-row { display:flex; align-items:flex-start; justify-content:space-between; gap:9px; }
  .mobile-sidebar-intro-row > div { display:grid; gap:1px; min-width:0; }
  .mobile-sidebar-intro small { color:#9fb4ca; font-size:8px; }
  .mobile-sidebar-intro strong { color:#fff; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .mobile-sidebar-intro span { color:#d6e0ea; font-size:9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .mobile-sidebar-intro p { margin:6px 0 0; color:#b7c8da; font-size:8.8px; line-height:1.55; }
  .mobile-sidebar-close {
    width:30px;height:30px;flex:0 0 30px;border:1px solid rgba(255,255,255,.14);border-radius:9px;
    background:rgba(255,255,255,.06);color:#fff;font-size:20px;line-height:1;
  }
  .nav-section-label { margin:6px 8px 1px; padding-top:6px; font-size:7.5px; }
  .sidebar nav a { min-height:42px !important; padding:7px 9px !important; }
  .content { padding:13px 10px 91px !important; }
  .mobile-bottom-nav {
    right:7px !important; left:7px !important; bottom:max(7px,env(safe-area-inset-bottom)) !important;
    height:62px !important; border-radius:17px !important;
  }
  .mobile-bottom-nav a,.mobile-bottom-nav button { position:relative; }
  .mobile-bottom-nav a.active,.mobile-bottom-nav button.active { color:#173a67; background:#f2f6fb; }
  .mobile-bottom-nav .mobile-bottom-primary {
    margin:5px 2px;
    border-radius:13px;
    background:linear-gradient(135deg,#c88d2e,#e1b054);
    color:#fff !important;
    box-shadow:0 6px 15px rgba(166,109,28,.22);
  }
  .mobile-bottom-nav .mobile-bottom-primary.active { background:linear-gradient(135deg,#b97d21,#daa343); }
  .mobile-bottom-nav span { font-size:1.05rem !important; }
  .mobile-bottom-nav b { font-size:.62rem !important; font-weight:850; }
}

/* Home becomes a command surface first; the long workflow becomes progressive disclosure. */
.mobile-home-command {
  padding:15px;
  border:1px solid #c9d9e8;
  border-radius:18px;
  background:linear-gradient(150deg,#173e68 0%,#245d8c 62%,#2e6a99 100%);
  color:#fff;
  box-shadow:0 15px 36px rgba(15,52,86,.16);
}
.mobile-home-command-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.mobile-home-command-top span { color:#d4e1ee; font-size:9.5px; font-weight:800; }
.mobile-home-command-top strong { color:#f1ca79; font-size:17px; }
.mobile-home-progress { height:5px; margin:7px 0 13px; border-radius:999px; background:rgba(255,255,255,.15); overflow:hidden; }
.mobile-home-progress span { display:block; height:100%; border-radius:inherit; background:#f0c56d; }
.mobile-home-command > small { color:#b8cee2; font-size:8.5px; font-weight:850; }
.mobile-home-command h2 { margin:2px 0 4px; color:#fff; font-size:19px; }
.mobile-home-command p { margin:0 0 11px; color:#d8e4ef; font-size:10.5px; line-height:1.65; }
.mobile-home-next { width:100%; min-height:45px; background:linear-gradient(135deg,#c98d2c,#e3b157) !important; }
.mobile-home-shortcuts { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:10px; }
.mobile-home-shortcuts a {
  min-width:0; display:grid; place-items:center; gap:2px; min-height:55px; padding:5px 2px;
  border:1px solid rgba(255,255,255,.12); border-radius:11px; background:rgba(255,255,255,.07);
  color:#fff; text-decoration:none;
}
.mobile-home-shortcuts span { color:#f2ce84; font-size:16px; }
.mobile-home-shortcuts b { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:8.4px; }
.mobile-section-heading { align-items:end; justify-content:space-between; gap:8px; margin:16px 2px 7px; }
.mobile-section-heading strong { color:#173b63; font-size:12px; }
.mobile-section-heading span { color:#7b8da0; font-size:8.7px; }
.workflow-step-title-actions { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.workflow-step-open {
  width:29px;height:29px;display:grid;place-items:center;border:1px solid #d8e2ec;border-radius:8px;
  color:#355c82;text-decoration:none;background:#fff;font-weight:900;
}
.workflow-step.current { border-color:#d5aa59; box-shadow:0 10px 24px rgba(128,87,21,.09); }
.workflow-step.current .workflow-step-number { background:#fff1cf; color:#7a5512; }

@media (max-width:1180px) {
  .mobile-home-command { display:block; }
}
@media (max-width:700px) {
  .school-dashboard-identity { margin-bottom:8px; }
  .work-center-head,.workflow-progress { display:none !important; }
  .mobile-home-command { margin:0 0 12px; }
  .mobile-section-heading { display:flex; }
  .guided-workflow { gap:7px; }
  .workflow-step { grid-template-columns:32px minmax(0,1fr) !important; gap:8px !important; padding:9px 10px !important; border-radius:12px !important; }
  .workflow-step-number { width:29px !important; height:29px !important; font-size:11px !important; }
  .workflow-step-title h2 { font-size:12px !important; }
  .workflow-state { padding:3px 6px !important; font-size:8px !important; }
  .workflow-step:not(.current) .workflow-step-body > p,
  .workflow-step:not(.current) .workflow-step-actions { display:none; }
  .workflow-step.current .workflow-step-body > p { margin:5px 0 8px; font-size:9.5px; }
  .workflow-step.current .workflow-step-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
  .workflow-step.current .workflow-step-actions .btn { min-height:36px; padding:5px 7px; font-size:9px; }
  .workflow-step-open { width:27px;height:27px;font-size:11px; }
  .work-attention { padding:12px; }
}

/* Setup: touch-first cards with hierarchy instead of a dense desktop grid. */
.setup-navigation-grid .action-card { position:relative; overflow:hidden; transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease; }
.setup-navigation-grid .action-card::after {
  content:'←'; position:absolute; inset-inline-end:14px; bottom:12px; color:#9a7328; font-weight:900;
}
.setup-navigation-grid .action-card:hover { transform:translateY(-1px); border-color:#d2b16f; box-shadow:0 9px 24px rgba(20,54,88,.08); }
@media (max-width:700px) {
  .setup-page-head p { font-size:10.5px; }
  .setup-navigation-grid { grid-template-columns:1fr !important; gap:8px !important; }
  .setup-navigation-grid .action-card { min-height:82px; padding:12px 14px !important; border-radius:13px; }
  .setup-navigation-grid .action-card h2 { margin:0 0 4px; padding-inline-end:25px; font-size:13px; }
  .setup-navigation-grid .action-card p { margin:0; padding-inline-end:0; font-size:9.5px; line-height:1.55; color:#6b7e92; }
}

/* Generation: mobile users see readiness + one primary decision before the technical detail. */
.generation-mobile-command {
  margin-bottom:12px;
  padding:15px;
  border:1px solid #cbd9e6;
  border-radius:18px;
  background:linear-gradient(150deg,#fff,#f7fafc);
  box-shadow:0 10px 28px rgba(14,48,81,.08);
}
.generation-mobile-command-head { display:grid; gap:2px; }
.generation-mobile-kicker { color:#9b7020; font-size:8.5px; font-weight:900; }
.generation-mobile-command-head strong { color:#173c65; font-size:18px; }
.generation-mobile-command-head small { color:#6f8194; font-size:10px; line-height:1.6; }
.generation-mobile-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin:11px 0; }
.generation-mobile-stats span { display:grid; gap:1px; padding:7px; border:1px solid #e0e7ee; border-radius:10px; background:#fff; text-align:center; }
.generation-mobile-stats small { color:#7c8da0; font-size:8px; }
.generation-mobile-stats b { color:#214c75; font-size:14px; }
.generation-mobile-primary { width:100%; }
@media (max-width:700px) {
  .generation-mobile-command { display:block; }
  .generation-mobile-command + .notice { margin-top:8px; }
  .generation-mobile-command ~ .page-head:first-of-type { margin-top:5px; }
  .engine-summary { display:grid; gap:6px; padding:10px; }
  .engine-summary > div { padding:8px; border-radius:9px; background:#f8fafc; }
  #generation-readiness { scroll-margin-top:72px; }
}

/* Timetable: keep the powerful grid, but teach the phone gesture at the exact moment it is needed. */
.mobile-timetable-guide {
  margin:0 0 9px;
  padding:10px 11px;
  border:1px solid #cbdbea;
  border-radius:12px;
  background:#f4f8fc;
}
.mobile-timetable-guide > div { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.mobile-timetable-guide span { color:#8b661c; font-size:8px; font-weight:900; }
.mobile-timetable-guide strong { color:#173c65; font-size:11px; }
.mobile-timetable-guide p { margin:4px 0 0; color:#687b90; font-size:9px; line-height:1.55; }
@media (max-width:700px) {
  .mobile-timetable-guide { display:block; }
  .drag-help { display:none !important; }
  .edit-timetable-wrap {
    margin-inline:-2px;
    border-radius:12px !important;
    box-shadow:0 5px 16px rgba(14,48,81,.06);
  }
  .edit-selection-strip { box-shadow:0 9px 24px rgba(14,48,81,.13) !important; }
  .quality-inline { padding:10px; }
  .quality-inline > div:first-child { display:flex; justify-content:space-between; gap:8px; }
}

/* Public login responsive behavior: keep both customer routes visible before marketing detail. */
@media (max-width:1100px) {
  .public-auth-frame-login { grid-template-columns:1fr !important; width:min(760px,calc(100% - 28px)) !important; }
  .public-entry-stack { order:1; justify-self:center; }
  .public-auth-frame-login > .login-brand-modern { order:2; justify-self:center; }
}
@media (max-width:700px) {
  .login-stage-modern { min-height:100dvh; padding:12px 0 24px !important; }
  .public-auth-frame-login { width:min(100% - 20px,520px) !important; gap:17px !important; }
  .public-entry-stack { gap:8px; }
  .public-entry-heading { padding:0 3px 2px; }
  .public-entry-heading > span { font-size:8px; }
  .public-entry-heading > strong { font-size:17px; }
  .public-entry-heading > small { font-size:9.5px; }
  .public-entry-chooser { gap:7px; }
  .entry-choice-card { min-height:82px; grid-template-columns:38px minmax(0,1fr); gap:7px; padding:9px 8px; border-radius:12px; }
  .entry-choice-icon { width:38px;height:38px;border-radius:11px; }
  .entry-choice-icon svg { width:21px;height:21px; }
  .entry-choice-card small { font-size:8px; }
  .entry-choice-card strong { font-size:10.5px; }
  .entry-choice-card em { font-size:7.8px; }
  .public-entry-stack .entry-login-card { padding:18px 16px 16px !important; border-radius:17px; }
  .public-entry-stack .entry-login-card h1 { font-size:23px !important; margin-bottom:2px; }
  .entry-login-label { font-size:8px; }
  .entry-tour-card { min-height:59px; grid-template-columns:32px minmax(0,1fr) auto; gap:8px; padding:8px 9px; }
  .entry-tour-play { width:31px;height:31px;font-size:11px; }
  .entry-tour-card small,.entry-tour-card em { font-size:8px; }
  .entry-tour-card strong { font-size:10px; }
  .public-auth-frame-login > .login-brand-modern { margin-top:3px; }
}

@media (max-width:700px) {
  .topbar { display:flex !important; }
  .mobile-nav-toggle { order:1; flex:0 0 auto; }
  .topbar-mobile-context { order:2; flex:1 1 auto; }
  .topbar-product { order:3; flex:0 0 auto; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.37 — JADWALE Experience System
   Full-site responsive UX pass: one identity, one navigation grammar,
   adaptive forms/tables/editors/dialogs, and first-class phone/tablet use.
   Presentation only; business/service/data behavior is unchanged.
   ============================================================ */
:root {
  --ux-navy:#153b62;
  --ux-navy-2:#225b89;
  --ux-gold:#d0a24c;
  --ux-gold-soft:#fff7e8;
  --ux-teal:#237b65;
  --ux-red:#a23c3c;
  --ux-ink:#1c3550;
  --ux-muted:#6e8195;
  --ux-line:#dce6ef;
  --ux-line-strong:#cbd8e4;
  --ux-paper:#f4f7fa;
  --ux-surface:#fff;
  --ux-soft:#f8fafc;
  --ux-radius-sm:10px;
  --ux-radius:15px;
  --ux-radius-lg:20px;
  --ux-shadow:0 10px 28px rgba(17,53,87,.07);
  --ux-shadow-hover:0 16px 34px rgba(17,53,87,.11);
  --ux-focus:0 0 0 3px rgba(208,162,76,.18);
}

/* Typography and interaction rhythm shared by every authenticated page. */
.app-shell,.public-share-shell {
  font-family:Tahoma,"Segoe UI Variable","Segoe UI",Arial,sans-serif;
  color:var(--ux-ink);
}
.app-workspace { min-width:0; }
.content { padding-block-start:24px; }
.content :where(h1,h2,h3,strong) { text-wrap:balance; }
.content :where(p,.hint,small) { text-wrap:pretty; }
.content a:focus-visible,.content button:focus-visible,.sidebar a:focus-visible,.topbar button:focus-visible {
  outline:2px solid var(--ux-gold);
  outline-offset:2px;
}

/* Route context: users should always know where they are. */
.workspace-route-context {
  flex:1 1 auto;
  min-width:0;
  display:grid;
  gap:1px;
  padding-inline:16px;
  border-inline-start:1px solid #e3eaf1;
  border-inline-end:1px solid #e3eaf1;
  text-align:right;
}
.workspace-route-context small {
  color:#8a6a2a;
  font-size:9px;
  font-weight:850;
  line-height:1.25;
}
.workspace-route-context strong {
  max-width:520px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#25496d;
  font-size:12px;
  font-weight:850;
  line-height:1.45;
}

/* Every page starts as a command header, not a loose title floating in space. */
.content > .page-head {
  position:relative;
  overflow:hidden;
  align-items:flex-start;
  margin-bottom:16px;
  padding:18px 20px 17px;
  border:1px solid var(--ux-line);
  border-radius:var(--ux-radius-lg);
  background:
    radial-gradient(circle at 0% 0%,rgba(208,162,76,.08),transparent 31%),
    linear-gradient(180deg,#fff,#fbfcfd);
  box-shadow:var(--ux-shadow);
}
.content > .page-head::before {
  content:"";
  position:absolute;
  inset-block:0;
  inset-inline-start:0;
  width:4px;
  background:linear-gradient(180deg,#edc66f,#b98528);
}
.content > .page-head > div:first-child { min-width:0; }
.content > .page-head h1 {
  margin:0 0 5px;
  color:var(--ux-navy);
  font-size:clamp(24px,2.1vw,32px);
  line-height:1.28;
  letter-spacing:-.25px;
}
.content > .page-head p {
  max-width:900px;
  margin:0;
  color:var(--ux-muted);
  font-size:13px;
  line-height:1.8;
}
.ux-page-breadcrumb {
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:7px;
  color:#8191a1;
  font-size:9.5px;
  font-weight:750;
}
.ux-page-breadcrumb span { color:#9a742b; font-weight:900; }
.ux-page-breadcrumb i { color:#b3bfca; font-style:normal; }
.ux-page-breadcrumb strong { color:#6a7c8f; font-size:inherit; }

/* Surface system: same geometry and hierarchy across setup, generation, reports, account and admin. */
.panel.ux-surface,.ux-surface {
  border:1px solid var(--ux-line);
  border-radius:var(--ux-radius);
  background:rgba(255,255,255,.985);
  box-shadow:0 7px 22px rgba(19,54,87,.055);
}
.ux-section-panel { position:relative; }
.ux-section-panel > h2,
.ux-section-panel > .page-head h2 {
  color:#214a72;
  font-size:17px;
  line-height:1.45;
}
.ux-section-panel > h2:first-child {
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:0;
}
.ux-section-panel > h2:first-child::before {
  content:"";
  width:5px;
  height:18px;
  flex:0 0 5px;
  border-radius:6px;
  background:linear-gradient(180deg,#e4b75c,#b88327);
}
.ux-quiet-state {
  min-height:94px;
  display:grid;
  place-items:center;
  text-align:center;
  color:#718497;
  background:linear-gradient(180deg,#fff,#f8fafc) !important;
}

/* Buttons: one priority language, touch-safe even when rendered from older pages. */
.btn {
  min-height:40px;
  padding:8px 14px;
  border-radius:10px;
  font-weight:750;
  line-height:1.25;
}
.btn.small { min-height:34px; padding:6px 10px; }
.btn.big { min-height:48px; }
.btn.primary {
  background:linear-gradient(135deg,#245e8f,#173f67);
  border-color:#245e8f;
  color:#fff;
}
.btn.success { background:#257b64; border-color:#257b64; color:#fff; }
.btn.danger { border-color:#e7c5c5; background:#fff7f7; color:#973838; }
.actions,.page-actions,.ux-page-actions { align-items:center; }
.ux-page-actions { gap:7px; }

/* Forms: consistent labels, hints, controls, disabled/read-only state. */
.content :where(label) {
  color:#3d5873;
  font-size:12px;
  font-weight:750;
  line-height:1.55;
}
.content :where(input,select,textarea) {
  min-width:0;
  border:1px solid var(--ux-line-strong);
  border-radius:10px;
  background:#fff;
  color:#213b55;
  box-shadow:inset 0 1px 2px rgba(21,59,98,.025);
}
.content textarea { min-height:100px; resize:vertical; }
.content :where(input,select,textarea):focus {
  outline:none;
  border-color:#c99a40;
  box-shadow:var(--ux-focus);
}
.content :where(input,select,textarea):disabled,
.content :where(input,select,textarea)[readonly] {
  background:#f3f6f9;
  color:#6f8194;
  border-color:#dce4ec;
}
.content label > small,.content .hint { color:#77899b; font-size:11px; line-height:1.65; }
.check {
  min-height:40px;
  padding:7px 9px;
  border:1px solid transparent;
  border-radius:9px;
}
.check:hover { border-color:#e1e8ef; background:#f9fbfc; }
.check input { flex:0 0 auto; accent-color:#245e8f; }
.form-row { gap:12px; }
.ux-form { max-width:100%; }

/* Notices, status and empty communication use one semantic language. */
.notice.ux-notice,.notice {
  border-radius:12px;
  border-width:1px;
  box-shadow:none;
  line-height:1.7;
}
.notice.ok,.notice.success { background:#f0faf6; border-color:#bfe1d3; color:#245f4e; }
.notice.info { background:#f1f7fc; border-color:#c8ddeb; color:#285572; }
.notice.warn { background:#fff9eb; border-color:#e9d6a7; color:#745b22; }
.notice.error { background:#fff4f4; border-color:#e9c4c4; color:#873232; }

/* Generic data tables get a calm desktop table and a true card view on phones. */
.table-wrap {
  border-radius:12px;
  scrollbar-width:thin;
  scrollbar-color:#c6d3df transparent;
}
table.ux-mobile-cards {
  border:1px solid #e1e8ef;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
}
table.ux-mobile-cards th {
  padding:10px 9px;
  background:#f3f6f9;
  color:#526980;
  font-size:11px;
  font-weight:850;
}
table.ux-mobile-cards td {
  padding:10px 9px;
  border-color:#e8edf2;
  color:#304961;
  vertical-align:top;
}
table.ux-mobile-cards tbody tr { transition:background .12s ease; }
table.ux-mobile-cards tbody tr:hover { background:#fbfcfd; }

/* Timetable/report matrices keep their spatial meaning and receive a discoverable scroll cue. */
.ux-wide-scroll { position:relative; }
.ux-scroll-cue {
  display:none;
  align-items:center;
  gap:6px;
  margin:0 0 7px;
  padding:6px 9px;
  border:1px solid #d9e4ed;
  border-radius:9px;
  background:#f6f9fc;
  color:#647b91;
  font-size:9px;
}
.ux-scroll-cue span { color:#9a7429; font-size:14px; }
.ux-scroll-cue strong { font-size:inherit; }

/* Details are intentional disclosure controls instead of unstyled browser widgets. */
.ux-disclosure,
details.row-editor,
details.inline-editor {
  border-radius:10px;
}
.ux-disclosure > summary,
details.row-editor > summary,
details.inline-editor > summary {
  cursor:pointer;
  list-style:none;
}
.ux-disclosure > summary::-webkit-details-marker,
details.row-editor > summary::-webkit-details-marker,
details.inline-editor > summary::-webkit-details-marker { display:none; }
.ux-disclosure[open] { padding-bottom:8px; }

/* Confirm dialogs share the product identity. */
dialog.ux-dialog,dialog.confirm-dialog {
  width:min(540px,calc(100% - 28px));
  padding:0;
  border:1px solid #d8e3ec;
  border-radius:18px;
  background:#fff;
  box-shadow:0 28px 80px rgba(8,36,64,.24);
}
dialog.ux-dialog::backdrop,dialog.confirm-dialog::backdrop {
  background:rgba(8,28,49,.52);
  backdrop-filter:blur(3px);
}
.confirm-dialog-body { padding:22px; }
.confirm-dialog-body h2 { margin-top:0; color:#173f67; }
.confirm-dialog-actions { display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }
.confirm-dialog-actions form { margin:0; }

/* Setup/action cards have a shared customer-facing visual signature. */
.action-card,.report-action-card {
  position:relative;
  overflow:hidden;
  border:1px solid var(--ux-line);
  background:linear-gradient(180deg,#fff,#fbfcfd);
}
.action-card::before,.report-action-card::before {
  content:"";
  position:absolute;
  inset-block:0;
  inset-inline-start:0;
  width:3px;
  background:linear-gradient(180deg,rgba(208,162,76,.8),rgba(208,162,76,.15));
}
.action-card:hover,.report-action-card:hover {
  border-color:#d4bc8a;
  box-shadow:var(--ux-shadow-hover);
}

/* Public shared reports feel like a branded product surface, not an exported raw page. */
.public-share-shell.ux-public-shell { background:linear-gradient(180deg,#f4f7fa,#eef3f7); }
.public-share-header.ux-public-header {
  min-height:68px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding:10px clamp(16px,4vw,42px);
  border-bottom:1px solid #dce5ed;
  background:rgba(255,255,255,.97);
  box-shadow:0 8px 24px rgba(15,49,80,.05);
}
.ux-public-brand { max-width:155px !important; margin:0 !important; }
.ux-public-header-copy { min-width:0; display:grid; gap:1px; }
.ux-public-header-copy small { color:#9b7428; font-size:9px; font-weight:850; }
.ux-public-header-copy strong { color:#23496f; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ux-public-login { min-width:86px; }
.public-share-content { margin-top:18px; }
.public-share-card,.public-share-summary,.public-share-note { border-radius:var(--ux-radius); }

/* Desktop/tablet navigation itself becomes part of the orientation system. */
.nav-section-label { letter-spacing:0; text-transform:none; }
.sidebar nav a .nav-label { line-height:1.45; }
.sidebar nav a.active { box-shadow:inset 0 0 0 1px rgba(231,190,109,.08); }

/* Tablet: persistent navigation + compact command header + comfortable two-column surfaces. */
@media screen and (min-width:701px) and (max-width:1180px) {
  .app-shell { grid-template-columns:238px minmax(0,1fr) !important; }
  .topbar { padding-inline:14px !important; gap:12px !important; }
  .workspace-route-context { padding-inline:12px; }
  .workspace-route-context strong { max-width:300px; }
  .topbar-user-copy strong { max-width:170px; }
  .topbar-user-copy small { max-width:190px; }
  .content { padding:18px 18px 34px !important; }
  .content > .page-head { padding:16px 17px; border-radius:16px; }
  .content > .page-head h1 { font-size:25px; }
  .content > .page-head p { font-size:12px; }
  .stats-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .report-actions-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grid-3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .toolbar { gap:10px; }
  .toolbar label { min-width:160px; }
}

/* Phone: no desktop leftovers. Every common UI primitive receives a native mobile form. */
@media screen and (max-width:700px) {
  html.ux-sheet-open,html.ux-sheet-open body { overflow:hidden !important; }
  .workspace-route-context { display:none !important; }
  .content {
    width:100%;
    padding:11px 9px 92px !important;
  }
  .content > .page-head {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:11px !important;
    margin-bottom:11px;
    padding:13px 13px 12px;
    border-radius:14px;
    box-shadow:0 6px 18px rgba(17,53,87,.055);
  }
  .content > .page-head::before { width:3px; }
  .content > .page-head h1 { font-size:20px; line-height:1.3; }
  .content > .page-head p {
    max-width:none;
    font-size:10.5px;
    line-height:1.7;
  }
  .ux-page-breadcrumb { margin-bottom:5px; font-size:8px; gap:5px; }
  .content > .page-head .actions,
  .content > .page-head .page-actions,
  .content > .page-head .ux-page-actions {
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }
  .content > .page-head :where(.actions,.page-actions,.ux-page-actions) .btn,
  .content > .page-head :where(.actions,.page-actions,.ux-page-actions) form,
  .content > .page-head :where(.actions,.page-actions,.ux-page-actions) form .btn {
    width:100%;
    min-width:0;
  }
  .content > .page-head :where(.actions,.page-actions,.ux-page-actions) .btn.primary:first-child,
  .content > .page-head :where(.actions,.page-actions,.ux-page-actions) form:first-child:last-child {
    grid-column:1 / -1;
  }

  /* Panels become compact task cards. */
  .panel.ux-surface,.panel {
    margin-bottom:10px;
    padding:12px !important;
    border-radius:13px !important;
    box-shadow:0 4px 14px rgba(17,53,87,.045);
  }
  .ux-section-panel > h2,.panel > h2 { font-size:14px; }
  .ux-section-panel > h2:first-child::before { width:4px; height:15px; flex-basis:4px; }
  .panel p,.panel .hint { font-size:9.8px; line-height:1.65; }
  .ux-quiet-state { min-height:76px; padding:15px !important; }

  /* Touch controls and forms. */
  .content .btn { min-height:44px; padding:8px 11px; font-size:11px; }
  .content .btn.small { min-height:38px; padding:6px 9px; font-size:10px; }
  .content .btn.big { min-height:48px; font-size:12px; }
  .content :where(label) { font-size:10.5px; }
  .content :where(input,select,textarea) {
    width:100%;
    max-width:100%;
    min-height:47px;
    font-size:16px !important;
    border-radius:10px;
    box-sizing:border-box;
  }
  .content textarea { min-height:110px; }
  .content label > small,.content .hint { font-size:9.3px; line-height:1.6; }
  .form-row,.account-profile-grid,.registration-settings-grid,.school-edit-grid {
    grid-template-columns:1fr !important;
    gap:7px !important;
  }
  .interactive-form,.ux-form {
    display:grid;
    gap:8px;
  }
  .check { min-height:44px; padding:7px 6px; font-size:10.5px !important; }
  .check input { width:20px !important; min-height:20px !important; }
  .toolbar {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:7px !important;
    padding:10px !important;
  }
  .toolbar label,.toolbar .btn,.toolbar form,.toolbar select { width:100% !important; min-width:0 !important; }
  .actions.wrap { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; }
  .actions.wrap > * { min-width:0; }

  /* CRUD/admin/data tables become cards: no microscopic columns, no mystery horizontal scrolling. */
  .table-wrap:has(> table.ux-mobile-cards) {
    overflow:visible !important;
    border-radius:0;
  }
  table.ux-mobile-cards,
  table.ux-mobile-cards tbody,
  table.ux-mobile-cards tr,
  table.ux-mobile-cards td {
    display:block;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
  }
  table.ux-mobile-cards {
    border:0;
    background:transparent;
    border-radius:0;
  }
  table.ux-mobile-cards thead {
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0 0 0 0) !important;
    white-space:nowrap !important;
  }
  table.ux-mobile-cards tbody { display:grid; gap:8px; }
  table.ux-mobile-cards tbody tr {
    overflow:hidden;
    border:1px solid #dfe7ef;
    border-radius:12px;
    background:#fff;
    box-shadow:0 4px 12px rgba(16,49,80,.04);
  }
  table.ux-mobile-cards tbody tr:hover { background:#fff; }
  table.ux-mobile-cards td {
    display:grid;
    grid-template-columns:minmax(82px,34%) minmax(0,1fr);
    align-items:start;
    gap:9px;
    min-height:38px;
    padding:8px 10px;
    border:0;
    border-bottom:1px solid #edf1f5;
    font-size:10.5px;
    line-height:1.55;
    text-align:right;
    overflow-wrap:anywhere;
  }
  table.ux-mobile-cards td:last-child { border-bottom:0; }
  table.ux-mobile-cards td::before {
    content:attr(data-label);
    color:#74879a;
    font-size:8.5px;
    font-weight:850;
    line-height:1.55;
  }
  table.ux-mobile-cards td[data-label=""],
  table.ux-mobile-cards .ux-empty-table-row td {
    display:block;
  }
  table.ux-mobile-cards td[data-label=""]::before,
  table.ux-mobile-cards .ux-empty-table-row td::before { display:none; }
  table.ux-mobile-cards td :where(input,select,textarea) { min-height:42px; }
  table.ux-mobile-cards td .assignment-actions,
  table.ux-mobile-cards td.table-actions,
  table.ux-mobile-cards td .actions {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:5px;
    width:100%;
  }
  table.ux-mobile-cards td :where(.assignment-actions,.table-actions,.actions) > *,
  table.ux-mobile-cards td :where(.assignment-actions,.table-actions,.actions) .btn,
  table.ux-mobile-cards td > form,
  table.ux-mobile-cards td > form .btn { width:100%; min-width:0; }

  /* Spatial tables remain real grids with sticky identity column. */
  .ux-scroll-cue { display:flex; }
  .ux-wide-scroll {
    overflow-x:auto !important;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x proximity;
  }
  table.ux-wide-grid { min-width:760px; }
  table.ux-wide-grid :where(th:first-child,td:first-child) {
    position:sticky;
    right:0;
    z-index:3;
    background:#fff;
    box-shadow:-7px 0 9px -9px rgba(13,45,76,.55);
  }
  table.ux-wide-grid thead th:first-child { z-index:5; background:#f1f5f9; }
  .timetable-wrap,.report-table-wrap { margin-inline:0 !important; }

  /* Inline table editors become a proper bottom sheet on phones. */
  details.ux-mobile-editor[open] > .mini-edit-form,
  details.ux-mobile-editor[open] > form {
    position:fixed !important;
    inset:auto 0 0 0 !important;
    z-index:1505 !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    max-height:min(82dvh,720px) !important;
    margin:0 !important;
    padding:14px 13px max(16px,env(safe-area-inset-bottom)) !important;
    overflow:auto !important;
    border:1px solid #d4e0ea !important;
    border-radius:20px 20px 0 0 !important;
    background:#fff !important;
    box-shadow:0 -22px 70px rgba(7,31,55,.28) !important;
  }
  details.ux-mobile-editor[open]::after {
    content:"";
    position:fixed;
    inset:0;
    z-index:1500;
    background:rgba(7,27,48,.43);
    backdrop-filter:blur(2px);
    pointer-events:none;
  }
  .ux-sheet-close {
    position:sticky;
    top:-14px;
    z-index:2;
    width:100%;
    min-height:40px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin:-14px -13px 9px !important;
    padding:8px 13px;
    border:0;
    border-bottom:1px solid #e5ebf1;
    background:rgba(255,255,255,.97);
    color:#31516f;
    font:inherit;
    cursor:pointer;
  }
  .ux-sheet-close span { font-size:24px; line-height:1; }
  .ux-sheet-close b { font-size:10px; }

  /* Confirmation is a thumb-reachable sheet rather than a tiny centered desktop modal. */
  dialog.ux-dialog,dialog.confirm-dialog {
    width:100%;
    max-width:none;
    margin:auto 0 0;
    border-radius:20px 20px 0 0;
  }
  .confirm-dialog-body { padding:16px 13px max(18px,env(safe-area-inset-bottom)); }
  .confirm-dialog-actions { display:grid; grid-template-columns:1fr 1fr; }
  .confirm-dialog-actions form,.confirm-dialog-actions .btn { width:100%; }

  /* Responsive information density. */
  .stats-grid,.result-stats,.quality-metrics,.generation-mobile-stats {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
  }
  .stat { min-height:74px; padding:10px !important; }
  .stat span { font-size:8.5px; }
  .stat strong { font-size:16px; }
  .report-actions-grid,.grid-2,.grid-3,.account-contact-grid,.share-actions-grid {
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  .report-action-card,.action-card { min-height:78px; padding:12px !important; }
  .report-action-card strong,.action-card h2 { font-size:12px; }
  .report-action-card span,.action-card p { font-size:9px; line-height:1.6; }
  .quality-head { align-items:flex-start; gap:9px; }
  .quality-score { flex:0 0 auto; }
  .quality-issues { gap:6px; }

  /* Public share: brand context remains visible and the report itself owns the screen. */
  .public-share-header.ux-public-header {
    min-height:58px;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:7px;
    padding:7px 9px;
  }
  .ux-public-brand { max-width:92px !important; }
  .ux-public-header-copy small { font-size:7px; }
  .ux-public-header-copy strong { font-size:9.5px; }
  .ux-public-login { min-width:64px; min-height:34px; padding-inline:7px; font-size:8.5px; }
  .public-share-content { width:calc(100% - 12px); margin:8px auto 14px; }
  .public-share-footer { width:calc(100% - 12px); }

  /* Disclosures are easy to tap and visually explicit. */
  .ux-disclosure > summary { min-height:42px; display:flex; align-items:center; }

  /* Account/settings and support should never become endless full-width text. */
  .account-profile-panel,.account-security-panel { max-width:none; }
  .account-section-head { display:grid; gap:5px; }
  .contact-verification-state { font-size:10px; }
}

@media screen and (max-width:380px) {
  .content { padding-inline:7px !important; }
  .content > .page-head { padding-inline:11px; }
  .stats-grid,.result-stats,.quality-metrics { grid-template-columns:1fr !important; }
  table.ux-mobile-cards td { grid-template-columns:76px minmax(0,1fr); gap:7px; padding-inline:8px; }
  .actions.wrap { grid-template-columns:1fr; }
}

/* Print must stay clean and structurally identical to the proven reporting logic. */
@media print {
  .workspace-route-context,.ux-page-breadcrumb,.ux-scroll-cue,.ux-sheet-close { display:none !important; }
  .content > .page-head { border:0 !important; box-shadow:none !important; padding:0 !important; background:none !important; }
  .content > .page-head::before { display:none !important; }
  .panel.ux-surface,.ux-surface { box-shadow:none !important; }
}

@media (prefers-reduced-motion:reduce) {
  .action-card,.report-action-card,.btn,.sidebar nav a { transition:none !important; }
}
@media screen and (max-width:700px) {
  table.ux-mobile-cards td[dir="ltr"]::before { direction:rtl; text-align:right; }
  table.ux-mobile-cards td[dir="ltr"] { text-align:left; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.38 — teacher timetable task-focused UX
   Presentation-only: makes teacher selection the primary action,
   clarifies screen hierarchy, and reduces instructional clutter.
   ============================================================ */
.teacher-focus-panel {
  position:relative;
  overflow:hidden;
  margin-bottom:12px;
  padding:18px 20px 15px;
  border:1px solid #b9cde0;
  border-radius:18px;
  background:linear-gradient(135deg,#ffffff 0%,#f7fbff 72%,#fff9ec 100%);
  box-shadow:0 14px 34px rgba(17,58,96,.09);
}
.teacher-focus-panel::before {
  content:"";
  position:absolute;
  inset-block:0;
  inset-inline-start:0;
  width:5px;
  background:linear-gradient(180deg,#d7a743,#f2c76c);
}
.teacher-focus-heading { display:flex; align-items:flex-start; gap:13px; }
.teacher-focus-icon {
  flex:0 0 48px; width:48px; height:48px; display:grid; place-items:center;
  border-radius:14px; border:1px solid #d7e1eb; background:#fff;
  box-shadow:0 7px 18px rgba(18,55,91,.08); font-size:22px;
}
.teacher-focus-kicker {
  display:block; margin-bottom:2px; color:#9a6c13; font-size:.7rem; font-weight:900;
}
.teacher-focus-heading h2 { margin:0; color:#153e68; font-size:1.16rem; line-height:1.35; }
.teacher-focus-heading p { margin:4px 0 0; color:#6b7f94; font-size:.79rem; line-height:1.7; }
.teacher-focus-controls {
  display:grid; grid-template-columns:minmax(350px,1.25fr) minmax(250px,.75fr);
  gap:12px; align-items:stretch; margin-top:14px;
}
.teacher-picker-primary {
  display:grid; gap:6px; padding:12px 14px; border:2px solid #d3a64d;
  border-radius:14px; background:#fff; box-shadow:0 8px 20px rgba(161,110,26,.08);
}
.teacher-picker-label { color:#173f67; font-size:.8rem; font-weight:900; }
.teacher-picker-primary select {
  width:100%; min-height:52px; padding:0 14px; border:1px solid #aebfd0;
  border-radius:11px; background:#fff; color:#102f51; font-size:1rem; font-weight:900;
  box-shadow:inset 0 1px 2px rgba(18,53,87,.04);
}
.teacher-picker-primary select:focus {
  outline:none; border-color:#c8922e; box-shadow:0 0 0 4px rgba(211,166,77,.16);
}
.teacher-picker-primary small { color:#7b8da0; font-size:.7rem; }
.teacher-current-card {
  display:flex; flex-direction:column; justify-content:center; min-width:0;
  padding:12px 14px; border:1px solid #d8e2ec; border-radius:14px;
  background:linear-gradient(180deg,#173f67,#1f5a8d); color:#fff;
  box-shadow:0 8px 20px rgba(18,58,96,.13);
}
.teacher-current-card small { color:#c8d8e8; font-size:.68rem; font-weight:800; }
.teacher-current-card strong {
  margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-size:1rem; line-height:1.55;
}
.teacher-current-card span { margin-top:4px; color:#d8e4f0; font-size:.68rem; line-height:1.55; }
.teacher-edit-flow {
  display:flex; align-items:center; gap:7px; margin-top:12px; padding-top:11px;
  border-top:1px solid #e0e8f0;
}
.teacher-edit-flow span {
  display:inline-flex; align-items:center; gap:6px; color:#718398; font-size:.72rem; font-weight:800;
}
.teacher-edit-flow span:not(:last-child)::after { content:"←"; margin-inline-start:5px; color:#a9b5c2; }
.teacher-edit-flow b {
  width:23px; height:23px; display:grid; place-items:center; border-radius:50%;
  background:#edf2f7; color:#60758b; font-size:.66rem;
}
.teacher-edit-flow .active { color:#8a6114; }
.teacher-edit-flow .active b { background:#fff1cd; color:#8a6114; border:1px solid #dfbd70; }
.teacher-context-toolbar {
  display:grid; grid-template-columns:minmax(280px,1fr) minmax(220px,.8fr) auto;
  align-items:end; gap:11px; margin-bottom:11px; padding:11px 13px;
}
.teacher-context-toolbar label { display:grid; gap:5px; color:#667c92; font-size:.72rem; font-weight:800; }
.teacher-context-toolbar select { min-height:40px; }
.teacher-context-copy {
  min-height:40px; display:flex; flex-direction:column; justify-content:center;
  padding:6px 10px; border-inline-start:1px solid #e1e7ee;
}
.teacher-context-copy small { color:#8899aa; font-size:.65rem; }
.teacher-context-copy strong { margin-top:2px; color:#284c72; font-size:.75rem; }
.teacher-edit-howto { margin-bottom:11px; padding:0; overflow:hidden; }
.teacher-edit-howto summary {
  cursor:pointer; list-style:none; padding:11px 13px; color:#365775; font-size:.78rem; font-weight:900;
  background:#fbfcfe;
}
.teacher-edit-howto summary::-webkit-details-marker { display:none; }
.teacher-edit-howto summary::before { content:"ⓘ"; margin-inline-end:7px; color:#b7801e; }
.teacher-edit-howto[open] summary { border-bottom:1px solid #e0e8ef; }
.teacher-edit-howto-body { display:grid; gap:7px; padding:11px 13px; }
.teacher-edit-howto-body p { margin:0; color:#64798e; font-size:.74rem; line-height:1.7; }
.teacher-edit-report { margin-top:10px; }

/* On large screens the contextual selection bar should not create a floating visual gap. */
@media screen and (min-width:1101px) {
  .teacher-edit-report + * { scroll-margin-top:90px; }
  .teacher-edit-toolbar { margin-bottom:10px; }
  .teacher-timetable + * { margin-top:0; }
  .content .edit-selection-strip { position:relative; top:auto; }
}

@media screen and (max-width:900px) {
  .teacher-focus-panel { padding:14px 14px 12px; border-radius:15px; }
  .teacher-focus-controls { grid-template-columns:1fr; gap:8px; margin-top:11px; }
  .teacher-picker-primary { padding:10px 11px; }
  .teacher-picker-primary select { min-height:50px; font-size:.95rem; }
  .teacher-current-card { min-height:72px; }
  .teacher-context-toolbar { grid-template-columns:1fr 1fr; align-items:stretch; }
  .teacher-context-toolbar > .btn { grid-column:1/-1; width:100%; }
  .teacher-context-copy { border-inline-start:0; border-top:1px solid #e1e7ee; }
}

@media screen and (max-width:600px) {
  .teacher-focus-heading { gap:9px; }
  .teacher-focus-icon { width:40px; height:40px; flex-basis:40px; border-radius:12px; font-size:18px; }
  .teacher-focus-heading h2 { font-size:.98rem; }
  .teacher-focus-heading p { font-size:.7rem; line-height:1.55; }
  .teacher-focus-controls { margin-top:9px; }
  .teacher-picker-primary { border-width:2px; }
  .teacher-picker-label { font-size:.74rem; }
  .teacher-picker-primary select { min-height:52px; font-size:.9rem; }
  .teacher-edit-flow { justify-content:space-between; gap:4px; overflow:hidden; }
  .teacher-edit-flow span { flex:1 1 0; justify-content:center; font-size:.62rem; white-space:nowrap; }
  .teacher-edit-flow span:not(:last-child)::after { display:none; }
  .teacher-edit-flow b { width:21px; height:21px; }
  .teacher-context-toolbar { grid-template-columns:1fr; gap:8px; }
  .teacher-context-copy { border-top:1px solid #e1e7ee; }
  .teacher-context-toolbar > .btn { grid-column:auto; }
  .teacher-edit-howto summary { padding:10px 11px; font-size:.72rem; }
  .teacher-edit-howto-body { padding:9px 11px; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.39 — task-first phone & tablet experience
   Presentation-only. The interface exposes one primary task first,
   moves secondary commands into a consistent action sheet, and turns
   timetable edits into contextual thumb-reachable actions.
   ============================================================ */

/* Route action discovery: secondary page commands no longer compete with the task. */
.ux-page-actions-trigger {
  display:none;
  min-height:42px;
  align-items:center;
  justify-content:flex-start;
  gap:9px;
  padding:8px 11px;
  border:1px solid #cfdae5;
  border-radius:11px;
  background:#fff;
  color:#214a72;
  font:inherit;
  text-align:right;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(16,51,83,.04);
}
.ux-page-actions-trigger > span {
  width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;
  border-radius:9px;background:#edf3f8;color:#315b83;font-weight:950;letter-spacing:2px;
}
.ux-page-actions-trigger > b { font-size:11px; }
.ux-page-actions-trigger > small { margin-inline-start:auto;color:#7c8ea0;font-size:8.5px; }
.ux-mobile-actions-shell[hidden] { display:none !important; }
.ux-mobile-actions-shell { position:fixed;inset:0;z-index:1700; }
.ux-mobile-actions-backdrop { position:absolute;inset:0;border:0;background:rgba(7,28,49,.48);backdrop-filter:blur(3px); }
.ux-mobile-actions-sheet {
  position:absolute;inset:auto 0 0 0;max-height:min(78dvh,700px);overflow:auto;
  padding:0 12px max(14px,env(safe-area-inset-bottom));border-radius:22px 22px 0 0;
  border:1px solid #d7e1ea;background:#fff;box-shadow:0 -24px 70px rgba(7,31,55,.28);
}
.ux-mobile-actions-sheet-head {
  position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0 -12px 10px;padding:12px 14px;border-bottom:1px solid #e6ecf1;background:rgba(255,255,255,.98);
}
.ux-mobile-actions-sheet-head > div { display:grid;gap:1px;min-width:0; }
.ux-mobile-actions-sheet-head small { color:#9a7428;font-size:8px;font-weight:850; }
.ux-mobile-actions-sheet-head strong { color:#173f67;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.ux-mobile-actions-sheet-head > button {
  width:38px;height:38px;flex:0 0 38px;border:1px solid #d7e1ea;border-radius:11px;background:#f7f9fb;color:#365673;font-size:23px;
}
.ux-mobile-actions-clone,
.ux-mobile-actions-clone.actions,
.ux-mobile-actions-clone.page-actions,
.ux-mobile-actions-clone.ux-page-actions {
  display:grid !important;grid-template-columns:1fr 1fr !important;gap:7px !important;width:100% !important;
}
.ux-mobile-actions-clone > *,
.ux-mobile-actions-clone .btn,
.ux-mobile-actions-clone form,
.ux-mobile-actions-clone form .btn { width:100% !important;min-width:0 !important;margin:0 !important; }
.ux-mobile-actions-clone .btn { min-height:46px;display:flex;align-items:center;justify-content:center;white-space:normal;text-align:center; }
html.ux-actions-open,html.ux-actions-open body { overflow:hidden !important; }

/* Route descriptions stay available without occupying the first screen. */
.ux-header-copy-toggle {
  display:none;margin-top:2px;padding:0;border:0;background:none;color:#34658f;font:inherit;font-size:9px;font-weight:850;cursor:pointer;
}

/* Section selector mirrors the teacher selector: choose context, then work immediately. */
.section-focus-panel {
  display:grid;grid-template-columns:minmax(260px,.75fr) minmax(360px,1.25fr);align-items:center;gap:14px;
  margin-bottom:10px;padding:15px 17px !important;border-color:#c9d7e4 !important;
  background:linear-gradient(135deg,#fff 0%,#f8fbfe 78%,#fff9ee 100%) !important;
}
.section-focus-heading { display:flex;align-items:flex-start;gap:11px;min-width:0; }
.section-focus-icon {
  width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border:1px solid #d5e0e9;border-radius:13px;
  background:#fff;color:#315f88;font-size:20px;box-shadow:0 6px 16px rgba(17,55,89,.06);
}
.section-focus-heading > div { min-width:0; }
.section-focus-heading small { color:#9a7428;font-size:8px;font-weight:900; }
.section-focus-heading h2 { margin:1px 0 3px;color:#173f67;font-size:16px; }
.section-focus-heading p { margin:0;color:#74879a;font-size:10px;line-height:1.55; }
.section-picker-primary {
  display:grid;gap:5px;padding:10px 12px;border:2px solid #d0a34b;border-radius:13px;background:#fff;
  box-shadow:0 7px 18px rgba(151,103,28,.07);
}
.section-picker-primary > span { color:#173f67;font-size:10px;font-weight:900; }
.section-picker-primary select { min-height:48px;font-weight:900;color:#173b61; }
.section-picker-primary small { color:#7a8c9d;font-size:8.5px; }
.section-context-toolbar {
  display:grid;grid-template-columns:minmax(260px,1fr) auto;align-items:end;gap:9px;margin-bottom:9px;padding:10px 12px !important;
}
.section-context-toolbar label { display:grid;gap:4px; }

/* Better discoverability of the active route in the phone task bar. */
@media screen and (max-width:700px) {
  .mobile-bottom-nav a,.mobile-bottom-nav button {
    margin:4px 2px;border-radius:12px !important;background:transparent !important;color:#637a90 !important;box-shadow:none !important;
  }
  .mobile-bottom-nav a.active,.mobile-bottom-nav button.active {
    color:#173f67 !important;background:#eef4f9 !important;box-shadow:inset 0 0 0 1px #d6e1eb !important;
  }
  .mobile-bottom-nav a.active::before,.mobile-bottom-nav button.active::before {
    content:"";position:absolute;top:3px;left:50%;width:22px;height:3px;transform:translateX(-50%);
    border-radius:99px;background:#d6a546;
  }
  .mobile-bottom-nav a.active span,.mobile-bottom-nav button.active span { color:#bb8127; }

  /* Floating support no longer covers editing controls. It remains in the full menu/support page. */
  .app-whatsapp-contact { display:none !important; }

  /* Page header: orientation first; descriptions and secondary actions only on demand. */
  .content > .page-head { gap:7px !important;padding:11px 12px !important; }
  .content > .page-head h1 { font-size:18px; }
  .content > .page-head p.ux-header-copy-long {
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:3.4em;
  }
  .content > .page-head p.ux-header-copy-long.ux-header-copy-expanded {
    display:block;max-height:none;overflow:visible;
  }
  .content > .page-head p.ux-header-copy-long + .ux-header-copy-toggle { display:inline-flex;justify-self:start; }

  /* Timetable editors are task surfaces: context -> grid -> contextual actions. */
  html.ux-timetable-task .content { padding-top:8px !important; }
  html.ux-timetable-task .content > .page-head { margin-bottom:8px; }
  html.ux-timetable-task .content > .page-head p { display:none; }
  html.ux-timetable-task .ux-page-breadcrumb { display:none; }

  .teacher-focus-panel,
  .section-focus-panel {
    display:grid !important;grid-template-columns:1fr !important;gap:7px !important;
    margin-bottom:7px !important;padding:9px 10px !important;border-radius:13px !important;
    box-shadow:0 5px 14px rgba(16,49,80,.05) !important;
  }
  .teacher-focus-panel::before { width:3px; }
  .teacher-focus-heading,.section-focus-heading { align-items:center;gap:7px; }
  .teacher-focus-icon,.section-focus-icon,
  .teacher-focus-kicker,.teacher-focus-heading p,.section-focus-heading p,
  .teacher-current-card,.teacher-edit-flow { display:none !important; }
  .teacher-focus-heading h2,.section-focus-heading h2 { margin:0;font-size:12px; }
  .teacher-picker-primary,.section-picker-primary {
    gap:3px;padding:7px 8px;border-width:2px;border-radius:11px;box-shadow:none;
  }
  .teacher-picker-label,.section-picker-primary > span { font-size:9px; }
  .teacher-picker-primary select,.section-picker-primary select { min-height:48px !important;font-size:16px !important; }
  .teacher-picker-primary small,.section-picker-primary small { font-size:8px; }

  .teacher-context-toolbar,.section-context-toolbar {
    display:grid !important;grid-template-columns:1fr !important;gap:5px !important;
    margin-bottom:6px !important;padding:7px 9px !important;border-radius:11px !important;
  }
  .teacher-context-toolbar .teacher-context-copy,
  .teacher-context-toolbar > .btn,
  .section-context-toolbar > .btn { display:none !important; }
  .teacher-context-toolbar label,.section-context-toolbar label { gap:2px;font-size:8.5px; }
  .teacher-context-toolbar select,.section-context-toolbar select { min-height:42px !important;font-size:14px !important; }

  .mobile-timetable-guide {
    display:flex !important;align-items:center;justify-content:space-between;gap:8px;
    margin:0 0 6px !important;padding:7px 9px !important;border:1px solid #dce5ed;border-radius:10px;background:#f8fafc;
  }
  .mobile-timetable-guide > div { min-width:0;display:flex;align-items:center;gap:5px; }
  .mobile-timetable-guide span { color:#967029;font-size:8px;font-weight:850; }
  .mobile-timetable-guide strong { color:#173f67;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  .mobile-timetable-guide p { margin:0 !important;color:#6f8295 !important;font-size:8.2px !important;white-space:nowrap; }
  .teacher-edit-howto { margin-bottom:6px !important;padding:0 !important;box-shadow:none !important; }
  .teacher-edit-howto summary { min-height:35px !important;padding:7px 9px !important;font-size:9px !important; }

  /* Contextual actions do not exist until a lesson is selected. */
  .edit-selection-strip[data-selection-count="0"] { display:none !important; }
  .edit-selection-strip[data-selection-count="1"],
  .edit-selection-strip[data-selection-count="2"] {
    position:fixed !important;top:auto !important;right:7px !important;left:7px !important;
    bottom:calc(max(7px,env(safe-area-inset-bottom)) + 68px) !important;z-index:1320 !important;
    display:grid !important;grid-template-columns:1fr !important;gap:6px !important;
    margin:0 !important;padding:9px 10px max(9px,env(safe-area-inset-bottom)) !important;
    border-radius:16px !important;background:rgba(255,255,255,.985) !important;
    box-shadow:0 -10px 34px rgba(7,31,55,.20) !important;backdrop-filter:blur(14px);
  }
  .edit-selection-guide { gap:7px; }
  .edit-selection-step { width:28px;height:28px;flex-basis:28px;font-size:11px; }
  .edit-selection-guide strong { font-size:10px; }
  .edit-selection-guide small { display:none; }
  .edit-selection-picks { grid-template-columns:1fr 1fr auto !important;gap:5px; }
  .selection-chip { min-height:34px;padding:5px 7px; }
  .selection-chip small { font-size:7px; }
  .selection-chip b { font-size:8.5px; }
  .selection-clear { grid-column:auto !important;min-height:34px !important;width:auto !important;padding-inline:8px !important;font-size:8px !important; }
  .edit-selection-actions { display:grid !important;grid-template-columns:1fr 1fr !important;gap:6px !important; }
  .edit-selection-actions .btn { min-height:42px !important;font-size:10px !important; }
  html.ux-selection-active .content { padding-bottom:205px !important; }

  /* Let the actual timetable reach the first screen much earlier. */
  html.ux-timetable-task .ux-scroll-cue { margin-bottom:4px;padding:4px 7px;font-size:8px; }
  html.ux-timetable-task .teacher-edit-summary { margin-block:4px 6px; }
  html.ux-timetable-task .print-report-title:not(.print-only) { padding-block:6px; }
}

/* Compact page action menu is also valuable on portrait tablets where the sidebar consumes width. */
@media screen and (max-width:980px) {
  .content > .page-head .ux-actions-collapsed { display:none !important; }
  .content > .page-head > .ux-page-actions-trigger { display:flex; }
  .ux-mobile-actions-sheet { left:50%;right:auto;width:min(560px,100%);transform:translateX(-50%); }
}

@media screen and (min-width:701px) and (max-width:980px) {
  .content > .page-head { grid-template-columns:minmax(0,1fr) auto !important;align-items:center; }
  .content > .page-head > .ux-page-actions-trigger { min-width:170px; }
  .content > .page-head > .ux-page-actions-trigger small { display:none; }
  .section-focus-panel { grid-template-columns:1fr !important; }
  .teacher-focus-controls { grid-template-columns:1fr !important; }
}

@media print {
  .ux-page-actions-trigger,.ux-mobile-actions-shell { display:none !important; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.40 — direct sign-in + unmistakable new-school path
   Public-entry UX only. Existing authentication/registration behavior is unchanged.
   ============================================================ */
.public-entry-direct { width:min(500px,100%); gap:10px; }
.public-entry-direct .entry-login-card { margin:0; }
.public-entry-direct .entry-login-card > .hint { max-width:390px; }
.new-school-divider {
  display:flex;align-items:center;gap:10px;margin:13px 0 9px;color:#8a9aad;font-size:10px;font-weight:800;
}
.new-school-divider::before,.new-school-divider::after { content:"";height:1px;flex:1;background:#dfe6ed; }
.new-school-divider span { padding-inline:3px; }
.new-school-cta {
  display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:11px;
  min-height:82px;padding:11px 12px;border:1.5px solid #d9aa4e;border-radius:14px;
  background:linear-gradient(135deg,#fff9ec 0%,#fff 72%);color:#173e66;text-decoration:none;
  box-shadow:0 6px 18px rgba(119,78,19,.07);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.new-school-cta:hover,.new-school-cta:focus-visible {
  transform:translateY(-1px);border-color:#c99332;box-shadow:0 10px 24px rgba(119,78,19,.12);outline:none;
}
.new-school-cta-icon {
  width:48px;height:48px;display:grid;place-items:center;border-radius:13px;background:#fff0cf;color:#966313;
}
.new-school-cta-icon svg { width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.new-school-cta-copy { min-width:0;display:grid;gap:1px; }
.new-school-cta-copy small { color:#8e6a28;font-size:9.5px;font-weight:850; }
.new-school-cta-copy strong { color:#173e66;font-size:14px;line-height:1.45; }
.new-school-cta-copy em { color:#6f8193;font-size:9.8px;font-style:normal;line-height:1.55; }
.new-school-cta > b { color:#ba842c;font-size:19px;font-weight:900; }
.entry-tour-secondary { opacity:.88;min-height:58px; }
.entry-tour-secondary:hover,.entry-tour-secondary:focus-visible { opacity:1; }

.registration-card-modern { position:relative; }
.registration-back-link {
  display:inline-flex;align-items:center;gap:6px;width:max-content;max-width:100%;margin:-2px 0 12px auto;
  min-height:34px;padding:6px 9px;border:1px solid #d8e2eb;border-radius:10px;background:#f8fafc;
  color:#315777;text-decoration:none;font-size:10px;font-weight:850;line-height:1.2;
}
.registration-back-link:hover,.registration-back-link:focus-visible { border-color:#cba45c;background:#fff9ee;color:#725019;outline:none; }
.registration-back-link > span { font-size:14px;line-height:1; }

@media screen and (max-width:1100px) {
  .public-auth-frame-login { align-items:start !important; }
  .public-entry-direct { order:1; }
}
@media screen and (max-width:700px) {
  .public-entry-direct { gap:8px; }
  .public-entry-direct .entry-login-card { padding:17px 15px 15px !important; }
  .public-entry-direct .entry-login-card .login-card-brand { margin-bottom:7px; }
  .public-entry-direct .entry-login-card h1 { margin-top:2px !important;font-size:22px !important; }
  .public-entry-direct .entry-login-card > .hint { font-size:10.5px !important;line-height:1.65; }
  .new-school-divider { margin:10px 0 7px;font-size:9px; }
  .new-school-cta { min-height:72px;grid-template-columns:42px minmax(0,1fr) auto;gap:9px;padding:9px 10px;border-radius:12px; }
  .new-school-cta-icon { width:42px;height:42px;border-radius:11px; }
  .new-school-cta-icon svg { width:24px;height:24px; }
  .new-school-cta-copy small { font-size:8.5px; }
  .new-school-cta-copy strong { font-size:12.5px; }
  .new-school-cta-copy em { font-size:8.8px; }
  .new-school-cta > b { font-size:16px; }
  .entry-tour-secondary { min-height:52px; }
  .registration-back-link { margin:0 0 9px auto;min-height:33px;font-size:9.5px; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.41 — print isolation + study-plan responsive repair
   Screen UX is explicitly isolated from print. Manual study-plan editing adapts
   to the actual editor width, including tablet layouts with a persistent sidebar.
   ============================================================ */
@media screen {
  .manual-plan-editor {
    container-type:inline-size;
    container-name:manual-plan-editor;
  }

  /* Keep field help inside the viewport in RTL layouts. Logical inline-end anchored
     the popup to the wrong physical edge and could push it outside the card. */
  .field-help::after {
    inset-inline-start:auto;
    inset-inline-end:auto;
    right:0;
    left:auto;
    width:min(19rem,calc(100vw - 32px));
    max-width:calc(100vw - 32px);
  }

  @container manual-plan-editor (max-width:760px) {
    .manual-plan-principle-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .manual-plan-meta-grid { grid-template-columns:1fr; gap:8px; margin:9px 0 12px; }
    .manual-level-list { gap:11px; }
    .manual-level-card { overflow:visible; border-radius:13px; }
    .manual-level-head {
      grid-template-columns:1fr;
      align-items:stretch;
      gap:8px;
      padding:11px;
      border-radius:13px 13px 0 0;
    }
    .manual-level-summary {
      grid-row:auto;
      grid-column:auto;
      display:flex;
      flex-wrap:wrap;
      justify-content:flex-start;
      gap:6px 12px;
      text-align:start;
    }
    .manual-level-head > .btn { justify-self:start; }
    .manual-level-card > .table-wrap { overflow:visible !important; padding:9px 9px 0; }
    .manual-plan-table {
      display:block !important;
      width:100% !important;
      min-width:0 !important;
      border-collapse:separate;
    }
    .manual-plan-table thead {
      position:absolute !important;
      width:1px !important;
      height:1px !important;
      margin:-1px !important;
      overflow:hidden !important;
      clip:rect(0 0 0 0) !important;
      white-space:nowrap !important;
    }
    .manual-plan-table tbody { display:grid !important; gap:8px; width:100%; }
    .manual-plan-table tr {
      display:grid !important;
      gap:0;
      width:100%;
      padding:4px 9px;
      border:1px solid #dfe7ef;
      border-radius:11px;
      background:#fbfcfd;
    }
    .manual-plan-table td {
      display:grid !important;
      grid-template-columns:minmax(108px,34%) minmax(0,1fr);
      align-items:center;
      gap:8px;
      width:100% !important;
      min-width:0 !important;
      padding:7px 0 !important;
      border:0 !important;
      border-bottom:1px solid #e9eef3 !important;
      text-align:right;
    }
    .manual-plan-table td:last-child { border-bottom:0 !important; }
    .manual-plan-table td::before {
      color:#6d8094;
      font-size:9px;
      font-weight:850;
      line-height:1.45;
    }
    .manual-plan-table td:nth-child(1)::before { content:"المادة"; }
    .manual-plan-table td:nth-child(2)::before { content:"النصاب الأسبوعي"; }
    .manual-plan-table td:nth-child(3)::before { content:"طول التجاور"; }
    .manual-plan-table td:nth-child(4)::before { content:"مرات التجاور"; }
    .manual-plan-table td:nth-child(5)::before { content:"إجراء"; }
    .manual-plan-table td:first-child { min-width:0 !important; }
    .manual-plan-table :where(input,select) { min-width:0 !important; width:100% !important; }
    .manual-plan-table td:last-child .btn { width:100%; }
    .manual-level-card > .btn { width:calc(100% - 18px); margin:9px; }
    .manual-plan-actions { margin-top:12px; padding-top:10px; }
    .manual-plan-save-side { align-items:stretch; flex-direction:column; }
    .manual-plan-save-side .btn { width:100%; }
  }

  @container manual-plan-editor (max-width:520px) {
    .manual-plan-principle-grid { grid-template-columns:1fr; }
    .manual-plan-table td { grid-template-columns:1fr; gap:4px; }
    .manual-plan-table td::before { font-size:8.5px; }
  }
}

@media screen and (max-width:820px) {
  /* On touch devices help behaves like a small bottom sheet instead of a floating
     tooltip that can be clipped by cards, sidebars or the viewport edge. */
  .field-help.is-open::after,
  .field-help:focus-visible::after {
    position:fixed;
    z-index:1800;
    right:12px;
    left:12px;
    top:auto;
    bottom:calc(84px + env(safe-area-inset-bottom));
    width:auto;
    max-width:none;
    max-height:42dvh;
    overflow:auto;
    transform:none;
    padding:12px 13px;
    border-radius:14px;
    box-shadow:0 18px 55px rgba(8,35,62,.24);
  }
}

/* 6.47 — smart-display navigation capacity mode.
   This is intentionally screen-only and activates only when JS detects a wide touch display
   whose vertical space cannot safely hold the desktop sidebar. Desktop mouse layouts and the
   existing <=1024px tablet/phone breakpoints remain unchanged. */
@media screen and (min-width:1025px) {
  html.mobile-nav-lock, html.mobile-nav-lock body { overflow:hidden; }
  .app-shell.smart-display-nav {
    display:block;
    min-height:100vh;
  }
  .app-shell.smart-display-nav .sidebar {
    position:fixed !important;
    top:0; right:0; bottom:0; left:auto;
    width:min(88vw,340px) !important;
    height:100dvh !important;
    min-height:0 !important;
    z-index:1200;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    overscroll-behavior:contain;
    transform:translateX(105%);
    transition:transform .22s ease;
    box-shadow:-18px 0 46px rgba(5,20,38,.22);
    padding:16px 14px 24px !important;
    gap:8px !important;
  }
  .app-shell.smart-display-nav.mobile-nav-open .sidebar { transform:translateX(0); }
  .app-shell.smart-display-nav .sidebar .jw-brand-lockup.compact { max-width:205px !important; margin:0 auto !important; }
  .app-shell.smart-display-nav .sidebar .jw-brand-lockup.compact.lateral .jw-emblem { max-width:126px !important; }
  .app-shell.smart-display-nav .sidebar .jw-brand-lockup.compact.lateral .jw-latin-name { font-size:11px !important; }
  .app-shell.smart-display-nav .sidebar .jw-brand-lockup.compact.lateral .jw-arabic-name { font-size:16px !important; }
  .app-shell.smart-display-nav .sidebar .brand-role { display:block !important; font-size:7px !important; }
  .app-shell.smart-display-nav .sidebar nav {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:3px !important;
    min-height:auto !important;
    flex:0 0 auto !important;
    align-content:start !important;
  }
  .app-shell.smart-display-nav .sidebar nav a {
    min-height:42px !important;
    height:auto !important;
    padding:8px 9px !important;
    font-size:12.5px !important;
    line-height:1.35 !important;
    gap:8px !important;
    white-space:normal !important;
    overflow:visible !important;
  }
  .app-shell.smart-display-nav .sidebar nav a .nav-label {
    display:block !important;
    min-width:0;
    white-space:normal !important;
    line-height:1.35 !important;
    overflow-wrap:anywhere;
  }
  .app-shell.smart-display-nav .nav-section-label {
    margin-top:7px !important;
    padding:4px 8px 2px !important;
    font-size:9px !important;
    line-height:1.25 !important;
  }
  .app-shell.smart-display-nav .nav-icon {
    width:25px !important;
    height:25px !important;
    min-width:25px !important;
  }
  .app-shell.smart-display-nav .sidebar-note {
    margin-top:4px !important;
    padding:8px 5px 4px !important;
    font-size:10px !important;
    line-height:1.3 !important;
  }
  .app-shell.smart-display-nav .sidebar-contact.whatsapp-link span { display:inline !important; }
  .app-shell.smart-display-nav .mobile-nav-backdrop {
    position:fixed;
    inset:0;
    z-index:1190;
    border:0;
    padding:0;
    background:rgba(4,16,31,.48);
    backdrop-filter:blur(2px);
    cursor:default;
  }
  .app-shell.smart-display-nav.mobile-nav-open .mobile-nav-backdrop { display:block; }
  .app-shell.smart-display-nav .topbar {
    position:sticky !important;
    top:0;
    z-index:1000;
    min-height:58px;
    padding:7px 14px !important;
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:10px;
  }
  .app-shell.smart-display-nav .mobile-nav-toggle {
    display:inline-flex !important;
    width:46px;
    min-width:46px;
    height:46px;
    border:1px solid #d8e1eb;
    border-radius:11px;
    background:#fff;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:3px;
    padding:0;
    color:#173a67;
    box-shadow:0 3px 10px rgba(15,45,82,.06);
  }
  .app-shell.smart-display-nav .content { padding-inline:18px !important; }
}

/* 6.47 — image timetable import. Screen review only; report/print CSS is untouched. */
@media screen {
  .image-import-intro { display:grid; gap:18px; }
  .image-import-kind-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .image-import-kind-card { border:1px solid #dbe4ef; border-radius:18px; padding:18px; background:linear-gradient(180deg,#fff,#f8fbff); display:grid; gap:11px; align-content:start; }
  .image-import-kind-card h3 { margin:0; color:#123f72; }
  .image-import-kind-card p { margin:0; line-height:1.8; color:#53677e; }
  .image-import-kind-icon { width:48px; height:48px; border-radius:14px; display:grid; place-items:center; background:#edf4fb; font-size:1.45rem; }
  .image-import-cell-example { width:min(210px,100%); min-height:58px; border:1px solid #cbd8e6; border-radius:10px; background:#fff; display:grid; place-items:center; padding:7px 12px; box-shadow:inset 0 0 0 1px rgba(18,63,114,.03); }
  .image-import-cell-example b { color:#173f67; }
  .image-import-cell-example small { color:#6f8094; }
  .image-import-upload { display:grid; gap:10px; margin-top:3px; }
  .image-import-upload label { display:grid; gap:6px; font-weight:800; }
  .image-import-upload input[type=file] { width:100%; min-height:46px; padding:9px; border:1px dashed #b8c8d9; border-radius:11px; background:#fff; }
  .image-import-upload select { width:100%; min-height:46px; padding:9px 11px; border:1px solid #c9d6e4; border-radius:11px; background:#fff; color:#173a5e; font-weight:700; }
  .image-import-single-grid { grid-template-columns:minmax(0,760px); justify-content:center; }
  .image-import-single-card { width:100%; }
  .image-import-upload small { color:#63758a; line-height:1.65; }
  .image-import-client-status { padding:9px 11px; border-radius:10px; background:#eef7ff; color:#174a79; font-size:.84rem; font-weight:700; }
  .image-import-client-status.error { background:#fff0f0; color:#9b1c1c; }
  .image-import-guidance-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
  .image-import-guidance-grid > div { border:1px solid #e0e7ef; border-radius:12px; padding:12px; display:flex; gap:9px; align-items:flex-start; background:#fafcff; }
  .image-import-guidance-grid b { width:26px; height:26px; border-radius:50%; display:grid; place-items:center; flex:0 0 auto; background:#173f67; color:#fff; }
  .image-import-guidance-grid span { line-height:1.65; color:#53677e; }
  .image-import-preview-summary { display:grid; gap:12px; }
  .image-import-table-wrap { overflow:auto; max-height:70vh; border:1px solid #d8e2ed; border-radius:14px; background:#fff; overscroll-behavior:contain; }
  .image-import-review-table { border-collapse:separate; border-spacing:0; min-width:max-content; width:100%; background:#fff; }
  .image-import-review-table th, .image-import-review-table td { border-inline-start:1px solid #e3e9f0; border-bottom:1px solid #e3e9f0; padding:4px; min-width:132px; vertical-align:middle; }
  .image-import-review-table thead th { position:sticky; top:0; z-index:6; background:#eef4fa; color:#173f67; }
  .image-import-review-table tbody th { position:sticky; inset-inline-start:0; z-index:4; background:#f7fafe; min-width:76px; }
  .image-import-review-table .image-import-day-col { min-width:90px; }
  .image-import-review-table .image-import-period-col { min-width:46px; }
  .image-import-review-table input { width:100%; min-width:124px; height:38px; border:1px solid transparent; border-radius:8px; padding:6px 8px; background:transparent; font-family:inherit; font-size:.8rem; }
  .image-import-review-table input:focus { outline:2px solid rgba(18,63,114,.18); border-color:#7fa5cc; background:#fff; }
  .image-import-review-table input.needs-review, .image-import-review-table td.needs-review-cell { background:#fff7dc; }
  .image-import-review-table input.needs-review { border-color:#e5c15d; }
  .image-import-header-input { font-weight:800; color:#173f67; text-align:center; }
  .image-import-apply-bar { position:sticky; bottom:10px; z-index:8; margin-top:14px; border:1px solid #cdd9e6; border-radius:14px; background:rgba(255,255,255,.96); backdrop-filter:blur(12px); box-shadow:0 10px 30px rgba(10,35,65,.10); padding:12px 14px; display:flex; justify-content:space-between; align-items:center; gap:14px; }
  .image-import-apply-bar > div { display:grid; gap:2px; }
  .image-import-apply-bar span { color:#63758a; font-size:.82rem; }
}
@media screen and (max-width:900px) {
  .image-import-kind-grid { grid-template-columns:1fr; }
  .image-import-guidance-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .image-import-apply-bar { align-items:stretch; flex-direction:column; bottom:78px; }
  .image-import-apply-bar .btn { width:100%; }
}
@media screen and (max-width:560px) {
  .image-import-guidance-grid { grid-template-columns:1fr; }
  .image-import-kind-card { padding:14px; }
}

/* 6.47 — reviewed smart matching inside image-import preview. Screen only. */
@media screen {
  .image-import-review-table th.match-ok,
  .image-import-review-table td.match-ok-cell { background:#f3fbf7; }
  .image-import-review-table th.match-review,
  .image-import-review-table td.needs-review-cell { background:#fff8df; }
  .image-import-review-table th.match-blocking,
  .image-import-review-table td.match-blocking-cell { background:#fff0f0; }
  .image-import-review-table input.match-ok { border-color:#9bcab3; background:#f8fffb; }
  .image-import-review-table input.match-review { border-color:#dfbd59; background:#fffaf0; }
  .image-import-review-table input.match-blocking { border-color:#d98888; background:#fff7f7; }
  .image-import-match-note,
  .image-import-alternatives,
  .image-import-raw { display:block; margin-top:4px; font-size:.67rem; line-height:1.35; color:#687b90; font-weight:600; }
  .image-import-alternatives { color:#966c12; }
  .image-import-cell-editor { display:grid; grid-template-columns:minmax(112px,1fr) minmax(112px,1fr); gap:5px; min-width:244px; }
  .image-import-cell-editor label { display:grid; gap:2px; margin:0; }
  .image-import-cell-editor label > span { font-size:.61rem; color:#718399; font-weight:800; }
  .image-import-cell-editor input { min-width:0; width:100%; }
  .image-import-cell-editor .image-import-raw { grid-column:1 / -1; white-space:normal; overflow-wrap:anywhere; }
  .image-import-cell-editor.empty-cell { opacity:.52; }
  .image-import-cell-editor.empty-cell:focus-within { opacity:1; }
  .image-import-review-confirm { margin-top:14px; border:1px solid #d5e1ec; border-radius:13px; padding:12px 14px; background:#f8fbfe; }
  .image-import-review-confirm label { display:flex; align-items:flex-start; gap:10px; margin:0; line-height:1.65; cursor:pointer; }
  .image-import-review-confirm input { width:20px; height:20px; flex:0 0 auto; margin-top:2px; accent-color:#173f67; }
  .image-import-review-confirm span { color:#4f647b; }
}
@media screen and (max-width:700px) {
  .image-import-cell-editor { grid-template-columns:1fr; min-width:148px; }
  .image-import-cell-editor .image-import-raw { grid-column:auto; }
}

/* 6.48 — image import confidence/review states. Screen only. */
@media screen {
  .image-import-confidence-legend { display:flex; flex-wrap:wrap; gap:7px; margin:10px 0 13px; }
  .image-import-confidence-legend span { padding:6px 10px; border-radius:999px; font-size:.76rem; font-weight:800; border:1px solid transparent; }
  .image-import-confidence-legend .legend-ok { background:#eefaf3; color:#24633f; border-color:#a8d5ba; }
  .image-import-confidence-legend .legend-review { background:#fff8df; color:#8b6512; border-color:#e5c76d; }
  .image-import-confidence-legend .legend-blocking { background:#fff0f0; color:#982c2c; border-color:#df9b9b; }
  .image-import-confidence-legend .legend-user { background:#eef5ff; color:#245d9b; border-color:#9bbce0; }
  .image-import-confidence-legend .legend-empty { background:#f3f5f7; color:#687786; border-color:#d5dce3; }
  .image-import-review-table input.match-user { border-color:#79a7d8 !important; background:#f1f7ff !important; }
  .image-import-review-table td.user-reviewed-cell,
  .image-import-review-table th.user-reviewed-cell { background:#eef5ff !important; }
  .image-import-raw strong { color:#a32d2d; }
}


/* 6.50 — reliable existing-timetable entry workspace. Screen only; print layouts remain isolated. */
@media screen {
  .existing-entry-intro { overflow:hidden; }
  .existing-entry-intro-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr); gap:22px; align-items:start; }
  .existing-entry-intro-grid h2 { margin-top:0; }
  .existing-entry-preflight { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:16px; }
  .existing-entry-preflight span { display:grid; gap:3px; padding:10px 12px; border:1px solid #dce6f0; border-radius:12px; background:#f8fbfe; color:#5d7086; font-size:.78rem; }
  .existing-entry-preflight b { color:#173f67; font-size:1.05rem; }
  .existing-entry-start-form { display:grid; gap:9px; padding:16px; border:1px solid #d7e2ed; border-radius:15px; background:#f9fbfd; }
  .existing-entry-start-form label { display:grid; gap:6px; font-weight:800; color:#263f5c; }
  .existing-entry-start-form input { width:100%; min-height:45px; padding:9px 11px; border:1px solid #c9d6e4; border-radius:10px; background:#fff; font:inherit; }
  .existing-entry-start-form small { color:#6b7e92; }
  .existing-entry-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
  .existing-entry-steps > div { display:flex; gap:9px; align-items:flex-start; border:1px solid #e0e7ef; border-radius:12px; padding:12px; background:#fafcff; }
  .existing-entry-steps b { width:27px; height:27px; flex:0 0 auto; display:grid; place-items:center; border-radius:50%; background:#173f67; color:#fff; }
  .existing-entry-steps span { line-height:1.6; color:#52677e; font-size:.86rem; }

  .existing-entry-dashboard { display:grid; grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr); gap:18px; align-items:center; }
  .existing-entry-progress-main { display:grid; gap:8px; }
  .existing-entry-progress-main > div { display:grid; grid-template-columns:auto 1fr; align-items:end; gap:3px 12px; }
  .existing-entry-progress-main span { color:#60758a; font-weight:800; }
  .existing-entry-progress-main strong { color:#173f67; font-size:1.45rem; justify-self:end; }
  .existing-entry-progress-main small { grid-column:1 / -1; color:#6e7f91; }
  .existing-entry-progress-main progress { width:100%; height:10px; accent-color:#26724b; }
  .existing-entry-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
  .existing-entry-stats span { display:grid; gap:4px; padding:10px 11px; border:1px solid #dce5ee; border-radius:11px; background:#fbfdff; color:#66798e; font-size:.76rem; }
  .existing-entry-stats b { color:#213f60; font-size:.98rem; }
  .existing-entry-stats .text-danger { color:#a32929; }

  .existing-entry-section-nav { display:flex; justify-content:space-between; align-items:end; gap:12px; }
  .existing-entry-section-nav label { display:grid; gap:6px; font-weight:800; color:#294763; }
  .existing-entry-section-nav select { min-width:min(380px,70vw); min-height:43px; border:1px solid #c8d6e4; border-radius:10px; padding:7px 10px; background:#fff; color:#173f67; font:inherit; font-weight:800; }
  .existing-entry-section-nav-buttons { display:flex; gap:7px; }

  .existing-entry-assignment-progress { display:grid; gap:12px; }
  .existing-entry-legend { display:flex; flex-wrap:wrap; gap:6px; }
  .existing-entry-legend span { padding:5px 9px; border-radius:999px; border:1px solid transparent; font-size:.72rem; font-weight:800; }
  .existing-entry-legend .manual-filled { background:#eef6ff; color:#245d95; border-color:#a9c7e6; }
  .existing-entry-legend .manual-empty { background:#f5f6f8; color:#6f7b87; border-color:#d8dde3; }
  .existing-entry-legend .manual-outside { background:#fff8df; color:#8a6515; border-color:#e5c96f; }
  .existing-entry-legend .manual-conflict { background:#fff0f0; color:#9c2c2c; border-color:#dfa1a1; }
  .existing-entry-assignment-badges { display:flex; flex-wrap:wrap; gap:8px; }
  .existing-entry-assignment-badges > span { min-width:150px; display:grid; grid-template-columns:1fr auto; gap:2px 9px; align-items:center; padding:9px 11px; border:1px solid #d8e1ea; border-radius:11px; background:#fff; }
  .existing-entry-assignment-badges b { color:#25435f; font-size:.83rem; }
  .existing-entry-assignment-badges small { grid-row:2; color:#728397; font-size:.7rem; }
  .existing-entry-assignment-badges strong { grid-row:1 / span 2; grid-column:2; font-size:.86rem; }
  .existing-entry-assignment-badges .assignment-count-ok { background:#f1fbf5; border-color:#a9d6bc; }
  .existing-entry-assignment-badges .assignment-count-ok strong { color:#276443; }
  .existing-entry-assignment-badges .assignment-count-under { background:#fffaf0; border-color:#e6d4a1; }
  .existing-entry-assignment-badges .assignment-count-under strong { color:#8a6718; }
  .existing-entry-assignment-badges .assignment-count-over { background:#fff0f0; border-color:#dfa0a0; }
  .existing-entry-assignment-badges .assignment-count-over strong { color:#a02828; }

  .existing-entry-grid-form { display:block; }
  .existing-entry-grid-panel { padding:0; overflow:hidden; }
  .existing-entry-grid-wrap { overflow:auto; max-height:68vh; overscroll-behavior:contain; border-bottom:1px solid #d9e2eb; }
  .existing-entry-grid { width:100%; min-width:980px; border-collapse:separate; border-spacing:0; background:#fff; }
  .existing-entry-grid th, .existing-entry-grid td { border-inline-start:1px solid #dfe6ed; border-bottom:1px solid #dfe6ed; padding:5px; vertical-align:middle; }
  .existing-entry-grid thead th { position:sticky; top:0; z-index:6; min-width:128px; background:#edf4fa; color:#173f67; text-align:center; }
  .existing-entry-grid thead th:first-child { min-width:90px; inset-inline-start:0; z-index:8; }
  .existing-entry-grid thead th span { display:block; font-size:.9rem; }
  .existing-entry-grid thead th small { display:block; margin-top:1px; color:#6c8196; font-size:.65rem; }
  .existing-entry-grid tbody th { position:sticky; inset-inline-start:0; z-index:5; min-width:90px; background:#f7fafe; color:#244664; }
  .existing-entry-grid td { min-width:150px; background:#f8fafc; transition:background .12s,border-color .12s; }
  .existing-entry-grid td.manual-filled-cell { background:#eef6ff; }
  .existing-entry-grid td.manual-outside-cell { background:#fff8df; }
  .existing-entry-grid td.manual-conflict-cell { background:#fff0f0 !important; box-shadow:inset 0 0 0 2px #d97878; }
  .existing-entry-grid select { width:100%; min-height:42px; border:1px solid #ccd7e2; border-radius:8px; padding:5px 7px; background:#fff; color:#213e5b; font:inherit; font-size:.78rem; }
  .existing-entry-grid select:focus { outline:2px solid rgba(23,63,103,.16); border-color:#7fa4c9; }
  .manual-slot-message { display:block; min-height:15px; margin-top:3px; color:#8b681b; font-size:.62rem; line-height:1.3; }
  .manual-conflict-cell .manual-slot-message { color:#a42828; font-weight:800; }
  .existing-entry-savebar { position:sticky; bottom:0; z-index:9; display:flex; justify-content:space-between; align-items:center; gap:14px; padding:12px 14px; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); }
  .existing-entry-savebar > div:first-child { display:grid; gap:2px; }
  .existing-entry-savebar span { color:#697b8e; font-size:.78rem; }
  .existing-entry-save-actions { display:flex; gap:7px; flex:0 0 auto; }
  .existing-entry-finish { display:flex; justify-content:space-between; align-items:center; gap:18px; border-color:#cfe1d6; background:linear-gradient(180deg,#fff,#f8fcfa); }
  .existing-entry-finish h2 { margin-top:0; }
  .existing-entry-finish p { margin-bottom:0; color:#5a6e81; line-height:1.65; }
  .existing-entry-finish details { margin-top:9px; color:#654f25; }
  .existing-entry-finish ul { max-height:220px; overflow:auto; }
}
@media screen and (max-width:980px) {
  .existing-entry-intro-grid, .existing-entry-dashboard { grid-template-columns:1fr; }
  .existing-entry-preflight, .existing-entry-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .existing-entry-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .existing-entry-savebar, .existing-entry-finish { align-items:stretch; flex-direction:column; }
  .existing-entry-save-actions { width:100%; }
  .existing-entry-save-actions .btn, .existing-entry-finish form .btn { flex:1; width:100%; }
}
@media screen and (max-width:620px) {
  .existing-entry-preflight, .existing-entry-stats, .existing-entry-steps { grid-template-columns:1fr; }
  .existing-entry-section-nav { align-items:stretch; flex-direction:column; }
  .existing-entry-section-nav > div, .existing-entry-section-nav select { width:100%; min-width:0; }
  .existing-entry-section-nav-buttons .btn { flex:1; }
  .existing-entry-assignment-badges > span { min-width:100%; }
  .existing-entry-save-actions { flex-direction:column; }
  .existing-entry-grid-wrap { max-height:62vh; }
}

/* 6.50 — optional fast-paint tool for existing timetable entry. */
@media screen {
  .existing-entry-quick-hint { padding:8px 10px; border-radius:10px; background:#f4f8fc; color:#5d7187; font-size:.76rem; line-height:1.6; }
  .existing-entry-quick-hint strong { color:#244865; }
  .existing-entry-assignment-badges > button { min-width:150px; display:grid; grid-template-columns:1fr auto; gap:2px 9px; align-items:center; padding:9px 11px; border:1px solid #d8e1ea; border-radius:11px; background:#fff; font:inherit; text-align:start; cursor:pointer; }
  .existing-entry-assignment-badges > button:disabled { cursor:not-allowed; opacity:.62; }
  .existing-entry-assignment-badges > button.manual-palette-active { outline:3px solid rgba(23,63,103,.22); border-color:#4e82b3; box-shadow:0 2px 10px rgba(23,63,103,.12); }
  .existing-entry-assignment-badges .manual-palette-clear { background:#f7f8fa; border-color:#d4dbe2; color:#68798a; }
  .existing-entry-assignment-badges .manual-palette-clear strong { color:#68798a; }
  .existing-entry-grid td[data-manual-cell] { cursor:cell; }
  .existing-entry-grid td[data-manual-cell] select { cursor:pointer; }
}

/* 6.51 — resume existing manual drafts and switch between section/teacher capture. */
@media screen {
  .existing-entry-resume-panel { display:grid; gap:14px; }
  .existing-entry-resume-list { display:grid; gap:9px; }
  .existing-entry-resume-list article { display:grid; grid-template-columns:minmax(220px,1fr) minmax(150px,.45fr) auto; gap:14px; align-items:center; padding:12px 14px; border:1px solid #dce5ee; border-radius:12px; background:#fbfdff; }
  .existing-entry-resume-list article > div:first-child { display:grid; gap:3px; }
  .existing-entry-resume-list strong { color:#213f60; }
  .existing-entry-resume-list small { color:#748598; }
  .existing-entry-resume-progress { display:grid; gap:5px; }
  .existing-entry-resume-progress b { color:#30526f; text-align:center; }
  .existing-entry-resume-progress progress { width:100%; height:8px; accent-color:#26724b; }
  .existing-entry-resume-actions, .existing-entry-start-actions, .existing-entry-mode-actions { display:flex; flex-wrap:wrap; gap:7px; }
  .existing-entry-start-actions .btn { flex:1; min-width:160px; }
  .existing-entry-mode-switch { display:flex; align-items:center; justify-content:space-between; gap:14px; border-color:#cfddea; background:#f8fbfe; }
  .existing-entry-mode-switch > div:first-child { display:grid; gap:3px; }
  .existing-entry-mode-switch strong { color:#173f67; }
  .existing-entry-mode-switch span { color:#667a8e; font-size:.8rem; }
  .existing-entry-stats { grid-template-columns:repeat(5,minmax(0,1fr)); }
}
@media screen and (max-width:980px) {
  .existing-entry-resume-list article { grid-template-columns:1fr; align-items:stretch; }
  .existing-entry-resume-actions .btn { flex:1; }
  .existing-entry-mode-switch { align-items:stretch; flex-direction:column; }
  .existing-entry-mode-actions .btn { flex:1; }
  .existing-entry-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media screen and (max-width:620px) {
  .existing-entry-resume-actions, .existing-entry-start-actions, .existing-entry-mode-actions { flex-direction:column; }
  .existing-entry-resume-actions .btn, .existing-entry-start-actions .btn, .existing-entry-mode-actions .btn { width:100%; }
  .existing-entry-stats { grid-template-columns:1fr; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.52 — mobile master timetable orientation anchors
   Keep the day header row and period column visible while navigating
   the wide general timetable on phones. Screen-only; print unchanged.
   ============================================================ */
@media screen and (max-width:760px) {
  .school-master-report .report-table-wrap {
    position:relative;
    max-height:68vh;
    max-height:min(72dvh, 760px);
    overflow:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    border:1px solid #d7e0ea;
    border-radius:10px;
    background:#fff;
  }
  .school-master-report .school-master-table {
    min-width:760px;
    border-collapse:separate;
    border-spacing:0;
  }
  .school-master-report .school-master-table thead th {
    position:sticky;
    top:0;
    z-index:12;
    background:#edf3f9 !important;
    box-shadow:0 2px 0 #cfd8e4;
  }
  .school-master-report .school-master-table .period-col,
  .school-master-report .school-master-table tbody .matrix-period {
    position:sticky;
    inset-inline-start:0;
    z-index:11;
    width:48px;
    min-width:48px;
    max-width:48px;
    background:#f6f8fb !important;
    border-inline-end:2px solid #cfd8e4;
    font-weight:900;
  }
  .school-master-report .school-master-table thead .period-col {
    z-index:15;
    background:#e8f0f8 !important;
  }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.53 — clearer day bands + unmistakable entity switchers
   Screen-only UX. Keeps day groups visually distinct on phones and makes
   teacher/section selectors read as deliberate switch controls.
   ============================================================ */
@media screen {
  /* Very light day bands: enough to track a day across a dense matrix without
     competing with lesson text or status colors. */
  .public-general-matrix tbody tr.day-tone-1 > td { background:#fbfdff; }
  .public-general-matrix tbody tr.day-tone-2 > td { background:#fffdf8; }
  .public-general-matrix tbody tr.day-tone-3 > td { background:#f8fcfb; }
  .public-general-matrix tbody tr.day-tone-4 > td { background:#fcf9fd; }
  .public-general-matrix tbody tr.day-tone-5 > td { background:#fffaf9; }
  .public-general-matrix tbody tr.day-tone-1 > .matrix-day { background:#eaf2fb !important; }
  .public-general-matrix tbody tr.day-tone-2 > .matrix-day { background:#f8f0dd !important; }
  .public-general-matrix tbody tr.day-tone-3 > .matrix-day { background:#e8f4ef !important; }
  .public-general-matrix tbody tr.day-tone-4 > .matrix-day { background:#f1eaf5 !important; }
  .public-general-matrix tbody tr.day-tone-5 > .matrix-day { background:#f7eae6 !important; }
  .public-general-matrix tbody tr.day-start > * { border-top-width:2px; border-top-color:#b9c7d5; }

  /* Internal general timetable uses days as columns. */
  .school-master-table .day-tone-1 { background:#fbfdff; }
  .school-master-table .day-tone-2 { background:#fffdf8; }
  .school-master-table .day-tone-3 { background:#f8fcfb; }
  .school-master-table .day-tone-4 { background:#fcf9fd; }
  .school-master-table .day-tone-5 { background:#fffaf9; }
  .school-master-table thead .day-tone-1 { background:#eaf2fb !important; }
  .school-master-table thead .day-tone-2 { background:#f8f0dd !important; }
  .school-master-table thead .day-tone-3 { background:#e8f4ef !important; }
  .school-master-table thead .day-tone-4 { background:#f1eaf5 !important; }
  .school-master-table thead .day-tone-5 { background:#f7eae6 !important; }

  /* The current teacher/section is a switcher, not passive text. */
  .teacher-picker-label,
  .section-picker-label {
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    color:#173f67;font-weight:900;
  }
  .entity-switch-badge {
    display:inline-flex;align-items:center;justify-content:center;gap:3px;
    min-height:24px;padding:3px 8px;border:1px solid #c99b43;border-radius:999px;
    background:#fff5dc;color:#7d5712;font-size:9px;font-weight:950;white-space:nowrap;
  }
  .teacher-picker-primary,
  .section-picker-primary {
    position:relative;border-color:#c99b43 !important;
    background:linear-gradient(180deg,#fffdf8 0%,#ffffff 100%) !important;
    box-shadow:0 0 0 3px rgba(201,155,67,.08),0 9px 22px rgba(45,72,99,.07) !important;
  }
  .teacher-picker-primary select,
  .section-picker-primary select {
    border:2px solid #6f8eaa !important;
    background-color:#fff !important;
    color:#102f51 !important;
    font-weight:950 !important;
    cursor:pointer;
  }
  .teacher-picker-primary select:hover,
  .section-picker-primary select:hover { border-color:#c8922e !important; }
  .teacher-picker-primary select:focus,
  .section-picker-primary select:focus {
    outline:none !important;border-color:#c8922e !important;
    box-shadow:0 0 0 4px rgba(200,146,46,.16) !important;
  }
}

@media screen and (max-width:700px) {
  .teacher-picker-primary,
  .section-picker-primary {
    padding:9px 10px !important;border-width:2px !important;
    box-shadow:0 0 0 3px rgba(201,155,67,.10) !important;
  }
  .teacher-picker-label,
  .section-picker-label { font-size:10px !important; }
  .entity-switch-badge { min-height:26px;padding:4px 9px;font-size:9px; }
  .teacher-picker-primary select,
  .section-picker-primary select {
    min-height:54px !important;font-size:16px !important;padding-inline:12px 38px !important;
  }
  .public-general-matrix tbody tr[class*="day-tone-"] > td { transition:background-color .12s ease; }
  .public-general-matrix .matrix-day {
    font-weight:950 !important;border-inline-end:2px solid #c7d4e1 !important;
  }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.54 — persistent public timetable headers on phones
   Keep the identifying header row visible in all three public general views:
   sections, teachers, and day/period. Screen-only; print unchanged.
   ============================================================ */
@media screen and (max-width:760px) {
  /* Give the wide public timetable its own bounded two-axis viewport. This keeps
     vertical context inside the table instead of forcing the whole page to wander. */
  .public-general-wrap {
    position:relative;
    max-height:70vh;
    max-height:min(72dvh,760px);
    overflow:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    border:1px solid #d7e0ea;
    border-radius:10px;
    background:#fff;
  }

  /* Safari/iOS is more reliable with sticky table cells when borders are separated. */
  .public-general-wrap > table {
    border-collapse:separate;
    border-spacing:0;
  }

  /* Sections view: section names stay visible.
     Teachers view: teacher names stay visible.
     Day/period view: day names stay visible. */
  .public-general-wrap > table thead th {
    position:sticky;
    top:0;
    z-index:30;
    background:#edf3f9 !important;
    box-shadow:0 2px 0 #cbd7e4,0 4px 9px rgba(24,55,86,.06);
  }

  /* Preserve the stronger day cues introduced in 6.53 while the day/period
     header is pinned. */
  .public-general-table thead .day-tone-1 { background:#eaf2fb !important; }
  .public-general-table thead .day-tone-2 { background:#f8f0dd !important; }
  .public-general-table thead .day-tone-3 { background:#e8f4ef !important; }
  .public-general-table thead .day-tone-4 { background:#f1eaf5 !important; }
  .public-general-table thead .day-tone-5 { background:#f7eae6 !important; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.55 — explicit share scopes + print day identity
   Presentation-only. Separates whole-school sharing from one-teacher sharing,
   and carries the day identity palette into printed timetable reports without
   changing report geometry.
   ============================================================ */
@media screen {
  .share-mode-directory {
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 16px;
  }
  .share-mode-card {
    display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;
    width:100%;min-height:92px;padding:15px 16px;border:2px solid transparent;border-radius:17px;
    appearance:none;-webkit-appearance:none;font:inherit;text-align:inherit;cursor:pointer;
    text-decoration:none;color:#173a5f;background:#fff;box-shadow:0 8px 24px rgba(25,55,90,.07);
    transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease;
  }
  .share-mode-card:hover,.share-mode-card:focus-visible { transform:translateY(-1px);box-shadow:0 12px 30px rgba(25,55,90,.11);outline:none; }
  .share-mode-card-general { border-color:#9db8d3;background:linear-gradient(135deg,#f6faff,#ffffff 72%); }
  .share-mode-card-teacher { border-color:#99c7b6;background:linear-gradient(135deg,#f4fbf8,#ffffff 72%); }
  .share-mode-card-general:hover,.share-mode-card-general:focus-visible { border-color:#527da7; }
  .share-mode-card-teacher:hover,.share-mode-card-teacher:focus-visible { border-color:#4f9279; }
  .share-mode-icon {
    width:46px;height:46px;display:grid;place-items:center;border-radius:14px;font-size:24px;
    background:#edf4fb;border:1px solid #d5e2ef;
  }
  .share-mode-card-teacher .share-mode-icon { background:#eaf7f1;border-color:#cce8dc; }
  .share-mode-copy { min-width:0;display:grid;gap:4px; }
  .share-mode-copy strong { color:#12375c;font-size:1.02rem; }
  .share-mode-copy small { color:#667b91;line-height:1.55;font-size:.78rem; }
  .share-scope-pill {
    display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:5px 10px;
    border-radius:999px;background:#e8f1fb;color:#295b87;border:1px solid #c5d8eb;font-size:.72rem;white-space:nowrap;
  }
  .share-mode-card-teacher .share-scope-pill { background:#e7f5ee;color:#276d55;border-color:#bfe0d2; }

  .share-zone {
    position:relative;overflow:hidden;border:2px solid #d6e0eb !important;border-inline-start-width:7px !important;
    border-radius:18px !important;padding:18px !important;box-shadow:0 10px 28px rgba(23,58,95,.06) !important;
  }
  .share-zone-general {
    border-color:#a9bfd6 !important;border-inline-start-color:#2f6799 !important;
    background:linear-gradient(180deg,#f8fbff 0,#fff 180px) !important;
  }
  .share-zone-teacher {
    margin-top:18px;border-color:#a8d0c1 !important;border-inline-start-color:#3e8b70 !important;
    background:linear-gradient(180deg,#f7fcfa 0,#fff 180px) !important;
  }
  .share-zone-kicker { display:inline-flex;align-items:center;gap:5px;font-weight:950 !important;letter-spacing:.01em; }
  .share-zone-general .share-zone-kicker { color:#2f6799 !important; }
  .share-zone-teacher .share-zone-kicker { color:#34775f !important; }
  .share-zone-description { margin:.3rem 0 0;color:#667b91;font-size:.82rem;line-height:1.6;max-width:760px; }
  .share-scope-note {
    display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 12px;padding:9px 11px;
    border-radius:11px;font-size:.78rem;line-height:1.55;
  }
  .share-scope-note strong { font-weight:950;white-space:nowrap; }
  .share-scope-note-general { background:#edf5fc;border:1px solid #cfe0ef;color:#365b7c; }
  .share-scope-note-teacher { background:#edf8f3;border:1px solid #cce7dc;color:#356956; }
  .share-teacher-picker {
    border:2px solid #8fc4b0 !important;border-radius:14px !important;padding:11px 12px !important;
    background:#f7fcfa !important;box-shadow:0 0 0 3px rgba(62,139,112,.07) !important;
  }
  .share-teacher-picker .teacher-picker-field > span { color:#245e49;font-weight:950; }
  .share-teacher-picker select { border:2px solid #6ba58f !important;background:#fff !important;font-weight:900 !important; }
  .share-zone-general .general-share-view-form { border-color:#c8d9e9;background:#f8fbfe; }
  .share-zone-teacher .teacher-share-card { border-color:#c7e0d7;box-shadow:0 4px 16px rgba(40,105,80,.06); }
}

@media screen and (max-width:760px) {
  .share-mode-directory { grid-template-columns:1fr;gap:10px; }
  .share-mode-card { grid-template-columns:auto minmax(0,1fr);padding:12px;min-height:84px; }
  .share-mode-card .share-scope-pill { grid-column:2;justify-self:start; }
  .share-zone { padding:13px !important;border-inline-start-width:5px !important; }
  .share-zone-description { font-size:.75rem; }
  .share-scope-note { align-items:flex-start;display:grid;gap:2px; }
  .share-teacher-picker { padding:10px !important; }
}

/* Report previews use the same day language before printing, so the administrator
   sees on screen what the physical report will communicate. */
@media screen {
  .teacher-matrix-report .matrix-table tbody tr.day-tone-1 > td,
  .section-matrix-report .matrix-table tbody tr.day-tone-1 > td { background:#fbfdff; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-2 > td,
  .section-matrix-report .matrix-table tbody tr.day-tone-2 > td { background:#fffdf8; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-3 > td,
  .section-matrix-report .matrix-table tbody tr.day-tone-3 > td { background:#f8fcfb; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-4 > td,
  .section-matrix-report .matrix-table tbody tr.day-tone-4 > td { background:#fcf9fd; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-5 > td,
  .section-matrix-report .matrix-table tbody tr.day-tone-5 > td { background:#fffaf9; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-1 > .matrix-day,
  .section-matrix-report .matrix-table tbody tr.day-tone-1 > .matrix-day { background:#eaf2fb !important; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-2 > .matrix-day,
  .section-matrix-report .matrix-table tbody tr.day-tone-2 > .matrix-day { background:#f8f0dd !important; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-3 > .matrix-day,
  .section-matrix-report .matrix-table tbody tr.day-tone-3 > .matrix-day { background:#e8f4ef !important; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-4 > .matrix-day,
  .section-matrix-report .matrix-table tbody tr.day-tone-4 > .matrix-day { background:#f1eaf5 !important; }
  .teacher-matrix-report .matrix-table tbody tr.day-tone-5 > .matrix-day,
  .section-matrix-report .matrix-table tbody tr.day-tone-5 > .matrix-day { background:#f7eae6 !important; }
  .teacher-matrix-report .matrix-table tbody tr.day-start > *,
  .section-matrix-report .matrix-table tbody tr.day-start > * { border-top-width:2px;border-top-color:#b9c7d5; }

  .distribution-mini-table tbody tr.day-tone-1 > td:not(.distribution-waiting):not(.distribution-outside) { background:#fbfdff; }
  .distribution-mini-table tbody tr.day-tone-2 > td:not(.distribution-waiting):not(.distribution-outside) { background:#fffdf8; }
  .distribution-mini-table tbody tr.day-tone-3 > td:not(.distribution-waiting):not(.distribution-outside) { background:#f8fcfb; }
  .distribution-mini-table tbody tr.day-tone-4 > td:not(.distribution-waiting):not(.distribution-outside) { background:#fcf9fd; }
  .distribution-mini-table tbody tr.day-tone-5 > td:not(.distribution-waiting):not(.distribution-outside) { background:#fffaf9; }
  .distribution-mini-table tbody tr.day-tone-1 > .distribution-day-name { background:#eaf2fb !important; }
  .distribution-mini-table tbody tr.day-tone-2 > .distribution-day-name { background:#f8f0dd !important; }
  .distribution-mini-table tbody tr.day-tone-3 > .distribution-day-name { background:#e8f4ef !important; }
  .distribution-mini-table tbody tr.day-tone-4 > .distribution-day-name { background:#f1eaf5 !important; }
  .distribution-mini-table tbody tr.day-tone-5 > .distribution-day-name { background:#f7eae6 !important; }
}

/* Printed day identity. The fills are deliberately very pale so black text remains
   dominant and toner use stays low. A stronger day-name cell and separator keep the
   report understandable even when printed in grayscale. */
@media print {
  .print-report,
  .distribution-sheet,
  .public-share-card {
    print-color-adjust:exact !important;
    -webkit-print-color-adjust:exact !important;
  }

  /* Row-oriented master matrices: teacher and section reports. */
  .matrix-table tbody tr.day-tone-1 > td { background:#f5f9fd !important; }
  .matrix-table tbody tr.day-tone-2 > td { background:#fcf8ee !important; }
  .matrix-table tbody tr.day-tone-3 > td { background:#f3f9f6 !important; }
  .matrix-table tbody tr.day-tone-4 > td { background:#f8f4fa !important; }
  .matrix-table tbody tr.day-tone-5 > td { background:#fcf5f3 !important; }
  .matrix-table tbody tr.day-tone-1 > .matrix-day { background:#dfeaf6 !important; }
  .matrix-table tbody tr.day-tone-2 > .matrix-day { background:#f2e6c9 !important; }
  .matrix-table tbody tr.day-tone-3 > .matrix-day { background:#dceee5 !important; }
  .matrix-table tbody tr.day-tone-4 > .matrix-day { background:#eadff0 !important; }
  .matrix-table tbody tr.day-tone-5 > .matrix-day { background:#f1dfd9 !important; }
  .matrix-table tbody tr.day-start > * { border-top-width:1.1pt !important;border-top-color:#8ea4b8 !important; }

  /* Day/period school-wide report: days are columns. */
  .school-master-table .day-tone-1 { background:#f5f9fd !important; }
  .school-master-table .day-tone-2 { background:#fcf8ee !important; }
  .school-master-table .day-tone-3 { background:#f3f9f6 !important; }
  .school-master-table .day-tone-4 { background:#f8f4fa !important; }
  .school-master-table .day-tone-5 { background:#fcf5f3 !important; }
  .school-master-table thead .day-tone-1 { background:#dfeaf6 !important; }
  .school-master-table thead .day-tone-2 { background:#f2e6c9 !important; }
  .school-master-table thead .day-tone-3 { background:#dceee5 !important; }
  .school-master-table thead .day-tone-4 { background:#eadff0 !important; }
  .school-master-table thead .day-tone-5 { background:#f1dfd9 !important; }

  /* Individual teacher/section sheets, including economical four-up printing.
     Preserve waiting/outside-duty semantic fills while tinting normal lesson cells. */
  .distribution-mini-table tbody tr.day-tone-1 > td:not(.distribution-waiting):not(.distribution-outside) { background:#f5f9fd !important; }
  .distribution-mini-table tbody tr.day-tone-2 > td:not(.distribution-waiting):not(.distribution-outside) { background:#fcf8ee !important; }
  .distribution-mini-table tbody tr.day-tone-3 > td:not(.distribution-waiting):not(.distribution-outside) { background:#f3f9f6 !important; }
  .distribution-mini-table tbody tr.day-tone-4 > td:not(.distribution-waiting):not(.distribution-outside) { background:#f8f4fa !important; }
  .distribution-mini-table tbody tr.day-tone-5 > td:not(.distribution-waiting):not(.distribution-outside) { background:#fcf5f3 !important; }
  .distribution-mini-table tbody tr.day-tone-1 > .distribution-day-name { background:#dfeaf6 !important; }
  .distribution-mini-table tbody tr.day-tone-2 > .distribution-day-name { background:#f2e6c9 !important; }
  .distribution-mini-table tbody tr.day-tone-3 > .distribution-day-name { background:#dceee5 !important; }
  .distribution-mini-table tbody tr.day-tone-4 > .distribution-day-name { background:#eadff0 !important; }
  .distribution-mini-table tbody tr.day-tone-5 > .distribution-day-name { background:#f1dfd9 !important; }
  .distribution-mini-table tbody tr[class*="day-tone-"] > .distribution-day-name {
    border-inline-end-width:1.1pt !important;border-inline-end-color:#8ea4b8 !important;font-weight:900 !important;
  }

  /* Public general report can also be printed cleanly from a shared link. */
  .public-general-matrix tbody tr.day-tone-1 > td { background:#f5f9fd !important; }
  .public-general-matrix tbody tr.day-tone-2 > td { background:#fcf8ee !important; }
  .public-general-matrix tbody tr.day-tone-3 > td { background:#f3f9f6 !important; }
  .public-general-matrix tbody tr.day-tone-4 > td { background:#f8f4fa !important; }
  .public-general-matrix tbody tr.day-tone-5 > td { background:#fcf5f3 !important; }
  .public-general-matrix tbody tr.day-tone-1 > .matrix-day { background:#dfeaf6 !important; }
  .public-general-matrix tbody tr.day-tone-2 > .matrix-day { background:#f2e6c9 !important; }
  .public-general-matrix tbody tr.day-tone-3 > .matrix-day { background:#dceee5 !important; }
  .public-general-matrix tbody tr.day-tone-4 > .matrix-day { background:#eadff0 !important; }
  .public-general-matrix tbody tr.day-tone-5 > .matrix-day { background:#f1dfd9 !important; }

  /* Borders provide a fallback cue for monochrome printers. */
  .matrix-table tbody tr.day-start > *,
  .distribution-mini-table tbody tr[class*="day-tone-"] > *,
  .public-general-matrix tbody tr.day-start > * {
    print-color-adjust:exact !important;-webkit-print-color-adjust:exact !important;
  }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.57 — compact professional workspace rhythm
   Screen-only. Reduces visual scattering across authenticated workspaces,
   keeps related inputs together, protects touch targets on phones/tablets,
   caps over-stretch on very wide smart displays, and makes share-mode cards
   navigate deterministically to their named sections.
   ============================================================ */
@media screen and (min-width:701px) {
  /* A tighter page rhythm: title -> task surface -> review surface. */
  .content > .page-head {
    gap:14px;
    margin-bottom:12px;
    padding:14px 16px 13px;
  }
  .content > .page-head h1 {
    margin-bottom:3px;
    font-size:clamp(23px,1.85vw,29px);
  }
  .content > .page-head p {
    max-width:980px;
    font-size:12px;
    line-height:1.65;
  }
  .ux-page-breadcrumb { margin-bottom:4px; }

  .content > .panel.ux-surface,
  .content > .panel {
    margin-bottom:12px;
    padding:clamp(13px,1.15vw,18px);
  }
  .ux-section-panel > h2,
  .panel > h2,
  .section-title-row h2 {
    margin-bottom:8px;
    font-size:16px;
    line-height:1.4;
  }
  .section-title-row { gap:10px; margin-bottom:8px; }
  .section-title-row .hint,
  .settings-title-row .hint { margin-bottom:0; }

  /* Form surfaces should read as one task, not isolated full-width strips. */
  .ux-form-panel { box-shadow:0 5px 18px rgba(19,54,87,.045) !important; }
  .ux-form-panel .ux-form-aware { margin:0; }
  .ux-form-panel .ux-form-aware :where(label) { margin-bottom:0; }
  .ux-form-panel .ux-form-aware > :where(.hint,small.hint) { margin:0; }
  .content :where(input,select,textarea) { min-height:40px; }
  .form-row { gap:9px; }

  /* Review surfaces sit closer to their headings and use calmer row density. */
  .ux-table-panel > h2 { margin-bottom:9px; }
  .ux-table-panel > .table-wrap,
  .ux-table-panel > .report-table-wrap { margin-top:5px; }
  .ux-table-panel table.ux-mobile-cards th,
  .ux-table-panel table.ux-mobile-cards td { padding:8px 9px; }
}

@media screen and (min-width:821px) {
  /* Master-data entry forms become a deliberate two-column composition while
     complex structural grids continue to occupy the full row. */
  html.ux-data-task .ux-form-panel > .ux-compact-entry-form:not(.assignment-teacher-picker) {
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:9px 12px;
    align-items:end;
  }
  html.ux-data-task .ux-form-panel > .ux-compact-entry-form:not(.assignment-teacher-picker) > label {
    grid-column:span 6;
    min-width:0;
    margin:0;
  }
  html.ux-data-task .ux-form-panel > .ux-compact-entry-form:not(.assignment-teacher-picker) > :where(
    .form-row,.optimization-grid,.settings-note,.notice,.hint,.adjacency-help,
    .actions,.toolbar,.flow-row,.grid-2,.grid-3,.period-quick-help
  ) {
    grid-column:1 / -1;
    min-width:0;
    margin-block:0;
  }
  html.ux-data-task .ux-form-panel > .ux-compact-entry-form:not(.assignment-teacher-picker) > .form-row {
    grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  }
  html.ux-data-task .ux-form-panel > .ux-compact-entry-form:not(.assignment-teacher-picker) > .btn,
  html.ux-data-task .ux-form-panel > .ux-compact-entry-form:not(.assignment-teacher-picker) > button {
    grid-column:1 / -1;
    justify-self:start;
    margin-top:1px;
  }
  html.ux-data-task .assignment-teacher-picker { max-width:760px; }

  /* The manual-plan editor is intentionally denser on desktop/tablet, while its
     existing container-query card layout remains untouched below 760px. */
  .manual-plan-principle {
    margin-bottom:10px !important;
    padding:9px 10px !important;
  }
  .manual-plan-principle-grid { gap:7px; }
  .manual-plan-principle-grid > div { gap:2px; padding:8px 10px; border-radius:10px; }
  .manual-plan-principle-grid strong { font-size:.82rem; }
  .manual-plan-principle-grid span { font-size:.74rem; line-height:1.45; }

  .manual-plan-editor { padding:14px !important; }
  .manual-plan-editor .section-title-row { margin-bottom:6px; }
  .manual-plan-editor .section-title-row .hint { max-width:960px; }
  .manual-plan-meta-grid { gap:9px; margin:6px 0 10px; }

  @container manual-plan-editor (min-width:761px) {
    .manual-level-list { gap:10px; }
    .manual-level-card { border-radius:12px; }
    .manual-level-head {
      grid-template-columns:minmax(300px,1fr) auto auto;
      gap:8px;
      align-items:center;
      padding:9px 11px;
    }
    .manual-level-name label { gap:4px; margin:0; }
    .manual-level-name input { min-height:38px; }
    .manual-level-summary {
      display:flex;
      align-items:center;
      justify-content:center;
      gap:6px;
      text-align:start;
      white-space:nowrap;
    }
    .manual-level-summary > span,
    .manual-level-summary > b {
      display:inline-flex;
      align-items:center;
      gap:4px;
      min-height:28px;
      padding:4px 8px;
      border:1px solid #d8e3ed;
      border-radius:999px;
      background:#fff;
      font-size:.76rem;
    }
    .manual-plan-table th,
    .manual-plan-table td { padding:6px 8px; }
    .manual-plan-table :where(input,select) { min-height:38px; }
    .manual-level-card > .btn { margin:7px 10px 10px; }
    .manual-plan-actions { margin-top:10px; padding-top:10px; }
  }
}

@media screen {
  /* Sharing has two explicit destinations. The card name and the section it opens
     are now coupled both semantically and visually. */
  .share-mode-directory { gap:10px; margin-bottom:10px; }
  .share-mode-card {
    min-height:78px;
    gap:10px;
    padding:11px 13px;
    border-radius:14px;
  }
  .share-mode-icon { width:40px; height:40px; border-radius:11px; font-size:21px; }
  .share-mode-copy { gap:2px; }
  .share-mode-copy strong { font-size:.96rem; }
  .share-mode-copy small { font-size:.73rem; line-height:1.45; }
  .share-scope-pill { min-height:27px; padding:4px 8px; font-size:.68rem; }

  .share-zone {
    scroll-margin-top:96px;
    padding:14px !important;
    border-radius:15px !important;
    box-shadow:0 7px 22px rgba(23,58,95,.05) !important;
    outline:none;
  }
  .share-zone-teacher { margin-top:10px; }
  .share-zone :where(h2) { margin-bottom:3px; }
  .share-zone-description { margin-top:2px; font-size:.77rem; line-height:1.5; }
  .share-scope-note { margin:2px 0 8px; padding:7px 9px; }
  .compact-view-form { gap:6px; }
  .general-view-option.compact-option { padding:7px 8px; margin:0; }
  .teacher-share-toolbar { gap:8px; }
  .teacher-picker-row { gap:7px; padding:8px 9px; }
  .teacher-share-card { gap:8px; padding:10px; border-radius:13px; }
  .teacher-share-card-head { padding-bottom:8px; }
  .teacher-share-card-grid { gap:8px; }

  .share-zone.ux-share-target-flash {
    animation:ux-share-target-pulse .75s ease-out;
  }
  @keyframes ux-share-target-pulse {
    0% { box-shadow:0 0 0 0 rgba(46,105,154,.22),0 7px 22px rgba(23,58,95,.05); }
    55% { box-shadow:0 0 0 5px rgba(46,105,154,.10),0 9px 24px rgba(23,58,95,.07); }
    100% { box-shadow:0 0 0 0 rgba(46,105,154,0),0 7px 22px rgba(23,58,95,.05); }
  }
  .share-zone-teacher.ux-share-target-flash { animation-name:ux-share-teacher-target-pulse; }
  @keyframes ux-share-teacher-target-pulse {
    0% { box-shadow:0 0 0 0 rgba(62,139,112,.24),0 7px 22px rgba(23,58,95,.05); }
    55% { box-shadow:0 0 0 5px rgba(62,139,112,.10),0 9px 24px rgba(23,58,95,.07); }
    100% { box-shadow:0 0 0 0 rgba(62,139,112,0),0 7px 22px rgba(23,58,95,.05); }
  }
}

/* Tablets and touch laptops keep comfortable targets even when the visual rhythm
   is denser than desktop. */
@media screen and (min-width:701px) and (pointer:coarse) {
  .content :where(input,select,textarea) { min-height:44px; }
  .content .btn { min-height:42px; }
  .content .btn.small { min-height:38px; }
}

/* Phones retain the existing card/table transformations and 44–47px touch sizing;
   only the vertical relationship between sections is tightened. */
@media screen and (max-width:700px) {
  .content > .page-head { margin-bottom:9px; }
  .content > .panel.ux-surface,
  .content > .panel { margin-bottom:9px; }
  .share-mode-directory { margin-bottom:9px; }
  .share-mode-card { min-height:82px; padding:11px; }
  .share-zone { scroll-margin-top:74px; padding:12px !important; }
  .share-zone-teacher { margin-top:9px; }
  .share-scope-note { margin-bottom:7px; }
  .manual-plan-editor .section-title-row { gap:7px; margin-bottom:6px; }
}

/* Very wide smart displays should not stretch single-entry fields across meters of
   visual space. Timetables remain wide enough, while the whole workspace is centered. */
@media screen and (min-width:1800px) {
  .app-shell .content {
    width:100%;
    max-width:1740px;
    justify-self:center;
    margin-inline:auto;
  }
  .content > .page-head p { max-width:1120px; }
  html.ux-data-task .ux-form-panel > .ux-compact-entry-form:not(.assignment-teacher-picker) > label {
    max-width:none;
  }
}

@media (prefers-reduced-motion:reduce) {
  .share-zone.ux-share-target-flash { animation:none !important; }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.58 — share destination hardening
   The two prominent scope cards are real buttons, not navigation links.
   This prevents Blazor/base-URI navigation from ever treating an in-page
   destination as a route and keeps the action local to the sharing page.
   ============================================================ */
@media screen {
  .share-mode-card[type="button"] {
    -webkit-tap-highlight-color:transparent;
  }
  .share-mode-card[type="button"]:active {
    transform:translateY(0);
  }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.61 — guided workflow rebuilt from stable 6.58
   Safe responsive launchpad + journey navigator. New visual markers use
   bounded text glyphs rather than SVG so stale CSS cannot create overflow.
   Screen-only: print layouts remain isolated and unchanged.
   ============================================================ */
@media screen {
  .work-center-launchpad {
    display:block !important;
    width:100%;
    margin:0 0 14px;
    padding:18px 20px;
    border:1px solid #335f89;
    border-radius:20px;
    background:linear-gradient(145deg,#12385f 0%,#1d527f 58%,#27618d 100%);
    box-shadow:0 16px 38px rgba(15,52,86,.17);
    overflow:hidden;
  }
  .work-center-launchpad-heading {
    display:grid;
    grid-template-columns:58px minmax(0,1fr);
    gap:14px;
    align-items:center;
    margin-bottom:12px;
  }
  .work-center-launchpad-icon {
    inline-size:58px;
    block-size:58px;
    min-inline-size:58px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border:1px solid rgba(244,205,126,.34);
    border-radius:17px;
    background:rgba(255,255,255,.08);
    color:#f1ca79;
    font-size:31px;
    line-height:1;
    font-weight:700;
  }
  .work-center-launchpad-heading small { color:#f2ce84; font-size:10px; font-weight:900; }
  .work-center-launchpad-heading h1 { margin:2px 0 4px; color:#fff; font-size:clamp(24px,2vw,32px); line-height:1.25; }
  .work-center-launchpad-heading p { max-width:980px; margin:0; color:#d8e4ef; font-size:12px; line-height:1.7; }
  .work-center-launchpad .mobile-home-command-top { margin-top:2px; }
  .work-center-launchpad .mobile-home-command-top span { font-size:10.5px; }
  .work-center-launchpad .mobile-home-progress { margin-bottom:12px; }
  .work-center-next-box {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:16px;
    align-items:center;
    padding:12px 14px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:15px;
    background:rgba(255,255,255,.07);
  }
  .work-center-next-box > div:first-child { min-width:0; }
  .work-center-next-box small { color:#bcd0e3; font-size:9.5px; font-weight:850; }
  .work-center-next-box h2 { margin:2px 0 3px; color:#fff; font-size:18px; }
  .work-center-next-box p { margin:0; color:#d9e5f0; font-size:10.5px; line-height:1.55; }
  .work-center-next-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
  .work-center-next-actions .btn { min-height:44px; white-space:nowrap; }
  .work-center-all-steps { border-color:rgba(255,255,255,.22) !important; background:rgba(255,255,255,.08) !important; color:#fff !important; }
  .work-center-launchpad .mobile-home-shortcuts { margin-top:10px; }
  .work-center-head { margin-top:2px; }
  .work-center-head h2 { margin:0 0 3px; color:#173a67; font-size:18px; }
  #workflow-stages { scroll-margin-top:84px; }

  .workflow-journey {
    position:relative;
    z-index:18;
    width:min(calc(100% - 24px),1716px);
    margin:10px auto 0;
    padding:12px 14px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px 14px;
    align-items:center;
    border:1px solid #d2dfeb;
    border-inline-start:4px solid #c89537;
    border-radius:16px;
    background:rgba(255,255,255,.97);
    box-shadow:0 8px 24px rgba(15,48,80,.07);
    overflow:hidden;
  }
  .workflow-journey-main { min-width:0; display:grid; grid-template-columns:42px minmax(0,1fr); gap:10px; align-items:center; }
  .workflow-journey-icon {
    inline-size:42px;
    block-size:42px;
    min-inline-size:42px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border-radius:12px;
    background:#fff5df;
    color:#9a6c1e;
    font-size:24px;
    line-height:1;
    font-weight:700;
  }
  .workflow-journey-copy { min-width:0; }
  .workflow-journey-kicker { display:flex; align-items:center; gap:7px; margin-bottom:2px; }
  .workflow-journey-kicker span { color:#986d21; font-size:9px; font-weight:900; }
  .workflow-journey-kicker b { color:#7b8b9d; font-size:8.5px; font-weight:800; }
  .workflow-journey-title-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
  .workflow-journey-title-row h2 { margin:0; color:#173b64; font-size:15px; line-height:1.35; }
  .workflow-journey-status { display:inline-flex; align-items:center; min-height:23px; padding:3px 7px; border-radius:999px; font-size:8.5px; font-weight:900; white-space:nowrap; }
  .workflow-journey-status.complete { background:#e4f4ec; color:#176348; }
  .workflow-journey-status.ready { background:#e8f2fc; color:#1c5d90; }
  .workflow-journey-status.pending { background:#fff2e4; color:#995d19; }
  .workflow-journey-copy p { margin:3px 0 0; color:#677a8e; font-size:9.5px; line-height:1.5; }
  .workflow-journey-actions { display:flex; gap:7px; align-items:stretch; }
  .workflow-journey-actions .btn { margin:0; text-decoration:none; }
  .workflow-journey-next {
    min-width:210px;
    min-height:44px;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"label arrow" "title arrow";
    align-content:center;
    gap:0 8px;
    text-align:start;
    padding:7px 11px !important;
  }
  .workflow-journey-next span { grid-area:label; font-size:8px; opacity:.82; font-weight:800; }
  .workflow-journey-next strong { grid-area:title; font-size:10.5px; line-height:1.25; }
  .workflow-journey-next > b { grid-area:arrow; align-self:center; font-size:16px; }
  .workflow-journey-home { min-height:44px; display:inline-flex !important; align-items:center; justify-content:center; white-space:nowrap; }
  .workflow-journey-alt { grid-column:1 / -1; justify-self:start; margin-inline-start:52px; color:#41698e; font-size:9px; font-weight:800; text-decoration:none; }
  .workflow-journey-alt:hover { text-decoration:underline; }
  .workflow-journey-all { grid-column:1 / -1; border-top:1px solid #edf1f5; padding-top:7px; }
  .workflow-journey-all > summary { width:max-content; max-width:100%; cursor:pointer; color:#49677f; font-size:9px; font-weight:850; list-style-position:inside; }
  .workflow-journey-stage-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; margin-top:8px; }
  .workflow-journey-stage { min-width:0; display:grid; grid-template-columns:24px minmax(0,1fr); grid-template-areas:"number title" "number state"; gap:0 6px; align-items:center; padding:6px 7px; border:1px solid #e0e7ef; border-radius:10px; background:#fbfcfe; color:#284a6b; text-decoration:none; }
  .workflow-journey-stage > span { grid-area:number; width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#edf2f7; color:#557086; font-size:8.5px; font-weight:900; }
  .workflow-journey-stage > strong { grid-area:title; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:8.8px; }
  .workflow-journey-stage > small { grid-area:state; color:#7a8b9c; font-size:7.4px; }
  .workflow-journey-stage.complete { border-color:#d4e8df; background:#fbfefd; }
  .workflow-journey-stage.complete > span { background:#dff1e9; color:#176348; }
  .workflow-journey-stage.ready { border-color:#d7e6f4; background:#fbfdff; }
  .workflow-journey-stage.current { border-color:#d3a655; box-shadow:0 0 0 2px rgba(211,166,85,.12); background:#fffaf0; }

  .login-card-modern .login-main-button { display:flex; align-items:center; justify-content:center; gap:8px; }
  .login-main-button-icon { inline-size:23px; block-size:23px; min-inline-size:23px; display:grid; place-items:center; overflow:hidden; border-radius:50%; background:rgba(255,255,255,.16); font-size:13px; line-height:1; }

  .main-nav .nav-work-center-start { position:relative; border-color:rgba(224,174,81,.30); background:linear-gradient(90deg,rgba(213,161,68,.12),rgba(255,255,255,.025)); }
  .main-nav .nav-work-center-start .nav-icon { color:#efc36d; }
  .main-nav .nav-work-center-start .nav-start-badge { margin-inline-start:auto; padding:2px 5px; border:1px solid rgba(236,190,100,.30); border-radius:999px; color:#efca7d; background:rgba(216,166,75,.10); font-size:6.8px; font-weight:900; white-space:nowrap; }
  .main-nav .nav-work-center-start.active .nav-start-badge { color:#80570f; background:#fff0cb; border-color:#e0b45f; }
}

@media screen and (min-width:701px) and (max-width:1180px) {
  .work-center-launchpad { padding:16px; }
  .work-center-next-box { grid-template-columns:1fr; }
  .work-center-next-actions { justify-content:flex-start; }
  .workflow-journey { width:calc(100% - 20px); grid-template-columns:1fr; padding:11px 12px; }
  .workflow-journey-actions { justify-content:flex-start; }
  .workflow-journey-stage-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .workflow-journey-alt { margin-inline-start:0; }
  .main-nav .nav-work-center-start .nav-start-badge { display:none; }
}

@media screen and (max-width:700px) {
  .work-center-launchpad { margin-bottom:11px; padding:14px 13px; border-radius:17px; }
  .work-center-launchpad-heading { grid-template-columns:44px minmax(0,1fr); gap:9px; margin-bottom:9px; }
  .work-center-launchpad-icon { inline-size:44px; block-size:44px; min-inline-size:44px; border-radius:13px; font-size:25px; }
  .work-center-launchpad-heading small { font-size:8px; }
  .work-center-launchpad-heading h1 { margin:1px 0 3px; font-size:19px; }
  .work-center-launchpad-heading p { font-size:9.4px; line-height:1.55; }
  .work-center-next-box { grid-template-columns:1fr; gap:8px; padding:10px; }
  .work-center-next-box h2 { font-size:16px; }
  .work-center-next-box p { font-size:9.2px; }
  .work-center-next-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; gap:6px; }
  .work-center-next-actions .btn { width:100%; min-height:44px; padding-inline:7px; font-size:9px; }
  .work-center-launchpad .mobile-home-shortcuts { grid-template-columns:repeat(4,minmax(0,1fr)); }

  .workflow-journey { width:calc(100% - 14px); margin:7px auto 0; padding:9px 10px; grid-template-columns:1fr; gap:8px; border-inline-start-width:3px; border-radius:13px; box-shadow:0 5px 15px rgba(15,48,80,.055); }
  .workflow-journey-main { grid-template-columns:34px minmax(0,1fr); gap:8px; }
  .workflow-journey-icon { inline-size:34px; block-size:34px; min-inline-size:34px; border-radius:10px; font-size:20px; }
  .workflow-journey-kicker { gap:5px; }
  .workflow-journey-kicker span,.workflow-journey-kicker b { font-size:7.3px; }
  .workflow-journey-title-row { gap:5px; }
  .workflow-journey-title-row h2 { font-size:12px; }
  .workflow-journey-status { min-height:20px; padding:2px 6px; font-size:7px; }
  .workflow-journey-copy p { font-size:8px; line-height:1.45; }
  .workflow-journey-actions { display:grid; grid-template-columns:1.18fr .82fr; gap:6px; width:100%; }
  .workflow-journey-next,.workflow-journey-home { min-width:0; width:100%; min-height:44px; }
  .workflow-journey-next { padding:6px 8px !important; }
  .workflow-journey-next span { font-size:6.8px; }
  .workflow-journey-next strong { font-size:8.2px; white-space:normal; }
  .workflow-journey-home { padding:6px 7px !important; font-size:8.2px !important; white-space:normal; text-align:center; }
  .workflow-journey-alt { margin-inline-start:0; font-size:7.8px; }
  .workflow-journey-all { padding-top:6px; }
  .workflow-journey-all > summary { font-size:7.8px; }
  .workflow-journey-stage-grid { grid-template-columns:1fr 1fr; gap:5px; }
  .workflow-journey-stage { grid-template-columns:21px minmax(0,1fr); padding:5px 6px; border-radius:9px; }
  .workflow-journey-stage > span { width:21px; height:21px; font-size:7.2px; }
  .workflow-journey-stage > strong { font-size:7.4px; }
  .workflow-journey-stage > small { font-size:6.4px; }
  .main-nav .nav-work-center-start .nav-start-badge { font-size:7px; padding:3px 6px; }
}

@media screen and (min-width:701px) {
  .work-center-next-actions .mobile-home-next { width:auto; }
}

@media screen and (min-width:1800px) {
  .work-center-launchpad { max-width:1740px; margin-inline:auto; }
  .workflow-journey { max-width:1716px; }
}

@media (prefers-reduced-motion:reduce) {
  #workflow-stages { scroll-behavior:auto; }
}


/* ============================================================
   v0.9.0-rc8.25.7.6.61-HF2 — compact editor hierarchy
   Screen-only. Version first, entity second, grid immediately after.
   Print rules are intentionally untouched.
   ============================================================ */
@media screen {
  .editor-context-panel {
    display:grid;
    grid-template-columns:minmax(280px,1.12fr) minmax(240px,.88fr) auto;
    gap:9px;
    align-items:end;
    margin:0 0 8px !important;
    padding:10px 11px !important;
    border:1px solid #cbd9e5 !important;
    border-radius:14px !important;
    background:#fff !important;
    box-shadow:0 5px 16px rgba(16,49,80,.05) !important;
    min-width:0;
  }
  .editor-context-control { display:grid;gap:4px;min-width:0; }
  .editor-context-label {
    display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;
    color:#173f67;font-size:.72rem;font-weight:900;line-height:1.2;
  }
  .editor-context-control select {
    width:100%;max-width:100%;min-width:0;min-height:44px;
    padding:0 11px;border:1.5px solid #8ca5bc;border-radius:10px;
    background:#fff;color:#102f51;font:inherit;font-size:.9rem;font-weight:900;
  }
  .editor-context-control select:focus {
    outline:none;border-color:#c8922e;box-shadow:0 0 0 3px rgba(200,146,46,.15);
  }
  .editor-context-control small {
    min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    color:#7d8fa1;font-size:.62rem;line-height:1.2;
  }
  .editor-status-badge,.editor-switch-hint {
    display:inline-flex;align-items:center;justify-content:center;min-height:22px;padding:2px 7px;
    border-radius:999px;font-size:.61rem;font-weight:950;white-space:nowrap;
  }
  .editor-status-badge.locked { border:1px solid #d5a53f;background:#fff3cf;color:#7b5511; }
  .editor-status-badge.editable { border:1px solid #9fc9b4;background:#edf9f2;color:#17613f; }
  .editor-switch-hint { border:1px solid #d6e0e9;background:#f5f8fb;color:#496984; }
  .editor-context-manage { min-height:44px;white-space:nowrap;align-self:end; }

  .editor-readonly-alert {
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    margin:0 0 8px !important;padding:10px 12px !important;
    border:1px solid #d49a26 !important;border-inline-start:5px solid #c68612 !important;
    border-radius:13px !important;background:#fff8e7 !important;
    box-shadow:0 5px 16px rgba(126,86,14,.07) !important;
  }
  .editor-readonly-message { display:flex;align-items:center;gap:9px;min-width:0; }
  .editor-readonly-icon {
    width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center;
    border-radius:10px;background:#fff0c2;font-size:17px;
  }
  .editor-readonly-message > div { min-width:0; }
  .editor-readonly-message b { display:block;color:#6f4a0c;font-size:.82rem;line-height:1.35; }
  .editor-readonly-message p { margin:2px 0 0 !important;color:#765f37;font-size:.69rem;line-height:1.45; }
  .editor-readonly-alert .inline-action-form { flex:0 0 auto; }
  .editor-readonly-alert .btn { min-height:42px;white-space:nowrap; }

  /* Do not reserve vertical space for instructions before the grid. */
  .edit-selection-strip[data-selection-count="0"] { display:none !important; }
  .editor-help-after-grid { margin:8px 0 0 !important; }
  .quality-after-grid { display:block !important;margin:8px 0 0 !important;padding:0 !important;overflow:hidden; }
  .quality-after-grid summary {
    display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;list-style:none;
    padding:9px 11px;color:#365775;font-size:.74rem;background:#fbfcfe;
  }
  .quality-after-grid summary::-webkit-details-marker { display:none; }
  .quality-after-grid summary span { color:#173f67;font-size:.9rem;font-weight:900; }
  .quality-after-grid .quality-inline-metrics { padding:9px 11px 11px; }
  .teacher-summary-after-grid { margin:7px 0 0 !important; }
  .editor-print-title { display:none !important; }

  /* The actual timetable begins immediately after context / readonly alert. */
  .editor-context-panel + .print-report,
  .editor-readonly-alert + .print-report,
  .editor-context-panel + .edit-selection-strip + .print-report,
  .editor-readonly-alert + .edit-selection-strip + .print-report { margin-top:0 !important; }
}

@media screen and (max-width:980px) {
  .editor-context-panel { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .editor-context-manage { grid-column:1/-1;width:100%; }
}

@media screen and (max-width:700px) {
  .editor-context-panel {
    grid-template-columns:1fr !important;gap:6px !important;
    margin-bottom:6px !important;padding:8px !important;border-radius:12px !important;
  }
  .editor-context-control { gap:3px; }
  .editor-context-label { font-size:10px; }
  .editor-context-control select { min-height:48px;font-size:16px;padding-inline:10px 36px; }
  .editor-context-control small { font-size:8px; }
  .editor-status-badge,.editor-switch-hint { min-height:24px;padding:3px 8px;font-size:8px; }
  .editor-context-manage { display:none !important; }

  .editor-readonly-alert {
    align-items:stretch;flex-direction:column;gap:7px;
    margin-bottom:6px !important;padding:8px 9px !important;border-inline-start-width:4px !important;
  }
  .editor-readonly-message { gap:7px;align-items:flex-start; }
  .editor-readonly-icon { width:30px;height:30px;flex-basis:30px;border-radius:9px;font-size:15px; }
  .editor-readonly-message b { font-size:10px; }
  .editor-readonly-message p { font-size:8.5px;line-height:1.4; }
  .editor-readonly-alert .inline-action-form,.editor-readonly-alert .btn { width:100%; }
  .editor-readonly-alert .btn { min-height:44px; }

  .editor-help-after-grid { margin-top:6px !important; }
  .quality-after-grid { margin-top:6px !important; }
  .teacher-summary-after-grid { margin-top:6px !important;gap:4px !important; }
  .teacher-summary-after-grid span { padding:.24rem .48rem;font-size:.68rem; }
}

@media screen and (min-width:1600px) {
  .editor-context-panel {
    grid-template-columns:minmax(340px,1.15fr) minmax(300px,.85fr) auto;
    max-width:1280px;
  }
}

/* ============================================================
   v0.9.0-rc8.25.7.6.61-HF3 — landscape-phone full-width workspace
   A phone rotated to landscape can exceed the 700px phone breakpoint and was
   being promoted to the tablet two-column shell, reserving sidebar width and
   leaving the timetable compressed. Short landscape viewports stay in the
   mobile drawer shell and use the complete visual viewport.
   Screen-only; print layouts are untouched.
   ============================================================ */
@media screen and (orientation:landscape) and (max-height:520px) and (max-width:1000px) {
  html, body { width:100%; max-width:100%; }

  .app-shell {
    display:block !important;
    grid-template-columns:none !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:100dvh;
  }

  .app-workspace {
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
  }

  /* Keep navigation as a drawer on a landscape phone instead of reserving a
     tablet sidebar column. */
  .app-shell .sidebar {
    position:fixed !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:min(72vw,320px) !important;
    height:100dvh !important;
    min-height:0 !important;
    transform:translateX(105%) !important;
    overflow-y:auto !important;
    z-index:1200 !important;
  }
  .app-shell.mobile-nav-open .sidebar { transform:translateX(0) !important; }

  .mobile-nav-toggle { display:inline-flex !important; }
  .mobile-nav-backdrop { display:none !important; }
  .app-shell.mobile-nav-open .mobile-nav-backdrop { display:block !important; }

  .app-shell .topbar {
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    grid-template-columns:auto minmax(0,1fr) auto !important;
  }

  .app-shell .content {
    box-sizing:border-box;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin-inline:0 !important;
    padding:10px max(10px, env(safe-area-inset-right)) 20px max(10px, env(safe-area-inset-left)) !important;
  }

  /* The editor context and grid consume the full landscape viewport. */
  .editor-context-panel,
  .editor-readonly-alert,
  .edit-timetable-wrap,
  .timetable-wrap,
  .print-report {
    box-sizing:border-box;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin-inline:0 !important;
  }

  .editor-context-panel {
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr) !important;
    gap:7px !important;
    padding:8px 9px !important;
  }
  .editor-context-manage { grid-column:1/-1; }

  .edit-timetable-wrap {
    overflow-x:auto !important;
    overflow-y:visible !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-gutter:auto !important;
  }
  .edit-timetable-wrap .drag-timetable {
    width:100% !important;
    min-width:1000px !important;
    max-width:none !important;
  }

  /* Bottom navigation costs too much vertical space in landscape; the menu
     button remains available in the top bar. */
  .mobile-bottom-nav { display:none !important; }
}