/* FUTNEX 1.9.68 · ui68b, PC e larguras intermediárias (carregado com media="(min-width: 960px)"; tudo só vale com html.ui68).
   - html.fx-pc (a partir de 1024 px com mouse; o limite 1200 do fx-pc.js foi trocado por 1024 no patch): conteúdo até 1200 px, barra lateral sem cores de destaque nos extras,
     Início em duas colunas equilibradas, áudio flutuante fora do conteúdo, folhas como diálogos centrados de 480 a 560 px e foco visível em tudo.
   - 960 a 1199 SEM fx-pc (tablet com toque): a barra de baixo fixa e o resto são da parte A; aqui só a largura do conteúdo e as grades. */

/* ---------------------------------------------------------------- largura do conteúdo */
html.ui68.fx-pc { --pc-max: 1200px; }
html.ui68:not(.fx-pc) main#view { max-width: 1200px; margin-left: auto; margin-right: auto; }
html.ui68.fx-pc main#view { padding-bottom: 48px; }   /* o áudio flutuante saiu do canto de baixo: não precisa mais do respiro de 104 px */

/* ---------------------------------------------------------------- barra lateral: extras neutros (Passe · Sócio · Feedback · Atualizações) */
html.ui68.fx-pc .tabs .tab.lj-tab, html.ui68.fx-pc .tabs .tab.lj-fb, html.ui68.fx-pc .tabs .tab.lj-pn { min-height: 44px; margin-top: 0; background: none; box-shadow: none; color: var(--b-tx2); font: 600 15px/1 var(--font-texto); }
html.ui68.fx-pc .tabs .tab.lj-tab:hover, html.ui68.fx-pc .tabs .tab.lj-fb:hover, html.ui68.fx-pc .tabs .tab.lj-pn:hover { background: var(--b-s3); color: var(--b-tx); }
html.ui68.fx-pc .tabs .tab.lj-tab[aria-current="page"] { background: var(--b-s2); color: var(--b-tx); box-shadow: inset 0 0 0 1px var(--b-line); }
html.ui68.fx-pc .tabs .tab.lj-fb svg, html.ui68.fx-pc .tabs .tab.lj-pn svg { stroke: currentColor; }
html.ui68.fx-pc .tabs .lj-tab-sep { margin: var(--b-sp2) var(--b-sp3); background: var(--b-line); }

/* ---------------------------------------------------------------- foco visível (teclado) */
html.ui68.fx-pc :is(a, button, input, select, textarea, summary, [role="tab"], [role="radio"], [tabindex]:not([tabindex="-1"])):focus-visible { outline: 3px solid var(--focus, #f5c400); outline-offset: 2px; }
html.ui68.fx-pc .seg-b:focus-visible, html.ui68.fx-pc .tab:focus-visible { outline-offset: -2px; }

/* ---------------------------------------------------------------- Início: duas colunas equilibradas (jogo do dia e avisos à esquerda; campo e resumo à direita) */
html.ui68.fx-pc #view .home { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "head head" "dia campo" "dia info"; grid-template-rows: auto auto 1fr; gap: 24px; align-items: start; }
html.ui68.fx-pc #view .home:has(> .fx-funil) { grid-template-areas: "head head" "funil funil" "dia campo" "dia info"; grid-template-rows: auto auto auto 1fr; }
html.ui68.fx-pc #view .home > .home-head { grid-area: head; }
html.ui68.fx-pc #view .home .hq-dia { grid-area: dia; }
html.ui68.fx-pc #view .home .hq-campo { grid-area: campo; }
html.ui68.fx-pc #view .home .hq-info { grid-area: info; align-self: start; }

/* ---------------------------------------------------------------- áudio flutuante: no canto de cima do conteúdo (a faixa do topo está vazia à esquerda), o cartão abre para baixo */
html.ui68.fx-pc .fx65b-aud:not([hidden]) { top: calc(var(--fx-dev-h, 0px) + 8px); bottom: auto; right: auto; opacity: .92;
  left: calc(var(--pc-side) + var(--pc-gap) + max(0px, (100vw - var(--pc-side) - 2 * var(--pc-gap) - var(--pc-max)) / 2)); }
html.ui68.fx-pc .fx65b-aud-card { top: calc(100% + 10px); bottom: auto; right: auto; left: 0; }

/* ---------------------------------------------------------------- folhas: diálogos centrados de 480 a 560 px (a tela cheia e o lote do leilão seguem como eram) */
html.ui68.fx-pc .sheet-backdrop { align-items: center; justify-content: center; }
html.ui68.fx-pc .sheet-backdrop:not(.fx-tela) > .sheet:not(:has(.pk-lote)) { width: min(560px, calc(100vw - 48px)); min-width: min(480px, calc(100vw - 48px)); max-width: 560px; max-height: min(86vh, 780px); border-radius: var(--b-r4); border-bottom: 1px solid var(--b-line); }
html.ui68.fx-pc .sheet:before, html.ui68.fx-pc .sheet:not(.is-player-card) .sheet-topo::before { display: none; }   /* sem a alça de arrastar do celular */

/* ---------------------------------------------------------------- páginas */
/* Elenco e Álbum: mais colunas */
html.ui68.fx-pc section.sq .grid.grid-dup { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--b-sp3); }
/* filtros do Elenco: sem a moldura de linhas do PC e sem a sangria de 16 px do celular */
html.ui68.fx-pc section.sq .seg.sq-f { margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; border: 0; flex-wrap: wrap; overflow: visible; }
html.ui68.fx-pc .album { grid-template-columns: repeat(auto-fill, minmax(46px, 1fr)); }
/* Meu clube: o painel da Campanha divide a linha com o do Time; com 6 colunas ali cada célula ficava com 38 px e "Gols sofridos" quebrava letra por letra: 3 colunas nos painéis estreitos, 6 só no painel largo */
html.ui68.fx-pc .clube .panel:not(.cl-wide) .st-grid, html.ui68.fx-pc .clube .panel:not(.cl-wide) .st-grid.st-2, html.ui68.fx-pc .clube .panel:not(.cl-wide) .st-grid.st-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* Meu clube: identidade e ID lado a lado */
html.ui68.fx-pc .club-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-auto-rows: min-content; align-content: center; row-gap: var(--b-sp2); column-gap: var(--b-sp5); align-items: center; }
html.ui68.fx-pc .club-head > :not(.club-id) { grid-column: 1; }
html.ui68.fx-pc .club-head > .club-id { grid-column: 2; grid-row: 1 / span 3; margin: 0; padding: 0 0 0 var(--b-sp5); border-top: 0; border-left: 1px solid var(--b-line); max-width: 420px; }