/* Tema do livro: a mesma identidade do manifesto.
   Os temas do mdBook são reaproveitados: light = Papel, rust = Sépia, coal = Noite. */
@import url("https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400..800&family=Source+Serif+4:ital,opsz,wght@0,8..60,400..700;1,8..60,400..600&display=swap");

:root {
    --content-max-width: 760px;
    --sidebar-target-width: 290px;
    --display: "Bricolage Grotesque", "Helvetica Neue", Arial, sans-serif;
    --texto: "Source Serif 4", Georgia, "Times New Roman", serif;
    --marca: #F5E04A;
}

/* ---------- Papel (e-ink) ---------- */
.light, html:not(.js) {
    --bg: #E9E8E3;
    --fg: #24262B;
    --apagado: #64666D;
    --grao: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.1 0 0 0 0 0.1 0 0 0 0 0.08 0 0 0 0.5 -0.19'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");

    --sidebar-bg: #E1E0DA;
    --sidebar-fg: #3A3C42;
    --sidebar-non-existant: #8D8F96;
    --sidebar-active: #24262B;
    --sidebar-spacer: #CFCDC6;
    --sidebar-header-border-color: #CFCDC6;
    --scrollbar: #A9A8A2;
    --icons: #7A7C83;
    --icons-hover: #24262B;
    --links: #24262B;
    --inline-code-color: #3A3C42;
    --theme-popup-bg: #F1F0EC;
    --theme-popup-border: #CFCDC6;
    --theme-hover: #E1E0DA;
    --quote-bg: #E1E0DA;
    --quote-border: #CFCDC6;
    --warning-border: #B07A12;
    --table-border-color: #CFCDC6;
    --table-header-bg: transparent;
    --table-alternate-bg: transparent;
    --searchbar-border-color: #CFCDC6;
    --searchbar-bg: #F1F0EC;
    --searchbar-fg: #24262B;
    --searchbar-shadow-color: #CFCDC6;
    --searchresults-header-fg: #64666D;
    --searchresults-border-color: #CFCDC6;
    --searchresults-li-bg: #E1E0DA;
    --search-mark-bg: var(--marca);
    --footnote-highlight: var(--marca);
    --overlay-bg: rgba(36, 38, 43, 0.3);
    --color-scheme: light;
}

/* ---------- Sépia ---------- */
.rust {
    --bg: #F2E8D3;
    --fg: #3A2F24;
    --apagado: #7B6B57;
    --grao: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.3 0 0 0 0 0.2 0 0 0 0 0.1 0 0 0 0.5 -0.16'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");

    --sidebar-bg: #EADFC6;
    --sidebar-fg: #4A3D2F;
    --sidebar-non-existant: #A8967D;
    --sidebar-active: #3A2F24;
    --sidebar-spacer: #DCCDB0;
    --sidebar-header-border-color: #DCCDB0;
    --scrollbar: #C2B193;
    --icons: #8C7B65;
    --icons-hover: #3A2F24;
    --links: #3A2F24;
    --inline-code-color: #4A3D2F;
    --theme-popup-bg: #F7EFDD;
    --theme-popup-border: #DCCDB0;
    --theme-hover: #EADFC6;
    --quote-bg: #EADFC6;
    --quote-border: #DCCDB0;
    --warning-border: #A86A12;
    --table-border-color: #DCCDB0;
    --table-header-bg: transparent;
    --table-alternate-bg: transparent;
    --searchbar-border-color: #DCCDB0;
    --searchbar-bg: #F7EFDD;
    --searchbar-fg: #3A2F24;
    --searchbar-shadow-color: #DCCDB0;
    --searchresults-header-fg: #7B6B57;
    --searchresults-border-color: #DCCDB0;
    --searchresults-li-bg: #EADFC6;
    --search-mark-bg: var(--marca);
    --footnote-highlight: var(--marca);
    --overlay-bg: rgba(58, 47, 36, 0.3);
    --color-scheme: light;
}

/* ---------- Noite ---------- */
.coal {
    --bg: #17181B;
    --fg: #D8D5CE;
    --apagado: #8F8D87;
    --grao: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.4 -0.16'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");

    --sidebar-bg: #121316;
    --sidebar-fg: #B9B6AE;
    --sidebar-non-existant: #5E5D59;
    --sidebar-active: #EDEAE3;
    --sidebar-spacer: #2F3034;
    --sidebar-header-border-color: #2F3034;
    --scrollbar: #45464B;
    --icons: #7A7873;
    --icons-hover: #EDEAE3;
    --links: #D8D5CE;
    --inline-code-color: #C9C6BF;
    --theme-popup-bg: #1F2024;
    --theme-popup-border: #2F3034;
    --theme-hover: #2A2B2F;
    --quote-bg: #1F2024;
    --quote-border: #2F3034;
    --warning-border: #D29A3A;
    --table-border-color: #2F3034;
    --table-header-bg: transparent;
    --table-alternate-bg: transparent;
    --searchbar-border-color: #2F3034;
    --searchbar-bg: #1F2024;
    --searchbar-fg: #D8D5CE;
    --searchbar-shadow-color: #2F3034;
    --searchresults-header-fg: #8F8D87;
    --searchresults-border-color: #2F3034;
    --searchresults-li-bg: #1F2024;
    --search-mark-bg: #8A7A1E;
    --footnote-highlight: #8A7A1E;
    --overlay-bg: rgba(0, 0, 0, 0.4);
    --color-scheme: dark;
}

/* Só três tons, como no manifesto */
#mdbook-theme-navy, #mdbook-theme-ayu { display: none; }

/* ---------- Papel com granulação ---------- */
body, .page-wrapper {
    background-color: var(--bg);
    background-image: var(--grao);
    background-size: 240px 240px;
}
.sidebar { background-color: var(--sidebar-bg); }
#mdbook-menu-bar, .menu-bar { background-color: var(--bg); background-image: var(--grao); }

/* ---------- Tipografia ---------- */
.content main {
    font-family: var(--texto);
    font-size: 1.95rem;
    line-height: 1.7;
    letter-spacing: 0.003em;
    font-optical-sizing: auto;
    -webkit-font-smoothing: antialiased;
}
.content main h1, .content main h2, .content main h3, .content main h4,
.menu-title, .sidebar, #mdbook-theme-list, .nav-chapters {
    font-family: var(--display);
}
.content main h1 {
    font-size: clamp(3.2rem, 5vw, 4.6rem);
    font-weight: 750;
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin-block: 1.2em 0.8em;
}
.content main h2 {
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.015em;
    margin-top: 2.2em;
}
.content main h3 { font-size: 2.2rem; font-weight: 650; }
.content main strong { font-weight: 650; }
.content main a, .content main a:visited { color: var(--links); }
.content main a {
    text-decoration: underline;
    text-decoration-color: var(--apagado);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
}
.content main a:hover { text-decoration-thickness: 2px; text-decoration-color: currentColor; }
.content main .header, .content main .header:visited { text-decoration: none; color: inherit; }
.content main blockquote { border-inline-start: 3px solid var(--quote-border); background: var(--quote-bg); }
.content main hr { border: 0; border-top: 1px solid var(--table-border-color); }
.content main code { font-size: 0.84em; }

.sidebar { font-size: 1.5rem; }
.sidebar .chapter li.part-title {
    margin-top: 1.6em;
    font-family: var(--display);
    font-weight: 700;
    color: var(--sidebar-fg);
}
.sidebar .chapter a.active { font-weight: 650; }
.menu-title { font-weight: 700; letter-spacing: -0.01em; }

/* ---------- Tabelas: réguas, sem zebra ---------- */
.content main .table-wrapper table, .content main table {
    font-size: 0.86em;
    line-height: 1.5;
    border-collapse: collapse;
}
.content main table thead th {
    font-family: var(--display);
    font-weight: 650;
    font-size: 0.92em;
    color: var(--apagado);
    text-align: left;
    border: 0;
    border-bottom: 1.5px solid var(--fg);
    padding: 0.4em 1em 0.6em 0;
}
.content main table td {
    border: 0;
    border-bottom: 1px solid var(--table-border-color);
    padding: 0.75em 1em 0.75em 0;
    vertical-align: top;
}
.content main table tbody tr:nth-child(2n) { background: transparent; }

/* Tabelas largas (indicadores, 7 colunas) rolam dentro do próprio bloco,
   sem invadir a margem onde ficam as setas de navegação */
.content main .table-wrapper { overflow-x: auto; }
/* Páginas de indicadores são quase só tabela: a coluna de conteúdo fica mais larga */
.content main:has(.table-wrapper th:nth-child(6)) { max-width: min(940px, 100%); }
.content main .table-wrapper:has(th:nth-child(6)) table { min-width: 860px; font-size: 0.78em; }
.content main .table-wrapper:has(th:nth-child(6)) td:first-child { white-space: nowrap; }

/* ---------- Diagramas e fórmulas ---------- */
.content main .mermaid { display: flex; justify-content: center; margin: 2em 0; }
.content main .formula { overflow-x: auto; margin: 1.5em 0; text-align: center; }

/* ---------- Rodapé: volta ao manifesto ---------- */
.rodape-livro {
    margin-top: 4em;
    padding-top: 1.2em;
    border-top: 1px solid var(--table-border-color);
    font-family: var(--display);
    font-size: 1.5rem;
    color: var(--apagado);
}
.rodape-livro a { color: inherit; }

/* ---------- Termos ligados ao dicionário ---------- */
.content main a.termo, .content main a.termo:visited, .content main span.termo {
    color: inherit;
    text-decoration: underline dotted;
    text-decoration-color: var(--apagado);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.22em;
}
.content main a.termo:hover, .content main span.termo:hover { text-decoration-style: solid; text-decoration-color: currentColor; }
/* Em títulos, o sublinhado pontilhado é mais discreto e o cursor indica o popup */
.content main :is(h1, h2, h3, h4) span.termo { text-decoration-thickness: 2px; text-underline-offset: 0.16em; cursor: help; }
/* No dicionário, cada entrada é um alvo: destaque ao chegar por um link */
.content main h3:target, .content main h3:target + p { background: color-mix(in srgb, var(--marca) 35%, transparent); }