@media (min-width: 768px) { .sidebar { transform: translateX(0); }.app-content { margin-right: 250px; width: calc(100% - 250px); }.menu-toggle { display: none; } }
@media (max-width: 767px) { .header-school-name { display: none; }.stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.app-header { padding: var(--spacing-sm) var(--spacing-md); } }
@media (max-width: 599px) { .app-content { padding: var(--spacing-md); }.stats-grid { grid-template-columns: 1fr; }.login-card { padding: var(--spacing-lg); }.data-table thead { display: none; }.data-table, .data-table tbody, .data-table tr, .data-table td { display: block; width: 100%; }.data-table tr { margin-bottom: var(--spacing-md); border: 1px solid var(--color-gray-light); border-radius: var(--radius-md); }.data-table td { display: flex; justify-content: space-between; gap: var(--spacing-sm); text-align: left; }.data-table td::before { content: attr(data-label); color: var(--color-gray); font-weight: 700; text-align: right; }.data-table td:last-child { border-bottom: 0; }.actions { justify-content: flex-end; }.button { min-height: 40px; }.week-grid { grid-template-columns: repeat(7, minmax(145px, 1fr)); } }