@media (max-width: 1180px) {
  .class-launcher-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .level-grid,
  .tool-grid,
  .assignment-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .block-grid,
  .resource-grid,
  .students-grid,
  .student-progress-grid,
  .teacher-group-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-header {
    border-radius: 30px;
  }

  .level-card {
    min-height: 260px;
  }
}

@media (max-width: 940px) {
  .app-shell {
    grid-template-columns: 238px minmax(0, 1fr);
    --sidebar-width: 238px;
  }

  .app-shell.is-sidebar-collapsed {
    grid-template-columns: 0 minmax(0, 1fr);
  }

  .sidebar {
    padding: 18px 14px;
  }

  .brand {
    align-items: start;
  }

  .brand-logo {
    width: 52px;
    max-height: 52px;
  }

  .brand-title,
  .brand-subtitle,
  .nav-link span:not(.nav-icon),
  .teacher-profile div:not(.avatar) {
    display: none;
  }

  .sidebar {
    width: 92px;
  }

  .brand,
  .teacher-profile,
  .nav-link {
    border-radius: 24px;
  }

  .nav-link {
    min-height: 54px;
  }

  .app-shell {
    grid-template-columns: 92px minmax(0, 1fr);
  }

  .app-shell.is-sidebar-collapsed {
    grid-template-columns: 0 minmax(0, 1fr);
  }

  .brand,
  .teacher-profile,
  .nav-link {
    justify-content: center;
  }

  .module-controls {
    grid-template-columns: 1fr;
  }

  .teacher-group-grid {
    grid-template-columns: 1fr;
  }

  .link-list-controls {
    grid-template-columns: 1fr;
  }

  .link-list-controls .filter-chips {
    justify-content: flex-start;
  }

  .link-search-panel {
    max-width: none;
  }

  .filter-chips {
    justify-content: flex-start;
  }

  .module-panel-body {
    grid-template-columns: 1fr;
  }

  .module-panel-body.teaching-workspace {
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.85fr);
  }

  .module-workspace-header {
    grid-template-columns: 1fr;
  }

  .module-workspace-page.is-focus-mode .module-workspace-header {
    grid-template-columns: 1fr;
  }

  .module-workspace-page.is-focus-mode .module-workspace-title {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .module-workspace-actions {
    grid-template-columns: 1fr;
  }

  .workspace-action-row {
    justify-content: flex-start;
  }

  .link-manager-layout,
  .staff-manager-layout,
  .student-manager-layout {
    grid-template-columns: 1fr;
  }

  .link-manager-layout.is-links-collapsed .link-manager-form {
    grid-template-columns: 1fr;
  }

  .link-manager-card {
    position: static;
  }

  .staff-member-controls {
    grid-template-columns: 1fr;
  }

  .assignment-dashboard-item {
    grid-template-columns: 1fr;
  }

  .assignment-dashboard-meta {
    justify-content: flex-start;
  }

  .assignment-detail-layout {
    grid-template-columns: 1fr;
  }

  .progress-snapshot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .student-level-module-card {
    grid-template-columns: 1fr;
  }

  .student-level-module-actions {
    justify-content: flex-start;
  }

}

@media (max-width: 780px) {
  .app-shell {
    display: block;
  }

  .sidebar {
    display: none;
  }

  .sidebar-collapse-toggle,
  .sidebar-show-toggle {
    display: none;
  }

  .main-area {
    padding: 18px 12px 104px;
  }

  .mobile-nav {
    display: grid;
  }

  .page-header {
    display: grid;
    border-radius: 28px;
    padding: 20px;
  }

  h1 {
    font-size: clamp(2rem, 12vw, 3rem);
  }

  .header-row {
    display: grid;
    justify-content: stretch;
  }

  .back-link {
    justify-self: start;
  }

  .welcome-panel {
    grid-template-columns: 1fr;
  }

  .welcome-art {
    display: none;
  }

  .level-grid,
  .block-grid,
  .module-grid,
  .resource-grid,
  .tool-grid,
  .students-grid,
  .student-progress-grid,
  .student-progress-quick-stats,
  .student-homework-summary,
  .class-launcher-grid,
  .assignment-summary-grid {
    grid-template-columns: 1fr;
  }

  .class-launcher-card {
    min-height: 190px;
  }

  .recent-module-card {
    align-items: stretch;
    flex-direction: column;
  }

  .recent-module-card .button {
    width: 100%;
  }

  .link-card-main {
    align-items: stretch;
    flex-direction: column;
  }

  .link-arrow {
    transform: rotate(90deg);
  }

  .level-card {
    min-height: 235px;
  }

  .level-card,
  .student-card,
  .assignment-dashboard-card,
  .assignment-dashboard-item,
  .assignment-detail-card,
  .link-manager-card,
  .link-list-card,
  .teacher-student-link-card {
    border-radius: 24px;
  }

  .student-identity-form {
    grid-template-columns: 1fr;
  }

  .student-identity-form .button {
    width: 100%;
  }

  .module-card {
    min-height: 165px;
  }

  .tool-action-row {
    align-items: stretch;
    flex-direction: column;
  }

  .tool-launch-button {
    width: 100%;
  }

  .student-card-actions,
  .assignment-dashboard-actions,
  .assignment-detail-actions,
  .student-level-module-actions {
    justify-content: stretch;
  }

  .student-card-actions .button,
  .assignment-dashboard-actions .button,
  .assignment-detail-actions .button,
  .student-level-module-actions .button,
  .student-level-module-actions a {
    width: 100%;
  }

  .module-workspace-page {
    min-height: auto;
    gap: 10px;
  }

  .module-workspace-header {
    border-radius: 24px;
    padding: 12px;
  }

  .module-workspace-page.is-focus-mode {
    min-height: auto;
  }

  .module-workspace-page.is-focus-mode .module-workspace-header {
    padding: 10px;
  }

  .module-workspace-page.is-focus-mode .module-workspace-title {
    grid-template-columns: 1fr;
  }

  .module-workspace-page.is-focus-mode .module-workspace-title > p,
  .module-workspace-page.is-focus-mode .module-panel-meta {
    display: none;
  }

  .module-workspace-title h1 {
    font-size: 1.35rem;
  }

  .module-workspace-title > p {
    display: none;
  }

  .module-sibling-nav {
    align-items: stretch;
    width: 100%;
  }

  .module-sibling-nav .back-link,
  .module-sibling-link {
    flex: 1 1 170px;
    justify-content: center;
  }

  .module-workspace-page.is-focus-mode .module-workspace-title h1 {
    font-size: 1.18rem;
  }

  .module-workspace-actions {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .workspace-action-group.is-view-controls {
    order: 1;
  }

  .workspace-action-group.is-external-resources {
    order: 2;
    border-top: 1px solid rgba(63, 140, 255, 0.12);
    padding-top: 8px;
  }

  .workspace-action-details summary {
    justify-content: center;
    width: 100%;
    min-height: 36px;
    font-size: 0.78rem;
  }

  .workspace-action-group.is-external-resources .workspace-resource-action,
  .workspace-action-group.is-external-resources .workspace-action-empty {
    min-height: 34px;
    padding-inline: 10px;
    font-size: 0.76rem;
  }

  .workspace-resource-action {
    flex: 1 1 180px;
    justify-content: center;
  }

  .custom-video-form {
    grid-template-columns: 1fr;
  }

  .media-tab,
  .custom-video-form .button {
    flex: 1 1 150px;
  }

  .module-panel-header {
    align-items: start;
    padding: 16px;
  }

  .module-panel-actions {
    justify-content: stretch;
    width: 100%;
  }

  .module-panel-actions .button {
    flex: 1 1 180px;
  }

  .module-panel-body {
    gap: 12px;
    padding: 14px;
  }

  .module-panel-body.teaching-workspace {
    grid-template-columns: 1fr;
  }

  .student-level-module-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .student-level-module-actions {
    justify-content: flex-start;
  }

  .module-workspace-layout {
    min-height: auto;
  }

  .module-workspace-page.is-focus-mode .module-workspace-layout {
    min-height: auto;
  }

  .material-workspace-panel,
  .shared-teaching-workspace {
    min-height: 520px;
  }

  .module-action-grid {
    grid-template-columns: 1fr;
  }

  .assignment-picker-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .assignment-picker-toolbar div {
    flex-direction: column;
  }

  .assignment-picker-toolbar .button,
  .assignment-form-actions .button {
    width: 100%;
  }

  .assignment-student-list {
    grid-template-columns: 1fr;
  }

  .module-action-card {
    min-height: 72px;
  }

  .whiteboard-header {
    align-items: start;
  }

  .shared-teaching-header {
    align-items: stretch;
    flex-direction: column;
  }

  .teaching-mode-tabs {
    width: 100%;
  }

  .whiteboard-toolbar {
    align-items: stretch;
  }

  .whiteboard-tool-group,
  .whiteboard-text-field,
  .whiteboard-swatch-group {
    flex: 1 1 100%;
  }

  .whiteboard-tool {
    min-height: 44px;
  }

  .whiteboard-swatch-group {
    align-items: center;
  }

  .whiteboard-swatch {
    width: 38px;
    height: 38px;
  }

  .material-viewer iframe,
  .material-placeholder,
  .material-reference {
    min-height: 390px;
  }

  .video-viewer iframe {
    min-height: 0;
  }

  .filter-chips {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 2px;
  }

  .assignment-dashboard-card {
    padding: 14px;
  }

  .students-panel {
    padding: 14px;
  }

  .assignment-dashboard-heading,
  .assignment-filter-row,
  .assignment-dashboard-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .assignment-dashboard-count {
    align-self: flex-start;
  }

  .assignment-filter-row .filter-tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 2px;
  }

  .assignment-student-filter {
    min-width: 0;
  }

  .assignment-dashboard-item {
    padding: 14px;
  }

  .assignment-dashboard-main {
    align-items: flex-start;
  }

  .assignment-dashboard-actions .button {
    width: 100%;
  }

  .assignment-pagination {
    align-items: stretch;
    flex-direction: column;
  }

  .assignment-pagination > div,
  .assignment-pagination .button {
    width: 100%;
  }

  .assignment-pagination > span,
  .assignment-pagination-end {
    text-align: center;
  }

  .student-card-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .student-card-actions .button {
    width: 100%;
  }

  .student-detail-stats {
    justify-content: flex-start;
  }

  .student-quick-assign-heading {
    grid-template-columns: 1fr;
  }

  .student-quick-assign-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .student-level-block-heading,
  .student-level-progress-hero {
    align-items: stretch;
    flex-direction: column;
  }

  .student-level-module-actions .button {
    width: 100%;
  }

  .student-assignment-row {
    align-items: stretch;
    flex-direction: column;
  }

  .student-assignment-row .assignment-history-status {
    align-self: flex-start;
  }

  .assignment-detail-hero {
    align-items: stretch;
    flex-direction: column;
  }

  .assignment-detail-actions {
    justify-content: stretch;
  }

  .assignment-detail-actions .button,
  .assignment-detail-actions .assignment-history-status {
    width: 100%;
    justify-content: center;
  }

  .assignment-detail-card {
    padding: 16px;
  }

  .assignment-detail-list div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .progress-snapshot-grid {
    grid-template-columns: 1fr;
  }

  .assignment-notes-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .assignment-notes-actions .button {
    width: 100%;
  }
}

@media (max-width: 420px) {
  h1 {
    font-size: 2rem;
  }

  .page-header,
  .welcome-panel,
  .module-controls,
  .search-panel {
    border-radius: 22px;
  }

  .mobile-nav {
    right: 8px;
    bottom: 8px;
    left: 8px;
  }

  .mobile-nav-link {
    min-height: 56px;
    font-size: 0.66rem;
  }

  .resource-chip {
    min-height: 32px;
  }

  .module-panel-close {
    width: 100%;
  }

  .module-panel-header {
    flex-direction: column;
  }

  .whiteboard-header {
    flex-direction: column;
  }

  .whiteboard-header .button,
  .whiteboard-tool-group .whiteboard-tool {
    width: 100%;
  }
}

/* Novakid-inspired responsive polish */
@media (max-width: 1180px) {
  .level-card {
    min-height: 238px;
  }

  .block-card {
    min-height: 198px;
  }

  .module-card {
    min-height: 188px;
  }

  .assignment-summary-card {
    min-height: 118px;
  }
}

@media (max-width: 1024px) {
  .module-panel-body.teaching-workspace {
    grid-template-columns: 1fr;
  }

  .module-workspace-layout {
    min-height: auto;
  }

  .material-workspace-panel,
  .shared-teaching-workspace {
    min-height: auto;
  }

  .material-viewer iframe,
  .material-placeholder,
  .material-reference,
  .media-loading-state,
  .media-fallback-state,
  .whiteboard-canvas-shell canvas {
    min-height: 360px;
  }

  .video-viewer iframe {
    min-height: 0;
  }
}

@media (max-width: 940px) {
  .page-header,
  .module-workspace-header,
  .assignment-detail-hero {
    border-radius: 30px;
  }

  .workspace-action-row {
    justify-content: flex-start;
  }

  .module-sibling-nav .back-link,
  .module-sibling-link,
  .workspace-resource-action {
    min-width: 0;
  }

  .assignment-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 780px) {
  .main-area {
    padding: 16px 10px 106px;
  }

  .page-header,
  .welcome-panel,
  .module-controls,
  .search-panel,
  .module-workspace-header,
  .workspace-panel,
  .assignment-detail-hero,
  .assignment-detail-card,
  .assignment-dashboard-card,
  .students-panel,
  .student-card {
    border-radius: 26px;
  }

  .page-header,
  .module-workspace-header,
  .assignment-detail-hero {
    padding: 18px;
  }

  .header-row,
  .section-heading,
  .assignment-dashboard-heading,
  .student-quick-assign-heading,
  .student-level-block-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .header-row .button,
  .header-row .back-link,
  .page-header .button,
  .page-header .back-link {
    width: 100%;
  }

  .level-card,
  .block-card,
  .module-card,
  .student-card,
  .assignment-dashboard-item {
    padding: 18px;
  }

  .level-card {
    min-height: 220px;
  }

  .level-card::after,
  .block-card::after,
  .module-card::after {
    opacity: 0.58;
  }

  .level-icon {
    width: 62px;
    height: 62px;
    border-radius: 24px;
  }

  .block-icon,
  .student-avatar,
  .assignment-summary-icon,
  .assignment-student-avatar {
    width: 54px;
    height: 54px;
    border-radius: 22px;
  }

  .level-card .button,
  .module-open-button,
  .tool-launch-button {
    width: 100%;
  }

  .module-card {
    min-height: 176px;
  }

  .module-top,
  .block-stats,
  .student-card-stats,
  .student-detail-stats,
  .assignment-dashboard-meta,
  .student-level-module-meta {
    gap: 7px;
  }

  .status-badge,
  .block-number,
  .block-stats span,
  .module-number,
  .review-badge,
  .student-sync-badge,
  .student-card-stats span,
  .student-detail-stats span,
  .assignment-dashboard-count,
  .assignment-due-date,
  .assignment-history-status {
    white-space: normal;
  }

  .module-sibling-nav .back-link,
  .module-sibling-link,
  .workspace-resource-action,
  .media-tab,
  .material-tab,
  .whiteboard-tool,
  .teaching-mode-tab {
    min-height: 46px;
    text-align: center;
  }

  .media-tabs {
    display: grid;
    grid-template-columns: 1fr;
  }

  .media-tab,
  .custom-video-form .button {
    width: 100%;
  }

  .workspace-action-row,
  .whiteboard-tool-group,
  .assignment-form-actions,
  .assignment-notes-actions {
    align-items: stretch;
  }

  .workspace-resource-action,
  .whiteboard-tool,
  .assignment-form-actions .button,
  .assignment-notes-actions .button {
    width: 100%;
  }

  .whiteboard-icon-tool,
  .whiteboard-swatch,
  .whiteboard-color-field {
    width: auto;
  }

  .teaching-present-button {
    width: 100%;
  }

  .material-viewer iframe,
  .material-placeholder,
  .material-reference,
  .media-loading-state,
  .media-fallback-state,
  .whiteboard-canvas-shell canvas {
    min-height: 330px;
    border-radius: 22px;
  }

  .whiteboard-canvas-shell {
    padding: 10px;
  }

  .student-text-display {
    width: calc(100% - 20px);
    min-height: 300px;
    margin: 10px;
    border-radius: 24px;
    padding: 18px;
    font-size: 34px;
  }

  .assignment-summary-card {
    min-height: 112px;
    border-radius: 26px;
  }

  .assignment-dashboard-main,
  .assignment-detail-main,
  .student-card-header {
    align-items: flex-start;
  }
}

@media (max-width: 520px) {
  .page-header,
  .module-workspace-header,
  .assignment-detail-hero {
    padding: 16px;
  }

  h1,
  .module-workspace-title h1 {
    font-size: clamp(1.65rem, 10vw, 2.25rem);
    line-height: 1.02;
  }

  .level-card {
    min-height: 0;
  }

  .card-body {
    align-content: start;
    margin-top: 20px;
  }

  .level-card h3,
  .module-card h3,
  .block-card h3 {
    font-size: 1.22rem;
  }

  .button,
  .back-link,
  .clear-search,
  .filter-chip {
    min-height: 46px;
    padding-inline: 14px;
  }

  .assignment-summary-card {
    align-items: flex-start;
  }

  .assignment-summary-card strong {
    font-size: 1.9rem;
  }

  .student-progress-quick-stats,
  .student-homework-summary,
  .progress-snapshot-grid {
    grid-template-columns: 1fr;
  }

  .material-viewer iframe,
  .material-placeholder,
  .material-reference,
  .media-loading-state,
  .media-fallback-state,
  .whiteboard-canvas-shell canvas {
    min-height: 280px;
  }

  .video-viewer iframe {
    min-height: 0;
  }

  .student-text-display {
    font-size: 30px;
  }
}

@media (max-width: 420px) {
  .main-area {
    padding-inline: 8px;
  }

  .page-header,
  .welcome-panel,
  .module-controls,
  .search-panel,
  .module-workspace-header,
  .workspace-panel,
  .assignment-detail-hero,
  .assignment-detail-card,
  .assignment-dashboard-card,
  .students-panel,
  .student-card,
  .level-card,
  .block-card,
  .module-card {
    border-radius: 22px;
  }

  .level-card,
  .block-card,
  .module-card,
  .student-card,
  .assignment-dashboard-item {
    padding: 16px;
  }

  .level-icon,
  .block-icon,
  .student-avatar,
  .assignment-summary-icon,
  .assignment-student-avatar,
  .material-placeholder-icon {
    width: 50px;
    height: 50px;
    border-radius: 20px;
  }

  .mobile-nav {
    grid-template-columns: repeat(auto-fit, minmax(54px, 1fr));
    gap: 4px;
    padding: 6px;
  }

  .mobile-nav-link {
    min-width: 0;
    padding-inline: 4px;
  }

  .mobile-nav-link span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .material-viewer iframe,
  .material-placeholder,
  .material-reference,
  .media-loading-state,
  .media-fallback-state,
  .whiteboard-canvas-shell canvas {
    min-height: 240px;
  }

  .student-text-display {
    min-height: 250px;
    font-size: 28px;
  }
}

@media (max-width: 780px) {
  .media-image-layout.is-expanded {
    inset: 4px;
    gap: 6px;
    border-radius: 18px;
    padding: 5px;
  }

  .media-image-layout.is-expanded .media-image-stage {
    border-radius: 16px;
  }

  .media-image-layout.is-expanded .media-image-toolrail {
    gap: 6px;
    justify-content: flex-start;
    border-radius: 14px;
    padding: 5px;
  }

  .media-image-layout.is-expanded .media-annotation-tool,
  .media-image-layout.is-expanded .media-image-expand-button {
    min-width: 40px;
    min-height: 40px;
    padding-inline: 9px;
  }

  .media-image-layout.is-expanded .media-annotation-tool span,
  .media-image-layout.is-expanded .media-image-expand-button span {
    display: none;
  }

  .media-image-layout.is-expanded .media-annotation-size {
    width: 74px;
    flex: 0 0 auto;
  }

  .media-image-layout.is-expanded .media-annotation-text {
    width: 82px;
    flex: 0 0 auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}