:root { --azul: #12355b; --azul-claro: #e8eef6; --borda: #c9d3df; --texto: #1c2430; --aviso: #b3261e; --ok: #1b6e3c; }
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, Arial, sans-serif; color: var(--texto); background: #f5f7fa; }
header.topo { background: var(--azul); color: #fff; padding: 14px 16px; text-align: center; }
header.topo h1 { margin: 0; font-size: 1.05rem; letter-spacing: .5px; }
header.topo p { margin: 4px 0 0; font-size: .85rem; opacity: .85; }
main { max-width: 1000px; margin: 0 auto; padding: 14px; }
.nav-semana { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.nav-semana .titulo { text-align: center; font-weight: 600; }
.nav-semana .titulo small { display: block; font-weight: 400; color: #55657a; }
.btn { background: #fff; border: 1px solid var(--borda); border-radius: 8px; padding: 8px 12px;
       text-decoration: none; color: var(--azul); font-size: .9rem; white-space: nowrap; }
.btn:hover { background: var(--azul-claro); }
.faixa { padding: 8px 12px; border-radius: 8px; text-align: center; font-weight: 600; margin-bottom: 12px; }
.faixa.previa { background: #fff4d6; color: #7a5300; border: 1px solid #f0d58a; }
.faixa.assinada { background: #e0f3e8; color: var(--ok); border: 1px solid #a8d8bb; }
.faixa.encerrada { background: #eceff3; color: #55657a; border: 1px solid var(--borda); }
.rolagem { overflow-x: auto; background: #fff; border: 1px solid var(--borda); border-radius: 8px; }
table.previa { border-collapse: collapse; width: 100%; min-width: 640px; font-size: .9rem; }
table.previa th, table.previa td { border-bottom: 1px solid var(--borda); padding: 8px 10px; text-align: left; }
table.previa thead th { background: var(--azul); color: #fff; font-weight: 600; }
table.previa td.dia { background: var(--azul-claro); white-space: nowrap; font-weight: 600; }
table.previa td.dia small { display: block; font-weight: 400; color: #55657a; }
table.previa tr.vermelho td.dia { background: #fde7e5; }
table.previa tr.hoje td { box-shadow: inset 0 0 0 2px #f0b429; }
td.vazio { color: #9aa7b8; }
.erro { background: #fde7e5; color: var(--aviso); border: 1px solid #f3b7b2; padding: 10px 12px; border-radius: 8px; }
.rodape { text-align: center; color: #7a8798; font-size: .8rem; margin-top: 16px; }