/* Mobile refinements shared by the course workspace and its dialogs. */
@media (max-width:800px) {
  body .course-tabs {background:var(--paper);margin-bottom:8px}
  .course-workspace.local-content-view>.course-tabs {display:none}
  body .local-menu-back {margin-bottom:4px;padding:8px 0;min-height:44px;font-size:12px}
  
  body .page-heading {gap:8px;flex-wrap:wrap}
  body .page-heading-actions {margin-left:auto}
  body .ml-round {width:44px;height:44px}
  .ml-tools {gap:6px}
  .ml-toolbar {row-gap:10px}
  .ml-chip {min-height:44px}
  .ml-chip>button {width:44px}
  .ml-clear,.ml-pop-close {min-width:44px;min-height:44px}
  .ml-choice,.ml-filter-option {font-size:13px}
  /* Long menus remain reachable even on short screens; only their body scrolls. */
  .ml-filter-popover {display:flex;flex-direction:column}
  .ml-filter-popover>.ml-pop-close {display:flex;top:4px;right:4px}
  .ml-filter-root {padding-top:44px}
  .ml-filter-submenu {display:flex;flex-direction:column;min-height:0;overflow:hidden;border-radius:0}
  .ml-filter-subheading,.ml-filter-search,.ml-filter-match,.ml-filter-footer,.ml-filter-context {flex-shrink:0}
  .ml-filter-option-list {min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain}
  .ml-filter-subheading {padding-right:52px}
  .ml-bar-row,.ml-bar-row>strong {font-size:12px}
  .ml-stats .ml-status-bar {grid-template-columns:122px minmax(0,1fr) 24px}
  .ml-stat-controls .ml-slice-select>summary {font-size:13px}
  .ml-reservation-controls {flex-wrap:wrap}
  .ml-reservation-field {flex:1 1 100%;width:100%}
  .ml-reservation-arrow {display:none}
  .ml-reservation-source {padding-left:0}
  .ml-reservation-field .ml-slice-options {width:100%;max-width:100%}
}
@media (max-width:650px) {
  body.focused-course .shell {padding-top:0;padding-bottom:16px}
  body .course-tabs {gap:0;margin-bottom:8px}
  body .course-tabs button {min-height:44px;padding:10px 4px;font-size:11px}
  .content-layout,.manage-layout {margin-inline:12px}
  body .talk-layout {margin:0 12px}
  body .talk-main.tk-main {padding:0;height:calc(100dvh - 68px);min-height:0;padding-bottom:env(safe-area-inset-bottom)}
  body .tk-main>.tk-page-heading {padding:6px 0;margin:0 0 6px;flex-wrap:nowrap}
  body .tk-main>.local-menu-back {margin-bottom:0}
  .tk-heading-copy p {font-size:11px}
  .tk-announcements {margin-bottom:4px}
  body .tk-main .tk-timeline {min-height:60px;overscroll-behavior:contain}
  .tk-main .tk-compose {margin-top:6px;padding:6px}
  .tk-main .tk-compose textarea {height:48px;min-height:48px;max-height:100px;resize:none;padding:6px}
  .tk-main>.tk-mock-note {margin:4px 0 0;font-size:9px;line-height:1.5}
  .tk-message-content {max-width:calc(100% - 36px)}
  .tk-message {gap:6px}
  .tk-bubble {font-size:14px;line-height:1.8}
  .tk-thread-summary {column-gap:12px}
  .tk-thread-summary time {font-size:11px}
  body .tk-main .tk-icon-button,body .tk-thread .tk-icon-button,.tk-send {min-width:44px;min-height:44px}
  body .content-results .content-icon-tools {margin-bottom:12px}
  .ml-toolbar .ml-scope {flex:1 0 100%}
  .ml-scope button {font-size:12px;padding-inline:12px}
  .ml-toolbar #ml-course {font-size:16px;min-height:44px}
  .ml-summary {padding:12px}
  .ml-summary-grid {gap:14px 8px}
  .ml-summary-grid span {font-size:11px}
  .ml-summary-grid strong {margin-top:6px}
  .ml-panel .mgr-table tr {padding:16px 12px;gap:14px 12px}
  .ml-panel .mgr-table td:nth-child(2),.ml-panel .mgr-table td:nth-child(3) {grid-column:1/-1}
  .ml-panel .mgr-table td:nth-child(2) {padding-block:12px;border-block:1px solid var(--line)}
  .ml-panel .mgr-table td,.ml-list-status,.ml-list-plan {font-size:13px}
  .ml-panel .mgr-table td:before,.ml-panel .mgr-table small {font-size:11px}
  .ml-member-identity strong,.ml-member-identity small {font-size:14px!important}
  .ml-membership {min-height:0}
  .ml-panel .mgr-table td:nth-child(3) .ml-membership {display:flex;flex-wrap:wrap;gap:4px 10px}
  .ml-panel .mgr-table td:nth-child(3) .ml-membership small {margin:0}
  .ml-stats {padding:16px 12px}
  .mgr-pagination button {min-height:44px}
  /* Detail tabs stay in one horizontally scrollable row instead of two tall rows. */
  .member-detail-tabs,.course-settings-dialog .cs-tabs {display:flex;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scroll-padding-inline:12px}
  .member-detail-tabs button,.course-settings-dialog .cs-tabs button {flex:1 0 auto;white-space:nowrap;min-height:48px;padding:10px 14px;font-size:12px}
  dialog .member-identity {padding-block:18px;gap:12px}
  .member-history-table td>* {min-width:0;overflow-wrap:anywhere}
  .member-detail-status {white-space:normal}
  #modal:not(:has(.course-settings-dialog,.member-detail)) {padding-inline:18px}
  #modal h2 {padding-right:32px;overflow-wrap:anywhere}
  #modal input:not([type=checkbox],[type=radio],[type=file]),#modal textarea,#modal select {font-size:16px}
  .form-pair,.settings-pair {grid-template-columns:minmax(0,1fr)}
  .cs-fields,.cs-fields>* {min-width:0}
  .cs-image-row {flex-wrap:wrap}
  .cs-image-row label {flex-basis:100%}
  .notice-toolbar,.notice-row {flex-wrap:wrap}
  .notice-option>span {min-width:0;overflow-wrap:anywhere}
  .notice-option select {max-width:55%}
  .account-color {gap:8px}
  .account-color button {min-height:44px}
  .header-right>button {min-width:44px;min-height:44px}
  header {padding-inline:12px;gap:6px}
}
@media (max-width:360px) {
  .ml-stat-controls {grid-template-columns:minmax(0,1fr)}
  .ml-slice-options {max-width:calc(100vw - 48px)}
  .ml-stats .ml-status-bar {grid-template-columns:116px minmax(0,1fr) 22px;gap:5px}
  .page-heading-action {font-size:11px}
}
@media (max-width:650px) and (max-height:600px) {
  .tk-heading-copy p,.tk-main>.tk-mock-note {display:none}
  body .tk-main>.tk-page-heading {padding-block:2px}
  .tk-main .tk-compose textarea {height:40px;min-height:40px}
}
@media (max-width:650px) {
  /* Card highlighting belongs to the whole row, including dark mode. */
  body .ml-panel .ml-member-row>td,body.account-dark .ml-panel .ml-member-row:hover>td{background:transparent}
  body .mgr-course select {font-size:16px;min-height:44px}
  .mgr-filters button{min-height:44px;min-width:44px}
  .current-article .library-info h3,.current-selection .library-info h3 {font-size:13px}
}
@media (max-width:650px) {
  .account-dark .feed-sort-switch {background:var(--wash);border:1px solid var(--line)}
  .account-dark .feed-sort-switch button[aria-pressed=true] {background:var(--nav-selected);color:var(--ink)}
  .actions button,.mobile-nav button {min-height:44px}
}

@media (max-width:650px) {
  .tk-main .tk-compose textarea:focus {height:80px}
}

/* Compact conversation header: back, channel and actions share one row. */
@media (max-width:800px) {
  body .tk-main>.tk-page-heading {display:grid;grid-template-columns:32px minmax(0,1fr) auto;grid-template-areas:"back title actions" "description description description";gap:2px 6px;padding:6px 0 8px;margin-bottom:6px}
  .tk-page-heading .tk-heading-copy {display:contents}
  .tk-page-heading .tk-heading-copy h2 {grid-area:title;gap:5px;font-size:14px;line-height:1.5}
  .tk-page-heading .tk-heading-copy p {grid-area:description;margin:0;font-size:11px;line-height:1.6}
  body .tk-page-heading .tk-header-back {grid-area:back;display:flex;align-items:center;justify-content:center;width:32px;height:32px;min-height:32px;padding:0;margin:0;color:var(--muted)}
  .tk-header-back>.icon {width:18px;height:18px}
  .tk-page-heading .page-heading-actions {grid-area:actions;gap:4px;margin:0}
  body .tk-page-heading .page-heading-action {min-height:32px;padding:4px;font-size:11px;gap:4px}
  .tk-search-popover>summary {width:32px;height:32px}
  .tk-search-popover>summary>.icon {width:16px;height:16px}
  body .content-icon-tools .content-sort>summary,body .ml-round {width:36px;height:36px;min-height:36px}
  body .content-icon-tools .content-sort>summary .icon,.ml-round .icon {width:16px;height:16px}
  body .tk-main .tk-icon-button,body .tk-thread .tk-icon-button,.tk-send {min-width:36px;min-height:36px;width:36px;height:36px}
  .tk-message-actions .tk-popover>summary {width:32px;height:32px;min-width:32px;min-height:32px}
}

/* Content and management use the same compact mobile title/back row. */
@media (max-width:800px) {
  body .page-heading:has(>.page-header-back) {display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:6px;min-height:46px;padding:6px 0 8px;margin:0 0 8px}
  body .page-heading>.page-header-back {display:flex;align-items:center;justify-content:center;width:32px;height:32px;min-height:32px;padding:0;margin:0;color:var(--muted)}
  .page-header-back>.icon {width:18px;height:18px}
  body .page-heading:has(>.page-header-back) h2 {font-size:14px;line-height:1.5;gap:6px}
  body .page-heading:has(>.page-header-back) .page-heading-actions {margin:0;gap:4px}
  body .page-heading:has(>.page-header-back) .page-heading-action {min-height:32px;padding:4px;font-size:11px}
  body .manage-content,body .manage-content>.mgr-panel,body .manage-content>.workspace-panel {border:0;border-radius:0;box-shadow:none;background:transparent}
}