:root {
  --azul: #1f4e78;
  --azul-claro: #eaf1f8;
  --texto: #1a1a1a;
  --suave: #5a6672;
  --borda: #c9d3dc;
  --fundo: #f6f8fa;
  --ok: #1d7a3f;
  --alerta: #8a5a00;
  --erro: #b3261e;
}
@media (prefers-color-scheme: dark) {
  :root { --azul: #7fb0dc; --azul-claro: #1c2a38; --texto: #e8edf2; --suave: #9aa8b5; --borda: #33424f; --fundo: #11181f; --ok: #5fcf8a; --alerta: #e0b04a; --erro: #ff8a80; }
  input, select, textarea { background: #0d1318; color: var(--texto); }
  button { color: #0b1620; }
}
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.5 system-ui, "Segoe UI", sans-serif; color: var(--texto); background: var(--fundo); }
header { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; padding: 10px 16px; background: var(--azul-claro); border-bottom: 1px solid var(--borda); }
header nav { display: flex; gap: 6px; flex: 1; flex-wrap: wrap; }
header nav a { padding: 4px 10px; border-radius: 6px; color: var(--azul); text-decoration: none; }
header nav a.ativo { background: var(--azul); color: #fff; }
#usuario { color: var(--suave); font-size: 14px; }
#aviso-ambiente { background: #fff4d6; color: var(--alerta); text-align: center; padding: 4px 16px; font-size: 14px; }
@media (prefers-color-scheme: dark) { #aviso-ambiente { background: #2a2210; } }
main { max-width: 1000px; margin: 0 auto; padding: 16px; }
h1 { font-size: 1.5rem; color: var(--azul); margin: 8px 0 12px; }
h2 { font-size: 1.15rem; color: var(--azul); margin: 20px 0 8px; }
.cartao { background: var(--fundo); border: 1px solid var(--borda); border-radius: 10px; padding: 14px 16px; margin: 12px 0; }
.estreito { max-width: 420px; margin: 40px auto; }
label { display: block; font-size: 14px; color: var(--suave); margin: 10px 0 2px; }
input, select, textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--borda); border-radius: 6px; font: inherit; }
textarea { min-height: 160px; }
.grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 14px; }
button, .botao { display: inline-block; margin: 10px 6px 0 0; padding: 8px 16px; border: 0; border-radius: 6px; background: var(--azul); color: #fff; font: inherit; cursor: pointer; text-decoration: none; }
button.secundario { background: transparent; color: var(--azul); border: 1px solid var(--azul); }
button.perigo { background: var(--erro); }
button:disabled { opacity: .5; cursor: not-allowed; }
table { width: 100%; border-collapse: collapse; margin: 8px 0; font-size: 15px; }
th, td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--borda); vertical-align: top; }
th { color: var(--suave); font-weight: 600; }
.tabela-rolagem { overflow-x: auto; }
.msg { padding: 8px 12px; border-radius: 6px; margin: 10px 0; }
.msg.erro { background: #fdecea; color: var(--erro); }
.msg.ok { background: #e6f4ea; color: var(--ok); }
.msg.aviso { background: #fff4d6; color: var(--alerta); }
@media (prefers-color-scheme: dark) { .msg.erro { background: #3a1613; } .msg.ok { background: #12301d; } .msg.aviso { background: #2a2210; } }
.selo { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 13px; border: 1px solid var(--borda); }
.selo.concluida { color: var(--ok); border-color: var(--ok); }
.selo.em_andamento, .selo.reaberta { color: var(--alerta); border-color: var(--alerta); }
.selo.bloqueada { color: var(--suave); }
.miudo { color: var(--suave); font-size: 14px; }
.link-copiavel { word-break: break-all; font-family: Consolas, monospace; font-size: 13px; }
a { color: var(--azul); }
.duas-colunas { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0 16px; }
.texto-longo { white-space: pre-wrap; }
textarea.grande { min-height: 220px; }
.texto-rico p { margin: 6px 0; }
.caixa { width: auto; margin-right: 6px; }
label:has(> .caixa) { color: var(--texto); font-size: 15px; margin: 6px 0; }
.linha-do-tempo { list-style: none; padding: 0; margin: 8px 0; }
.linha-do-tempo li { padding: 6px 10px; border-left: 3px solid var(--borda); margin: 6px 0; }
.linha-do-tempo li.docente { border-left-color: var(--azul); background: var(--azul-claro); }