/* V50 — ACABAMENTO GLOBAL 10/10 + LEGIBILIDADE + CONSOLIDAÇÃO VISUAL */
:root {
  --v50-ink: #18394f;
  --v50-copy: #36586d;
  --v50-muted: #526f80;
  --v50-subtle: #637b89;
  --v50-line: #d4e1e8;
  --v50-line-strong: #bed0db;
  --v50-card: #ffffff;
  --v50-card-soft: #f5f9fb;
  --v50-blue: #146ecb;
  --v50-green: #13734d;
  --v50-amber: #805708;
  --v50-red: #9d3341;
  --v50-violet: #554793;
  --v50-shadow: 0 7px 20px rgba(29, 65, 87, .065);
}

body { color: var(--v50-ink); }
.page-heading p,
.section-head p,
.action-copy small,
.main-menu-route small,
.settings-line small,
.field > small,
.help-text,
.modal-summary,
.notice span { color: var(--v50-muted); }

/* Hierarquia geral: densa, legível e sem microtexto espremido. */
.section-kicker { font-size: 10.5px; line-height: 1.25; }
.app-version-badge { min-height: 18px; padding: 2px 6px; font-size: 9.5px; }
.nav-item b { font-size: 10.5px; font-weight: 800; }
.page-heading p { font-size: 12.5px; }
.field > label,
.draw-separation-picker label > span { color: #456477; font-size: 11.5px; font-weight: 800; }
.field > small { font-size: 11px; line-height: 1.45; }
.settings-line small { font-size: 11px; line-height: 1.45; }
.notice span { font-size: 11.5px; }
.count-chip { min-height: 31px; font-size: 10.5px; }

/* Jogadores */
.player-card .profile-copy > span { color: var(--v50-muted); font-size: 11px; }
.profile-stats > .player-meta-chip { min-height: 31px; padding: 5px 8px; gap: 5px; }
.profile-stats > .player-meta-chip > .icon { width: 14px; height: 14px; }
.profile-stats > .player-meta-chip small { color: #607a8a; font-size: 9.5px; line-height: 1.1; }
.profile-stats > .player-meta-chip b { font-size: 11px; }
.rank-badge .rank-badge-copy > small { font-size: 10px; }
.rank-badge .rank-badge-copy > em { font-size: 10.5px; }
.player-footer .tier-copy,
.readonly-label { color: var(--v50-muted); font-size: 10.5px; }
.shirt-number { font-size: 10px !important; }

/* Presença */
.presence-round-date span { font-size: 10.5px; }
.presence-round-copy span { color: var(--v50-muted); font-size: 11px; }
.presence-round-state { font-size: 10.5px; }
.presence-counts button small { font-size: 10.5px; }
.presence-status { font-size: 10.5px; }
.presence-player-row .profile-copy small,
.presence-group summary small,
.presence-admin-tools > summary small { color: var(--v50-muted); font-size: 11px; }
.participant-row .profile-copy > small { color: var(--v50-muted); font-size: 11px; line-height: 1.4; }

/* Sorteio: regras opcionais ficam recolhidas e o fluxo principal respira. */
.draw-advanced-tools {
  margin-top: 12px;
  overflow: hidden;
  background: var(--v50-card);
  border: 1px solid var(--v50-line);
  border-radius: 17px;
  box-shadow: var(--v50-shadow);
}
.draw-advanced-tools > summary {
  min-height: 58px;
  padding: 10px 12px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  color: var(--v50-ink);
  cursor: pointer;
  list-style: none;
}
.draw-advanced-tools > summary::-webkit-details-marker { display: none; }
.draw-advanced-tools > summary > .icon { width: 20px; height: 20px; color: var(--v50-blue); }
.draw-advanced-tools > summary > span { min-width: 0; display: grid; gap: 2px; }
.draw-advanced-tools > summary b { font-size: 12.5px; }
.draw-advanced-tools > summary small { color: var(--v50-muted); font-size: 10.5px; line-height: 1.35; }
.draw-advanced-tools > summary strong {
  padding: 5px 8px;
  color: #1c679f;
  background: #edf6fc;
  border: 1px solid #d2e5f1;
  border-radius: 999px;
  font-size: 10px;
  white-space: nowrap;
}
.draw-advanced-tools[open] > summary { border-bottom: 1px solid #e2ebef; }
.draw-advanced-body { padding: 0 12px 12px; }
.draw-advanced-body .draw-separation.panel { margin-top: 12px; padding: 12px; box-shadow: none; }
.draw-separation-head small,
.draw-separation-empty,
.draw-separation-list > small { color: var(--v50-muted); font-size: 11px; }
.draw-separation-list > span { font-size: 10.5px; }
.draw-separation-list > span b { font-size: 10px; }
.draw-balance-help summary small,
.draw-balance-help summary strong,
.draw-balance-help p { font-size: 10.5px; }
.level-token { min-width: 68px; }
.level-token > span small { font-size: 9.5px; }
.level-token > span em { font-size: 10px; }
.team-rank-token > span small { font-size: 10px; }
.captain-badge { font-size: 9.5px; }

/* Resultado e histórico */
.premium-result-tabs .result-tab { min-height: 48px; }
.premium-result-tabs .result-tab > span:last-child { font-size: 11.5px; font-weight: 850; }
.history-summary small,
.history-main > small,
.history-main > em { color: var(--v50-muted); font-size: 10.5px; }
.history-main > b { font-size: 11.5px; }
.history-side strong { font-size: 10.5px !important; }
.placard-card > header span,
.placard-card > header time,
.placard-card > footer { font-size: 10.5px; }
.placard-team small { font-size: 10px; }
.bad-rank-hero small,
.bad-rank-count small { font-size: 10px; }

/* Gráficos/resumos */
.v42-chart > header > strong,
.v42-bar-row > span,
.v42-bar-row > strong,
.presence-chart-legend > span > b,
.presence-chart-legend > span > small,
.recent-results-grid h3 small,
.recent-result-team > em,
.rank-evolution-bars > span > b,
.rank-evolution-bars > span > small { font-size: 10.5px; }

/* Disciplina */
.discipline-summary-grid small { color: var(--v50-muted); font-size: 10.5px; }
.discipline-summary-grid span { color: var(--v50-muted); font-size: 11px; }
.discipline-chip,
.discipline-poll-meta span,
.discipline-vote-note { font-size: 10.5px; }

/* Quadra: mantém PAGO / PENDENTE / ISENTO e melhora leitura. */
.court-summary-grid small { color: #4d697a; font-size: 10.5px; }
.court-summary-grid span { color: var(--v50-muted); font-size: 11px; }
.court-charge-meta small { color: var(--v50-muted); font-size: 10.5px; }
.court-charge-meta b { font-size: 12px; }
.court-payment-row > span:first-child small { color: var(--v50-muted); font-size: 11px; }
.court-status { min-height: 34px; padding-inline: 9px; font-size: 10.5px; }
.court-selected-count { font-size: 10.5px; }
.court-player-picker small { color: var(--v50-muted); font-size: 11px; }
.court-recreate-action em,
.recommended-chip { font-size: 9.5px; }
.court-recommended-note small,
.court-picker-head small,
.court-exempt-note,
.share-option small { color: var(--v50-muted); font-size: 11px; }

/* Configurações: risco fica recolhido por padrão. */
.danger-zone {
  margin-top: 18px;
  padding: 0;
  overflow: hidden;
  background: #fff9f9;
  border: 1px solid #e7cbd0;
  border-radius: 18px;
  box-shadow: 0 5px 16px rgba(92, 38, 48, .045);
}
.danger-zone > summary {
  min-height: 62px;
  padding: 11px 12px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  list-style: none;
}
.danger-zone > summary::-webkit-details-marker { display: none; }
.danger-zone-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: var(--v50-red);
  background: #fff0f2;
  border: 1px solid #f0d6da;
  border-radius: 12px;
}
.danger-zone-icon .icon { width: 19px; height: 19px; }
.danger-zone-summary { min-width: 0; display: grid; gap: 2px; }
.danger-zone-summary b { color: #7f303b; font-size: 12.5px; }
.danger-zone-summary small { color: #765d64; font-size: 10.5px; line-height: 1.35; }
.danger-zone > summary > strong {
  padding: 5px 8px;
  color: #8b3440;
  background: #fff;
  border: 1px solid #ecd2d6;
  border-radius: 999px;
  font-size: 9.5px;
}
.danger-zone[open] > summary { border-bottom: 1px solid #eddadd; }
.danger-zone-body { padding: 13px; }
.danger-zone-body h2 { margin: 5px 0 4px; color: #82323d; font-size: 18px; }
.danger-zone-body > p { margin: 0 0 12px; color: #765d64; font-size: 11px; line-height: 1.45; }
.danger-action small { font-size: 10.5px; line-height: 1.4; }

/* Foco e interação consistentes sem efeitos artificiais. */
.draw-advanced-tools > summary:focus-visible,
.danger-zone > summary:focus-visible,
.result-tab:focus-visible,
.nav-item:focus-visible,
.player-card:focus-visible,
.btn:focus-visible,
.icon-button:focus-visible {
  outline: 3px solid rgba(20, 110, 203, .22);
  outline-offset: 2px;
}

@media (max-width: 430px) {
  .profile-stats > .player-meta-chip { min-height: 30px; padding-inline: 7px; }
  .profile-stats > .player-meta-chip b { font-size: 10.5px; }
  .premium-result-tabs .result-tab { min-height: 47px; padding: 5px 7px; }
  .premium-result-tabs .result-tab > span:last-child { font-size: 11px; }
  .history-main > b { font-size: 11px; }
  .draw-advanced-tools > summary,
  .danger-zone > summary { grid-template-columns: auto minmax(0, 1fr); }
  .draw-advanced-tools > summary > strong,
  .danger-zone > summary > strong { grid-column: 2; justify-self: start; }
}

@media (max-width: 350px) {
  .nav-item b { font-size: 10px; }
  .profile-stats { gap: 5px; }
  .profile-stats > .player-meta-chip { min-width: 0; padding-inline: 6px; }
  .level-token { min-width: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  .draw-advanced-tools,
  .danger-zone { scroll-behavior: auto; }
}


/* =========================================================
   V51 — REFINO VISUAL FINAL + CONTRATO CANÔNICO
   - camada visual atual isolada do CSS legado
   - microtipografia mínima reforçada
   - ícones PNG como sistema único de interface
   ========================================================= */

:root {
  --v51-micro: 10.5px;
  --v51-meta: 11px;
  --v51-line: #d9e5eb;
  --v51-muted: #526d7d;
}

/* O aplicativo usa somente os PNGs locais de /icons/ui como iconografia de interface. */
img.icon,
img.rank-emblem,
img.form-icon {
  image-rendering: auto;
  user-select: none;
  -webkit-user-drag: none;
}

/* Legibilidade: elimina os últimos microtextos persistentes abaixo de 10,5 px. */
.nav-item b,
.rank-badge > span,
.shirt-number,
.profile-stats span,
.tier-copy,
.readonly-label,
.field > small,
.count-chip,
.level-token small,
.team-card header span,
.team-card header > strong small,
.team-player b em,
.team-player span small,
.team-player > strong small,
.placard-team small,
.bad-rank-hero small,
.bad-rank-count small,
.captain-rank-hero small,
.captain-rank-record small,
.profile-level-card span,
.profile-level-card small,
.profile-detail-grid small,
.settings-line small,
.danger-action small,
.crowd-rank-hero small,
.crowd-rank-count small,
.community-game-main small,
.community-game-card > footer,
.community-status,
.community-poll-head p,
.community-official-compare small,
.community-vote-count small,
.community-vote-count em,
.community-comment header time,
.community-comment > span,
.community-identity label,
.community-identity label small,
.community-identity > small,
.community-section-title small,
.community-voters summary,
.community-voter-chips span,
.recommended-chip {
  font-size: var(--v51-micro);
}

.profile-copy small,
.participant-row .profile-copy > small,
.presence-player-row .profile-copy small,
.presence-group summary small,
.history-summary small,
.history-main > small,
.history-main > em,
.court-summary-grid span,
.court-payment-row > span:first-child small,
.court-player-picker small,
.court-recommended-note small,
.court-picker-head small,
.court-exempt-note,
.share-option small {
  font-size: var(--v51-meta);
}

/* Selos ficam compactos, mas sem texto microscópico. */
.captain-badge,
.reveal-captain,
.draw-live,
.draw-kicker,
.reveal-team,
.equilibrium-seal,
.draw-advanced-tools > summary > strong,
.danger-zone > summary > strong,
.court-selected-count {
  font-size: var(--v51-micro);
}

/* Resultados e comunidade: o estado ativo ganha hierarquia sem aumentar a altura. */
.premium-result-tabs .result-tab {
  border-color: transparent;
}
.premium-result-tabs .result-tab.active,
.premium-result-tabs .result-tab[aria-selected="true"] {
  color: #0d63b5;
  background: #eef6ff;
  border-color: #cfe3f6;
  box-shadow: inset 0 -2px 0 #146ecb;
}

/* Consistência de cards e divisores nas áreas mais densas. */
.player-card,
.participant-row,
.history-row,
.community-game-card,
.discipline-case-card,
.court-charge-card {
  border-color: var(--v51-line);
}

/* A versão é informação auxiliar, mas continua legível. */
.app-version-badge { font-size: 9.5px; }

@media (max-width: 430px) {
  .nav-item b { font-size: 10.5px; }
  .premium-result-tabs .result-tab > span:last-child { font-size: 11px; }
  .community-status,
  .captain-badge,
  .court-status { font-size: 10.5px; }
}

@media (max-width: 350px) {
  .nav-item b { font-size: 10.5px; }
  .team-player span small,
  .team-player > strong small { font-size: 10.5px; }
}

@media (prefers-reduced-motion: reduce) {
  .nav-item > img.icon { transition: none; transform: none; }
}


/* =========================================================
   V52 — ATUALIZAÇÃO INTELIGENTE + HIGIENE VISUAL FINAL
   - atualização consentida e segura do PWA
   - menos blur em superfícies persistentes
   - últimos microtextos persistentes reforçados
   ========================================================= */

:root {
  --v52-micro: 10.5px;
  --v52-meta: 11px;
  --v52-overlay: rgba(18, 39, 53, .58);
}

/* Performance: superfícies fixas quase opacas não precisam de blur pesado. */
.topbar,
.bottom-nav {
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.sticky-action {
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}
.modal-header {
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.modal-backdrop {
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
.live-sync-pill {
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  font-size: var(--v52-micro);
}

/* Últimos textos persistentes que ainda podiam parecer microscópicos. */
.app-version-badge,
.profile-stats > .player-meta-chip small,
.level-token > span small,
.captain-badge,
.recommended-chip,
.home-spotlight-copy small,
.home-spotlight-stat small,
.action-copy small,
.home-last-draw-head small,
.home-last-team small,
.presence-counts button span,
details.presence-notification > summary small,
.presence-platform-note,
.presence-admin-tools > summary small,
.draw-balance-help summary small,
.draw-balance-help summary strong,
.participant-row .profile-copy > span,
.sticky-action-count small,
.team-player-copy > small,
.team-position,
.team-rank-token small,
.premium-ranking-hero.compact small,
.podium-copy small,
.podium-record small,
.history-status,
.premium-placard .placard-team > em:not(.placard-winner-mark),
.placard-bad.premium small,
.recent-form-badge,
.recent-form-summary small {
  font-size: var(--v52-micro) !important;
}

/* Prompt próprio: não disputa o modal de formulários e nunca recarrega sem consentimento. */
body.update-open { overflow: hidden; }
.update-prompt {
  position: fixed;
  z-index: 520;
  inset: 0;
  padding: max(16px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  display: grid;
  place-items: center;
}
.update-prompt.hidden { display: none; }
.update-prompt-backdrop {
  position: absolute;
  inset: 0;
  background: var(--v52-overlay);
}
.update-prompt-card {
  position: relative;
  width: min(100%, 430px);
  padding: 22px;
  display: grid;
  justify-items: center;
  gap: 9px;
  color: #17384d;
  text-align: center;
  background: #fff;
  border: 1px solid #d2e1e9;
  border-radius: 22px;
  box-shadow: 0 24px 70px rgba(20, 48, 66, .25);
}
.update-prompt-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  background: #eaf4ff;
  border: 1px solid #cfe4f8;
  border-radius: 16px;
}
.update-prompt-icon .icon { width: 27px; height: 27px; }
.update-prompt-version {
  padding: 4px 8px;
  color: #0d63b5;
  background: #eef6ff;
  border: 1px solid #d2e6f8;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}
.update-prompt-card h2 { margin: 2px 0 0; font-size: 20px; letter-spacing: -.02em; }
.update-prompt-card p { margin: 0; color: #526d7d; font-size: 12.5px; line-height: 1.5; }
.update-prompt-card > small { color: #607887; font-size: 10.5px; line-height: 1.4; }
.update-prompt-actions { width: 100%; margin-top: 5px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 9px; }
.update-prompt-actions .btn { min-height: 48px; }

@media (max-width: 430px) {
  .update-prompt { place-items: end center; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
  .update-prompt-card { padding: 20px 16px calc(18px + env(safe-area-inset-bottom)); border-radius: 22px 22px 18px 18px; }
}

@media (max-width: 350px) {
  .update-prompt-actions { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .update-prompt-card,
  .update-prompt-icon { animation: none; transition: none; }
}
