/* Central do RAIAM SANTOS -- tema escuro em azul-marinho e anil, cores chapadas (sem degrade).
   Um unico destaque visual (a regua de dias da pagina inicial); o resto sao listas calmas. */
:root {
  /* paleta pedida pelo José */
  --noite: #000020;      /* fundo da pagina */
  --quadro: #171A4A;     /* menu lateral, paineis, cartoes */
  --quadro-2: #2F2C79;   /* realce dentro de painel, item ativo */
  --linha: #2F2C79;      /* divisorias */
  --campo: #131313;      /* campos de formulario, itens compactos */
  --escuro: #090808;     /* fundo atras de dialogos, dias fora do mes */
  --giz: #ecebfa;        /* texto */
  --giz-2: #a9a7ce;      /* texto de apoio (7:1 sobre o fundo) */
  --violeta: #8f7bff;
  --anil: #4fa8ff;
  --ambar: #ffc857;      /* provas e alertas */
  --verde: #5fd3a2;
  --rosa: #ff7a9c;
  --ciano: #56d3e0;
  --raio: 10px;
  --fonte: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Roboto, "Noto Sans", sans-serif;
  --lateral: 236px;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--noite);
  color: var(--giz);
  font: 1rem/1.5 var(--fonte);
}

h1, h2, h3, p, ul, ol { margin: 0; }
h1 { font-size: clamp(1.55rem, 1.2rem + 1.5vw, 2.15rem); line-height: 1.15; letter-spacing: -0.02em; font-weight: 700; }
h2 { font-size: 1.1rem; line-height: 1.3; font-weight: 650; }
h3 { font-size: 1rem; line-height: 1.35; font-weight: 650; }
a { color: var(--anil); text-underline-offset: 3px; }
a:hover { color: var(--giz); }
:focus-visible { outline: 2px solid var(--anil); outline-offset: 2px; border-radius: 4px; }

.pular { position: absolute; left: -999px; top: 8px; background: var(--violeta); color: var(--noite); padding: 8px 12px; border-radius: 8px; z-index: 20; }
.pular:focus { left: 8px; }

/* ---------- estrutura ---------- */
.app { display: grid; grid-template-columns: var(--lateral) minmax(0, 1fr); min-height: 100vh; min-height: 100dvh; }
.lateral {
  position: sticky; top: 0; height: 100vh; height: 100dvh;
  display: flex; flex-direction: column; gap: 22px;
  padding: 22px 14px 16px;
  background: var(--quadro); border-right: 1px solid var(--linha);
}
.marca { display: flex; align-items: center; gap: 10px; padding: 0 8px; color: var(--giz); text-decoration: none; font-weight: 700; font-size: 1.05rem; letter-spacing: -0.01em; }
.conteudo { padding: 36px clamp(16px, 4vw, 52px) 72px; max-width: 1280px; width: 100%; }
.conteudo:focus { outline: none; }
.abas { display: none; }
.carregando { padding: 48px 24px; color: var(--giz-2); }

.nav { display: flex; flex-direction: column; gap: 2px; flex: 1; overflow-y: auto; }
.nav a, .abas a {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 10px; border-radius: 8px;
  color: var(--giz-2); text-decoration: none; font-weight: 600;
}
.nav a:hover { background: var(--quadro-2); color: var(--giz); }
.nav a[aria-current="page"] { background: var(--quadro-2); color: var(--giz); box-shadow: inset 3px 0 0 var(--violeta); }
.nav-titulo { margin: 18px 10px 6px; font-size: 0.8rem; color: var(--giz-2); }
.nav-titulo.primeiro { margin-top: 0; }
.icone { width: 20px; height: 20px; flex: none; fill: currentColor; }
.icone path { fill-rule: evenodd; }
.novos { margin-left: auto; min-width: 22px; padding: 0 7px; border-radius: 999px; background: var(--violeta); color: var(--noite); font-size: 0.75rem; font-weight: 700; text-align: center; line-height: 1.6; }

.conta-botao { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px; border: 1px solid var(--linha); border-radius: var(--raio); background: none; color: var(--giz); font: inherit; font-weight: 600; cursor: pointer; text-align: left; }
.conta-botao:hover { background: var(--quadro-2); }
.avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--violeta); color: var(--noite); font-weight: 700; flex: none; }
.conta-nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- blocos de pagina ---------- */
.topo { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 24px; margin-bottom: 26px; }
.sub { color: var(--giz-2); margin-top: 6px; max-width: 62ch; }
.bloco { margin-top: 30px; }
.bloco > h2, .regua-detalhe > h2 { margin-bottom: 4px; }
.colunas { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0 44px; }
.atalhos { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.mais { display: inline-block; margin-top: 12px; font-weight: 600; }
.vazio { color: var(--giz-2); padding: 14px 0; max-width: 60ch; }

/* ---------- regua de dias ---------- */
.regua {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(46px, 1fr);
  background: var(--quadro); border: 1px solid var(--linha); border-radius: var(--raio);
  overflow-x: auto; scrollbar-width: thin;
}
.dia {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  min-height: 94px; padding: 11px 2px 12px;
  background: none; border: 0; border-left: 1px solid var(--linha);
  color: var(--giz); font: inherit; cursor: pointer;
}
.dia:first-child { border-left: 0; }
.dia:disabled { cursor: default; color: var(--giz); opacity: 1; }
.dia .sem { font-size: 0.78rem; color: var(--giz-2); }
.dia .num { font-size: 1.3rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.dia.fim .num, .dia.fim .sem { opacity: 0.5; }
.dia.hoje { box-shadow: inset 0 3px 0 var(--violeta); }
.dia.hoje .sem { color: var(--violeta); font-weight: 700; }
.dia:not(:disabled):hover, .dia[aria-pressed="true"] { background-color: var(--quadro-2); }
.dia[aria-pressed="true"] { box-shadow: inset 0 -3px 0 var(--violeta); }
.marcas { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin-top: 7px; min-height: 10px; }
.regua-detalhe { margin-top: 18px; }

/* formas por tipo de aviso: a forma diz o tipo, a cor so reforca */
.forma { display: inline-block; width: 9px; height: 9px; flex: none; background: var(--giz-2); border-radius: 50%; }
.forma.prova { background: var(--ambar); border-radius: 1px; transform: rotate(45deg) scale(0.9); }
.forma.trabalho { background: var(--anil); border-radius: 2px; }
.forma.entrega { background: var(--verde); border-radius: 2px; width: 12px; height: 7px; }
.forma.horario { background: var(--violeta); }
.forma.apresentacao { background: var(--rosa); border-radius: 0; clip-path: polygon(50% 0, 100% 100%, 0 100%); width: 10px; height: 10px; }
.forma.evento { background: transparent; border: 2px solid var(--ciano); }

/* ---------- listas ---------- */
.lista { list-style: none; padding: 0; border-top: 1px solid var(--linha); margin-top: 10px; }
.lista > li { border-bottom: 1px solid var(--linha); }
.post { padding: 14px 2px; }
.post-topo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 6px; }
.post h3 a { color: var(--giz); text-decoration: none; }
.post h3 a:hover { color: var(--anil); text-decoration: underline; }
.texto { white-space: pre-wrap; overflow-wrap: anywhere; margin-top: 6px; max-width: 72ch; }
.texto.curto { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.meta { color: var(--giz-2); font-size: 0.875rem; margin-top: 6px; }
.quando { color: var(--ambar); font-weight: 650; font-size: 0.9rem; }
.chip { display: inline-flex; align-items: center; gap: 7px; padding: 2px 10px 2px 8px; border-radius: 999px; background: var(--quadro-2); font-size: 0.8rem; font-weight: 650; }
.chip-aberto { color: var(--ambar); padding-left: 10px; }
.chip-ok { color: var(--verde); padding-left: 10px; }
.resolvido > h3, .resolvido > .texto { color: var(--giz-2); }
.acoes-item { display: flex; flex-wrap: wrap; gap: 2px; margin: 6px 0 0 -8px; }

.respostas { list-style: none; margin: 12px 0 0; padding: 0 0 0 14px; border-left: 2px solid var(--linha); }
.respostas > li { padding: 8px 0; }
.respostas .texto { margin-top: 0; }
.resposta-form { margin-top: 12px; display: grid; gap: 8px; max-width: 72ch; }
.resposta-acoes { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.resposta-acoes input[type="file"] { max-width: 100%; color: var(--giz-2); font: inherit; font-size: 0.875rem; }
.compor { display: grid; gap: 10px; justify-items: start; max-width: 72ch; margin-bottom: 8px; }
.compor textarea { width: 100%; }

.filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
.filtro { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--linha); background: none; color: var(--giz-2); font: inherit; font-size: 0.9rem; font-weight: 600; text-decoration: none; cursor: pointer; }
.filtro:hover { color: var(--giz); border-color: var(--giz-2); }
.filtro[aria-pressed="true"], .filtro[aria-current="page"] { background: var(--quadro-2); border-color: var(--violeta); color: var(--giz); }

/* ---------- materiais ---------- */
.trilha { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 8px; padding: 0; margin-bottom: 14px; font-size: 0.9rem; color: var(--giz-2); }
.trilha li + li::before { content: "/"; margin-right: 8px; color: var(--linha); }
.fichas { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.ficha { display: grid; grid-template-columns: 7px minmax(0, 1fr); min-height: 84px; background: var(--quadro); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; color: var(--giz); text-decoration: none; }
.ficha::before { content: ""; background: hsl(var(--matiz, 250) 82% 68%); }
.ficha > div { padding: 14px 16px; display: grid; align-content: center; gap: 4px; }
.ficha strong { font-weight: 650; line-height: 1.3; }
.ficha span { color: var(--giz-2); font-size: 0.875rem; }
.ficha:hover { border-color: hsl(var(--matiz, 250) 82% 68%); color: var(--giz); }

.arq { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 2px; }
.tipo { display: grid; place-items: center; width: 38px; height: 44px; border-radius: 6px; background: var(--campo); color: var(--giz-2); font-size: 0.68rem; font-weight: 700; overflow: hidden; }
.tipo-pasta { color: var(--violeta); }
.arq .nome { font-weight: 600; overflow-wrap: anywhere; color: var(--giz); text-decoration: none; }
.arq .nome:hover { color: var(--anil); text-decoration: underline; }
.arq .meta { margin-top: 2px; }
.envios { list-style: none; padding: 0; margin-top: 12px; display: grid; gap: 8px; }
.envios:empty { display: none; }
.envio { display: grid; grid-template-columns: minmax(0, 1fr) 120px auto; align-items: center; gap: 12px; font-size: 0.9rem; }
.envio .nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.envio .meta { margin: 0; }
.progresso { height: 6px; border-radius: 3px; background: var(--quadro-2); overflow: hidden; }
.progresso > i { display: block; height: 100%; width: var(--p, 0%); background: var(--anil); transition: width 0.2s linear; }

/* ---------- botoes e campos ---------- */
.botao { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 15px; border-radius: 8px; border: 1px solid var(--linha); background: var(--quadro-2); color: var(--giz); font: inherit; font-weight: 600; line-height: 1.3; text-decoration: none; cursor: pointer; }
.botao:hover { border-color: var(--giz-2); color: var(--giz); }
.botao:disabled { opacity: 0.55; cursor: progress; }
.botao.primario { background: var(--violeta); border-color: var(--violeta); color: var(--noite); }
.botao.primario:hover { background: #a595ff; border-color: #a595ff; color: var(--noite); }
.botao.perigo { background: var(--rosa); border-color: var(--rosa); color: var(--noite); }
.botao.discreto { background: none; border-color: transparent; color: var(--giz-2); padding: 5px 8px; font-size: 0.9rem; }
.botao.discreto:hover { color: var(--giz); background: var(--quadro-2); }

input[type="text"], input[type="password"], input[type="date"], select, textarea {
  width: 100%; padding: 10px 12px; border-radius: 8px;
  border: 1px solid var(--linha); background: var(--campo); color: var(--giz);
  font: inherit;
}
textarea { resize: vertical; min-height: 2.9em; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--anil); outline-offset: 0; border-color: var(--anil); }
::placeholder { color: #8482ad; opacity: 1; }
label { display: block; font-weight: 600; font-size: 0.9rem; margin-bottom: 5px; }
.campo { margin-top: 14px; }
.dica { color: var(--giz-2); font-size: 0.85rem; margin-top: 5px; }
.erro { color: var(--rosa); font-weight: 600; margin-top: 12px; }

.dialogo { width: min(520px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 24px; border: 1px solid var(--linha); border-radius: 14px; background: var(--quadro); color: var(--giz); }
.dialogo::backdrop { background: rgba(9, 8, 8, 0.82); }
.form > p, .form > h3, .form > button, .form > textarea { margin-top: 12px; }
.form-acoes { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }

.toasts { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); display: grid; gap: 8px; z-index: 30; width: min(440px, calc(100vw - 24px)); pointer-events: none; }
.toast { padding: 11px 15px; border-radius: 10px; background: var(--giz); color: var(--noite); font-weight: 600; box-shadow: 0 8px 28px rgba(5, 4, 20, 0.55); }
.toast-erro { background: var(--rosa); }

/* ---------- tela de entrada ---------- */
.tela-entrar {
  min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 24px 16px;
  background: var(--noite);
}
.entrar { width: min(380px, 100%); }
.entrar-marca { margin-bottom: 26px; }
.entrar-marca h1 { margin-top: 14px; }
.entrar-marca p { color: var(--giz-2); margin-top: 6px; }
.entrar-form { padding: 22px; border: 1px solid var(--linha); border-radius: 14px; background: var(--quadro); }
.entrar-form label { margin-top: 14px; }
.entrar-form label:first-of-type { margin-top: 0; }
.entrar-form h2 + p { color: var(--giz-2); margin: 6px 0 16px; }
.entrar-form .botao { width: 100%; margin-top: 20px; }
.nota { color: var(--giz-2); font-size: 0.85rem; margin-top: 14px; text-align: center; }

/* ---------- celular ---------- */
@media (max-width: 780px) {
  .app { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
  .lateral { position: static; height: auto; flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-right: 0; border-bottom: 1px solid var(--linha); }
  .nav { display: none; }
  .conta-botao { width: auto; padding: 4px 10px 4px 4px; border-radius: 999px; }
  .conteudo { padding: 24px 16px 96px; }
  .abas {
    display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 10;
    background: var(--quadro); border-top: 1px solid var(--linha);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .abas a { position: relative; flex-direction: column; gap: 2px; padding: 8px 0 7px; border-radius: 0; font-size: 0.62rem; letter-spacing: -0.01em; }
  .abas a[aria-current="page"] { color: var(--giz); box-shadow: inset 0 3px 0 var(--violeta); }
  .abas .novos { position: absolute; top: 4px; left: calc(50% + 6px); margin: 0; min-width: 18px; padding: 0 5px; font-size: 0.68rem; }
  .toasts { bottom: 78px; }
  .topo { margin-bottom: 20px; }
  .envio { grid-template-columns: minmax(0, 1fr) 70px; }
  .envio .meta { grid-column: 1 / -1; }
  .dialogo { padding: 20px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}


/* =================================================================== melhorias de 11/11/2026 */

/* ---------- cabecalho: botao Atualizar ---------- */
.topo-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.atualizar .icone { width: 18px; height: 18px; }
.atualizar.girando .icone { animation: girar 0.9s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }

/* ---------- inicio: conteudo + avisos recentes a direita ---------- */
.inicio { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 0 40px; align-items: start; }
.inicio-principal .bloco-regua { margin-top: 0; }
.inicio-lateral {
  position: sticky; top: 20px;
  padding: 18px 16px 16px; border: 1px solid var(--linha); border-radius: var(--raio); background: var(--quadro);
}
.lateral-topo { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.lateral-topo .mais { margin-top: 0; font-size: 0.9rem; }
.avisos-compactos { list-style: none; padding: 0; margin: 12px 0 14px; display: grid; gap: 6px; }
.aviso-compacto {
  display: grid; gap: 3px; width: 100%; padding: 9px 10px 9px 12px; text-align: left;
  background: var(--campo); border: 1px solid var(--linha); border-left: 3px solid var(--linha); border-radius: 8px;
  color: var(--giz); font: inherit; cursor: pointer;
}
.aviso-compacto:hover { border-color: var(--giz-2); }
.aviso-compacto.prova { border-left-color: var(--ambar); }
.aviso-compacto.trabalho { border-left-color: var(--anil); }
.aviso-compacto.entrega { border-left-color: var(--verde); }
.aviso-compacto.apresentacao { border-left-color: var(--rosa); }
.aviso-compacto.evento { border-left-color: var(--ciano); }
.aviso-compacto.horario { border-left-color: var(--violeta); }
.aviso-compacto.urgente { background: rgba(255, 200, 87, 0.09); border-color: rgba(255, 200, 87, 0.55); border-left: 3px solid var(--ambar); }
.ac-titulo { display: flex; align-items: center; gap: 8px; font-weight: 600; line-height: 1.3; }
.ac-titulo span { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.ac-meta { color: var(--giz-2); font-size: 0.8rem; display: flex; gap: 6px; }
.ac-meta strong { color: var(--ambar); }
.botao.largo { width: 100%; }

/* avisos urgentes nas listas */
.post.urgente { box-shadow: inset 3px 0 0 var(--ambar); padding-left: 12px; }
.chip-urgente { color: var(--noite); background: var(--ambar); }
.titulo-link { padding: 0; border: 0; background: none; color: var(--giz); font: inherit; text-align: left; cursor: pointer; }
.titulo-link:hover { color: var(--anil); text-decoration: underline; }
.trabalho-resumo { color: var(--giz); }
.alerta { color: var(--ambar); }

/* ---------- dialogos maiores e detalhes ---------- */
.dialogo.largo { width: min(640px, calc(100vw - 24px)); }
.detalhes { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 16px; margin: 14px 0 4px; }
.detalhes dt { color: var(--giz-2); font-size: 0.9rem; }
.detalhes dd { margin: 0; }
.detalhe-bloco { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--linha); }
.grupos { padding-left: 18px; margin: 8px 0; display: grid; gap: 4px; }
.campos-lado { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0 14px; }
.opcao { display: flex; align-items: center; gap: 9px; font-weight: 500; margin: 10px 0 0; cursor: pointer; }
.opcao input { width: 18px; height: 18px; accent-color: var(--violeta); flex: none; }
fieldset.integrantes { border: 1px solid var(--linha); border-radius: 8px; padding: 6px 14px 12px; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
fieldset.integrantes legend { font-weight: 600; font-size: 0.9rem; padding: 0 6px; }
fieldset.integrantes .dica { grid-column: 1 / -1; }
input[type="time"], input[type="number"] {
  width: 100%; padding: 10px 12px; border-radius: 8px; border: 1px solid var(--linha); background: var(--campo); color: var(--giz); font: inherit;
}

/* ---------- abas internas (Faltei) ---------- */
.abas-secao { display: flex; gap: 4px; border-bottom: 1px solid var(--linha); margin-bottom: 20px; overflow-x: auto; }
.abas-secao a { padding: 10px 14px; color: var(--giz-2); text-decoration: none; font-weight: 600; white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.abas-secao a:hover { color: var(--giz); }
.abas-secao a[aria-current="page"] { color: var(--giz); border-bottom-color: var(--violeta); }

/* ---------- frequencia ---------- */
.nota-oficial { padding: 10px 14px; border-radius: 8px; background: rgba(79, 168, 255, 0.1); border: 1px solid rgba(79, 168, 255, 0.35); color: var(--giz); font-size: 0.9rem; max-width: 80ch; }
.freq-barra-topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0 14px; }
.rotulo-inline { display: flex; align-items: center; gap: 10px; margin: 0; }
.rotulo-inline select { width: auto; min-width: 180px; }
.freq-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.freq-cartao { padding: 14px 16px; border: 1px solid var(--linha); border-radius: var(--raio); background: var(--quadro); }
.freq-cartao.atencao { border-color: rgba(255, 200, 87, 0.55); }
.freq-cartao.estourou { border-color: var(--rosa); }
.freq-cartao h3 { font-size: 1rem; }
.freq-numeros { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 12px 0 10px; }
.freq-numeros div { display: grid; gap: 2px; }
.freq-numeros dt { color: var(--giz-2); font-size: 0.78rem; }
.freq-numeros dd { margin: 0; font-size: 1.3rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.freq-barra { height: 7px; border-radius: 4px; background: var(--quadro-2); overflow: hidden; }
.freq-barra > i { display: block; height: 100%; width: var(--p, 0%); background: var(--verde); }
.atencao .freq-barra > i { background: var(--ambar); }
.estourou .freq-barra > i { background: var(--rosa); }
.historico { margin-top: 10px; }
.historico summary { cursor: pointer; color: var(--giz-2); font-weight: 600; font-size: 0.9rem; }
.historico ul { padding-left: 18px; margin: 6px 0 0; font-size: 0.85rem; color: var(--giz-2); display: grid; gap: 3px; }
.registros { list-style: none; padding: 0 !important; margin-top: 8px !important; }
.registro { padding: 8px 0; border-top: 1px solid var(--linha); color: var(--giz); font-size: 0.95rem; }
.registro.apagado > .registro-linha > :not(.chip) { text-decoration: line-through; opacity: 0.6; }
.registro-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.tabela-rolagem { overflow-x: auto; margin-top: 10px; }
.tabela-turma { border-collapse: collapse; min-width: 100%; font-size: 0.9rem; }
.tabela-turma caption { text-align: left; color: var(--giz-2); padding-bottom: 8px; }
.tabela-turma th, .tabela-turma td { padding: 8px 10px; border-bottom: 1px solid var(--linha); text-align: left; white-space: nowrap; }
.tabela-turma thead th { color: var(--giz-2); font-weight: 600; font-size: 0.82rem; white-space: normal; min-width: 90px; vertical-align: bottom; }
.tabela-turma td { font-variant-numeric: tabular-nums; }
.tabela-turma td.atencao { color: var(--ambar); font-weight: 700; }
.tabela-turma td.estourou { color: var(--rosa); font-weight: 700; }
.tabela-turma tr.atual th, .tabela-turma tr.atual td { background: var(--quadro-2); }
.tabela-turma td input { min-width: 90px; }

/* ---------- calendario ---------- */
.cal-barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.cal-nav { display: flex; gap: 4px; }
.cal-nav .botao { font-size: 1rem; padding: 6px 12px; }
.cal-titulo { margin: 16px 0 10px; font-size: 1.25rem; }
.cal-mes { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; background: var(--quadro); }
.cal-cab { padding: 8px 10px; font-size: 0.8rem; color: var(--giz-2); border-bottom: 1px solid var(--linha); }
.cal-dia { position: relative; min-height: 104px; padding: 30px 5px 6px; border-top: 1px solid var(--linha); border-left: 1px solid var(--linha); }
.cal-dia:nth-child(7n + 1) { border-left: 0; }
.cal-mes > .cal-dia:nth-child(-n + 14) { border-top: 0; }
.cal-dia.fora { background: var(--escuro); }
.cal-dia.fora .cal-num { color: #6e6c97; }
.cal-num { position: absolute; inset: 0; display: block; padding: 6px 8px; text-align: left; vertical-align: top; background: none; border: 0; color: var(--giz); font: inherit; font-weight: 700; font-variant-numeric: tabular-nums; cursor: pointer; }
.cal-num:hover { background: rgba(255, 255, 255, 0.03); }
.cal-dia.hoje .cal-num { color: var(--violeta); }
.cal-dia.hoje { box-shadow: inset 0 3px 0 var(--violeta); }
.cal-dia.selecionado { background: var(--quadro-2); }
.cal-evs { position: relative; z-index: 1; display: grid; gap: 3px; pointer-events: none; }
.cal-evs > * { pointer-events: auto; }
.cal-dia .marcas { display: none; }
.cal-mais { font-size: 0.75rem; color: var(--giz-2); padding-left: 4px; }
.ev {
  display: flex; gap: 5px; align-items: baseline; width: 100%; padding: 2px 6px; border-radius: 5px;
  border: 0; border-left: 3px solid var(--giz-2); background: var(--quadro-2); color: var(--giz);
  font: inherit; font-size: 0.78rem; line-height: 1.35; text-align: left; cursor: pointer; overflow: hidden;
}
.ev:hover { filter: brightness(1.2); }
.ev-titulo { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ev-hora { color: var(--giz-2); font-variant-numeric: tabular-nums; }
.ev.prova { border-left-color: var(--ambar); }
.ev.trabalho { border-left-color: var(--anil); }
.ev.entrega { border-left-color: var(--verde); }
.ev.apresentacao { border-left-color: var(--rosa); }
.ev.evento { border-left-color: var(--ciano); }
.ev.horario { border-left-color: var(--violeta); }
.ev.urgente { background: rgba(255, 200, 87, 0.16); }
.cal-semana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.sem-dia { min-height: 180px; padding: 10px 8px; border: 1px solid var(--linha); border-radius: var(--raio); background: var(--quadro); display: flex; flex-direction: column; gap: 8px; }
.sem-dia h2 { font-size: 0.95rem; }
.sem-dia .sem { color: var(--giz-2); font-weight: 600; text-transform: capitalize; }
.sem-dia.hoje { border-color: var(--violeta); }
.sem-dia .ev-titulo { white-space: normal; }
.sem-dia .mini { margin-top: auto; align-self: flex-start; font-size: 0.8rem; padding: 3px 6px; }
.legenda { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 16px; color: var(--giz-2); font-size: 0.85rem; }
.legenda li { display: flex; align-items: center; gap: 7px; }
.proximos > .bloco:first-child { margin-top: 6px; }

/* ---------- chat ---------- */
.chat { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 20px; align-items: start; }
.chat-canais ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 2px; }
.chat-canais a { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 8px; color: var(--giz-2); text-decoration: none; font-weight: 600; font-size: 0.92rem; }
.chat-canais a:hover { background: var(--quadro-2); color: var(--giz); }
.chat-canais a[aria-current="page"] { background: var(--quadro-2); color: var(--giz); box-shadow: inset 3px 0 0 var(--violeta); }
.chat-escolha { display: none; }
.chat-conversa { display: flex; flex-direction: column; border: 1px solid var(--linha); border-radius: var(--raio); background: var(--quadro); height: calc(100vh - 210px); height: calc(100dvh - 210px); min-height: 380px; }
.chat-titulo { padding: 12px 16px; border-bottom: 1px solid var(--linha); font-size: 1rem; }
.chat-mensagens { list-style: none; margin: 0; padding: 10px 16px; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.chat-dia { align-self: center; margin: 12px 0 6px; padding: 2px 12px; border-radius: 999px; background: var(--quadro-2); color: var(--giz-2); font-size: 0.78rem; }
.chat-msg { max-width: min(640px, 85%); align-self: flex-start; padding: 6px 12px 7px; margin-top: 8px; border-radius: 4px 12px 12px 12px; background: var(--quadro-2); }
.chat-msg.seguida { margin-top: 2px; border-radius: 12px; }
.chat-msg.minha { align-self: flex-end; background: rgba(143, 123, 255, 0.24); border-radius: 12px 4px 12px 12px; }
.chat-msg.minha.seguida { border-radius: 12px; }
.chat-autor { font-size: 0.8rem; color: var(--giz-2); margin-bottom: 2px; }
.chat-autor strong { color: var(--giz); }
.chat-texto { white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-mensagens .vazio { align-self: center; margin: auto 0; }
.chat-compor { display: flex; gap: 10px; align-items: flex-end; padding: 12px; border-top: 1px solid var(--linha); }
.chat-compor textarea { flex: 1; min-height: 44px; max-height: 160px; }

/* ---------- materiais: exportar ---------- */
.botao.exportar .icone { width: 18px; height: 18px; }
.progresso.largo { display: block; height: 8px; margin: 12px 0 6px; }

/* ---------- telas medias ---------- */
@media (max-width: 1100px) {
  .inicio { grid-template-columns: minmax(0, 1fr); }
  .inicio-lateral { position: static; order: -1; margin-bottom: 24px; }
  .cal-semana { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

@media (max-width: 780px) {
  .topo-acoes .atualizar span { display: none; }
  .cal-dia { min-height: 54px; padding: 26px 2px 4px; }
  .cal-cab { padding: 6px 4px; text-align: center; }
  .cal-num { padding: 4px 0; text-align: center; font-size: 0.9rem; }
  .cal-evs { display: none; }
  .cal-dia .marcas { display: flex; position: relative; justify-content: center; gap: 3px; margin: 0; min-height: 0; pointer-events: none; }
  .cal-dia .marcas .forma { width: 7px; height: 7px; }
  .chat { grid-template-columns: minmax(0, 1fr); }
  .chat-canais { display: none; }
  .chat-escolha { display: block; margin: 0; border: 0; border-bottom: 1px solid var(--linha); border-radius: var(--raio) var(--raio) 0 0; background: var(--quadro-2); }
  .chat-titulo { display: none; }
  .chat-conversa { height: calc(100dvh - 260px); min-height: 320px; }
  .chat-msg { max-width: 92%; }
  .freq-grade { grid-template-columns: minmax(0, 1fr); }
  .detalhes { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .detalhes dd { margin-bottom: 8px; }
}

/* ---------- marca: foto + nome ---------- */
.marca img, .entrar-marca img { border-radius: 50%; object-fit: cover; flex: none; border: 2px solid var(--quadro-2); }
.marca-texto { display: grid; line-height: 1.15; }
.marca-texto small { font-size: 0.72rem; font-weight: 600; color: var(--giz-2); letter-spacing: 0.01em; }
.marca-texto strong { font-size: 0.98rem; letter-spacing: 0.02em; }
.entrar-marca h1 small { display: block; font-size: 1rem; font-weight: 600; color: var(--giz-2); letter-spacing: 0; }
