:root{
  --blue:#0c3c7c;--blue-dark:#082a56;--blue-deep:#061f40;--gold:#f7a81b;
  --ink:#10233d;--paper:#fff;--mist:#eef4f8;--warm:#fffaf0;--danger:#c83a3a;
  --shadow:0 18px 55px rgba(2,24,49,.22);
  --borda:#d7e2ec;
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family:"Segoe UI",Arial,sans-serif;
  color:var(--ink);
  background:var(--mist);
  line-height:1.5;
  -webkit-text-size-adjust:100%;
}

a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}

.topo{
  background:var(--blue-deep);
  color:#fff;
  padding:14px 18px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.topo img{height:34px;width:auto;display:block}
.topo .marca{font-weight:700;letter-spacing:-.01em;font-size:15px}
.topo nav{margin-left:auto;display:flex;flex-wrap:wrap;gap:14px;align-items:center;font-size:14px}
.topo nav a{color:#cfe0f5}
.topo nav a:hover,.topo nav a[aria-current="page"]{color:#fff}

.conteudo{max-width:960px;margin:0 auto;padding:24px 18px 64px}

h1{font-size:26px;letter-spacing:-.02em;margin:0 0 6px}
.subtitulo{color:#5b7391;margin:0 0 24px;font-size:15px}

.cartao{
  background:var(--paper);
  border:1px solid var(--borda);
  border-radius:12px;
  padding:18px;
  margin-bottom:14px;
}

.lista-reunioes{display:grid;gap:14px}
.reuniao{
  background:var(--paper);
  border:1px solid var(--borda);
  border-radius:12px;
  padding:16px 18px;
  display:grid;
  gap:8px;
}
.reuniao .numero{
  color:var(--gold);
  font-weight:700;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.reuniao h2{margin:0;font-size:19px;letter-spacing:-.01em}
.reuniao .meta{color:#5b7391;font-size:14px;margin:0}
.reuniao .acoes{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.rascunho{
  display:inline-block;
  background:var(--warm);
  border:1px solid #f0d9a8;
  color:#8a6a1f;
  font-size:12px;
  border-radius:99px;
  padding:2px 10px;
}

.botao{
  display:inline-block;
  background:var(--blue);
  color:#fff;
  border:1px solid var(--blue);
  border-radius:8px;
  padding:9px 16px;
  font-size:14px;
  font-family:inherit;
  cursor:pointer;
}
.botao:hover{background:var(--blue-dark);text-decoration:none;color:#fff}
.botao.secundario{background:transparent;color:var(--blue)}
.botao.secundario:hover{background:var(--mist);color:var(--blue-dark)}
.botao.perigo{background:var(--danger);border-color:var(--danger)}
.botao.perigo:hover{background:#a92f2f}

.campo{display:grid;gap:6px;margin-bottom:14px}
.campo label{font-size:13px;font-weight:600}
.campo input,.campo select{
  font-family:inherit;
  font-size:15px;
  padding:10px 12px;
  border:1px solid var(--borda);
  border-radius:8px;
  background:#fff;
  color:var(--ink);
}
.campo input:focus,.campo select:focus{outline:2px solid var(--gold);outline-offset:1px}
.campo small{color:#5b7391;font-size:12px}

.aviso{
  border-radius:8px;
  padding:11px 14px;
  margin-bottom:16px;
  font-size:14px;
  border:1px solid;
}
.aviso.erro{background:#fdf2f2;border-color:#f0c4c4;color:#8f2626}
.aviso.ok{background:#f1f8f2;border-color:#c3e2c8;color:#1f6130}

.entrada{max-width:380px;margin:8vh auto;padding:0 18px}
.entrada .cartao{padding:24px}
.entrada .marca{text-align:center;margin-bottom:18px}
.entrada .marca img{height:52px;width:auto}

table.tabela{width:100%;border-collapse:collapse;font-size:14px;background:#fff}
table.tabela th,table.tabela td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--borda)}
table.tabela th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#5b7391}

.vazio{color:#5b7391;background:var(--paper);border:1px dashed var(--borda);border-radius:12px;padding:28px;text-align:center}

@media (min-width:640px){
  .conteudo{padding:32px 24px 72px}
  h1{font-size:30px}
  .reuniao{grid-template-columns:1fr auto;align-items:center}
  .reuniao .acoes{grid-column:2;grid-row:1 / span 3;margin:0}
}