/* Full student and group pages, with their regular forms, above the workspace. */
.student-preview { width: calc(100% - 48px); max-width: calc(980px + 48px + 2px); height: calc(100dvh - 48px); max-height: none; overflow: hidden; }
.student-preview-bar { padding: 12px 18px; border-bottom: 1px solid var(--line); }
.student-preview-bar .eyebrow { flex: 1; }
.student-preview-tools { display: flex; align-items: center; gap: 8px; }
.student-preview-tools [hidden] { display: none; }
.student-preview-body { position: relative; display: flex; flex: 1; padding: 0; overflow: hidden; }
.student-card-frame { display: block; width: 100%; height: 100%; border: 0; background: var(--bg); }
.student-card-loading { position: absolute; inset: 0; display: grid; place-items: center; background: var(--panel); color: var(--muted); }
.student-card-loading[hidden], .student-card-confirm[hidden] { display: none; }
.student-card-confirm { padding: 14px 18px; border-top: 1px solid var(--line); background: var(--soft); }
.student-card-confirm p { margin: 0 0 10px; }
.student-card-confirm .actions { display: flex; flex-wrap: wrap; gap: 8px; }
html[data-student-overlay] { scrollbar-gutter: auto; }
html[data-student-overlay] .sidebar, html[data-student-overlay] .tabstrip { display: none; }
html[data-student-overlay] .app { display: block; width: 100%; min-height: 100dvh; margin: 0; border: 0; border-radius: 0; background: var(--bg); }
html[data-student-overlay] .page { width: 100%; min-width: 0; padding: 24px; }
html[data-student-overlay] .workspace-content { max-width: var(--workspace-width); }
html[data-student-overlay] body:is([data-page="student_detail"], [data-page="group_detail"]) .workspace-content > .back { display: none; }
@media (max-width: 600px) {
  .student-preview { width: calc(100% - 12px); height: calc(100dvh - 12px); border-radius: 12px; }
  .student-preview-bar { padding: 10px; flex-wrap: wrap; gap: 8px; }
  .student-preview-bar .eyebrow { font-size: 10px; }
  .student-preview-tools { gap: 6px; }
  .student-preview-tools .button { font-size: 11px; padding: 7px; }
  html[data-student-overlay] .page { padding: 16px 12px; }
}