/* NTCenter261: presentation only. First important layer wins over historical
   presentation layers. Scope to the existing light/classic preference;
   attendance/status/learning colours and table geometry are intentionally local. */
@layer ntcenter-brand261 {
  /* 264: shared workspace hierarchy; no roster, save or report data changes. */
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #workspace::before {
    background: #f4f8f9 !important;
    backdrop-filter: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.appearanceHero,.tuitionDeadlineHeader,.networkAccessHeader,.bankConfigPanel > header,.accountAdminHeader) {
    background: #fff !important;
    color: #072a36 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .appearanceHero p {
    color: #52656d !important;
  }
  html body :is(#configView,.appearanceView) h3,
  html body :is(#revenueView,#absenceView,#tuitionWaitlistView) h3,
  html body :is(.revenueSectionTitle,.lateStatsHeader h3,.pllReportHeading,.studentGuardianCard h3,.pllSettingsPanel > header > strong) {
    font-size: 18px !important;
    font-weight: 650 !important;
    line-height: 1.4 !important;
    margin: 0 0 8px !important;
    overflow-wrap: anywhere !important;
  }
  html body :is(.tabConfigTitle,.unifiedConfigToolbar,.tuitionDeadlineListHead) > :is(strong,div > strong),
  html body :is(.studentDetailContent h4,.issueAreaCard h4,.statusAreaGrid > section > header h3) {
    font-size: 15px !important;
    font-weight: 650 !important;
    line-height: 1.4 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.studentMovementGroup,.revenueMovementCard) > header {
    background: #edf5f6 !important;
    color: #072a36 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.studentMovementGroup,.revenueMovementCard) > header :is(strong,span) { color: #072a36 !important; }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.studentProfileCard,.studentGuardianCard,.studentDetailContent,.studentDetailTabs) {
    border-radius: 6px !important;
    box-shadow: none !important;
  }
  html body :is(#absenceRetry246,.emptyReport > button) {
    min-height: 40px !important;
    padding: 8px 14px !important;
    border: 1px solid var(--account-border,#dce5e8) !important;
    border-radius: 6px !important;
    background: var(--account-surface,#fff) !important;
    color: var(--account-text,#072a36) !important;
    font: inherit !important;
    cursor: pointer;
  }
  html body :is(.tuitionDeadlineHeader,.networkAccessHeader,.bankConfigPanel > header,.appearanceHero) .eyebrow {
    display: none !important;
  }
  html body :is(.tuitionDeadlineHeader,.networkAccessHeader,.bankConfigPanel > header,.accountAdminHeader) {
    padding: 16px !important;
    gap: 16px !important;
    align-items: start !important;
  }
  html body :is(.tuitionDeadlineHeader,.networkAccessHeader,.accountAdminHeader) > div:first-child {
    min-width: 0 !important;
  }
  html body .statusAreaGrid:has(> section:only-child) { grid-template-columns: minmax(0,1fr) !important; }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .reportIssueToggle {
    border-radius: 6px !important;
    background: #edf5f6 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .reportIssueToggle button {
    min-height: 36px !important;
    border-radius: 4px !important;
    color: #52656d !important;
    font-size: 13px !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .reportIssueToggle button.active {
    color: #fff !important;
    background: #087f8c !important;
  }
  /* Only dialog chrome; complex form grids and scrollers keep their owners. */
  html body .dialog :is(form > header,.studentDetailDialogHeader) {
    gap: 12px !important;
    padding: 16px 20px !important;
    align-items: center !important;
  }
  html body .dialog form > header h3 {
    min-width: 0 !important;
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 1.4 !important;
    font-weight: 650 !important;
    overflow-wrap: anywhere !important;
  }
  html body .dialog form > header :is(.iconBtn,.dialogIconBtn) { flex-shrink: 0 !important; }
  html body .dialog form > footer { padding: 12px 20px !important; gap: 8px !important; }
  @media (min-width: 921px) {
    html body #workspace[data-view="config"] .configTabs {
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 !important;
      padding: 12px 16px 12px 112px !important;
      align-items: center !important;
      border-radius: 0 !important;
    }
  }
  @media (max-width: 920px) {
    html body #workspace[data-view="audit"] .auditHeaderActions:not(.hidden) {
      display: grid !important;
      grid-template-columns: 40px minmax(0,1fr) !important;
      justify-content: start !important;
      overflow: visible !important;
      padding: 6px 0 !important;
    }
    html body #workspace[data-view="audit"] .auditHeaderActions .auditScopeTabs {
      grid-column: 2 !important;
      grid-row: 1 !important;
      display: grid !important;
      grid-template-columns: repeat(2,minmax(0,1fr)) !important;
      min-width: 0 !important;
      width: 100% !important;
    }
    html body #workspace[data-view="audit"] .auditHeaderActions #btnRefreshAudit {
      grid-column: 1 !important;
      grid-row: 1 !important;
    }
    html body #workspace[data-view="audit"] .auditHeaderActions .auditScopeTabs button {
      min-width: 0 !important;
      padding-inline: 5px !important;
    }
    html body :is(#configView,.appearanceView) h3,
    html body :is(#revenueView,#absenceView,#tuitionWaitlistView) h3,
    html body :is(.revenueSectionTitle,.lateStatsHeader h3,.pllReportHeading,.studentGuardianCard h3,.pllSettingsPanel > header > strong) { font-size: 16px !important; }
    html body .dialog :is(form > header,.studentDetailDialogHeader) { padding: 12px 14px !important; }
    html body .dialog form > footer { padding: 12px 14px !important; flex-wrap: wrap !important; }
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] {
    --account-primary: #087f8c !important;
    --account-primaryDark: #06616b !important;
    --account-background: #f4f8f9 !important;
    --account-surface: #fff !important;
    --account-subtle: #edf5f6 !important;
    --account-text: #072a36 !important;
    --account-muted: #52656d !important;
    --account-border: #dce5e8 !important;
    --account-link: #087f8c !important;
    --account-accent: #2095a8 !important;
    --primary: #087f8c !important;
    --primary-dark: #06616b !important;
    --text: #072a36 !important;
    --muted: #52656d !important;
    --line: #dce5e8 !important;
    --surface: #fff !important;
    --bg: #f4f8f9 !important;
    --teal: #087f8c !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body {
    background: #f4f8f9 !important;
    color: #072a36 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.mainMenu,.topbar,.attendanceClassStrip,.controlBar,.attendanceModeBar252) {
    background: #fff !important;
    border-color: #dce5e8 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .brand {
    border: 0 !important;
    border-bottom: 1px solid #dce5e8 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.brandMark,.homeWelcomeMark) {
    border: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .brandMark img {
    object-fit: contain !important;
    padding: 0 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .brand strong {
    font-weight: 700 !important;
    letter-spacing: 0 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .navSectionTitle {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: 12px !important;
    color: #52656d !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .mainMenu :is(.navGroup.active .menuTrigger,.classBtn.active,.sideAction.active) {
    color: #072a36 !important;
    background: #e8f5f7 !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .mainMenu .navGroup.active .menuTrigger small {
    color: #087f8c !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #attendanceClassStrip .attendanceClassPill[data-save-state="idle"] {
    background: #edf5f6 !important;
    color: #072a36 !important;
    border-color: transparent !important;
    border-radius: 8px !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #attendanceClassStrip .attendanceClassPill[data-save-state="idle"][aria-selected="true"] {
    background: #087f8c !important;
    color: #fff !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.topbar h2,.attendanceClassStripTitle) {
    color: #072a36 !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.reportTabs,.pllTabs,.configTabs) button {
    border-radius: 6px !important;
    border-color: #dce5e8 !important;
    background: #fff !important;
    color: #52656d !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.reportTabs,.pllTabs,.configTabs) button:is(.active,[aria-selected="true"]) {
    color: #06616b !important;
    background: #e8f5f7 !important;
    border-color: #b6dce1 !important;
    box-shadow: inset 0 -2px #087f8c !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.panel,.dialog,.configPanel,.auditPanel,.accountAdminPanel,.studentKpi,.revenueKpis > article) {
    border-color: #dce5e8 !important;
    box-shadow: none !important;
    background-image: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.ghostBtn,.miniBtn,.iconBtn,.primaryBtn,.exportBtn,.excelBtn,.sidebarReveal) {
    border-radius: 6px !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.primaryBtn,.exportBtn,.excelBtn) {
    background: #087f8c !important;
    color: #fff !important;
    border-color: #087f8c !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.revenueKpis,.studentMovementKpis) strong {
    font-variant-numeric: tabular-nums !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.revenueKpis,.studentMovementKpis) > :is(div,article) {
    border-radius: 8px !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .revenueKpis > article > span {
    font-size: 13px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.dataTable,.auditTable,.studentDirectoryTable) {
    font-variant-numeric: tabular-nums !important;
  }
  /* Keep the class tables ahead of optional chart analysis. */
  .reportCharts261,#revenueBenefitReport {
    margin: 16px 0;
    border: 1px solid var(--line,#dce5e8);
    border-radius: 8px;
    background: var(--surface,#fff);
  }
  :is(.reportCharts261,#revenueBenefitReport) > summary {
    padding: 14px 16px;
    min-height: 48px;
    box-sizing: border-box;
    color: var(--text,#072a36);
    font-weight: 700;
    cursor: pointer;
  }
  :is(.reportCharts261,#revenueBenefitReport) > summary:focus-visible { outline: 2px solid var(--primary,#087f8c); outline-offset: 2px; }
  .reportCharts261 > .revenueTopGrid,.reportDisclosureBody261 { padding: 0 16px 16px; }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #revenueView {
    border-color: #dce5e8 !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #revenueView :is(.revenueBoardCard,.revenueBenefitCard,.revenueGroupComparePanel,.revenueActualOverview) {
    border-color: #dce5e8 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #revenueView .revenueBoardCard > header {
    background: #072a36 !important;
    color: #fff !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #revenueView .revenueBoardTable thead th {
    background: #edf5f6 !important;
    color: #304b55 !important;
  }
  html body #revenueView .revenueSegmentReport { margin: 0 !important; }
  html body #revenueView .reportTitleRow { margin: 0 !important; }
  html body #revenueView .reportCharts261 { margin: 4px 0 !important; }
  html body #revenueView #revenueBenefitReport { margin: 4px 0 !important; }
  /* 262: presentation fixes traced to inspector261; revenue numbers only. */
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #revenueView .revenuePanel {
    box-shadow: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #revenueView .revenueMobileGroupToggle {
    background: #edf5f6 !important;
    color: #072a36 !important;
    box-shadow: none !important;
  }
  html body #revenueView :is(.revenueKpis,.revenueBoardTable,.revenueMobileTable) {
    font-variant-numeric: tabular-nums !important;
  }
  html body #revenueSegmentReport .revenueBoardTable :is(th,td):not(:first-child),
  html body #revenueSegmentReport .revenueMobileTable :is(th,td):not(:first-child) {
    text-align: right !important;
  }
  html body #revenueView .revenueBoardGrid:has(> .revenueBoardCard:only-child) { grid-template-columns: minmax(0,1fr) !important; }
  /* 263: area cards size to their content. Keep both existing actions and
     donut listeners in their original DOM, but share one action row. */
  html body .statusAreaGrid { align-items: start !important; }
  html body .statusAreaGrid > section:has(> .statusPieCard) {
    display: grid !important;
    grid-template-columns: 140px minmax(0,1fr) !important;
    gap: 12px !important;
    align-content: start !important;
    border-radius: 8px !important;
  }
  html body .statusAreaGrid > section > .statusPieCard,
  html body .statusAreaGrid > section > .statusPieCard > .ntDonut { display: contents !important; }
  html body .statusAreaGrid > section > .statusPieCard > header { grid-column: 1 / -1 !important; }
  html body .statusAreaGrid > section .donutStage { grid-column: 1 !important; }
  html body .statusAreaGrid > section .donutLegend { grid-column: 2 !important; }
  html body .statusAreaGrid > section .zeroStatusToggle {
    grid-column: 1 !important;
    justify-self: start !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 6px 10px !important;
  }
  html body .statusAreaGrid > section > button {
    grid-column: 2 !important;
    justify-self: start !important;
    align-self: end !important;
    margin: 0 !important;
  }
  html body .statusAreaGrid > section :is(.zeroStatusEmpty,.timingExcluded) { grid-column: 1 / -1 !important; }
  @media (min-width: 921px) {
    html body #workspace[data-view="audit"] #auditView .auditPanel {
      display: flex !important;
      flex-direction: column !important;
      height: calc(100dvh - 130px) !important;
      min-height: 300px !important;
    }
    html body #workspace[data-view="audit"] #auditView :is(.auditToolbar,.auditPager,.auditLoadFeedback) { flex-shrink: 0 !important; }
    html body #workspace[data-view="audit"] #auditView .auditTableWrap {
      flex: 1 1 auto !important;
      min-height: 0 !important;
      max-height: none !important;
      overflow: auto !important;
    }
    html body #workspace[data-view="audit"] #auditView .auditPanel:has(#auditList td[colspan]) {
      height: auto !important;
      min-height: 0 !important;
    }
    html body #workspace[data-view="audit"] #auditView .auditTable {
      display: table !important;
      width: 100% !important;
      min-width: 800px !important;
      table-layout: fixed !important;
    }
    html body #auditView .auditTable :is(th,td) {
      min-width: 0 !important;
      max-width: none !important;
      overflow-wrap: anywhere !important;
    }
    html body #auditView .auditTable :is(th,td):nth-child(1) { width: 13% !important; }
    html body #auditView .auditTable :is(th,td):nth-child(2) { width: 14% !important; }
    html body #auditView .auditTable :is(th,td):nth-child(3) { width: 17% !important; }
    html body #auditView .auditTable :is(th,td):nth-child(4) { width: 24% !important; }
    html body #auditView .auditTable :is(th,td):nth-child(5) { width: 32% !important; }
    html body #auditView .auditTable thead { position: static !important; }
    html body #auditView .auditTable thead th { position: sticky !important; top: 0 !important; z-index: 2 !important; }
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #homeView {
    background: #f4f8f9 !important;
    padding: 32px !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #homeView::before,
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body #homeView::after {
    content: none !important;
    background: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeScene {
    width: min(1040px,100%) !important;
    gap: 24px !important;
    animation: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.homeWelcome,.homeFeature) {
    background: #fff !important;
    border: 1px solid #dce5e8 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeWelcome { padding: 32px !important; min-height: 300px !important; }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeWelcome h1 {
    font-size: 32px !important;
    line-height: 1.25 !important;
    color: #072a36 !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeWelcome .eyebrow { display: none !important; }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeLead { color: #52656d !important; font-size: 16px !important; }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeFeatureIcon {
    background: transparent !important;
    color: #087f8c !important;
    width: 28px !important;
    height: 28px !important;
    font-size: 22px !important;
  }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeFeature { grid-template-columns: 28px minmax(0,1fr) !important; min-height: 84px !important; }
  :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeFeature :is(strong,span) { color: #072a36 !important; }
  @media (max-width: 900px) {
    :root[data-theme-resolved="light"][data-theme-palette="classic"] body #homeView { padding: 20px !important; }
    :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeScene { grid-template-columns: 1fr !important; }
  }
  @media (max-width: 640px) {
    /* Same totals already shown in the five KPI tiles above. */
    html body #revenueView[aria-labelledby="reportTab-revenue"] .revenueMobileSummary228 { display: none !important; }
    /* Existing attendance cards use absolute avatars. Projections remain tables. */
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell .studentNameBox {
      display: flex !important;
      align-items: center !important;
      gap: 8px !important;
      padding: 0 !important;
    }
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell .attendanceAvatar {
      position: static !important;
      width: 32px !important;
      min-width: 32px !important;
      height: 32px !important;
      flex: 0 0 32px !important;
    }
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell .attendanceAvatar img {
      width: 100% !important;
      min-width: 0 !important;
      height: 100% !important;
    }
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell .studentNameMain {
      min-width: 0 !important;
      flex: 1 1 auto !important;
    }
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell :is(.mobileTuitionBadge,.attendanceRosterIcons) { display: none !important; }
    :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.topbar h2,.attendanceClassStripTitle) { font-size: 16px !important; }
    :root[data-theme-resolved="light"][data-theme-palette="classic"] body :is(.revenueKpis,.studentMovementKpis) strong { font-size: 20px !important; }
    :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeWelcome { padding: 24px !important; min-height: 0 !important; }
    :root[data-theme-resolved="light"][data-theme-palette="classic"] body .homeWelcome h1 { font-size: 26px !important; }
    :root[data-theme-resolved="light"][data-theme-palette="classic"] body #workspace[data-view="attendance"] .topbar h2 { font-size: 12px !important; }
  }
}

/* 265: repairs reproduced at 375/390/768; keep shared identity and status data. */
@layer ntcenter-brand261 {
  #absenceList246 table { min-width: 480px !important; table-layout: fixed !important; }
  #absenceList246 :is(th,td):nth-child(1) { width: 44px !important; white-space: nowrap !important; overflow-wrap: normal !important; }
  #absenceList246 :is(th,td):nth-child(2) { width: 96px !important; white-space: nowrap !important; overflow-wrap: normal !important; }
  #absenceList246 :is(th,td):nth-child(3) { width: 160px !important; word-break: normal !important; overflow-wrap: break-word !important; }
  #absenceList246 .absenceTableWrap246 { overscroll-behavior: contain; }
  #absenceList246 .absenceDates246 { min-width: 120px; }
  /* 275: fit all four columns on phones; never hide absence dates off-screen. */
  @media (max-width:600px) {
    #absenceList246 table { min-width:0!important; width:100%!important; }
    #absenceList246 :is(th,td) { padding:6px!important; font-size:14px!important; }
    #absenceList246 :is(th,td):nth-child(1) { width:36px!important; }
    #absenceList246 :is(th,td):nth-child(2) { width:56px!important; white-space:normal!important; }
    #absenceList246 :is(th,td):nth-child(3) { width:37%!important; min-width:0!important; }
    #absenceList246 :is(th,td):nth-child(4) { width:auto!important; }
    #absenceList246 .absenceDates246 { min-width:0; gap:4px; }
    #absenceList246 .absenceDate246 { padding:4px 6px; }
  }
  html body #workspace #attendanceView #learningInline244 .levelGrid252 { background: transparent !important; }
  html body #workspace #attendanceView #learningInline244 .levelGrid252 button { color: var(--text,#172033) !important; background: var(--surface,#fff) !important; }
  html body #workspace #attendanceView #learningInline244 .levelGrid252 button[aria-pressed=true] { outline: 2px solid currentColor !important; outline-offset: -3px; font-weight: 700 !important; }
  html body #workspace #attendanceView #learningInline244 .levelGrid252.learning-green button[aria-pressed=true] { color:#166534!important; background:#dcfce7!important; }
  html body #workspace #attendanceView #learningInline244 .levelGrid252.learning-yellow button[aria-pressed=true] { color:#854d0e!important; background:#fef3c7!important; }
  html body #workspace #attendanceView #learningInline244 .levelGrid252.learning-red button[aria-pressed=true] { color:#991b1b!important; background:#fee2e2!important; }
  @media (max-width:920px) {
    html body #workspace #attendanceView.gradeOnlyView .trackerTable { display:table!important; table-layout:fixed!important; min-width:760px!important; width:100%!important; }
    html body #workspace #attendanceView.gradeOnlyView .tableWrap { overflow:auto!important; }
    html body #workspace #attendanceView.gradeOnlyView .trackerTable thead { display:table-header-group!important; }
    html body #workspace #attendanceView.gradeOnlyView .trackerTable tbody { display:table-row-group!important; }
    html body #workspace #attendanceView.gradeOnlyView .trackerTable tr { display:table-row!important; position:static!important; height:auto!important; padding:0!important; }
    html body #workspace #attendanceView.gradeOnlyView .trackerTable :is(th,td) { display:table-cell!important; position:static!important; transform:none!important; padding:10px!important; }
    html body #workspace #attendanceView.gradeOnlyView .trackerTable :is(.sttCell,.sttCol) { position:sticky!important; left:0!important; width:44px!important; min-width:44px!important; }
    html body #workspace #attendanceView.gradeOnlyView .trackerTable :is(.nameCell,.nameCol) { position:sticky!important; left:44px!important; width:240px!important; min-width:240px!important; max-width:240px!important; }
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell .studentNameBox { display:flex!important; position:static!important; align-items:center!important; width:100%!important; padding:0!important; }
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell .attendanceAvatar { position:static!important; width:36px!important; min-width:36px!important; height:36px!important; flex:0 0 36px!important; }
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell .studentNameMain { position:static!important; min-width:0!important; flex:1 1 auto!important; padding:0!important; }
    html body #workspace #attendanceView:is(.learningProgressView,.gradeOnlyView) .nameCell :is(.mobileTuitionBadge,.attendanceRosterIcons) { display:none!important; }
    html body #workspace #attendanceView.gradeOnlyView #attendanceRows [data-grade-average] { display:inline-block!important; }
    html body #workspace #attendanceView.gradeOnlyView #attendanceRows [data-grade-rank] { display:table-cell!important; }
    html body #workspace #attendanceView.gradeOnlyView .trackerTable :is(.sttCell,.sttCol) { white-space:nowrap!important; word-break:normal!important; overflow-wrap:normal!important; padding:6px!important; border-radius:0!important; background:var(--surface,#fff)!important; color:var(--text,#172033)!important; height:auto!important; text-align:center!important; }
    html body #workspace #attendanceView.gradeOnlyView .trackerTable thead th { background:var(--accent-soft,#edf4f8)!important; }
  }
}

@layer ntcenter-brand261 {
  html body #workspace #attendanceView #learningInline244 #attendanceRows .progressCell252.learning-red { background:#fee2e2!important; color:#7f1d1d!important; }
  html body #workspace #attendanceView #learningInline244 #attendanceRows .progressCell252.learning-yellow { background:#fef3c7!important; color:#78350f!important; }
  html body #workspace #attendanceView #learningInline244 #attendanceRows .progressCell252.learning-green { background:#dcfce7!important; color:#14532d!important; }
  html body #workspace #attendanceView #learningInline244 #attendanceRows .progressCell252.learning-empty { background:var(--surface,#fff)!important; color:var(--muted,#475569)!important; }
}

/* 266: the detail action cannot fit the legend column on a phone. */
@layer ntcenter-brand261 {
  @media (max-width:900px) {
    html body #workspace .statusAreaGrid > section > button {
      grid-column:1 / -1!important;
      width:auto!important;
      max-width:100%!important;
      min-width:0!important;
      min-height:44px!important;
      white-space:normal!important;
      box-sizing:border-box!important;
      justify-self:start!important;
    }
  }
}

/* 266: expanded PLL fields need their own row on narrow screens. */
@layer ntcenter-brand261 {
  @media (max-width:640px) {
    html body #workspace[data-view="pll"] .pllToolbar [data-mobile-filter-shell].mobileFiltersExpanded > .pllInlineControl {
      grid-column:1 / -1!important;
      display:grid!important;
      grid-template-columns:80px minmax(0,1fr)!important;
      align-items:center!important;
      gap:8px!important;
      width:100%!important;
      min-width:0!important;
    }
    html body #workspace[data-view="pll"] .pllToolbar .pllInlineControl > :is(input,select) {
      width:100%!important;
      min-width:0!important;
    }
  }
}

@layer ntcenter-brand261 {
  @media (max-width:480px) {
    html body #workspace #pllReportView .pllReportFilters > label {
      flex-basis:100%!important;
      min-width:0!important;
    }
  }
}

/* 267: mobile workflow uses the current progress editor and compact controls. */
@layer ntcenter-brand261 {
  @media (max-width:600px) {
    html body #workspace :is(.controlBar.reportFilters,.controlBar.revenueFilters,.tuitionWaitlistToolbar,.tuitionWaitlistFilters,.pllToolbar,.pllToolbar > div:not(.pllStatsBlock),.studentAdminToolbar,.studentAdminToolbar > div:last-child,.studentFlowQuickFilters) {
      box-shadow:none!important; background:transparent!important; border:0!important; border-radius:0!important; padding:0!important; margin:0 0 8px!important; gap:8px!important;
    }
    html body #workspace :is(.controlBar,.tuitionWaitlistFilters,.pllToolbar,.studentAdminToolbar) .studentAdminSearch {
      padding:0 10px!important; border:1px solid var(--border,#d8e3e8)!important; min-height:44px!important; border-radius:6px!important; background:var(--surface,#fff)!important;
    }
    html body #workspace .studentAdminSearch input { border:0!important; box-shadow:none!important; padding:8px 0!important; min-width:0!important; width:100%!important; }
    html body #workspace .tuitionWaitlistActions { display:grid!important; grid-template-columns:1fr 1fr 1.3fr!important; gap:6px!important; width:100%!important; padding:0!important; margin:0!important; }
    html body #workspace .tuitionWaitlistActions > button { width:100%!important; min-width:0!important; min-height:44px!important; padding:6px!important; font-size:12px!important; grid-column:auto!important; }
    html body #workspace .tuitionWaitlistActions > button span { white-space:normal!important; }
    html body #workspace .studentFlowQuickFilters { display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; align-items:end!important; }
    html body #workspace .studentFlowQuickFilters .flowSearchLabel267 { position:absolute!important; width:1px!important; height:1px!important; overflow:hidden!important; clip-path:inset(50%)!important; }
    html body #workspace .studentFlowAdvanced { margin:8px 0!important; padding:0!important; }
    html body #workspace .studentFlowAdvanced > summary { min-height:44px!important; padding:10px 0!important; }
    html body #workspace .studentFlowPager { margin:8px 0!important; padding:0!important; gap:6px!important; }
    html body .studentAttendanceBlock > header { display:flex!important; flex-wrap:wrap!important; align-items:center!important; gap:8px!important; padding:0 0 12px!important; background:transparent!important; }
    html body .studentAttendanceBlock > header > h4 { flex:1 1 160px!important; min-width:0!important; margin:0!important; }
    html body .studentAttendanceBlock .studentAttendanceMonth { display:flex!important; flex:1 1 190px!important; flex-wrap:nowrap!important; align-items:center!important; gap:8px!important; min-width:0!important; margin:0!important; }
    html body .studentAttendanceBlock .studentAttendanceMonth select { flex:1 1 auto!important; min-width:0!important; width:auto!important; min-height:44px!important; }
    html body #workspace #attendanceView .mobileProgress267 { padding:0!important; margin:0!important; }
    html body #workspace #attendanceView .mobileProgress267 > button { display:flex!important; align-items:center!important; justify-content:flex-end!important; gap:6px!important; min-height:44px!important; border:0!important; background:transparent!important; width:100%!important; font-size:13px!important; font-weight:600!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] .trackerTable { display:block!important; width:100%!important; min-width:0!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] :is(colgroup,thead) { display:none!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] tbody { display:block!important; width:100%!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] tr[data-code] { display:grid!important; grid-template-columns:32px minmax(0,1fr)!important; gap:0!important; width:100%!important; margin:0 0 12px!important; padding:8px!important; background:var(--surface,#fff)!important; border:1px solid var(--border,#d8e3e8)!important; box-sizing:border-box!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] tr > :is(.sttCell,.nameCell) { display:block!important; position:static!important; width:auto!important; min-width:0!important; max-width:none!important; padding:6px!important; height:auto!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] .nameCell .studentNameBox { display:flex!important; align-items:center!important; gap:8px!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] tr > .progressSource252 { display:none!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] tr > .progressCell252 { display:block!important; grid-column:1 / -1!important; width:100%!important; min-width:0!important; padding:8px 6px!important; border:0!important; height:auto!important; box-sizing:border-box!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] .progressCell252::before { content:attr(data-progress-label)!important; display:block!important; font-size:12px!important; color:var(--muted,#475569)!important; font-weight:600!important; margin:0 0 6px!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] textarea { min-height:44px!important; width:100%!important; padding:8px!important; box-sizing:border-box!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] .levelGrid252 { display:grid!important; grid-template-columns:repeat(5,minmax(0,1fr))!important; max-width:100%!important; gap:4px!important; }
    html body #workspace #attendanceView #learningInline244[data-entry="true"] .levelGrid252 button { min-height:44px!important; width:100%!important; padding:4px!important; }
    html body #workspace #pllBody > tr { display:grid!important; grid-template-columns:32px minmax(0,1fr)!important; gap:4px 8px!important; padding:12px!important; margin:0 0 10px!important; border-radius:6px!important; width:100%!important; box-sizing:border-box!important; }
    html body #workspace #pllBody > tr > td { display:block!important; position:static!important; grid-column:2!important; width:auto!important; min-width:0!important; padding:2px 0!important; margin:0!important; border:0!important; }
    html body #workspace #pllBody > tr > td::before { display:none!important; }
    html body #workspace #pllBody > tr > td.pllSelectCell { grid-column:1!important; grid-row:1 / span 2!important; }
    html body #workspace #pllBody > tr > td.pllSttCell { display:none!important; }
    html body #workspace #pllBody > tr > td.pllAliasCell { font-size:13px!important; color:var(--muted,#475569)!important; overflow-wrap:anywhere!important; }
    html body #workspace #pllBody > tr > td.pllZaloIdCell { font-size:12px!important; color:var(--muted,#475569)!important; }
    html body #workspace #pllBody > tr > td.pllSubjectGroupCell :is(div,span) { display:inline-flex!important; flex-wrap:wrap!important; gap:4px!important; margin:2px 4px 2px 0!important; }
    html body #workspace #pllBody > tr > td.pllActionCell { grid-column:1 / -1!important; display:flex!important; justify-content:flex-end!important; gap:8px!important; padding-top:8px!important; }
    html body #workspace #pllBody > tr > td.pllActionCell button { min-width:44px!important; min-height:44px!important; }
  }
}

@layer ntcenter-brand261 {
 @media(max-width:600px) {
  html body #workspace #attendanceView #learningInline244[data-entry="true"] tr > .sttCell { grid-column:1!important; grid-row:1!important; order:0!important; background:transparent!important; }
  html body #workspace #attendanceView #learningInline244[data-entry="true"] tr > .nameCell { grid-column:2!important; grid-row:1!important; order:0!important; background:transparent!important; }
  html body #workspace #attendanceView #learningInline244[data-entry="true"] tr > .progressCell252 { background:transparent!important; }
  html body #workspace #attendanceView .mobileProgress267 > button { white-space:nowrap!important; }
  html body #workspace #attendanceView[data-mobile-mode="feedback"]:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > .feedbackCell { display:block!important; position:static!important; width:100%!important; min-width:0!important; height:auto!important; padding:8px!important; box-sizing:border-box!important; }
  html body #workspace #attendanceView[data-mobile-mode="feedback"]:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > :is(.academicCell,.noteCell,.mobileFeedbackPreview,.learningProgressCell) { display:none!important; }
 }
}

@layer ntcenter-brand261 {
 @media(max-width:600px) {
  html body #workspace #attendanceView[data-mobile-mode="feedback"]:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows .nameCell { min-height:68px!important; height:auto!important; }
  html body #workspace #attendanceView[data-mobile-mode="feedback"]:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows .feedbackCell .attendanceTextPreview:not([hidden]) { max-height:none!important; height:auto!important; }
  html body #workspace #attendanceView[data-mobile-mode="feedback"]:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows .feedbackCell .attendanceTextClamp { display:block!important; -webkit-line-clamp:unset!important; max-height:none!important; overflow:visible!important; white-space:pre-wrap!important; }
 }
}

@layer ntcenter-brand261 {
 @media(max-width:600px) {
  html body #workspace .studentFlowQuickFilters > label { grid-column:1!important; grid-row:1!important; min-width:0!important; }
  html body #workspace .studentFlowQuickFilters > button { grid-column:2!important; grid-row:1!important; }
 }
}

/* 268: controls handle presses; the browser retains scrolling and pinch zoom. */
@layer ntcenter-brand261 {
 html body #workspace #attendanceView :is(.statusChip,.mobileAttendanceStatus,[data-progress-level],[data-progress-result]) {
  touch-action:manipulation;
  -webkit-user-select:none!important;
  user-select:none!important;
  -webkit-touch-callout:none;
 }
}

/* 269: per-learner disclosures share the attendance row and its draft fields. */
@layer ntcenter-brand261 {
 @media(max-width:920px) {
  html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > .mobileFeedbackPreview { display:none!important; }
  html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > .learningProgressCell { display:block!important; position:static!important; grid-column:1 / -1!important; width:100%!important; min-width:0!important; height:auto!important; padding:0 8px 6px!important; grid-row:3!important; order:12!important; background:transparent!important; box-sizing:border-box!important; }
  html body #workspace #attendanceView .mobileLearnerActions269 { display:flex!important; justify-content:flex-end; gap:8px; }
  html body #workspace #attendanceView .mobileLearnerActions269 > button { display:inline-flex!important; align-items:center; justify-content:center; gap:5px; min-height:44px!important; padding:6px 10px!important; width:auto!important; border:1px solid var(--border,#d8e3e8)!important; border-radius:6px!important; background:var(--surface,#fff)!important; font-size:13px!important; color:var(--ink,#103442)!important; white-space:nowrap; }
  html body #workspace #attendanceView .mobileLearnerActions269 > button[aria-expanded="true"] { border-color:var(--primary,#087f8c)!important; background:#e8f6f7!important; }
  html body #workspace #attendanceView .mobileLearningBody269:not([hidden]) { display:grid!important; gap:10px; border-top:1px solid var(--border,#d8e3e8); padding:12px 0 4px; margin-top:6px; }
  html body #workspace #attendanceView .mobileLearningBody269[hidden] { display:none!important; }
  html body #workspace #attendanceView .mobileLearningBody269 label { display:grid!important; gap:5px; margin:0!important; font-size:13px!important; font-weight:600; min-width:0; }
  html body #workspace #attendanceView .mobileLearningQuick269 { display:grid; grid-template-columns:minmax(0,1fr) 100px; gap:12px; align-items:start; }
  html body #workspace #attendanceView .mobileLearningQuick269 > div > span { display:block; font-size:13px; font-weight:600; margin-bottom:5px; }
  html body #workspace #attendanceView .mobileLearningResult269 { display:flex; gap:6px; }
  html body #workspace #attendanceView .mobileLearningResult269 button { min-height:44px!important; padding:6px 12px!important; border:1px solid var(--border,#d8e3e8)!important; border-radius:6px!important; background:white!important; touch-action:manipulation; user-select:none; }
  html body #workspace #attendanceView [data-mobile-result269="pass"][aria-pressed="true"] { background:#dcfce7!important; border-color:#15803d!important; color:#166534!important; }
  html body #workspace #attendanceView [data-mobile-result269="fail"][aria-pressed="true"] { background:#fee2e2!important; border-color:#b91c1c!important; color:#991b1b!important; }
  html body #workspace #attendanceView .mobileLearningBody269 :is(input[type="number"],textarea) { width:100%!important; min-width:0!important; min-height:44px!important; height:auto!important; box-sizing:border-box!important; padding:8px!important; border:1px solid var(--border,#d8e3e8)!important; border-radius:6px!important; font-size:16px!important; line-height:1.4!important; }
  html body #workspace #attendanceView .mobileLearningBody269 textarea { min-height:56px!important; }
  html body #workspace #attendanceView .mobileLearningBody269 input.learning-green { background:#dcfce7!important; color:#166534!important; }
  html body #workspace #attendanceView .mobileLearningBody269 input.learning-yellow { background:#fef3c7!important; color:#854d0e!important; }
  html body #workspace #attendanceView .mobileLearningBody269 input.learning-red { background:#fee2e2!important; color:#991b1b!important; }
  html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr:not(.mobileDetailsExpanded) > :is(.feedbackCell,.academicCell,.noteCell) { display:none!important; }
  html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr.mobileDetailsExpanded > .feedbackCell { display:block!important; position:static!important; grid-column:1 / -1!important; width:100%!important; min-width:0!important; height:auto!important; padding:8px!important; box-sizing:border-box!important; order:13!important; }
 }
 @media(max-width:600px) {
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView .tableWrap { overflow-x:hidden!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView .trackerTable { display:block!important; min-width:0!important; width:100%!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView :is(colgroup,thead) { display:none!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows { display:block!important; width:100%!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows tr[data-code] { display:grid!important; grid-template-columns:28px minmax(0,1fr)!important; gap:6px 8px!important; padding:10px!important; margin:0 0 8px!important; border:1px solid var(--border,#d8e3e8)!important; border-radius:6px!important; width:100%!important; box-sizing:border-box!important; background:white!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows tr > td { display:block!important; position:static!important; min-width:0!important; max-width:none!important; width:auto!important; height:auto!important; padding:4px 0!important; border:0!important; background:transparent!important; box-sizing:border-box!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows .sttCell { grid-row:1!important; grid-column:1!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows .nameCell { grid-row:1!important; grid-column:2!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows .studentNameBox { display:flex!important; gap:8px!important; align-items:center!important; min-height:44px!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows .studentNameMain { min-width:0!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows .gradeNicknameCell { grid-column:2!important; font-size:12px!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows .gradeNicknameCell:has(strong:only-child) { padding:0!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows tr > :is(.gradeScoreEntry269,.gradeAverage269,[data-grade-rank]) { grid-column:1 / -1!important; display:grid!important; grid-template-columns:minmax(0,1fr) 88px!important; gap:6px 10px!important; align-items:center!important; text-align:left!important; padding:8px 0!important; border-top:1px solid var(--border,#d8e3e8)!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows [data-grade-label]::before { content:attr(data-grade-label)!important; font-size:13px!important; font-weight:600!important; white-space:normal!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView .assessmentScoreInput { width:88px!important; min-height:44px!important; font-size:16px!important; box-sizing:border-box!important; text-align:center!important; }
  html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView .assessmentSaveStatus { grid-column:1 / -1!important; font-size:12px!important; }
 }
}

@layer ntcenter-brand261 { @media(max-width:920px) {
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > .nameCell { min-height:64px!important; height:auto!important; }
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr.mobileDetailsExpanded > .feedbackPrimaryCell { grid-row:4!important; }
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr.mobileDetailsExpanded > .feedbackWeaknessCell { grid-row:5!important; }
} }

@layer ntcenter-brand261 { @media(max-width:920px) {
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > .learningProgressCell { grid-row:2!important; }
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > .activeSessionCell { grid-column:1 / -1!important; grid-row:2!important; width:78px!important; max-width:78px!important; margin-left:8px!important; align-self:start!important; justify-self:start!important; }
 html body #workspace #attendanceView .mobileLearnerActions269 { padding-left:80px!important; }
 html body #workspace #attendanceView .mobileLearningBody269:not([hidden]) { background:var(--surface,#fff)!important; padding:10px!important; border-radius:6px!important; }
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr.mobileDetailsExpanded .feedbackCell .attendanceTextPreview:not([hidden]) { height:auto!important; max-height:none!important; }
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr.mobileDetailsExpanded .feedbackCell .attendanceTextClamp { display:block!important; -webkit-line-clamp:unset!important; max-height:none!important; overflow:visible!important; white-space:pre-wrap!important; }
} }

@layer ntcenter-brand261 { @media(max-width:600px) {
 html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows tr[data-code] { height:auto!important; min-height:0!important; max-height:none!important; overflow:visible!important; grid-template-rows:none!important; grid-auto-rows:auto!important; align-items:start!important; }
 html body #workspace[data-view="attendance"] #attendanceView.gradeOnlyView #attendanceRows .assessmentClearButton { grid-column:2!important; justify-self:end!important; min-height:44px!important; }
} }

/* 270: five pending choices need a full row; the 78px slot is for one saved status only. */
@layer ntcenter-brand261 { @media(max-width:920px) {
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr:has(.mobileAttendanceChoices.pending) > .activeSessionCell {
  grid-column:1 / -1!important; grid-row:2!important; width:100%!important; max-width:none!important; min-width:0!important; margin-left:0!important; justify-self:stretch!important; height:auto!important; padding:0 8px!important; box-sizing:border-box!important;
 }
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr:has(.mobileAttendanceChoices.pending) > .learningProgressCell { grid-row:3!important; }
 html body #workspace #attendanceView #attendanceRows tr:has(.mobileAttendanceChoices.pending) .mobileLearnerActions269 { padding-left:0!important; }
 html body #workspace #attendanceView #attendanceRows tr .mobileAttendanceChoices.pending {
  display:grid!important; grid-template-columns:repeat(5,minmax(44px,1fr))!important; gap:4px!important; width:100%!important; min-width:0!important; max-width:none!important; height:auto!important; min-height:44px!important;
 }
 html body #workspace #attendanceView #attendanceRows tr .mobileAttendanceChoices.pending > .mobileAttendanceLatest { display:none!important; }
 html body #workspace #attendanceView #attendanceRows tr .mobileAttendanceChoices.pending > [data-action="setQuickStatus"] { display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; min-width:44px!important; width:100%!important; max-width:none!important; min-height:44px!important; height:auto!important; padding:4px 2px!important; box-sizing:border-box!important; }
 html body #workspace #attendanceView #attendanceRows tr .mobileAttendanceChoices.pending > [data-action="setQuickStatus"] span { font-size:11px!important; line-height:16px!important; white-space:nowrap!important; }
} }

/* 271: full status menu is discoverable; inline disclosures are plain text actions. */
@layer ntcenter-brand261 { @media(max-width:920px) {
 html body #workspace #attendanceView #attendanceRows .mobileAttendanceChoices > .mobileAllStatuses271 { display:none!important; }
 html body #workspace #attendanceView #attendanceRows .mobileAttendanceChoices.pending > .mobileAllStatuses271 { display:flex!important; grid-column:1 / -1!important; align-items:center!important; justify-content:flex-end!important; flex-direction:row!important; gap:5px!important; width:100%!important; max-width:none!important; min-height:44px!important; height:auto!important; padding:4px 2px!important; border:0!important; border-radius:0!important; background:transparent!important; color:var(--primary,#087f8c)!important; font-size:12px!important; box-sizing:border-box!important; }
 html body #workspace #attendanceView .mobileLearnerActions269 > button,
 html body #workspace #attendanceView .mobileLearnerActions269 > button[aria-expanded="true"] { border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; padding:6px!important; min-height:44px!important; }
 html body #workspace #attendanceView .mobileLearnerActions269 > button[aria-expanded="true"] { color:var(--primary,#087f8c)!important; text-decoration:underline!important; text-underline-offset:4px; }
 html body #workspace #attendanceView :is(.mobileLearnerActions269 > button,.mobileAllStatuses271):focus-visible { outline:2px solid var(--primary,#087f8c)!important; outline-offset:2px; }
} }

/* TESTDD274: operational tables use aligned text and natural content height. */
html body #auditView .auditTable :is(th,td) { text-align:left; vertical-align:middle; padding:10px 12px; }
html body #auditView .auditCompactDetail { display:flex; align-items:center; justify-content:space-between; gap:12px; }
html body #auditView .auditCompactText { flex:1; min-width:0; }
html body #auditView .auditDetailButton { flex:none; min-height:44px; margin:0; }
html body #accountDialog .accountSavedPresetBar { padding:10px; gap:10px; border-radius:6px; }
html body #accountDialog .permissionGroupGrid { gap:10px; }
html body #accountDialog .accountRolePolicy274 { margin:0 0 12px; padding:10px 12px; background:var(--accent-soft); line-height:1.5; }
html body .reportPager274,html body .studentListToolbar274 { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:10px 0; }
html body .studentListToolbar274 h3 { margin:0; margin-right:auto; }
html body .reportPager274>span { margin-right:auto; }
html body .reportPager274 label,html body .studentListToolbar274 label { display:flex; align-items:center; gap:8px; margin:0; }
html body .reportPager274 :is(select,button),html body .studentListToolbar274 select { width:auto; min-height:44px; }
html body .reportPager274>div { display:flex; gap:8px; }

/* TESTDD275: keep the permission preset explanation readable on phones. */
@media(max-width:600px) {
 html body #accountDialog .accountPermissionPresetBar { grid-template-columns:minmax(0,1fr); align-items:start; }
 html body #accountDialog .accountPermissionPresetBar > :is(label,p) { min-width:0; width:auto; }
}

/* 276: scoped report density; keep data, zoom preference and shared charts intact. */
@layer ntcenter-brand261 {
  html body #revenueSegmentReport .revenueBoardCard { align-self: start !important; min-width: 0 !important; grid-column: auto !important; }
  html body #revenueSegmentReport .revenueBoardGrid { align-items: start !important; }
  html body #revenueSegmentReport .revenueAdjustmentSections {
    padding: 6px !important; gap: 8px !important; max-height: min(60dvh,520px) !important; overflow: auto !important;
  }
  html body #revenueSegmentReport .revenueAdjustmentTableWrap { max-height: none !important; overflow: auto !important; }
  html body #revenueSegmentReport .revenueAdjustmentTable {
    width: 100% !important; min-width: 620px !important; table-layout: auto !important; font-variant-numeric: tabular-nums;
  }
  html body #revenueSegmentReport .revenueAdjustmentTable th { width: auto !important; }
  html body #revenueSegmentReport .revenueAdjustmentTable :is(th,td) {
    padding: 6px 8px !important; font-size: 13px !important; line-height: 1.4 !important; vertical-align: top !important;
  }
  html body #revenueSegmentReport .revenueAdjustmentTable :is(th,td):first-child { min-width: 140px !important; text-align: left !important; }
  html body #revenueSegmentReport :is(.revenueDiscountTable,.revenueVoucherTable) :is(th,td):nth-child(n+3) { white-space: nowrap !important; text-align: right !important; }
  html body #revenueSegmentReport .revenueDiscountTable :is(th,td):nth-child(3),
  html body #revenueSegmentReport .revenueVoucherTable :is(th,td):nth-child(6) { white-space: normal !important; text-align: left !important; }
  html body #revenueSegmentReport .revenueAdjustmentTable tfoot td[colspan] { white-space: normal !important; text-align: left !important; }
  html body #revenueSegmentReport .revenueAdjustmentTable small { display: block !important; margin-top: 2px !important; }
  html body :is(.revenueBoardGrid.movement,#studentMovementGroups) { align-items: start !important; gap: 12px !important; }
  @media(min-width:1400px) {
    html body .revenueDetailColumns .revenueBoardGrid.movement,
    html body #studentMovementGroups { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  }
  @media(max-width:1399px) {
    html body .revenueDetailColumns .revenueBoardGrid.movement,
    html body #studentMovementGroups { grid-template-columns: minmax(0,1fr) !important; }
  }
  /* A dialog's outer heading stays fixed; nested class/chart headings must scroll. */
  html body #reportDetailDialog .reportDetailBody .statusPieCard > header {
    position: static !important; top: auto !important; z-index: auto !important;
    border: 0 !important; padding: 0 !important; margin: 0 !important;
  }
  html body .tuitionTimingHeading { display: flex !important; align-items: baseline !important; flex-wrap: wrap !important; gap: 8px 12px !important; margin: 0 0 10px !important; }
  html body .tuitionTimingHeading h3 { margin: 0 !important; }
  html body .tuitionTimingHeading .reportSecondaryDetails { margin-left: auto !important; }
  html body .tuitionTimingReport .statusAreaGrid > section:has(> .statusPieCard) {
    grid-template-columns: 112px minmax(0,1fr) !important; gap: 8px !important; padding: 12px !important;
  }
  html body .tuitionTimingReport .donutStage,
  html body #reportDetailDialog .tuitionTimingClass .donutStage { width: 112px !important; height: 112px !important; }
  html body .tuitionTimingReport .donutCenter,
  html body #reportDetailDialog .tuitionTimingClass .donutCenter { inset: 22px !important; }
  html body .tuitionTimingReport .donutLegend,
  html body #reportDetailDialog .tuitionTimingClass .donutLegend {
    align-content: start !important; align-self: center !important; grid-auto-rows: min-content !important;
    grid-template-columns: minmax(0,1fr) !important;
  }
  html body :is(.tuitionTimingReport,.tuitionTimingClass) .timingExcluded {
    display: flex !important; flex-wrap: wrap !important; gap: 4px 16px !important; margin: 0 !important; font-size: 13px !important;
  }
  html body .tuitionTimingReport .statusAreaGrid > section > button { grid-column: 1 / -1 !important; justify-self: end !important; }
  html body #reportDetailDialog .tuitionTimingClass { min-width: 0 !important; display: grid !important; gap: 8px !important; margin: 0 0 18px !important; }
  html body #reportDetailDialog .tuitionTimingClass .statusPieCard { padding: 0 !important; margin: 0 !important; }
  html body #reportDetailDialog .tuitionTimingClass .ntDonut { grid-template-columns: 112px minmax(0,1fr) !important; gap: 8px !important; padding: 0 !important; }
  html body #reportDetailDialog .tuitionTimingClass .dataTable small { display: block !important; font-size: 12px !important; }
  html body #reportDetailDialog .tuitionTimingClass .dataTable { min-width: 440px !important; width: 100% !important; }
  html body #reportDetailDialog .tuitionTimingClass .reportRowsScroll { max-width: 100% !important; overflow: auto !important; }
  @media(max-width:600px) {
    html body .tuitionTimingReport .statusAreaGrid > section:has(> .statusPieCard),
    html body #reportDetailDialog .tuitionTimingClass .ntDonut { grid-template-columns: 88px minmax(0,1fr) !important; }
    html body .tuitionTimingReport .donutStage,
    html body #reportDetailDialog .tuitionTimingClass .donutStage { width: 88px !important; height: 88px !important; }
    html body .tuitionTimingReport .donutCenter,
    html body #reportDetailDialog .tuitionTimingClass .donutCenter { inset: 15px !important; }
  }
}
/* TESTDD278: one table and one bottom pager across PLL screens. */
#pllView .pllFooter278{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-top:1px solid var(--border,#dce6eb);background:#f7fafb;flex-wrap:wrap}
#pllView .pllFooter278 label{display:flex;align-items:center;gap:8px;font-size:13px;margin:0}
#pllView .pllFooter278 select{width:auto;min-height:38px;padding:6px 28px 6px 10px}
#pllView .pllPager{display:flex;align-items:center;gap:14px;margin:0;flex-wrap:wrap}
#pllView .pllPager nav{display:flex;gap:6px}
#pllView .pllPager button{min-height:40px;padding:8px 13px;border:1px solid #dce6eb;background:white;border-radius:6px;color:#0b5362}
#pllView .pllPager button:disabled{opacity:.5;cursor:default}
#pllView .pllHistoryFilters{display:grid;grid-template-columns:200px minmax(220px,1fr) 190px;align-items:end;gap:12px;padding:12px 16px}
#pllView .pllHistoryFilters h3{display:none}
#pllView .pllHistoryFilters input,#pllView .pllHistoryFilters select{width:100%;min-width:0;min-height:42px}
#pllView .pllHistoryFilters .dateRangeField{margin:0}
#pllView .pllTable{width:100%;table-layout:auto}
#pllView .pllTable th,#pllView .pllTable td{padding:10px 12px;vertical-align:top}
#pllView .pllToolbar{padding:12px 16px;gap:10px;min-height:0}
#pllView .pllToolbar .pllPageControls:empty{display:none}
#pllReportView .pllSummaryTable{width:100%;table-layout:fixed}
#pllReportView .pllSummaryTable td,#pllReportView .pllSummaryTable th{padding:9px 12px;border-bottom:1px solid #e1e9ed;text-align:right}
#pllReportView .pllSummaryTable td:first-child,#pllReportView .pllSummaryTable th:first-child{text-align:left;width:25%}
#pllReportView #pllReportSummary{display:block;min-height:0}
#pllReportView .pllReportFilters{gap:10px;padding:12px 16px;align-items:end}
#pllReportView #pllReportTotals{gap:6px;margin:10px 0}
#pllReportView #pllReportTotals>*{padding:7px 10px;border-radius:5px;font-size:13px}
#pllView .pllFilters278{display:flex;flex-wrap:wrap;align-items:end;gap:10px;padding:12px 16px;border-bottom:1px solid #dce6eb}
.pllFilters278 label{display:grid;gap:5px;font-size:13px;color:#395563;margin:0}
.pllFilters278 .pllSearch278{flex:1;min-width:180px}
.pllFilters278 input,.pllFilters278 select{min-height:42px;width:100%;min-width:0}
#reminderStatus278{padding:10px 16px;margin:0;font-size:13px;color:#395563}
.pllReminderTable278{width:100%}
.pllReminderTable278 td,.pllReminderTable278 th{vertical-align:top;padding:10px 12px}
.pllReminderTable278 small{display:block;margin-top:4px;color:#526977;max-width:320px;font-size:12px;line-height:1.5}
.pllReminderTable278 button{padding:7px 10px;min-height:42px;white-space:nowrap}
.reminderPreview278{border:1px solid #d9e3e8;border-radius:10px;padding:0;width:min(1000px,94vw);max-height:94dvh;color:#0b2e3b}
.reminderPreview278::backdrop{background:rgb(9 29 39 / .45)}
.reminderPreview278 header,.reminderPreview278 footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:white}
.reminderPreview278 header{border-bottom:1px solid #d9e3e8}.reminderPreview278 h2{margin:0;font-size:19px}
.reminderPreview278 header button{min-width:44px;min-height:44px;border:1px solid #d9e3e8;border-radius:6px;background:white;font-size:24px}
#reminderPreviewContent278{padding:16px;background:#f0f4f6;min-height:120px}#reminderPreviewContent278 img{display:block;width:100%;height:auto}
@media(max-width:767px){
 #pllView .pllHistoryFilters{grid-template-columns:1fr 1fr;gap:8px;padding:10px}#pllView .pllHistoryFilters input[type=search]{grid-column:1/-1}
 #pllView .pllFooter278{padding:10px;gap:10px}#pllView .pllFooter278 .pllPager{flex:1;justify-content:space-between}
 #pllView .pllFilters278{padding:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px}#pllView .pllFilters278 .pllSearch278{grid-column:1/-1;min-width:0}#pllView .pllFilters278 button{min-height:44px;padding:7px 9px;font-size:13px}
 #pllView .pllReminderTable278{display:block;min-width:0}#pllView .pllReminderTable278 thead{display:none}#pllView .pllReminderTable278 tbody{display:block}
 #pllView .pllReminderTable278 tr{display:grid;grid-template-columns:32px minmax(0,1fr);padding:12px;gap:6px 8px;border-bottom:1px solid #d9e3e8;background:white}
 #pllView .pllReminderTable278 td{display:block;border:0;padding:0;min-width:0;overflow-wrap:anywhere}#pllView .pllReminderTable278 td:nth-child(2){display:none}
 #pllView .pllReminderTable278 td:first-child{grid-column:1;grid-row:1}#pllView .pllReminderTable278 td:nth-child(5){grid-column:2;grid-row:1}
 #pllView .pllReminderTable278 td:nth-child(3),#pllView .pllReminderTable278 td:nth-child(4),#pllView .pllReminderTable278 td:nth-child(6),#pllView .pllReminderTable278 td:nth-child(7),#pllView .pllReminderTable278 td:nth-child(8){grid-column:2}
 #pllView .pllReminderTable278 input[type=checkbox]{width:22px;height:22px;margin:8px 0}#pllReportView .pllSummaryTable{min-width:640px}#pllReportView #pllReportSummary{overflow-x:auto}
}

#pllView .pllHistoryHeader{padding:12px 16px;border-bottom:1px solid #dce6eb}
#pllView .pllHistoryHeader>div{display:grid;grid-template-columns:150px 150px minmax(180px,1fr) 180px;gap:10px;align-items:end;width:100%}
#pllView .pllHistoryHeader strong{display:none}
#pllView .pllHistoryHeader label{display:grid;gap:5px;font-size:13px;margin:0}
#pllView .pllHistoryHeader :is(input,select){width:100%;min-width:0;min-height:42px}
@media(max-width:767px){#pllView .pllHistoryHeader{padding:10px}#pllView .pllHistoryHeader>div{grid-template-columns:1fr 1fr;gap:8px}#pllView .pllHistoryHeader input[type=search]{grid-column:1/-1;grid-row:2}#pllView .pllHistoryHeader select{grid-column:1/-1}}
#pllView .pllHistoryHeader>div{grid-template-columns:190px minmax(180px,1fr) 210px}
#pllView .pllHistoryHeader .rangeControl{width:100%;min-width:0}
#pllReportView .pllSummaryTable button{display:inline-flex;align-items:center;border:0;border-radius:4px;background:transparent;color:#0a6573;font:inherit;padding:5px 0;min-height:34px;text-align:left}
#pllReportView #pllReportSummary>.tableWrap{max-height:330px;overflow:auto}
#pllReportView .pllSummaryTable thead th{position:sticky;top:0;background:#f1f6f8;z-index:1}
#pllReportView .pllReportNotes278{margin:8px 0;font-size:13px;color:#4a606a}
#pllReportView .pllReportNotes278 summary{cursor:pointer;padding:7px 0;color:#78520f}
#pllReportView .pllReportNotes278 .pllReportWarning{margin:5px 0;padding:10px 12px}
@media(min-width:1100px){#pllView .pllToolbar>[data-mobile-filter-shell]{display:grid;grid-template-columns:132px 130px minmax(170px,1fr) 210px auto auto;align-items:center;gap:10px;width:100%}#pllView .pllToolbar .pllInlineControl{gap:5px}#pllView .pllToolbar .pllInlineControl>span{display:none}#pllView .pllToolbar label{min-width:0;margin:0}#pllView .pllToolbar button{white-space:nowrap;padding:9px 12px}}
@media(max-width:767px){
 #pllView .pllHistoryHeader>div{grid-template-columns:1fr 1fr}#pllView .pllHistoryHeader .rangeControl{grid-column:1;grid-row:1}#pllView #pllHistoryStatus{grid-column:2;grid-row:1}#pllView .pllHistoryHeader input[type=search]{grid-row:2;grid-column:1/-1}
 #pllReportView .pllReportFilters{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px}
 #pllReportView .pllReportFilters .pllAdvanced278{display:none}#pllReportView .pllReportFilters.mobileFiltersExpanded .pllAdvanced278{display:grid}
 #pllReportView .pllReportFilters .pllReportSearch{grid-column:1/-1;grid-row:2;margin:0}
 #pllReportView .pllReportFilters .mobileFilterToggle{display:inline-flex;justify-content:center;align-items:center;align-self:end;min-height:44px}
 #pllReportView .pllReportFilters label{min-width:0}#pllReportView .pllReportFilters input,#pllReportView .pllReportFilters select{width:100%;min-width:0;min-height:44px}
 #pllReportView .pllReportFilters button{min-height:44px;white-space:nowrap;padding:8px 10px}
 #pllReportView #pllReportSummary>.tableWrap{max-height:285px}#pllReportView .pllSummaryTable button{min-height:44px}
 #pllReportView #pllReportFeedback{font-size:12px;margin:8px 0}#pllReportView .pllReportShell{padding:10px}
 #pllView .pllHistoryTable{display:block;min-width:0}#pllView .pllHistoryTable thead{display:none}#pllView .pllHistoryTable tbody{display:block}
 #pllView .pllHistoryTable tr{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:12px;border-bottom:1px solid #dce6eb;min-height:0;background:white}
 #pllView .pllHistoryTable td{display:block;min-width:0;border:0;padding:0;overflow-wrap:anywhere;text-align:left}
 #pllView .pllHistoryTable td:before{display:none}#pllView .pllHistoryTable td:first-child{display:none}
 #pllView .pllHistoryTable td:nth-child(4){grid-column:1;grid-row:1;font-weight:600}#pllView .pllHistoryTable td:nth-child(5){grid-column:1;grid-row:2}
 #pllView .pllHistoryTable td:nth-child(2){grid-column:1;grid-row:3;font-size:12px;color:#4a606a}#pllView .pllHistoryTable td:nth-child(3){grid-column:2;grid-row:3;font-size:12px;color:#4a606a}
 #pllView .pllHistoryTable td:nth-child(6){grid-column:1;grid-row:4;font-size:13px}#pllView .pllHistoryTable td:nth-child(6):before{display:inline;content:'Ảnh: '}
 #pllView .pllHistoryTable td:nth-child(7){grid-column:2;grid-row:4;font-size:13px}#pllView .pllHistoryTable td:nth-child(7):before{display:inline;content:'Nội dung: '}
 #pllView .pllHistoryTable tr:not(:has(td[colspan]))>td:nth-child(8){grid-column:2;grid-row:1/3;display:flex;gap:6px;align-self:center}#pllView .pllHistoryTable td .miniBtn{min-width:44px;min-height:44px}
}

@media(max-width:767px){#pllView :is(.pllHistoryTable,.pllReminderTable278) tr:has(td[colspan]){display:block}#pllView :is(.pllHistoryTable,.pllReminderTable278) td[colspan]{display:block!important;padding:12px!important}}
#pllView :is(.pllHistoryTable,.pllTable,.pllReminderTable278) th{font-size:12px;text-transform:none;letter-spacing:0}
#pllReportView .pllSummaryTable :is(td,th){font-variant-numeric:tabular-nums}
#pllView .pllReminderTable278 td:nth-child(6){font-variant-numeric:tabular-nums}
#pllReportView .pllSummaryTable button:focus-visible{outline:2px solid #087f8c;outline-offset:2px}

/* TESTDD279: one shared tuition configuration, scoped to PLL only. */
#pllView [data-pll-panel-view="tuition"]{max-width:1320px;margin-inline:auto;padding:16px;box-sizing:border-box}
#pllView .pllShared279{margin:10px 0 18px;color:#526977;font-size:14px;line-height:1.5}
#pllView .pllCommon279{display:grid;grid-template-columns:minmax(320px,.85fr) minmax(440px,1.3fr);gap:24px;align-items:start}
#pllView .pllRates279 .pllRate{display:grid;grid-template-columns:minmax(0,1fr) 130px 44px;gap:8px;margin:8px 0}
#pllView .pllRates279 .pllRate input{width:100%;min-width:0;min-height:44px;padding:8px 10px;box-sizing:border-box}
#pllView .pllRates279 .pllRate [data-field="amount"]{text-align:right;font-variant-numeric:tabular-nums}
#pllView .pllRates279 header,#pllView .bankConfigPanel>header{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:0 0 12px;margin:0;min-height:0;border:0;background:none}
#pllView .bankConfigPanel>header>div{flex:1 1 100%}#pllView .bankConfigPanel>header h3{font-size:18px;margin:0 0 6px}#pllView .bankConfigPanel>header p{margin:0;font-size:13px}#pllView .bankConfigPanel .eyebrow{display:none}
#pllView .paymentBankCard{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:12px;margin:0 0 12px;border:1px solid #d9e3e8;border-radius:6px;box-shadow:none}
#pllView .paymentBankQr img{width:96px;height:96px;object-fit:contain}#pllView .paymentBankQr label{min-height:44px;cursor:pointer;font-size:13px}
#pllView .paymentBankFields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#pllView .paymentBankFields label{font-size:13px;min-width:0}
#pllView .paymentBankFields input{width:100%;min-width:0;min-height:44px;box-sizing:border-box;padding:8px}
#pllView .paymentBankFields input[type="checkbox"]{width:18px;min-height:18px;height:18px}#pllView .bankActive{display:flex;align-items:center;gap:8px;min-height:44px}
#pllView .paymentBankClasses{grid-column:1/-1}#pllView .paymentBankClasses>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;max-height:190px;overflow:auto;margin-top:8px}
#pllView .paymentBankClasses label{display:flex;align-items:center;gap:8px;min-height:44px;font-size:13px;overflow-wrap:anywhere}#pllView .paymentBankClasses input{width:18px;height:18px}
#pllView .paymentBankActions{grid-column:1/-1;justify-content:flex-end}#pllView .paymentBankList>.studentDetailEmpty{padding:20px 12px;min-height:0;font-size:14px}
#pllView .pllAdvancedSettings279{margin-top:20px;border-top:1px solid #d9e3e8;padding-top:14px}#pllView .pllAdvancedSettings279>summary{cursor:pointer;min-height:44px;font-weight:600;color:#087f8c}
#pllView .pllAdvancedSettings279 .pllSettingsGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}
#pllView .pllAdvancedSettings279 .pllVarCards{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}#pllView .pllAdvancedSettings279 .pllVarCard{padding:7px 10px;min-height:44px;width:auto}#pllView .pllAdvancedSettings279 .pllVarCard code{display:none}
#pllView .pllAdvancedSettings279 .pllMessageToolbar{display:flex;flex-wrap:wrap;gap:6px}#pllView .pllAdvancedSettings279 .pllMessageToolbar select{width:auto;min-width:100px}
#pllView .pllAdvancedSettings279 .pllMessageEditor{min-height:120px;max-height:280px;overflow:auto;padding:12px;font-size:16px}
#pllView .pllAdvancedSettings279 .pllRule{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:8px 0}#pllView .pllAdvancedSettings279 .pllRule input{width:80px;min-height:44px}
@media(max-width:1100px){#pllView .pllCommon279{grid-template-columns:1fr;gap:20px}#pllView .pllRates279{max-width:620px}}
@media(max-width:600px){#pllView [data-pll-panel-view="tuition"]{padding:12px}#pllView .paymentBankCard{grid-template-columns:80px minmax(0,1fr)}#pllView .paymentBankQr img{width:80px;height:80px}#pllView .paymentBankFields{grid-template-columns:1fr}#pllView .pllAdvancedSettings279 .pllSettingsGrid{grid-template-columns:1fr}#pllView .pllRates279 .pllRate{grid-template-columns:minmax(0,1fr) 110px 44px}#pllView .paymentBankClasses>div{grid-template-columns:1fr}}
#pllView .pllRates279 .pllRateList{display:grid;gap:8px}
#pllView .pllRates279 .pllRate{margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
#pllView .pllShared279 .textBtn{border:0;background:none;color:#087f8c;padding:6px 0;min-height:44px;font:inherit;font-weight:600;cursor:pointer}
#pllView .pllShared279 .textBtn:focus-visible{outline:2px solid #087f8c;outline-offset:2px}

/* TESTDD281: an extra offer filter must not squeeze search or the selected month. */
@media(max-width:1100px){
 #pllView .pllReminders278 .pllFilters278{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
 #pllView .pllReminders278 .pllFilters278 .pllSearch278{grid-column:1/-1;min-width:0}
}
@media(max-width:767px){
 #pllView .pllReminders278 .pllFilters278{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 #pllView .pllReminders278 .pllFilters278>label:first-child,#reminderBulk278{grid-column:1/-1}
}
.reminderPreview278[open]{display:flex;flex-direction:column;max-height:94dvh;overflow:hidden}
.reminderPreview278 header,.reminderPreview278 footer{flex:none}
#reminderPreviewContent278{min-height:0;overflow:auto;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}
#reminderPreviewContent278 img{width:auto;max-width:100%;max-height:calc(94dvh - 180px);object-fit:contain}

.pllNoticeCopy281{display:grid;gap:12px;max-width:920px}.pllNoticeCopy281 label{display:grid;gap:6px}.pllNoticeCopy281 textarea{width:100%;min-height:64px;resize:vertical}

/* 282: compact static / VietQR configuration; controls remain native on touch. */
#pllView .paymentBankFields select{width:100%;min-width:0;min-height:44px;padding:8px;box-sizing:border-box}
#pllView .bankMemo282,#pllView .bankPreview282{grid-column:1/-1}
#pllView .bankMemo282 small{line-height:1.5;color:#425d67}
#pllView .bankPreview282{display:flex;flex-wrap:wrap;align-items:end;gap:8px}
#pllView .bankPreview282 label{width:160px}#pllView .bankPreview282 span{flex-basis:100%;font-size:13px;overflow-wrap:anywhere}
#pllView .paymentBankQr img{background:white}

@media(max-width:600px){#pllView .paymentBankCard .paymentBankFields{grid-column:1/-1}#pllView .paymentBankQr{grid-column:1/-1;display:flex;align-items:center;gap:12px}#pllView .paymentBankQr:has(>i:only-child){display:none}}
/* 283: bank list is read-only; configuration opens in one scoped dialog. */
#pllView .bankConfigPanel>header>div{flex:1 1 220px}
#pllView .bankSummary283{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #d9e3e8;min-width:0}
#pllView .bankSummary283>div{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px}
#pllView .bankAccount283{font-variant-numeric:tabular-nums;font-size:16px;font-weight:600;overflow-wrap:anywhere}
#pllView .bankHolder283,#pllView .bankSummary283 small{grid-column:1/-1;color:#425d67;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
#pllView .bankStatus283{font-size:13px;color:#8b3e1b}#pllView .bankEmpty283{padding:12px 0;color:#425d67}
#pllView .bankDialog283{padding:0;border:1px solid #d9e3e8;border-radius:8px;width:min(860px,calc(100vw - 32px));max-height:calc(100dvh - 32px);box-sizing:border-box;color:var(--text,#12303d);background:#fff}
#pllView .bankDialog283[open]{display:flex;flex-direction:column}
#pllView .bankDialog283::backdrop{background:rgba(16,36,46,.42)}
#pllView .bankDialog283>header,#pllView .bankDialog283>footer{display:flex;align-items:center;gap:12px;flex:none;padding:14px 18px;margin:0;background:#fff}
#pllView .bankDialog283>header{border-bottom:1px solid #d9e3e8;justify-content:space-between}
#pllView .bankDialog283 h2{font-size:20px;margin:0}
#pllView .bankDialog283>footer{justify-content:flex-end;border-top:1px solid #d9e3e8}
#paymentBankEditor283{min-height:0;overflow:auto;padding:16px 18px;overscroll-behavior:contain}
#pllView .bankDialog283 .paymentBankCard{border:0;margin:0;padding:0}
#pllView .bankDialog283 .paymentBankActions{display:flex;justify-content:flex-start;margin-top:8px}
#pllView .bankDialog283 .paymentBankClasses>div{max-height:220px}
#paymentBankError283{margin:0;padding:0 18px 10px;color:#a51d29;font-size:14px;flex:none}
#paymentBankError283:empty{display:none}
@media(max-width:600px){#pllView .bankSummary283>div{grid-template-columns:minmax(0,1fr) auto}#pllView .bankAccount283{grid-column:1/-1}#pllView .bankDialog283{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}#paymentBankEditor283{padding:12px}#pllView .bankDialog283>header,#pllView .bankDialog283>footer{padding:12px}#pllView .bankDialog283 input,#pllView .bankDialog283 select{font-size:16px}#pllView .bankDialog283 .paymentBankClasses>div{max-height:180px}}
#pllView .bankDialog283 .paymentBankQr:has(>i:only-child){display:none}
#pllView .bankDialog283 .paymentBankCard:has(.paymentBankQr>i:only-child) .paymentBankFields{grid-column:1/-1}
#pllView .bankDialog283 .paymentBankQr label{position:relative}
#pllView .bankDialog283 .paymentBankQr input[type="file"]{position:absolute;width:1px;height:1px;min-height:0;padding:0;clip-path:inset(50%);overflow:hidden}
#pllView .bankDialog283 .paymentBankQr label:focus-within{outline:2px solid #087f8c;outline-offset:3px}
/* 284: constrain static placeholder as well as uploaded QR inside its grid track. */
#pllView .bankDialog283 .paymentBankQr{min-width:0;max-width:100%}
#pllView .bankDialog283 .paymentBankQr>i,#pllView .bankDialog283 .paymentBankQr>img{width:96px;height:96px;max-width:100%;box-sizing:border-box}
#pllView .noticeRich284{border:1px solid #ccd7df;border-radius:5px;background:#fff;min-width:0;margin-top:6px}
#pllView .noticeTools284{display:flex;align-items:center;flex-wrap:wrap;gap:4px;padding:6px;border-bottom:1px solid #d9e3e8}
#pllView .noticeTools284 button{min-width:40px;min-height:40px;padding:6px;border:0;background:transparent;color:#18364c;font-size:16px;cursor:pointer}
#pllView .noticeTools284 button:hover{background:#e6f3f5}
#pllView .noticeTools284 select{width:auto;max-width:140px;min-height:40px;padding:6px;font-size:14px}
#pllView .noticeEditable284{min-height:90px;padding:12px;font-size:16px;line-height:1.5;font-weight:400;color:#202634;white-space:pre-wrap;overflow-wrap:anywhere;outline-offset:2px}
#pllView .pllNoticeCopy281>label{display:block;min-width:0}
#pllView .noticeTools284 button[data-style284="b"]{font-weight:800}#pllView .noticeTools284 button[data-style284="i"]{font-style:italic}#pllView .noticeTools284 button[data-style284="u"]{text-decoration:underline}#pllView .noticeTools284 button[data-style284="s"]{text-decoration:line-through}
@media(max-width:600px){#pllView .bankDialog283 .paymentBankQr>i,#pllView .bankDialog283 .paymentBankQr>img{width:80px;height:80px}#pllView .noticeTools284 button{min-height:44px;min-width:44px}}

/* TESTDD289: bounded reminders table; filters, column headings and pager stay reachable. */
html body #workspace[data-view="pll"]:has(.pllReminders278:not(.hidden)){display:grid!important;grid-template-rows:auto minmax(0,1fr)!important;height:100dvh!important;min-height:0!important;overflow:hidden!important}
html body #workspace[data-view="pll"] #pllView:has(.pllReminders278:not(.hidden)){display:flex!important;flex-direction:column;align-self:stretch;height:var(--reminder-view-height,100%)!important;max-height:var(--reminder-view-height,100%)!important;min-height:0!important;overflow:hidden!important}
#pllView:has(.pllReminders278:not(.hidden))>.pllShell{flex:1;display:flex!important;flex-direction:column;min-height:0!important;overflow:hidden!important}
#pllView .pllReminders278:not(.hidden){flex:none;box-sizing:border-box;height:var(--reminder-panel-height,100%);min-height:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;overflow:hidden}
#pllView .pllReminders278 .reminderScroll288{min-height:0;max-height:none!important;height:auto!important;overflow-x:auto!important;overflow-y:auto!important;overscroll-behavior:contain;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch}
#pllView .pllReminderTable278 thead th{position:sticky!important;top:0!important;z-index:3;background:#edf4f7}
#pllView .pllReminders278 .pllFooter278{position:static;flex:none;margin:0}
.reminderPreview278 header,.reminderPreview278 footer{flex-wrap:wrap}
/* Composer structure follows Zeplao; the saved text/style contract stays unchanged. */
#pllView .noticeRich284{position:relative;border:1px solid #cbd9e3;border-radius:8px;background:#fff;min-width:0}
#pllView .noticeRich284:focus-within{border-color:#087f8c;outline:1px solid #087f8c}
#pllView .noticeTools284{position:relative;border-bottom:0;border-top:1px solid #e1e9ed;padding:6px 10px;gap:2px}
#pllView .noticeTools284[hidden],#pllView .noticeMenu288[hidden]{display:none!important}
#pllView .noticeTools284 button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border-radius:4px}
#pllView .noticeTools284 button[aria-pressed="true"]{background:#e5f2f4;color:#087f8c}
#pllView .noticeTools284 button:focus-visible{outline:2px solid #087f8c;outline-offset:1px}
#pllView .noticeTools284 button svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#pllView .noticeSmall288{font-size:12px}
#pllView [data-menu288="color"]{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--notice-color288,#202634);text-underline-offset:5px;font-size:20px}
#pllView .noticeMenuWrap288{position:relative}
#pllView .noticeMenu288{position:absolute;bottom:calc(100% + 6px);left:0;z-index:8;display:flex;flex-wrap:wrap;width:max-content;max-width:230px;gap:2px;padding:6px;background:#fff;border:1px solid #cbd9e3;border-radius:6px;box-shadow:0 3px 10px #102f3e1a}
#pllView .noticeMenu288 button span{width:23px;height:23px;border-radius:50%;border:1px solid #8ca2ad}
#pllView .noticeMenu288 button[aria-checked="true"]{outline:2px solid #087f8c;outline-offset:-3px}
#pllView .noticeMenu288[aria-label="Cỡ chữ"]{display:grid;min-width:128px}
#pllView .noticeHint288{display:block;padding:4px 12px 8px;font-size:12px;color:#526977}
@media(max-width:600px){#pllView .noticeTools284{padding:4px;gap:0}#pllView .noticeTools284 button{min-width:44px;padding:5px;min-height:44px}#pllView .noticeMenu288{max-width:220px}#pllView .noticeMenu288[aria-label="Màu chữ"]{left:-120px}#pllView .noticeEditable284{font-size:16px;min-height:80px}}

#pllView .noticeTools284 [data-style284="b"]{font-weight:700}
#pllView .noticeTools284 [data-style284="i"]{font-style:italic}
#pllView .noticeTools284 [data-style284="u"]{text-decoration:underline}
#pllView .noticeTools284 [data-style284="s"]{text-decoration:line-through}

/* TESTDD290: keep only cells sticky inside the measured table scrollport. */
#pllView .pllReminderTable278 thead{position:static!important}
#pllView .pllReminders278 .pllFilters278{padding:10px 12px;gap:8px}
#pllView .pllReminders278 .pllFooter278{padding:8px 12px;min-height:44px;box-sizing:border-box}
#pllView .pllReminders278 .reminderScroll288{scrollbar-gutter:stable;scroll-padding-top:48px}

/* TESTDD294: compact image copy editors and independent optional Zalo text. */
#pllView .noticeRich284 .noticeEditable284{min-height:64px;padding:10px 12px}
#pllView .noticeRich284 .noticeTools284{padding:3px 6px;display:flex;flex-wrap:wrap;align-items:center}
#pllView .noticeHint288[hidden]{display:none!important}
#pllView .noticeHelp294{margin:8px 0 12px;font-size:13px;line-height:1.5;color:#526977}
#pllView .noticeSendToggle294{display:flex;align-items:center;gap:9px;min-height:44px;margin:8px 0}
#pllView .noticeSendToggle294 input{width:20px;min-height:20px;height:20px;flex:none;margin:0}
#noticeTextFields294[hidden]{display:none!important}
#noticeTextTemplate294{display:block;width:100%;min-height:88px;resize:vertical;padding:10px 12px;font-size:16px;line-height:1.5}
.noticeTextPreview294{margin-top:12px;padding:12px;background:white;border:1px solid #ccd7df;border-radius:5px;overflow-wrap:anywhere}
.noticeTextPreview294 p{margin:8px 0 0;white-space:pre-wrap;line-height:1.5}

/* 296: stable neutral scope loading and full-width preview text below the image. */
.attendanceSkeleton296 td{padding:0!important}
.attendanceSkeleton296 div{height:min(58vh,520px);min-height:240px;background:repeating-linear-gradient(to bottom,#f5f8f9 0,#f5f8f9 63px,#e5edef 63px,#e5edef 64px);pointer-events:none}
#reminderPreviewContent278 img{flex-shrink:0;align-self:center}
#reminderPreviewContent278 .noticeTextPreview294{width:100%;box-sizing:border-box;flex-shrink:0}

@layer ntcenter-brand261 {
/* 302: local history grid, including tablet cards; do not inherit generic card widths. */
@media(max-width:920px){
 html body #workspace[data-view="pll"] #pllView .pllHistoryHeader>div{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryHeader :is(.rangeControl,#pllHistoryStatus,input[type="search"]){grid-column:1!important;grid-row:auto!important;width:100%!important;min-width:0!important;margin:0!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable tr:not(:has(td[colspan])){display:grid!important;grid-template-columns:minmax(0,1fr) 94px!important;gap:6px 10px!important;padding:12px!important;min-height:0!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable tr:not(:has(td[colspan]))>td{width:auto!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;display:block!important;border:0!important;text-align:left!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable td:before{display:none!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable tr:not(:has(td[colspan]))>td:first-child{display:none!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable td:nth-child(4){grid-column:1!important;grid-row:1!important;font-weight:600}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable td:nth-child(5){grid-column:1!important;grid-row:2!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable td:nth-child(2){grid-column:1!important;grid-row:3!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable td:nth-child(3){grid-column:2!important;grid-row:3!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable td:nth-child(6){grid-column:1!important;grid-row:4!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable td:nth-child(7){grid-column:2!important;grid-row:4!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable tr:not(:has(td[colspan]))>td:nth-child(6):before{display:inline!important;content:'Ảnh: '!important;font-size:13px!important;text-transform:none!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable tr:not(:has(td[colspan]))>td:nth-child(7):before{display:inline!important;content:'Chữ: '!important;font-size:13px!important;text-transform:none!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable tr:not(:has(td[colspan]))>td:nth-child(8){grid-column:2!important;grid-row:1/3!important;display:flex!important;gap:6px!important;align-self:start!important;justify-content:flex-end!important}
 html body #workspace[data-view="pll"] #pllView .pllHistoryTable td .miniBtn{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;flex:0 0 44px!important;padding:0!important;margin:0!important}
}
}
.pllReminderSubjects302{display:flex;flex-wrap:wrap;gap:4px 8px;line-height:1.5}
.pllReminderSubjects302 span{white-space:normal}
@media(min-width:921px){#pllView .pllReminderTable278 td:nth-child(7){width:24%}}
@layer ntcenter-brand261 {
@media(min-width:1100px){html body #revenueMovementBoard .revenueBoardGrid.movement{grid-template-columns:minmax(0,1fr)!important}}
}

/*306: only the progress table scrolls; header, progress and controls stay visible. */
#pllProgressDialog { height:min(820px,calc(100dvh - 24px)); }
#pllProgressDialog > form { height:100%; max-height:100%!important; box-sizing:border-box; display:grid!important; grid-template-rows:auto auto minmax(0,1fr) auto; overflow:hidden!important; }
#pllProgressDialog .pllProgressTableWrap { min-height:0; max-height:none; overflow:auto!important; overscroll-behavior:contain; }
#pllProgressDialog .pllProgressTable thead { position:sticky; top:0; z-index:2; background:var(--surface,#fff); }
#pllProgressDialog > form > footer { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; }

/* 321: editing an existing mark reveals five choices and needs the same full row. */
@layer ntcenter-brand261 { @media(max-width:920px) {
 html body #workspace[data-view="attendance"] #attendanceView.editMode:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > .activeSessionCell {
  grid-column:1 / -1!important; grid-row:2!important; width:100%!important; max-width:none!important; min-width:0!important; margin-left:0!important; justify-self:stretch!important; height:auto!important; padding:0 8px!important; box-sizing:border-box!important;
 }
 html body #workspace[data-view="attendance"] #attendanceView.editMode:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr > .learningProgressCell { grid-row:3!important; }
 html body #workspace #attendanceView.editMode #attendanceRows tr .mobileLearnerActions269 { padding-left:0!important; }
 html body #workspace #attendanceView.editMode #attendanceRows tr .mobileAttendanceChoices {
  display:grid!important; grid-template-columns:repeat(5,minmax(44px,1fr))!important; gap:4px!important; width:100%!important; min-width:0!important; max-width:none!important; height:auto!important; min-height:44px!important;
 }
 html body #workspace #attendanceView.editMode #attendanceRows tr .mobileAttendanceChoices > .mobileAttendanceLatest { display:none!important; }
 html body #workspace #attendanceView.editMode #attendanceRows tr .mobileAttendanceChoices > [data-action="setQuickStatus"] { display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; min-width:44px!important; width:100%!important; max-width:none!important; min-height:44px!important; height:auto!important; padding:4px 2px!important; box-sizing:border-box!important; }
 html body #workspace #attendanceView.editMode #attendanceRows tr .mobileAttendanceChoices > [data-action="setQuickStatus"] span { font-size:11px!important; line-height:16px!important; white-space:nowrap!important; }
} }


/* 322: newly marked, unsettled rows keep the full choice layout until compacted. */
@layer ntcenter-brand261 { @media(max-width:920px) {
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr.attendanceRecorded:not(.mobileAttendanceSettled) > .activeSessionCell {
  grid-column:1 / -1!important; grid-row:2!important; width:100%!important; max-width:none!important; min-width:0!important; margin-left:0!important; justify-self:stretch!important; height:auto!important; padding:0 8px!important; box-sizing:border-box!important;
 }
 html body #workspace[data-view="attendance"] #attendanceView:not(.learningProgressView):not(.gradeOnlyView) #attendanceRows tr.attendanceRecorded:not(.mobileAttendanceSettled) > .learningProgressCell { grid-row:3!important; }
 html body #workspace #attendanceView #attendanceRows tr.attendanceRecorded:not(.mobileAttendanceSettled) .mobileLearnerActions269 { padding-left:0!important; }
 html body #workspace #attendanceView #attendanceRows tr.attendanceRecorded:not(.mobileAttendanceSettled) .mobileAttendanceChoices {
  display:grid!important; grid-template-columns:repeat(5,minmax(44px,1fr))!important; gap:4px!important; width:100%!important; min-width:0!important; max-width:none!important; height:auto!important; min-height:44px!important;
 }
 html body #workspace #attendanceView #attendanceRows tr.attendanceRecorded:not(.mobileAttendanceSettled) .mobileAttendanceChoices > .mobileAttendanceLatest { display:none!important; }
 html body #workspace #attendanceView #attendanceRows tr.attendanceRecorded:not(.mobileAttendanceSettled) .mobileAttendanceChoices > [data-action="setQuickStatus"] { display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; min-width:44px!important; width:100%!important; max-width:none!important; min-height:44px!important; height:auto!important; padding:4px 2px!important; box-sizing:border-box!important; }
 html body #workspace #attendanceView #attendanceRows tr.attendanceRecorded:not(.mobileAttendanceSettled) .mobileAttendanceChoices > [data-action="setQuickStatus"] span { font-size:11px!important; line-height:16px!important; white-space:nowrap!important; }
} }


@layer ntcenter-brand261 { @media(max-width:920px) {
html body #workspace[data-view="attendance"] #attendanceView #attendanceMobileDateField{position:relative!important;display:flex!important;align-items:center!important;justify-content:center!important;min-width:0!important;padding:0 6px!important;box-sizing:border-box!important;text-align:center!important;isolation:isolate}
html body #workspace[data-view="attendance"] #attendanceView #attendanceMobileDateField #attendanceMobileDateLabel{display:block!important;flex:none!important;width:auto!important;max-width:100%!important;margin:0!important;padding:0!important;text-align:center!important;line-height:1.3!important;white-space:nowrap!important;pointer-events:none!important}
html body #workspace[data-view="attendance"] #attendanceView #attendanceMobileDateField>i{position:absolute!important;left:4px!important;top:4px!important;width:12px!important;height:12px!important;margin:0!important;font-size:10px!important;pointer-events:none!important}
html body #workspace[data-view="attendance"] #attendanceView #attendanceMobileDateField>.attendanceSaveLabel{position:absolute!important;bottom:2px!important;left:0!important;right:0!important;width:100%!important;margin:0!important;line-height:10px!important;font-size:9px!important;text-align:center!important;pointer-events:none!important}
html body #workspace[data-view="attendance"] #attendanceView #attendanceMobileDateField:has(.attendanceSaveLabel) #attendanceMobileDateLabel{transform:translateY(-4px)!important}
html body #workspace[data-view="attendance"] #attendanceView #attendanceMobileDateField>#attendanceDate{position:absolute!important;inset:0!important;display:block!important;width:100%!important;min-width:0!important;max-width:none!important;height:100%!important;min-height:0!important;margin:0!important;padding:0!important;opacity:0!important;z-index:2!important;cursor:pointer!important}
} }