/* Cadencial: telas (Hoje, Revisão, Painel, Materiais, Simulados, Discursiva, entrar e admin). Componentes comuns em app.css. */

/* ---------- Hoje ---------- */
.hoje-grade { display: grid; gap: 12px 24px; grid-template-columns: minmax(0, 1fr); }
.hoje-principal, .hoje-lateral { min-width: 0; }
@media (min-width: 1180px) { .hoje-grade { grid-template-columns: minmax(0, 1fr) 20rem; align-items: start; } .conteudo:has(.hoje-grade) { max-width: 1100px; } }
.hoje-cab { margin: 0 0 4px; }
.hoje-cab h1 { margin: 0 0 4px; }
.hoje-cab p { margin: 0 0 4px; }
.hoje-cab .meta { display: block; }
.hoje-tempo .barra-cheia { height: 8px; margin: 10px 0; }
.hoje-tempo .linha-apoio { font-size: .875rem; color: var(--texto-2); margin: 0; }
.ajuste { margin-top: 8px; }
.ajuste > summary { display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--primaria); font-weight: 600; font-size: .9375rem; list-style: none; }
.ajuste > summary::-webkit-details-marker { display: none; }
.ajuste .linha { margin-top: 4px; }
.hoje-continuar { display: flex; flex-direction: column; gap: 12px; }
.continuar-item { display: flex; flex-direction: column; gap: 10px; }
.continuar-item + .continuar-item { padding-top: 12px; border-top: 1px solid var(--borda); }
.continuar-cab { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.continuar-titulo { font-size: 1.25rem; line-height: 1.625rem; font-weight: 700; }
.continuar-item .botao { margin: 0; }
.continuar-item .barra-cheia { height: 6px; margin: 0; }
.plano-h2 { margin: 20px 0 0; }
.plano-lista { list-style: none; margin: 12px 0; padding: 0; background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-g); box-shadow: var(--sombra); }
.plano-item { display: flex; gap: 12px; padding: 14px 16px; align-items: flex-start; }
.plano-item + .plano-item { border-top: 1px solid var(--borda); }
.plano-marca { flex: none; width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--borda); color: var(--texto-2);
  font-size: .875rem; font-weight: 800; display: flex; align-items: center; justify-content: center; font-variant-numeric: tabular-nums; }
.plano-item.proximo .plano-marca { border-color: var(--primaria); color: var(--primaria); }
.plano-feito .plano-marca { border: 0; background: var(--ok-suave); color: var(--ok); }
.plano-adiado .plano-marca { border-style: dashed; }
.plano-corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.plano-corpo > * { margin: 0; }
.plano-titulo { font-size: 1rem; font-weight: 700; }
.plano-feito .plano-titulo { color: var(--texto-2); }
.plano-adiado { opacity: .75; }
.plano-selos { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.plano-rodape { display: flex; align-items: center; justify-content: space-between; gap: 8px 12px; flex-wrap: wrap; }
.plano-rodape form { margin: 0; }
.plano-rodape .botao { margin: 0; width: auto; min-height: 44px; padding: .4rem 1.1rem; }
.plano-mais { margin: 0 0 12px; }
.checkin-titulo { display: block; font-weight: 700; margin-bottom: 8px; }
.checkin .acoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 8px; }
.checkin .acoes .botao { min-height: 44px; font-size: .9375rem; padding: .3rem .4rem; }
.foco { font-weight: 600; background: var(--alerta-suave); padding: .5rem .75rem; border-radius: var(--raio); }
.semana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; align-items: end; height: 5.5rem; margin-top: 8px; }
.semana-dia { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: .8125rem; font-weight: 700; color: var(--sutil); }
.semana-barras { position: relative; height: 4.2rem; width: 100%; display: flex; align-items: end; justify-content: center; gap: 3px; }
.semana-barras span { width: 10px; border-radius: 4px 4px 0 0; background: var(--borda); }
.semana-barras span.feito { background: var(--primaria); }
.semana-numeros { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; text-align: center; margin-top: 8px; }
.semana-numeros div { display: flex; flex-direction: column; gap: 2px; }
.semana-numeros strong { font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.memoria p { margin: .4rem 0; }
.memoria-avaliacao { font-weight: 600; }

/* ---------- Painel (maquete Painel.dc.html) ---------- */
.evolucao { display: flex; flex-direction: column; gap: 12px; }
.evolucao > p { margin: 0; }
.evo-numeros { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 8px 16px; }
.evo-numeros p { margin: 0; display: flex; flex-direction: column; }
.evo-antes { font-size: 2rem; line-height: 2.375rem; font-weight: 800; color: var(--texto-2); font-variant-numeric: tabular-nums; }
.evo-agora { font-size: 2.75rem; line-height: 3.125rem; font-weight: 800; color: var(--primaria); font-variant-numeric: tabular-nums; }
.evo-seta { color: var(--sutil); padding-bottom: 10px; }
.evo-ganho { margin-left: auto; margin-bottom: 8px; min-height: 30px; font-size: .9375rem; font-weight: 800; }
.evo-escala { position: relative; }
.evo-escala .barra-cheia { height: 10px; margin: 4px 0 0; }
.evo-minimo { position: absolute; top: -2px; width: 2px; height: 18px; margin-left: -1px; background: var(--texto); }
.evo-legenda { position: relative; display: flex; justify-content: space-between; font-size: .8125rem; font-weight: 600; color: var(--sutil); }
.evo-minimo-rotulo { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; }
.disc-barras { display: flex; flex-direction: column; gap: 14px; }
.disc-barra { display: flex; flex-direction: column; gap: 4px; }
.disc-linha { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: .9375rem; }
.disc-nome { font-weight: 600; min-width: 0; }
.disc-valor { font-weight: 700; white-space: nowrap; }
.disc-barra .barra-cheia { margin: 0; }
.barra-alerta::-webkit-progress-value { background: var(--alerta); }
.barra-alerta::-moz-progress-bar { background: var(--alerta); }
.barra-vazia { display: block; height: 8px; border-radius: 999px; border: 1px dashed var(--borda); }
.link-seta { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-top: 8px; font-weight: 700; text-decoration: none; }
.link-seta .icone { width: 18px; height: 18px; }
.motivos-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.motivo-caixa { background: var(--superficie-2); border-radius: var(--raio); padding: 12px; display: flex; flex-direction: column; gap: 2px; }
.motivo-caixa strong { font-size: 1.5rem; line-height: 1.875rem; font-weight: 800; }
.motivo-caixa span { font-size: .875rem; color: var(--texto-2); }
@media (min-width: 1024px) { .motivos-grade { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.par-valor { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 6px 0; font-size: .9375rem; }
.par-valor > span { color: var(--texto-2); }
.par-valor strong { font-weight: 700; text-align: right; }
.ritmo-tudo { margin-top: 8px; }
.ritmo-tudo > summary { display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--primaria); font-weight: 700; }
.kpis { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); margin: 12px 0; }
.kpis .cartao { margin: 0; display: flex; flex-direction: column; gap: 2px; }
.kpis .sutil { font-size: .875rem; font-weight: 600; }
.nota-grande { font-size: 2rem; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.evolucao-notas { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 28px; margin: 8px 0 12px; }
.evolucao-notas p { margin: 0; display: flex; flex-direction: column; }
.evolucao-notas .sutil { font-size: .875rem; font-weight: 600; }
.evolucao-assuntos { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; margin-top: 12px; }
.evolucao h3, .metricas h3 { margin: 16px 0 6px; }
.secao-avaliacoes { margin-top: 28px; }
.metricas-grade { display: grid; gap: 12px 24px; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.metricas h3 { font-size: 1rem; }
.metricas ul { margin: .2rem 0; padding-left: 1.1rem; }
.painel-rodape { font-size: .9375rem; }

/* ---------- Materiais ---------- */
.simulados-cartoes { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); margin: 12px 0; }
.disc-cartao { text-decoration: none; color: inherit; margin: 0; display: flex; flex-direction: column; gap: 6px; transition: border-color var(--mov-estado); }
.disc-cartao:hover { border-color: var(--sutil); color: inherit; }
.disc-cartao.ativo { border: 2px solid var(--primaria); }
.disc-cartao .barra { width: 100%; max-width: none; margin: 4px 0 0; }
.mat-linha { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; align-items: center; padding: 12px 0; border-top: 1px solid var(--borda); }
.mat-tipos { grid-column: 2; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: .9375rem; font-weight: 600; }
.mat-tipos .sutil { font-weight: 500; }

/* ---------- Simulados ---------- */
.sim-barras { display: grid; gap: .5rem; margin: .6rem 0; }
.sim-linha { display: grid; grid-template-columns: minmax(9rem, 14rem) minmax(5rem, 1fr) minmax(8rem, auto); align-items: center; gap: .6rem; font-size: .9375rem; }
.sim-linha span { font-variant-numeric: tabular-nums; }
@media (max-width: 640px) { .sim-linha { grid-template-columns: 1fr; gap: .15rem; } }

/* ---------- Discursiva ---------- */
.transcricao { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .9375rem; white-space: pre-wrap; width: 100%; }
.nota strong { font-size: 2rem; font-weight: 800; }
.folha { background: var(--papel); color: var(--papel-texto); padding: 1rem; margin-bottom: 1rem; border-radius: var(--raio); }
.folha-cabeca { font-size: .875rem; margin: 0 0 .5rem; }
.folha-linhas { margin: 0; padding-left: 2.2rem; }
.folha-linhas li { height: 8.2mm; border-bottom: 1px solid var(--papel-linha); font-size: .8125rem; color: var(--papel-linha); }
@media print { .folha { page-break-after: always; border-radius: 0; padding: 0; } }

/* ---------- Entrar e convite do alfa ---------- */
.conteudo:has(.entrar) { max-width: 440px; padding-top: 48px; }
.entrar-marca { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; margin-bottom: 24px; }
.entrar-marca .marca-simbolo { width: 56px; height: 56px; }
.entrar-nome { display: flex; flex-direction: column; gap: 4px; }
.entrar-nome strong { font-size: 2rem; line-height: 2.125rem; font-weight: 800; letter-spacing: -.04em; }
.entrar-nome span { font-size: .8125rem; font-weight: 700; letter-spacing: .4em; padding-left: .4em; color: var(--sutil); }
.entrar-marca p { margin: 6px 0 0; color: var(--texto-2); }
.entrar-marca p b { color: var(--texto); }
.entrar { margin: 0; padding: 20px 16px; }
.entrar h1 { font-size: 1.375rem; line-height: 1.75rem; margin: 0 0 4px; }
.entrar form label:first-of-type { margin-top: 12px; }
.entrar .botao { min-height: 52px; margin-top: 16px; }
.entrar-rodape { margin: 24px 0 0; text-align: center; font-size: .875rem; color: var(--sutil); }
.logo-claro, .logo-escuro { display: none; }

/* ---------- Documentos (termo e privacidade) ---------- */
.documento { max-width: 46rem; }

/* ---------- Admin ---------- */
.pdf iframe { display: none; }
@media (min-width: 900px) {
  .conteudo:has(.revisao) { max-width: 1400px; }
  .revisao { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
  .revisao > .cartao { margin: 0; }
  .pdf { position: sticky; top: 72px; }
  .pdf iframe { display: block; width: 100%; height: calc(100vh - 140px); border: 1px solid var(--borda); border-radius: var(--raio-g); }
}
/* caminho até o alfa */
.caminho-grade { position: relative; }
.caminho-grade::after { content: ""; position: absolute; top: 0; bottom: 0; left: calc(12rem + (100% - 12rem) * var(--hoje, 0%) / 100%); width: 2px; background: var(--primaria); opacity: .5; pointer-events: none; }
.caminho-etapa { margin: .8rem 0 .2rem; font-size: .875rem; }
.caminho-linha { display: flex; align-items: center; gap: .5rem; min-height: 1.6rem; }
.caminho-nome { flex: 0 0 11.5rem; font-size: .8125rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.caminho-trilho { position: relative; flex: 1; height: .9rem; background: var(--borda); border-radius: 4px; }
.caminho-barra { position: absolute; top: 0; bottom: 0; background: var(--primaria); border-radius: 4px; opacity: .75; }
.caminho-barra.trava { background: var(--erro); opacity: .9; }
.caminho-barra.rodando { background: var(--ok); opacity: 1; }
@media (max-width: 700px) { .caminho-nome { flex-basis: 7rem; } .caminho-grade::after { left: calc(7.5rem + (100% - 7.5rem) * var(--hoje, 0%) / 100%); } }

/* ---------- Revisão visual em mapa mental (FILA 79; protótipo em seeds/material/modelo/prototipo) ---------- */
.mm { --mm-largo: 0; position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 8px 0; }
.mm-linhas { position: absolute; inset: 0; pointer-events: none; overflow: visible; }
.mm-linhas path { fill: none; stroke-width: 3.5; stroke-linecap: round; }
.mm-col { display: grid; gap: 16px; position: relative; }
.mm-meio { order: -1; display: grid; gap: 14px; justify-items: center; position: relative; }
.mm-centro { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 2px; background: var(--superficie); border: 4px solid var(--primaria);
  border-radius: 46% 54% 50% 50% / 56% 46% 54% 44%; padding: 26px 30px; color: var(--primaria); position: relative; z-index: 1; box-shadow: var(--mm-sombra); }
.mm-ic-centro { width: 46px; height: 46px; }
.mm-centro strong { font: 700 40px/1.05 "Caveat", cursive; }
.mm-centro span { font-size: 14px; font-weight: 700; color: var(--texto-2); }
.mm-dicas { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.mm-dica { background: var(--mm-nota-a); color: var(--mm-nota-t); border-radius: 6px; padding: 12px 16px; transform: rotate(-2deg); box-shadow: var(--mm-sombra-nota);
  min-width: 200px; position: relative; z-index: 1; }
.mm-dica-b { background: var(--mm-nota-b); transform: rotate(1.5deg); }
.mm-dica .mm-ic { width: 22px; height: 22px; color: var(--mm-nota-ic); vertical-align: -4px; margin-right: 4px; }
.mm-dica strong { font: 700 26px "Caveat", cursive; }
.mm-dica ul { margin: 4px 0 0; padding-left: 18px; font-size: 15px; }
.mm-ramo { --c: var(--mm-c0); background: color-mix(in srgb, var(--c) 9%, var(--superficie)); border: 2px solid color-mix(in srgb, var(--c) 40%, transparent);
  border-radius: 20px; padding: 12px 16px 14px; position: relative; z-index: 1; }
.mm-ramo h4 { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; color: var(--c); font: 700 30px/1 "Caveat", cursive; }
.mm-ramo .mm-ic { width: 38px; height: 38px; padding: 7px; box-sizing: border-box; border-radius: 999px; background: var(--c); color: var(--superficie); flex: none; }
.mm-ramo ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; font-size: 15px; }
.mm-ramo li { display: flex; gap: 8px; align-items: baseline; }
.mm-ramo li::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--c); flex: none; transform: translateY(-1px); }
.mm-c0 { --c: var(--mm-c0); } .mm-c1 { --c: var(--mm-c1); } .mm-c2 { --c: var(--mm-c2); } .mm-c3 { --c: var(--mm-c3); } .mm-c4 { --c: var(--mm-c4); } .mm-c5 { --c: var(--mm-c5); }
.mm-l0 { stroke: var(--mm-c0); } .mm-l1 { stroke: var(--mm-c1); } .mm-l2 { stroke: var(--mm-c2); } .mm-l3 { stroke: var(--mm-c3); } .mm-l4 { stroke: var(--mm-c4); } .mm-l5 { stroke: var(--mm-c5); }
.mm-p0 { fill: var(--mm-c0); } .mm-p1 { fill: var(--mm-c1); } .mm-p2 { fill: var(--mm-c2); } .mm-p3 { fill: var(--mm-c3); } .mm-p4 { fill: var(--mm-c4); } .mm-p5 { fill: var(--mm-c5); }
.mm-trocas { margin-top: 24px; padding: 18px; border-radius: 22px; background: color-mix(in srgb, var(--mm-c4) 6%, var(--superficie));
  border: 2px dashed color-mix(in srgb, var(--mm-c4) 45%, transparent); }
.mm-trocas h4 { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; color: var(--mm-c4); font: 700 32px/1 "Caveat", cursive; }
.mm-trocas h4 .mm-ic { width: 40px; height: 40px; padding: 8px; box-sizing: border-box; border-radius: 999px; background: var(--mm-c4); color: var(--superficie); }
.mm-trocas ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); }
.mm-troca { display: grid; gap: 6px; padding: 10px; border-radius: 16px; background: var(--superficie); box-shadow: var(--mm-sombra-p); }
.mm-troca:nth-child(odd) { transform: rotate(-.8deg); } .mm-troca:nth-child(even) { transform: rotate(.8deg); }
.mm-certo, .mm-errado { display: grid; grid-template-columns: 28px 1fr; column-gap: 8px; align-items: center; padding: 8px 10px; border-radius: 12px; font-size: 15px; font-weight: 700; }
.mm-certo em, .mm-errado em { grid-column: 2; font: 700 20px/1 "Caveat", cursive; font-style: normal; order: -1; }
.mm-certo .mm-ic-p, .mm-errado .mm-ic-p { grid-row: span 2; width: 28px; height: 28px; padding: 5px; box-sizing: border-box; border-radius: 999px; color: var(--superficie); }
.mm-certo { background: var(--ok-suave); color: var(--ok); } .mm-certo .mm-ic-p { background: var(--ok); }
.mm-errado { background: color-mix(in srgb, var(--mm-c4) 12%, var(--superficie)); color: var(--mm-c4); } .mm-errado .mm-ic-p { background: var(--mm-c4); }
.mm-errado s { text-decoration-thickness: 2px; text-decoration-color: color-mix(in srgb, var(--mm-c4) 70%, transparent); }
/* três colunas com as curvas só quando a caixa do mapa tem espaço (no leitor de 680 px ele fica em coluna, como no celular) */
.mm-secao { container-type: inline-size; }
@container (min-width: 900px) { .mm { --mm-largo: 1; grid-template-columns: minmax(0, 1fr) 320px minmax(0, 1fr); column-gap: 64px; align-items: center; } .mm-meio { order: 0; } }
.documento-marca { color: var(--texto); text-decoration: none; }
/* Conferir classificações (admin): "Está certo" em cima; a correção numa linha só embaixo */
.classif-form { display: grid; gap: 12px; margin-top: 12px; }
.classif-form .classif-certo { order: -1; justify-self: start; width: auto; min-width: 12rem; margin-top: 0; }
.classif-errado label { display: block; font-weight: 600; margin-bottom: 6px; }
.classif-linha { display: flex; flex-wrap: wrap; gap: 8px; }
.classif-linha input { flex: 1 1 16rem; min-width: 0; }
.classif-linha .botao { flex: 0 0 auto; width: auto; margin-top: 0; }