/* Manuais do Calendário CIAM 5787 — mesma paleta e tipografia do app */
:root {
  --verde-esc:#33443c; --roxo:#210b50; --verde-med:#81a969; --verde-claro:#f3fadc;
  --ouro:#D4AF37; --bg:#e6ecda; --papel:#fafdf3; --sup:#fff; --texto:#2c3a31; --nota:#76856e;
  --borda:rgba(122,138,112,.30); --head:#EBE9EF;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --verde-esc:#dfe7d8; --roxo:#cfc2f0; --verde-med:#3f5a34; --verde-claro:#26301f;
    --ouro:#E3C05A; --bg:#141a14; --papel:#1a211a; --sup:#1d241c; --texto:#dfe7d8; --nota:#93a08c;
    --borda:rgba(180,196,160,.22); --head:#232a22;
  }
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--texto); font-family:'Oswald', system-ui, sans-serif;
  font-weight:300; font-size:16px; line-height:1.6; }
a { color:var(--roxo); }
.pagina { max-width:880px; margin:0 auto; padding:18px 18px 60px; }
header.topo { background:var(--head); border-radius:16px; padding:18px 22px; display:flex; align-items:center;
  gap:16px; flex-wrap:wrap; margin-bottom:22px; }
header.topo img { height:58px; }
header.topo h1 { font-family:'Frank Ruhl Libre', Georgia, serif; font-weight:700; font-size:clamp(24px,5vw,36px);
  color:var(--verde-esc); margin:0; line-height:1.05; }
header.topo .sub { font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:var(--ouro); font-weight:500; }
header.topo .abrir { margin-left:auto; }
.bt { display:inline-flex; align-items:center; gap:6px; min-height:42px; padding:0 16px; border-radius:10px;
  background:var(--roxo); color:#fff; text-decoration:none; font-weight:500; letter-spacing:.3px; }
.bt.sec { background:transparent; color:var(--verde-esc); border:1px solid var(--borda); }
nav.indice { background:var(--sup); border:1px solid var(--borda); border-radius:14px; padding:14px 18px; margin-bottom:22px; }
nav.indice b { display:block; font-size:11px; letter-spacing:1.2px; text-transform:uppercase; color:var(--ouro); margin-bottom:6px; }
nav.indice ol { margin:0; padding-left:20px; columns:2; column-gap:24px; }
nav.indice li { break-inside:avoid; margin:2px 0; }
nav.indice a { text-decoration:none; }
section { background:var(--papel); border:1px solid var(--borda); border-radius:14px; padding:18px 22px; margin-bottom:16px; }
section h2 { font-family:'Frank Ruhl Libre', Georgia, serif; font-weight:700; color:var(--verde-esc); font-size:24px;
  margin:0 0 10px; display:flex; align-items:baseline; gap:10px; }
section h2 .n { font-family:'Oswald', sans-serif; font-weight:600; font-size:13px; color:var(--ouro); letter-spacing:1px; }
section h3 { font-size:14px; letter-spacing:.8px; text-transform:uppercase; color:var(--ouro); font-weight:600; margin:18px 0 6px; }
p { margin:0 0 10px; max-width:70ch; }
ul, ol { margin:0 0 10px; padding-left:22px; max-width:70ch; }
li { margin:3px 0; }
.dica { border-left:3px solid var(--ouro); background:rgba(212,175,55,.10); padding:8px 12px; border-radius:0 9px 9px 0; margin:10px 0; max-width:70ch; }
.atencao { border-left-color:#b4443c; background:rgba(180,68,60,.10); }
.ui { display:inline-block; border:1px solid var(--borda); background:var(--sup); border-radius:7px; padding:1px 8px;
  font-size:13px; font-weight:500; white-space:nowrap; vertical-align:baseline; }
.ui.roxo { background:var(--roxo); color:#fff; border-color:var(--roxo); }
.ui.ouro { background:var(--ouro); color:#1f2c23; border-color:var(--ouro); }
.tab { width:100%; border-collapse:collapse; font-size:14px; margin:8px 0 12px; }
.tab th, .tab td { text-align:left; padding:7px 9px; border-bottom:1px solid var(--borda); vertical-align:top; }
.tab th { font-size:11px; letter-spacing:.8px; text-transform:uppercase; color:var(--ouro); font-weight:600; }
.tab-cx { overflow-x:auto; }
.cores { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:8px; margin:8px 0 12px; }
.cor { display:flex; align-items:center; gap:10px; font-size:14px; }
.cor i { width:34px; height:24px; border-radius:5px; border:1px solid var(--borda); flex:0 0 auto; }
.barra-fc { height:4px; width:34px; border-radius:2px; display:inline-block; vertical-align:middle; }
.passos { counter-reset:p; list-style:none; padding:0; }
.passos li { counter-increment:p; position:relative; padding-left:34px; margin:6px 0; }
.passos li::before { content:counter(p); position:absolute; left:0; top:0; width:24px; height:24px; border-radius:50%;
  background:var(--roxo); color:#fff; font-size:12px; font-weight:600; display:flex; align-items:center; justify-content:center; }
.fluxo { font-family:ui-monospace, Consolas, monospace; font-size:12.5px; background:var(--sup); border:1px solid var(--borda);
  border-radius:9px; padding:10px 12px; overflow-x:auto; white-space:pre; margin:8px 0 12px; }
.selo { display:inline-block; font-size:10px; letter-spacing:.5px; text-transform:uppercase; padding:1px 7px; border-radius:7px;
  background:rgba(122,138,112,.16); color:var(--verde-esc); font-weight:600; }
.selo.ag { background:rgba(212,175,55,.28); color:#6b5210; }
.selo.dv { background:rgba(180,60,60,.16); color:#9a3a3a; }
.selo.pb { background:rgba(129,169,105,.28); color:#2f5a25; }
footer { text-align:center; font-size:12px; color:var(--nota); margin-top:24px; }
@media (max-width:600px) { nav.indice ol { columns:1; } section { padding:14px 16px; } .pagina { padding:12px 12px 50px; } }
@media print { body { background:#fff; } section, nav.indice, header.topo { border:none; box-shadow:none; page-break-inside:avoid; } .abrir { display:none; } }
