/* css/letra-palco.css — o letreiro da tela de cantar (js/letra-palco): canvas próprio colado
   embaixo da pista, por cima dela e da cena. Os primeiros px (--veu) são só degradê: as pernas do
   cantor passam atrás dele como numa boca de cena. Não pega toque (o toque na pista pula a contagem).
   Cara do modelo 3 (cápsulas de vidro): faixa azul-noite escura com um fio azul fininho em cima,
   o mesmo azul das cápsulas. O degradê começa bem leve (até o topo da faixa escurece só 15%): as
   palavras embaixo das cápsulas mais graves chegam perto dele e não podem ficar com cara de apagadas. */
.letra-palco {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  height: 0;
  display: block;
  pointer-events: none;
  background:
    linear-gradient(to right,
      rgba(63, 184, 255, 0) 0,
      rgba(63, 184, 255, 0.55) 50%,
      rgba(63, 184, 255, 0) 100%) 0 var(--veu, 0px) / 100% 1px no-repeat,
    linear-gradient(to bottom,
      rgba(5, 4, 18, 0) 0,
      rgba(5, 4, 18, 0.15) var(--veu, 0px),
      rgba(5, 4, 18, 0.72) calc(var(--veu, 0px) + 24%),
      rgba(4, 3, 14, 0.88) 100%);
}

/* aparelho fraco: o mesmo véu (o gradiente é parado, não custa nada por quadro). O leve tira só a
   sombra e o brilho das letras; um degrau duro aqui virava um retângulo escuro atravessando a plateia */
.letra-palco.leve {
  background:
    linear-gradient(to right,
      rgba(63, 184, 255, 0) 0,
      rgba(63, 184, 255, 0.55) 50%,
      rgba(63, 184, 255, 0) 100%) 0 var(--veu, 0px) / 100% 1px no-repeat,
    linear-gradient(to bottom,
      rgba(5, 4, 18, 0) 0,
      rgba(5, 4, 18, 0.15) var(--veu, 0px),
      rgba(5, 4, 18, 0.72) calc(var(--veu, 0px) + 24%),
      rgba(4, 3, 14, 0.88) 100%);
}