/* Estilo compartilhado das páginas legais — Biblioteca Iluminada */

:root {
  --grape:  #6C4BD8;
  --coral:  #FF6B5B;
  --sun:    #FFC22E;
  --mint:   #23CFA0;
  --bg:     #FFFFFF;
  --bg-soft:#F6F3FF;
  --ink:    #2B2350;
  --ink-2:  #5C5480;
  --ink-3:  #948DB4;
  --line:   #EAE4FA;
  --round: "Arial Rounded MT Bold", "Century Gothic", "Trebuchet MS", "Segoe UI", sans-serif;
  --body:  "Century Gothic", "Questrial", "Trebuchet MS", "Segoe UI", Tahoma, sans-serif;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1A1533; --bg-soft: #221B45; --ink: #F3F0FF;
    --ink-2: #C3BCE4; --ink-3: #948DB4; --line: #382E66; --grape: #8B6BF0;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #1A1533; --bg-soft: #221B45; --ink: #F3F0FF;
  --ink-2: #C3BCE4; --ink-3: #948DB4; --line: #382E66; --grape: #8B6BF0;
  color-scheme: dark;
}
:root[data-theme="light"] {
  --bg: #FFFFFF; --bg-soft: #F6F3FF; --ink: #2B2350;
  --ink-2: #5C5480; --ink-3: #948DB4; --line: #EAE4FA; --grape: #6C4BD8;
  color-scheme: light;
}

* { box-sizing: border-box; }

body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--body); font-size: 17px; line-height: 1.68;
  -webkit-font-smoothing: antialiased;
}

.top { background: var(--bg-soft); padding: 1.5rem clamp(1.15rem, 5vw, 2.5rem); }
.top-in {
  max-width: 52rem; margin-inline: auto;
  display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem;
  align-items: center; justify-content: space-between;
}
.brand { font-family: var(--round); font-size: 1.35rem; text-decoration: none; color: var(--grape); }
.top a.back {
  color: var(--ink-2); font-size: 0.86rem; text-decoration: none;
  background: var(--bg); padding: 0.5rem 1.1rem; border-radius: 999px;
  border: 2px solid var(--line);
}
.top a.back:hover { color: var(--grape); border-color: var(--grape); }

main {
  max-width: 52rem; margin-inline: auto;
  padding: clamp(2.5rem, 7vw, 4rem) clamp(1.15rem, 5vw, 2.5rem) 5rem;
}

h1 {
  font-family: var(--round); font-weight: normal;
  font-size: clamp(2.1rem, 6vw, 3rem); line-height: 1.08;
  letter-spacing: -0.015em; margin: 0 0 0.6rem;
}
h2 {
  font-family: var(--round); font-weight: normal;
  font-size: clamp(1.3rem, 3.4vw, 1.65rem); line-height: 1.24;
  margin: 2.5rem 0 0.85rem; color: var(--grape);
}
h2:first-of-type { margin-top: 2rem; }

p, li { color: var(--ink-2); }
p { margin: 0 0 1.1rem; }
ul, ol { margin: 0 0 1.1rem; padding-left: 1.4rem; }
li { margin-bottom: 0.5rem; }
li::marker { color: var(--grape); }
strong { color: var(--ink); }

.updated {
  display: inline-block;
  background: var(--sun); color: #4A3300;
  font-family: var(--round); font-size: 0.78rem;
  letter-spacing: 0.04em; text-transform: uppercase;
  padding: 0.45rem 1rem; border-radius: 999px; margin-bottom: 2rem;
}

a { color: var(--grape); text-underline-offset: 3px; }
a:hover { color: var(--coral); }
:where(a):focus-visible { outline: 3px solid var(--grape); outline-offset: 3px; border-radius: 6px; }

.fill {
  background: #FFE9E6; border-bottom: 2px dashed var(--coral);
  color: #C0392B; font-family: var(--round);
  padding: 0 0.3em; border-radius: 4px;
}

.note {
  background: var(--bg-soft); border: 3px dashed var(--mint);
  border-radius: 20px; padding: 1.3rem 1.5rem; margin: 2.25rem 0;
}
.note p:last-child { margin-bottom: 0; }

.foot {
  border-top: 3px solid var(--line); margin-top: 3rem; padding-top: 1.5rem;
  font-size: 0.86rem; color: var(--ink-3);
}