/* Shared screen and account presentation; enabled only by the preview body class. */
.workspace-preview > .nav-bar, .workspace-preview > .mobile-menu,
.workspace-preview > .bottom-nav { display: none !important; }
.workspace-preview.workspace-modal-open { overflow: hidden; }
.workspace-preview .workspace-sidebar { z-index: 20; }
.workspace-page #workspaceMain { width: 100%; min-width: 0; padding-bottom: 2rem !important; }
.workspace-page #workspaceMain > .workspace-heading h1 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.25rem); line-height: 1.2; }
.workspace-page .workspace-heading .workspace-eyebrow { margin: 0 0 .65rem; }
.workspace-page .page-header { margin: 0 0 1.25rem; padding: 0; background: transparent; box-shadow: none; }
.workspace-page .page-header:has(> h1[hidden]):not(:has(button, .owner-badge, #userInfo)) { display: none; }
.workspace-page h2 { font-size: 1.3rem; line-height: 1.35; }
.workspace-page h3 { font-size: 1.1rem; line-height: 1.4; }
.workspace-page h4 { font-size: 1rem; }
.workspace-page p { max-width: 75ch; }
.workspace-page :is(.page-header, .course-header, .assignment-item, .search-bar) > div { min-width: 0; }
.workspace-page :is(.page-header, .course-header, .assignment-item, .search-bar) { gap: 1rem; }
.workspace-page :is(.course-card, .section-card, .stats-dashboard, .achievements-section, .mastery-section, .workspace-attempts) {
  min-width: 0; padding: 1.25rem; margin: 0 0 1.25rem; background: white;
  border: 1px solid var(--workspace-line); border-radius: 9px; box-shadow: none;
}
.workspace-page :is(.course-card, .section-card):hover { border-color: var(--workspace-line); box-shadow: none; }
.workspace-preview :is(.btn, .auth-tab, .auth-modal, .modal) { transform: none; box-shadow: none; }
.workspace-preview :is(.btn, .auth-tab):hover { transform: none; box-shadow: none; }
.workspace-preview :is(.modal, .auth-modal) .btn-primary,
.workspace-page #workspaceMain .btn-primary {
  background: var(--workspace-green) !important; color: white !important; border-color: var(--workspace-green) !important;
}
.workspace-preview :is(.modal, .auth-modal) .btn-primary:hover,
.workspace-page #workspaceMain .btn-primary:hover { background: #286344 !important; }
.workspace-preview :is(.modal, .auth-modal) .btn-danger,
.workspace-page #workspaceMain .btn-danger { color: #963726 !important; border-color: #d7b1a7 !important; background: #fff8f5 !important; }
.workspace-page :is(button, .btn) { white-space: normal; overflow-wrap: anywhere; max-width: 100%; }
.workspace-preview :is(.modal, .auth-modal) :is(input, select, textarea),
.workspace-page #workspaceMain :is(input:not([type="radio"]):not([type="checkbox"]), select, textarea) {
  box-sizing: border-box; min-width: 0; max-width: 100%; min-height: 44px; padding: .6rem .75rem;
  border: 1px solid #bccbbf; border-radius: 6px; background: white; color: var(--workspace-ink);
  font: inherit; box-shadow: none;
}
.workspace-preview :is(.modal, .auth-modal) input:is([type="checkbox"], [type="radio"]) { min-height: 18px; padding: 0; }
.workspace-page .workspace-field { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.workspace-page .workspace-field label { font-size: .8rem; font-weight: 600; color: var(--workspace-muted); }
.workspace-page :is(.empty-state, .login-prompt, .access-denied, .loading) {
  padding: 2rem 1.25rem; border: 1px solid var(--workspace-line); border-radius: 9px; background: white; color: var(--workspace-muted);
  text-align: left; overflow-wrap: anywhere; box-shadow: none;
}
.workspace-page :is(.owner-dashboard, .instructor-tools) {
  padding: 1rem 1.25rem; margin-bottom: 1.25rem; background: #eaf0e7; border: 1px solid var(--workspace-line); border-radius: 7px;
}
.workspace-page :is(.owner-dashboard, .instructor-tools) :is(h3, p) { color: var(--workspace-ink); }
.workspace-page .owner-dashboard h3 > span { display: none; }
.workspace-page :is(.owner-badge, .role-badge) { background: #e5ece3; color: var(--workspace-green); border: 1px solid #d1ddcc; box-shadow: none; }
.workspace-page .course-header { padding-bottom: 1rem; border-bottom: 1px solid var(--workspace-line); }
.workspace-page .course-header > div { width: 100%; }
.workspace-page .course-meta { margin-bottom: .75rem; color: var(--workspace-muted); }
.workspace-page .course-actions { gap: .5rem; }
.workspace-page .course-actions .btn { font-size: .85rem; flex: 0 1 auto; }
.workspace-page .join-code-display { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.workspace-page .join-code-display > span { letter-spacing: .12em; font-weight: 700; font-size: .95rem; }
.workspace-page .assignment-list h4 { margin: 0 0 .75rem; color: var(--workspace-muted); }
.workspace-page .assignment-item {
  align-items: flex-start; flex-wrap: wrap; padding: 1rem 0; margin: 0; border-bottom: 1px solid var(--workspace-line); border-radius: 0; background: white;
}
.workspace-page .assignment-item:last-child { border-bottom: 0; }
.workspace-page .assignment-item button:disabled { cursor: not-allowed; }
.workspace-page .assignment-item > div:first-child { flex: 1 1 16rem; }
.workspace-page .assignment-item > div:last-child { flex-wrap: wrap; gap: .5rem !important; }
.workspace-page .assignment-title { font-size: 1rem; color: var(--workspace-ink); }
.workspace-page .assignment-due { margin-top: .3rem; font-size: .85rem; color: var(--workspace-muted); }
.workspace-page .assignment-status { background: #edf1eb; color: #42594a; font-weight: 500; }
.workspace-page .status-pending_review, .workspace-page .status-late { background: #f7edce; color: #735413; }
.workspace-page .status-missing { background: #f2e9e3; color: #794936; }
.workspace-preview .workspace-table-scroll { width: 100%; max-width: 100%; overflow-x: auto; margin: 1rem 0; overscroll-behavior-x: contain; }
.workspace-preview .workspace-table-scroll table { width: 100%; min-width: 34rem; border-collapse: collapse; margin: 0; background: white; }
.workspace-preview .workspace-table-scroll :is(th, td) { padding: .75rem; text-align: left; border: 0; border-bottom: 1px solid var(--workspace-line); vertical-align: top; color: var(--workspace-ink); overflow-wrap: anywhere; }
.workspace-preview .workspace-table-scroll th { background: #f0f4ee; font-size: .8rem; font-weight: 600; }
.workspace-preview .workspace-table-scroll td { font-size: .9rem; }
.workspace-preview .workspace-table-scroll td input { min-width: 5rem; }
.workspace-preview .workspace-table-scroll td textarea { min-width: 12rem; }
.workspace-page .stats-top-row { gap: 1rem; flex-wrap: wrap; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--workspace-line); }
.workspace-page .level-section { min-width: 0; flex: 1 1 14rem; }
.workspace-page :is(.level-badge, .streak-section) { background: #edf3e9; color: var(--workspace-green); box-shadow: none; }
.workspace-page .level-badge { width: 3rem; height: 3rem; font-size: 1.3rem; border-radius: 8px; }
.workspace-page #levelTitle { color: var(--workspace-ink); font-size: 1.2rem; margin: 0; }
.workspace-page :is(#levelSubtitle, .xp-text, .avg-label, .avg-attempts) { color: var(--workspace-muted); }
.workspace-page .xp-bar { background: #e4ece0; }
.workspace-page .xp-fill { background: #49794f; }
.workspace-page .streak-section { padding: .65rem 1rem; border-radius: 7px; min-width: 0; }
.workspace-page .streak-flame { display: none; }
.workspace-page .streak-count { font-size: 1.6rem; color: var(--workspace-green); }
.workspace-page .stats-averages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.workspace-page .avg-item { min-width: 0; }
.workspace-page .avg-value { color: var(--workspace-green); }
.workspace-page .avg-ring .progress { stroke: #49794f; }
.workspace-page .filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(0, 2fr); gap: .75rem; padding: 1rem 0; margin: 0 0 1rem; background: transparent; box-shadow: none; }
.workspace-page .filters :is(input, select) { width: 100%; flex: auto; }
.workspace-page .history-status { padding: .75rem; margin: .75rem 0; background: #edf3e9; color: var(--workspace-muted); border: 1px solid var(--workspace-line); border-radius: 6px; overflow-wrap: anywhere; }
.workspace-page .date-group { box-shadow: none; background: white; border-radius: 0; margin: 0 0 1.5rem; }
.workspace-page .date-header { background: #f0f4ee; color: var(--workspace-ink); border: 0; border-radius: 5px; padding: .6rem .75rem; }
.workspace-page .attempt-card { display: block; margin: 0 0 .75rem; }
.workspace-page .attempt-row { width: 100%; border: 1px solid var(--workspace-line) !important; border-radius: 8px; padding: .9rem 1rem; margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem; text-align: left; background: white; cursor: pointer; list-style: none; }
.workspace-page .attempt-row::-webkit-details-marker { display: none; }
.workspace-page .attempt-row::marker { content: ''; }
.workspace-page .attempt-row:hover { transform: none; border-color: #91a993 !important; box-shadow: none; }
.workspace-page .attempt-card[open] .attempt-row { border-color: #91a993 !important; border-bottom-color: var(--workspace-line) !important; border-radius: 8px 8px 0 0; background: #fbfdf9; }
.workspace-page .attempt-summary-main { min-width: 0; flex: 1 1 15rem; }
.workspace-page .attempt-desc { display: block; min-width: 0; white-space: normal; overflow-wrap: anywhere; color: var(--workspace-ink); font-weight: 700; line-height: 1.35; }
.workspace-page .attempt-meta { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem .6rem; margin-top: .4rem; color: var(--workspace-muted); font-size: .78rem; }
.workspace-page .attempt-time { min-width: auto; color: var(--workspace-muted); }
.workspace-page .attempt-crop { color: var(--workspace-muted); }
.workspace-page .mode-badge { padding: .2rem .5rem; border-radius: 999px; font-size: .72rem; font-weight: 600; }
.workspace-page .attempt-summary-status { display: flex; align-items: center; justify-content: flex-end; flex: 0 0 auto; flex-wrap: wrap; gap: .35rem .5rem; max-width: 15rem; }
.workspace-page .attempt-outcome, .workspace-page .score { border-radius: 999px; padding: .25rem .5rem; font-size: .74rem; font-weight: 700; line-height: 1.2; min-width: 0; text-align: center; }
.workspace-page .attempt-outcome.pass, .workspace-page .score.pass { color: #286344; background: #e5f0e4; }
.workspace-page .attempt-outcome.retry, .workspace-page .score.retry { color: #874334; background: #f9ebe6; }
.workspace-page .attempt-outcome.pending { color: #735413; background: #f7edce; }
.workspace-page .attempt-outcome.feedback { color: #315e71; background: #e3eff3; }
.workspace-page .attempt-disclosure { width: .55rem; height: .55rem; border-right: 1.5px solid var(--workspace-muted); border-bottom: 1.5px solid var(--workspace-muted); transform: rotate(45deg); margin: -.25rem .15rem .25rem .1rem; }
.workspace-page .attempt-card[open] .attempt-disclosure { transform: rotate(225deg); margin: .25rem .15rem -.25rem .1rem; }
.workspace-page .attempt-details { display: none; background: #f5f7f3; border: 1px solid #91a993; border-top: 0; border-radius: 0 0 8px 8px; padding: 1rem; margin: 0; overflow-wrap: anywhere; }
.workspace-page .attempt-card[open] .attempt-details { display: block; }
.workspace-page .history-detail-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; padding-bottom: .8rem; margin-bottom: .9rem; border-bottom: 1px solid var(--workspace-line); }
.workspace-page .history-detail-heading > div > span { display: block; color: var(--workspace-muted); font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.workspace-page .history-detail-heading h4 { margin: .2rem 0 0; color: var(--workspace-ink); font-size: 1rem; }
.workspace-page .history-detail-heading > span { flex: 0 0 auto; padding: .25rem .5rem; border-radius: 999px; background: #e5ece3; color: var(--workspace-green); font-size: .7rem; font-weight: 700; }
.workspace-page .detail-section { margin: 0 0 1rem; }
.workspace-page .detail-section h4 { margin: 0 0 .45rem; color: var(--workspace-ink); font-size: .86rem; }
.workspace-page .slider-snapshot { gap: .5rem; }
.workspace-page .slider-item { display: flex; flex-direction: column; gap: .2rem; padding: .65rem .7rem; background: white; border: 1px solid #dce7da; border-radius: 6px; color: var(--workspace-muted); font-size: .78rem; }
.workspace-page .slider-item strong { color: var(--workspace-ink); font-size: .92rem; }
.workspace-page .history-answer-review { display: grid; gap: .7rem; padding: 0; margin: 0; list-style: none; }
.workspace-page .history-answer-card { padding: .8rem; border: 1px solid #dce7da; border-radius: 7px; background: white; }
.workspace-page .history-answer-card-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.workspace-page .history-answer-card h5 { margin: 0; color: var(--workspace-ink); font-size: .85rem; }
.workspace-page .history-answer-state { flex: 0 0 auto; padding: .22rem .48rem; border-radius: 999px; font-size: .7rem; font-weight: 700; }
.workspace-page .history-answer-state.correct { color: #286344; background: #e5f0e4; }
.workspace-page .history-answer-state.review { color: #874334; background: #f9ebe6; }
.workspace-page .history-answer-question { margin: .5rem 0 .7rem; color: var(--workspace-ink); font-size: .88rem; font-weight: 600; line-height: 1.45; }
.workspace-page .history-answer-values { display: grid; gap: .5rem; margin: 0; }
.workspace-page .history-answer-values > div { padding: .6rem .65rem; border-radius: 5px; background: #f5f7f3; }
.workspace-page .history-answer-values dt { color: var(--workspace-muted); font-size: .72rem; font-weight: 700; }
.workspace-page .history-answer-values dd { margin: .2rem 0 0; color: var(--workspace-ink); font-size: .86rem; overflow-wrap: anywhere; }
.workspace-page .history-feedback { border-left: 2px solid #9db9a1; padding-left: .75rem; }
.workspace-page .history-feedback p { margin: 0; color: var(--workspace-muted); font-size: .9rem; line-height: 1.5; }
.workspace-page .history-unavailable { margin: 0 0 1rem; padding: .75rem; border-left: 2px solid #c9d4c9; color: var(--workspace-muted); font-size: .82rem; }
.workspace-page .history-unavailable strong { color: var(--workspace-ink); font-size: .84rem; }
.workspace-page .history-unavailable p { margin: .25rem 0 0; line-height: 1.45; }
.workspace-page .retry-btn { width: auto; border-radius: 6px; background: var(--workspace-green); box-shadow: none; }
.workspace-page :is(.details-grid, .detail-grid) { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.workspace-page .mastery-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr)); gap: .75rem; }
.workspace-page .mastery-scope { display: flex; flex-wrap: wrap; gap: .75rem; }
.workspace-page .mastery-scope label { display: flex; align-items: center; gap: .5rem; min-height: 44px; }
.workspace-page .mastery-item { min-width: 0; overflow-wrap: anywhere; border: 1px solid var(--workspace-line); border-radius: 7px; box-shadow: none; }
.workspace-page .mastery-unattempted { font-size: .95rem; line-height: 1.35; }
.workspace-page .mastery-label { font-size: .85rem; }
.workspace-page .achievements-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 7rem), 1fr)); }
.workspace-page .achievement-badge { border-radius: 7px; box-shadow: none; }
.workspace-page .admin-tabs { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0 0 1.25rem; margin-bottom: 1.25rem; border-bottom: 1px solid var(--workspace-line); background: transparent; box-shadow: none; }
.workspace-page .admin-tab { flex: 0 1 auto; }
.workspace-page .admin-tab-icon { display: none; }
.workspace-preview :is(.admin-tab.active, .user-tab.active, .auth-tab.active) { background: #e5ece3 !important; color: var(--workspace-green) !important; border-color: #829d87 !important; }
.workspace-page .stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: 1rem; }
.workspace-page .stat-card { padding: 1.25rem; border: 1px solid var(--workspace-line); border-radius: 9px; background: white; box-shadow: none; text-align: left; }
.workspace-page .stat-number { color: var(--workspace-green); font-size: 2rem; }
.workspace-page .stat-label { color: var(--workspace-muted); }
.workspace-page .search-bar { display: flex; align-items: flex-end; flex-wrap: wrap; }
.workspace-page .search-bar .workspace-field { flex: 1 1 14rem; }
.workspace-page .search-bar input { width: 100%; }
.workspace-page #analyticsMap { max-width: 100%; border: 1px solid var(--workspace-line); border-radius: 7px; }
.workspace-page :is(.course-card, .section-card, .stat-card, .user-modal-header, .user-tab-panel, .login-prompt, .access-denied) { overflow-wrap: anywhere; }
.workspace-preview :is(.modal-overlay, .auth-modal-overlay) { position: fixed; inset: 0; padding: 1rem; background: #14271ec2; z-index: 3000; overflow-y: auto; }
.workspace-preview :is(.modal, .auth-modal) {
  box-sizing: border-box; width: min(100%, 32rem); max-width: 100%; max-height: calc(100dvh - 2rem) !important;
  padding: 1.5rem; margin: auto; border: 1px solid var(--workspace-line); border-radius: 10px; background: white;
  color: var(--workspace-ink); overflow-y: auto; overscroll-behavior: contain; animation: none;
}
.workspace-preview #simpleModal > .modal, .workspace-preview #gradebookModal > .modal { width: min(100%, 68rem); max-width: 100% !important; }
.workspace-preview #editUserModal > .modal { width: min(100%, 60rem); }
.workspace-preview :is(.modal, .auth-modal) h2 { font-size: 1.35rem; line-height: 1.3; margin: 0 0 1rem; }
.workspace-preview :is(.modal, .auth-modal) p { overflow-wrap: anywhere; }
.workspace-preview .auth-modal-header { align-items: flex-start; gap: 1rem; border-bottom: 1px solid var(--workspace-line); padding-bottom: .75rem; }
.workspace-preview .auth-modal-close { flex-shrink: 0; width: 44px; height: 44px; padding: 0; }
.workspace-preview .auth-tabs { gap: .5rem; border: 0; }
.workspace-preview .auth-tab { border-radius: 6px; }
.workspace-preview .auth-form { padding: 1rem 0 0; }
.workspace-preview .auth-form .form-group label { color: var(--workspace-ink); }
.workspace-preview .auth-form :is(input, select, textarea) { width: 100%; }
.workspace-preview .auth-form #profileDisplayName { font-size: 1rem; }
.workspace-preview .profile-email-row { padding: .75rem; border-radius: 6px; background: #f0f4ee; font-size: .9rem; }
.workspace-preview :is(.modal-buttons, .user-modal-actions) { display: flex; flex-wrap: wrap; gap: .6rem; }
.workspace-preview :is(.modal, .auth-modal) :is(.btn, button) { white-space: normal; max-width: 100%; }
.workspace-preview .user-modal-header { background: #f0f4ee; border-bottom: 1px solid var(--workspace-line); }
.workspace-preview .user-modal-tabs { flex-wrap: wrap; }
.workspace-preview .user-modal-title { min-width: 0; }
.workspace-preview .user-modal-body { padding: 1rem 0; }
.workspace-preview .user-progress-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); }
.workspace-preview .user-progress-card { box-shadow: none; background: #f0f4ee; }
.workspace-preview .workspace-navigation [aria-disabled="true"] { opacity: .6; }
@media (max-width: 599px) {
  .workspace-page :is(.course-card, .section-card, .stats-dashboard, .achievements-section, .mastery-section, .workspace-attempts) { padding: 1rem; }
  .workspace-page .stats-averages { grid-template-columns: repeat(auto-fit, minmax(min(100%, 5rem), 1fr)); gap: .5rem; }
  .workspace-page .avg-item { display: block; text-align: center; }
  .workspace-page .avg-ring { margin: 0 auto .5rem; }
  .workspace-page .avg-label { align-self: end; }
  .workspace-page .filters { grid-template-columns: 1fr; }
  .workspace-page .assignment-item > div { width: 100%; }
  .workspace-page .assignment-item > div:last-child { justify-content: flex-start; }
  .workspace-page .admin-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; width: 100%; margin-inline: 0; }
  .workspace-page .admin-tab { width: 100%; min-width: 0; min-height: 48px; padding: .65rem .5rem; text-align: center; line-height: 1.25; }
  .workspace-preview #editUserModal { align-items: flex-end; padding: .5rem; }
  .workspace-preview #editUserModal > .user-modal { width: 100%; max-height: calc(100dvh - .5rem) !important; padding: 0; border-radius: 10px 10px 0 0; }
  .workspace-preview #editUserModal .user-modal-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); flex: 0 0 auto; overflow: visible; }
  .workspace-preview #editUserModal .user-modal-tab { width: 100%; min-width: 0; min-height: 44px; padding: .65rem .5rem; line-height: 1.2; }
  .workspace-preview #editUserModal .user-modal-body { flex: 1 1 auto; min-height: 0; padding: 1rem; overflow-y: auto; }
  .workspace-preview :is(.modal, .auth-modal) { padding: 1rem; }
  .workspace-preview .user-modal-header { flex-wrap: wrap; }
  .workspace-preview .user-modal-header > div { min-width: 0; }
}

.workspace-page .achievements-header { flex-wrap: wrap; gap: .75rem; }
.workspace-page .achievements-header h3 { min-width: 0; overflow-wrap: anywhere; }
.workspace-preview .workspace-load-state { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin: .75rem 0; padding: .75rem 1rem; border: 1px solid var(--workspace-line); border-radius: 7px; background: #edf3e9; color: var(--workspace-muted); }
.workspace-preview .user-modal-tab[aria-selected="true"] { background: #e5ece3 !important; border-color: #829d87 !important; }

.workspace-page .date-group-header { border: 0; border-radius: 5px; padding: .6rem .75rem; background: #f0f4ee; color: var(--workspace-ink); font-size: .85rem; margin-bottom: .5rem; }
.workspace-page .join-code-display { padding: .6rem .75rem; background: #f0f4ee; border: 1px solid var(--workspace-line); border-radius: 6px; }

.workspace-preview .auth-form > .btn-full { margin-block: .3rem; }
@media (max-width: 599px) {
  .workspace-page .level-section { flex: 1 1 auto; width: 100%; }
  .workspace-page .attempt-row { align-items: start; grid-template-columns: minmax(0, 1fr) auto; gap: .7rem; padding: .9rem; }
  .workspace-page .attempt-summary-main { grid-column: 1 / -1; width: 100%; }
  .workspace-page .attempt-summary-status { grid-column: 1 / -1; justify-content: flex-start; max-width: none; width: 100%; }
  .workspace-page .attempt-disclosure { margin-left: .3rem; }
  .workspace-page .attempt-details { padding: .9rem; }
  .workspace-page .history-detail-heading { display: block; }
  .workspace-page .history-detail-heading > span { display: inline-block; margin-top: .55rem; }
  .workspace-page .slider-snapshot { grid-template-columns: 1fr; }
  .workspace-page .retry-btn { width: 100%; }
}

.workspace-preview .auth-divider { gap: .75rem; }
.workspace-preview .auth-divider::before, .workspace-preview .auth-divider::after { position: static; width: auto; background: var(--workspace-line); }
.workspace-preview .auth-divider span { padding: 0; color: var(--workspace-muted); }

.workspace-page .admin-user-activity { font-size: .8rem; overflow-wrap: anywhere; }


/* The Users list responds to its panel width, including sidebar and text scaling. */
.workspace-page #usersContainer { container: admin-users / inline-size; }
.workspace-page #tab-users :is(th, td) { overflow-wrap: normal; word-break: normal; }
.workspace-page #tab-users :is(.admin-user-email, .admin-user-name) { overflow-wrap: anywhere; }
.workspace-page #tab-users :is(.role-badge, .open-user-button) { white-space: nowrap; overflow-wrap: normal; }
.workspace-page #tab-users :is(.admin-user-role, .admin-user-action) { width: 1%; }
.workspace-page #tab-users .admin-user-activity > span { display: block; }
.workspace-page #tab-users .admin-user-activity > br { display: none; }
.workspace-page[data-workspace-page="admin"] .admin-tab { word-break: normal; overflow-wrap: normal; }
.workspace-page[data-workspace-page="admin"] :is(#tab-deletions, #tab-analytics) .workspace-table-scroll table { min-width: 48rem; }
.workspace-page[data-workspace-page="admin"] :is(#tab-deletions, #tab-analytics) .workspace-table-scroll :is(th, td) { overflow-wrap: normal; }
@container admin-users (width < 60rem) {
  .workspace-page #tab-users .workspace-table-scroll { overflow: visible; margin: 0; }
  .workspace-page #tab-users .user-table,
  .workspace-page #tab-users .user-table tbody { display: block; width: 100%; min-width: 0; }
  .workspace-page #tab-users .user-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .workspace-page #tab-users .admin-user-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .45rem .75rem; padding: .9rem 0; border-bottom: 1px solid var(--workspace-line); }
  .workspace-page #tab-users .admin-user-row td { display: block; min-width: 0; padding: 0; border: 0; }
  .workspace-page #tab-users .admin-user-name { grid-row: 1; grid-column: 1 / -1; font-weight: 700; color: var(--workspace-ink); }
  .workspace-page #tab-users .admin-user-email { grid-row: 2; grid-column: 1 / -1; color: var(--workspace-muted); font-size: .85rem; overflow-wrap: anywhere; }
  .workspace-page #tab-users .admin-user-role { align-self: center; }
  .workspace-page #tab-users .admin-user-action { justify-self: end; }
  .workspace-page #tab-users .admin-user-action .btn { min-height: 44px; padding: .5rem .7rem !important; }
  .workspace-page #tab-users .admin-user-empty { display: block; padding: 1rem 0; }
  .workspace-page #tab-users .admin-user-empty td { display: block; padding: 0; border: 0; }
  .workspace-page #tab-users .admin-user-activity { grid-row: 3; grid-column: 1 / -1; overflow-wrap: normal; }
  .workspace-page #tab-users :is(.admin-user-role, .admin-user-action) { grid-row: 4; width: auto; }
}

/* Keep the role and action separate when enlarged text cannot fit side by side. */
@container admin-users (width < 14rem) {
  .workspace-page #tab-users .admin-user-role { grid-column: 1 / -1; }
  .workspace-page #tab-users .admin-user-action { grid-row: 5; grid-column: 1 / -1; justify-self: start; }
}