/* FUTNEX 1.9.75 · app75 (E-SITE): estilo do fx-app-1975.js — a faixa da Play no topo (Chrome Android), a barra de permissão de medição no rodapé (app) e a linha de revogação da folha "Dados e privacidade".
   Só classes .fx75-*; as poucas regras sobre elementos do jogo (#fx-dev, .topbar, .api-carregando, .fxg-faixa, #view) valem SÓ com html.fx75-play / html.fx75-med-on, isto é, quando a faixa ou a barra está na tela.
   Cores e fontes do próprio jogo (variáveis do main), com padrão para o caso de a variável faltar. */

/* ---------------------------------------------------------------- A) faixa da Play (topo) */
.fx75-faixa { position: fixed; top: 0; left: 0; right: 0; z-index: 14; box-sizing: border-box; display: flex; align-items: center; padding-top: env(safe-area-inset-top, 0px);
  background: var(--fx-tinta, #13212e); color: var(--fx-cal, #f4f7fa); border-bottom: 1px solid var(--line, #2c3c4b); font: 600 14px/1.2 var(--font-texto, "Saira", system-ui, sans-serif); }
.fx75-faixa[hidden] { display: none; }
.fx75-faixa-a { flex: 1 1 auto; min-width: 0; min-height: 44px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 0 4px 0 12px; color: inherit; text-decoration: none; }
.fx75-faixa-a svg { flex: 0 0 auto; }
.fx75-faixa-t { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fx75-faixa-s { flex: 0 0 auto; opacity: .7; }
.fx75-faixa-b { flex: 0 0 auto; color: var(--fx-amarelo, #f5c400); font-weight: 800; letter-spacing: .02em; white-space: nowrap; }
.fx75-faixa-x { flex: 0 0 auto; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; background: transparent; color: inherit; font: 400 26px/1 system-ui, sans-serif; cursor: pointer; }
.fx75-faixa-a:focus-visible, .fx75-faixa-x:focus-visible { outline: 2px solid var(--fx-amarelo, #f5c400); outline-offset: -3px; }
/* empurra o conteúdo (igual à faixa de cookies embaixo): --fx75-h é a altura medida da faixa (com a área do entalhe); o #fx-dev e tudo que parte do topo descem junto */
html.fx75-play { --fx75-h: calc(env(safe-area-inset-top, 0px) + 45px); scroll-padding-top: calc(var(--fx75-h) + var(--fx-dev-h, 0px) + var(--fx-top-h, 61px)); }
html.fx75-play:root { padding-top: calc(var(--fx75-h) + var(--fx-dev-h, 0px)); }
html.fx75-play .fx-dev { top: var(--fx75-h); padding-top: 0; }
html.fx75-play .topbar { top: calc(var(--fx75-h) + var(--fx-dev-h, 0px)); }
html.fx75-play .api-carregando { top: calc(var(--fx75-h) + var(--fx-dev-h, 0px) + 10px); }
html.fx75-play .fxg-faixa { top: calc(var(--fx75-h) + var(--fx-dev-h, 0px) + var(--fx-top-h, 61px)); }

/* ---------------------------------------------------------------- B) barra de permissão de medição (rodapé, acima das abas) */
.fx75-med { position: fixed; left: 10px; right: 10px; bottom: calc(var(--tabs-h, 62px) + env(safe-area-inset-bottom, 0px) + 8px); z-index: 12; box-sizing: border-box; display: grid; gap: 4px 10px; padding: 14px 14px 2px;
  border-radius: 16px; background: var(--panel, #13212e); color: var(--text, #f4f7fa); border: 1px solid var(--line-strong, #5a6e82); box-shadow: 0 8px 28px rgba(0, 0, 0, .45);
  font: 500 14px/1.4 var(--font-texto, "Saira", system-ui, sans-serif); max-width: 560px; margin: 0 auto; }
.fx75-med[hidden] { display: none; }
.fx75-med-t { margin: 0; }
.fx75-med-b { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fx75-b { min-height: 44px; box-sizing: border-box; padding: 0 12px; border-radius: 12px; border: 1px solid var(--line-strong, #5a6e82); background: transparent; color: var(--text, #f4f7fa);
  font: 700 15px/1.1 var(--font-texto, "Saira", system-ui, sans-serif); cursor: pointer; }
.fx75-b-p { background: var(--accent, #f5c400); border-color: var(--accent, #f5c400); color: var(--on-accent, #13212e); }
.fx75-b:focus-visible, .fx75-med-l:focus-visible { outline: 2px solid var(--accent, #f5c400); outline-offset: 2px; }
.fx75-med-l { justify-self: center; min-height: 44px; padding: 0 8px; border: 0; background: transparent; color: var(--text-2, #9aabbb); text-decoration: underline;
  font: 600 13px/1.2 var(--font-texto, "Saira", system-ui, sans-serif); cursor: pointer; }
/* o conteúdo ganha espaço para rolar até acima da barra */
html.fx75-med-on #view { margin-bottom: var(--fx75-med-h, 0px); }

/* ---------------------------------------------------------------- C) linha de revogação na folha "Dados e privacidade" */
.fx75-linha { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 14px 0; padding: 12px 0; border-top: 1px solid var(--line, #2c3c4b); border-bottom: 1px solid var(--line, #2c3c4b); }
.fx75-linha-t { min-width: 0; font: 600 15px/1.3 var(--font-texto, "Saira", system-ui, sans-serif); color: var(--text, #f4f7fa); }
.fx75-linha-t strong { font-weight: 800; }
.fx75-linha .fx75-b { flex: 0 0 auto; min-width: 104px; }

@media (prefers-reduced-motion: no-preference) {
  .fx75-med { animation: fx75-sobe .25s ease-out; }
  @keyframes fx75-sobe { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }
}