/* Fundo de hexágonos da rede Propague (desenhado pelo hexagonos.js). Escuro por padrão; o Painel claro troca as cores. */
.hexagonos { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
  --hex-face: #15161a; --hex-luz: rgb(255 255 255 / 6%); --hex-sombra: rgb(0 0 0 / 45%); --hex-vao: #0b0c0f; --hex-brilho: 1; }
.hexagonos canvas, .hexagonos > div { position: absolute; inset: 0; width: 100%; height: 100%; }
/* Página inteira: fica parado atrás de tudo, bem à mostra em cima e sumindo aos poucos para baixo. */
.hexagonos--pagina { position: fixed; inset: 0 0 auto; z-index: -1; height: 100vh; height: 100lvh;
  -webkit-mask-image: linear-gradient(to bottom, #000 12%, rgb(0 0 0 / 45%) 55%, transparent 92%); mask-image: linear-gradient(to bottom, #000 12%, rgb(0 0 0 / 45%) 55%, transparent 92%); }
body:has(> .hexagonos--pagina) { background-color: transparent; }
/* Painel no tema claro: hexágonos claros e mais suaves, com o brilho amarelo mais fraco. */
:root:not([data-tema="escuro"]) body.p > .hexagonos { --hex-face: #eceef2; --hex-luz: rgb(255 255 255 / 60%); --hex-sombra: rgb(20 21 25 / 4%); --hex-vao: #e3e5ea; --hex-brilho: .45; opacity: .6; }
body.p > .hexagonos--pagina { -webkit-mask-image: linear-gradient(to bottom, #000, rgb(0 0 0 / 35%) 40%, transparent 75%); mask-image: linear-gradient(to bottom, #000, rgb(0 0 0 / 35%) 40%, transparent 75%); }

/* Linhas amarelas entre os hexágonos: acendem devagar, ficam um pouco e apagam, cada uma na sua hora. */
.brilho-hex { position: absolute; overflow: visible; opacity: 0; will-change: opacity; animation: brilho-hex var(--dur, 12s) ease-in-out infinite; animation-delay: var(--atraso, 0s); }
.brilho-hex path { fill: none; stroke: #ffc21a; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 3px rgb(250 182 0 / 90%)) drop-shadow(0 0 9px rgb(245 120 0 / 55%)); }
@keyframes brilho-hex { 0%, 60%, 100% { opacity: 0; } 22%, 38% { opacity: var(--forca, .6); } }
@media (prefers-reduced-motion: reduce) { .brilho-hex { animation: none; opacity: calc(var(--forca, .6) * .6); } }