/* Shared type scale. 14–32 CSS px at the default 16px root; browser zoom remains available. */
@font-face {
  font-family: 'Pretendard';
  src: url('/fonts/PretendardVariable-v1.3.9.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --font-family-ui: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --font-size-xs: .875rem;
  --font-size-sm: 1rem;
  --font-size-md: 1.125rem;
  --font-size-reading: 1.25rem;
  --font-size-lg: 1.5rem;
  --font-size-xl: 2rem;
  --text-title: clamp(1.5rem, 1.1rem + 1.1vw, 2rem);
  --touch-size: 2.75rem;
  --muted: #56655b;
  font-family: var(--font-family-ui);
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-block: 1rem;
}
body, .handoff-dashboard {
  font-family: var(--font-family-ui);
  font-size: var(--font-size-sm);
  font-weight: 400;
  line-height: 1.65;
  --muted: #56655b;
}
button, input, select, textarea, optgroup { font-family: inherit; }
button, select, input, textarea { font-size: var(--font-size-sm); }
button, [role=button], summary { touch-action: manipulation; }
button, select, input:not([type=checkbox]):not([type=radio]), [role=button] {
  min-height: var(--touch-size);
  max-width: 100%;
}
button, [role=button] { min-width: var(--touch-size); }
summary { min-height: var(--touch-size); padding-block: .625rem; line-height: 1.6; cursor: pointer; }
input[type=checkbox], input[type=radio] { width: 1.375rem; height: 1.375rem; flex-shrink: 0; }
button { font-weight: 600; white-space: normal; overflow-wrap: anywhere; }
textarea { resize: vertical; }
h1, h2, h3 { word-break: keep-all; overflow-wrap: anywhere; }
h1, .page-heading h1, .handoff-dashboard h1, .login-brand h1, .history-page-heading h1 {
  font-size: var(--text-title);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -.025em;
}
h2, .panel h2, .handoff-dashboard h2, .login-form h2 { font-size: var(--font-size-reading); line-height: 1.5; font-weight: 700; }
h3, .handoff-dashboard h3 { font-size: var(--font-size-md); line-height: 1.5; font-weight: 600; }
small, .small, .muted, .eyebrow, .secondary-line { color: var(--muted); }
small, .small { font-size: var(--font-size-xs); line-height: 1.6; }
.sr-only { font-size: var(--font-size-sm); }
:focus-visible { scroll-margin-block: 1rem; }
[hidden], #workspace[hidden] { display: none !important; }

/* Students read and compose at the same size on phone, tablet and desktop. */
.student-app { font-size: var(--font-size-md); }
.student-app main { padding-block: 1rem 2rem; }
.student-app .student-header { min-height: 4rem; height: auto; padding-block: .5rem; }
.student-app .student-header nav { flex-wrap: wrap; justify-content: flex-end; gap: .75rem; }
.student-app .student-header nav button { padding-inline: .75rem; font-size: var(--font-size-xs); }
.student-app .student-date, .student-app .student-identity { font-size: var(--font-size-xs); }
.student-app .page-heading { margin-bottom: 1.5rem; gap: 1rem; }
.student-app .student-progress-tools { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; flex: 0 0 auto; max-width: 100%; }
.student-app .intro-copy { font-size: var(--font-size-sm); line-height: 1.75; }
.student-app .steps { max-width: none; gap: .5rem; }
.student-app .steps li { display: flex; align-items: center; }
.student-app .steps button { padding: .5rem; font-size: var(--font-size-xs); min-height: var(--touch-size); }
.student-app .steps b { margin-right: .375rem; }
.student-app .save-strip { min-height: 2rem; align-items: center; gap: .5rem; flex-wrap: wrap; }
.student-app .save-strip, .student-app .editor-status, .student-app .column-note { font-size: var(--font-size-xs); }
.student-app .paper-heading { min-height: 3.5rem; flex-wrap: wrap; padding: .875rem 1.5rem; }
.student-app .paper-heading h2, .student-app .paper-heading h3 { font-size: var(--font-size-md); }
.student-app .paper-heading > span, .student-app .paper-heading strong { font-size: var(--font-size-xs); }
.student-app .main-task { font-size: var(--font-size-md); line-height: 1.85; max-width: 72ch; }
.student-app .main-task details { font-size: var(--font-size-sm); }
.student-app .word-meaning { padding-inline: 1.5rem; font-size: var(--font-size-sm); }
.student-app .word-meaning p { font-size: var(--font-size-md); line-height: 1.8; }
.student-app .word-meaning summary { padding-inline: .25rem; }
.student-app .word-meaning small { margin-bottom: .75rem; }
.student-app .writing-panel textarea,
.student-app .editor-annotations,
.student-app .original-text,
.student-app .history-edit-text {
  font-family: var(--font-family-ui);
  font-size: var(--font-size-reading);
  font-weight: 400;
  line-height: 1.9;
  letter-spacing: .01em;
  padding: 1.5rem;
  tab-size: 4;
  overflow-wrap: break-word;
}
.student-app .writing-panel textarea { min-height: clamp(17rem, 38svh, 28rem); }
.student-app .writing-panel.prep textarea { min-height: clamp(15rem, 30svh, 22rem); }
.student-app .editor-area { scroll-margin-block: 1rem; }
.student-app .reading-text, .student-app .submitted-text, .student-app .history-text {
  font-family: var(--font-family-ui);
  font-size: var(--font-size-reading);
  font-weight: 400;
  line-height: 1.9;
  word-break: normal;
  overflow-wrap: anywhere;
}
.student-app .reading-text { max-width: 40em; margin-inline: auto; }
.student-app .reading-text p { margin-bottom: 1.4em; }
.student-app .reading-text p:first-child { font-size: var(--text-title); line-height: 1.45; margin-bottom: 1em; }
.student-app .self-check { min-height: var(--touch-size); align-items: flex-start; gap: .75rem; font-size: var(--font-size-sm); line-height: 1.7; }
.student-app .self-check input { margin-top: .125rem; }
.student-app #writing-controls { padding: 1rem 1.5rem; }
.student-app .actions { gap: .75rem; }
.student-app .actions button, .student-app .reading-buttons button { padding: .625rem 1rem; font-size: var(--font-size-sm); }
.student-app .actions .muted { font-size: var(--font-size-xs); }
.student-app .reading-buttons { flex-wrap: wrap; gap: .75rem; }
.student-app .workspace-grid, .student-app .workspace-grid.with-support {
  grid-template-columns: minmax(0, 1fr) minmax(20rem, 22rem);
  gap: 1.5rem;
}
.student-app .support-area { min-width: 0; top: 1rem; }
.student-app .tool-switcher { gap: .375rem; flex-wrap: wrap; }
.student-app .tool-switcher button { min-height: var(--touch-size); white-space: normal; padding: .625rem .375rem; font-size: var(--font-size-xs); }
.student-app .support-header { min-height: 3.5rem; gap: .5rem; padding: .75rem 1rem; }
.student-app .support-header h2 { font-size: var(--font-size-sm); }
.student-app .support-header button { padding-inline: .5rem; font-size: var(--font-size-xs); }
.student-app .support-content { padding: 1rem; }
.student-app .support-content p, .student-app .support-content label,
.student-app .support-content input, .student-app .support-content textarea,
.student-app .resource-card blockquote, .student-app .help-facts blockquote {
  font-size: var(--font-size-sm); line-height: 1.8;
}
.student-app .coach-message small, .student-app .student-question small { font-size: var(--font-size-xs); }
.student-app .coach-message p { padding: .75rem; }
.student-app .coach-message > img { width: 2rem; height: 2rem; }
.student-app .coach-composer { padding: .75rem; }
.student-app .composer-bottom { gap: .5rem; flex-wrap: wrap; }
.student-app .composer-bottom button { font-size: var(--font-size-xs); }
.student-app .composer-bottom small { font-size: var(--font-size-xs); }
.student-app .help-suggestions button, .student-app .help-feedback button, .student-app .help-choices button { padding: .625rem .75rem; font-size: var(--font-size-xs); }
.student-app .help-choices button { font-size: var(--font-size-sm); }
.student-app .coach-return { gap: .5rem; padding: 0 1rem 1rem; }
.student-app .coach-return button { font-size: var(--font-size-xs); padding: .625rem .375rem; }
.student-app .coach-panel { max-height: calc(100dvh - 6rem); }
.student-app .resource-original, .student-app .help-facts details { font-size: var(--font-size-sm); line-height: 1.8; }
.student-app .toolbar { flex-wrap: wrap; gap: .5rem; }
.student-app .toolbar button { font-size: var(--font-size-xs); padding: .625rem .75rem; }
.student-app .reading-body { padding: 1.5rem 2rem; }
.student-app .tablet-help-link { display: none; }
.student-app .history-page-heading { flex-wrap: wrap; }
.student-app .history-page-heading button { font-size: var(--font-size-sm); }
.student-app .history-table th, .student-app .history-table td { font-size: var(--font-size-xs); }
.student-app .history-feedback article { font-size: var(--font-size-sm); }
.student-app dialog { max-height: calc(100dvh - 2rem); }
.student-app #reading-dialog #reading-dialog-content { max-height: 65dvh; }
.student-app dialog > header { gap: .75rem; flex-wrap: wrap; }

/* Shared teacher and operations typography, including legacy forms and dialogs. */
.admin-app .handoff-layout { grid-template-columns: 13rem minmax(0,1fr); }
.admin-app .handoff-topbar { height: auto; min-height: 4.5rem; padding-block: .5rem; flex-wrap: wrap; }
.admin-app .handoff-top-actions { flex-wrap: wrap; justify-content: flex-end; gap: .75rem; }
.admin-app .handoff-top-actions a { display: inline-flex; align-items: center; min-height: var(--touch-size); font-size: var(--font-size-xs); }
.admin-app #sidebar-wrapper .nav-label, .admin-app #sidebar-wrapper .sidebar-bottom,
.admin-app #advanced-navigation, .admin-app #advanced-navigation summary,
.admin-app #sidebar-wrapper .text-button { font-size: var(--font-size-xs); color: var(--muted); }
.admin-app #sidebar-wrapper nav a, .admin-app #advanced-navigation nav a { min-height: var(--touch-size); font-size: var(--font-size-sm); }
.admin-app .account-menu summary { min-width: var(--touch-size); }
.admin-app #advanced-navigation { margin-top: 1rem; }
.admin-app .page-heading { gap: 1rem; flex-wrap: wrap; }
.admin-app .login-brand h1 { max-width: 14em; }
.admin-app .login-form label, .admin-app label { font-size: var(--font-size-sm); }
.admin-app .handoff-dashboard .btn, .admin-app .handoff-dashboard .text-link,
.admin-app .handoff-dashboard .row-open { min-height: var(--touch-size); min-width: var(--touch-size); font-size: var(--font-size-xs); display: inline-flex; align-items: center; justify-content: center; }
.admin-app .handoff-dashboard .btn { padding: .625rem .875rem; }
.admin-app .handoff-dashboard .hero { align-items: flex-start; gap: 1rem; }
.admin-app .handoff-dashboard .hero-actions { flex-wrap: wrap; gap: .75rem; }
.admin-app .handoff-dashboard .hero-actions label { margin: 0; }
.admin-app .handoff-dashboard .hero-actions select { max-width: 16rem; font-size: var(--font-size-sm); }
.admin-app .handoff-dashboard .stats { gap: 1rem; }
.admin-app .handoff-dashboard .stat { padding: 1.25rem; gap: 1rem; }
.admin-app .handoff-dashboard .stat strong { font-size: var(--font-size-xl); font-weight: 700; }
.admin-app .handoff-dashboard .panel-head { padding: 1.25rem; }
.admin-app .handoff-dashboard .panel-head h2, .admin-app .handoff-dashboard .task-summary h2 { font-size: var(--font-size-reading); }
.admin-app .handoff-dashboard .filter-tabs button { min-height: var(--touch-size); font-size: var(--font-size-xs); padding: .5rem .75rem; }
.admin-app .handoff-dashboard .filters { flex-wrap: wrap; gap: .75rem; padding: 0 1.25rem 1rem; }
.admin-app .handoff-dashboard .search { width: min(100%, 15rem); font-size: var(--font-size-sm); }
.admin-app .handoff-dashboard .roster th, .admin-app .handoff-dashboard .roster td { font-size: var(--font-size-xs); line-height: 1.7; padding: 1rem; }
.admin-app .handoff-dashboard .student-cell strong { font-size: var(--font-size-sm); }
.admin-app .handoff-dashboard .student-cell small, .admin-app .handoff-dashboard .tag,
.admin-app .handoff-dashboard .secondary-line { font-size: var(--font-size-xs); line-height: 1.6; }
.admin-app .handoff-dashboard .tag { white-space: normal; }
.admin-app .handoff-dashboard .queue-item { min-height: var(--touch-size); gap: .625rem; padding: 1rem .25rem; }
.admin-app .handoff-dashboard .queue-item strong, .admin-app .handoff-dashboard .queue-item p { font-size: var(--font-size-xs); line-height: 1.7; }
.admin-app .handoff-dashboard .section-tabs, .admin-app .handoff-dashboard .detail-tabs { gap: .75rem; flex-wrap: wrap; }
.admin-app .handoff-dashboard .section-tabs a, .admin-app .handoff-dashboard .detail-tabs button { min-height: var(--touch-size); padding: .625rem .25rem; font-size: var(--font-size-sm); }
.admin-app .handoff-dashboard .message, .admin-app .handoff-dashboard .task-source,
.admin-app .handoff-dashboard .paper, .admin-app .handoff-dashboard .note-card p,
.admin-app .handoff-dashboard .field, .admin-app .handoff-dashboard .meta-dl { font-size: var(--font-size-sm); line-height: 1.8; }
.admin-app .handoff-dashboard .compare-grid .paper { font-size: var(--font-size-sm); }
.admin-app .handoff-dashboard .field textarea, .admin-app .handoff-dashboard .field select { font-size: var(--font-size-sm); }
.admin-app .handoff-dashboard .dialog-head { gap: 1rem; flex-wrap: wrap; }
.admin-app .handoff-dashboard .close-button { width: var(--touch-size); height: var(--touch-size); font-size: var(--font-size-lg); }
.admin-app .handoff-dashboard .form-body { padding: 1.25rem; }
.admin-app .handoff-dashboard .task-summary { flex-wrap: wrap; }
.admin-app .handoff-dashboard .field-row { gap: 1rem; }
.admin-app #teacher-detail { max-height: calc(100dvh - 2rem); }
.admin-app .account-menu button { font-size: var(--font-size-xs); }

@media (max-width: 74.9375rem) {
  .student-app .page-heading { flex-direction: column; }
  .student-app .steps { justify-content: flex-start; margin: 0; }
  .student-app .workspace-grid, .student-app .workspace-grid.with-support { grid-template-columns: minmax(0,1fr) 20rem; gap: 1rem; }
  .admin-app .handoff-dashboard .board-grid { grid-template-columns: 1fr; }
}
@media (max-width: 63.9375rem) {
  .student-app .workspace-grid, .student-app .workspace-grid.with-support { display: flex; flex-direction: column; gap: 1.25rem; }
  .student-app .workspace-grid > div, .student-app .workspace-grid > section, .student-app .support-area { width: 100%; }
  .student-app .support-area { position: static; order: 0; scroll-margin-top: 1rem; }
  .student-app .coach-panel { max-height: none; }
  .student-app .coach-conversation { max-height: none; overflow: visible; }
  .student-app .tablet-help-link { display: inline-flex; align-items: center; padding: .625rem .875rem; font-size: var(--font-size-sm); }
  .student-app .editor-comparison.comparing { grid-template-columns: 1fr; }
  .student-app .reading-reference .reading-text { max-height: none; }
  .admin-app .handoff-layout { display: block; }
  .admin-app #sidebar-wrapper { width: 100%; min-width: 0; height: auto; min-height: 0; flex-direction: row; flex-wrap: wrap; gap: .5rem; padding: .5rem 1rem; border-right: 0; border-bottom: 1px solid #e0e8df; }
  .admin-app #sidebar-wrapper > .nav-label, .admin-app #sidebar-wrapper .sidebar-bottom { display: none; }
  .admin-app #sidebar-wrapper > nav { display: flex; flex-wrap: wrap; gap: .5rem; }
  .admin-app #sidebar-wrapper > nav a { white-space: nowrap; margin-bottom: 0; }
  .admin-app #advanced-navigation { margin-top: 0; }
  .admin-app #advanced-navigation[open] { flex-basis: 100%; }
  .admin-app #advanced-navigation[open] nav { display: flex; flex-wrap: wrap; }
  .admin-app .account-menu { display: block; }
  .admin-app .handoff-dashboard .detail-grid { grid-template-columns: 1fr; }
  .admin-app .handoff-dashboard .support-pane { border-left: 0; border-top: 1px solid #e0e8df; padding: 1.25rem 0 0; }
  .admin-app .handoff-dashboard .history-chat { max-height: none; }
  .admin-app .handoff-dashboard .roster, .admin-app .handoff-dashboard .roster tbody { display: block; }
  .admin-app .handoff-dashboard .roster thead { display: none; }
  .admin-app .handoff-dashboard .roster tr { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .625rem; padding: 1rem; border-top: 1px solid #e0e8df; }
  .admin-app .handoff-dashboard .roster td { display: block; min-width: 0; width: auto; padding: 0; border: 0; grid-column: 1 / -1; grid-row: auto; }
  .admin-app .handoff-dashboard .roster td:first-child { grid-column: 1; grid-row: 1; }
  .admin-app .handoff-dashboard .roster td:last-child { grid-column: 2; grid-row: 1; align-self: start; white-space: normal; }
  .admin-app .handoff-dashboard .roster td[data-label]::before { content: attr(data-label) ' · '; color: var(--muted); }
  .admin-app .handoff-dashboard .roster .table-empty { grid-column: 1 / -1; }
}
@media (max-width: 47.9375rem) {
  .student-app .student-header { padding-inline: 1rem; gap: .5rem; }
  .student-app .student-logo { width: 7.5rem; height: 2.75rem; }
  .student-app main, .student-app .save-strip { padding-inline: max(1rem, env(safe-area-inset-left)); }
  .student-app main { padding-bottom: max(2rem, env(safe-area-inset-bottom)); }
  .student-app .steps { gap: .375rem; }
  .student-app .steps li + li::before { display: none; }
  .student-app .steps button { padding: .5rem .375rem; }
  .student-app .paper-heading, .student-app .reading-body { padding-inline: 1.25rem; }
  .student-app #writing-controls { padding: 1rem; }
  .student-app .writing-panel textarea, .student-app .editor-annotations, .student-app .original-text { padding: 1.25rem; }
  .student-app .editor-status { padding: .75rem 1.25rem; }
  .student-app .tool-switcher button { flex-basis: 0; }
  .student-app .history-page-heading { flex-direction: column; }
  .student-app .reading-buttons button { flex: 1 1 9rem; }
  .student-app dialog { width: calc(100vw - 1rem); padding: 1rem; }
  .student-app #reading-dialog { width: calc(100vw - 1rem); margin: auto; max-height: calc(100dvh - 1rem); }
  .student-app #reading-dialog #reading-dialog-content { max-height: 65dvh; }
  .admin-app .handoff-topbar { padding-inline: 1rem; gap: .5rem; }
  .admin-app .handoff-top-actions { gap: .5rem; }
  .admin-app .handoff-layout { display: block; }
  .admin-app #sidebar-wrapper { padding: .5rem 1rem; flex-direction: row; flex-wrap: wrap; }
  .admin-app #sidebar-wrapper > nav { flex-wrap: wrap; }
  .admin-app #sidebar-wrapper .sidebar-bottom { display: none; }
  .admin-app #content { padding: 1.25rem 1rem; }
  .admin-app .account-menu { display: block; }
  .admin-app .handoff-dashboard .hero-actions { flex-direction: row; align-items: center; }
  .admin-app .handoff-dashboard .stat { padding: .875rem; }
  .admin-app .handoff-dashboard .stats { gap: .5rem; }
  .admin-app .handoff-dashboard .stat strong { font-size: var(--font-size-lg); }
  .admin-app .handoff-dashboard .compare-grid, .admin-app .handoff-dashboard .field-row { grid-template-columns: 1fr; }
  .admin-app #teacher-detail { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); }
  .admin-app .handoff-dashboard .dialog-body { padding: 1rem; }
  .admin-app .handoff-dashboard .dialog-head { padding: 1rem; }
  .admin-app .handoff-dashboard .dialog-head-right { width: 100%; justify-content: space-between; }
}
@media (max-width: 29.9375rem) {
  .student-app #student-date, .student-app .notebook-label { display: none; }
  .student-app .paper-heading > span { width: 100%; }
  .admin-app .handoff-top-actions { width: 100%; justify-content: space-between; }
  .admin-app .handoff-dashboard .stats { grid-template-columns: 1fr; }
  .admin-app .handoff-dashboard .stat > span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}