/* PALETA NEOMATIS — 29/07/2026.
 *
 * Fundo marfim QUENTE (não branco puro), tinta azul-ardósia, ações em teal e
 * acentos em cobre. Substitui a paleta anterior ("boletim oficial"), que era
 * verde-acinzentada.
 *
 * Os NOMES das variáveis foram mantidos de propósito. Eles descrevem o papel
 * ("papel", "tinta", "bronze") e são usados em centenas de lugares; renomeá-los
 * junto com a troca de cor misturaria duas mudanças e faria um `git diff`
 * ilegível — e, pior, qualquer ponto esquecido ficaria sem cor em vez de ficar
 * com a cor antiga, que é uma falha silenciosa.
 *
 * A paleta é a ÚNICA fonte: cor escrita à mão no meio do CSS foi trocada por
 * variável nesta mesma passagem. O que sobrou de hexadecimal solto são tintas
 * de acento (alertas, faixas do corretor) que não estão na paleta.
 *
 * O MENU LATERAL NÃO MUDOU. Ele já estava bom e continua com as cores dele
 * (`--side-*`, mais abaixo). A paleta traz valores próprios para a sidebar
 * (#0D2B3A / #10394A / #0F5963) — estão registrados aqui, não aplicados.
 */
:root {
  --paper: #F6F1E8;        /* 6. fundo geral — marfim quente */
  --card: #FBF8F1;         /* 7. fundo dos cards e superfícies elevadas */
  --card-edge: #D8CDBD;    /* 8. bordas e divisórias */
  --ink: #1F3342;          /* 9. texto principal / títulos */
  --ink-soft: #5F6B72;     /* 10. texto secundário, legendas, rótulos */
  --bronze: #C0824A;       /* 11. acento cobre */
  --petrol: #15706E;       /* 4. botão principal (teal) */
  --petrol-hover: #0E5F5C; /* 5. hover/pressão do botão principal */
  --petrol-accent: #C7D8CF; /* 12. acento de sucesso suave — INDICADOR (pílula,
                               barra, legenda), onde o texto por cima é --ink */
  --petrol-soft: #EEF0E9;  /* o mesmo verde a 25% sobre o card: é a SUPERFÍCIE.
                               O valor da paleta, usado como fundo de bloco com
                               texto, derruba o secundário para 3,69:1 */
  /* DERIVADOS da paleta, não inventados: mistura da cor com o fundo.
     `--rule` é a divisória sutil (metade do peso da borda de card) e
     `--bronze-soft` é o cobre rebaixado para bordas e estados de foco. */
  --rule: #E7DFD2;         /* card-edge 50% + paper 50% */
  --bronze-soft: #D8B491;  /* bronze 55% + paper 45% */
  /* O cobre da paleta é ACENTO: preenchimento, ícone, borda, traço. Como TEXTO
     ele dá 2,86:1 no fundo marfim, abaixo de qualquer critério de leitura — e
     é justamente em texto que este painel mais o usa (os números grandes).
     Este é o MESMO matiz a 75% de luminosidade: 4,68:1 no fundo e 4,96:1 no
     card, e branco sobre ele dá 5,26:1. Cor de acento e cor de texto são
     papéis diferentes; a paleta define o primeiro, este define o segundo. */
  --bronze-ink: #906238;   /* bronze a 75% — legível como texto */
  --danger: #8a3b2e;
  /* Elevação: com fundo e card a cinco tons de distância, é a sombra que separa
     um do outro. A dica da paleta pede exatamente isso — sombra sutil nos
     cards — em vez de escurecer o fundo para criar contraste. */
  --elev: 0 1px 2px rgba(31, 51, 66, 0.04), 0 2px 10px rgba(31, 51, 66, 0.045);
  --radius-pill: 999px;
  --serif: "Fraunces", Georgia, serif;
  --sans: "Inter", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
}

* { box-sizing: border-box; }

/* O atributo hidden SEMPRE vence, mesmo em elementos com display próprio
   (flex/grid) — sem isto, painéis como o tutor por voz abririam sozinhos. */
[hidden] { display: none !important; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.5;
}

/* ---------- Cabeçalho ---------- */
.masthead {
  border-bottom: 3px double var(--bronze);
  background: linear-gradient(180deg, var(--card), var(--paper));
}
.masthead-inner {
  max-width: 980px;
  margin: 0 auto;
  padding: 28px 20px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.contest-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
}
.contest-select {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--bronze-ink);
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid var(--bronze);
  border-radius: 4px;
  padding: 4px 8px;
  max-width: 320px;
  cursor: pointer;
}
.contest-select:hover { color: var(--ink); border-color: var(--ink); }
.contest-add {
  font-family: var(--mono);
  font-size: 16px;
  line-height: 1;
  color: var(--bronze-ink);
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid var(--bronze);
  border-radius: 4px;
  width: 28px;
  height: 28px;
  cursor: pointer;
}
.contest-add:hover { color: #fff; background: var(--bronze-ink); }

.empty-contest {
  max-width: 640px;
  margin: 40px auto;
  padding: 24px;
  text-align: center;
  border: 1px dashed var(--bronze);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.4);
}
.empty-contest p { margin: 0 0 10px; }
.empty-contest p:last-child { margin-bottom: 0; }

.contest-manage {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--rule);
}
.contest-manage-title {
  font-family: var(--serif);
  font-weight: 600;
  margin: 0 0 6px;
}
.archived-list { margin-top: 12px; }
.archived-title { font-family: var(--mono); font-size: 12px; color: var(--ink-soft); margin: 0 0 6px; }
.archived-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
  border-top: 1px dotted var(--rule);
}
.archived-row button {
  font-family: var(--mono);
  font-size: 12px;
  border: 1px solid var(--bronze);
  background: none;
  color: var(--bronze-ink);
  border-radius: 4px;
  padding: 3px 10px;
  cursor: pointer;
}
.archived-row button:hover { background: var(--bronze-ink); color: #fff; }
#btn-delete-contest.danger { border-color: var(--danger); color: var(--danger); }
#btn-delete-contest.danger:hover { background: var(--danger); color: #fff; }
/* MARCA no alto da tela: selo + nome. O slogan fica logo abaixo, no h1 — é o
   lugar onde antes ficava o nome descritivo do painel. */
.brand {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 6px;
}
.brand-mark { width: 30px; height: 30px; flex: 0 0 auto; }
.brand-nome {
  font-family: var(--serif);
  font-weight: 700;
  font-size: 1.35rem;
  letter-spacing: -0.01em;
  color: var(--ink);
  line-height: 1;
}
/* O slogan é a voz da marca, não um título de seção: um corpo menor que o nome,
   em peso normal. Grande e em negrito ele competiria com o próprio nome. */
.masthead h1 {
  font-family: var(--serif);
  font-weight: 500;
  font-size: clamp(1rem, 2.2vw, 1.25rem);
  color: var(--ink-soft);
  margin: 0 0 8px;
  line-height: 1.3;
  max-width: 34ch;
}
.masthead-status {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--ink-soft);
  margin: 0;
}
.masthead-status.saved { color: var(--petrol); }
.masthead-status.error { color: var(--danger); font-weight: 600; }

.masthead-stats {
  display: flex;
  align-items: center;
  gap: 22px;
  flex: 0 0 auto;
}
.aprov-geral {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 10px 14px;
  border: 1px solid var(--bronze-soft);
  border-radius: 3px;
  background: var(--card);
}
.aprov-value {
  font-family: var(--mono);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--petrol);
}
.aprov-caption {
  font-family: var(--mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--ink-soft);
  text-align: center;
  line-height: 1.5;
}
.overall {
  position: relative;
  width: 128px;
  height: 128px;
  flex: 0 0 auto;
}
.overall-ring { width: 100%; height: 100%; transform: rotate(-90deg); }
.ring-bg, .ring-fg {
  fill: none;
  stroke-width: 9;
  stroke-linecap: round;
}
.ring-bg { stroke: var(--rule); }
.ring-fg {
  stroke: var(--bronze);
  stroke-dasharray: 326.7;
  stroke-dashoffset: 326.7;
  transition: stroke-dashoffset 0.5s ease;
}
.overall-label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.overall-value {
  font-family: var(--mono);
  font-weight: 600;
  font-size: 1.35rem;
  color: var(--ink);
}
.overall-caption {
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--ink-soft);
}

/* ---------- Ritmo de estudo (faixa sob o cabeçalho) ---------- */
.study-strip {
  max-width: 980px;
  margin: 18px auto 0;
  padding: 0 20px;
}
.study-strip-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  padding: 12px 16px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 4px solid var(--petrol);
  border-radius: 3px;
  box-shadow: 0 1px 2px rgba(34, 48, 63, 0.07);
}
.study-stats {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  /* Sem isto, `min-width: auto` (o padrão de item flex) impede a faixa de
     encolher abaixo do próprio conteúdo. */
  min-width: 0;
}
.study-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  min-width: 62px;
}
.study-stat-value {
  font-family: var(--mono);
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--petrol);
}
.study-stat.clickable { cursor: pointer; }
.study-stat.clickable:hover .study-stat-caption { color: var(--bronze-ink); }
/* Contador sem data: mostra QUAL data falta ("Data da prova") como convite. */
.study-stat-value.stat-unset {
  font-size: 0.7rem;
  color: var(--bronze-ink);
  text-decoration: underline dotted;
  text-underline-offset: 3px;
  line-height: 1.25;
  text-align: center;
  max-width: 84px;
  padding-top: 5px;
}
.study-stat-caption {
  font-family: var(--mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-soft);
  text-align: center;
  line-height: 1.4;
}
/* A CAUSA DA ROLAGEM HORIZONTAL NO CELULAR, corrigida em 29/07/2026.
 *
 * `flex: 0 0 auto` (não encolhe) + `flex-wrap` implícito em nowrap deixava os
 * quatro botões numa linha rígida de 423px. Numa tela de 375px isso não só
 * cortava o último botão: como o item não encolhia, ele fixava a largura da
 * LINHA do flex em 423px, e a faixa de estatísticas ao lado — que encolhe e
 * quebra sozinha — passava a se esticar até 423px também. Um item teimoso
 * arrastava o vizinho e a página inteira ganhava barra de rolagem lateral.
 *
 * Encolher e quebrar resolve os dois de uma vez, sem esconder nenhum botão. */
.study-actions {
  display: flex;
  gap: 8px;
  flex: 0 1 auto;
  flex-wrap: wrap;
  min-width: 0;
}
.study-actions button {
  font-family: var(--mono);
  font-size: 12px;
  padding: 7px 12px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
}
.study-actions button:hover { border-color: var(--petrol); color: var(--petrol); }
#btn-add-session {
  border-color: var(--petrol);
  background: var(--petrol);
  color: #fff;
}
#btn-add-session:hover { background: var(--petrol-hover); color: #fff; }

.study-panel {
  margin-top: 8px;
  padding: 14px 16px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--bronze-soft);
  border-radius: 2px;
}

/* Formulário de sessão */
.session-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
}
.session-fields label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
}
.session-fields input, .session-fields select {
  font-family: var(--sans);
  font-size: 13px;
  padding: 5px 8px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  min-width: 120px;
}
.session-fields input:focus, .session-fields select:focus { outline: 2px solid var(--bronze-soft); }
/* A grandeza do tempo, ao lado do campo que a pede. Fora do caixa-alta do
   rótulo de propósito: é frase, não etiqueta, e precisa ser lida. */
.field-hint {
  font-family: var(--sans);
  font-size: 11px;
  line-height: 1.35;
  text-transform: none;
  letter-spacing: 0;
  color: var(--ink-soft);
  max-width: 24ch;
}
/* O tópico tem título longo por natureza (é texto de edital). O select ganha
   largura própria e trunca, com o texto íntegro no `title` de cada opção. */
.session-subtopic-label { flex: 1 1 260px; min-width: 0; }
.session-subtopic-label select { width: 100%; max-width: 100%; }
.session-fields select:disabled { color: var(--ink-soft); background: var(--paper); }
.session-note-label { flex: 1 1 220px; }
.session-note-label input { width: 100%; }
.session-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.session-actions button {
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 600;
  padding: 7px 16px;
  border: 1.5px solid var(--card-edge);
  border-radius: var(--radius-pill);
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
}
.session-actions button[type="submit"],
.session-actions button.quiz-generate,
.session-actions button.simulado-extract {
  border-color: var(--petrol);
  background: var(--petrol);
  color: #fff;
}
.session-actions button:hover { border-color: var(--petrol); color: var(--petrol); }
.session-actions button[type="submit"]:hover,
.session-actions button.quiz-generate:hover,
.session-actions button.simulado-extract:hover { background: var(--petrol-hover); color: #fff; }
.session-actions.simulado-uploads { flex-wrap: wrap; }

.session-recent-title {
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  margin: 14px 0 6px;
}
.session-recent-list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
}
.session-recent-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 3px 0;
  border-bottom: 1px dashed var(--rule);
}
.session-recent-list button {
  border: none;
  background: none;
  color: var(--ink-soft);
  font-size: 14px;
  cursor: pointer;
  padding: 0 4px;
}
.session-recent-list button:hover { color: var(--danger); }

/* Calendário mensal */
.calendar-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 10px;
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.02rem;
}
.calendar-header button {
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  font-size: 14px;
  width: 28px;
  height: 28px;
  cursor: pointer;
}
.calendar-header button:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  max-width: 420px;
  margin: 0 auto;
}
.cal-weekday {
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
  color: var(--ink-soft);
  text-align: center;
  padding: 2px 0;
}
.cal-day {
  font-family: var(--mono);
  font-size: 12px;
  text-align: center;
  padding: 5px 0 3px;
  border-radius: 2px;
  border: 1px solid transparent;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-height: 38px;
  cursor: pointer;
}
.cal-day-num { line-height: 1; }
/* Faixa de marcas do dia (prova, simulado, revisões) — altura fixa para as
   células não "pularem" entre dias com e sem marca. */
.cal-day-flags {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 10px;
  font-size: 8px;
  line-height: 1;
}
.cal-flag-exam { font-size: 9px; }
.cal-flag-simulado { color: var(--acc-vinho); font-size: 9px; }
.cal-day.level-2 .cal-flag-simulado { color: #f3d9d9; }
.cal-flag-review {
  background: var(--acc-ocre);
  color: #fff;
  border-radius: 6px;
  min-width: 10px;
  padding: 0 2px;
  font-weight: 700;
}
.cal-flag-review.overdue { background: var(--danger); }
.cal-day.level-0 { background: var(--paper); color: var(--ink-soft); }
.cal-day.level-1 { background: var(--petrol-soft); color: var(--petrol); font-weight: 600; }
.cal-day.level-2 { background: var(--petrol); color: #fff; font-weight: 600; }
.cal-day.today { border-color: var(--bronze-ink); }
/* Dias futuros ficam discretos, mas as marcas de agenda (prova/revisão)
   continuam legíveis — é justamente para isso que o dia futuro existe aqui. */
.cal-day.future { opacity: 0.55; }
.cal-day.future.exam, .cal-day.future.has-review { opacity: 1; }
.cal-day.exam { border-color: var(--acc-vinho); border-style: dashed; }
.cal-day.selected { outline: 2px solid var(--bronze); outline-offset: -1px; }
.cal-day:hover { border-color: var(--bronze-ink); }
/* Cada item da legenda anda com o seu símbolo — quebra de linha nunca separa
   o quadradinho do rótulo. */
.cal-legend-item { white-space: nowrap; }
.cal-swatch-mark { font-size: 10px; }
.cal-swatch-simulado { color: var(--acc-vinho); }
.cal-swatch-review {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 6px;
  background: var(--acc-ocre);
  vertical-align: -1px;
}
.calendar-summary {
  text-align: center;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-soft);
  margin: 8px 0 0;
}
.calendar-detail {
  max-width: 420px;
  margin: 10px auto 0;
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--bronze);
  border-radius: 2px;
  background: #fff;
  padding: 10px 12px;
}
.cal-detail-title {
  margin: 0 0 6px;
  font-family: var(--serif);
  font-weight: 600;
  font-size: 0.95rem;
}
.cal-detail-list {
  margin: 0;
  padding-left: 18px;
  font-size: 0.86rem;
  color: var(--ink);
}
.cal-detail-list li { margin: 2px 0; }
.cal-detail-action {
  margin-top: 8px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: var(--paper);
  color: var(--petrol);
  font-size: 0.8rem;
  padding: 4px 10px;
  cursor: pointer;
}
.cal-detail-action:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }
.calendar-legend {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--ink-soft);
  margin: 10px 0 0;
}
.cal-swatch {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 2px;
  vertical-align: -2px;
}
.cal-swatch.level-0 { background: var(--paper); border: 1px solid var(--card-edge); }
.cal-swatch.level-1 { background: var(--petrol-accent); }
.cal-swatch.level-2 { background: var(--petrol); }

/* Linha honesta do dia (topo da vista "Hoje"): prazo · fase · tempo que cabe,
   e o plano que cabe nesse tempo. Sem enfeite: é a primeira coisa que a
   usuária lê ao abrir o painel. */
.today-line {
  margin-top: 10px;
  padding: 10px 14px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 4px solid var(--petrol);
  border-radius: 3px;
}
.today-line-main {
  margin: 0;
  font-family: var(--serif);
  font-size: 1.02rem;
  color: var(--ink);
  line-height: 1.5;
}
.today-line-main strong { color: var(--petrol); }
.today-line-unset {
  color: var(--bronze-ink);
  border-bottom: 1px dashed var(--bronze-soft);
  cursor: pointer;
}
.today-line-unset:hover { color: var(--ink); }
.today-line-plan {
  margin: 6px 0 0;
  font-size: 0.9rem;
  color: var(--ink);
}
.today-line-plan strong { font-weight: 600; }
.today-line-note {
  margin: 4px 0 0;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-soft);
}
.today-line-note.over { color: var(--danger); }
.today-line-how { margin-top: 8px; }

/* Ciclo de estudo — cronograma de conteúdo novo (hoje + 7 dias). Cada dia é um
   cartão com os assuntos NOMEADOS; o de hoje ganha a borda em petróleo. */
.cycle-panel {
  margin-top: 8px;
  padding: 12px 14px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 4px solid var(--bronze);
  border-radius: 3px;
}
.cycle-kicker {
  margin: 0 0 8px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.cycle-week {
  margin: 0 0 10px;
  font-size: 0.82rem;
  color: var(--ink-soft);
}
.cycle-week-hint { opacity: 0.75; }
.cycle-missing {
  margin: 0 0 8px;
  font-size: 0.86rem;
  color: var(--bronze-ink);
}
.cycle-ok {
  margin: 0 0 8px;
  font-size: 0.86rem;
  color: var(--petrol);
}
.cycle-warn {
  margin: 0 0 10px;
  padding: 8px 10px;
  border: 1px solid var(--danger);
  border-left: 3px solid var(--danger);
  border-radius: 3px;
  background: rgba(138, 59, 46, 0.06);
}
.cycle-warn p { margin: 0 0 4px; font-size: 0.86rem; color: var(--ink); }
.cycle-warn p:last-child { margin-bottom: 0; }
.cycle-warn strong { color: var(--danger); }
.cycle-warn-fix { color: var(--ink-soft) !important; font-size: 0.82rem !important; }
.cycle-cut-n { font-family: var(--mono); font-size: 10px; color: var(--ink-soft); white-space: nowrap; }

.cycle-days {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 8px;
}
.cycle-day {
  padding: 8px 10px;
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: 3px;
}
.cycle-day.is-today {
  border-color: var(--petrol);
  border-left: 3px solid var(--petrol);
  /* HOJE se marca pela borda e pelo rótulo, não por um preenchimento tingido:
     qualquer tinta aqui empurra o texto secundário do dia abaixo de 4,5:1. */
  background: var(--card);
}
.cycle-day-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 6px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--rule);
}
.cycle-day-name { font-family: var(--mono); font-size: 11px; color: var(--ink); }
.cycle-day-name strong { color: var(--petrol); text-transform: uppercase; letter-spacing: 0.06em; }
.cycle-day-time { font-family: var(--mono); font-size: 10px; color: var(--ink-soft); }
/* No card de HOJE o fundo é o acento de sucesso, onde --ink-soft dá 3,69:1. */
.cycle-day.is-today .cycle-day-time { color: var(--ink); }
.cycle-day-items { list-style: none; margin: 0; padding: 0; }
.cycle-day-items li {
  display: flex;
  align-items: baseline;
  gap: 6px;
  padding: 2px 0;
  font-size: 0.82rem;
  line-height: 1.35;
}
.cycle-disc {
  flex: none;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--bronze-ink);
}
/* Edição inline: o formulário nasce DENTRO do item, com o card visível. Ocupa a
   linha inteira do <li> (que é flex) para não espremer os campos. */
.edicao-inline {
  flex: 1 0 100%;
  margin: 8px 0 2px;
  padding: 10px;
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--bronze-soft);
  border-radius: 3px;
  background: var(--card);
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.edicao-inline-titulo { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }
.edicao-inline-ajuda { margin: 0; font-size: 12px; color: var(--ink-soft); }

.edicao-inline-campos { display: flex; flex-wrap: wrap; gap: 8px; }
.edicao-inline-campos label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 12px;
  color: var(--ink-soft);
  flex: 1 1 120px;
}
.edicao-inline-campos input,
.edicao-inline-campos select { font-size: 13px; padding: 4px 6px; }

.edicao-inline-erro { margin: 0; font-size: 12px; color: var(--erro, #b3402f); }
.edicao-inline-acoes { display: flex; gap: 6px; }

.cycle-selo.andamento { color: var(--bronze-ink); }

/* "Este número mudou desde a última vez": a regra é que ele nunca se mova sem
   explicação, então o aviso precisa ser visível sem ser alarme. */
.viab-mudou {
  margin: 8px 0;
  padding: 8px 10px;
  font-size: 0.85rem;
  border-left: 3px solid var(--bronze-soft);
  background: var(--paper-soft, rgba(0,0,0,0.04));
}

/* A contagem de tópicos ao lado da cobertura em minutos: presente, secundária. */
.cov-contagem { color: var(--ink-soft); font-size: 0.92em; }

.today-viab-link { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.today-viab-heuristico { color: var(--bronze-ink); font-size: 0.9em; cursor: help; }

.cycle-item { flex: 1 1 auto; min-width: 0; color: var(--ink); }

/* Contexto do item: o tópico-pai em texto secundário acima do subtópico em
   destaque. Os dois truncam — um título de edital pode ser um parágrafo — e o
   texto íntegro vem no `title` (mouse) ou tocando (classe .expandido). */
.cycle-item-pai {
  display: block;
  font-size: 11.5px;
  color: var(--ink-soft);
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cycle-item-titulo {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.cycle-item.expandido { cursor: zoom-out; }
.cycle-item.expandido .cycle-item-pai { white-space: normal; overflow: visible; }
.cycle-item.expandido .cycle-item-titulo { -webkit-line-clamp: unset; display: block; overflow: visible; }
.cycle-item[data-expandir-texto] { cursor: zoom-in; }
.cycle-part { font-style: normal; font-size: 10px; color: var(--bronze-ink); }
.cycle-min { flex: none; font-family: var(--mono); font-size: 10px; color: var(--ink-soft); }
.cycle-day-empty { margin: 0; font-size: 0.8rem; color: var(--ink-soft); }
.cycle-day-extra {
  margin: 6px 0 0;
  padding-top: 4px;
  border-top: 1px dotted var(--rule);
  font-family: var(--mono);
  font-size: 10px;
  color: var(--ink-soft);
}
.cycle-how { margin-top: 10px; }
.cycle-table { width: 100%; border-collapse: collapse; margin: 6px 0; font-size: 0.82rem; }
.cycle-table th, .cycle-table td { padding: 3px 6px; border-bottom: 1px solid var(--rule); text-align: left; }
.cycle-table th { font-family: var(--mono); font-size: 10px; text-transform: uppercase; color: var(--ink-soft); font-weight: 500; }
.cycle-table .num { text-align: right; font-family: var(--mono); font-size: 11px; white-space: nowrap; }
.cycle-table .cycle-out td { color: var(--ink-soft); font-style: italic; }

/* Painel "O que Estudar e Revisar Hoje" — bloco principal de decisão do dia:
   destaque em bronze, recolhível pelo cabeçalho (que resume as pendências). */
.today-panel {
  margin-top: 8px;
  padding: 0;
  background: var(--card);
  border: 1px solid var(--bronze-soft);
  border-left: 4px solid var(--bronze);
  border-radius: 3px;
  box-shadow: 0 2px 5px rgba(143, 111, 63, 0.16);
}
.today-head {
  display: flex;
  align-items: stretch;
  gap: 0;
  background: linear-gradient(180deg, rgba(143, 111, 63, 0.10), rgba(143, 111, 63, 0.03));
}
.today-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 auto;
  min-width: 0;
  padding: 12px 16px;
  border: none;
  background: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.today-toggle:hover .today-kicker { color: var(--ink); }
.today-help-btn {
  flex: 0 0 auto;
  align-self: center;
  margin-right: 12px;
  font-family: var(--mono);
  font-size: 10px;
  padding: 4px 8px;
  border: 1px dashed var(--bronze-soft);
  border-radius: 2px;
  background: none;
  color: var(--bronze-ink);
  cursor: pointer;
  white-space: nowrap;
}
.today-help-btn:hover { border-style: solid; color: var(--ink); }
.review-help {
  padding: 10px 12px;
  margin-bottom: 12px;
  background: var(--petrol-soft);
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--petrol);
  border-radius: 2px;
  font-size: 13px;
}
.review-help p { margin: 0 0 8px; }
.review-help p:last-child { margin-bottom: 0; }

/* Relatório de ritmo (item 5) */
.pace-report {
  padding: 8px 10px;
  margin-bottom: 10px;
  background: var(--paper);
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  font-size: 13px;
}
.pace-report p { margin: 0 0 5px; }
.pace-report p:last-child { margin-bottom: 0; }
.pace-base {
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
}
.pace-verdict { font-weight: 600; }
.pace-suficiente { color: var(--petrol); }
.pace-apertado { color: var(--bronze-ink); }
.pace-insuficiente { color: var(--danger); }
.pace-hint { color: var(--ink-soft); }
.pace-link {
  color: var(--bronze-ink);
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: pointer;
}
.pace-link:hover { color: var(--ink); }

/* Importação de conteúdo programático (item 8) */
#edital-text {
  width: 100%;
  font-family: var(--sans);
  font-size: 13px;
  padding: 8px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  margin: 8px 0;
  resize: vertical;
  background: #fff;
  color: var(--ink);
}
.edital-tree {
  max-height: 320px;
  overflow-y: auto;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: var(--paper);
  padding: 8px 12px;
  margin: 8px 0;
  font-size: 13px;
}
.edital-tree ul { margin: 2px 0; padding-left: 18px; }
.edital-tree li { margin: 2px 0; }

/* Controles de edição da prévia verticalizada (Fase 7b) — compactos e inline */
.edital-edit { margin-left: 6px; white-space: nowrap; }
.edital-edit-btn {
  padding: 0 5px;
  margin-left: 2px;
  font-size: 0.82em;
  line-height: 1.5;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: none;
  cursor: pointer;
}
.edital-edit-btn:hover { background: var(--card-edge); }
#edital-jobs-preview select { margin-left: 4px; }
#edital-preview .session-actions button.danger,
#edital-jobs-preview .session-actions button.danger { border-color: var(--danger); color: var(--danger); background: none; }

/* Destino da importação de edital — escolhido ANTES de analisar o PDF */
.edital-dest {
  border: 1px solid var(--bronze-soft);
  border-radius: 2px;
  background: var(--paper);
  padding: 8px 12px;
  margin: 8px 0;
}
.edital-dest legend {
  font-size: 12px;
  font-weight: 600;
  color: var(--bronze-ink);
  padding: 0 6px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.edital-dest label {
  display: block;
  margin: 6px 0;
  font-size: 13px;
  cursor: pointer;
}
.edital-dest input[type="radio"] { margin-right: 6px; }

/* Excluir disciplina — discreto, no fim do corpo da disciplina */
.disc-delete { margin-top: 12px; text-align: right; }
.disc-delete button {
  font-size: 12px;
  padding: 3px 10px;
  border: 1px solid var(--danger);
  border-radius: 2px;
  color: var(--danger);
  background: none;
  cursor: pointer;
}
.disc-delete button:hover { background: var(--danger); color: #fff; }
#edital-preview .session-actions button.danger:hover { background: var(--danger); color: #fff; }

/* Resumo gerado por IA (item 9): selo de revisão obrigatória + gerador */
.ai-badge {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 8px 10px;
  margin-bottom: 8px;
  background: rgba(143, 111, 63, 0.14);
  border: 1px dashed var(--bronze);
  border-radius: 2px;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--bronze-ink);
  font-weight: 600;
}
.ai-badge button {
  font-family: var(--mono);
  font-size: 11px;
  padding: 4px 9px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
}
.ai-badge button.ai-confirm {
  border-color: var(--petrol);
  background: var(--petrol);
  color: #fff;
}
.ai-badge button.ai-confirm:hover { background: var(--petrol-hover); }
.note-gen {
  padding: 8px 10px;
  margin: 8px 0;
  background: var(--paper);
  border: 1px solid var(--card-edge);
  border-radius: 2px;
}
.note-gen .gen-source {
  width: 100%;
  font-family: var(--sans);
  font-size: 13px;
  padding: 6px 8px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  resize: vertical;
  background: #fff;
  color: var(--ink);
}
.note-gen .gen-mode {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin: 6px 0;
  font-size: 12px;
}
.today-kicker {
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bronze-ink);
  margin: 0;
}
.today-summary {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-soft);
  margin-left: auto;
  text-align: right;
}
.today-summary.has-overdue { color: var(--danger); font-weight: 600; }
.today-caret {
  font-size: 12px;
  color: var(--bronze-ink);
  flex: 0 0 auto;
}
.today-body { padding: 12px 16px 14px; }
.today-suggestion {
  font-family: var(--serif);
  font-size: 1.02rem;
  line-height: 1.45;
  margin: 0 0 10px;
}
.review-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 8px 10px;
  margin-bottom: 6px;
  background: var(--paper);
  border: 1px solid var(--card-edge);
  border-radius: 2px;
}
.review-item.overdue { border-left: 3px solid var(--danger); }
.review-item:not(.overdue) { border-left: 3px solid var(--petrol); }
.review-info {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  flex: 1 1 260px;
  min-width: 0;
}
.review-disc {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--bronze-ink);
  border: 1px solid var(--bronze-soft);
  border-radius: 2px;
  padding: 1px 5px;
  flex: 0 0 auto;
}
.review-title { font-size: 13px; font-weight: 600; }
.review-meta {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-soft);
  flex-basis: 100%;
}
.review-item.overdue .review-meta { color: var(--danger); }
.review-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.review-actions button {
  font-family: var(--mono);
  font-size: 11px;
  padding: 4px 9px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
}
.review-actions button:hover { border-color: var(--petrol); color: var(--petrol); }
/* Ação principal de um bloco (Treinar, Corrigir, Gerar exercícios…): uma só por
   contexto, para o olho saber onde tocar sem ler tudo. Antes esta regra só valia
   dentro de .review-actions e os botões principais das outras telas ficavam com
   a aparência de botão secundário. */
/* O `.toolbar button` (mais abaixo no arquivo) alcança os painéis que moram
   dentro do rodapé — daí o segundo seletor, para a ação principal não sair
   pintada de botão comum lá dentro. */
button.primary,
.toolbar button.primary {
  border-color: var(--petrol);
  background: var(--petrol);
  color: #fff;
}
button.primary:hover,
.toolbar button.primary:hover { background: var(--petrol-hover); color: #fff; }
button.primary:disabled,
.toolbar button.primary:disabled { opacity: 0.55; }
.review-more {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-soft);
  margin: 4px 0 0;
}
#btn-activate-reviews {
  font-family: var(--mono);
  font-size: 11px;
  padding: 6px 12px;
  margin-top: 4px;
  border: 1px dashed var(--bronze-soft);
  border-radius: 2px;
  background: none;
  color: var(--bronze-ink);
  cursor: pointer;
}
#btn-activate-reviews:hover { border-style: solid; }

/* Destaque temporário ao pular para um subtópico ("Refazer questões") */
.node-row.flash {
  background: rgba(143, 111, 63, 0.22);
  transition: background 1.6s ease;
}

/* Configurações de estudo (painel no rodapé) */
.settings-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
}
.settings-fields label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
}
.settings-fields input {
  font-family: var(--sans);
  font-size: 13px;
  padding: 5px 8px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  min-width: 150px;
}
.settings-fields input:focus { outline: 2px solid var(--bronze-soft); }

/* Quais dias da semana são de estudo (e quantas horas em cada) */
.settings-week {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--card-edge);
}
.settings-week-title {
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  margin: 0 0 4px;
}
.settings-week-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 20px;
  margin-top: 10px;
}
.settings-week-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--ink);
  flex: 0 0 auto;
}
.settings-week-day { min-width: 62px; }
.settings-week-hours {
  font-family: var(--sans);
  font-size: 13px;
  padding: 3px 6px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  width: 68px;
}
.settings-week-hours:disabled { background: var(--paper); color: var(--ink-soft); }
.settings-week-hours:focus { outline: 2px solid var(--bronze-soft); }
.settings-week-unit { font-size: 11px; color: var(--ink-soft); }
.settings-week-note {
  margin: 10px 0 0;
  font-size: 12px;
  color: var(--ink-soft);
}
.settings-week-note.over { color: var(--danger, #a33); }
@media (max-width: 640px) {
  .settings-week-row { flex: 1 1 100%; }
  .settings-week-day { min-width: 72px; }
}

/* ---------- Busca global e filtros ---------- */
.search-bar {
  max-width: 980px;
  margin: 16px auto 0;
  padding: 0 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.search-bar input[type="search"] {
  flex: 1 1 240px;
  font-family: var(--sans);
  font-size: 14px;
  padding: 8px 12px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: #fff;
  color: var(--ink);
}
.search-bar input[type="search"]:focus { outline: 2px solid var(--bronze-soft); }
.search-bar > button {
  font-family: var(--mono);
  font-size: 12px;
  padding: 8px 14px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
}
.search-bar > button:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }
.filter-chips {
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.chip {
  font-family: var(--mono);
  font-size: 11px;
  padding: 4px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 12px;
  background: var(--card);
  color: var(--ink-soft);
  cursor: pointer;
}
.chip:hover { border-color: var(--petrol); color: var(--petrol); }
.chip.active {
  background: var(--petrol);
  border-color: var(--petrol);
  color: #fff;
}

/* Badges por subtópico */
.leaf-badges { display: inline-flex; gap: 4px; margin-left: 6px; vertical-align: 1px; }
.badge {
  font-family: var(--mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 1px 5px;
  border-radius: 2px;
  white-space: nowrap;
}
.badge-danger { background: var(--danger); color: #f6efe9; }
.badge-danger-o { border: 1px solid var(--danger); color: var(--danger); }
.badge-petrol { background: var(--petrol); color: #fff; }
.badge-bronze { background: var(--bronze-ink); color: #f6f3ec; }
.badge-ia { border: 1px solid var(--petrol); color: var(--petrol); }

/* ---------- Painel de questões do subtópico (rodadas + quiz IA) ---------- */
.quest-panel { border-left-color: var(--petrol); }
.quest-block {
  padding: 14px 16px;
  margin-bottom: 12px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-radius: 10px;
}
.quest-block:last-child { margin-bottom: 0; }
.quest-block-title {
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--petrol);
  margin: 4px 0 8px;
}
.quest-hint {
  font-size: 12px;
  color: var(--ink-soft);
  margin: 4px 0 8px;
}
.round-errors { margin-top: 8px; }
.error-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.error-chip {
  font-size: 12px;
  color: var(--ink);
  border: 1px solid var(--card-edge);
  border-radius: 12px;
  padding: 3px 10px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #fff;
}
.error-chip input { accent-color: var(--danger); margin: 0; }
.round-errors input[type="text"] {
  width: 100%;
  font-size: 13px;
  padding: 5px 8px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
}
.round-history { font-size: 12.5px; }
.round-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 3px 0;
  border-bottom: 1px dashed var(--rule);
}
.round-row button {
  border: none;
  background: none;
  color: var(--ink-soft);
  cursor: pointer;
  font-size: 14px;
  padding: 0 4px;
}
.round-row button:hover { color: var(--danger); }

/* Quiz de fixação IA */
.quiz-status { font-family: var(--mono); font-size: 12px; color: var(--bronze-ink); margin: 6px 0; }
.quiz-stale {
  font-size: 12px;
  color: var(--danger);
  background: rgba(138, 59, 46, 0.07);
  border: 1px dashed var(--danger);
  border-radius: 2px;
  padding: 6px 10px;
  margin: 6px 0;
}
.quiz-q {
  background: #fff;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  padding: 10px 12px;
  margin: 8px 0;
}
.quiz-q.right { border-left: 3px solid var(--petrol); }
.quiz-q.wrong { border-left: 3px solid var(--danger); }
.quiz-q.partial { border-left: 3px solid var(--bronze); }
.quiz-q-statement { margin: 0 0 8px; font-size: 13.5px; font-weight: 600; }
.quiz-q-options { display: flex; flex-direction: column; gap: 5px; }
.quiz-q-options label { font-size: 13px; display: flex; gap: 7px; align-items: baseline; cursor: pointer; }
.quiz-q-options input[type="radio"] { accent-color: var(--petrol); }
.quiz-q-options textarea {
  width: 100%;
  min-height: 60px;
  font-family: var(--sans);
  font-size: 13px;
  padding: 6px 8px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  resize: vertical;
}
.quiz-q-feedback { margin-top: 8px; font-size: 12.5px; }
.quiz-verdict { font-weight: 600; margin: 0 0 4px; }
.quiz-q.right .quiz-verdict { color: var(--petrol); }
.quiz-q.wrong .quiz-verdict { color: var(--danger); }
.quiz-q.partial .quiz-verdict { color: var(--bronze-ink); }
.quiz-ai-tag {
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bronze-ink);
  border: 1px solid var(--bronze);
  border-radius: 3px;
  padding: 1px 5px;
  margin-left: 6px;
  font-weight: 400;
}
.quiz-points { margin: 4px 0 6px; padding-left: 18px; list-style: none; }
.quiz-points li { margin: 2px 0; text-indent: -14px; }
.quiz-points .pt-ok { color: var(--petrol); }
.quiz-points .pt-miss { color: var(--danger); }
.quiz-points em { color: var(--ink-soft); font-style: italic; }
.quiz-expl { color: var(--ink-soft); margin: 0; }
.quiz-model { margin: 0 0 4px; }
.quiz-self { display: flex; gap: 8px; align-items: center; margin-top: 6px; font-size: 12px; }
.quiz-self button {
  font-family: var(--mono);
  font-size: 11px;
  padding: 3px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: var(--card);
  cursor: pointer;
}
.quiz-self button.chosen { background: var(--petrol); border-color: var(--petrol); color: #fff; }
.quiz-result {
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 600;
  color: var(--petrol);
  margin: 8px 0 0;
}

/* A linha "Retenção de Revisão (IA)" saiu do cabeçalho em 29/07/2026, com a
   regra dela: o card do topo responde "como eu iria numa prova real?", e
   questão gerada a partir do meu próprio resumo não responde isso. O indicador
   continua existindo — em Desempenho, onde tem espaço para ser explicado. */

/* Diagnóstico de erros */
.evo-table {
  border-collapse: collapse;
  width: 100%;
  max-width: 520px;
  font-size: 12.5px;
  margin: 4px 0 14px;
}
.evo-table th, .evo-table td {
  border: 1px solid var(--card-edge);
  padding: 5px 10px;
  text-align: left;
}
.evo-table th {
  background: var(--paper);
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
}
.evo-table td strong { color: var(--petrol); font-family: var(--mono); }
.evo-table td:nth-child(2) { background: rgba(44, 97, 87, 0.05); } /* simulados em destaque */
.evo-n { color: var(--ink-soft); font-size: 11px; }

.errors-rec {
  font-size: 13px;
  background: rgba(143, 111, 63, 0.08);
  border-left: 3px solid var(--bronze);
  padding: 8px 10px;
  border-radius: 2px;
}
.errors-cols { display: flex; flex-wrap: wrap; gap: 18px; }
.errors-cols > div { flex: 1 1 200px; }
.errors-cols ul { margin: 0; padding-left: 18px; font-size: 12.5px; }
.errors-cols li { margin: 2px 0; }

/* ---------- Cards de disciplina ---------- */
main {
  max-width: 980px;
  margin: 24px auto 8px;
  padding: 0 20px;
}
.discipline {
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 4px solid var(--bronze);
  border-radius: 3px;
  margin-bottom: 16px;
  box-shadow: 0 1px 2px rgba(34, 48, 63, 0.07);
}
.discipline > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  user-select: none;
}
.discipline > summary::-webkit-details-marker { display: none; }
.disc-code {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--bronze-ink);
  border: 1px solid var(--bronze-soft);
  border-radius: 2px;
  padding: 2px 7px;
  flex: 0 0 auto;
}
.disc-name {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.08rem;
  flex: 1 1 auto;
  min-width: 0;
}
.disc-meta {
  display: flex;
  align-items: baseline;
  gap: 14px;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--ink-soft);
  flex: 0 0 auto;
}
.disc-index {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--ink);
}
.disc-caret {
  flex: 0 0 auto;
  color: var(--ink-soft);
  transition: transform 0.2s;
  font-size: 12px;
}
.discipline[open] .disc-caret { transform: rotate(90deg); }

.disc-body {
  border-top: 1px solid var(--rule);
  padding: 14px 18px 18px;
}

/* Prioridade / peso da disciplina */
.disc-priority {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--bronze-ink);
  border: 1px solid var(--bronze-soft);
  border-radius: 999px;
  padding: 1px 8px;
  white-space: nowrap;
}
.disc-priority[data-level="4"],
.disc-priority[data-level="5"] {
  color: #fff;
  background: var(--bronze-ink);
  border-color: var(--bronze-ink);
}
.disc-weight {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  padding: 10px 12px;
  margin-bottom: 14px;
  background: var(--petrol-soft);
  border: 1px solid var(--card-edge);
  border-radius: 3px;
}
.disc-weight label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}
.disc-weight select {
  font-family: var(--mono);
  font-size: 13px;
  padding: 3px 6px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: var(--card);
  color: var(--ink);
}
.disc-weight-hint {
  font-size: 12px;
  color: var(--ink-soft);
}

/* Distribuição de foco por prioridade (painel "hoje") */
.today-priority {
  margin: 4px 0 12px;
  padding: 10px 12px;
  background: var(--paper);
  border: 1px dashed var(--card-edge);
  border-radius: 3px;
}
.prio-title {
  margin: 0 0 8px;
  font-size: 12px;
  color: var(--ink-soft);
}
.prio-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 4px 0;
  font-size: 13px;
}
.prio-name { flex: 0 0 40%; color: var(--ink); }
.prio-bar {
  flex: 1 1 auto;
  height: 10px;
  background: var(--paper);
  border-radius: 999px;
  overflow: hidden;
}
.prio-fill {
  display: block;
  height: 100%;
  background: var(--petrol);
  border-radius: 999px;
}
.prio-fill[data-level="1"] { background: var(--bronze-soft); }
.prio-fill[data-level="2"] { background: #6f9389; }
.prio-fill[data-level="3"] { background: var(--petrol); }
.prio-fill[data-level="4"] { background: var(--bronze); }
.prio-fill[data-level="5"] { background: var(--danger); }
.prio-pct {
  flex: 0 0 auto;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--ink-soft);
  min-width: 34px;
  text-align: right;
}
.prio-edital {
  flex: 0 0 auto;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--bronze-ink);
  min-width: 52px;
  text-align: right;
}
.prio-head {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ink-soft);
  opacity: 0.8;
}
.prio-head .prio-bar { background: none; height: auto; }
.disc-priority[data-level="0"] {
  color: var(--ink-soft);
  border-color: var(--card-edge);
  background: none;
}
.disc-edital {
  font-size: 13px;
  font-weight: 600;
  color: var(--bronze-ink);
}

/* Editor: Pesos do edital */
.wb-head {
  font-family: var(--mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ink-soft);
  margin: 12px 0 6px;
}
.wb-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0;
}
.wb-row input[type="text"] { flex: 1 1 auto; min-width: 0; }
.wb-weight { flex: 0 0 auto; font-size: 13px; color: var(--ink-soft); }
.wb-weight input { width: 60px; }
.wb-row button[data-bremove] {
  flex: 0 0 auto;
  color: var(--danger);
  border-color: var(--card-edge);
}
.wd-list { display: flex; flex-direction: column; gap: 4px; }
.wd-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.wd-name { flex: 1 1 200px; font-size: 13px; color: var(--ink); }
.wd-row select { flex: 0 0 auto; max-width: 180px; }
.wd-row input[type="number"] { width: 90px; }
.wd-row input[type="text"] { flex: 1 1 140px; min-width: 0; }
.wd-pct {
  flex: 0 0 auto;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--bronze-ink);
  min-width: 52px;
  text-align: right;
}
.wtotal { font-size: 13px; color: var(--ink-soft); margin-top: 10px; }

/* Questões */
.questions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  padding: 10px 12px;
  margin-bottom: 14px;
  background: var(--paper);
  border: 1px dashed var(--card-edge);
  border-radius: 3px;
}
.questions label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ink-soft);
}
.questions input {
  width: 84px;
  font-family: var(--mono);
  font-size: 14px;
  padding: 4px 8px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
}
.questions input:focus { outline: 2px solid var(--bronze-soft); }
.questions input:disabled {
  background: var(--paper);
  color: var(--ink-soft);
  border-style: dashed;
}
.q-rate { font-family: var(--mono); font-size: 12px; color: var(--petrol); font-weight: 600; }
.q-rate.empty { color: var(--ink-soft); font-weight: 400; }
.q-hint { font-family: var(--mono); font-size: 11px; color: var(--bronze-ink); }

/* Questões/acertos por subtópico */
.leaf-quest {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  align-self: center;
}
.leaf-quest input {
  width: 46px;
  font-family: var(--mono);
  font-size: 12px;
  padding: 2px 5px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
}
.leaf-quest input::placeholder { color: var(--card-edge); }
.leaf-quest input:focus { outline: 2px solid var(--bronze-soft); }
.leaf-quest-pct {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  color: var(--petrol);
  min-width: 44px;
  text-align: right;
}

/* Árvore de tópicos */
.tree, .tree ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.tree ul { padding-left: 26px; border-left: 1px solid var(--rule); margin-left: 9px; }
.tree li { margin: 2px 0; }

.node-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 4px 6px;
  border-radius: 2px;
}
.node-row:hover { background: rgba(143, 111, 63, 0.06); }

.node-num {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--bronze-ink);
  min-width: 34px;
  flex: 0 0 auto;
}
.node-text { flex: 1 1 auto; }
.node-count {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-soft);
  white-space: nowrap;
}
.node-parent > .node-row .node-text { font-weight: 600; }
.node-group > .node-row .node-text {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.0rem;
}

.leaf-label {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex: 1 1 auto;
  cursor: pointer;
}
.leaf-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--petrol);
  flex: 0 0 auto;
  position: relative;
  top: 2px;
  cursor: pointer;
}
li.done > .node-row {
  background: var(--petrol-soft);
}
li.done > .node-row .node-text {
  color: var(--petrol);
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(44, 97, 87, 0.55);
}

/* Notas (conteúdo teórico) por subtópico */
.note-toggle {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: 1px solid var(--card-edge);
  border-radius: 6px;
  color: var(--ink-soft);
  font-size: 15px;
  width: 28px;
  height: 28px;
  padding: 0;
  cursor: pointer;
  align-self: center;
}
.note-toggle:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }
.note-toggle.has-note {
  background: var(--bronze-ink);
  border-color: var(--bronze-ink);
  color: #f6f3ec;
}
.note-panel {
  margin: 4px 4px 10px 30px;
  padding: 10px 12px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--bronze-soft);
  border-radius: 2px;
}
.note-panel textarea {
  width: 100%;
  min-height: 96px;
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.5;
  padding: 8px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  resize: vertical;
}
.note-panel textarea:focus { outline: 2px solid var(--bronze-soft); }
.note-view {
  font-size: 13px;
  line-height: 1.55;
}
.note-view h1, .note-view h2, .note-view h3, .note-view h4 {
  font-family: var(--serif);
  color: var(--ink);
  margin: 10px 0 4px;
  font-size: 1.05em;
}
.note-view > :first-child { margin-top: 0; }
.note-view p, .note-view ul, .note-view ol { margin: 4px 0; }
.note-view ul, .note-view ol { padding-left: 20px; }
.note-view code {
  font-family: var(--mono);
  font-size: 12px;
  background: var(--paper);
  padding: 1px 4px;
  border-radius: 2px;
}
.note-view table {
  border-collapse: collapse;
  margin: 8px 0;
  width: 100%;
  font-size: 12.5px;
}
.note-view th, .note-view td {
  border: 1px solid var(--card-edge);
  padding: 4px 8px;
  text-align: left;
  vertical-align: top;
}
.note-view th {
  background: var(--paper);
  font-weight: 600;
}
.note-view .katex-display {
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 0;
}
.note-view .katex { font-size: 1.05em; }
.note-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.note-actions button {
  font-family: var(--mono);
  font-size: 11px;
  padding: 4px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: var(--card);
  color: var(--ink-soft);
  cursor: pointer;
}
.note-actions button:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }

/* ---------- Tutor por voz ---------- */
.voice-overlay {
  position: fixed;
  inset: 0;
  background: rgba(34, 48, 63, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  z-index: 50;
}
.voice-modal {
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-top: 4px solid var(--petrol);
  border-radius: 4px;
  box-shadow: 0 12px 40px rgba(34, 48, 63, 0.35);
  width: 100%;
  max-width: 440px;
  padding: 18px 20px;
}
.voice-subtopic {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.05rem;
  margin: 0 0 12px;
}
/* Roteiro da aula (modo professor): leitura silenciosa do que será falado. */
.voice-aula-script {
  font-family: var(--sans);
  font-size: 13px;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--paper, rgba(34, 48, 63, 0.04));
  border: 1px solid var(--card-edge);
  border-radius: 4px;
  padding: 10px 12px;
  margin: 0 0 10px;
  max-height: 40vh;
  overflow-y: auto;
}
.voice-mode-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  margin-bottom: 10px;
}
.voice-mode-label select {
  font-family: var(--sans);
  font-size: 14px;
  padding: 8px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: #fff;
  color: var(--ink);
}
#voice-start {
  width: 100%;
  font-family: var(--mono);
  font-size: 14px;
  padding: 12px;
  margin-top: 6px;
  border: 1px solid var(--petrol);
  border-radius: 3px;
  background: var(--petrol);
  color: #fff;
  cursor: pointer;
}
#voice-start:hover { background: var(--petrol-hover); }
#voice-start:disabled { opacity: 0.6; cursor: wait; }
.voice-state {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--mono);
  font-size: 14px;
  padding: 12px 0;
}
.voice-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--card-edge);
  flex: 0 0 auto;
}
.voice-dot.connecting { background: var(--bronze-soft); animation: voicepulse 1s infinite; }
.voice-dot.listening { background: var(--petrol); animation: voicepulse 1.6s infinite; }
.voice-dot.thinking { background: var(--bronze); animation: voicepulse 0.7s infinite; }
.voice-dot.speaking { background: var(--petrol); box-shadow: 0 0 0 4px rgba(44, 97, 87, 0.25); animation: voicepulse 0.9s infinite; }
.voice-dot.error { background: var(--danger); }
.voice-dot.ended { background: var(--ink-soft); }
@keyframes voicepulse {
  50% { transform: scale(1.35); opacity: 0.7; }
}
.voice-timer {
  margin-left: auto;
  color: var(--ink-soft);
  font-size: 13px;
}
.voice-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}
.voice-actions button {
  flex: 1 1 auto;
  font-family: var(--mono);
  font-size: 12px;
  padding: 8px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
}
.voice-actions button:hover { border-color: var(--petrol); color: var(--petrol); }
.voice-feedback {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--petrol);
  font-weight: 600;
  margin: 8px 0 0;
}
.voice-error {
  font-size: 13px;
  color: var(--danger);
  background: rgba(138, 59, 46, 0.07);
  border: 1px dashed var(--danger);
  border-radius: 2px;
  padding: 8px 10px;
  margin: 10px 0 0;
}
.voice-footer { justify-content: flex-end; margin-top: 14px; }

/* ---------- Rodapé / ações ---------- */
.toolbar {
  max-width: 980px;
  margin: 8px auto 48px;
  padding: 16px 20px 0;
  border-top: 1px solid var(--rule);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.toolbar button {
  font-family: var(--mono);
  font-size: 12px;
  padding: 8px 14px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
}
.toolbar button:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }
.toolbar button.danger:hover { border-color: var(--danger); color: var(--danger); }
.toolbar-link {
  font-family: var(--mono);
  font-size: 12px;
  padding: 8px 14px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}
.toolbar-link:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }

/* Painel de backups automáticos */
.backup-panel {
  flex: 1 1 100%;
  margin-top: 6px;
  padding: 12px 14px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--bronze-soft);
  border-radius: 2px;
  font-size: 13px;
  color: var(--ink-soft);
}
.backup-panel p { margin: 0 0 10px; }
.backup-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.backup-list button {
  font-family: var(--mono);
  font-size: 12px;
  padding: 5px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
}
.backup-list button:hover { border-color: var(--petrol); color: var(--petrol); }

/* ---------- Mobile ---------- */
@media (max-width: 640px) {
  .masthead-inner { flex-direction: column; text-align: center; padding: 20px 16px; }
  .contest-bar { justify-content: center; }
  .contest-select { max-width: 70vw; }
  .study-strip { padding: 0 10px; }
  .study-strip-inner { flex-direction: column; align-items: stretch; }
  .study-stats { justify-content: space-between; gap: 6px; }
  .study-stat { min-width: 56px; flex: 1 1 auto; }
  .study-stat-value { font-size: 1.1rem; }
  .study-actions { justify-content: stretch; }
  .study-actions button { flex: 1 1 auto; }
  .session-fields label { flex: 1 1 45%; }
  .session-fields input, .session-fields select { min-width: 0; width: 100%; }
  .settings-fields label { flex: 1 1 45%; }
  .settings-fields input { min-width: 0; width: 100%; }
  .calendar-grid { max-width: 100%; }
  .review-item { flex-direction: column; align-items: stretch; }
  .review-info { flex: 0 0 auto; }
  .today-head { flex-wrap: wrap; }
  .today-toggle { padding: 10px 12px; flex-wrap: wrap; }
  .today-summary { margin-left: 0; flex-basis: 100%; text-align: left; order: 3; }
  .today-caret { margin-left: auto; }
  .today-help-btn { margin: 0 12px 8px; }
  .today-body { padding: 10px 12px 12px; }
  .settings-fields label.settings-contest { flex-basis: 100%; }
  .search-bar { padding: 0 10px; }
  .errors-cols { flex-direction: column; gap: 10px; }
  .errors-cols > div { flex: 0 0 auto; }
  .leaf-badges { margin-left: 24px; flex-basis: 100%; }
  .review-actions { justify-content: flex-start; }
  .review-actions button { flex: 1 1 auto; }
  .overall { width: 110px; height: 110px; }
  main { padding: 0 10px; }
  .discipline > summary { padding: 12px 12px; gap: 10px; flex-wrap: wrap; }
  .disc-body { padding: 10px 10px 14px; }
  .tree ul { padding-left: 16px; margin-left: 7px; }
  .node-num { min-width: 28px; }
  .questions input { width: 72px; }
  .node-row { flex-wrap: wrap; }
  .leaf-quest { margin-left: 24px; }
  .leaf-quest input { width: 40px; }
  .leaf-quest-pct { min-width: 38px; }
  .note-panel { margin-left: 8px; margin-right: 0; }
}

/* ==================== Corretor de Discursiva (corretor.html) ==================== */
.corretor-page .contest-add {
  text-decoration: none;
  width: auto;
  padding: 4px 10px;
  font-size: 12px;
  letter-spacing: 0.04em;
}
.cor-main {
  max-width: 860px;
  margin: 0 auto;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.cor-disclaimer {
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink-soft);
  background: var(--petrol-soft);
  border-left: 3px solid var(--petrol);
  border-radius: 3px;
  padding: 12px 14px;
  margin: 0;
}
.cor-card {
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-radius: 4px;
  padding: 18px 20px;
}
.cor-step {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 19px;
  color: var(--ink);
  margin: 0 0 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.cor-step-n {
  font-family: var(--mono);
  font-size: 13px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--bronze-ink);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.cor-step-plain { color: var(--ink-soft); }

.cor-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.cor-fields label,
.cor-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ink-soft);
}
.cor-block { margin-bottom: 14px; }
.cor-fields input,
.cor-fields select,
.cor-block textarea {
  font-family: var(--sans);
  font-size: 14px;
  text-transform: none;
  letter-spacing: normal;
  color: var(--ink);
  padding: 8px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: #fff;
}
.cor-block textarea { resize: vertical; line-height: 1.5; }
.cor-fields input:focus,
.cor-fields select:focus,
.cor-block textarea:focus { outline: 2px solid var(--bronze-soft); }
.cor-req, .cor-opt {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 10px;
  margin-left: 6px;
}
.cor-req { background: #f0d9d0; color: var(--danger); }
.cor-opt { background: var(--paper); color: var(--ink-soft); }

.cor-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.cor-actions button {
  font-family: var(--mono);
  font-size: 12px;
  padding: 9px 18px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
}
.cor-actions button:hover { border-color: var(--petrol); color: var(--petrol); }
.cor-actions button:disabled { opacity: 0.5; cursor: default; }
.cor-primary {
  border-color: var(--petrol) !important;
  background: var(--petrol) !important;
  color: #fff !important;
}
.cor-primary:hover { background: var(--petrol-hover) !important; }
.cor-provider, .cor-msg { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); }
.cor-msg.error, .cor-alert-error { color: var(--danger); }

/* Rubrica e notas por critério (tabela) */
.cor-rubric-meta {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--bronze-ink);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0 0 6px;
}
.cor-rubric-theme { font-style: italic; color: var(--ink-soft); margin: 0 0 12px; }
.cor-crit-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
  margin: 10px 0;
}
.cor-crit-table th {
  text-align: left;
  font-family: var(--mono);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ink-soft);
  border-bottom: 1px solid var(--card-edge);
  padding: 6px 8px;
}
.cor-crit-table th.num, .cor-crit-table td.num { text-align: right; white-space: nowrap; font-family: var(--mono); }
.cor-crit-table td {
  padding: 8px;
  border-bottom: 1px solid var(--rule);
  vertical-align: top;
}
.cor-crit-desc { font-size: 12.5px; color: var(--ink-soft); margin-top: 3px; }
.cor-crit-src { font-size: 11.5px; color: var(--bronze-ink); font-style: italic; margin-top: 3px; }
.cor-crit-prob { font-size: 12.5px; color: var(--danger); margin-top: 4px; }
.cor-crit-sugg { font-size: 12.5px; color: var(--petrol); margin-top: 3px; }

.cor-rules { margin: 12px 0; padding: 8px 12px; border-radius: 3px; }
.cor-rule-annul { background: #f5e2dc; border-left: 3px solid var(--danger); }
.cor-rule-disregard { background: #f2eede; border-left: 3px solid var(--bronze); }
.cor-rules-title, .cor-fb-title, .cor-warn-title {
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ink);
  margin: 0 0 4px;
}
.cor-rules ul, .cor-warnings ul { margin: 4px 0 0; padding-left: 18px; font-size: 13px; }
.cor-warnings { margin-top: 12px; color: var(--ink-soft); }

/* Placar da correção */
.cor-score {
  display: flex;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
  padding: 14px 18px;
  border-radius: 4px;
  margin-bottom: 12px;
}
.cor-score.v-ok { background: var(--petrol-soft); border: 1px solid var(--petrol); }
.cor-score.v-partial { background: #f2eede; border: 1px solid var(--bronze); }
.cor-score.v-low { background: #f5e2dc; border: 1px solid var(--danger); }
.cor-score-value { font-family: var(--serif); font-size: 30px; font-weight: 700; color: var(--ink); }
.cor-score-pct { font-family: var(--mono); font-size: 16px; color: var(--ink-soft); }
.cor-score-verdict {
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-left: auto;
}
.cor-estimate {
  font-size: 12.5px;
  color: var(--ink-soft);
  background: #f2eede;
  border-radius: 3px;
  padding: 8px 12px;
  margin: 0 0 12px;
}
.cor-estimate strong { color: var(--bronze-ink); }

.cor-alerts { margin: 10px 0; display: flex; flex-direction: column; gap: 6px; }
.cor-alert {
  font-size: 13px;
  padding: 8px 12px;
  border-radius: 3px;
  margin: 0;
  background: #f5e2dc;
  border-left: 3px solid var(--danger);
  color: var(--ink);
}
.cor-alert-line_limit { background: #f2eede; border-left-color: var(--bronze-ink); }
.cor-alert-too_short { background: #f2eede; border-left-color: var(--bronze-ink); }

.cor-fb { margin: 12px 0; }
.cor-fb-text { margin: 0; font-size: 13.5px; line-height: 1.55; white-space: pre-wrap; }
.cor-plan ul { margin: 4px 0 0; padding-left: 4px; list-style: none; }
.cor-plan li { font-size: 13.5px; margin: 6px 0; }
.cor-prio {
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
  padding: 1px 7px;
  border-radius: 10px;
  margin-right: 6px;
}
.cor-prio-alta { background: #f0d9d0; color: var(--danger); }
.cor-prio-media { background: #f2eede; color: var(--bronze-ink); }
.cor-prio-baixa { background: var(--paper); color: var(--ink-soft); }
.cor-linecount { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); margin: 2px 0 8px; }

/* Histórico */
.cor-hist-item { border: 1px solid var(--card-edge); border-radius: 3px; margin-bottom: 8px; overflow: hidden; }
.cor-hist-head {
  width: 100%;
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  text-align: left;
  padding: 10px 14px;
  background: var(--card);
  border: none;
  cursor: pointer;
  font-family: var(--sans);
}
.cor-hist-head:hover { background: var(--card); }
.cor-hist-title { font-weight: 600; color: var(--ink); }
.cor-hist-score { font-family: var(--mono); font-size: 12px; color: var(--petrol); }
.cor-hist-when { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); margin-left: auto; }
.cor-hist-body { padding: 12px 14px; border-top: 1px solid var(--rule); }
.cor-hist-del {
  font-family: var(--mono);
  font-size: 11px;
  margin-top: 10px;
  padding: 5px 12px;
  border: 1px solid var(--danger);
  border-radius: 3px;
  background: transparent;
  color: var(--danger);
  cursor: pointer;
}
.cor-hist-del:hover { background: var(--danger); color: #fff; }
.cor-answer-pre {
  white-space: pre-wrap;
  font-family: var(--sans);
  font-size: 13px;
  background: #fff;
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 10px;
  margin: 6px 0 0;
}
.cor-hist-answer summary { cursor: pointer; font-size: 12.5px; color: var(--ink-soft); margin-top: 8px; }

@media (max-width: 640px) {
  .cor-main { padding: 14px; gap: 14px; }
  .cor-card { padding: 14px; }
  .cor-score-verdict { margin-left: 0; }
}

/* ---------- Corretor: ajuda de campos, roteiro e resposta-modelo ---------- */
.cor-fields-hint {
  font-size: 12.5px;
  color: var(--ink-soft);
  background: #f2eede;
  border-radius: 3px;
  padding: 8px 12px;
  margin: 0 0 14px;
}
.cor-help {
  display: block;
  font-family: var(--sans);
  font-size: 11.5px;
  text-transform: none;
  letter-spacing: normal;
  color: var(--ink-soft);
  font-weight: 400;
  margin-top: 4px;
}

/* Roteiro de escrita */
.cor-outline-help { margin-bottom: 8px; }
.cor-outline-help button {
  font-family: var(--mono);
  font-size: 12px;
  padding: 8px 16px;
  border: 1px dashed var(--bronze);
  border-radius: 3px;
  background: transparent;
  color: var(--bronze-ink);
  cursor: pointer;
}
.cor-outline-help button:hover { background: var(--petrol-soft); border-style: solid; border-color: var(--petrol); color: var(--petrol); }
.cor-outline-help button:disabled { opacity: 0.5; cursor: default; }
#outline-view, #model-view {
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--bronze);
  border-radius: 3px;
  padding: 12px 16px;
  margin: 4px 0 16px;
  background: var(--card);
}
.cor-outline-note {
  font-size: 12.5px;
  font-style: italic;
  color: var(--bronze-ink);
  margin: 0 0 10px;
}
.cor-outline-sec { margin: 10px 0; }
.cor-outline-points { margin: 4px 0 0; padding-left: 18px; font-size: 13px; }
.cor-outline-points li { margin: 3px 0; }

/* Resposta-modelo comentada */
#model-view { border-left-color: var(--petrol); }
.cor-model-warn {
  font-size: 12.5px;
  color: var(--ink);
  background: #f5e2dc;
  border-left: 3px solid var(--danger);
  border-radius: 3px;
  padding: 8px 12px;
  margin: 0 0 10px;
}
.cor-model-warn strong { color: var(--danger); }
.cor-model-text { background: #fff; }
.cor-model-comments { margin-top: 12px; }
.cor-model-comment { margin: 8px 0; }
.cor-model-comment strong { font-size: 13.5px; color: var(--ink); }

/* ---------- Tela de login (Supabase Auth) ---------- */

.login-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(34, 48, 63, 0.55);
  backdrop-filter: blur(2px);
}

.login-card {
  width: 100%;
  max-width: 360px;
  padding: 24px 22px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-top: 3px solid var(--bronze-soft);
  border-radius: 3px;
  box-shadow: 0 12px 40px rgba(34, 48, 63, 0.35);
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-family: var(--sans);
}

/* Painel de conflito de versão: mais largo que o card de login porque carrega a
   tabela de diferenças — é ela que impede o descarte às cegas. */
.conflito-card {
  max-width: 560px;
  max-height: 88vh;
  overflow-y: auto;
  border-top-color: var(--erro, #b3402f);
}

.conflito-corpo {
  font-size: 13px;
  color: var(--ink);
}

.conflito-concurso h4 {
  margin: 12px 0 4px;
  font-family: var(--serif);
  font-size: 15px;
}

.conflito-tabela {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
}

.conflito-tabela th,
.conflito-tabela td {
  padding: 4px 6px;
  border-bottom: 1px solid var(--card-edge);
  text-align: left;
  vertical-align: top;
}

.conflito-tabela th { color: var(--ink-soft); font-weight: 600; }
.conflito-tabela .conflito-aqui { font-weight: 600; }

.conflito-so-aqui,
.conflito-aviso { margin: 6px 0; font-size: 13px; color: var(--ink-soft); }
.conflito-so-aqui { color: var(--erro, #b3402f); }
.conflito-ok { margin: 6px 0; font-size: 13px; }

.conflito-acoes {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
}

.conflito-acoes button { width: 100%; }
.conflito-acoes button:disabled { opacity: 0.5; cursor: not-allowed; }
.conflito-secundario { background: transparent; }

.login-card h2 {
  margin: 0;
  font-family: var(--serif);
  font-size: 22px;
  color: var(--ink);
}

.login-hint {
  margin: 0;
  font-size: 13px;
  color: var(--ink-soft);
}

.login-card label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  color: var(--ink-soft);
}

.login-card input {
  padding: 9px 10px;
  font: 14px var(--sans);
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
}

.login-card input:focus {
  outline: 2px solid var(--petrol);
  outline-offset: 1px;
}

.login-error {
  margin: 0;
  font-size: 13px;
  color: var(--danger);
}

#login-submit {
  padding: 10px;
  font: 600 14px var(--sans);
  color: #fff;
  background: var(--petrol);
  border: none;
  border-radius: 2px;
  cursor: pointer;
}

#login-submit:disabled { opacity: 0.6; cursor: wait; }

.login-legacy {
  padding: 4px;
  font: 12px var(--sans);
  color: var(--ink-soft);
  background: none;
  border: none;
  text-decoration: underline;
  cursor: pointer;
}

#logout-link {
  font: 12px var(--sans);
  color: var(--ink-soft);
  background: none;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  padding: 6px 10px;
  cursor: pointer;
}

/* ---------- Explicador textual com IA ---------- */

.explain-btn {
  margin-top: 8px;
  padding: 5px 10px;
  font: 12px var(--sans);
  color: var(--petrol);
  background: var(--petrol-soft);
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  cursor: pointer;
}

.explain-btn:hover { filter: brightness(0.97); }

.explain-panel {
  margin-top: 8px;
  padding: 10px 12px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--petrol);
  border-radius: 2px;
  font-size: 13px;
  line-height: 1.55;
}

.explain-panel p { margin: 0 0 8px; }
.explain-main { color: var(--ink); }
.explain-alts { margin: 0 0 8px 18px; padding: 0; }
.explain-alts li { margin-bottom: 4px; }
.explain-limits { color: var(--ink-soft); font-size: 12px; }

/* Página de criar senha (reset.html) */
.reset-page { position: static; min-height: 100vh; }
.login-back {
  display: inline-block;
  margin-top: 4px;
  font: 13px var(--sans);
  color: var(--petrol);
}

/* ==========================================================================
   Menu lateral + acentos coloridos (camada de layout — a lógica não muda).
   Os botões originais do rodapé seguem no DOM (o sidebar.js os aciona por
   clique programático); só ficam ocultos. Para reverter o layout inteiro,
   basta remover este bloco e o sidebar.js.
   ========================================================================== */
:root {
  --acc-azul: #3f5d7d;
  --acc-vinho: #7c4a5a;
  /* Escurecido em 29/07/2026: no fundo marfim da paleta Neomatis o valor
     anterior (#a8762f) dava 3,74:1 como texto e 3,96:1 sob texto branco.
     Mesmo matiz, 15% menos claro — 4,92:1 e 5,22:1. */
  --acc-ocre: #8f6428;
  --side-bg: #1d2935;
  --side-ink: #d9dfd6;
  --side-dim: #8b96a0;
}

.app-shell { display: flex; align-items: stretch; min-height: 100vh; }
.app-main { flex: 1; min-width: 0; }

.sidebar {
  width: 232px;
  flex: none;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  background: var(--side-bg);
  color: var(--side-ink);
  padding: 18px 0 14px;
}
.side-brand {
  padding: 0 16px 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}
.side-brand > strong {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 16px;
  display: block;
  margin-bottom: 10px;
}
.sidebar .contest-bar { margin: 0; }
.sidebar .contest-select {
  flex: 1;
  min-width: 0;
  max-width: none;
  background: rgba(255, 255, 255, 0.07);
  color: var(--bronze-soft);
}
.sidebar .contest-select:hover { color: #fff; border-color: var(--bronze-soft); }
.sidebar .contest-add { background: rgba(255, 255, 255, 0.07); flex: none; }
.sidebar .contest-add:hover { color: #fff; border-color: var(--bronze-soft); }

.side-group { padding: 12px 10px 2px; }
.side-label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--side-dim);
  margin: 0;
  padding: 0 10px 6px;
}
/* Grupo recolhível do menu (Configuração): o rótulo vira botão, com a mesma
   tipografia dos outros rótulos — só ganha a setinha e o estado aberto. */
.side-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  border: 0;
  background: none;
  cursor: pointer;
  text-align: left;
}
.side-caret { display: inline-block; transition: transform 0.15s ease; }
.side-toggle.is-open .side-caret { transform: rotate(90deg); }
.side-toggle:hover { color: var(--side-ink); }
@media (prefers-reduced-motion: reduce) {
  .side-caret { transition: none; }
}

.side-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 7px 10px;
  border: 0;
  border-radius: 6px;
  background: none;
  color: var(--side-ink);
  font-family: var(--sans);
  font-size: 13.5px;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.side-item:hover { background: rgba(255, 255, 255, 0.07); }
.side-item.is-active { background: rgba(255, 255, 255, 0.11); font-weight: 600; }
.side-item:focus-visible { outline: 2px solid var(--bronze-soft); outline-offset: -2px; }
.side-item.side-danger { color: #d9a89e; }
.side-dot { width: 8px; height: 8px; border-radius: 2px; flex: none; }
.side-foot {
  margin-top: auto;
  padding: 12px 16px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
  font-size: 12px;
  color: var(--side-dim);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.side-foot b { color: var(--side-ink); font-weight: 600; font-variant-numeric: tabular-nums; }

/* Botões duplicados do rodapé: ocultos (o menu lateral os aciona). O rodapé
   continua hospedando os painéis (backup/edital/pesos/configurações) e o
   botão "Sair" que o auth-client monta dinamicamente. */
footer.toolbar > button:not(#logout-link),
footer.toolbar > .toolbar-link { display: none; }

/* Cabeçalho mais enxuto: o menu lateral já carrega o nome e o concurso. */
.masthead-inner { padding: 16px 20px 14px; }
/* O slogan continua secundário aqui — este bloco só o aperta um pouco. A regra
   de tamanho e peso está no bloco da marca, lá em cima; repeti-la inteira faria
   duas fontes para a mesma decisão. */
.masthead h1 { font-size: clamp(0.95rem, 2vw, 1.1rem); margin-bottom: 4px; }
.overall { width: 96px; height: 96px; }
.overall-value { font-size: 1.05rem; }

/* Cor como código: cada estatística do ritmo com um acento fixo. */
.study-stats .study-stat:nth-child(1) .study-stat-value { color: var(--petrol); }
.study-stats .study-stat:nth-child(2) .study-stat-value { color: var(--acc-azul); }
.study-stats .study-stat:nth-child(3) .study-stat-value { color: var(--acc-ocre); }
.study-stats .study-stat:nth-child(4) .study-stat-value { color: var(--acc-vinho); }
.study-stats .study-stat:nth-child(5) .study-stat-value { color: var(--bronze-ink); }

/* A mesma paleta segue as disciplinas, em ciclo de 5. */
#disciplines .discipline:nth-of-type(5n + 1) { border-left-color: var(--petrol); }
#disciplines .discipline:nth-of-type(5n + 2) { border-left-color: var(--acc-azul); }
#disciplines .discipline:nth-of-type(5n + 3) { border-left-color: var(--acc-ocre); }
#disciplines .discipline:nth-of-type(5n + 4) { border-left-color: var(--acc-vinho); }
#disciplines .discipline:nth-of-type(5n + 5) { border-left-color: var(--bronze-ink); }
#disciplines .discipline:nth-of-type(5n + 1) .disc-code { color: var(--petrol); border-color: var(--petrol); }
#disciplines .discipline:nth-of-type(5n + 2) .disc-code { color: var(--acc-azul); border-color: var(--acc-azul); }
#disciplines .discipline:nth-of-type(5n + 3) .disc-code { color: var(--acc-ocre); border-color: var(--acc-ocre); }
#disciplines .discipline:nth-of-type(5n + 4) .disc-code { color: var(--acc-vinho); border-color: var(--acc-vinho); }
#disciplines .discipline:nth-of-type(5n + 5) .disc-code { color: var(--bronze-ink); border-color: var(--bronze-ink); }

/* Menu no celular: off-canvas com botão ☰ fixo. */
.sidebar-toggle {
  display: none;
  position: fixed;
  top: 10px;
  left: 12px;
  z-index: 80;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  border: 1px solid var(--card-edge);
  border-radius: 6px;
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(34, 48, 63, 0.15);
}
.sidebar-backdrop {
  position: fixed;
  inset: 0;
  z-index: 65;
  background: rgba(20, 27, 34, 0.5);
}
@media (max-width: 900px) {
  .app-shell { display: block; }
  .sidebar-toggle { display: flex; }
  .sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    height: 100vh;
    width: min(78vw, 260px);
    z-index: 70;
    transform: translateX(-100%);
    transition: transform 0.22s ease;
    box-shadow: 4px 0 18px rgba(0, 0, 0, 0.25);
  }
  body.sidebar-open .sidebar { transform: none; }
  /* Espaço para o botão ☰ não cobrir o título. */
  .masthead-inner { padding-left: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  .sidebar { transition: none; }
}

/* ---------- Cards interativos do painel "Hoje" (ritmo e foco) ---------- */
.info-card {
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-radius: 6px;
  margin: 10px 0;
  overflow: hidden;
}
.info-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 14px;
  border: 0;
  background: none;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 13.5px;
  text-align: left;
  cursor: pointer;
}
.info-card-head:hover { background: rgba(143, 111, 63, 0.06); }
.info-card-head:focus-visible { outline: 2px solid var(--bronze-soft); outline-offset: -2px; }
.info-card-icon { flex: none; }
.info-card-title { flex: 1; font-weight: 600; }
.info-card-title small {
  display: block;
  font-weight: 400;
  font-size: 11.5px;
  color: var(--ink-soft);
}
.info-card-caret {
  flex: none;
  color: var(--bronze-ink);
  transition: transform 0.15s ease;
}
.info-card-head[aria-expanded="true"] .info-card-caret { transform: rotate(180deg); }
.info-card-body { padding: 2px 14px 12px; border-top: 1px solid var(--rule); }
.info-card-body .pace-report,
.info-card-body .today-priority { margin: 10px 0 0; }

.info-how { margin-top: 12px; }
.info-how > summary {
  cursor: pointer;
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.04em;
  color: var(--petrol);
  user-select: none;
}
.info-how > summary:hover { color: var(--bronze-ink); }
.info-how p, .info-how ul {
  font-size: 13px;
  line-height: 1.6;
  margin: 8px 0;
}
.info-how ul { padding-left: 20px; }
.info-how li { margin-bottom: 6px; }
.info-how-hint { color: var(--ink-soft); font-size: 12px; }
@media (prefers-reduced-motion: reduce) {
  .info-card-caret { transition: none; }
}

/* ---------- Banco de questões (material → simulado) + Domínio (mastery) ---------- */

.qbank-summary { font-size: 13.5px; margin: 8px 0; }

/* Os dois passos do fluxo: cada um é um bloco com número, para a pessoa saber
   onde está sem ler instrução nenhuma. */
.qb-step + .qb-step { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--card-edge); }
.qb-step-n {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; margin-right: 7px;
  font-family: var(--mono); font-size: 12px; font-weight: 700;
  color: var(--paper); background: var(--acc-vinho); border-radius: 999px;
}
.qb-assunto { display: block; margin: 8px 0 12px; font-size: 13px; }
.qb-assunto input {
  display: block; width: 100%; max-width: 420px; margin-top: 4px;
  font-family: var(--sans); font-size: 15px; padding: 9px 12px;
  border: 1px solid var(--card-edge); border-radius: 2px;
  background: #fff; color: var(--ink);
}
.qb-assunto input:focus { outline: 2px solid var(--bronze-soft); }

/* "Estou trabalhando": barra indeterminada. Nenhum passo interno da IA é
   narrado — a tela mostra que há trabalho em curso, e nada além disso. */
.qb-working {
  position: relative; overflow: hidden;
  height: 3px; margin: 10px 0; border-radius: 999px;
  background: var(--card-edge);
}
.qb-working-bar {
  position: absolute; inset: 0 auto 0 0; width: 38%;
  background: var(--acc-vinho); border-radius: 999px;
  animation: qb-slide 1.5s ease-in-out infinite;
}
@keyframes qb-slide {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(300%); }
}
@media (prefers-reduced-motion: reduce) {
  .qb-working-bar { animation: none; width: 100%; opacity: 0.5; }
}

.qb-done {
  margin-top: 12px; padding: 12px 14px;
  border: 1px solid var(--card-edge); border-left: 3px solid var(--petrol);
  border-radius: var(--radius-sm, 6px); background: var(--petrol-soft);
}
.qb-done-head { margin: 0 0 10px; font-size: 14px; }
.qb-done .session-actions { margin: 0; }

/* Lista de MATERIAIS — a organização inteira do treino. Uma linha por PDF
   enviado: nome que a pessoa digitou, contagem e o botão de treinar. */
.qb-mat-list { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 12px; }
.qb-mat-row {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--card-edge); border-radius: var(--radius-sm, 6px);
  background: #fff;
}
.qb-mat-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.qb-mat-name {
  font-size: 14px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.qb-mat-nums { margin: 0; font-size: 12.5px; }
.qb-mat-train { flex: none; }
.qb-mat-del { flex: none; }
@media (max-width: 560px) {
  .qb-mat-row { flex-wrap: wrap; }
  .qb-mat-info { flex-basis: 100%; }
}

.diag-meta { margin: 2px 0 6px; }
.diag-result { margin-top: 12px; }

.mastery-list { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 16px; }
.mastery-row {
  display: grid; grid-template-columns: minmax(120px, 200px) 1fr 56px; gap: 8px;
  align-items: center; font-size: 13px;
}
.mastery-name { font-weight: 600; }
.mastery-bar {
  height: 10px; border-radius: 999px; background: rgba(0,0,0,0.08); overflow: hidden;
}
.mastery-fill { display: block; height: 100%; border-radius: 999px; }
.mastery-fill.band-fragil { background: var(--danger); }
.mastery-fill.band-construcao { background: var(--bronze); }
.mastery-fill.band-solido { background: var(--petrol); }
/* Sem texto por cima: aqui vale o acento puro da paleta. */
.cal-swatch-review { color: var(--bronze-ink); }
.mastery-pct { font-family: var(--mono); font-size: 12px; text-align: right; }
.mastery-meta { grid-column: 2 / 4; font-size: 11.5px; color: var(--ink-soft); margin-top: -4px; }
.mastery-movers { padding-left: 20px; font-size: 13px; }
.mastery-movers li { margin-bottom: 4px; }

.evo-chain { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 8px 0 14px; }
.evo-step { display: inline-flex; flex-direction: column; align-items: center; gap: 1px; }
.evo-step b { font-family: var(--mono); font-size: 14px; }
.evo-step small { font-size: 10.5px; color: var(--ink-soft); }
.evo-arrow { color: var(--ink-soft); }

/* Confirmação local de salvamento nas Configurações de estudo */
.settings-saved-note {
  margin: 10px 0 0;
  font-size: 12.5px;
  color: var(--petrol);
  border-left: 3px solid var(--petrol);
  padding-left: 10px;
}

/* Barra flutuante de seleção do explicador (estilo RemNote) */
.explain-selbar {
  position: absolute;
  z-index: 60;
  display: flex;
  gap: 4px;
  background: var(--card, #fff);
  border: 1px solid var(--card-edge);
  border-radius: 6px;
  box-shadow: 0 8px 26px rgba(34, 48, 63, 0.22);
  padding: 4px;
}
.explain-selbar button {
  border: 0;
  background: transparent;
  border-radius: 4px;
  padding: 7px 10px;
  font-size: 12.5px;
  cursor: pointer;
  white-space: nowrap;
}
.explain-selbar button:hover { background: rgba(34, 48, 63, 0.08); }
.explain-selbar button:first-child { font-weight: 600; }
.explain-selpanel {
  position: absolute;
  z-index: 60;
  max-width: min(460px, calc(100vw - 24px));
  box-shadow: 0 12px 34px rgba(34, 48, 63, 0.25);
}

/* ---------- Planejamento (Fase 1) ---------- */
.plan-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  margin: 8px 0 14px;
}
.plan-card {
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--petrol-soft);
  border-left: 4px solid var(--petrol);
  border-radius: 4px;
  padding: 10px 12px;
}
.plan-value {
  font-family: var(--mono);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--petrol);
}
.plan-caption {
  font-size: 0.78rem;
  color: var(--ink);
  font-weight: 600;
}
.plan-note {
  font-size: 0.74rem;
  color: var(--ink-soft);
}
.plan-gap-head {
  font-weight: 600;
  font-size: 0.82rem;
  margin: 0 0 4px;
}
.plan-summary {
  margin-top: 14px;
  padding: 10px 12px;
  border-left: 4px solid var(--bronze);
  background: #f2efe6;
  border-radius: 4px;
  font-size: 0.86rem;
  color: var(--ink);
}
.prio-list { margin-top: 6px; }
.plan-ref { margin: 6px 0 8px; padding-left: 18px; }
.plan-ref li { margin-bottom: 3px; }
.plan-ref-form { margin-top: 6px; }
.plan-ref-status { color: var(--danger, #a33); }

/* ---------- V1: vistas exclusivas ---------- */
/* Cada área do painel é uma vista: só a seção dela aparece. A visibilidade é
   toda daqui (body[data-view]); o app.js só orquestra render e cabeçalho. */
body[data-view] .study-strip,
body[data-view] .search-bar,
body[data-view] #disciplines,
body[data-view] footer.toolbar { display: none; }

body[data-view="hoje"] .study-strip,
body[data-view="registrar"] .study-strip,
body[data-view="calendario"] .study-strip,
body[data-view="desempenho"] .study-strip,
body[data-view="planejamento"] .study-strip { display: block; }

body[data-view="disciplinas"] .search-bar { display: flex; }
body[data-view="disciplinas"] #disciplines { display: block; }

body[data-view="acervo"] footer.toolbar,
body[data-view="gestao"] footer.toolbar { display: flex; }

/* A faixa de estatísticas e o painel Hoje pertencem só à vista inicial. */
body:not([data-view="hoje"]) .study-strip-inner { display: none; }
body:not([data-view="hoje"]) .today-panel { display: none; }
body:not([data-view="hoje"]) .today-line { display: none; }

/* Na vista Acervo, o rodapé mostra só o painel do acervo (sem os de gestão). */
body[data-view="acervo"] #backup-panel,
body[data-view="acervo"] #weights-panel,
body[data-view="acervo"] #edital-panel,
body[data-view="acervo"] #settings-panel { display: none; }
body[data-view="gestao"] #qbank-panel { display: none; }

/* Cabeçalho da vista: identidade da área (cor de acento + título grande).
   O wrapper externo repete o padrão das seções (max-width + padding lateral),
   e a CAIXA visual fica no filho — assim a borda alinha com os painéis. */
.view-header {
  max-width: 980px;
  margin: 16px auto 0;
  padding: 0 20px;
}
/* Acompanha o padding responsivo das seções (.study-strip vira 10px no celular). */
@media (max-width: 640px) {
  .view-header { padding: 0 10px; }
}
.view-header-box {
  padding: 16px 20px 14px;
  border-left: 5px solid var(--view-accent, var(--petrol));
  border-radius: 4px;
  background: linear-gradient(115deg, color-mix(in srgb, var(--view-accent, var(--petrol)) 13%, transparent), transparent 65%);
  animation: view-in 0.28s ease;
}
.view-kicker {
  margin: 0 0 2px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--view-accent, var(--petrol));
}
.view-title {
  margin: 0;
  font-size: clamp(1.35rem, 3vw, 1.8rem);
  letter-spacing: -0.02em;
  color: var(--ink);
}

/* Transição suave ao trocar de vista. */
body[data-view] .study-strip,
body[data-view="disciplinas"] .search-bar,
body[data-view="disciplinas"] #disciplines,
body[data-view="acervo"] footer.toolbar,
body[data-view="gestao"] footer.toolbar { animation: view-in 0.28s ease; }

@keyframes view-in {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .view-header, body[data-view] .study-strip, body[data-view="disciplinas"] #disciplines { animation: none; }
}

/* ---------- V2: gráficos SVG ---------- */
.chart { display: block; width: 100%; height: auto; }
.chart-block { margin: 6px 0 10px; }
.chart-grid { stroke: var(--rule); stroke-width: 1; }
.chart-axis { font-family: var(--mono); font-size: 10.5px; fill: var(--ink-soft); }
.chart-legend-label { font-family: var(--mono); font-size: 11px; fill: var(--ink); }
.chart-bar-label { font-size: 12px; fill: var(--ink); }
.chart-bar-value { font-family: var(--mono); font-size: 11.5px; fill: var(--ink); }
.chart-bar-bg { fill: var(--paper); stroke: var(--card-edge); stroke-width: 1; }
.chart-donut-wrap { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin: 6px 0 10px; }
.chart-donut { width: 190px; flex: none; }
.chart-donut-value { font-family: var(--mono); font-size: 26px; font-weight: 600; fill: var(--ink); }
.chart-donut-label { font-family: var(--mono); font-size: 10.5px; fill: var(--ink-soft); letter-spacing: 0.08em; text-transform: uppercase; }
.chart-donut-legend { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; font-size: 12.5px; }
.chart-donut-legend b { font-family: var(--mono); }
.chart-swatch { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 7px; vertical-align: -1px; }
.plan-spark { margin-top: 5px; }
.plan-spark .chart-spark { width: 130px; height: 34px; }

/* ---------- V3: polimento (cards, hover, chips) ---------- */
/* Overrides no fim do arquivo: mesma especificidade vence pela ordem. */

/* Cards com cantos mais generosos e sombra suave; hover com leve elevação. */
.study-panel {
  border-radius: 10px;
  padding: 16px 18px;
  box-shadow: 0 6px 18px rgba(34, 48, 63, 0.06);
}
.today-panel {
  border-radius: 12px;
  box-shadow: 0 8px 22px rgba(143, 111, 63, 0.14);
}
.info-card {
  border-radius: 10px;
  transition: box-shadow 0.18s ease, transform 0.18s ease;
}
.info-card:hover {
  box-shadow: 0 6px 16px rgba(34, 48, 63, 0.08);
}
.plan-card {
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(44, 97, 87, 0.08);
  transition: box-shadow 0.18s ease, transform 0.18s ease;
}
.plan-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(44, 97, 87, 0.14);
}
.backup-panel { border-radius: 10px; }
.view-header-box { border-radius: 10px; }
.plan-summary { border-radius: 10px; }
.errors-rec { border-radius: 8px; padding: 10px 12px; }

/* Chips de veredito do ritmo: pílulas coloridas em vez de texto solto. */
.pace-verdict {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12.5px;
  border: 1px solid transparent;
}
.pace-suficiente { background: rgba(44, 97, 87, 0.12); border-color: rgba(44, 97, 87, 0.35); }
.pace-apertado { background: rgba(143, 111, 63, 0.13); border-color: rgba(143, 111, 63, 0.4); }
.pace-insuficiente { background: rgba(155, 59, 46, 0.11); border-color: rgba(155, 59, 46, 0.35); }

/* Títulos de seção com traço de acento — hierarquia mais clara. */
.quest-block-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 14px 0 8px;
}
.quest-block-title::before {
  content: "";
  width: 16px;
  height: 3px;
  border-radius: 2px;
  background: currentColor;
  opacity: 0.75;
}

/* Botões: cantos suaves e transição no hover. */
.toolbar button, .toolbar-link, .session-actions button, .search-bar > button,
.study-actions button, .today-help-btn {
  border-radius: 7px;
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.session-actions button:hover, .study-actions button:hover {
  box-shadow: 0 2px 8px rgba(34, 48, 63, 0.1);
}

/* Item ativo do menu: barra de acento à esquerda (ambiente da vista). */
.side-item { border-radius: 8px; transition: background 0.15s ease; }
.side-item.is-active {
  box-shadow: inset 3px 0 0 var(--bronze-soft);
}

/* Barras de progresso arredondadas. */
.mastery-fill, .prio-fill, .mastery-bar, .prio-bar { border-radius: 999px; }

/* Movimento respeita a preferência do sistema. */
@media (prefers-reduced-motion: reduce) {
  .info-card, .plan-card, .side-item, .session-actions button { transition: none; }
  .plan-card:hover { transform: none; }
}

/* Banco de questões: prévia compacta */
.qbank-fix-btn {
  font-family: var(--mono);
  font-size: 11px;
  padding: 3px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 7px;
  background: none;
}
.qbank-fix-btn:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }
.round-effect { border-left: 3px solid var(--petrol); padding-left: 8px; }

/* Texto de apoio nas questões de treino (interpretação) */
.diag-support {
  margin: 6px 0 10px;
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--acc-azul, #4a6a8a);
  border-radius: 8px;
  background: var(--paper);
}
.diag-support summary {
  cursor: pointer;
  padding: 7px 12px;
  font-family: var(--mono);
  font-size: 11.5px;
  color: var(--ink-soft);
}
.diag-support-body {
  max-height: 260px;
  overflow-y: auto;
  padding: 4px 14px 12px;
  white-space: pre-wrap;
  font-size: 13.5px;
  line-height: 1.55;
}

/* Guia de primeiros passos (onboarding) — só na vista Hoje */
body:not([data-view="hoje"]) .onboarding-card { display: none; }
.onboarding-card {
  margin-top: 12px;
  padding: 14px 16px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 4px solid var(--petrol);
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(44, 97, 87, 0.08);
}
.ob-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.ob-title { font-weight: 600; }
.ob-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ob-step {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 7px 10px;
  border-radius: 8px;
  background: var(--paper);
}
.ob-step.done { opacity: 0.62; }
.ob-step.done .ob-mark { color: var(--petrol); }
.ob-mark { font-family: var(--mono); font-weight: 700; flex: none; margin-top: 1px; }
.ob-body { flex: 1; font-size: 13.5px; line-height: 1.4; }
.ob-body small { color: var(--ink-soft); }
.ob-step .qbank-fix-btn { flex: none; margin-top: 2px; }

/* Chips de fontes públicas por disciplina (camada 1 do "Onde estudar") */
.src-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.src-chip {
  font-size: 12px;
  color: var(--petrol);
  background: var(--petrol-soft);
  border: 1px solid var(--card-edge);
  border-radius: var(--radius-pill);
  padding: 3px 10px;
  text-decoration: none;
}
.src-chip:hover { border-color: var(--petrol); }
.src-nota { color: var(--bronze-ink); }


/* ---------- Viabilidade: o edital cabe até a prova? ---------- */
.viability {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--card-edge);
}
.viab-kicker {
  margin: 0 0 10px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.viab-conta {
  font-family: var(--mono);
  font-size: 12px;
  border-left: 2px solid var(--card-edge);
  padding-left: 12px;
}
.viab-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  padding: 3px 0;
}
.viab-label { min-width: 190px; color: var(--ink-soft); }
.viab-value { font-weight: 600; color: var(--ink); min-width: 70px; }
.viab-note { font-size: 11px; color: var(--ink-soft); opacity: 0.85; }
.viab-verdito {
  margin: 12px 0 6px;
  font-size: 0.95rem;
  padding: 8px 12px;
  border-radius: 3px;
}
.viab-verdito.ok { background: rgba(60, 130, 90, 0.1); }
.viab-verdito.over { background: rgba(180, 90, 60, 0.1); }
.viab-origem { margin: 0 0 4px; font-size: 0.8rem; color: var(--ink-soft); line-height: 1.5; }
.viab-origem-mix { opacity: 0.85; }
.viab-calibrado {
  margin: 0 0 12px;
  padding: 8px 12px;
  font-size: 0.84rem;
  background: rgba(90, 120, 180, 0.1);
  border-radius: 3px;
}
.viab-missing { margin: 0 0 10px; font-size: 0.86rem; color: var(--bronze-ink); }
.viab-opcoes { margin-top: 14px; }
.viab-opcoes-title {
  margin: 0 0 8px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.viab-opcao {
  margin-bottom: 12px;
  padding-left: 12px;
  border-left: 2px solid var(--bronze-soft, var(--card-edge));
  font-size: 0.86rem;
}
.viab-opcao p { margin: 0 0 4px; }
.viab-opcao-h { font-weight: 600; }
.viab-impossivel { color: var(--bronze-ink); }
.viab-apply {
  font-size: 0.82rem;
  padding: 3px 10px;
  cursor: pointer;
}
.viab-alt-now { font-size: 0.78rem; color: var(--ink-soft); }
.viab-lista { margin-top: 4px; font-size: 0.82rem; }
.viab-lista ul { margin: 6px 0 0; padding-left: 18px; }
.viab-lista li { margin-bottom: 3px; line-height: 1.4; }
.viab-lista-disc { font-family: var(--mono); font-size: 10px; text-transform: uppercase; color: var(--ink-soft); margin-right: 6px; }
.viab-lista-min { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); }
.viab-lista-mais { color: var(--ink-soft); font-style: italic; }
.viab-mult { margin-top: 14px; font-size: 0.85rem; }
.mult-grid { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.mult-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(0, 2fr) 80px;
  align-items: center;
  gap: 10px;
}
.mult-name { font-weight: 500; }
.mult-meta { font-size: 0.78rem; color: var(--ink-soft); }
/* Disciplina já calibrada: o destaque é discreto de propósito. O que precisa
   chamar atenção é o progresso de quem ainda não chegou lá — quem chegou não
   tem mais nada a fazer. */
.mult-row.calibrada .mult-meta strong { color: var(--petrol); }
.mult-row input {
  font-family: var(--sans);
  font-size: 13px;
  padding: 3px 6px;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
  color: var(--ink);
  width: 100%;
}
@media (max-width: 640px) {
  .viab-label { min-width: 0; flex: 1 1 100%; }
  .mult-row { grid-template-columns: 1fr 70px; }
  .mult-meta { grid-column: 1 / -1; }
}

/* Tabela de fases dentro da viabilidade */
.viab-fases { margin-top: 12px; font-size: 0.85rem; }
.viab-aviso-fase {
  margin: 10px 0 0;
  padding: 8px 12px;
  font-size: 0.84rem;
  background: rgba(180, 140, 60, 0.12);
  border-radius: 3px;
}
.fases-tabela { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 0.82rem; }
.fases-tabela td { padding: 4px 8px 4px 0; border-bottom: 1px solid var(--card-edge); vertical-align: top; }
.fase-nome { font-weight: 600; white-space: nowrap; }
.fase-dias { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); white-space: nowrap; }
.fase-mix { color: var(--ink-soft); }
.fases-media { margin: 8px 0 0; font-size: 0.84rem; }

/* Simulador de escopo (saída 2): a usuária escolhe, o motor responde */
.escopo-tabela { width: 100%; border-collapse: collapse; margin: 8px 0; font-size: 0.83rem; }
.escopo-tabela td { padding: 4px 6px 4px 0; border-bottom: 1px solid var(--card-edge); }
.escopo-legenda {
  margin: 4px 0 8px;
  padding-left: 18px;
  font-size: 0.82rem;
  color: var(--ink-soft);
}
.escopo-legenda li { margin: 2px 0; }

/* Card do dia em três seções, na ordem em que o dia é executado. */
.dia-secao { margin-top: 10px; }
.dia-secao-h {
  margin: 0 0 4px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
}
.dia-secao-meta { font-weight: 500; letter-spacing: 0; text-transform: none; }
.dia-questoes { margin: 0; font-size: 0.86rem; }
.cycle-rodape {
  margin: 10px 0 0;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 0.82rem;
}
.cycle-rodape a { color: var(--ink-soft); text-decoration: none; }
.cycle-rodape a:hover { text-decoration: underline; }

.escopo-tabela th {
  padding: 4px 6px 4px 0;
  border-bottom: 1px solid var(--card-edge);
  text-align: left;
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--ink-soft);
  white-space: nowrap;
}
.esc-nome { font-weight: 500; }
.esc-custo { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); white-space: nowrap; }
.esc-peso { font-family: var(--mono); font-size: 11px; white-space: nowrap; }
.esc-cb { font-family: var(--mono); font-size: 11px; white-space: nowrap; }
.esc-unidade { font-family: var(--sans); font-size: 10px; color: var(--ink-soft); margin-left: 2px; }
.esc-fora-prova { font-family: var(--sans); font-size: 10.5px; color: var(--ink-soft); }
/* Eliminatória: fora do alcance do corte, e a tela diz isso ANTES do clique. */
.esc-eliminatoria { opacity: 0.85; }
.esc-selo {
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 1px 4px;
  border: 1px solid var(--bronze-soft);
  border-radius: 2px;
  color: var(--bronze-ink);
  white-space: nowrap;
}
.esc-bloqueado { color: var(--ink-soft); cursor: help; }
.esc-acao { width: 62px; white-space: nowrap; }
.esc-acao label { display: inline-flex; align-items: center; gap: 4px; font-size: 0.78rem; cursor: pointer; }
.escopo-resultado {
  margin: 8px 0 4px;
  padding: 7px 10px;
  font-size: 0.85rem;
  border-radius: 3px;
  background: var(--paper-soft, rgba(0,0,0,0.04));
}
.escopo-resultado.ok { background: rgba(60, 130, 90, 0.12); }
.escopo-resultado.over { background: rgba(180, 90, 60, 0.12); }
.viab-custo { margin: 2px 0 8px !important; font-size: 0.82rem; color: var(--bronze-ink); }

/* Diagnóstico de dado órfão */
.orfaos { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--card-edge); font-size: 0.85rem; }
.orfaos-ok { margin: 0; color: var(--ink-soft); font-size: 0.82rem; }
.orfaos-alerta { margin: 0 0 8px; padding: 8px 12px; border-radius: 3px; background: rgba(180, 140, 60, 0.14); }
.orfaos-lista { margin: 0 0 8px; padding-left: 20px; }
.orfaos-lista li { margin-bottom: 2px; }

/* ---------- Editor da tabela de fases (Etapa 5) ---------- */
.phases-editor { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--card-edge); }
.phases-details summary, .subdiv-details summary { font-size: 0.9rem; cursor: pointer; }
.fases-ed-tabela { width: 100%; border-collapse: collapse; margin: 10px 0; font-size: 0.83rem; }
.fases-ed-tabela th { text-align: left; font-family: var(--mono); font-size: 10px; text-transform: uppercase; color: var(--ink-soft); padding-bottom: 4px; }
.fases-ed-tabela td { padding: 4px 6px 4px 0; border-bottom: 1px solid var(--card-edge); }
.fases-ed-tabela input { width: 56px; font-size: 13px; padding: 3px 5px; border: 1px solid var(--card-edge); border-radius: 2px; }
.fase-ed-nome { font-weight: 600; white-space: nowrap; }
.fase-ed-dias { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); white-space: nowrap; }
.fases-ed-erro { margin: 6px 0; padding: 7px 10px; font-size: 0.84rem; background: rgba(180,90,60,0.12); border-radius: 3px; }
.fases-ed-limites { display: flex; flex-wrap: wrap; gap: 12px; margin: 8px 0; font-size: 0.83rem; align-items: center; }
.fases-ed-limites input { width: 60px; font-size: 13px; padding: 3px 5px; border: 1px solid var(--card-edge); border-radius: 2px; }
.meta-semanal { margin-top: 14px; padding-top: 10px; border-top: 1px dashed var(--card-edge); }
.meta-semanal-title { margin: 0 0 4px; font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-soft); }
.meta-tabela { width: 100%; border-collapse: collapse; font-size: 0.83rem; margin-top: 6px; }
.meta-tabela th { text-align: left; font-family: var(--mono); font-size: 10px; text-transform: uppercase; color: var(--ink-soft); }
.meta-tabela td { padding: 4px 6px 4px 0; border-bottom: 1px solid var(--card-edge); }
.meta-tabela input { width: 72px; font-size: 13px; padding: 3px 5px; border: 1px solid var(--card-edge); border-radius: 2px; }
.meta-calc { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); }

/* ---------- Revisão das propostas de subdivisão (Etapa 4) ---------- */
.subdiv { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--card-edge); }
.subdiv-lote { margin: 8px 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.subdiv-lista { display: flex; flex-direction: column; gap: 10px; margin: 10px 0; }
.subdiv-item { padding: 10px 12px; border-left: 3px solid var(--card-edge); background: rgba(0,0,0,0.02); border-radius: 2px; }
.subdiv-item.tem-historico { border-left-color: var(--bronze-ink); }
.subdiv-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.subdiv-check { display: flex; align-items: center; gap: 6px; cursor: pointer; }
.subdiv-disc { font-family: var(--mono); font-size: 10px; text-transform: uppercase; color: var(--ink-soft); }
.subdiv-peso { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); }
.subdiv-texto { margin: 6px 0 4px; font-size: 0.86rem; }
.subdiv-efeito { margin: 0 0 4px; font-size: 0.82rem; color: var(--ink-soft); }
.subdiv-aviso { margin: 4px 0; font-size: 0.82rem; color: var(--bronze-ink); }
.subdiv-editar { margin-top: 6px; font-size: 0.83rem; }
.subdiv-subs { display: flex; flex-direction: column; gap: 4px; margin: 6px 0; }
.subdiv-sub { display: flex; gap: 6px; }
.subdiv-sub input[type="text"] { flex: 1; font-size: 13px; padding: 3px 6px; border: 1px solid var(--card-edge); border-radius: 2px; }
.subdiv-sub input[type="number"] { width: 54px; font-size: 13px; padding: 3px 5px; border: 1px solid var(--card-edge); border-radius: 2px; }
.subdiv-indiv, .subdiv-feitas { margin-top: 12px; padding-top: 8px; border-top: 1px dashed var(--card-edge); }
.subdiv-indiv-title { margin: 0 0 4px; font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-soft); }
.subdiv-indiv ul, .subdiv-feitas ul { margin: 6px 0 0; padding-left: 18px; font-size: 0.82rem; }
.subdiv-indiv li, .subdiv-feitas li { margin-bottom: 3px; line-height: 1.4; }
.subdiv-desfazer { font-size: 0.75rem; padding: 1px 8px; margin-left: 6px; cursor: pointer; }

/* ---------- Calendário editável: ações no card do dia ---------- */
.cycle-day-items li { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.cycle-day-items li.estado-feito { opacity: 0.72; }
.cycle-day-items li.estado-feito .cycle-item { text-decoration: line-through; text-decoration-thickness: 1px; }
.cycle-day-items li.estado-parcial { opacity: 0.85; }
.cycle-day-items li.estado-naoFeito .cycle-item { color: var(--bronze-ink); }
.cycle-selo {
  font-family: var(--mono);
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 2px;
  white-space: nowrap;
}
.cycle-selo.ok { background: rgba(60, 130, 90, 0.16); }
.cycle-selo.parcial { background: rgba(180, 140, 60, 0.18); }
.cycle-selo.pendente { background: rgba(180, 90, 60, 0.14); color: var(--bronze-ink); }
.cycle-acao {
  font-size: 0.72rem;
  padding: 1px 8px;
  cursor: pointer;
  border: 1px solid var(--card-edge);
  border-radius: 2px;
  background: #fff;
}
.cycle-acao.feito:hover { background: rgba(60, 130, 90, 0.12); }
.cycle-acao.desfazer:hover { background: rgba(180, 90, 60, 0.12); }
.cycle-futuro { font-size: 0.72rem; color: var(--ink-soft); opacity: 0.5; }
.cycle-day-add { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.cycle-day-add button {
  font-size: 0.72rem;
  padding: 2px 9px;
  cursor: pointer;
  border: 1px dashed var(--card-edge);
  border-radius: 2px;
  background: transparent;
  color: var(--ink-soft);
}
.cycle-day-add button:hover { border-style: solid; color: var(--ink); }
.cycle-avulsas { list-style: none; margin: 6px 0 0; padding: 0; }
.cycle-avulsas li {
  display: flex; align-items: baseline; gap: 6px;
  font-size: 0.8rem; padding: 2px 0 2px 8px;
  border-left: 2px solid var(--bronze-soft, var(--card-edge));
}
.cycle-avulsa-kind { font-family: var(--mono); font-size: 10px; text-transform: uppercase; color: var(--ink-soft); }
.cycle-avulsa-nota { flex: 1; color: var(--ink-soft); }

/* ================================================================
   CRONOGRAMA SUGERIDO (modo simples), DESEMPENHO GERAL E O SELETOR
   DE MOTOR — acrescentados em 29/07/2026.
   ================================================================ */

/* ---------- As premissas: o produto da tela, não uma nota de rodapé ---------- */
/* Elas ficam ACIMA do plano de propósito. Um cronograma que aparece antes das
   premissas é um cronograma que caiu do céu; depois delas, é uma conta que a
   pessoa consegue conferir e mudar. */
.premissas {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--petrol);
  border-radius: 3px;
  /* Superfície que carrega texto usa --card. O acento de sucesso derrubaria
     todo o texto secundário daqui para 3,69:1 — a marca desta caixa é a
     borda esquerda em teal, não um preenchimento. */
  background: var(--card);
}
.premissas-titulo {
  margin: 0 0 8px;
  font-size: 0.84rem;
  color: var(--ink);
}
.premissas-linha {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 6px;
}
.premissa {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 6px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: var(--card);
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: center;
}
button.premissa:hover,
button.premissa:focus-visible {
  border-color: var(--bronze-ink);
  background: #fff;
}
.premissa-valor {
  font-family: var(--mono);
  font-weight: 600;
  font-size: 1.05rem;
  color: var(--bronze-ink);
  white-space: nowrap;
}
.premissa-rotulo {
  font-family: var(--mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-soft);
  line-height: 1.4;
}
.premissa-op {
  display: flex;
  align-items: center;
  font-family: var(--mono);
  font-size: 1rem;
  color: var(--ink-soft);
}
/* O resultado não é editável — ele é consequência das outras premissas. Sem a
   distinção visual, a pessoa tentaria digitar "quero 5 tópicos por dia" e o
   painel teria de escolher em silêncio qual das entradas mexer. */
.premissa-resultado {
  border-color: var(--petrol);
  border-width: 2px;
  cursor: default;
  background: #fff;
}
.premissa-resultado .premissa-valor { color: var(--petrol); }
.premissas-nota {
  margin: 8px 0 0;
  font-size: 0.78rem;
  color: var(--ink-soft);
}
.cycle-folga {
  margin: 0 0 10px;
  font-size: 0.86rem;
  color: var(--ink-soft);
}

/* ---------- Desempenho geral: o card virou botão ---------- */
button.aprov-geral {
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: center;
}
button.aprov-geral:hover,
button.aprov-geral:focus-visible {
  border-color: var(--bronze-ink);
  background: rgba(143, 111, 63, 0.12);
}
.aprov-abrir {
  font-family: var(--mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bronze-ink);
}
.desempenho-detalhe {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 20px 18px;
}
.desempenho-box {
  padding: 12px 14px;
  border: 1px solid var(--card-edge);
  border-left: 4px solid var(--bronze);
  border-radius: 3px;
  background: var(--card);
}
.desempenho-titulo {
  margin: 0 0 2px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.desempenho-total { margin: 0 0 10px; font-size: 0.86rem; color: var(--ink); }
.desempenho-lista { display: flex; flex-direction: column; gap: 8px; }
.desempenho-row {
  display: grid;
  grid-template-columns: minmax(110px, 210px) 1fr 56px 62px;
  gap: 8px;
  align-items: center;
  font-size: 13px;
}
.desempenho-nome { font-weight: 600; }
.desempenho-bar {
  height: 10px; border-radius: 999px; background: rgba(0, 0, 0, 0.08); overflow: hidden;
}
.desempenho-fill { display: block; height: 100%; border-radius: 999px; background: var(--petrol); }
.desempenho-pct { font-family: var(--mono); font-size: 12px; text-align: right; }
.desempenho-n { font-family: var(--mono); font-size: 11px; color: var(--ink-soft); text-align: right; }
.desempenho-nota, .desempenho-vazio {
  margin: 10px 0 0;
  font-size: 0.78rem;
  color: var(--ink-soft);
}
.desempenho-vazio { margin: 0; }

@media (max-width: 560px) {
  .desempenho-row { grid-template-columns: 1fr 52px 58px; }
  .desempenho-nome { grid-column: 1 / 4; }
  .desempenho-bar { grid-column: 1 / 2; }
}

/* ---------- Seletor de motor, em Dados do concurso ---------- */
.settings-modo {
  margin: 14px 0 4px;
  padding: 10px 12px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: var(--card);
}
.modo-opcao {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  margin: 8px 0;
  font-size: 0.84rem;
  line-height: 1.45;
  cursor: pointer;
}
.modo-opcao input { margin-top: 3px; flex: 0 0 auto; }

/* Premissas no celular: em coluna estreita, a fila de cartões quebra em quatro
   linhas irregulares com operadores pendurados no fim. Vira grade de duas
   colunas, sem os operadores — a conta por extenso continua no "Como este
   cronograma é montado?", que é onde ela cabe inteira. */
@media (max-width: 560px) {
  .premissas-linha {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .premissa-op { display: none; }
  .premissa-resultado { grid-column: 1 / -1; }
  .premissa { padding: 6px 6px; }
  .premissa-rotulo { font-size: 8.5px; letter-spacing: 0.06em; }
}

/* ================================================================
   ANOTAÇÕES DO CALENDÁRIO — 29/07/2026.
   O que a usuária escreve sobre o dia, ao lado do que o sistema
   registrou. Marca própria na célula, bloco próprio no detalhe.
   ================================================================ */

.cal-flag-nota { color: var(--acc-azul); font-size: 9px; }
.cal-day.level-2 .cal-flag-nota { color: #d8e4ee; }
.cal-swatch-nota { color: var(--acc-azul); }

/* O dia com anotação ganha um traço discreto na base — visível sem competir
   com o nível de intensidade, que continua sendo sobre ESTUDO. Anotar não é
   estudar, e a marca precisa dizer isso sendo diferente. */
.cal-day.has-nota { box-shadow: inset 0 -2px 0 var(--acc-azul); }

.cal-nota {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--rule);
}
.cal-nota-titulo {
  margin: 0 0 4px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.cal-nota-texto {
  margin: 0 0 8px;
  font-size: 0.9rem;
  line-height: 1.55;
  /* Preserva as quebras de linha que a pessoa escreveu, sem virar <pre>: um
     diário de estudo tem listas e parágrafos, e colapsá-los apagaria a
     estrutura que ela deu ao próprio texto. */
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.cal-nota-acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.cal-nota-apagar { color: var(--danger); }
.cal-nota-apagar:hover { border-color: var(--danger); color: var(--danger); }

/* Campo longo do editor inline (a anotação é o primeiro a usar). */
.edicao-inline .campo-longo { flex: 1 1 100%; }
.edicao-inline textarea {
  width: 100%;
  min-height: 96px;
  resize: vertical;
  font-family: var(--sans);
  font-size: 0.9rem;
  line-height: 1.5;
  padding: 8px 10px;
  border: 1px solid var(--card-edge);
  border-radius: 3px;
  background: #fff;
  color: var(--ink);
}
.edicao-inline textarea:focus {
  outline: none;
  border-color: var(--bronze-ink);
}

/* ================================================================
   REDESENHO DO CRONOGRAMA — 29/07/2026.

   A lista do dia era uma linha corrida: código, título, minutos, selo
   e botões no mesmo eixo. Com várias colunas de dias lado a lado, o
   texto quebrava em quatro linhas e o ESTADO do item — que é o que se
   procura ao bater o olho — se perdia no meio dos botões.

   Vira cartão, com três zonas fixas: marca da disciplina, o assunto,
   e o estado. Nada de número novo; só a mesma informação onde o olho
   já a procura.
   ================================================================ */

/* --- Cartão de progresso da janela --- */
.crono-resumo {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 10px;
  padding: 12px 14px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-radius: 6px;
}
.crono-donut { position: relative; width: 68px; height: 68px; flex: 0 0 auto; }
.crono-donut svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.crono-donut-bg, .crono-donut-fg { fill: none; stroke-width: 6; stroke-linecap: round; }
.crono-donut-bg { stroke: var(--rule); }
.crono-donut-fg { stroke: var(--petrol); transition: stroke-dashoffset 0.4s ease; }
.crono-donut-valor {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 0.85rem; font-weight: 600; color: var(--petrol);
}
.crono-resumo-texto { flex: 1 1 auto; min-width: 0; }
.crono-resumo-titulo { margin: 0 0 8px; font-size: 0.9rem; color: var(--ink); }
.crono-contadores { display: flex; flex-wrap: wrap; gap: 6px; }
.crono-contador {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--ink-soft);
  padding: 3px 8px; border: 1px solid var(--card-edge); border-radius: var(--radius-pill);
}
.crono-contador b { font-size: 12px; margin-right: 3px; }
.crono-contador.ok b { color: var(--petrol); }
.crono-contador.pend b { color: var(--bronze-ink); }
.crono-contador.rev b { color: var(--acc-vinho); }

/* --- Abas da janela --- */
.crono-abas { display: flex; align-items: center; gap: 4px; margin: 0 0 10px; flex-wrap: wrap; }
.crono-aba {
  font: inherit; font-size: 0.82rem;
  padding: 6px 14px;
  border: 1px solid var(--card-edge);
  border-radius: var(--radius-pill);
  background: var(--card);
  color: var(--ink-soft);
  cursor: pointer;
}
.crono-aba:hover { border-color: var(--bronze-ink); color: var(--bronze-ink); }
.crono-aba.is-active {
  background: var(--petrol);
  border-color: var(--petrol);
  color: #fff;
  font-weight: 600;
}
.crono-aba-link {
  margin-left: auto;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--ink-soft); text-decoration: none;
}
.crono-aba-link:hover { color: var(--bronze-ink); text-decoration: underline; }

/* Uma coluna só (aba "Hoje"): o dia ocupa a largura toda em vez de virar uma
   coluna estreita ao lado de espaco vazio. */
.cycle-days.uma-coluna { grid-template-columns: 1fr; }

/* --- O cartão de tarefa --- */
.cycle-day-items li.tarefa {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: start;
  padding: 10px;
  margin: 0 0 6px;
  background: var(--card);
  border: 1px solid var(--card-edge);
  border-left: 3px solid var(--rule);
  border-radius: 5px;
}
.cycle-day-items li.tarefa:last-child { margin-bottom: 0; }

/* A marca da disciplina, na mesma cor que ela tem na lista de Disciplinas — é
   o que faz a marca ser reconhecível em vez de decorativa. */
.tarefa-disc {
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; flex: 0 0 auto;
  border-radius: 8px;
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  color: #fff;
}
.tarefa-disc[data-cor="1"] { background: var(--petrol); }
.tarefa-disc[data-cor="2"] { background: var(--acc-azul); }
.tarefa-disc[data-cor="3"] { background: var(--acc-ocre); }
.tarefa-disc[data-cor="4"] { background: var(--acc-vinho); }
.tarefa-disc[data-cor="5"] { background: var(--bronze-ink); }

.tarefa-info { min-width: 0; }
.tarefa-disciplina {
  margin: 0 0 1px;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.07em;
  text-transform: uppercase; color: var(--ink-soft);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tarefa-info .cycle-item { display: block; font-size: 0.88rem; }
.tarefa-meta {
  margin: 5px 0 0;
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
}
.tarefa-tempo {
  font-family: var(--mono); font-size: 10px;
  color: var(--ink-soft);
  padding: 2px 7px;
  border: 1px solid var(--rule); border-radius: var(--radius-pill);
}
.tarefa-lado {
  display: flex; flex-direction: column; align-items: flex-end; gap: 6px;
  flex: 0 0 auto;
}
.tarefa-acoes { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }

/* Anel de progresso do item: só aparece quando há progresso parcial ou
   conclusão — um anel em 0% em todo cartão seria ruído, não informação. */
.tarefa-anel { position: relative; width: 38px; height: 38px; flex: 0 0 auto; }
.tarefa-anel svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.tarefa-anel-bg, .tarefa-anel-fg { fill: none; stroke-width: 3.5; stroke-linecap: round; }
.tarefa-anel-bg { stroke: var(--rule); }
.tarefa-anel-fg { stroke: var(--bronze); transition: stroke-dashoffset 0.4s ease; }
.tarefa-anel b {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 9px; font-weight: 600; color: var(--ink-soft);
}
.estado-feito .tarefa-anel-fg, .estado-parcial .tarefa-anel-fg { stroke: var(--petrol); }
.estado-feito .tarefa-anel b, .estado-parcial .tarefa-anel b { color: var(--petrol); }

/* Etiqueta de estado, para quem não tem anel. */
.tarefa-pill {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.06em;
  text-transform: uppercase; white-space: nowrap;
  padding: 3px 9px; border-radius: var(--radius-pill);
  border: 1px solid var(--card-edge); color: var(--ink-soft); background: var(--paper);
}
.estado-naoFeito .tarefa-pill { border-color: var(--acc-vinho); color: var(--acc-vinho); }
.estado-emAndamento .tarefa-pill { border-color: var(--acc-ocre); color: var(--acc-ocre); }

/* A cor da borda esquerda diz o estado sem precisar de leitura. */
.cycle-day-items li.tarefa.estado-feito,
.cycle-day-items li.tarefa.estado-parcial { border-left-color: var(--petrol); }
.cycle-day-items li.tarefa.estado-emAndamento { border-left-color: var(--acc-ocre); }
.cycle-day-items li.tarefa.estado-naoFeito { border-left-color: var(--acc-vinho); }

@media (max-width: 560px) {
  .crono-resumo { flex-direction: column; align-items: flex-start; gap: 10px; }
  .cycle-day-items li.tarefa { grid-template-columns: auto 1fr; }
  .tarefa-lado { grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: space-between; width: 100%; }
}

/* ================================================================
   CRONÔMETRO DE ESTUDO — topo da barra lateral.
   ================================================================ */
.cronometro {
  margin: 0 0 14px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.05);
  text-align: center;
}
.crono-modos { display: flex; gap: 3px; margin-bottom: 8px; }
.crono-modo {
  flex: 1 1 0;
  font: inherit;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 5px 4px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--radius-pill);
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.crono-modo.is-active { background: rgba(255, 255, 255, 0.9); color: var(--ink); font-weight: 600; }
.crono-fase {
  margin: 0;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.1em;
  text-transform: uppercase; opacity: 0.7;
}
.crono-display {
  margin: 2px 0 4px;
  font-family: var(--mono); font-size: 1.9rem; font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.cronometro.em-pausa .crono-display { color: #f0c987; }
.cronometro.rodando .crono-fase { opacity: 1; }
.crono-medido { margin: 0 0 8px; font-size: 10.5px; opacity: 0.75; }
.crono-botoes { display: flex; flex-direction: column; gap: 5px; }
.crono-botoes button {
  font: inherit; font-size: 0.8rem;
  padding: 6px 10px;
  border-radius: 3px;
  cursor: pointer;
}
.crono-play {
  border: 1px solid rgba(255, 255, 255, 0.85);
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink);
  font-weight: 600;
}
.crono-play:hover { background: #fff; }
.crono-finalizar {
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: transparent;
  color: inherit;
}
.crono-finalizar:hover:not(:disabled) { border-color: rgba(255, 255, 255, 0.6); }
.crono-finalizar:disabled { opacity: 0.4; cursor: not-allowed; }
.crono-discreto {
  margin-top: 7px;
  font: inherit;
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.06em; text-transform: uppercase;
  background: none; border: none; color: inherit; opacity: 0.6;
  cursor: pointer; text-decoration: underline;
}
.crono-discreto:hover { opacity: 1; }
.crono-aviso {
  margin: 8px 0 0;
  padding: 6px 8px;
  font-size: 11px;
  line-height: 1.4;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.14);
}
.crono-aviso.pausa { background: rgba(240, 201, 135, 0.22); }

/* ELEVAÇÃO DAS SUPERFÍCIES DO CRONOGRAMA — paleta Neomatis.
   Fundo (#F6F1E8) e card (#FBF8F1) ficam a cinco tons de distância, então é a
   sombra que separa um do outro. A dica da própria paleta pede isso: elevação
   com sombra sutil, em vez de escurecer o fundo para criar contraste.
   Os cards mais antigos (.study-panel, .plan-card, .info-card) já tinham a
   sua — aqui entram as superfícies novas. */
.crono-resumo,
.premissas,
.desempenho-box,
.cycle-day,
.cycle-day-items li.tarefa {
  box-shadow: var(--elev);
}

/* ================================================================
   ALVOS DE TOQUE — 29/07/2026.

   Uma varredura das oito vistas em 375px encontrou quinze controles
   com menos de 24px de altura, e entre eles os que mais se usam:
   `feito` e `parei aqui` (16px), os botões da fila de revisão,
   `+ tópico do edital` (18px), `ocultar segundos` (16px) e as
   caixas de marcar dos subtópicos (16px).

   16px é confortável com mouse e é uma loteria com o dedo. O piso
   aqui é 24px — o mínimo da WCAG 2.2 (2.5.8, nível AA) — aplicado
   em TODAS as larguras, porque um botão de 24px também não
   incomoda no desktop, e manter dois tamanhos seria manter duas
   verdades sobre o mesmo botão.

   O que NÃO foi feito: aumentar a fonte. O piso é de área clicável,
   via `min-height` e preenchimento. O texto continua do tamanho que
   era, então nenhum layout se reflui por causa disto.
   ================================================================ */

/* Ações do card do dia: feito / parei aqui / desfazer. */
.cycle-acao {
  min-height: 24px;
  padding: 3px 10px;
}
.cycle-day-add button {
  min-height: 24px;
  padding: 3px 10px;
}

/* Botões da fila de revisão (Revisado / Adiar / Dominado / Refazer). */
.review-actions button {
  min-height: 24px;
}

/* Links de ação que se parecem com texto mas são botões de verdade.
   `inline-flex` dá altura ao alvo sem mexer no tamanho da letra. */
.cycle-ver-tudo,
.cycle-rodape a,
.crono-aba-link,
.today-viab-link,
.pace-link {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}

/* Cronômetro: o alternador de segundos e as abas de modo. */
.crono-discreto {
  min-height: 24px;
  padding: 2px 8px;
}
.crono-modo { min-height: 26px; }

/* Botões pequenos espalhados pelo painel. */
.qbank-fix-btn,
.archived-row button,
.note-toggle,
.contest-add,
.side-toggle {
  min-height: 24px;
}

/* Campos e seletores estreitos do editor de pesos e afins. As classes são as
   do painel de pesos (wb-*/wd-*), conferidas no markup — não inventadas. */
.wb-row input,
.wb-row select,
.wd-row input,
.wb-weight input,
.settings-week-hours,
.settings-fields input {
  min-height: 26px;
}

/* Caixas de marcar: são o gesto central de "concluí este tópico". 16px é
   pequeno demais para o dedo; 20px com o rótulo inteiro clicável ao lado dá
   um alvo real bem acima do piso — o `label` é que recebe o toque. */
.leaf-label input[type="checkbox"] {
  width: 20px;
  height: 20px;
  top: 1px;
}
.leaf-label {
  min-height: 24px;
  align-items: center;
}
.settings-week-grid label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
}
.settings-week-grid input[type="checkbox"] {
  width: 18px;
  height: 18px;
}

/* Rótulos de escolha (modo de planejamento, destino da importação): o alvo é a
   linha inteira, não só o quadradinho. */
.modo-opcao,
.edital-dest label {
  min-height: 26px;
}

/* ================================================================
   RESPIRO NO CELULAR — a faixa de ritmo e as ações.

   Com os botões podendo quebrar (ver .study-actions), em telas
   estreitas eles ficam melhor ocupando a largura toda em duas
   colunas do que empilhados em quatro linhas de um.
   ================================================================ */
@media (max-width: 560px) {
  .study-strip-inner { gap: 10px; }
  .study-stats {
    gap: 10px 14px;
    justify-content: space-between;
    width: 100%;
  }
  .study-stat { flex: 1 1 62px; }
  .study-actions { width: 100%; }
  .study-actions button { flex: 1 1 46%; }
  /* O primeiro é a ação principal: fica com a linha inteira. */
  .study-actions #btn-add-session { flex: 1 1 100%; }
}

/* Os últimos quatro alvos abaixo de 24px, achados na segunda varredura.
   O `×` de excluir linha nascia sem classe nenhuma — ganhou nome em app.js,
   porque estilizar por posição seria um seletor que a próxima mexida quebra. */
.linha-excluir {
  min-width: 24px;
  min-height: 24px;
  line-height: 1;
  cursor: pointer;
}
button.danger { min-height: 24px; }
#weights-panel input,
#weights-panel select { min-height: 26px; }

/* Editor de pesos em tela muito estreita (320px): a linha de bloco não quebrava
   e o painel inteiro passava 25px da borda — e, como o documento não rolava na
   horizontal, esse pedaço ficava INALCANÇÁVEL, que é pior que uma barra de
   rolagem. As linhas passam a quebrar; `min-width: 0` deixa os campos
   encolherem de verdade dentro delas. */
@media (max-width: 420px) {
  .wb-row { flex-wrap: wrap; }
  .wb-row input[type="text"] { flex: 1 1 100%; }
  .wb-weight input { width: 72px; }
  .wd-row select { max-width: 100%; flex: 1 1 100%; }
  .wd-row input[type="number"] { width: 78px; }
  .backup-panel { min-width: 0; }
}
