/* Tasks & Assessments — light-theme restoration.
   The family shell (tetra-kairos-skin.css + tasks-assessments-family.css) is a
   dark composition that paints content surfaces with opaque `!important` rules.
   Those pages were authored light, so under the light portal theme the dark
   paints clobber the authored design and the page reads as forced-dark.
   This layer re-asserts the authored light surfaces, scoped strictly to
   :root[data-tetra-theme="light"], so dark/obsidian are untouched. Load it
   AFTER the skin and family sheet. */

:root[data-tetra-theme="light"]{
  --taf-surface:#ffffff;
  --taf-soft:#f8f9fd;
  --taf-line:#e7eaf3;
  --taf-text:#182033;
  --taf-muted:#6d7688;
  --taf-accent:#4b2aad;
}

/* ---- Family review/assignment/submission/gradebook opaque surfaces ---- */
:root[data-tetra-theme="light"] .orq-hero,
:root[data-tetra-theme="light"] .rw-summary-card,
:root[data-tetra-theme="light"] .rw-filter-card,
:root[data-tetra-theme="light"] .rw-table-card,
:root[data-tetra-theme="light"] .aw-card,
:root[data-tetra-theme="light"] .aw-summary-card,
:root[data-tetra-theme="light"] .aw-filter-card,
:root[data-tetra-theme="light"] .aw-table-view,
:root[data-tetra-theme="light"] .sw-panel,
:root[data-tetra-theme="light"] .sw-paper-card,
:root[data-tetra-theme="light"] .sw-table-card,
:root[data-tetra-theme="light"] .sw-summary-card,
:root[data-tetra-theme="light"] .sw-filter-card,
:root[data-tetra-theme="light"] .gb-summary-card,
:root[data-tetra-theme="light"] .gb-controls-card,
:root[data-tetra-theme="light"] .gb-matrix-card,
:root[data-tetra-theme="light"] .gb-detail,
:root[data-tetra-theme="light"] .gb-course-card,
:root[data-tetra-theme="light"] .gb-student-sheet{
  background:linear-gradient(180deg,#fff,#fbfbff)!important;
  background-color:#fff!important;
  background-image:none!important;
  border-color:#e7eaf3!important;
  box-shadow:0 16px 40px rgba(31,36,48,.08)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

:root[data-tetra-theme="light"] .orq-hero h1,
:root[data-tetra-theme="light"] .rw-summary-v,
:root[data-tetra-theme="light"] .rw-table-head h2,
:root[data-tetra-theme="light"] .rw-name,
:root[data-tetra-theme="light"] .aw-summary-v,
:root[data-tetra-theme="light"] .aw-card h3,
:root[data-tetra-theme="light"] .aw-stat-v,
:root[data-tetra-theme="light"] .sw-summary-v,
:root[data-tetra-theme="light"] .sw-cell-name,
:root[data-tetra-theme="light"] .sw-table-head h2,
:root[data-tetra-theme="light"] .gb-summary-v,
:root[data-tetra-theme="light"] .gb-matrix-head h2,
:root[data-tetra-theme="light"] .gb-student-name,
:root[data-tetra-theme="light"] .gb-score,
:root[data-tetra-theme="light"] .gb-detail-title{
  color:#0f172a!important;
}
:root[data-tetra-theme="light"] .orq-hero p,
:root[data-tetra-theme="light"] .rw-summary-k,
:root[data-tetra-theme="light"] .rw-summary-meta,
:root[data-tetra-theme="light"] .rw-count,
:root[data-tetra-theme="light"] .rw-pill-label,
:root[data-tetra-theme="light"] .rw-conf,
:root[data-tetra-theme="light"] .aw-summary-k,
:root[data-tetra-theme="light"] .aw-summary-meta,
:root[data-tetra-theme="light"] .aw-card-meta,
:root[data-tetra-theme="light"] .aw-stat-k,
:root[data-tetra-theme="light"] .aw-count,
:root[data-tetra-theme="light"] .sw-summary-k,
:root[data-tetra-theme="light"] .sw-summary-meta,
:root[data-tetra-theme="light"] .sw-cell-sub,
:root[data-tetra-theme="light"] .sw-count,
:root[data-tetra-theme="light"] .gb-summary-k,
:root[data-tetra-theme="light"] .gb-summary-meta,
:root[data-tetra-theme="light"] .gb-matrix-hint,
:root[data-tetra-theme="light"] .gb-student-meta,
:root[data-tetra-theme="light"] .gb-count{
  color:#6d7688!important;
}
/* Gradebook matrix + sheet tables (family paints these opaque violet) */
:root[data-tetra-theme="light"] .gb-matrix th,
:root[data-tetra-theme="light"] .gb-matrix td,
:root[data-tetra-theme="light"] .gb-sheet th,
:root[data-tetra-theme="light"] .gb-sheet td,
:root[data-tetra-theme="light"] .aw-table th,
:root[data-tetra-theme="light"] .aw-table td{
  background:#fff!important;
  color:#182033!important;
  border-color:#eef0f7!important;
}
:root[data-tetra-theme="light"] .gb-matrix thead th,
:root[data-tetra-theme="light"] .gb-sheet th,
:root[data-tetra-theme="light"] .aw-table th{
  background:#f5f6fb!important;
  color:#6d7688!important;
}
:root[data-tetra-theme="light"] .gb-matrix .sticky-student-col,
:root[data-tetra-theme="light"] .gb-matrix thead .sticky-student-col{
  background:#f5f6fb!important;
  border-right-color:#e7eaf3!important;
}
:root[data-tetra-theme="light"] .gb-matrix .gb-cell:hover,
:root[data-tetra-theme="light"] .aw-table tbody tr:hover td,
:root[data-tetra-theme="light"] .gb-sheet tbody tr:hover td{
  background:#faf8ff!important;
}
:root[data-tetra-theme="light"] .gb-detail-cell,
:root[data-tetra-theme="light"] .gb-detail-feedback{
  background:#fafbfd!important;
  border-color:#e7eaf3!important;
  color:#6d7688!important;
}
/* Recent-activity feed on the hub */
:root[data-tetra-theme="light"] .ag-activity,
:root[data-tetra-theme="light"] .ag-empty{
  background:#fff!important;
  border-color:#e7eaf3!important;
}
:root[data-tetra-theme="light"] .ag-activity-row{border-color:#f1f5f9!important;}
:root[data-tetra-theme="light"] .ag-activity-title{color:#0f172a!important;}
:root[data-tetra-theme="light"] .ag-activity-sub,
:root[data-tetra-theme="light"] .ag-activity-when{color:#6d7688!important;}
:root[data-tetra-theme="light"] .ag-activity-foot{background:#fafbfd!important;border-color:#f1f5f9!important;color:#6d7688!important;}

/* ---- Assignments & Grades overview hub ----
   The dark family layer sets near-white ink on the secondary hero action and
   the neutral KPI. On the white light-theme surfaces both effectively vanish. */
:root[data-tetra-theme="light"] .taf-family-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
}
:root[data-tetra-theme="light"] .taf-family-actions .k-btn{
  min-height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:10px 16px!important;
  border-width:1px!important;
  border-style:solid!important;
  border-radius:13px!important;
  text-decoration:none!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.2!important;
  white-space:nowrap!important;
}
:root[data-tetra-theme="light"] :is(.ag-hero,.ag-panel,.ag-today-card,.ag-flow-card,.ag-action){
  background:#fff!important;
  background-image:none!important;
  border-color:#dfe4ee!important;
  color:#182033!important;
}
:root[data-tetra-theme="light"] .taf-family-actions .k-btn:not(.primary){
  background:#fff!important;
  border-color:#7c5bd6!important;
  color:#4b2aad!important;
  box-shadow:0 5px 14px rgba(75,42,173,.09)!important;
}
:root[data-tetra-theme="light"] .taf-family-actions .k-btn:not(.primary):hover{
  background:#f3efff!important;
  border-color:#4b2aad!important;
  color:#351d86!important;
}
:root[data-tetra-theme="light"] .taf-family-actions .k-btn.primary{
  background:linear-gradient(135deg,#2f9bef,#4db6ff)!important;
  border-color:#258ed9!important;
  color:#071827!important;
}
:root[data-tetra-theme="light"] .ag-context,
:root[data-tetra-theme="light"] .ag-hero p,
:root[data-tetra-theme="light"] .ag-today-k,
:root[data-tetra-theme="light"] .ag-today-meta,
:root[data-tetra-theme="light"] .ag-flow-card span,
:root[data-tetra-theme="light"] .ag-action small,
:root[data-tetra-theme="light"] .ag-section-head .sub{
  color:#657084!important;
}
:root[data-tetra-theme="light"] .ag-today-v{color:#172033!important;}
:root[data-tetra-theme="light"] .ag-today-card.soft .ag-today-v{color:#5b21b6!important;}
:root[data-tetra-theme="light"] .ag-today-card.danger .ag-today-v{color:#c92a35!important;}
:root[data-tetra-theme="light"] .ag-today-card.warn .ag-today-v{color:#a16207!important;}
:root[data-tetra-theme="light"] .ag-today-card.good .ag-today-v{color:#0f766e!important;}
:root[data-tetra-theme="light"] :is(.ag-section-link,.ag-today-action a,.ag-action-arrow){
  color:#4b2aad!important;
}
:root[data-tetra-theme="light"] .ag-action-icon,
:root[data-tetra-theme="light"] .ag-flow-card::before{
  background:#e9f5ff!important;
  border:1px solid #b9ddf8!important;
  color:#1676b5!important;
}
:root[data-tetra-theme="light"] .ag-flow-card:not(:last-child)::after{border-color:#a9cfe9!important;}
@media(max-width:720px){
  :root[data-tetra-theme="light"] .taf-family-actions{width:100%!important;justify-content:stretch!important;}
  :root[data-tetra-theme="light"] .taf-family-actions .k-btn{flex:1 1 180px!important;}
}

/* Assignments overview v3 — one metric strip and no duplicate shortcut rail. */
body[data-ag-overview="v3"] .ag-workspace{grid-template-columns:minmax(0,1fr)!important}
body[data-ag-overview="v3"] .ag-main-stack{width:100%}
body[data-ag-overview="v3"] .ag-today{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
}
body[data-ag-overview="v3"] .ag-today-card{
  min-height:82px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:11px;
  row-gap:1px;
  padding:11px 13px!important;
}
body[data-ag-overview="v3"] .ag-today-v{
  grid-column:1;
  grid-row:1 / 3;
  min-width:30px;
  font-size:24px!important;
  color:#172033!important;
}
body[data-ag-overview="v3"] #agStatCollecting{color:#263b55!important}
body[data-ag-overview="v3"] .ag-today-k{
  grid-column:2;
  grid-row:1;
  align-self:end;
  font-size:9.5px!important;
}
body[data-ag-overview="v3"] .ag-today-meta{display:none!important}
body[data-ag-overview="v3"] .ag-today-action{
  grid-column:2;
  grid-row:2;
  align-self:start;
}
body[data-ag-overview="v3"] .ag-today-action a{font-size:10px!important}

@media(max-width:620px){
  body[data-ag-overview="v3"] .ag-today{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Eyebrows + accents: the family defaults to the dark-theme blue (#4db6ff),
   which washes out on a light canvas (~2:1 contrast). Realign to the portal's
   light primary (violet #4b2aad) so light-mode accents are readable and match
   the primary buttons. */
:root[data-tetra-theme="light"] .orq-eyebrow,
:root[data-tetra-theme="light"] .sb-eyebrow,
:root[data-tetra-theme="light"] .ag-eyebrow,
:root[data-tetra-theme="light"] .aw-eyebrow,
:root[data-tetra-theme="light"] .sw-eyebrow,
:root[data-tetra-theme="light"] .swk-eyebrow,
:root[data-tetra-theme="light"] .gb-eyebrow,
:root[data-tetra-theme="light"] .sx-eyebrow,
:root[data-tetra-theme="light"] .sp-eyebrow{
  background:#efe9ff!important;
  color:#4b2aad!important;
}

/* ---- Student Profile (.sp-*): same skin-collision as the sx- and OCR families. ---- */
:root[data-tetra-theme="light"] .sp-hero,
:root[data-tetra-theme="light"] .sp-summary-card,
:root[data-tetra-theme="light"] .sp-card{
  background:#fff!important;
  background-image:none!important;
  border-color:#e7eaf3!important;
  box-shadow:0 16px 40px rgba(31,36,48,.08)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
:root[data-tetra-theme="light"] .sp-detail-cell,
:root[data-tetra-theme="light"] .sp-timeline-item{
  background:#fafbfd!important;border-color:#e7eaf3!important;
}
:root[data-tetra-theme="light"] .sp-name,
:root[data-tetra-theme="light"] .sp-summary-v,
:root[data-tetra-theme="light"] .sp-timeline-title{
  color:#0f172a!important;
}
:root[data-tetra-theme="light"] .sp-meta,
:root[data-tetra-theme="light"] .sp-summary-k,
:root[data-tetra-theme="light"] .sp-summary-meta,
:root[data-tetra-theme="light"] .sp-timeline-text,
:root[data-tetra-theme="light"] .sp-timeline-time,
:root[data-tetra-theme="light"] .sp-state,
:root[data-tetra-theme="light"] .sp-progress-line{
  color:#6d7688!important;
}
:root[data-tetra-theme="light"] .sp-card-eyebrow{color:#4b2aad!important;}
:root[data-tetra-theme="light"] .sp-tab{color:#6d7688!important;background:transparent!important;}
:root[data-tetra-theme="light"] .sp-tab:hover{color:#182033!important;background:#faf8ff!important;}
:root[data-tetra-theme="light"] .sp-tab.active{color:#4b2aad!important;background:#efe9ff!important;border-color:#d8cdfc!important;}
:root[data-tetra-theme="light"] .sp-chip{background:#f1f5f9!important;border-color:#e7eaf3!important;color:#475569!important;}
:root[data-tetra-theme="light"] .sp-course-chip{background:#eef2ff!important;color:#3730a3!important;}
:root[data-tetra-theme="light"] .sp-bar{background:#f1f5f9!important;}
:root[data-tetra-theme="light"] .sp-back,
:root[data-tetra-theme="light"] .sp-action{background:#fff!important;border-color:#e7eaf3!important;color:#4b2aad!important;}
:root[data-tetra-theme="light"] .sp-back:hover,
:root[data-tetra-theme="light"] .sp-action:hover{border-color:#d8cdfc!important;background:#faf8ff!important;}

/* Students family: alerts are a semantic danger action, not a washed-out
   neutral link on the light hero surface. */
:root[data-tetra-theme="light"] .sx-hero-actions .k-btn[href^="/tetrahedron/students/alerts/"]{
  background:#fff1f2!important;
  border-color:#f0a8ad!important;
  color:#a61b29!important;
  box-shadow:0 5px 14px rgba(166,27,41,.08)!important;
}
:root[data-tetra-theme="light"] .sx-hero-actions .k-btn[href^="/tetrahedron/students/alerts/"]:hover{
  background:#ffe4e6!important;
  border-color:#d94a57!important;
  color:#861420!important;
}

/* ---- Metrics Overview (.metrics-page): dark skin repaints .surface-panel /
   .lane-card. Scoped under .metrics-page so generic names (.panel-head,
   .summary-card) don't leak onto other pages that load this sheet. ---- */
/* .surface-panel is the shared dark content panel across all metrics subpages
   (student-risk/insights/rankings/trends/…) and a few tasks-assessments pages.
   Light it globally — everywhere it is used it should follow the light theme. */
:root[data-tetra-theme="light"] .surface-panel{
  background:#fff!important;
  background-image:none!important;
  border-color:#e7eaf3!important;
  box-shadow:0 16px 40px rgba(31,36,48,.06)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  color:#182033!important;
}
/* Form controls the skin darkens inside these command/filter bars. */
:root[data-tetra-theme="light"] .risk-command select,
:root[data-tetra-theme="light"] .surface-panel select,
:root[data-tetra-theme="light"] .surface-panel input,
:root[data-tetra-theme="light"] .cal-whatshows select{
  background:#fff!important;
  border-color:#e7eaf3!important;
  color:#182033!important;
}

:root[data-tetra-theme="light"] .metrics-page .surface-panel,
:root[data-tetra-theme="light"] .metrics-page .lane-card,
:root[data-tetra-theme="light"] .metrics-page .summary-card,
:root[data-tetra-theme="light"] .metrics-page .panel-body,
:root[data-tetra-theme="light"] .metrics-page .qaction-row,
:root[data-tetra-theme="light"] .metrics-page .empty-note{
  background:#fff!important;
  background-image:none!important;
  border-color:#e7eaf3!important;
  box-shadow:0 16px 40px rgba(31,36,48,.06)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  color:#182033!important;
}
:root[data-tetra-theme="light"] .metrics-page .panel-head{
  background:#fafbfd!important;border-color:#e7eaf3!important;
}
:root[data-tetra-theme="light"] .metrics-page .panel-head h2,
:root[data-tetra-theme="light"] .metrics-page .lane-title,
:root[data-tetra-theme="light"] .metrics-page .summary-value{
  color:#0f172a!important;
}
:root[data-tetra-theme="light"] .metrics-page .panel-head p,
:root[data-tetra-theme="light"] .metrics-page .lane-copy,
:root[data-tetra-theme="light"] .metrics-page .summary-label,
:root[data-tetra-theme="light"] .metrics-page .summary-meta,
:root[data-tetra-theme="light"] .metrics-page .empty-note{
  color:#6d7688!important;
}
:root[data-tetra-theme="light"] .metrics-page .panel-link,
:root[data-tetra-theme="light"] .metrics-page .lane-icon{color:#4b2aad!important;}

/* ---- Calendar subpages (schedule / monthly / school-events): light-authored
   cal-, month- and event- surfaces the dark skin repaints. These names are
   calendar-specific (low collision). ---- */
:root[data-tetra-theme="light"] .cal-header,
:root[data-tetra-theme="light"] .schedule-panel,
:root[data-tetra-theme="light"] .month-surface,
:root[data-tetra-theme="light"] .cal-empty,
:root[data-tetra-theme="light"] .cal-state,
:root[data-tetra-theme="light"] .event-row{
  background:#fff!important;
  background-image:none!important;
  border-color:#e7eaf3!important;
  box-shadow:0 16px 40px rgba(31,36,48,.06)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  color:#182033!important;
}
:root[data-tetra-theme="light"] .cal-header-title,
:root[data-tetra-theme="light"] .event-row-title,
:root[data-tetra-theme="light"] .month-group-header{color:#0f172a!important;}
:root[data-tetra-theme="light"] .cal-header-sub,
:root[data-tetra-theme="light"] .event-row-sub,
:root[data-tetra-theme="light"] .cal-empty,
:root[data-tetra-theme="light"] .cal-state,
:root[data-tetra-theme="light"] .month-dow,
:root[data-tetra-theme="light"] .event-count{color:#6d7688!important;}
:root[data-tetra-theme="light"] .cal-viewnav-item{
  background:#fff!important;border-color:#e7eaf3!important;color:#6d7688!important;
}
:root[data-tetra-theme="light"] .cal-viewnav-item.active{
  background:#efe9ff!important;border-color:#d8cdfc!important;color:#4b2aad!important;
}
:root[data-tetra-theme="light"] .month-grid .month-cell,
:root[data-tetra-theme="light"] .month-head-row{
  background:#fff!important;border-color:#eef0f7!important;
}

/* ---- Students section (.sx-*): light-authored surfaces the dark skin repaints.
   Same skin-collision as the OCR pages — the shared skin darkens .sx-hero /
   .sx-summary-card and remaps the page's --line/--muted, leaving dark text on a
   dark surface. Re-assert the authored light design under the light theme. ---- */
:root[data-tetra-theme="light"] .sx-hero,
:root[data-tetra-theme="light"] .sx-summary-card,
:root[data-tetra-theme="light"] .sx-filter-card,
:root[data-tetra-theme="light"] .sx-table-card{
  background:#fff!important;
  background-image:none!important;
  border-color:#e7eaf3!important;
  box-shadow:0 16px 40px rgba(31,36,48,.08)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
:root[data-tetra-theme="light"] .sx-hero h1,
:root[data-tetra-theme="light"] .sx-summary-v,
:root[data-tetra-theme="light"] .sx-name,
:root[data-tetra-theme="light"] .sx-cell-num,
:root[data-tetra-theme="light"] .sx-table-head h2{
  color:#0f172a!important;
}
:root[data-tetra-theme="light"] .sx-hero p,
:root[data-tetra-theme="light"] .sx-summary-k,
:root[data-tetra-theme="light"] .sx-summary-meta,
:root[data-tetra-theme="light"] .sx-count,
:root[data-tetra-theme="light"] .sx-sub,
:root[data-tetra-theme="light"] .sx-cell-muted,
:root[data-tetra-theme="light"] .sx-pill-label,
:root[data-tetra-theme="light"] .sx-state{
  color:#6d7688!important;
}
:root[data-tetra-theme="light"] .sx-pill,
:root[data-tetra-theme="light"] .sx-search,
:root[data-tetra-theme="light"] .sx-course-chip{
  background:#fff!important;
  border-color:#e7eaf3!important;
  color:#6d7688!important;
}
:root[data-tetra-theme="light"] .sx-search input{color:#182033!important;background:transparent!important;}
:root[data-tetra-theme="light"] .sx-search input::placeholder{color:#8b93a4!important;}
:root[data-tetra-theme="light"] .sx-pill:hover{
  border-color:#d8cdfc!important;background:#faf8ff!important;color:#182033!important;
}
:root[data-tetra-theme="light"] .sx-pill.active{
  background:#efe9ff!important;border-color:#d8cdfc!important;color:#4b2aad!important;
}
:root[data-tetra-theme="light"] .sx-table th{
  background:#f5f6fb!important;color:#6d7688!important;border-color:#e7eaf3!important;
}
:root[data-tetra-theme="light"] .sx-table td{
  background:#fff!important;color:#182033!important;border-color:#eef0f7!important;
}
:root[data-tetra-theme="light"] .sx-table tbody tr:hover td{background:#faf8ff!important;}
:root[data-tetra-theme="light"] .sx-status-chip{
  background:#f1f5f9!important;border-color:#e7eaf3!important;color:#64748b!important;
}

/* Hero tabs */
:root[data-tetra-theme="light"] .orq-hero .hero-tab,
:root[data-tetra-theme="light"] .hero-tab{
  color:#6d7688!important;
  background:transparent!important;
  border-color:transparent!important;
}
:root[data-tetra-theme="light"] .orq-hero .hero-tab:hover,
:root[data-tetra-theme="light"] .hero-tab:hover{
  background:#faf8ff!important;
  color:#182033!important;
}
:root[data-tetra-theme="light"] .orq-hero .hero-tab.active,
:root[data-tetra-theme="light"] .hero-tab.active{
  background:#efe9ff!important;
  color:#4b2aad!important;
  border-color:#d8cdfc!important;
}
:root[data-tetra-theme="light"] .hero-tabs{
  border-bottom-color:#e7eaf3!important;
}

/* Filter pills */
:root[data-tetra-theme="light"] .rw-pill,
:root[data-tetra-theme="light"] .aw-pill,
:root[data-tetra-theme="light"] .sw-pill,
:root[data-tetra-theme="light"] .gb-pill{
  background:#fff!important;
  border-color:#e7eaf3!important;
  color:#6d7688!important;
}
:root[data-tetra-theme="light"] .rw-pill:hover,
:root[data-tetra-theme="light"] .aw-pill:hover,
:root[data-tetra-theme="light"] .sw-pill:hover,
:root[data-tetra-theme="light"] .gb-pill:hover{
  border-color:#d8cdfc!important;
  background:#faf8ff!important;
  color:#182033!important;
}
:root[data-tetra-theme="light"] .rw-pill.active,
:root[data-tetra-theme="light"] .aw-pill.active,
:root[data-tetra-theme="light"] .sw-pill.active,
:root[data-tetra-theme="light"] .gb-pill.active{
  background:#efe9ff!important;
  border-color:#d8cdfc!important;
  color:#4b2aad!important;
}

/* View-toggle + report buttons (Cards / Spreadsheet / Weekly report) */
:root[data-tetra-theme="light"] .aw-view-btn,
:root[data-tetra-theme="light"] .aw-more-btn,
:root[data-tetra-theme="light"] .gb-view-btn,
:root[data-tetra-theme="light"] .gb-report-btn{
  background:#fff!important;
  border-color:#e7eaf3!important;
  color:#6d7688!important;
}
:root[data-tetra-theme="light"] .aw-view-btn:hover,
:root[data-tetra-theme="light"] .aw-more-btn:hover,
:root[data-tetra-theme="light"] .gb-view-btn:hover,
:root[data-tetra-theme="light"] .gb-report-btn:hover{
  border-color:#d8cdfc!important;
  background:#faf8ff!important;
  color:#182033!important;
}
:root[data-tetra-theme="light"] .aw-view-btn.active,
:root[data-tetra-theme="light"] .gb-view-btn.active,
:root[data-tetra-theme="light"] .gb-report-btn{
  background:#efe9ff!important;
  border-color:#d8cdfc!important;
  color:#4b2aad!important;
}

/* Search fields */
:root[data-tetra-theme="light"] .rw-search,
:root[data-tetra-theme="light"] .sw-search,
:root[data-tetra-theme="light"] .gb-search,
:root[data-tetra-theme="light"] .gb-select{
  background:#fafbfd!important;
  border-color:#e7eaf3!important;
  color:#182033!important;
}
:root[data-tetra-theme="light"] .rw-search input,
:root[data-tetra-theme="light"] .sw-search input,
:root[data-tetra-theme="light"] .gb-search input{
  color:#182033!important;
}
:root[data-tetra-theme="light"] .rw-search input::placeholder,
:root[data-tetra-theme="light"] .sw-search input::placeholder,
:root[data-tetra-theme="light"] .gb-search input::placeholder{
  color:#8b93a4!important;
}

/* Tables */
:root[data-tetra-theme="light"] .rw-table th,
:root[data-tetra-theme="light"] .sw-table th{
  background:#f5f6fb!important;
  color:#6d7688!important;
  border-color:#e7eaf3!important;
}
:root[data-tetra-theme="light"] .rw-table td,
:root[data-tetra-theme="light"] .sw-table td{
  background:#fff!important;
  color:#182033!important;
  border-color:#eef0f7!important;
}
:root[data-tetra-theme="light"] .rw-table tbody tr:hover td,
:root[data-tetra-theme="light"] .sw-table tbody tr:hover td{
  background:#faf8ff!important;
  color:#182033!important;
}

/* Demo chips + empty states */
:root[data-tetra-theme="light"] .rw-demo-chip{
  background:#f1f5f9!important;
  border-color:#e7eaf3!important;
  color:#64748b!important;
}
:root[data-tetra-theme="light"] .rw-empty,
:root[data-tetra-theme="light"] .aw-empty{
  background:#fbfbff!important;
  border-color:#d9deeb!important;
  color:#6d7688!important;
}
:root[data-tetra-theme="light"] .rw-empty strong,
:root[data-tetra-theme="light"] .aw-empty strong{
  color:#182033!important;
}

/* ---- Non-family OCR pages (detection preview): skin hard-paints these ---- */
:root[data-tetra-theme="light"] .page-context{
  background:linear-gradient(180deg,#ffffff 0%,#fbfbff 100%)!important;
  border-color:#e6e9f5!important;
  color:#182033!important;
  box-shadow:0 10px 24px rgba(31,36,48,.05)!important;
}
:root[data-tetra-theme="light"] .page-context h1{color:#182033!important;}
:root[data-tetra-theme="light"] .page-context p{color:#69707d!important;}
:root[data-tetra-theme="light"] .context-chip{
  background:#f7f5ff!important;
  border-color:#ddd6ff!important;
  color:#4b2aad!important;
}
:root[data-tetra-theme="light"] .section{
  background:#fff!important;
  border-color:#e7e9f2!important;
  color:#182033!important;
}
:root[data-tetra-theme="light"] .section h2{color:#1f2430!important;}
:root[data-tetra-theme="light"] .card{
  background:#fcfcff!important;
  border-color:#e7e9f2!important;
  color:#1f2430!important;
}
:root[data-tetra-theme="light"] .card h3{color:#1f2430!important;}
:root[data-tetra-theme="light"] .card p{color:#69707d!important;}
:root[data-tetra-theme="light"] .list-row{
  background:#fff!important;
  border-color:#e7e9f2!important;
  color:#1f2430!important;
}
:root[data-tetra-theme="light"] .scan-stage{
  background:linear-gradient(180deg,#fdfdff,#f3f5fb)!important;
  border-color:#e7e9f2!important;
}
:root[data-tetra-theme="light"] .sheet{
  background:#fff!important;
  border-color:#d9deeb!important;
}
:root[data-tetra-theme="light"] .legend-chip{
  background:#fff!important;
  border-color:#e7e9f2!important;
  color:#1f2430!important;
}
:root[data-tetra-theme="light"] .breadcrumb,
:root[data-tetra-theme="light"] .breadcrumb a{color:#69707d!important;}
:root[data-tetra-theme="light"] .breadcrumb .current{color:#4b2aad!important;}

/* ---- Dark/obsidian repair for the non-family OCR pages (detection preview) ----
   These pages were authored light with opaque `#fff` content surfaces, so under
   the dark portal themes the surfaces stayed white while the shared shell painted
   text near-white — invisible headings. Re-surface them with the shared dark
   theme tokens so they follow the portal. These class names are unique to the
   detection-preview page (ocr-review uses the orq- and rw- families), so this
   does not touch the family review pages. */
:root[data-tetra-theme="dark"] .section,
:root[data-tetra-theme="obsidian"] .section,
:root[data-tetra-theme="dark"] .card,
:root[data-tetra-theme="obsidian"] .card,
:root[data-tetra-theme="dark"] .list-row,
:root[data-tetra-theme="obsidian"] .list-row,
:root[data-tetra-theme="dark"] .legend-chip,
:root[data-tetra-theme="obsidian"] .legend-chip{
  background:var(--tts-surface)!important;
  background-image:none!important;
  border-color:var(--tts-line)!important;
  color:var(--tts-text)!important;
}
:root[data-tetra-theme="dark"] .scan-stage,
:root[data-tetra-theme="obsidian"] .scan-stage{
  background:var(--tts-soft)!important;
  border-color:var(--tts-line)!important;
}
:root[data-tetra-theme="dark"] .sheet,
:root[data-tetra-theme="obsidian"] .sheet{
  background:var(--tts-surface)!important;
  border-color:var(--tts-line)!important;
}
:root[data-tetra-theme="dark"] .section h2,
:root[data-tetra-theme="obsidian"] .section h2,
:root[data-tetra-theme="dark"] .card h3,
:root[data-tetra-theme="obsidian"] .card h3,
:root[data-tetra-theme="dark"] .page-context h1,
:root[data-tetra-theme="obsidian"] .page-context h1{
  color:var(--tts-text)!important;
}
:root[data-tetra-theme="dark"] .card p,
:root[data-tetra-theme="obsidian"] .card p,
:root[data-tetra-theme="dark"] .page-context p,
:root[data-tetra-theme="obsidian"] .page-context p{
  color:var(--tts-muted)!important;
}
:root[data-tetra-theme="dark"] .context-chip,
:root[data-tetra-theme="obsidian"] .context-chip{
  background:rgba(120,140,255,.12)!important;
  border-color:var(--tts-line)!important;
  color:#c7d2fe!important;
}
:root[data-tetra-theme="dark"] .breadcrumb,
:root[data-tetra-theme="obsidian"] .breadcrumb,
:root[data-tetra-theme="dark"] .breadcrumb a,
:root[data-tetra-theme="obsidian"] .breadcrumb a{color:var(--tts-muted)!important;}

/* ---- Library family (.workspace pages): the pages ship light :root tokens
   (--panel:#fff, --ink, etc.) that the canonical dark skin overrides, turning
   .command-bar / .results-shell dark. Re-assert the light tokens scoped to the
   library .workspace so the content stays light under the navy shell. ---- */
:root[data-tetra-theme="light"] .workspace{
  --bg:#f5f7fb!important; --panel:#ffffff!important; --ink:#182033!important;
  --muted:#687386!important; --line:#e5e9f2!important; --soft:#f1edff!important;
}
:root[data-tetra-theme="light"] .workspace .command-bar,
:root[data-tetra-theme="light"] .workspace .results-shell,
:root[data-tetra-theme="light"] .workspace .filter-panel{
  background:#ffffff!important; border-color:#e5e9f2!important; color:#182033!important;
}

/* Library detail/legacy pages (all, assignment-detail): hero-panel + section-shell
   use the skin-darkened panel var; re-light them (library-specific class names,
   low collision) so the whole Library family stays light under the navy shell. */
:root[data-tetra-theme="light"] .hero-panel,
:root[data-tetra-theme="light"] .section-shell{
  background:#ffffff!important; border-color:#e5e9f2!important; color:#182033!important;
}
:root[data-tetra-theme="light"] .hero-panel .hero-eyebrow{ color:#4b2aad!important; }

/* ══════════════════════════════════════════════════════════════════════════
   Students family — the dark skin repaints surfaces these pages author light.
   Covers: task-detail empty state (.no-assignment); the student-profile SUBTABS
   that use the .student-page/.summary-strip/.student-hero shell (assignments,
   progress, observations, attendance, alerts); and the .sp-* overview where the
   card backgrounds were already re-lit but the VALUE text stayed near-white.
   ══════════════════════════════════════════════════════════════════════════ */

/* student-profile subtabs — hero, tabs panel and filter toolbar (skin darkens). */
:root[data-tetra-theme="light"] .student-hero,
:root[data-tetra-theme="light"] .student-tabs-panel,
:root[data-tetra-theme="light"] .toolbar-panel{
  background:#fff!important; background-image:none!important;
  border-color:#e7eaf3!important; box-shadow:0 16px 40px rgba(31,36,48,.08)!important;
  -webkit-backdrop-filter:none!important; backdrop-filter:none!important;
}
/* the hero keeps a faint brand radial but on a white base */
:root[data-tetra-theme="light"] .student-hero{
  background-image:radial-gradient(circle at top right, rgba(75,42,173,.06), transparent 30%)!important;
}
:root[data-tetra-theme="light"] .student-hero h1,
:root[data-tetra-theme="light"] .summary-value{ color:#182033!important; }
:root[data-tetra-theme="light"] .student-sub,
:root[data-tetra-theme="light"] .summary-label,
:root[data-tetra-theme="light"] .summary-meta{ color:#6d7688!important; }
/* filter inputs the skin darkens inside the toolbar */
:root[data-tetra-theme="light"] .toolbar-grid input,
:root[data-tetra-theme="light"] .toolbar-grid select{
  background:#fff!important; color:#182033!important; border-color:#e7eaf3!important;
}

/* student-profile OVERVIEW (.sp-grid) — card backgrounds already re-lit above;
   the value text (.v) inherited a near-white skin color on white cards. */
:root[data-tetra-theme="light"] .sp-grid .v{ color:#182033!important; }
:root[data-tetra-theme="light"] .sp-grid .v.muted,
:root[data-tetra-theme="light"] .sp-grid .k{ color:#6d7688!important; }
/* Support-signals rows: the label span carries no class, so it inherited the
   skin's near-white text on the (now light) card. */
:root[data-tetra-theme="light"] .sp-grid .sp-signal > span:first-child{ color:#42506a!important; }

/* Metrics Overview — assignment-flow bar chart: labels/values inherited a
   near-white skin colour on the light .surface-panel. */
:root[data-tetra-theme="light"] .metrics-page .bar-label{ color:#42506a!important; }
:root[data-tetra-theme="light"] .metrics-page .bar-value{ color:#182033!important; }

/* Library filter shell (library/assignments, library/exams, …). These pages do
   NOT load tetra-library-assignments.css, so the filter <select>/<input> keep the
   dark-glass skin fill (rgba(0,0,0,.28)) and the field labels stay near-white on
   the light card. Re-light the controls (scoped to .filter-shell) + notices. */
:root[data-tetra-theme="light"] .filter-shell :is(input, select),
:root[data-tetra-theme="light"] .filter-shell .field select,
:root[data-tetra-theme="light"] .filter-shell .field input{
  background:#fff!important; background-image:none!important;
  color:#182033!important; border-color:#e7eaf3!important;
}
:root[data-tetra-theme="light"] .filter-shell .field select:focus,
:root[data-tetra-theme="light"] .filter-shell .field input:focus{
  background:#f4f6fc!important; border-color:#c9bef4!important;
}
:root[data-tetra-theme="light"] .filter-shell .field label{ color:#6d7688!important; }
:root[data-tetra-theme="light"] .notice{ color:#334155!important; }
