.mobile-search-toggle,
.mobile-directory-group,
.mobile-session-actions,
.mobile-reward-actions { display: none; }

@media (max-width: 680px) {
  #shell #content .reward-hub-course > .split { flex-wrap: wrap; align-items: flex-start; }
  #shell #content .reward-hub-row { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: start; }
  #shell #content .reward-hub-row > .grow { width: 100%; overflow-wrap: anywhere; }
  #shell #content .reward-hub-row-actions { justify-content: flex-start; gap: 8px; }
  .mobile-reward-actions, .mobile-session-actions { display: block; }
  .mobile-reward-actions > button, .mobile-session-actions > button { margin-top: 8px; }
  :is(.mobile-reward-actions,.mobile-session-actions) > summary { cursor: pointer; list-style: none; }
  :is(.mobile-reward-actions,.mobile-session-actions) > summary::-webkit-details-marker { display: none; }
  .desktop-reward-remove, .desktop-session-remove { display: none; }

  #shell #content .student-directory-card .student-directory-toolbar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: 9px;
  }
  #shell #content .student-directory-toolbar .field { min-width: 0; max-width: none; width: 100%; }
  #shell #content .student-directory-toolbar :is(input,select) { width: 100%; min-width: 0; }
  #shell #content .student-directory-toolbar .student-directory-search { grid-column: 1 / -1; grid-row: 1; }
  #shell #content .student-directory-toolbar .field:has(#studentDirectoryStream) { grid-column: 1 / -1; }
  #shell #studentDirectory .table-wrap { overflow-x: visible; }
  #shell #studentDirectory table { width: 100%; min-width: 0; table-layout: fixed; }
  #shell #studentDirectory :is(th,td):nth-child(n+2):nth-child(-n+5) { display: none; }
  #shell #studentDirectory :is(th,td):first-child { width: 57%; position: static; }
  #shell #studentDirectory :is(th,td) { white-space: normal; overflow-wrap: anywhere; }
  #shell #studentDirectory .student-link { max-width: 100%; white-space: normal; text-align: left; }
  #shell #studentDirectory .badge { white-space: normal; }
  .mobile-directory-group { display: block; margin-top: 4px; color: var(--linea-text-secondary,#a4b8cf); font-size: 12px; }

  body:has(.session-modal-backdrop) { overflow: hidden; }
  #modalLayer .session-modal-backdrop { padding: 0; display: block; overflow: hidden; }
  #modalLayer .session-modal-backdrop .session-modal {
    box-sizing: border-box;
    width: 100%; max-width: none;
    height: 100vh; height: 100dvh; max-height: none;
    margin: 0; border-radius: 0;
    padding: max(14px, env(safe-area-inset-top)) 14px max(18px, env(safe-area-inset-bottom));
    overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain;
  }
  #modalLayer .session-modal .modal-head { align-items: flex-start; }
  #modalLayer .session-modal .modal-head > div { min-width: 0; overflow-wrap: anywhere; }
  #modalLayer .session-modal .modal-head > button { flex: none; }
  #modalLayer .session-modal .session-roster-search { flex-basis: 100%; min-width: 0; }
  #modalLayer .session-roster-table { overflow: visible; }
  #modalLayer .session-roster-table table { width: 100%; min-width: 0; table-layout: fixed; }
  #modalLayer .session-roster-table :is(th,td):nth-child(2) { display: none; }
  #modalLayer .session-roster-table thead th:last-child { display: none; }
  #modalLayer .session-roster-table tr[data-att-row] { display: grid; grid-template-columns: minmax(0, 1fr); }
  #modalLayer .session-roster-table tr[data-att-row] > td { display: block; border-bottom: 0; }
  #modalLayer .session-roster-table tr[data-att-row] > td:nth-child(2) { display: none; }
  #modalLayer .session-roster-table tr[data-att-row] > td:last-child { border-bottom: 1px solid var(--linea-control-border,#26394f); }
  #modalLayer .session-roster-table :is(th,td) { padding-inline: 8px; white-space: normal; overflow-wrap: anywhere; }
  #modalLayer .session-roster-table :is(.att-edit,.att-reason-box,select,input) { min-width: 0; width: 100%; max-width: 100%; }
  #modalLayer .session-roster-table select { text-overflow: ellipsis; }

  html body.glass-home.glass-workspace #shell .topbar {
    height: auto !important;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px !important;
  }
  html body.glass-home.glass-workspace #shell .topbar .mobile-search-toggle {
    display: inline-grid; place-items: center; flex: none; width: 44px; height: 44px;
  }
  html.staging-liquid-glass body.glass-home.glass-workspace #shell .topbar.mobile-search-open { min-height: 106px !important; }
  .mobile-search-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
  html.staging-liquid-glass body.glass-home.glass-workspace #shell .topbar:not(.mobile-search-open) .global-search { display: none !important; }
  html.staging-liquid-glass body.glass-home.glass-workspace #shell .topbar.mobile-search-open .global-search {
    order: 10; flex: 0 0 100%; width: 100% !important; max-width: none !important;
  }
  html.staging-liquid-glass body.glass-home.glass-workspace #shell .topbar .server-clock-stack { margin-left: auto !important; }
  html.staging-liquid-glass body.glass-home.glass-workspace #shell .topbar .server-clock-stack:not(.has-active-session) {
    flex: 0 1 auto !important; width: auto !important; min-width: 0 !important;
  }
  html.staging-liquid-glass body.glass-home.glass-workspace #shell .topbar .server-clock-stack:not(.has-active-session) .server-clock {
    position: static !important; width: auto !important; min-width: 0 !important; padding-inline: 8px !important; font-size: 11px !important;
  }
  html.staging-liquid-glass body.glass-home.glass-workspace #shell .topbar .server-clock-stack.has-active-session {
    flex: 1 1 105px !important; width: auto !important; min-width: 0 !important;
  }
}

html:has(.session-modal-backdrop) { overflow: hidden; scrollbar-gutter: stable; }
#modalLayer .session-modal { overscroll-behavior: contain; }
#shell #content .manage-student-layout { align-items: start; }
#shell #content .manage-student-layout #manageGroupList { max-height: min(48vh, 15rem); overflow-y: auto; }
#shell #content .manage-student-list { min-width: 0; }
#shell #content .manage-student-list-heading { gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
#shell #content .manage-student-list-heading > div { flex: 1 1 280px; min-width: 0; }
#shell #content .manage-student-list-heading > button { flex: none; }

@media (min-width: 681px) {
  #shell #content .reward-hub-row { flex-wrap: wrap; align-items: flex-start; }
  #shell #content .reward-hub-row > .grow { flex: 1 1 14rem; overflow-wrap: anywhere; }
  #shell #content .reward-hub-row-actions { flex: 0 1 auto; justify-content: flex-start; }
}

@media (min-width: 1101px) {
  #shell #content .manage-student-layout { grid-template-columns: minmax(190px, 240px) minmax(0, 1fr); }
}

@media (min-width: 721px) and (max-width: 1300px) {
  html.staging-liquid-glass body.glass-home.glass-workspace #shell .home-week-primary .weekbar {
    box-sizing: border-box;
    width: 100%; min-width: 0; max-width: 100%;
    grid-template-columns: repeat(7, minmax(125px, 1fr));
    overflow-x: auto;
    padding: 3px 3px 10px;
  }
}

/* Working notes in the diploma allocation board */
#content .diploma-student-actions {
  width: 100%;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#content .diploma-student-actions .diploma-working-note { flex: 0 0 100%; }
#content .diploma-working-note-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px;
  padding: 8px 10px;
  border-radius: 8px;
}
#content .diploma-working-note-body > span:first-child { font-size: 10px; }
#content .diploma-working-note-body > [data-working-note-text] {
  overflow: visible;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 13px;
  font-weight: 450;
  letter-spacing: normal;
  text-transform: none;
  line-height: 1.45;
  color: var(--linea-text-primary, #edf5ff) !important;
}
#content .diploma-working-note-editor textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 88px;
  resize: vertical;
}
#content .diploma-working-note-editor .quick-actions { flex-wrap: wrap; }
