/*
 * Calificaciones: capa visual final.
 * Mantiene intactos los datos y comportamientos del libro; solo ordena su
 * presentacion y neutraliza reglas historicas que competian entre si.
 */
@media screen {
  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones {
    --grade-blue: #0752a0;
    --grade-blue-dark: #073d7b;
    --grade-blue-soft: #eef6ff;
    --grade-line: #d5e4f3;
    --grade-yellow: #ffe286;
    --grade-ink: #17324f;
    --grade-muted: #58708d;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones *,
  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones *::before,
  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones *::after {
    box-sizing: border-box;
  }

  /* Encabezado y acciones: los botones conservan su texto completo y se
     distribuyen segun el espacio disponible. */
  body.is-authenticated:not(.report-print-body) #module-calificaciones .module-head {
    align-items: flex-start !important;
    gap: 14px !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline {
    display: flex !important;
    flex: 0 1 auto !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    min-width: 0 !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline > :is(button, a) {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 38px !important;
    height: auto !important;
    padding: 8px 12px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    line-height: 1.2 !important;
    text-align: center !important;
  }

  /* Panel superior: filtros primero, navegacion, indicadores y resumen. */
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-dashboard-compact {
    display: grid !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 14px !important;
    padding: 14px !important;
    overflow: visible !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filters-row {
    display: grid !important;
    grid-template-columns: minmax(280px, .85fr) minmax(0, 1.35fr) !important;
    align-items: stretch !important;
    gap: 12px !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.course-context, .grade-filter-card) {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 12px !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(180px, 1fr)) !important;
    align-items: end !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar label {
    display: grid !important;
    gap: 5px !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar :is(select, input) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 40px !important;
    min-height: 40px !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar .pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 32px !important;
    height: auto !important;
    padding: 6px 10px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    line-height: 1.2 !important;
    text-align: center !important;
  }

  /* Navegador de cursos y asignaturas. */
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-navigator {
    min-width: 0 !important;
    padding: 14px !important;
    overflow: visible !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-navigator-heading > div,
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory summary span,
  body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.grade-course-tile, .grade-subject-tile) {
    min-width: 0 !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.grade-course-tile, .grade-subject-tile) {
    height: auto !important;
    white-space: normal !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.grade-course-tile, .grade-subject-tile) :is(span, small, b),
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory summary :is(b, small) {
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  /* Pestañas desplegables por curso. */
  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-list {
    display: grid !important;
    gap: 8px !important;
    min-width: 0 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory {
    min-width: 0 !important;
    overflow: hidden !important;
    border: 1px solid var(--grade-line) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory.is-active {
    border-color: #89b8e5 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory summary {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
    min-height: 58px !important;
    padding: 10px 12px !important;
    color: var(--grade-blue-dark) !important;
    background: #fff !important;
    cursor: pointer !important;
    list-style: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory summary::-webkit-details-marker {
    display: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory summary:hover,
  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory summary:focus-visible {
    background: #f7fbff !important;
    outline: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory[open] summary {
    border-bottom: 1px solid var(--grade-line) !important;
    background: var(--grade-blue-soft) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory.is-active > summary {
    box-shadow: inset 4px 0 0 var(--grade-blue) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-title {
    display: grid !important;
    gap: 2px !important;
    min-width: 0 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-title > b {
    color: var(--grade-blue-dark) !important;
    font-size: .95rem !important;
    line-height: 1.2 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-title > small {
    color: var(--grade-muted) !important;
    font-size: .76rem !important;
    line-height: 1.25 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-meta {
    display: grid !important;
    grid-template-columns: auto auto !important;
    grid-template-areas: "label icon" "value icon" !important;
    align-items: center !important;
    gap: 0 10px !important;
    min-width: 80px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-meta small {
    grid-area: label;
    color: var(--grade-muted) !important;
    font-size: .66rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-meta b {
    grid-area: value;
    color: var(--grade-blue) !important;
    font-size: .9rem !important;
    font-variant-numeric: tabular-nums;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-meta i {
    grid-area: icon;
    color: var(--grade-blue) !important;
    transition: transform .18s ease;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory[open] .grade-course-directory-meta i {
    transform: rotate(180deg);
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-content {
    display: grid !important;
    gap: 0 !important;
    min-width: 0 !important;
    background: #fff !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-actions {
    display: flex !important;
    justify-content: flex-end !important;
    padding: 9px 9px 0 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-open-course {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 34px !important;
    height: auto !important;
    padding: 7px 10px !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-subject-directory-list {
    min-width: 0 !important;
    border-top: 0 !important;
  }

  /* Indicadores sin recortes ni alturas artificiales. */
  body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.layout-insight-grid, .grade-kpi-grid.kpi-card-grid) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.layout-insight, .grade-kpi-grid.kpi-card-grid > *, .metric) {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 10px !important;
    overflow: visible !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.layout-insight span, .layout-insight small, .metric small) {
    display: block !important;
    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    -webkit-line-clamp: unset !important;
  }

  /* Libro de notas en escritorio: todas las columnas caben en el panel. */
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-card {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 14px !important;
    overflow: visible !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-card h3 {
    margin: 0 0 8px !important;
    color: var(--grade-blue-dark) !important;
    font-size: clamp(1.05rem, 1.5vw, 1.3rem) !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-spreadsheet-help {
    margin: 0 0 10px !important;
    padding: 9px 11px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    line-height: 1.35 !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones .grade-table-wrap {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    border-color: var(--grade-line) !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet {
    display: table !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td) {
    position: static !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    padding: 3px !important;
    color: var(--grade-ink);
    font-family: Calibri, "Segoe UI", Arial, sans-serif !important;
    font-size: var(--grade-font-size, 11px) !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow: visible !important;
    overflow-wrap: anywhere !important;
    text-overflow: clip !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet th {
    background: var(--grade-blue-soft) !important;
    color: var(--grade-blue-dark) !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):first-child {
    width: 30px !important;
    text-align: center !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):nth-child(2) {
    width: clamp(150px, 21%, 260px) !important;
    text-align: left !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):nth-last-child(2) {
    width: 64px !important;
    text-align: center !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):last-child {
    width: clamp(92px, 12%, 160px) !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .student-cell {
    font-weight: 700 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .grade-input {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: max(26px, calc(var(--grade-row-height, 28px) - 2px)) !important;
    min-height: 26px !important;
    margin: 0 !important;
    padding: 2px 1px !important;
    border-radius: 5px !important;
    font: 700 var(--grade-font-size, 11px)/1 Calibri, "Segoe UI", Arial, sans-serif !important;
    text-align: center !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .student-risk-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 3px !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(.student-risk-badge, .student-risk-badge b) {
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}

@media screen and (max-width: 1100px) {
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filters-row {
    grid-template-columns: 1fr !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .module-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline {
    justify-content: flex-start !important;
  }
}

/* En movil cada alumno se presenta como una ficha. No se oculta ninguna nota. */
@media screen and (max-width: 900px) {
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-dashboard-compact,
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-card {
    padding: 10px !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet,
  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody {
    display: block !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet thead {
    display: none !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody tr {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 6px !important;
    width: 100% !important;
    margin: 0 0 10px !important;
    padding: 10px !important;
    overflow: visible !important;
    border: 1px solid var(--grade-line) !important;
    border-left: 4px solid var(--grade-blue) !important;
    border-radius: 9px !important;
    background: #fff !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 12px !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:first-child {
    grid-column: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    border-radius: 7px !important;
    background: var(--grade-blue-soft) !important;
    color: var(--grade-blue-dark) !important;
    font-weight: 800 !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:nth-child(2) {
    grid-column: 2 / -1 !important;
    display: flex !important;
    align-items: center !important;
    width: auto !important;
    min-height: 38px !important;
    padding: 5px 8px !important;
    border-radius: 7px !important;
    background: #f8fbff !important;
    color: var(--grade-blue-dark) !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:nth-last-child(2) {
    grid-column: 1 / 3 !important;
    width: auto !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:last-child {
    grid-column: 3 / -1 !important;
    width: auto !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td[colspan] {
    grid-column: 1 / -1 !important;
    padding: 12px !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td[data-label]::before {
    content: attr(data-label);
    display: block !important;
    margin: 0 0 3px !important;
    color: var(--grade-muted) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet .grade-input {
    height: 38px !important;
    min-height: 38px !important;
    padding: 4px !important;
    font-size: 14px !important;
  }
}

@media screen and (max-width: 640px) {
  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones {
    padding: 8px !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline,
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline > :is(button, a),
  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar .pill {
    width: 100% !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-navigator-heading {
    display: grid !important;
    gap: 8px !important;
  }

  body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.layout-insight-grid, .grade-kpi-grid.kpi-card-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 420px) {
  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory summary {
    gap: 8px !important;
    padding: 9px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-meta {
    min-width: 68px !important;
    gap: 0 6px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-course-directory-actions {
    justify-content: stretch !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-open-course {
    width: 100% !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody tr {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 5px !important;
    padding: 8px !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:first-child {
    grid-column: 1 !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:nth-child(2) {
    grid-column: 2 / -1 !important;
  }

  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:nth-last-child(2),
  body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones #gradeSpreadsheet tbody td:last-child {
    grid-column: span 2 !important;
  }
}

/* Referencia visual solicitada: panel academico claro, azul marino y amarillo. */
@media screen {
  html body.is-authenticated:not(.report-print-body) #appMain #module-calificaciones {
    --grade-reference-navy: #0d2857;
    --grade-reference-blue: #1769dc;
    --grade-reference-sky: #eaf3ff;
    --grade-reference-line: #dbe5f2;
    --grade-reference-surface: #ffffff;
    --grade-reference-canvas: #f5f8fc;
    --grade-reference-yellow: #ffca3a;
    color: var(--grade-reference-navy) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-head {
    display: grid !important;
    grid-template-columns: minmax(280px, 1fr) auto auto !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 20px 22px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: var(--grade-reference-surface) !important;
    box-shadow: 0 6px 22px rgba(20, 54, 96, .07) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-compact-title {
    position: relative !important;
    min-width: 0 !important;
    padding-left: 18px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-compact-title::before {
    content: "";
    position: absolute;
    inset: 2px auto 2px 0;
    width: 5px;
    border-radius: 999px;
    background: var(--grade-reference-yellow);
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-head-icon {
    display: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-head h1 {
    margin: 0 !important;
    color: var(--grade-reference-navy) !important;
    font-size: clamp(1.7rem, 2.5vw, 2.35rem) !important;
    font-weight: 850 !important;
    letter-spacing: -.025em !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-head p {
    margin: 4px 0 0 !important;
    color: #6880a3 !important;
    font-size: .95rem !important;
    font-weight: 500 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-compact-year label {
    min-width: 150px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 8px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline .module-home-btn {
    display: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline > button {
    min-height: 42px !important;
    border-radius: 8px !important;
    font-weight: 750 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-register-action {
    background: var(--grade-reference-blue) !important;
    color: #fff !important;
    border-color: var(--grade-reference-blue) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-breadcrumb {
    display: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-dashboard-compact {
    gap: 16px !important;
    margin: 16px auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filters-row {
    display: grid !important;
    grid-template-columns: minmax(210px, .75fr) minmax(0, 2.25fr) !important;
    align-items: end !important;
    gap: 14px !important;
    padding: 16px !important;
    border: 1px solid var(--grade-reference-line) !important;
    border-radius: 12px !important;
    background: var(--grade-reference-surface) !important;
    box-shadow: 0 5px 18px rgba(20, 54, 96, .05) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.course-context, .grade-filter-card) {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .course-context {
    display: block !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .course-context-main {
    display: block !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .course-context-meta {
    display: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(150px, 1fr)) auto auto auto !important;
    align-items: end !important;
    gap: 12px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.course-context label, .grade-filter-toolbar label) {
    color: var(--grade-reference-navy) !important;
    font-size: .78rem !important;
    font-weight: 750 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.course-context select, .grade-filter-toolbar select, .module-year-control select) {
    min-height: 42px !important;
    border: 1px solid #cbd8e9 !important;
    border-radius: 8px !important;
    background-color: #fff !important;
    color: var(--grade-reference-navy) !important;
    font-weight: 650 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.school-year-badge, .grade-filter-toolbar .pill) {
    align-self: end !important;
    min-height: 42px !important;
    padding: 8px 11px !important;
    border: 1px solid #d5e3f2 !important;
    border-radius: 8px !important;
    background: #f7faff !important;
    color: #49658d !important;
    font-size: .74rem !important;
    font-weight: 700 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight-head {
    display: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight {
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 13px !important;
    min-height: 112px !important;
    padding: 16px !important;
    border: 1px solid #e3ebf5 !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 6px 18px rgba(21, 53, 94, .06) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight > i {
    display: grid !important;
    place-items: center !important;
    width: 58px !important;
    height: 58px !important;
    margin: 0 !important;
    border-radius: 50% !important;
    background: #dcecff !important;
    color: #1769dc !important;
    font-size: 1.35rem !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight.green > i {
    background: #d9f7e9 !important;
    color: #15966b !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight.yellow > i {
    background: #fff0bd !important;
    color: #9a6b00 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight.red > i {
    background: #ffe0e3 !important;
    color: #c83f4b !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight > div {
    display: grid !important;
    gap: 2px !important;
    min-width: 0 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight span {
    color: var(--grade-reference-navy) !important;
    font-size: .82rem !important;
    font-weight: 650 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight b {
    color: #0b2452 !important;
    font-size: 1.7rem !important;
    line-height: 1 !important;
    font-variant-numeric: tabular-nums;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight small {
    color: #7187a7 !important;
    font-size: .75rem !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-card {
    padding: 0 16px 16px !important;
    border: 1px solid var(--grade-reference-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 6px 22px rgba(20, 54, 96, .06) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-heading {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    padding: 15px 0 12px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-heading > div {
    min-width: 0 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-heading span {
    color: #6f83a2 !important;
    font-size: .7rem !important;
    font-weight: 800 !important;
    letter-spacing: .055em !important;
    text-transform: uppercase !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-heading h3 {
    margin: 2px 0 0 !important;
    color: var(--grade-reference-navy) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-heading > small {
    flex: 0 0 auto !important;
    max-width: 45% !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    background: var(--grade-reference-sky) !important;
    color: #426793 !important;
    font-size: .75rem !important;
    font-weight: 750 !important;
    text-align: center !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-spreadsheet-help {
    margin-bottom: 12px !important;
    border: 0 !important;
    border-left: 4px solid var(--grade-reference-yellow) !important;
    background: #fffaf0 !important;
    color: #75591a !important;
    font-size: .78rem !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones .grade-table-wrap {
    overflow: visible !important;
    border: 1px solid var(--grade-reference-line) !important;
    border-radius: 8px !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet th {
    padding: 10px 4px !important;
    border-right: 1px solid var(--grade-reference-line) !important;
    background: #f1f5fa !important;
    color: var(--grade-reference-navy) !important;
    font-size: .74rem !important;
    font-weight: 800 !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet td {
    padding: 5px 4px !important;
    border-right: 1px solid #e8eef6 !important;
    border-bottom: 1px solid #e1e8f1 !important;
    background: #fff !important;
    color: #173260 !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet tbody tr:nth-child(even) td {
    background: #fbfdff !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):nth-last-child(2),
  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet tbody tr:nth-child(even) td:nth-last-child(2) {
    background: #e5f1ff !important;
    color: #1165d5 !important;
    font-size: .78rem !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .grade-input {
    border: 1px solid transparent !important;
    background: transparent !important;
    color: #173260 !important;
    box-shadow: none !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .grade-input:not(:disabled):hover {
    border-color: #b9cee7 !important;
    background: #f7fbff !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .grade-input:not(:disabled):focus {
    border-color: var(--grade-reference-blue) !important;
    background: #fff !important;
    outline: 2px solid rgba(23, 105, 220, .14) !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .student-risk-badge {
    justify-content: center !important;
    min-width: 88px !important;
    padding: 5px 9px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #dff7e9 !important;
    color: #148158 !important;
    font-size: .7rem !important;
    font-weight: 800 !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .student-risk-badge:is(.yellow, .orange, .red, .priority) {
    background: #fff0c5 !important;
    color: #a66c00 !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones > .grade-navigator {
    max-width: 1680px !important;
    margin: 16px auto 0 !important;
    border-color: var(--grade-reference-line) !important;
    background: #fff !important;
    box-shadow: 0 5px 18px rgba(20, 54, 96, .05) !important;
  }
}

@media screen and (max-width: 1250px) {
  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-head {
    grid-template-columns: 1fr auto !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline {
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar {
    grid-template-columns: repeat(2, minmax(150px, 1fr)) repeat(2, auto) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 760px) {
  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-head {
    grid-template-columns: 1fr !important;
    padding: 16px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-compact-year,
  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-compact-year label {
    width: 100% !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline > button {
    width: 100% !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filters-row {
    grid-template-columns: 1fr !important;
    padding: 12px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones :is(.school-year-badge, .grade-filter-toolbar .pill) {
    width: 100% !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight-grid {
    grid-template-columns: 1fr !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-reference-kpis .layout-insight {
    min-height: 92px !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-heading {
    align-items: flex-start !important;
  }
}

@media screen and (max-width: 480px) {
  html body.is-authenticated:not(.report-print-body) #module-calificaciones .module-actions-inline,
  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-filter-toolbar {
    grid-template-columns: 1fr !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-heading {
    display: grid !important;
  }

  html body.is-authenticated:not(.report-print-body) #module-calificaciones .grade-sheet-heading > small {
    max-width: 100% !important;
    justify-self: start !important;
  }
}

/* Columnas del libro: ancho determinado por el contenido en escritorio. */
@media screen and (min-width: 901px) {
  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):first-child {
    width: 1% !important;
    min-width: 34px !important;
    white-space: nowrap !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):nth-child(2) {
    width: auto !important;
    min-width: 150px !important;
    max-width: 260px !important;
    white-space: normal !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):nth-child(n+3):not(:nth-last-child(-n+2)) {
    width: 1% !important;
    min-width: 0 !important;
    padding-right: 3px !important;
    padding-left: 3px !important;
    white-space: nowrap !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):nth-last-child(2) {
    width: 1% !important;
    min-width: 68px !important;
    white-space: nowrap !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet :is(th, td):last-child {
    width: 1% !important;
    min-width: 96px !important;
    white-space: normal !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet .grade-input {
    width: 4.4ch !important;
    min-width: 4.4ch !important;
    max-width: 4.4ch !important;
    margin-inline: auto !important;
    padding-right: 1px !important;
    padding-left: 1px !important;
  }

  html body.is-authenticated:not(.report-print-body) #appMain#appMain #module-calificaciones #gradeSpreadsheet select.grade-input {
    width: 5.2ch !important;
    min-width: 5.2ch !important;
    max-width: 5.2ch !important;
  }
}
/* Resumen anual: conserva las notas parciales en sus periodos y presenta solo promedios. */
#module-calificaciones .grade-annual-summary {
  min-width: 720px !important;
  table-layout: fixed !important;
}

#module-calificaciones .grade-annual-summary th:nth-child(1),
#module-calificaciones .grade-annual-summary td:nth-child(1) { width: 54px !important; }
#module-calificaciones .grade-annual-summary th:nth-child(2),
#module-calificaciones .grade-annual-summary td:nth-child(2) { width: 30% !important; text-align: left !important; }
#module-calificaciones .grade-annual-summary :is(th,td):nth-child(n+3) { text-align: center !important; }
#module-calificaciones .grade-annual-summary .grade-annual-average {
  background: #eef6ff !important;
  color: #0b57b7 !important;
}
#module-calificaciones .grade-annual-summary .grade-annual-general > * {
  border-top: 3px solid #ffd447 !important;
  background: #0b57b7 !important;
  color: #fff !important;
  font-weight: 900 !important;
}
#module-calificaciones .grade-annual-summary .grade-annual-general th {
  text-align: right !important;
}

@media (max-width: 760px) {
  #module-calificaciones .grade-annual-summary { min-width: 0 !important; }
  #module-calificaciones .grade-annual-summary thead { display: none !important; }
  #module-calificaciones .grade-annual-summary tbody,
  #module-calificaciones .grade-annual-summary tfoot,
  #module-calificaciones .grade-annual-summary tr,
  #module-calificaciones .grade-annual-summary td,
  #module-calificaciones .grade-annual-summary th { display: block !important; width: 100% !important; }
  #module-calificaciones .grade-annual-summary tbody tr { margin-bottom: 12px !important; border: 1px solid #dbe7f3 !important; border-radius: 12px !important; overflow: hidden !important; }
  #module-calificaciones .grade-annual-summary tbody td { display: grid !important; grid-template-columns: minmax(130px, .8fr) minmax(0, 1fr) !important; gap: 10px !important; text-align: right !important; }
  #module-calificaciones .grade-annual-summary tbody td::before { content: attr(data-label); color: #123d78; font-weight: 800; text-align: left; }
  #module-calificaciones .grade-annual-summary .student-cell { text-align: left !important; }
  #module-calificaciones .grade-annual-summary .grade-annual-general th { text-align: center !important; }
  #module-calificaciones .grade-annual-summary .grade-annual-general td[aria-hidden="true"] { display: none !important; }
}
