/* Seven fixed day columns remain horizontally scrollable on phones. */
#teacherProgramWeekScreen .tp-view-week{display:grid;grid-template-columns:repeat(7,minmax(250px,1fr));gap:14px;overflow-x:auto;max-width:100%;padding:8px 2px 16px;align-items:start;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
#teacherProgramWeekScreen .tp-view-day{scroll-snap-align:start;min-width:0}
#teacherProgramWeekScreen .tp-view-week:focus-visible{outline:2px solid var(--hs-ink)}
#teacherStudentFollowupScreen .tf-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:14px;margin:16px 0}
#teacherStudentFollowupScreen .tf-hub button{display:grid;gap:8px;text-align:left;min-height:110px}
.tf-tabs,.tf-shortcuts{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.tf-tabs button,.tf-shortcuts button{width:auto!important;margin:0!important;font-size:14px!important;min-height:44px}.tf-tabs [aria-pressed=true]{outline:2px solid currentColor}
.tf-period{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:end;margin:16px 0}.tf-period input{max-width:100%;min-width:0}.tf-period button{grid-column:1/-1}.tf-record{padding:12px 0;border-bottom:1px solid var(--hs-line);overflow-wrap:anywhere}.tf-record>small{display:block}.teacher-roster-card{flex-wrap:wrap}
@media print{body:has(#teacherStudentFollowupScreen[style*="block"]) .container>.screen:not(#teacherStudentFollowupScreen){display:none!important}#teacherStudentFollowupScreen button,#teacherStudentFollowupScreen nav,#tfControls,#tfMessage{display:none!important}#teacherStudentFollowupScreen details{display:block}#teacherStudentFollowupScreen .tp-work{break-inside:avoid}#teacherStudentFollowupScreen{background:white!important;color:black!important}}

#studentsScreen .teacher-roster-card .tf-roster-open{grid-column:2/-1;width:100%;margin:0;min-height:44px}

:is(#teacherProgramWeekScreen,#teacherStudentFollowupScreen){background:var(--app-page,#f3f6fb);color:var(--app-ink,#1f2937)}
:is(#teacherProgramWeekScreen,#teacherStudentFollowupScreen) :is(h1,h2,h3,.tp-week-nav){color:var(--app-ink,#1f2937)}
#teacherStudentFollowupScreen .tf-period label{min-width:0}
.tl-live-banner{padding:16px;border:2px solid var(--app-accent,#2563eb);border-radius:16px;background:var(--app-surface,#fff);color:var(--app-ink,#1f2937);margin:12px 0}.tl-live-banner p{margin:8px 0}.tl-teacher-status,.tl-saved-note,.tl-tray,.tl-connection-note{padding:12px;border:1px solid var(--app-edge,#cbd5e1);border-radius:12px;background:var(--app-surface,#fff);color:var(--app-ink,#1f2937);overflow-wrap:anywhere}.tl-error{border-color:#c32a42}.tl-teacher-status button{margin-top:8px}.ct-program-host[data-live-preview=true] .tp-work{margin:10px 0}

/* The same read-only tabs work from the roster and the protected teacher centre. */
#teacherDataCentreScreen .tf-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:14px;margin:16px 0}
#teacherDataCentreScreen .tf-hub button{display:grid;gap:8px;text-align:left;min-height:90px}
.tf-package{font-size:14px;opacity:.85}.tf-tabs{overflow-x:auto;flex-wrap:nowrap;padding:4px 2px 10px}.tf-tabs button{white-space:nowrap;flex-shrink:0}

.tf-week-columns{display:grid;grid-template-columns:repeat(7,minmax(250px,1fr));gap:14px;overflow-x:auto;max-width:100%;padding:8px 2px 16px;align-items:start;scroll-snap-type:x proximity;overscroll-behavior-x:contain}.tf-week-columns>.tp-view-day{min-width:0;scroll-snap-align:start}.tf-week-columns:focus-visible{outline:2px solid var(--app-accent)}
.tf-record-view{min-width:0}.tf-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));overflow:visible;white-space:normal}.tf-tabs button{width:100%!important;white-space:normal}.tf-program-label{font-weight:600}

#teacherProgramWeekScreen .tf-week-columns{width:100%;min-width:0;box-sizing:border-box;grid-template-columns:repeat(7,minmax(min(82vw,290px),1fr))}
#teacherProgramWeekScreen{min-width:0}

.tf-week-view{min-width:0;width:100%;max-width:100%;box-sizing:border-box}.tf-week-days{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.tf-week-days button{width:auto!important;min-height:44px;margin:0!important;flex:1 0 75px;font-size:12px;padding:8px!important}.tf-week-days button[aria-pressed=true]{outline:2px solid var(--app-accent);font-weight:700}