/* ==========================================================================
   HYDRA — refino de craft
   --------------------------------------------------------------------------
   A identidade fica intacta: amarelo #fffc00, preto #0a0a0a, osso #f5f4f1,
   Bebas Neue + Barlow Condensed + Barlow. Este arquivo corrige execução —
   contraste, consistência de cinzas, ritmo de leitura, foco de teclado e
   respeito a "reduzir movimento".

   POR QUE !important E SELETOR DE ATRIBUTO
   As páginas são 100% estilo inline, que vence folha de estilo por
   especificidade. Seletor de atributo + !important é o único mecanismo
   disponível, e concentra a correção num arquivo só — fácil de auditar,
   fácil de remover.

   POR QUE CADA SELETOR INCLUI "color:"
   Casar só o valor (ex.: [style*="#2a2a2a"]) casaria a mesma string em
   QUALQUER propriedade — inclusive `border: 1px solid #2a2a2a`. Aplicar
   `color` a esse elemento faria os filhos herdarem a cor errada. Ancorar
   na propriedade (ex.: [style*="color:#2a2a2a"]) elimina isso.
   As páginas usam dois formatos, ambos cobertos:
     assadas       color: rgb(42, 42, 42)
     calculadoras  color:#2a2a2a

   SISTEMA DE CINZAS   9 tons quase iguais  →  3 por superfície

     sobre escuro (#0a0a0a / #070707 / #101010)
       alto     #f5f4f1   inalterado
       médio    #dcdcda   ← #cfcfcd, #bdbdbb, #b8b8b6
       baixo    #8f8f8a   ← #a8a8a6, #9a9a98, #7a7a78, #6a6a68, #2f2f2d, #6f6f6d
       ambiente #7d7d78   ← #5a5a58   (letreiro de modalidades)

     sobre claro (#f5f4f1 / #ffffff)
       alto     #0a0a0a   inalterado
       médio    #3a3833   inalterado
       baixo    #6b6862   ← #8a8a86, #9a9a94, #b0aea6, #b4b2ac
       numeral  #8f8c84   ← #d2d0ca   (numerais grandes dos cards)
       ouro     #6f6800   ← #8a8000, #8a7500

   Todo valor novo passa WCAG AA na superfície onde é usado.
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. TEXTO SOBRE ESCURO
   Verificado página a página: estes tons só aparecem sobre fundo escuro.
   -------------------------------------------------------------------------- */

/* médio — subtítulos e texto de apoio */
[style*="color:#cfcfcd"], [style*="color: rgb(207, 207, 205)"],
[style*="color:#bdbdbb"], [style*="color: rgb(189, 189, 187)"],
[style*="color:#b8b8b6"], [style*="color: rgb(184, 184, 182)"] {
  color: #dcdcda !important;
}

/* baixo — legendas, metadados, notas de rodapé de cartão */
[style*="color:#a8a8a6"], [style*="color: rgb(168, 168, 166)"],
[style*="color:#9a9a98"], [style*="color: rgb(154, 154, 152)"],
[style*="color:#7a7a78"], [style*="color: rgb(122, 122, 120)"],
[style*="color:#6a6a68"], [style*="color: rgb(106, 106, 104)"],
[style*="color:#6f6f6d"], [style*="color: rgb(111, 111, 109)"],
[style*="color:#2f2f2d"], [style*="color: rgb(47, 47, 45)"] {
  color: #8f8f8a !important;
}

/* Rodapé: este tom passa sobre branco (7.5) mas falha sobre #070707 (2.68).
   Escopo no <footer> para não tocar as bios em fundo claro do "sobre". */
footer [style*="color:#55554f"], footer [style*="color: rgb(85, 85, 79)"] {
  color: #8f8f8a !important;
}

/* Letreiro de modalidades. Lista os esportes atendidos — é conteúdo, não
   textura — e vinha em #5a5a58 (2.86), na fronteira do ilegível. Sobe para
   4.79, ainda claramente subordinado aos títulos em #f5f4f1. */
[style*="color:#5a5a58"], [style*="color: rgb(90, 90, 88)"] {
  color: #7d7d78 !important;
}

/* As barras "/" entre os esportes são separadores decorativos (WCAG 1.4.3
   isenta texto incidental). Sobem um pouco só para reequilibrar com o texto
   agora mais claro — continuam propositalmente discretas. */
[style*="color:#2a2a2a"], [style*="color: rgb(42, 42, 42)"] {
  color: #4f4f4b !important;
}


/* --------------------------------------------------------------------------
   2. TEXTO SOBRE CLARO
   -------------------------------------------------------------------------- */

/* baixo — o maior ganho isolado: saiu de 2.1–3.5 para 5.0+ */
[style*="color:#8a8a86"], [style*="color: rgb(138, 138, 134)"],
[style*="color:#9a9a94"], [style*="color: rgb(154, 154, 148)"],
[style*="color:#b0aea6"], [style*="color: rgb(176, 174, 166)"],
[style*="color:#b4b2ac"], [style*="color: rgb(180, 178, 172)"] {
  color: #6b6862 !important;
}

/* numerais grandes dos cards (01, 02, …) — recuados, mas presentes */
[style*="color:#d2d0ca"], [style*="color: rgb(210, 208, 202)"] {
  color: #8f8c84 !important;
}

/* ouro editorial sobre claro — 3.69 não passa em texto pequeno; 5.22 passa */
[style*="color:#8a8000"], [style*="color: rgb(138, 128, 0)"],
[style*="color:#8a7500"], [style*="color: rgb(138, 117, 0)"] {
  color: #6f6800 !important;
}

/* Exceção: o único ponto do site em que esse ouro cai sobre fundo escuro é o
   sufixo "kcal" do cartão de resultado do metabolismo. Ali a cor precisa
   clarear, não escurecer. Casa a assinatura inline exata — nada de seletor
   descendente, que vazaria para seções claras da mesma página. */
[style*="font-size:12px; color:#8a8000; margin-left:4px"] {
  color: #c8bb3d !important;
}

/* Passos inativos das calculadoras: branco sobre #c4c2bc dá 1.78. Escurece o
   disco em vez de mexer no texto, preservando a hierarquia ativo/inativo. */
[style*="background:#c4c2bc"], [style*="background: rgb(196, 194, 188)"] {
  background: #6f6d66 !important;
}


/* --------------------------------------------------------------------------
   3. RITMO DE LEITURA
   Antes: 1.4 / 1.45 / 1.5 / 1.55 / 1.6 / 1.65 — seis entrelinhas para o mesmo
   trabalho. Agora duas: 1.5 (compacto, cartões e UI) e 1.6 (prosa).
   As entrelinhas apertadas dos títulos Bebas (0.74–1.0) são intencionais e
   ficam como estão.
   -------------------------------------------------------------------------- */

[style*="line-height:1.4"]:not([style*="line-height:1.45"]),
[style*="line-height: 1.4"]:not([style*="line-height: 1.45"]),
[style*="line-height:1.45"], [style*="line-height: 1.45"] {
  line-height: 1.5 !important;
}

[style*="line-height:1.55"], [style*="line-height: 1.55"],
[style*="line-height:1.65"], [style*="line-height: 1.65"] {
  line-height: 1.6 !important;
}


/* --------------------------------------------------------------------------
   4. FOCO DE TECLADO
   O site zerava o contorno (`outline: none`), deixando quem navega por teclado
   sem nenhuma pista de onde está. O anel usa o amarelo da marca, com halo
   escuro por fora para continuar visível sobre qualquer fundo.
   -------------------------------------------------------------------------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid #fffc00 !important;
  outline-offset: 3px !important;
  border-radius: 2px;
  box-shadow: 0 0 0 5px rgba(10, 10, 10, .55) !important;
}

/* Sobre o amarelo da marca, o anel amarelo some — inverte para preto. */
a[style*="background:#fffc00"]:focus-visible,
a[style*="background: rgb(255, 252, 0)"]:focus-visible,
button[style*="background:#fffc00"]:focus-visible,
button[style*="background: rgb(255, 252, 0)"]:focus-visible {
  outline-color: #0a0a0a !important;
  box-shadow: 0 0 0 5px rgba(245, 244, 241, .65) !important;
}

/* Nos campos das calculadoras o foco também marca a borda, não só o anel. */
input:focus-visible, select:focus-visible {
  border-color: #0a0a0a !important;
}


/* --------------------------------------------------------------------------
   5. REDUZIR MOVIMENTO
   O letreiro roda em loop infinito de 32s. Para quem pediu menos movimento no
   sistema, tudo para — inclusive a rolagem suave.
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  html { scroll-behavior: auto !important; }
}


/* --------------------------------------------------------------------------
   6. DETALHES
   -------------------------------------------------------------------------- */

::selection { background: #fffc00; color: #0a0a0a; }

/* Alvo de toque nos links do rodapé no celular (eram ~15px de altura útil). */
@media (max-width: 767px) {
  footer a[style*="padding: 7px"], footer a[style*="padding:7px"] {
    padding-top: 11px !important;
    padding-bottom: 11px !important;
  }
}