:root {
  --navy: #132a44;
  --navy-deep: #0d2035;
  --blue: #1769aa;
  --text: #1d2b3a;
  --muted: #667789;
  --border: #dbe3eb;
  --surface: #ffffff;
  --background: #f4f7fa;
}

html { font-size: 14px; }
body { margin: 0; color: var(--text); background: var(--background); font-family: Inter, "Segoe UI", Arial, sans-serif; }
a { color: var(--blue); }
.btn:focus-visible, a:focus-visible { outline: 3px solid rgba(53, 146, 220, .35); outline-offset: 2px; }

.app-header { background: linear-gradient(100deg, var(--navy-deep), var(--navy)); box-shadow: 0 2px 8px rgba(13, 32, 53, .18); }
.navbar { min-height: 58px; padding: .35rem 0; }
.navbar-brand { display: flex; align-items: center; gap: .65rem; margin-right: 1.6rem; font-size: 1rem; font-weight: 650; letter-spacing: .01em; }
.navbar-brand small { color: #9fc3df; font-size: .75em; font-weight: 600; }
.brand-mark { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 7px; background: #fff; color: var(--navy); font-size: .72rem; font-weight: 800; }
.navbar-dark .navbar-nav .nav-link { color: #d5e2ed; border-radius: 5px; padding: .5rem .72rem; font-size: .9rem; }
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { color: #fff; background: rgba(255,255,255,.09); }
.user-menu { display: flex; align-items: center; gap: .65rem; color: #fff; font-size: .84rem; }
.user-avatar { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #dbeaf5; color: var(--navy); font-weight: 700; }
.user-details { display: flex; flex-direction: column; line-height: 1.15; }
.user-permission { color: #9fc3df; font-size: .68rem; }
.user-menu form { margin: 0 0 0 .2rem; }

.app-content { padding-top: 1.5rem; padding-bottom: 2rem; }
.page-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 1.25rem; }
.heading-actions { display: flex; align-items: center; gap: .5rem; }
.eyebrow { margin: 0 0 .2rem; color: var(--blue); font-size: .72rem; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
h1 { margin: 0; font-size: 1.65rem; font-weight: 670; letter-spacing: -.02em; }
h2 { margin: 0 0 .45rem; font-size: 1.15rem; }
.page-subtitle { margin: .35rem 0 0; color: var(--muted); }

.dashboard-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.dashboard-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .9rem; min-height: 88px; padding: 1rem; color: var(--text); text-decoration: none; background: var(--surface); border: 1px solid var(--border); border-radius: 9px; box-shadow: 0 2px 5px rgba(26, 45, 65, .04); transition: transform .15s ease, box-shadow .15s ease; }
.dashboard-card:hover { color: var(--text); transform: translateY(-1px); box-shadow: 0 5px 14px rgba(26, 45, 65, .09); }
.dashboard-card strong, .dashboard-card small { display: block; }
.dashboard-card strong { margin-bottom: .2rem; font-size: .96rem; }
.dashboard-card small { color: var(--muted); font-size: .8rem; }
.card-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 8px; font-weight: 750; }
.card-icon-blue { color: #155f96; background: #e4f1fa; }
.card-icon-green { color: #28714e; background: #e3f3ea; }
.card-icon-amber { color: #916112; background: #fff0cf; }
.card-arrow { color: #8997a5; font-size: 1.2rem; }
.content-card { padding: 1.1rem; background: var(--surface); border: 1px solid var(--border); border-radius: 9px; }
.getting-started p:last-child { max-width: 720px; margin: 0; color: var(--muted); line-height: 1.55; }
.empty-page { min-height: 260px; display: grid; place-items: center; text-align: center; }
.empty-page p { margin: .4rem 0 0; color: var(--muted); }

.compact-alert { padding: .55rem .8rem; margin-bottom: .8rem; font-size: .84rem; }
.table-page { display: flex; height: 100vh; flex-direction: column; overflow: hidden; }
.table-page .app-header { flex: 0 0 auto; }
.table-page .app-content { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.table-page .app-content > main { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.table-page .data-card { flex: 1 1 auto; min-height: 0; }
.data-card { display: flex; flex-direction: column; min-height: 360px; padding: 0; overflow: hidden; }
.table-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .65rem .8rem; border-bottom: 1px solid var(--border); }
.record-summary { color: var(--muted); font-size: .82rem; }
.record-summary strong { color: var(--text); }
.table-actions { display: flex; align-items: center; gap: .4rem; padding: .25rem; border: 1px solid var(--border); border-radius: 7px; background: #f8fafc; }
.table-search { position: relative; display: flex; align-items: center; margin: 0; }
.table-search svg { position: absolute; left: .55rem; width: 15px; height: 15px; fill: none; stroke: #738294; stroke-width: 1.8; stroke-linecap: round; }
.table-search input { width: 190px; height: 30px; padding: .25rem .55rem .25rem 1.85rem; border: 1px solid var(--border); border-radius: 5px; background: #fff; font-size: .82rem; }
.icon-button { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 1px solid transparent; border-radius: 5px; color: #536477; background: transparent; }
.icon-button:hover, .icon-button[aria-pressed="true"] { color: var(--blue); border-color: #cad8e4; background: #fff; }
.icon-button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.no-caret::after { display: none; }
.export-menu { min-width: 132px; font-size: .82rem; }
.add-product-button { height: 30px; padding: .25rem .7rem; font-size: .8rem; }
.table-scroll { flex: 1; min-height: 0; overflow: auto; }
.data-table { width: 100%; min-width: 680px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.data-table th, .data-table td { padding: .6rem .75rem; border-bottom: 1px solid #e5ebf0; overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; font-size: .83rem; }
.data-table td.row-actions-cell { overflow: visible; }
.row-actions { position: relative; }
.row-actions .dropdown-menu { z-index: 1085; }
.row-actions-cell .icon-button { margin-left: auto; }
.data-table thead { position: sticky; top: 0; z-index: 2; }
.data-table th { position: relative; color: #4b5d70; background: #f6f8fa; font-size: .76rem; font-weight: 700; letter-spacing: .015em; user-select: none; cursor: pointer; }
.products-page .data-table th:nth-child(1) { width: 25%; }
.products-page .data-table th:nth-child(2) { width: 48%; }
.products-page .data-table th:nth-child(3) { width: 12%; }
.products-page .data-table th:nth-child(4) { width: 15%; }
.data-table tbody tr:not(.empty-filter-row):not(.empty-data-row):hover td { background: #f4f8fb; }
.editable-row { cursor: pointer; }
.editable-row:focus { outline: 2px solid #69a8d5; outline-offset: -2px; }
.description-cell { color: var(--muted); }
.sort-indicator { margin-left: .3rem; color: var(--blue); }
.column-resizer { position: absolute; top: 0; right: -2px; width: 6px; height: 100%; cursor: col-resize; }
.column-resizer:hover { background: #b8cede; }
.filter-row th { padding: .35rem .5rem; cursor: default; }
.filter-row input, .filter-row select { width: 100%; height: 27px; padding: .2rem .4rem; border: 1px solid #ccd7e1; border-radius: 4px; background: #fff; font-size: .76rem; }
.status-badge { display: inline-flex; align-items: center; padding: .18rem .45rem; border-radius: 99px; font-size: .72rem; font-weight: 650; }
.status-active { color: #246345; background: #e4f3eb; }
.status-inactive { color: #66717d; background: #edf0f3; }
.empty-filter-row td, .empty-data-row td { padding: 2.5rem; color: var(--muted); text-align: center; }
.compact-modal .modal-header, .compact-modal .modal-footer { padding: .75rem 1rem; }
.compact-modal .modal-body { padding: 1rem; }
.compact-modal .modal-title { margin: 0; font-size: 1.05rem; }
.compact-modal .form-label { margin-bottom: .3rem; font-size: .82rem; font-weight: 650; }
.compact-modal .form-control { font-size: .85rem; }
.compact-modal .validation-summary:empty { display: none; }
.modal-form-scroll { max-height: min(68vh, 620px); overflow-y: auto; }
.search-combobox { position: relative; }
.combo-trigger { color: var(--text); text-align: left; background: #fff; }
.combo-panel { position: absolute; z-index: 1060; top: calc(100% + 3px); width: 100%; padding: .4rem; border: 1px solid var(--border); border-radius: 6px; background: #fff; box-shadow: 0 8px 20px rgba(20, 42, 64, .15); }
.combo-search { position: sticky; top: 0; margin-bottom: .35rem; }
.combo-options { max-height: 180px; overflow-y: auto; }
.combo-options button { display: block; width: 100%; padding: .4rem .5rem; border: 0; border-radius: 4px; color: var(--text); text-align: left; background: transparent; font-size: .82rem; }
.combo-options button:hover, .combo-options button:focus { background: #edf4f9; }
.readonly-control { color: var(--muted); background: #f7f9fb; }

.school-detail-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 1rem; align-items: start; }
.school-detail-sidebar { position: sticky; top: 1rem; display: flex; min-width: 0; flex-direction: column; gap: 1rem; }
.school-info-panel { padding: 1rem; }
.school-panel-heading { display: flex; align-items: center; gap: .8rem; padding-bottom: .85rem; border-bottom: 1px solid var(--border); }
.school-panel-heading h2 { margin-bottom: .3rem; }
.school-info-list { margin: .4rem 0 0; }
.school-info-list > div { padding: .62rem 0; border-bottom: 1px solid #edf1f4; }
.school-info-list > div:last-child { border-bottom: 0; }
.school-info-list dt { margin-bottom: .15rem; color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.school-info-list dd { margin: 0; overflow-wrap: anywhere; font-size: .82rem; line-height: 1.4; }
.school-products-panel { padding: 0; overflow: hidden; }
.school-products-row { margin-bottom: 1rem; }
.school-products-heading { display: flex; align-items: center; justify-content: space-between; padding: .75rem .85rem; border-bottom: 1px solid var(--border); }
.school-products-heading h2 { margin: 0; font-size: .95rem; }
.mini-table-scroll { max-height: 210px; overflow: auto; }
.mini-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.mini-table th, .mini-table td { padding: .48rem .6rem; border-bottom: 1px solid #edf1f4; overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; font-size: .74rem; }
.mini-table th { position: sticky; top: 0; color: var(--muted); background: #f7f9fb; font-size: .66rem; text-transform: uppercase; }
.mini-table th:first-child { width: 48%; }
.mini-table th:nth-child(2) { width: 14%; text-align: center; }
.mini-table td:nth-child(2) { text-align: center; }
.mini-table th:last-child { width: 38%; }
.mini-table tr:last-child td { border-bottom: 0; }
.mini-table-empty { color: var(--muted); text-align: center !important; }
.renewal-overdue { color: #a23d3d; font-weight: 650; }
.school-detail-main { min-width: 0; }
.support-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.metric-tile { display: flex; min-height: 104px; flex-direction: column; justify-content: center; padding: .85rem 1rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); box-shadow: 0 2px 5px rgba(26, 45, 65, .04); }
.metric-tile > span { color: var(--muted); font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.metric-tile strong { margin: .35rem 0 .2rem; color: var(--navy); font-size: 1.35rem; letter-spacing: -.02em; }
.metric-tile small { color: #7b8996; font-size: .7rem; }
.metric-accent { border-color: #bfd8ea; background: #f2f8fc; }
.school-activity-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.activity-card { padding: 0; overflow: hidden; }
.activity-header { display: flex; align-items: center; justify-content: space-between; padding: .85rem 1rem; border-bottom: 1px solid var(--border); }
.activity-header h2 { margin: 0; }
.activity-count { display: grid; place-items: center; min-width: 28px; height: 24px; padding: 0 .4rem; border-radius: 99px; color: var(--blue); background: #e8f2f9; font-size: .76rem; font-weight: 700; }
.activity-actions { display: flex; align-items: center; gap: .5rem; }
.activity-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 62px; padding: .65rem 1rem; border-bottom: 1px solid #edf1f4; }
.activity-row:last-child { border-bottom: 0; }
.activity-row > div:first-child { min-width: 0; }
.activity-row strong, .activity-row span { display: block; }
.activity-row strong { overflow: hidden; margin-bottom: .18rem; text-overflow: ellipsis; white-space: nowrap; font-size: .84rem; }
.activity-row > div:first-child span { color: var(--muted); font-size: .74rem; }
.activity-row .calendar-state { margin-top: .18rem; font-size: .67rem; font-weight: 650; }
.calendar-synced { color: #2a7752 !important; }
.calendar-failed { color: #a23d3d !important; }
.calendar-notsynced { color: #7a8794 !important; }
.calendar-deleted { color: #7a8794 !important; }

.calendar-page { display: flex; height: 100vh; flex-direction: column; overflow: hidden; }
.calendar-page .app-header { flex: 0 0 auto; }
.calendar-page .app-content { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.calendar-page .app-content > main { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.calendar-heading { flex: 0 0 auto; }
.week-navigation { display: flex; align-items: center; gap: .4rem; }
.week-button { color: var(--text); border-color: var(--border); background: #fff; text-decoration: none; font-size: 1.05rem; }
.calendar-card { flex: 1 1 auto; min-height: 0; padding: 0; overflow-x: auto; overflow-y: hidden; }
.week-calendar { display: grid; height: 100%; min-width: 980px; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.calendar-day { display: flex; min-width: 0; flex-direction: column; border-right: 1px solid var(--border); background: #fff; }
.calendar-day:last-child { border-right: 0; }
.calendar-day-header { display: flex; align-items: center; justify-content: space-between; min-height: 45px; padding: .5rem .65rem; border-bottom: 1px solid var(--border); color: var(--muted); background: #f7f9fb; }
.calendar-day-header span { font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.calendar-day-header strong { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; color: var(--text); font-size: .82rem; }
.calendar-today .calendar-day-header { color: var(--blue); background: #eef6fb; }
.calendar-today .calendar-day-header strong { color: #fff; background: var(--blue); }
.calendar-events { flex: 1 1 auto; min-height: 0; padding: .45rem; overflow-y: auto; }
.calendar-event { display: block; width: 100%; margin-bottom: .45rem; padding: .5rem .55rem; border: 0; border-left: 3px solid var(--blue); border-radius: 4px; color: var(--text); background: #edf5fa; text-align: left; text-decoration: none; }
.calendar-event:hover { color: var(--text); background: #e2eff7; }
.calendar-event strong, .calendar-event span, .calendar-event small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-event strong { margin: .15rem 0; font-size: .78rem; }
.calendar-event span { color: #516779; font-size: .7rem; }
.calendar-event .calendar-event-time { color: var(--blue); font-size: .67rem; font-weight: 750; }
.calendar-event small { margin-top: .2rem; color: #748392; font-size: .65rem; }
.calendar-empty-day { padding: 1.3rem .3rem; color: #9aa5af; text-align: center; font-size: .72rem; }

.dashboard-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-bottom: 1rem; }
.dashboard-metric { color: var(--text); text-decoration: none; }
.dashboard-metric:hover { color: var(--text); border-color: #bfd3e2; box-shadow: 0 5px 14px rgba(26,45,65,.08); }
.dashboard-workspace { display: grid; grid-template-columns: minmax(280px, 32%) minmax(0, 1fr); gap: 1rem; align-items: stretch; }
.dashboard-tasks-panel, .dashboard-calendar-panel { min-height: 430px; padding: 0; overflow: hidden; }
.dashboard-section-header { display: flex; align-items: center; justify-content: space-between; min-height: 58px; padding: .7rem .9rem; border-bottom: 1px solid var(--border); }
.dashboard-section-header h2 { margin: 0; font-size: 1rem; }
.dashboard-section-header a { font-size: .75rem; text-decoration: none; }
.dashboard-task-list { max-height: 515px; overflow-y: auto; }
.dashboard-task-row { display: flex; align-items: center; justify-content: space-between; gap: .65rem; min-height: 61px; padding: .65rem .8rem; border-bottom: 1px solid #edf1f4; color: var(--text); text-decoration: none; }
.dashboard-task-row:hover { color: var(--text); background: #f5f9fc; }
.dashboard-task-row > div:first-child { min-width: 0; }
.dashboard-task-row strong, .dashboard-task-row span { display: block; }
.dashboard-task-row strong { overflow: hidden; margin-bottom: .18rem; text-overflow: ellipsis; white-space: nowrap; font-size: .81rem; }
.dashboard-task-row > div:first-child span { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: .7rem; }
.dashboard-task-due { flex: 0 0 auto; color: var(--blue); text-align: right; }
.dashboard-task-due small { display: block; font-size: .62rem; text-transform: uppercase; }
.dashboard-task-due span { font-size: .75rem; font-weight: 700; }
.task-overdue { color: #ad3e3e; }
.dashboard-week-scroll { height: calc(100% - 58px); overflow-x: auto; overflow-y: hidden; }
.dashboard-week { display: grid; height: 100%; min-width: 760px; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.dashboard-day { min-width: 0; border-right: 1px solid var(--border); }
.dashboard-day:last-child { border-right: 0; }
.dashboard-section-actions { display: flex; align-items: center; gap: .6rem; }
.dashboard-day header { display: flex; align-items: center; justify-content: space-between; min-height: 38px; padding: .4rem .5rem; border-bottom: 1px solid var(--border); color: var(--muted); background: #f7f9fb; }
.dashboard-day header span { font-size: .65rem; font-weight: 700; text-transform: uppercase; }
.dashboard-day header strong { font-size: .74rem; }
.dashboard-today header { color: var(--blue); background: #edf6fb; }
.dashboard-day-events { height: calc(100% - 38px); padding: .35rem; overflow-y: auto; }
.dashboard-visit { display: block; width: 100%; margin-bottom: .35rem; padding: .4rem; border: 0; border-left: 2px solid var(--blue); border-radius: 3px; color: var(--text); background: #edf5fa; text-align: left; text-decoration: none; }
.dashboard-visit:hover { color: var(--text); background: #e2eff7; }
.dashboard-visit small, .dashboard-visit strong, .dashboard-visit span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-visit small { color: var(--blue); font-size: .61rem; }
.dashboard-visit strong { margin: .12rem 0; font-size: .7rem; }
.dashboard-visit span { color: var(--muted); font-size: .62rem; }
.dashboard-visit .dashboard-visit-duration { margin-top: .15rem; color: #536f82; font-weight: 650; }
.dashboard-no-visits { display: block; padding: 1rem 0; color: #a3adb6; text-align: center; }
.event-detail-list { margin: 0; }
.event-detail-list > div { padding: .62rem 0; border-bottom: 1px solid #edf1f4; }
.event-detail-list > div:last-child { border-bottom: 0; }
.event-detail-list dt { margin-bottom: .15rem; color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.event-detail-list dd { margin: 0; overflow-wrap: anywhere; font-size: .86rem; line-height: 1.45; }
.pill-link { display: inline-flex; align-items: center; min-height: 30px; padding: .28rem .75rem; border: 1px solid var(--blue); border-radius: 999px; color: var(--blue); font-size: .82rem; font-weight: 650; text-decoration: none; }
.pill-link:hover { color: #0f4f83; border-color: #0f4f83; background: #edf6fb; }

.report-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.report-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .85rem; min-height: 105px; padding: 1rem; border: 1px solid var(--border); border-radius: 9px; color: var(--text); background: #fff; box-shadow: 0 2px 5px rgba(26,45,65,.04); text-decoration: none; }
.report-card:hover { color: var(--text); border-color: #bfd3e2; box-shadow: 0 5px 14px rgba(26,45,65,.09); transform: translateY(-1px); }
.report-card-content { min-width: 0; }
.report-card-content strong, .report-card-content small { display: block; }
.report-card-content strong { margin-bottom: .28rem; font-size: .92rem; }
.report-card-content small { color: var(--muted); font-size: .76rem; line-height: 1.4; }
.wide-report-table { min-width: 1780px; }
.wide-report-table th:first-child { width: 210px; }
.wide-report-table th:nth-child(2), .wide-report-table th:nth-child(8) { width: 190px; }
.wide-report-table th:nth-child(7), .wide-report-table th:nth-child(13) { background: #edf5fa; }
.report-date-filter { display: flex; align-items: end; gap: .65rem; margin-bottom: .8rem; padding: .55rem .7rem; }
.report-date-filter > div { width: 145px; }
.report-date-filter label { display: block; margin-bottom: .2rem; color: var(--muted); font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.report-date-filter > span { margin: 0 0 .3rem .25rem; color: var(--muted); font-size: .72rem; }
.user-time-table { min-width: 1550px; }
.user-time-table th:first-child { width: 190px; }
.user-time-table th:last-child { background: #edf5fa; }
.inactive-note { display: block; color: #9b6262; font-size: .64rem; }
.contracted-hours-table { min-width: 980px; }
.contracted-hours-table th:first-child { width: 230px; }
.contracted-hours-table th:nth-child(2) { width: 210px; }
.hours-exceeded { color: #ad3e3e; font-weight: 700; }
.activity-meta { flex: 0 0 auto; text-align: right; }
.activity-meta small { display: block; margin-top: .25rem; color: var(--muted); font-size: .7rem; }
.activity-empty { padding: 2.25rem 1rem; color: var(--muted); text-align: center; font-size: .82rem; }
.activity-editable { cursor: pointer; }
.activity-editable:hover { background: #f5f9fc; }
.activity-editable:focus { outline: 2px solid #69a8d5; outline-offset: -2px; }

@media (max-width: 991.98px) {
  .navbar-collapse { padding: .65rem 0; }
  .user-menu { padding: .65rem .7rem 0; border-top: 1px solid rgba(255,255,255,.12); margin-top: .45rem; }
  .school-detail-layout { grid-template-columns: 230px minmax(0, 1fr); }
  .support-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .school-activity-grid { grid-template-columns: 1fr; }
  .dashboard-workspace { grid-template-columns: 1fr; }
  .dashboard-tasks-panel { min-height: 300px; }
  .report-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .dashboard-grid { grid-template-columns: 1fr; }
  .user-name { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  h1 { font-size: 1.4rem; }
  .page-heading { align-items: flex-start; flex-direction: column; gap: .75rem; }
  .heading-actions { align-self: stretch; justify-content: flex-end; }
  .table-page .data-card { min-height: 0; }
  .table-toolbar { align-items: stretch; flex-direction: column; }
  .record-summary { display: none; }
  .table-actions { width: 100%; }
  .table-search { flex: 1; }
  .table-search input { width: 100%; }
  .school-detail-layout { grid-template-columns: 1fr; }
  .school-detail-sidebar { position: static; }
  .support-tiles { grid-template-columns: 1fr 1fr; }
  .calendar-heading { align-items: stretch; flex-direction: column; gap: .75rem; }
  .week-navigation { justify-content: flex-end; }
  .week-calendar { min-width: 840px; }
  .dashboard-metrics { grid-template-columns: 1fr; }
  .report-grid { grid-template-columns: 1fr; }
  .report-date-filter { align-items: stretch; flex-wrap: wrap; }
  .report-date-filter > div { flex: 1 1 120px; width: auto; }
}

@media (max-width: 479.98px) {
  .support-tiles { grid-template-columns: 1fr; }
}