
:root {
  color-scheme: dark;

  --cor-primaria: #d08be5;
  --cor-primaria-forte: #c27bd0;
  --marca-1: #d08be5;
  --marca-2: #d887d1;
  --marca-3: #d55f8f;
  --marca-4: #d4516a;
  --marca-laranja: #fea610;
  --linha: rgba(198, 106, 13, .22);
  --linha-forte: rgba(198, 106, 13, .40);

  --cor-rodape: #151515;
  --cor-fundo: #1d1d1d;
  --cor-elev: #262626;
  --cor-elev-2: #313131;
  --cor-texto: #eceef4;
  --cor-sub: #a2a7bd;

  --cor-info: #7aa2ff;
  --cor-sucesso: #3dd68c;
  --cor-aviso: #f5c451;
  --cor-perigo: #e5484d;
  --caixa-tinta: 12%;
  --caixa-inline: 80%;

  --c-roxo: #c27bd0;
  --c-lilas: #d08be5;
  --c-purpura: #d887d1;
  --c-rosa: #d55f8f;
  --c-coral: #d4516a;
  --c-vermelho: #e5484d;
  --c-verde: #3dd68c;
  --c-amarelo: #f5c451;
  --c-cinza: #a2a7bd;

  --raio: 10px;
  --raio-pequeno: 6px;
  --altura-header: 64px;
  --largura-sidebar: 288px;
  --largura-outline: 240px;
  --largura-conteudo: 768px;
  --largura-conteudo-larga: 1152px;
  --sombra: 0 8px 24px rgba(0, 0, 0, .35);
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--cor-fundo);
  color: var(--cor-texto);
  font: 16px/1.65 "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  display: grid;
  grid-template-columns: var(--largura-sidebar) 1fr var(--largura-outline);
  grid-template-rows: auto var(--altura-header) 1fr auto;
  grid-template-areas:
    "banner  banner    banner"
    "topo    topo      topo"
    "indice  conteudo  outline"
    "rodape  rodape    rodape";
  min-height: 100vh;
}

body.sem-outline {
  grid-template-columns: var(--largura-sidebar) 1fr;
  grid-template-areas:
    "banner  banner"
    "topo    topo"
    "indice  conteudo"
    "rodape  rodape";
}

img { max-width: 100%; }

a { color: var(--cor-primaria); text-decoration: none; }
a:hover { color: var(--cor-primaria-forte); text-decoration: underline; }
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible {
  outline: 2px solid var(--cor-primaria);
  outline-offset: 2px;
}

button {
  font: inherit;
  color: var(--cor-texto);
  background: var(--cor-elev);
  border: 1px solid var(--linha);
  border-radius: var(--raio-pequeno);
  cursor: pointer;
}

hr { border: 0; border-top: 1px solid var(--linha-forte); margin: 2rem 0; }

.alterna-drawer {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}


.cabecalho {
  grid-area: topo;
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 1rem;
  height: var(--altura-header);
  padding: 0 1.25rem;
  background: var(--cor-fundo);
  border-bottom: 1px solid var(--linha-forte);
  min-width: 0;
}

.cabecalho .marca {
  display: flex;
  align-items: center;
  gap: .6rem;
  color: var(--cor-texto);
  font-weight: 600;
  white-space: nowrap;
  min-width: 0;
}
.cabecalho .marca span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cabecalho .marca:hover { color: var(--cor-texto); text-decoration: none; }
.cabecalho .marca img { border-radius: var(--raio-pequeno); }

.cabecalho .busca { flex: 1; max-width: 420px; }
.cabecalho .busca input {
  width: 100%;
  font: inherit;
  color: var(--cor-texto);
  background: var(--cor-elev);
  border: 1px solid var(--linha);
  border-radius: var(--raio);
  padding: .5rem .75rem;
}
.cabecalho .busca input::placeholder { color: var(--cor-sub); }

.botao-menu {
  display: none;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: var(--raio-pequeno);
  cursor: pointer;
}
.hamburguer,
.hamburguer::before,
.hamburguer::after {
  display: block;
  width: 1.25rem;
  height: 2px;
  background: var(--cor-texto);
  border-radius: 2px;
}
.hamburguer::before, .hamburguer::after { content: ""; position: relative; }
.hamburguer::before { top: -5px; }
.hamburguer::after { top: 3px; }


.indice {
  grid-area: indice;
  border-right: 1px solid var(--linha);
}

.indice > nav {
  position: sticky;
  top: var(--altura-header);
  max-height: calc(100vh - var(--altura-header));
  overflow-y: auto;
  padding: 1rem 0;
}

.grupo-indice { border-bottom: 1px solid var(--linha); }
.grupo-indice:last-child { border-bottom: 0; }

.grupo-titulo {
  margin: 0 .5rem;
  padding: .5rem .75rem;
  border-radius: var(--raio-pequeno);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--cor-sub);
  cursor: pointer;
  list-style: none;
}
.grupo-titulo::-webkit-details-marker { display: none; }

.indice ul { list-style: none; margin: 0; padding: 0; }

.indice li > a,
.indice li > details > summary > a {
  display: block;
  margin: 0 .5rem;
  padding: .45rem 1rem;
  color: var(--cor-sub);
  border-left: 3px solid transparent;
  border-radius: var(--raio-pequeno);
}
.indice li > a:hover,
.indice li > details > summary > a:hover {
  color: var(--cor-texto);
  text-decoration: none;
  background: var(--cor-elev);
}
.indice li > a.ativo,
.indice li > details > summary > a.ativo {
  color: var(--cor-primaria);
  border-left-color: var(--cor-primaria);
  background: var(--cor-elev);
  font-weight: 600;
}

.indice details ul { padding-left: 1rem; }
.indice details summary {
  list-style: none;
  cursor: pointer;
}
.indice details summary::-webkit-details-marker { display: none; }

.grupo-titulo,
.indice li > details > summary {
  display: flex;
  align-items: center;
}
.indice li > details > summary {
  margin: 0 .5rem;
  padding-right: .75rem;
  border-radius: var(--raio-pequeno);
}
.indice li > details > summary > a { margin-inline: 0; }
.grupo-titulo::after,
.indice li > details > summary::after {
  content: "";
  flex: none;
  width: .4rem;
  height: .4rem;
  margin-left: auto;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
  opacity: .7;
}
details[open] > .grupo-titulo::after,
.indice li > details[open] > summary::after { transform: rotate(45deg); }

@media (prefers-reduced-motion: no-preference) {
  :root { interpolate-size: allow-keywords; }

  .indice details::details-content {
    block-size: 0;
    overflow: hidden;
    transition: block-size .22s ease, content-visibility .22s allow-discrete;
  }
  .indice details[open]::details-content { block-size: auto; }
  .indice details > ul { padding-block: .25rem; }

  .grupo-titulo::after,
  .indice li > details > summary::after { transition: transform .22s ease; }
}


.conteudo {
  grid-area: conteudo;
  min-width: 0;
  padding: 2rem 1.5rem 4rem;
  display: flex;
  justify-content: center;
}

.conteudo > article {
  width: 100%;
  max-width: var(--largura-conteudo);
}

body.larga .conteudo > article { max-width: var(--largura-conteudo-larga); }

.capa {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1990 / 480;
  object-fit: cover;
  border-radius: var(--raio);
  margin-bottom: 1.5rem;
}

.trilha {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: .75rem;
  color: var(--cor-sub);
  font-size: .875rem;
}
.trilha ol { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; gap: .5rem; flex-wrap: wrap; }
.trilha li { display: flex; align-items: center; gap: .5rem; }
.conteudo .trilha ol,
.conteudo .trilha li { margin: 0; }
.trilha li.separador { color: var(--cor-sub); opacity: .6; }
.trilha a { color: var(--cor-sub); }
.trilha a:hover { color: var(--cor-primaria); }
.trilha .botao-outline {
  margin-left: auto;
  padding: .3rem .7rem;
  font-size: .8rem;
}
.botao-outline {
  display: none;
  align-items: center;
  justify-content: center;
  color: var(--cor-sub);
  background: var(--cor-elev);
  border: 1px solid var(--linha);
  border-radius: var(--raio-pequeno);
}
.botao-outline:hover { color: var(--cor-texto); }
.botao-outline svg { display: block; }

h1 {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  margin: .5rem 0 0;
  font-size: 2rem;
  line-height: 1.25;
}
h1 .emoji:empty { display: none; }

.resposta { margin: .5rem 0 1.75rem; color: var(--cor-sub); font-size: 1.0625rem; }

.conteudo article h2,
.conteudo article h3,
.conteudo article h4 {
  scroll-margin-top: calc(var(--altura-header) + 1rem);
  line-height: 1.3;
}
.conteudo article h2 { margin: 2.5rem 0 1rem; font-size: 1.5rem; }
.conteudo article h3 { margin: 2rem 0 .75rem; font-size: 1.25rem; }
.conteudo article h4 { margin: 1.5rem 0 .5rem; font-size: 1.0625rem; }

.ancora { margin-left: .4rem; opacity: 0; text-decoration: none; color: var(--cor-sub); }
h2:hover .ancora, h3:hover .ancora, h4:hover .ancora, .ancora:focus-visible { opacity: 1; }

.conteudo article p { margin: 1rem 0; }
.conteudo article ul, .conteudo article ol { margin: 1rem 0; padding-left: 1.5rem; }
.conteudo article li { margin: .35rem 0; }
.conteudo article li input[type="checkbox"] { margin-right: .4rem; }

.conteudo article blockquote {
  margin: 1.25rem 0;
  padding: .25rem 1rem;
  border-left: 3px solid var(--linha-forte);
  color: var(--cor-sub);
}

.conteudo article :not(pre) > code {
  background: var(--cor-elev);
  border-radius: 4px;
  padding: .15em .4em;
  font-size: .9em;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
}


.rolagem-tabela { overflow-x: auto; margin: 1.25rem 0; }
.rolagem-tabela table { width: 100%; border-collapse: collapse; }
.rolagem-tabela th, .rolagem-tabela td {
  padding: .55rem .75rem;
  border-bottom: 1px solid var(--linha);
  text-align: left;
}
.rolagem-tabela thead th {
  border-bottom: 1px solid var(--linha-forte);
}


.codigo {
  margin: 1.25rem 0;
  border: 1px solid var(--linha);
  border-radius: var(--raio);
  overflow: hidden;
  background: var(--cor-elev);
  position: relative;
}
.codigo-titulo {
  margin: 0;
  padding: .5rem .9rem;
  font-size: .8125rem;
  color: var(--cor-sub);
  border-bottom: 1px solid var(--linha);
}
.codigo pre {
  margin: 0;
  padding: .9rem 1rem;
  overflow-x: auto;
  font-size: .875rem;
  line-height: 1.6;
}
.codigo code {
  background: none;
  padding: 0;
  font-size: .875rem;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  line-height: 1.6;
}
.codigo .line:last-child:empty { display: none; }
.codigo-numerado code { counter-reset: linha; }
.codigo-numerado .line { counter-increment: linha; padding-left: 2.5rem; position: relative; }
.codigo-numerado .line::before {
  content: counter(linha);
  position: absolute;
  left: 0;
  width: 2rem;
  text-align: right;
  color: var(--cor-sub);
  opacity: .6;
}
.codigo .copiar {
  position: absolute;
  top: .4rem;
  right: .4rem;
  padding: .25rem .6rem;
  font-size: .75rem;
  opacity: 0;
}
.codigo:hover .copiar, .codigo .copiar:focus-visible { opacity: 1; }


.caixa {
  position: relative;
  margin: 1.25rem 0;
  padding: .9rem 1.1rem .9rem 3rem;
  border-radius: var(--raio);
  background: color-mix(in srgb, var(--caixa-cor) var(--caixa-tinta), transparent);
}
.caixa-icone {
  position: absolute;
  left: 1rem;
  top: calc(.9rem + (1.65em - 1.25rem) / 2);
  width: 1.25rem;
  height: 1.25rem;
  color: var(--caixa-cor);
}
.caixa-titulo { margin: 0 0 .35rem; font-weight: 700; }
.conteudo article .caixa > .caixa-icone + * { margin-top: 0; }
.conteudo article .caixa > :last-child { margin-bottom: 0; }
.conteudo article .caixa > .caixa-icone + :is(ul, ol) > li:first-child { margin-top: 0; }
.conteudo article .caixa > :is(ul, ol):last-child > li:last-child { margin-bottom: 0; }
.conteudo article .caixa-titulo { margin-bottom: .35rem; }
.conteudo article .caixa-titulo + * { margin-top: 0; }
.caixa .caixa { background: color-mix(in srgb, var(--caixa-cor) var(--caixa-tinta), var(--cor-fundo)); }
.caixa a:hover { color: var(--cor-primaria); }
.caixa .c-roxo { color: color-mix(in srgb, var(--c-roxo) var(--caixa-inline), var(--cor-texto)); }
.caixa .c-lilas { color: color-mix(in srgb, var(--c-lilas) var(--caixa-inline), var(--cor-texto)); }
.caixa .c-purpura { color: color-mix(in srgb, var(--c-purpura) var(--caixa-inline), var(--cor-texto)); }
.caixa .c-rosa { color: color-mix(in srgb, var(--c-rosa) var(--caixa-inline), var(--cor-texto)); }
.caixa .c-coral { color: color-mix(in srgb, var(--c-coral) var(--caixa-inline), var(--cor-texto)); }
.caixa .c-vermelho { color: color-mix(in srgb, var(--c-vermelho) var(--caixa-inline), var(--cor-texto)); }
.caixa .c-verde { color: color-mix(in srgb, var(--c-verde) var(--caixa-inline), var(--cor-texto)); }
.caixa .c-amarelo { color: color-mix(in srgb, var(--c-amarelo) var(--caixa-inline), var(--cor-texto)); }
.caixa .c-cinza { color: color-mix(in srgb, var(--c-cinza) var(--caixa-inline), var(--cor-texto)); }
@media (forced-colors: active) {
  .caixa { border: 1px solid CanvasText; }
  .caixa-icone { color: CanvasText; }
}
.caixa-info { --caixa-cor: var(--cor-info); }
.caixa-sucesso { --caixa-cor: var(--cor-sucesso); }
.caixa-aviso { --caixa-cor: var(--cor-aviso); }
.caixa-perigo { --caixa-cor: var(--cor-perigo); }
.caixa-dica { --caixa-cor: var(--marca-2); }


.conteudo article details {
  margin: 1.25rem 0;
  padding: .75rem 1rem;
  border: 1px solid var(--linha);
  border-radius: var(--raio);
}
.conteudo article details summary {
  cursor: pointer;
  font-weight: 600;
}
.conteudo article details[open] summary { margin-bottom: .5rem; }


.figura {
  margin: 1.5rem 0;
  text-align: center;
}
.figura img { border-radius: var(--raio); }
.figura figcaption { margin-top: .5rem; color: var(--cor-sub); font-size: .875rem; }
.figura-pequeno { max-width: 320px; margin-inline: auto; }
.figura-medio { max-width: 560px; margin-inline: auto; }
.figura-grande { max-width: 100%; }
.figura-cheio { max-width: none; }

.imagem-tamanho {
  display: block;
  margin-inline: auto;
  max-width: var(--imagem-largura, 100%);
}
.imagem-10 { --imagem-largura: 10%; }
.imagem-11 { --imagem-largura: 11%; }
.imagem-12 { --imagem-largura: 12%; }
.imagem-13 { --imagem-largura: 13%; }
.imagem-14 { --imagem-largura: 14%; }
.imagem-15 { --imagem-largura: 15%; }
.imagem-16 { --imagem-largura: 16%; }
.imagem-17 { --imagem-largura: 17%; }
.imagem-18 { --imagem-largura: 18%; }
.imagem-19 { --imagem-largura: 19%; }
.imagem-20 { --imagem-largura: 20%; }
.imagem-21 { --imagem-largura: 21%; }
.imagem-22 { --imagem-largura: 22%; }
.imagem-23 { --imagem-largura: 23%; }
.imagem-24 { --imagem-largura: 24%; }
.imagem-25 { --imagem-largura: 25%; }
.imagem-26 { --imagem-largura: 26%; }
.imagem-27 { --imagem-largura: 27%; }
.imagem-28 { --imagem-largura: 28%; }
.imagem-29 { --imagem-largura: 29%; }
.imagem-30 { --imagem-largura: 30%; }
.imagem-31 { --imagem-largura: 31%; }
.imagem-32 { --imagem-largura: 32%; }
.imagem-33 { --imagem-largura: 33%; }
.imagem-34 { --imagem-largura: 34%; }
.imagem-35 { --imagem-largura: 35%; }
.imagem-36 { --imagem-largura: 36%; }
.imagem-37 { --imagem-largura: 37%; }
.imagem-38 { --imagem-largura: 38%; }
.imagem-39 { --imagem-largura: 39%; }
.imagem-40 { --imagem-largura: 40%; }
.imagem-41 { --imagem-largura: 41%; }
.imagem-42 { --imagem-largura: 42%; }
.imagem-43 { --imagem-largura: 43%; }
.imagem-44 { --imagem-largura: 44%; }
.imagem-45 { --imagem-largura: 45%; }
.imagem-46 { --imagem-largura: 46%; }
.imagem-47 { --imagem-largura: 47%; }
.imagem-48 { --imagem-largura: 48%; }
.imagem-49 { --imagem-largura: 49%; }
.imagem-50 { --imagem-largura: 50%; }
.imagem-51 { --imagem-largura: 51%; }
.imagem-52 { --imagem-largura: 52%; }
.imagem-53 { --imagem-largura: 53%; }
.imagem-54 { --imagem-largura: 54%; }
.imagem-55 { --imagem-largura: 55%; }
.imagem-56 { --imagem-largura: 56%; }
.imagem-57 { --imagem-largura: 57%; }
.imagem-58 { --imagem-largura: 58%; }
.imagem-59 { --imagem-largura: 59%; }
.imagem-60 { --imagem-largura: 60%; }
.imagem-61 { --imagem-largura: 61%; }
.imagem-62 { --imagem-largura: 62%; }
.imagem-63 { --imagem-largura: 63%; }
.imagem-64 { --imagem-largura: 64%; }
.imagem-65 { --imagem-largura: 65%; }
.imagem-66 { --imagem-largura: 66%; }
.imagem-67 { --imagem-largura: 67%; }
.imagem-68 { --imagem-largura: 68%; }
.imagem-69 { --imagem-largura: 69%; }
.imagem-70 { --imagem-largura: 70%; }
.imagem-71 { --imagem-largura: 71%; }
.imagem-72 { --imagem-largura: 72%; }
.imagem-73 { --imagem-largura: 73%; }
.imagem-74 { --imagem-largura: 74%; }
.imagem-75 { --imagem-largura: 75%; }
.imagem-76 { --imagem-largura: 76%; }
.imagem-77 { --imagem-largura: 77%; }
.imagem-78 { --imagem-largura: 78%; }
.imagem-79 { --imagem-largura: 79%; }
.imagem-80 { --imagem-largura: 80%; }
.imagem-81 { --imagem-largura: 81%; }
.imagem-82 { --imagem-largura: 82%; }
.imagem-83 { --imagem-largura: 83%; }
.imagem-84 { --imagem-largura: 84%; }
.imagem-85 { --imagem-largura: 85%; }
.imagem-86 { --imagem-largura: 86%; }
.imagem-87 { --imagem-largura: 87%; }
.imagem-88 { --imagem-largura: 88%; }
.imagem-89 { --imagem-largura: 89%; }
.imagem-90 { --imagem-largura: 90%; }
.imagem-91 { --imagem-largura: 91%; }
.imagem-92 { --imagem-largura: 92%; }
.imagem-93 { --imagem-largura: 93%; }
.imagem-94 { --imagem-largura: 94%; }
.imagem-95 { --imagem-largura: 95%; }
.imagem-96 { --imagem-largura: 96%; }
.imagem-97 { --imagem-largura: 97%; }
.imagem-98 { --imagem-largura: 98%; }
.imagem-99 { --imagem-largura: 99%; }
.imagem-100 { --imagem-largura: 100%; }


.cards {
  display: grid;
  gap: .9rem;
  margin: 1.25rem 0;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}
.cards-grande { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.card {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  padding: 1rem;
  border: 1px solid var(--linha);
  border-radius: var(--raio);
  background: var(--cor-elev);
  color: var(--cor-texto);
}
.card:hover { border-color: var(--linha-forte); text-decoration: none; }
.card-titulo { font-weight: 700; }
.card-desc { color: var(--cor-sub); font-size: .875rem; }

.erro-bloco { color: var(--cor-perigo); }


.c-roxo { color: var(--c-roxo); }
.c-lilas { color: var(--c-lilas); }
.c-purpura { color: var(--c-purpura); }
.c-rosa { color: var(--c-rosa); }
.c-coral { color: var(--c-coral); }
.c-vermelho { color: var(--c-vermelho); }
.c-verde { color: var(--c-verde); }
.c-amarelo { color: var(--c-amarelo); }
.c-cinza { color: var(--c-cinza); }


.paginacao {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin: 3rem 0 0;
  padding-top: 1.5rem;
  border-top: 1px solid var(--linha);
}
.paginacao a {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding: .9rem 1rem;
  border: 1px solid var(--linha);
  border-radius: var(--raio);
  color: var(--cor-texto);
}
.paginacao a:hover { border-color: var(--cor-primaria); text-decoration: none; }
.nav-proximo { text-align: right; align-items: flex-end; }
.paginacao .rotulo { font-size: .75rem; color: var(--cor-sub); }
.paginacao .titulo { font-weight: 600; }


.outline {
  grid-area: outline;
  align-self: start;
  position: sticky;
  top: var(--altura-header);
  max-height: calc(100vh - var(--altura-header));
  overflow-y: auto;
  padding: 2rem 1.25rem;
}
.outline-titulo {
  margin: 0 0 .75rem;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--cor-sub);
}
.outline ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--linha); }
.outline li { margin: 0; }
.outline a {
  display: block;
  padding: .3rem .75rem;
  color: var(--cor-sub);
  font-size: .875rem;
  border-left: 2px solid transparent;
  border-radius: var(--raio-pequeno);
  margin-left: -1px;
}
.outline a:hover { color: var(--cor-texto); text-decoration: none; }
.outline a.ativo { color: var(--cor-primaria); border-left-color: var(--cor-primaria); }
.outline .nivel-3 a { padding-left: 1.5rem; }


.rodape {
  grid-area: rodape;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 1.5rem 1.25rem;
  border-top: 1px solid var(--linha-forte);
  background: var(--cor-rodape);
  color: var(--cor-sub);
  font-size: .875rem;
}
.rodape-links { display: flex; gap: 1.25rem; }
.rodape-links a {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: var(--cor-sub);
}
.rodape-links a:hover { color: var(--cor-texto); text-decoration: none; }
.rodape-links img { display: block; }
.rodape-copy { margin: 0; }


.banner-anuncio {
  grid-area: banner;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin: 0;
  border-radius: 0;
  border-left: 0;
  border-bottom: 3px solid var(--linha-forte);
}
.banner-anuncio .fechar { margin-left: .5rem; }

.banner-anuncio[hidden] { display: none; }


.sugestoes-404 { list-style: none; padding: 0; }
.sugestoes-404 li { margin: .5rem 0; }


.lista-recentes { list-style: none; padding: 0; }
.lista-recentes li { margin: .5rem 0; display: flex; gap: .5rem; align-items: baseline; }
.lista-recentes time { color: var(--cor-sub); font-size: .875rem; }


@media (max-width: 768px) {
  body, body.sem-outline {
    grid-template-columns: 1fr;
    grid-template-areas:
      "banner"
      "topo"
      "conteudo"
      "rodape";
  }

  .botao-menu { display: flex; }
  .botao-outline { display: inline-flex; }

  .indice {
    grid-area: auto;
    position: fixed;
    align-self: stretch;
    inset: var(--altura-header) auto 0 0;
    width: min(var(--largura-sidebar), calc(100% - 4.5rem));
    max-width: calc(100% - 4.5rem);
    background: var(--cor-fundo);
    box-shadow: var(--sombra);
    transform: translateX(-100%);
    z-index: 15;
  }
  #alterna-menu:checked ~ .indice { transform: translateX(0); }

  #alterna-menu ~ .veu-indice {
    display: block;
    position: fixed;
    inset: var(--altura-header) 0 0 0;
    z-index: 14;
    background: rgba(0, 0, 0, .45);
    opacity: 0;
    pointer-events: none;
  }
  #alterna-menu:checked ~ .veu-indice { opacity: 1; pointer-events: auto; }

  .indice > nav {
    position: static;
    height: 100%;
    max-height: none;
    overflow-y: auto;
  }

  .outline {
    grid-area: auto;
    position: fixed;
    align-self: stretch;
    inset: var(--altura-header) 0 0 auto;
    top: var(--altura-header);
    width: min(var(--largura-outline), calc(100% - 4.5rem));
    max-width: calc(100% - 4.5rem);
    max-height: none;
    background: var(--cor-fundo);
    box-shadow: var(--sombra);
    transform: translateX(100%);
    z-index: 15;
  }
  #alterna-outline:checked ~ .outline { transform: translateX(0); }

  @media (prefers-reduced-motion: no-preference) {
    .indice, .outline { transition: transform .2s ease; }
  }

  .cabecalho .busca { display: none; }
  .conteudo { padding: 1.25rem 1rem 3rem; }
  .paginacao { grid-template-columns: 1fr; }
  .rodape { justify-content: center; text-align: center; }
}

@media (max-width: 1024px) {
  .imagem-tamanho { max-width: max(var(--imagem-largura, 100%), min(100%, 12rem)); }
}


@media (pointer: coarse) {

  .cabecalho .marca {
    justify-content: center;
    min-width: 2.75rem;
    min-height: 2.75rem;
  }

  .banner-anuncio .fechar {
    position: relative;
    align-self: stretch;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.75rem;
  }
  .banner-anuncio .fechar::after {
    content: "";
    position: absolute;
    inset: -1px 0;
  }


  .trilha .botao-outline {
    min-width: 2.75rem;
    min-height: 2.75rem;
    padding: .3rem .9rem;
  }
  .trilha ol a {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
  }
  .trilha { align-items: flex-start; }


  .indice .grupo-titulo,
  .indice li > a,
  .indice li > details > summary,
  .indice li > details > summary > a,
  .outline a,
  .rodape-links a {
    display: flex;
    align-items: center;
    min-height: 2.75rem;
  }

  .conteudo article details > summary {
    display: list-item;
    padding-block: .55rem;
    min-height: 2.75rem;
  }

  .indice li > details > summary > a {
    min-width: 0;
    max-width: calc(100% - 2.75rem);
  }


  .codigo .copiar {
    opacity: 1;
    top: .5rem;
  }
  .codigo .copiar::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 2.75rem;
    margin-top: -1.375rem;
  }
  .codigo > .copiar:first-child + pre { padding-top: 2.6rem; }


  .conteudo article h2,
  .conteudo article h3,
  .conteudo article h4 { padding-right: 2.75rem; }
  .ancora {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    margin-left: 0;
    margin-right: -2.75rem;
    opacity: .75;
  }
  .ancora::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 2.75rem;
    margin-top: -1.375rem;
  }
  .caixa .ancora { opacity: 1; }
  .conteudo article h4 { margin-bottom: .75rem; }
}

@media (pointer: coarse) and (max-width: 768px) {
  .botao-menu { width: 2.75rem; height: 2.75rem; }
}

.sk-24292E{color:#24292E}
.sk-2F363D{color:#2F363D}
.sk-6A737D{color:#6A737D}
.sk-79B8FF{color:#79B8FF}
.sk-85E89D{color:#85E89D}
.sk-9ECBFF{color:#9ECBFF}
.sk-B392F0{color:#B392F0}
.sk-D1D5DA{color:#D1D5DA}
.sk-DBEDFF{color:#DBEDFF}
.sk-E1E4E8{color:#E1E4E8}
.sk-F97583{color:#F97583}
.sk-FDAEB7{color:#FDAEB7}
.sk-FFAB70{color:#FFAB70}

.cabecalho .busca { position: relative; }

.veu-indice { display: none; }
.busca-aviso {
  position: absolute;
  top: calc(100% + 0.35rem);
  left: 0;
  right: 0;
  z-index: 20;
  margin: 0;
  padding: 0.5rem 0.7rem;
  font-size: 0.85rem;
  line-height: 1.35;
  color: var(--cor-texto);
  background: var(--cor-elev-2);
  border: 1px solid var(--linha-forte);
  border-radius: var(--raio-pequeno);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
}
