/* Fogo da lamparina (capa). O WebGL (chama.js) desenha dentro do canvas, que se
   estende acima e aos lados da lamparina para as faíscas. Sem WebGL, vale a chama CSS. */
.c-lanterna__fogo { inset: auto; max-width: none; left: -20%; top: -35%; width: 140%; height: 135%; }

/* A luz do vidro "vaza" em volta da lamparina e acompanha a tremulação (--chama, de chama.js). */
.c-lanterna.is-webgl .c-lanterna__fogo { filter: drop-shadow(0 0 1rem rgba(255, 196, 80, calc(.55 + .35 * var(--chama, .8)))) drop-shadow(0 0 4.5rem rgba(247, 150, 48, calc(.3 + .28 * var(--chama, .8)))); }
.c-capa__luz { background: radial-gradient(circle at var(--luz-x, 50%) var(--luz-y, 40%), rgba(255, 184, 72, .5) 0, rgba(240, 132, 40, .2) 11vmax, rgba(228, 42, 86, .06) 22vmax, transparent 36vmax); }
@media (prefers-reduced-motion: reduce) { .c-lanterna.is-webgl .c-lanterna__fogo { filter: drop-shadow(0 0 .9rem rgba(255, 196, 80, .7)) drop-shadow(0 0 3.2rem rgba(247, 150, 48, .4)); } }

/* Reserva sem WebGL: vidro aceso + chama que tremula suavemente */
.c-lanterna__chama-css { transform-box: fill-box; transform-origin: 50% 100%; animation: arch-chama-tremer 2.6s ease-in-out infinite; }
.c-lanterna__chama-css path:nth-child(2) { transform-box: fill-box; transform-origin: 50% 100%; animation: arch-chama-tremer-2 1.9s ease-in-out infinite; }
.c-lanterna__chama-css path:nth-child(3) { transform-box: fill-box; transform-origin: 50% 100%; animation: arch-chama-tremer-2 1.4s ease-in-out infinite reverse; }
.c-lanterna__vidro { animation: arch-vidro-pulsar 3.1s ease-in-out infinite; }
@keyframes arch-chama-tremer {
	0%, 100% { transform: scale(1, 1) rotate(0deg); }
	22% { transform: scale(.97, 1.04) rotate(-1.2deg); }
	48% { transform: scale(1.02, .97) rotate(.8deg); }
	73% { transform: scale(.98, 1.05) rotate(1.4deg); }
}
@keyframes arch-chama-tremer-2 {
	0%, 100% { transform: scale(1, 1); }
	35% { transform: scale(.94, 1.07); }
	70% { transform: scale(1.05, .95); }
}
@keyframes arch-vidro-pulsar { 0%, 100% { opacity: 1; } 40% { opacity: .9; } 70% { opacity: .96; } }

@media (prefers-reduced-motion: reduce) {
	.c-lanterna__chama-css, .c-lanterna__chama-css path, .c-lanterna__vidro { animation: none; }
}
.c-capa.is-fogo-parado .c-lanterna__chama-css, .c-capa.is-fogo-parado .c-lanterna__chama-css path, .c-capa.is-fogo-parado .c-lanterna__vidro,
.c-capa.is-pausado .c-lanterna__chama-css, .c-capa.is-pausado .c-lanterna__chama-css path, .c-capa.is-pausado .c-lanterna__vidro { animation: none; }

/* 1.0.4: vidro da lamparina em AMARELO SÓLIDO da logo (Lumi Yellow #f7ce3e), pulsando devagar; sem chama */
.c-lanterna__chama-css { display: none; }
.c-capa .c-lanterna__vidro { fill: #f7ce3e; animation: arch-vidro-amarelo 2.6s ease-in-out infinite; }
@keyframes arch-vidro-amarelo { 0%, 100% { fill: #f7ce3e; } 50% { fill: #ffe170; } }
.c-capa .c-lanterna__svg { animation: arch-lanterna-brilho 2.6s ease-in-out infinite; }
@keyframes arch-lanterna-brilho { 0%, 100% { filter: drop-shadow(0 0 .3rem rgba(247, 206, 62, .25)); } 50% { filter: drop-shadow(0 0 1.6rem rgba(247, 206, 62, .75)); } }
.c-capa .c-capa__luz { animation: arch-luz-pulso 2.6s ease-in-out infinite; }
@keyframes arch-luz-pulso { 0%, 100% { opacity: .35; } 50% { opacity: .8; } }
.c-capa.is-pausado .c-lanterna__vidro, .c-capa.is-pausado .c-lanterna__svg, .c-capa.is-pausado .c-capa__luz,
.c-capa.is-fogo-parado .c-lanterna__vidro, .c-capa.is-fogo-parado .c-lanterna__svg, .c-capa.is-fogo-parado .c-capa__luz { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .c-capa .c-lanterna__vidro, .c-capa .c-lanterna__svg, .c-capa .c-capa__luz { animation: none; } }
