/* CHAMAFUT — identidade visual oficial v1
   Anton nos títulos e ações; superfícies M5 nas ações secundárias. */
@font-face{
  font-family:"Anton";
  src:url("/assets/fonts/anton-v27-latin.ttf?v=1") format("truetype");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}

:root{
  --cf-font-display:"Anton","Arial Narrow",Impact,sans-serif;
  --cf-m5-surface:#20272c;
  --cf-m5-border:rgba(190,201,204,.26);
  --cf-m5-ink:#d0d5d4;
  --cf-m5-texture:url("/assets/player-home-secondary-slate-m5-v2.png?v=2");
}

/* Anton fica reservado à hierarquia de impacto. Textos corridos e formulários
   mantêm a fonte de leitura do produto. */
#app :is(h1,h2,h3,h4,h5,h6),
#app :is(.hero,.coverText,.sectionTitle,.cfTeamManageTopV5,.cfPL4Title,.cfHomeV2FieldHead,.cfHomeV2EcoHead,.cfHomeV2FinalBox) :is(b,strong),
#app :is(.k,[class*="Eyebrow"],[class*="Title"]),
.sheetBack :is(h1,h2,h3,h4,h5,h6),
.sheetBack :is(.k,[class*="Eyebrow"],[class*="Title"]){
  font-family:var(--cf-font-display)!important;
  font-weight:400!important;
  letter-spacing:.018em;
}

#app :is(button,.btn,[role="button"],.nav),
#app :is(.cfHomeV2FieldCta,.cfHomeV2FinalPrimary,.cfHomeV2FinalSecondary),
.sheetBack :is(button,.btn,[role="button"]){
  font-family:var(--cf-font-display)!important;
  font-weight:400!important;
  letter-spacing:.025em;
}

/* Modelo M5 — pedra ardósia fosca, grão discreto e gravação prateada.
   A regra atua somente em ações secundárias estruturais. */
:where(
  .btn.sec,
  .quick > button:not([data-cf-resenha]):not([data-cf-bora-jogar]),
  .adminCards > button,
  .cfTeamTraitsV40 > button
){
  color:var(--cf-m5-ink)!important;
  border:1px solid var(--cf-m5-border)!important;
  background-color:var(--cf-m5-surface)!important;
  background-image:
    linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.012) 42%,rgba(0,0,0,.20)),
    var(--cf-m5-texture)!important;
  background-position:center,center 46%!important;
  background-size:auto,190px auto!important;
  background-repeat:no-repeat,repeat!important;
  background-blend-mode:normal,soft-light!important;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.10),
    inset 0 -2px 3px rgba(0,0,0,.48),
    0 2px 5px rgba(0,0,0,.22)!important;
  text-shadow:0 -1px 1px rgba(0,0,0,.96),0 1px 0 rgba(255,255,255,.18)!important;
}

:where(
  .btn.sec,
  .quick > button:not([data-cf-resenha]):not([data-cf-bora-jogar]),
  .adminCards > button,
  .cfTeamTraitsV40 > button
) :where(svg,.svg,img){
  color:#c6cccb!important;
  filter:grayscale(1) drop-shadow(0 -1px 1px rgba(0,0,0,.96)) drop-shadow(0 1px 0 rgba(255,255,255,.16));
}

:where(
  .btn.sec,
  .quick > button:not([data-cf-resenha]):not([data-cf-bora-jogar]),
  .adminCards > button,
  .cfTeamTraitsV40 > button
):hover{
  border-color:rgba(220,227,228,.42)!important;
  filter:brightness(1.045);
}

:where(
  .btn.sec,
  .quick > button:not([data-cf-resenha]):not([data-cf-bora-jogar]),
  .adminCards > button,
  .cfTeamTraitsV40 > button
):active{
  transform:translateY(1px);
  filter:brightness(.92);
  box-shadow:inset 0 2px 5px rgba(0,0,0,.70)!important;
}

/* M5 global — ações comuns e navegação. A geometria original de cada
   componente é preservada; apenas a linguagem de superfície é unificada. */
html[data-theme] body :is(
  #app .btn:not([data-cf-resenha]):not([data-cf-bora-jogar]):not([data-action*="delete"]):not([data-action*="deactivate"]):not([data-action*="reject"]):not([style*="var(--red)"]),
  #cfProfileDrawerV2 .cfProfileDrawerProfileBtnV2,
  #cfProfileDrawerV2 .cfProfileDrawerQuickV3 button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfProfileDrawerV2 .cfProfileDrawerLinkV2:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfProfileDrawerV2 .cfProfileDrawerLogoutV2,
  .cfTeamManageNavV5 > button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfContextDrawerSectionV1 button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu)
){
  color:var(--cf-m5-ink)!important;
  border-color:var(--cf-m5-border)!important;
  background-color:var(--cf-m5-surface)!important;
  background-image:
    linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.01) 42%,rgba(0,0,0,.20)),
    var(--cf-m5-texture)!important;
  background-position:center,center 46%!important;
  background-size:auto,190px auto!important;
  background-repeat:no-repeat,repeat!important;
  background-blend-mode:normal,soft-light!important;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.09),
    inset 0 -2px 3px rgba(0,0,0,.46),
    0 2px 5px rgba(0,0,0,.20)!important;
  text-shadow:0 -1px 1px rgba(0,0,0,.94),0 1px 0 rgba(255,255,255,.16)!important;
}

html[data-theme] body :is(
  #app .btn:not([data-cf-resenha]):not([data-cf-bora-jogar]),
  #cfProfileDrawerV2 .cfProfileDrawerProfileBtnV2,
  #cfProfileDrawerV2 .cfProfileDrawerQuickV3 button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfProfileDrawerV2 .cfProfileDrawerLinkV2:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfProfileDrawerV2 .cfProfileDrawerLogoutV2,
  .cfTeamManageNavV5 > button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfContextDrawerSectionV1 button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu)
) :is(svg,.svg){
  color:#c6cccb!important;
  stroke:currentColor!important;
  filter:grayscale(1) drop-shadow(0 -1px 1px rgba(0,0,0,.94)) drop-shadow(0 1px 0 rgba(255,255,255,.15))!important;
}

html[data-theme] body :is(
  #app .btn:not([data-cf-resenha]):not([data-cf-bora-jogar]):not([data-action*="delete"]):not([data-action*="deactivate"]):not([data-action*="reject"]):not([style*="var(--red)"]),
  #cfProfileDrawerV2 .cfProfileDrawerProfileBtnV2,
  #cfProfileDrawerV2 .cfProfileDrawerQuickV3 button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfProfileDrawerV2 .cfProfileDrawerLinkV2:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfProfileDrawerV2 .cfProfileDrawerLogoutV2,
  .cfTeamManageNavV5 > button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfContextDrawerSectionV1 button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu)
):is(:hover,.active,[aria-current="page"]){
  color:#edf1f0!important;
  border-color:rgba(218,225,226,.44)!important;
  filter:brightness(1.055)!important;
  box-shadow:
    inset 3px 0 var(--cf-area-accent,#78e2aa),
    inset 0 1px 1px rgba(255,255,255,.11),
    inset 0 -2px 3px rgba(0,0,0,.42),
    0 3px 7px rgba(0,0,0,.24)!important;
}

html[data-theme] body :is(
  #app .btn:not([data-cf-resenha]):not([data-cf-bora-jogar]):not([data-action*="delete"]):not([data-action*="deactivate"]):not([data-action*="reject"]):not([style*="var(--red)"]),
  #cfProfileDrawerV2 .cfProfileDrawerProfileBtnV2,
  #cfProfileDrawerV2 .cfProfileDrawerQuickV3 button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfProfileDrawerV2 .cfProfileDrawerLinkV2:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfProfileDrawerV2 .cfProfileDrawerLogoutV2,
  .cfTeamManageNavV5 > button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu),
  #cfContextDrawerSectionV1 button:not(.cfBoraJogarMenu):not(.cfResenhaMenu):not(.cfTeamGoalkeeperSpotlight):not(.cfSharedGoalkeeperMenu)
):active{
  transform:translateY(1px)!important;
  filter:brightness(.91)!important;
  box-shadow:inset 0 2px 6px rgba(0,0,0,.72)!important;
}

/* As duas ações proprietárias preservam integralmente as artes premium. */
.quick.cfPlayerQuickV4 > button[data-cf-resenha],
.quick.cfPlayerQuickV4 > button[data-cf-bora-jogar]{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-shadow:none!important;
}

/* As artes aprovadas na Home são a fonte única de verdade também nos menus
   do jogador, do time e do gestor de campo. O próprio PNG forma o botão. */
html[data-theme] body :is(
  #cfProfileDrawerNavV2,
  .cfTeamManageNavV5,
  #cfContextDrawerSectionV1
) :is(.cfResenhaMenu,.cfBoraJogarMenu){
  display:block!important;
  width:100%!important;
  min-height:0!important;
  aspect-ratio:3 / 1!important;
  margin:5px 0!important;
  padding:0!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:transparent!important;
  text-align:center!important;
  filter:none!important;
}
html[data-theme] body :is(
  #cfProfileDrawerNavV2,
  .cfTeamManageNavV5,
  #cfContextDrawerSectionV1
) :is(.cfResenhaMenu,.cfBoraJogarMenu) .cfSharedFlagshipArtV1{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  image-rendering:auto!important;
  filter:none!important;
  transform:none!important;
}
html[data-theme] body :is(
  #cfProfileDrawerNavV2,
  .cfTeamManageNavV5,
  #cfContextDrawerSectionV1
) :is(.cfResenhaMenu,.cfBoraJogarMenu) .cfSharedFlagshipFallbackV1{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
}
html[data-theme] body :is(
  #cfProfileDrawerNavV2,
  .cfTeamManageNavV5,
  #cfContextDrawerSectionV1
) :is(.cfResenhaMenu,.cfBoraJogarMenu):is(:hover,[aria-current="page"]){
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  filter:brightness(1.06)!important;
  transform:translateY(-1px)!important;
}
html[data-theme] body :is(
  #cfProfileDrawerNavV2,
  .cfTeamManageNavV5,
  #cfContextDrawerSectionV1
) :is(.cfResenhaMenu,.cfBoraJogarMenu):active{
  transform:translateY(1px) scale(.985)!important;
  filter:brightness(.96)!important;
  box-shadow:none!important;
}
html[data-theme] body :is(
  #cfProfileDrawerNavV2,
  .cfTeamManageNavV5,
  #cfContextDrawerSectionV1
) :is(.cfResenhaMenu,.cfBoraJogarMenu):focus-visible{
  outline:2px solid #79aef3!important;
  outline-offset:2px!important;
}

/* Entrada e seleção de ambiente — contraste calmo e tipografia respirada. */
/* The image itself is the menu control. Override the later area theme rules. */
html[data-theme][data-cf-visual-area] body :is(#cfProfileDrawerNavV2,.cfTeamManageNavV5,#cfContextDrawerSectionV1) :is(.cfResenhaMenu,.cfBoraJogarMenu),
html[data-theme][data-cf-visual-area] body :is(#cfProfileDrawerNavV2,.cfTeamManageNavV5,#cfContextDrawerSectionV1) :is(.cfResenhaMenu,.cfBoraJogarMenu):is(:hover,[aria-current="page"]){
 display:block!important;
 box-sizing:border-box!important;
 width:100%!important;
 height:70px!important;
 min-height:0!important;
 aspect-ratio:auto!important;
 margin:5px 0!important;
 padding:0!important;
 border:0!important;
 border-radius:0!important;
 background:transparent!important;
 box-shadow:none!important;
 text-align:center!important;
 overflow:visible!important;
}
html[data-theme][data-cf-visual-area] body :is(#cfProfileDrawerNavV2,.cfTeamManageNavV5,#cfContextDrawerSectionV1) :is(.cfResenhaMenu,.cfBoraJogarMenu) .cfSharedFlagshipArtV1{
 display:block!important;
 width:100%!important;
 height:100%!important;
 object-fit:contain!important;
}
#app .cfLoginModeBg img{
  filter:brightness(.68) saturate(.88) contrast(1.04)!important;
}
#app .cfLoginModeBg::after{
  background:
    linear-gradient(180deg,rgba(1,7,4,.22) 0%,rgba(1,7,4,.34) 36%,rgba(2,8,6,.62) 67%,rgba(2,6,4,.84) 100%)!important;
}
#app .cfLoginModePanel{
  padding:22px 18px!important;
  border:1px solid rgba(133,165,180,.20)!important;
  border-radius:22px!important;
  background:rgba(8,17,23,.90)!important;
  box-shadow:0 16px 34px rgba(0,0,0,.28)!important;
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
#app .cfLoginModeK{
  letter-spacing:.19em!important;
}
#app .cfLoginModePanel h1{
  line-height:1.08!important;
  letter-spacing:.025em!important;
}
#app .cfLoginModePanel > p{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  letter-spacing:.006em!important;
  text-shadow:none!important;
}
#app .cfLoginModeCard{
  border-color:rgba(133,165,180,.22)!important;
  background:rgba(12,25,33,.88)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 5px 14px rgba(0,0,0,.16)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#app .cfLoginModeCard:hover,
#app .cfLoginModeCard:focus-visible{
  background:rgba(14,31,39,.96)!important;
  border-color:rgba(82,213,156,.40)!important;
}
#app .cfLoginModeText b{
  font-family:var(--cf-font-display)!important;
  font-weight:400!important;
  line-height:1.18!important;
  letter-spacing:.042em!important;
}
#app .cfLoginModeText span{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  line-height:1.45!important;
  letter-spacing:.012em!important;
  text-shadow:none!important;
}
#app :is(.cfLoginMode,.entryV6,.entryV62,.login) button{
  letter-spacing:.038em!important;
}

/* Anton é mais largo visualmente. Estes ajustes mantêm a grade limpa em telas
   estreitas sem alterar a altura aprovada dos controles. */
@media(max-width:430px){
  #app :is(button,.btn,[role="button"],.nav),
  .sheetBack :is(button,.btn,[role="button"]){letter-spacing:.012em}
  .quick.cfPlayerQuickV4 > button.cfPlayerSlateActionV2{font-size:12px!important}
  #app .cfLoginModePanel{padding:19px 16px!important;border-radius:20px!important}
  #app .cfLoginModePanel h1{font-size:28px!important;letter-spacing:.02em!important}
  #app .cfLoginModeCard{padding:14px 12px!important;gap:11px!important}
  #app .cfLoginModeText b{font-size:14px!important;letter-spacing:.035em!important}
}

@media(prefers-reduced-motion:reduce){
  #app :is(button,.btn,[role="button"],.nav),
  .sheetBack :is(button,.btn,[role="button"]){transition:none!important}
}
