/*
 * Escala tipografica compartilhada
 * caption 12px: chips, legendas e dados auxiliares curtos
 * meta    13px: datas, estados e metadados
 * small   14px: descricoes secundarias e tabelas
 * body    15px: texto corrente e controles
 * lead    17px: introducoes
 * headings 18/20/24px; titulos de pagina 30–42px
 *
 * Evite tamanhos abaixo de --font-size-caption. Novos componentes devem
 * consumir estes tokens para manter hierarquia e legibilidade consistentes.
 */
:root {
  --font-size-caption: .75rem;
  --font-size-meta: .8125rem;
  --font-size-small: .875rem;
  --font-size-body: .9375rem;
  --font-size-lead: 1.0625rem;
  --font-size-heading-sm: 1.125rem;
  --font-size-heading-md: 1.25rem;
  --font-size-heading-lg: 1.5rem;
  --font-size-page-title: clamp(1.875rem, 4vw, 2.625rem);
  --line-height-compact: 1.25;
  --line-height-body: 1.5;
  --line-height-relaxed: 1.65;
}

body {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

.tag,
.ui-caption {
  font-size: var(--font-size-caption);
  line-height: var(--line-height-compact);
}

.ui-meta {
  font-size: var(--font-size-meta);
  line-height: var(--line-height-body);
}

.ui-small {
  font-size: var(--font-size-small);
  line-height: var(--line-height-body);
}

.ui-page-title {
  font: 800 var(--font-size-page-title)/1.12 Manrope, sans-serif;
  letter-spacing: -.035em;
}

/* Paginas de cursos, turmas e alunos */
.class-index-hero h1,
.class-detail-hero h1,
.codes-hero h1,
.course-index-hero h1,
.course-detail-hero h1,
.curriculum-hero h1,
.students-page-hero h1,
.student-record-hero h1,
.class-assessments-hero h1,
.assessment-analysis-hero h1 {
  font-size: var(--font-size-page-title);
  line-height: 1.12;
}

.class-index-hero p,
.class-detail-hero p,
.codes-hero p,
.course-index-hero p,
.course-detail-hero p,
.curriculum-hero p,
.students-page-hero p,
.student-record-hero p,
.class-assessments-hero p,
.assessment-analysis-hero p {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

.class-detail-panel h2,
.class-course-progress h2,
.course-section h2,
.curriculum-module > header h2,
.student-record-panel h2,
.analysis-panel-heading h2 {
  font-size: var(--font-size-heading-md);
  line-height: 1.3;
}

.class-detail-metrics span,
.class-detail-metrics small,
.class-subject-list small,
.class-description,
.next-class-list small,
.class-course-progress p,
.subject-progress > span,
.subject-progress > small,
.students-page-summary span,
.students-toolbar label span,
.students-toolbar small,
.student-directory-person small,
.student-directory-person span,
.student-status small,
.student-directory-row > time,
.student-record-state small,
.student-record-state span,
.student-record-metrics article > span,
.student-record-metrics small,
.student-subject-name small,
.student-subject-metric small,
.student-subject-metric span,
.student-enrollment-timeline time,
.student-enrollment-timeline small,
.student-access-list small {
  font-size: var(--font-size-meta);
  line-height: var(--line-height-body);
}

.course-card-top,
.course-card dt,
.course-card dd,
.course-tags span,
.plan-selector label,
.course-metrics span,
.detail-list dt,
.detail-list dd,
.course-note,
.linked-classes span,
.curriculum-module > header span,
.curriculum-module > header p,
.curriculum-row p,
.curriculum-row details,
.curriculum-row details h3,
.curriculum-heading,
.curriculum-total span,
.course-module-preview article > span,
.course-module-preview article > small,
.admin-detail-grid dt,
.admin-detail-grid dd {
  font-size: var(--font-size-meta);
  line-height: var(--line-height-body);
}

.course-card-actions a,
.course-detail-hero nav a,
.curriculum-hero > a,
.inline-course-link {
  font-size: var(--font-size-meta);
}

.class-detail-hero nav a,
.role-class-card footer b,
.class-subject-list b,
.staff-tools > a,
.student-open-link,
.student-secondary-action {
  font-size: var(--font-size-meta);
}

.student-status > strong,
.student-record-state > strong {
  font-size: var(--font-size-caption);
  line-height: var(--line-height-compact);
}

/* Matriz e analise de avaliacoes */
.assessment-overview span,
.assessment-overview small,
.class-assessments-count span,
.analysis-metrics span,
.analysis-metrics small,
.analysis-panel-heading p,
.chart-caption,
.completion-visual dl > div,
.student-score-row > a,
.student-score-row > strong,
.question-analysis-list p,
.question-analysis-list small,
.assessment-student-table article {
  font-size: var(--font-size-meta);
  line-height: var(--line-height-body);
}

.assessment-matrix-tools label,
.assessment-column-title > strong,
.assessment-student-column a strong,
.assessment-state strong,
.assessment-state span {
  font-size: var(--font-size-caption);
  line-height: var(--line-height-compact);
}

.assessment-legend span,
.assessment-column-title > span,
.assessment-column-title > small,
.assessment-column-title > em,
.assessment-column-title > a,
.assessment-student-column a small,
.assessment-state small,
.assessment-state time,
.assessment-student-table-head,
.analysis-status,
.score-chart-legend,
.question-analysis-list .question-rate,
.histogram-column > strong {
  font-size: var(--font-size-caption);
  line-height: var(--line-height-compact);
}

.analysis-anchor-nav a,
.assessment-analysis-actions > a,
.assessment-analysis-actions > span,
.histogram-value {
  font-size: var(--font-size-meta);
  line-height: var(--line-height-compact);
}

@media (max-width: 650px) {
  .class-index-hero p,
  .class-detail-hero p,
  .codes-hero p,
  .course-index-hero p,
  .course-detail-hero p,
  .curriculum-hero p,
  .students-page-hero p,
  .student-record-hero p,
  .class-assessments-hero p,
  .assessment-analysis-hero p {
    font-size: var(--font-size-small);
  }
}