#btnInstall {
              display: none;
              padding: 10px 20px;
              font-size: 1.6rem;
              background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
              border: none;
              border-radius: 5px;
              cursor: pointer;
              align-items: center;
              justify-items: center;
              position: absolute;
              z-index: 9999;
              width: 98dvw;
    }

.btnInstall_Acao{display: grid;
                  }

.Tela_Principal{display: grid;
                position: relative;
                  grid-auto-rows: 90dvh 10dvh;
                  width: 98dvw;
                  height: 98dvh;
                  overflow: hidden;
                  align-items: center;
                  justify-items: center;
                  margin: 0;
                  padding: 0;
}

.Tela_Principal_Prof{
                  grid-auto-rows: 90dvh;
                  width: 98dvw;
                  height: 98dvh;
                  overflow: hidden;
                  align-items: center;
                  justify-items: center;
                  margin: 0;
                  padding: 0;
}


.Controle_menur{display: flex;
              width: 95dvw;
              height: 8dvh;
              background-color: rgba(199, 247, 247, 0.4);
              overflow: hidden;
              align-items: center;
              margin: 0;
              padding: 0;
              margin-left: 0dvw;
              margin-right: 0dvw;
              justify-content: space-evenly;

            & figure {margin: 0;
                        padding: 0;
                        text-align: center;}

            & .Menu_Click {width: 6dvw;
                              height: 5dvh;
                              margin: 0;
                              padding: 0;}

            & .Menu_Click:hover {width: 7dvw;
                                    height: 6dvh;
                                    margin: 0;
                                    padding: 0;}

            }

.Menu_select {width: 7dvw;
                  height: 6dvh;
                  margin: 0;
                  padding: 0;}

.Menu_Selec_Bord{background-color: rgb(208, 169, 169,0.5);}

.Img_Menur {width: 10dvw;
            text-align: center;
            justify-self: center;
            margin: 0;
            padding: 0;
            height: 8dvh;
            display: grid;
            justify-items: center;
            align-items: center;}

.btt_Padrão {
            background-color: #4ca5af; /* verde */
            color: white;
            margin-top: 0.5rem;
            padding: 12px 24px;
            border: none;
            border-radius: 8px;
            font-size: 14px;
            cursor: pointer;
            width: 80dvw;
            transition: background-color 0.3s ease, transform 0.2s ease;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);

            & a {color: white;   
                    }

          }

.btt_Padrão:hover {transform: translateY(2%);
                }


.btt_Padrão_Temp {background-color: #4ca5af;
                color: white;
                margin-top: 0.5rem;
                padding: 1dvh 3dvw;
                border: none;
                border-radius: 8px;
                font-size: 14px;
                cursor: pointer;
                width: 15dvw;
                transition: background-color 0.3s ease, transform 0.2s ease;
                box-shadow:  0 4px 6px rgba(0, 0, 0, 0.1);

            & a {color: white;   
                    }

          }

.btt_Padrão_Temp:hover {transform: translateY(2%);
                }
.btn-fechar {
    position: absolute; 
    top: 0; 
    right: 0;
    color: #032b22; 
    border: none; 
    border-radius: 50%;
    width: 10dvw;
    height: 4dvh;
    font-size: 3.5rem;
    font-weight: bold; 
    text-align: center;
    Cursor: pointer;
    transition: 0.2s;
    background-color:  rgb(255, 255, 25, 0);
}

.Secao_Inicial {display: grid;
                  justify-items: center;
                  height: 85dvh;
                  grid-template-rows: 1fr 1fr 4fr 2fr 2fr;
                  justify-content: center;
                  align-items: start;
                  text-align: center;
                  margin-left: 4%;
                  margin-right: 4%;
                  margin: 0%;
          }

.Secao_Botao_log{display: grid;
                  justify-items: center;}

.Centro_pag img{width: 68dvw;
                height: 32dvh;
                            }

.Secao_Perfil {display: grid;
              grid-template-rows: 30dvh 50dvh;
              text-align: center;
              margin: 0%;
              width: 90dvw;

                  & h2 {font-size: 3rem;}

                  & p {font-size: 2.4rem;
                        text-align: center;
                        width: 100%;
                        Color: black;
                        margin-bottom: 0;
                        margin-top: 1dvh;}

                  & img{height: 16dvh;
                        aspect-ratio: 4 / 4;
                        width: 26dvw;
                        object-fit: contain;
                        margin: 2dvh;
                        border-radius: 30%;}

          }

.Dados_Perfil{display: grid;
              grid-template-columns: 1fr 1fr;
              align-items: center;
              border: 1px solid rgba(255, 255, 255, 0.10);
              background: rgba(0, 0, 0, 0.40);
              border-radius: 2dvh;

              & P{font-size: 1.8rem;
                  color: black;
                width: 30dvw;}
            }

.Estatistica{border: 1px solid rgba(255, 255, 255, 0.10);
              background: rgba(0, 0, 0, 0.40);
              border-radius: 2dvh;
              height: 40dvh;
              margin-top: 2%;}

.Ranck{border: 1px solid rgba(255, 255, 255, 0.10);
              background: rgba(0, 0, 0, 0.40);
              border-radius: 2dvh;
              height: 20dvh;
              margin-top: 2%;}

.Secao_Escala {display: grid;
              grid-template-rows: 10dvh 65dvh 10dvh;
              text-align: center;
              text-align: center;
              margin: 0%;
              width: 90dvw;

                  & h2 {font-size: 3rem;}

                  & p {font-size: 1.8rem;
                        text-align: center;
                        width: 100%;
                        Color: black;
                        margin: 0;
                        padding: 0;}

                  & img{height: 16dvh;
                        aspect-ratio: 4 / 3;
                        width: 26dvw;
                        object-fit: contain;}
          }

.timerWrap{
      display:grid;
      gap:10px;
    }

.timerFace{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      border:1px solid rgba(255,255,255,0.10);
      background:rgba(0,0,0,0.40);
      border-radius:16px;
      padding:12px 12px;
    }

.timer{
      font-size:34px;
      font-weight:900;
      letter-spacing:1px;
    }

.Escalacao{
          background:rgba(0,0,0,0.1)}    

.Campo{
        display: grid;  
        width: auto;
        height: 50dvh;
        margin-top: 2%;
        border-radius: 5%;
        background: radial-gradient(800px 420px at 50% 20%, rgba(255, 255, 255, .10), transparent 55%), linear-gradient(90deg, rgba(255, 255, 255, .06) 0 1px, transparent 1px 100%), linear-gradient(0deg, rgba(255, 255, 255, .06) 0 1px, transparent 1px 100%);
        background-size: auto, 64px 100%, 100% 64px;
        background-color: #0e5a33;

        & img{width: 5dvw;
              height: 2dvh;}
              
        & P{font-size: 1.4rem;}
        } 
        
.Meio {display: grid;
      grid-template-columns: 1fr 1fr;
      & P {width: auto;
        }
      }
        
.Jogador_Escala{height: auto;}

/* BANCO com rolagem — mostra só 2 linhas */
.Banco{
      display: grid;
      grid-template-columns: repeat(4, 1fr); /* 2 por linha */
      align-items: center;
      justify-items: center;
      background-color: #b3bbb3;
      width: auto;
      height: 10dvh;
      margin-top: 2%;
      border-radius: 5%;
      max-height: calc((72px * 2) + 10px);  /* ajuste 72px conforme seu card */
      overflow-y: auto;
  
       & img{width: 5dvw;
              height: 2dvh;}
}

/* define a “altura do card” pra conta bater */
.Banco .Jogador_Escala{
      height: 5dvh;
    align-items: center;
}

.Jogador_Escala{ cursor: pointer; }

/* scrollbar mais fininha (Chrome/Edge) */
.Banco::-webkit-scrollbar{
  width: 6px;
}
.Banco::-webkit-scrollbar-thumb{
  background: rgba(0,0,0,.25);
  border-radius: 10px;
}


.Secao_Presenca {display: grid;
              grid-template-rows: 80dvh;
              text-align: center;
              text-align: center;
              margin: 0%;
              width: 90dvw;}


/* container geral */
.Geleria_Clientes{
  padding: 12px;
}

/* topo com total */
.presenca-topo{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

/* área com rolagem */
.presenca-scroll{
  max-height: 75dvh;      /* ajusta conforme seu layout */
  overflow-y: auto;
  padding-right: 6px;
}

/* grupos */
.presenca-grupo{
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 14px;
  padding: 12px;
  margin-bottom: 12px;
  background: rgba(255,255,255,0.30);
}

.presenca-grupo h3{
  margin: 0 0 10px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.presenca-badge{
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  opacity:.9;
}

/* lista numerada */
.presenca-grupo ol{
  margin: 0;
  padding-left: 22px; /* numeração */
  display: grid;
  gap: 6px;
}