/* ============================================================
   Apostilas GPT-2 / RoBERTa  —  folha de estilo de impressao
   Renderizada por Chrome headless --print-to-pdf
   ============================================================ */

@page {
  size: A4;
  margin: 20mm 18mm 22mm 18mm;
}
@page :first { margin-top: 0; }

/* ---------------------------------------------------------------------------
   A COR DA CAPA TEM SIGNIFICADO. Cada apostila declara `--brand` no <body>, e
   a escolha nao e decorativa — ela diz de que familia o capitulo trata. Quem
   escrever um capitulo novo escolhe pela tabela abaixo, nao pelo gosto.

     var(--gpt)    verde-petroleo   familia GPT / decoder
                                    (e o padrao: capitulo sem `--brand` cai aqui)
     var(--rob)    terracota        familia BERT / encoder
     var(--ink-2)  cinza            capitulo meta — mapa, comparacao entre as
                                    duas familias, servir, laboratorio, fecho
     var(--ante)   ambar            colecao Antevisao, do primeiro ao ultimo

   O ambar do Antevisao e o irmao escuro do #e8a06a que o site usa na tela:
   mesma familia de cor em papel e em tela, para a colecao ter uma marca so.
   --------------------------------------------------------------------------- */
:root{
  --ink:      #14161a;
  --ink-2:    #4a5058;   /* cinza: capitulo meta                   */
  --paper:      #ffffff;
  --rule:      #d9dde3;
  --gpt:        #0b6b5e;   /* verde-petroleo: familia GPT / decoder */
  --rob:        #8a3d12;   /* terracota: familia BERT / encoder     */
  --ante:       #9a5a1e;   /* ambar: colecao Antevisao              */
  --alert:     #8c2f39;
  --box-bg:#f6f7f9;
  --code-bg:  #1c1f26;
}

*{ box-sizing: border-box; }

body{
  font-family: "Charter","Bitstream Charter","Georgia","Cambria",serif;
  font-size: 10.7pt;
  line-height: 1.62;
  color: var(--ink);
  background: var(--paper);
  margin: 0;
  text-align: justify;
  hyphens: auto;
  -webkit-hyphens: auto;
}

/* ---------- capa ---------- */
.capa{
  height: 297mm;
  padding: 42mm 24mm 24mm 24mm;
  display: flex;
  flex-direction: column;
  page-break-after: always;
  border-top: 9mm solid var(--brand, var(--gpt));
}
.capa .colecao{
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 8.5pt; letter-spacing: .22em; text-transform: uppercase;
  color: var(--ink-2); margin-bottom: 4mm;
}
.capa .numero{
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 64pt; font-weight: 200; line-height: .9;
  color: var(--brand, var(--gpt)); margin-bottom: 6mm;
}
.capa h1{
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 27pt; font-weight: 650; line-height: 1.14;
  margin: 0 0 5mm 0; letter-spacing: -.015em; text-align: left;
}
.capa .subtitulo{
  font-size: 13pt; color: var(--ink-2); font-style: italic;
  line-height: 1.45; text-align: left; margin: 0;
  max-width: 130mm;
}
.capa .rodape-capa{
  margin-top: auto;
  border-top: 1px solid var(--rule);
  padding-top: 4mm;
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 8.5pt; color: var(--ink-2);
  display: flex; justify-content: space-between;
  text-align: left;
}

/* ---------- hierarquia ---------- */
h2{
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 16pt; font-weight: 640; letter-spacing: -.01em;
  color: var(--brand, var(--gpt));
  margin: 11mm 0 3mm 0; padding-bottom: 2mm;
  border-bottom: 2px solid var(--brand, var(--gpt));
  text-align: left;
  page-break-after: avoid;
}
h2:first-of-type{ margin-top: 0; }
h2 .cap{
  font-weight: 300; opacity: .55; margin-right: 3mm;
}
h3{
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 11.8pt; font-weight: 620; color: var(--ink);
  margin: 7mm 0 2mm 0; text-align: left;
  page-break-after: avoid;
}
h4{
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 10pt; font-weight: 640; color: var(--ink-2);
  text-transform: uppercase; letter-spacing: .06em;
  margin: 5mm 0 1.5mm 0; text-align: left;
  page-break-after: avoid;
}
p{ margin: 0 0 3.2mm 0; orphans: 3; widows: 3; }
strong{ font-weight: 700; }
em{ font-style: italic; }

a{ color: var(--brand, var(--gpt)); text-decoration: none; }

/* ---------- listas ---------- */
ul,ol{ margin: 0 0 3.5mm 0; padding-left: 6mm; }
li{ margin-bottom: 1.4mm; }
li::marker{ color: var(--brand, var(--gpt)); }

/* ---------- caixas pedagogicas ---------- */
.caixa{
  border: 1px solid var(--rule);
  border-left: 3.5px solid var(--brand, var(--gpt));
  background: var(--box-bg);
  padding: 4mm 5mm 2.5mm 5mm;
  margin: 4.5mm 0;
  page-break-inside: avoid;
  border-radius: 0 2px 2px 0;
}
.caixa .rotulo{
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 7.6pt; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: var(--brand, var(--gpt));
  display: block; margin-bottom: 2mm;
}
.caixa p:last-child{ margin-bottom: 1mm; }
.caixa.analogia{ --brand: #6b4c9a; }
.caixa.atencao { --brand: #8c2f39; background: #fdf6f6; }
.caixa.chave   { --brand: #b5860b; background: #fdfaf0; }

/* ---------- matematica (sem KaTeX: 100% offline) ---------- */
.eq{
  display: block; text-align: center;
  font-family: "Cambria Math","Latin Modern Math","Georgia",serif;
  font-size: 12.5pt; margin: 5mm 0; padding: 1mm 0;
  page-break-inside: avoid;
}
.eq .nota{
  display: block; font-family: ui-sans-serif,"Segoe UI",sans-serif;
  font-size: 8.2pt; color: var(--ink-2); margin-top: 2mm; font-style: normal;
}
v{ font-family: "Cambria Math","Georgia",serif; font-style: italic; }
.op{ font-style: normal; padding: 0 .12em; }
.frac{
  display: inline-block; vertical-align: -0.55em;
  text-align: center; margin: 0 .25em;
}
.frac > span{ display: block; padding: 0 .35em; }
.frac .num{ border-bottom: 1.1px solid #14161a; padding-bottom: .06em; }
.frac .den{ padding-top: .06em; }
.rad{ border-top: 1.1px solid #14161a; padding: .06em .18em 0 .18em; }

/* ---------- codigo ---------- */
pre{
  background: var(--code-bg);
  color: #e6e9ef;
  font-family: "Cascadia Mono","Consolas","DejaVu Sans Mono",monospace;
  font-size: 8.3pt; line-height: 1.5;
  padding: 3.5mm 4mm; margin: 4mm 0;
  border-radius: 3px;
  white-space: pre-wrap; word-wrap: break-word;
  text-align: left;
  page-break-inside: avoid;
  tab-size: 2;
}
pre.saida{
  background: #f2f3f5; color: #2a2e35;
  border: 1px solid var(--rule); border-left: 3.5px solid var(--ink-2);
}
pre .c{ color: #7f8ea3; font-style: italic; }
pre .k{ color: #ff9ec4; }
pre .s{ color: #a5e0a5; }
pre .n{ color: #ffcf8a; }
pre .f{ color: #8ecbff; }
code{
  font-family: "Cascadia Mono","Consolas",monospace;
  font-size: .87em; background: #eceef2;
  padding: .08em .34em; border-radius: 2.5px;
  word-break: break-word;
}
h3 code, li code, td code{ font-size: .85em; }

/* ---------- tabelas ---------- */
table{
  width: 100%; border-collapse: collapse;
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 8.7pt; margin: 4mm 0;
  page-break-inside: avoid;
}
caption{
  caption-side: bottom; font-size: 8pt; color: var(--ink-2);
  text-align: left; padding-top: 2mm; font-style: italic;
}
th{
  background: var(--brand, var(--gpt)); color: #fff;
  font-weight: 600; text-align: left;
  padding: 2.2mm 2.5mm; font-size: 8.4pt;
}
td{
  padding: 2mm 2.5mm; border-bottom: 1px solid var(--rule);
  vertical-align: top;
}
tbody tr:nth-child(even){ background: #fafbfc; }
td.num, th.num{ text-align: right; font-variant-numeric: tabular-nums; }
.sim{ color: #0b6b5e; font-weight: 700; }
.nao{ color: #8c2f39; font-weight: 700; }

/* ---------- figuras / diagramas ---------- */
figure{
  margin: 5mm 0; text-align: center;
  page-break-inside: avoid;
}
figure svg{ max-width: 100%; height: auto; }
figcaption{
  font-family: ui-sans-serif,"Segoe UI",system-ui,sans-serif;
  font-size: 8pt; color: var(--ink-2);
  margin-top: 2.5mm; text-align: left; line-height: 1.45;
}
figcaption b{ color: var(--ink); }

/* ---------- exercicio final ---------- */
.exercicio{
  border: 1.5px dashed var(--brand, var(--gpt));
  background: #fff;
  padding: 4mm 5mm; margin: 6mm 0 0 0;
  page-break-inside: avoid;
}
.exercicio h4{ margin-top: 0; color: var(--brand, var(--gpt)); }

/* ---------- utilidades ---------- */
.quebra{ page-break-before: always; }
.nao-quebrar{ page-break-inside: avoid; }
.centro{ text-align: center; }
hr{ border: none; border-top: 1px solid var(--rule); margin: 6mm 0; }
.legenda-cor{
  display: inline-block; width: 8px; height: 8px;
  border-radius: 2px; margin-right: 1.5mm; vertical-align: middle;
}
