/* Pele "Mercedes Club" (29/10): arte da agência (Lâmpada) sobre a TV. Carregada por index.html depois de tv.css.
   Fundo e descanso são as artes inteiras em 1080x1920; botões, cartões e fotos dos rolos são recortes (skin/club e skin/brindes). */
.pele-club .palco { background: #1c2638 url('/skin/club/fundo.jpg') center / cover no-repeat; }
.pele-club .topo { padding-top: 56px; }
.pele-club .logo { width: 450px; }
.pele-club .chamada {
  margin: 40px 0 0; font-family: 'MB Corpo S Title Cond', var(--fonte-texto); font-weight: 700; text-transform: uppercase;
  font-size: 118px; line-height: .95; letter-spacing: .01em; color: #e9c04a;
}
.pele-club .sub-chamada {
  margin: 26px auto 0; font-family: 'MB Corpo S Title Cond', var(--fonte-texto); font-weight: 700;
  text-transform: uppercase; font-size: 42px; line-height: 1.25; color: #fff;
}
.pele-club .maquina { margin-top: 44px; }
.pele-club .simbolo img, .pele-club .simbolo img:not([src*=".svg"]) { width: 170px; height: 170px; object-fit: contain; filter: none; }
.pele-club .area { margin-top: 10px; }
/* Botões: a arte já traz o texto; o botão é só a imagem. */
.pele-club .botao-girar {
  margin-top: 70px; width: 460px; height: 460px; border: 0; box-shadow: none; color: transparent; font-size: 0;
  background: url('/skin/club/botao-puxar.png') center / contain no-repeat;
  animation: pulsa-club 1.6s ease-in-out infinite;
}
@keyframes pulsa-club { 50% { transform: scale(1.05); } }
.pele-club .girando .botao-girar { animation: none; opacity: .4; transform: scale(.94); }
.pele-club .ultimo-giro-pronto { color: rgba(255,255,255,.55); }
.pele-club .pronto-aviso { color: #e9c04a; }
.pele-club .faixa-pausa { background: #e9c04a; }

/* Resultado: "Você ganhou" em cima, o cartão da arte no meio, o botão Finalizar da arte embaixo. */
.pele-club .popup { background: rgba(14,20,32,.5); backdrop-filter: blur(14px); }
.pele-club .cartao, .pele-club .ganhou .cartao, .pele-club .ganhou.vip .cartao { width: 980px; padding: 40px 30px 30px; border: 0; border-radius: 0; background: none; box-shadow: none; }
.pele-club .res-chapeu {
  margin: 0 0 10px; font-family: 'MB Corpo S Title Cond', var(--fonte-texto); font-weight: 700; text-transform: uppercase;
  font-size: 128px; line-height: .95; letter-spacing: .01em; color: #fff; padding: 0;
}
.pele-club .ganhou.vip .res-chapeu { color: #fff; }
.pele-club .res-vitrine { width: 760px; height: 900px; }
.pele-club .ganhou .res-vitrine::before { display: none; }
.pele-club .res-imagem { width: 760px; height: 900px; object-fit: contain; filter: none; }
.pele-club .res-brinde { display: none; }
.pele-club .popup .res-texto {
  margin: 6px auto 0; font-family: 'MB Corpo S Title Cond', var(--fonte-texto); font-weight: 700; text-transform: uppercase;
  font-size: 38px; color: #fff; max-width: 900px;
}
.pele-club .popup .botao-finalizar {
  margin-top: 26px; width: 240px; height: 240px; padding: 0; border-radius: 0; color: transparent; font-size: 0;
  background: url('/skin/club/botao-finalizar.png') center / contain no-repeat;
}
.pele-club .perdeu .res-imagem, .pele-club .esgotado .res-imagem { width: 300px; height: 300px; opacity: .6; }
.pele-club .perdeu .res-vitrine, .pele-club .esgotado .res-vitrine { height: 320px; }
.pele-club .popup .res-titulo { font-family: 'MB Corpo S Title Cond', var(--fonte-texto); font-weight: 700; text-transform: uppercase; }

/* Descanso: a tela "Começar" inteira, como a agência mandou. Um toque em qualquer lugar abre. */
.pele-club .descanso { gap: 0; background: #0b0f18; }
.pele-club .descanso-arte { position: absolute; inset: -1px; width: calc(100% + 2px); height: calc(100% + 2px); object-fit: cover; }
.pele-club .descanso-ultimo { bottom: 40px; color: rgba(255,255,255,.45); z-index: 1; }