/* Ranking público: identidad del torneo, sin fondos fotográficos. */
body[data-page="ranking"] {
  --text: #f8f5eb;
  --muted: #d8e5df;
  --gold: #f2c354;
  --teal: #f2c354;
  --silver: #c3d3d1;
  --bronze: #ce8b54;
  background: radial-gradient(ellipse at 50% 42%, #004f50 0, #003a3f 43%, #00282f 100%);
  background-attachment: fixed;
}
.icon-definitions { position: absolute; width: 0; height: 0; overflow: hidden; }
.topbar { width: 100%; height: 80px; padding: 0 max(40px, calc((100% - 1588px)/2)); border-bottom: 2px solid #b89c4a; background: linear-gradient(105deg, #004d50, #002c32); position: relative; }
.topbar::after { content: ''; position: absolute; top: 0; left: 64%; width: 68px; height: 56px; border-left: 7px solid #efbd4e; border-right: 7px solid #8b9d57; transform: skew(-42deg); opacity: .85; pointer-events: none; }
.brand { gap: 19px; }
.brand-mark { width: 120px; height: 64px; border: 0; background: none; transform: none; }
.brand-mark svg { width: 100%; height: 100%; stroke: #faf7ec; stroke-width: 1.5; }
.brand-copy strong { font-size: 34px; letter-spacing: .015em; }
.brand-copy small { color: #f1f1e8; font-family: var(--display); font-size: 16px; font-weight: 500; letter-spacing: .15em; }
.topbar-status { gap: 24px; }
.live-status { padding: 9px 16px; border: 1px solid #d2ded7; border-radius: 18px; font: 700 22px/1 var(--display); letter-spacing: .02em; }
.live-dot { width: 10px; height: 10px; background: #ff2639; box-shadow: 0 0 7px 3px #ff394d; }
.updated-at { display: block; border-left: 1px solid #f2eee0; padding-left: 24px; color: #ecebdc; font: 400 18px var(--display); }
.hero, .ranking-workspace, footer { width: min(1588px, calc(100% - 80px)); }
.hero { min-height: 195px; }
.hero-contours { display: none; }
.hero-copy { padding: 8px 0 16px; max-width: 1110px; position: relative; z-index: 1; }
.hero h1 { font-size: clamp(46px, 5.5vw, 90px); line-height: .97; letter-spacing: -.015em; }
.hero h1 span { display: block; }
.hero h1 span:last-child { color: var(--gold); font-size: .64em; line-height: 1.1; margin-top: 3px; }
.hero-copy > p:last-child { margin-top: 5px; font-size: clamp(14px, 1.35vw, 22px); line-height: 1.25; color: #e7ede4; }
.tournament-signature { display: flex; align-items: center; gap: 8px; position: absolute; right: 0; top: 22px; color: #e9e9d5; }
.tournament-signature span { font: 700 40px/.95 'Caveat', cursive; transform: rotate(-12deg); position: relative; }
.tournament-signature span::after { content: ''; display: block; height: 5px; margin: 12px 0 0 8px; border-radius: 100%; background: var(--gold); transform: rotate(-5deg); }
.tournament-signature svg { width: 145px; fill: none; stroke: #b99b4d; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.ranking-workspace { margin-bottom: 30px; }
.ranking-navigation { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 9px; }
.ranking-navigation p { margin: 0; display: flex; flex-direction: column; gap: 3px; font-size: 12px; line-height: 1.4; color: #e6eadb; }
.ranking-navigation strong { color: var(--gold); font-weight: 800; }
.ranking-navigation-buttons { display: flex; gap: 7px; flex-shrink: 0; }
.ranking-navigation-buttons button { width: 44px; height: 44px; display: grid; place-items: center; padding: 0; border: 1px solid #c7bea2; border-radius: 12px; background: #eee8d9; color: #00363c; cursor: pointer; }
.ranking-navigation-buttons button:disabled { background: transparent; color: #9eafaa; border-color: #607b77; cursor: default; }
.ranking-navigation-buttons button:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.ranking-navigation-buttons svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ranking-tabs-wrap { border: 1px solid #faf4e1; border-radius: 23px; background: #eee8d9; box-shadow: 0 4px 14px #001f2433; }
.ranking-tabs { display: grid; grid-template-columns: 1.08fr repeat(5, 1fr) 1.25fr; overflow: auto; }
.ranking-tab { min-height: 58px; padding: 0 18px; border: 0; border-right: 1px solid #cfc5ac; border-bottom: 0; color: #002d36; font: 500 22px/1 var(--display); gap: 15px; }
.ranking-tab.is-active { color: #002b32; border: 0; background: linear-gradient(130deg, #f5d06d, #e5b94a); border-radius: 21px; box-shadow: inset 0 0 0 2px #ffe299; font-weight: 700; }
.ranking-tab:hover { background: #e4dac1; color: #002c32; }
.ranking-tab.is-active:hover { background: #f2c354; }
.tab-icon { width: 29px; height: 29px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.toolbar { margin: 18px 20px 0; padding: 0; min-height: 60px; align-items: start; }
.toolbar-label { color: var(--gold); font: 600 16px/1.15 var(--display); letter-spacing: .2em; margin-bottom: 4px; }
.toolbar h2 { font-size: 36px; letter-spacing: .015em; }
.toolbar .toolbar-label::after { content: ''; display: inline-block; width: 62px; height: 2px; background: var(--gold); margin: 0 0 4px 16px; }
.search-box { width: min(440px, 38vw); height: 48px; border: 1px solid #eee9d8; border-radius: 15px; background: #002e354d; }
.search-box input { color: #f8f4e8; font: 400 20px var(--display); }
.search-box svg { stroke: #edf3e5; }
.search-shortcut { display: none; }
.podium-section { min-height: 185px; padding: 0 10px; margin-top: 92px; }
.podium-section::before { display: none; }
.podium-container { gap: 14px; }
.podium-card { padding-top: 48px; isolation: isolate; --medal: #b9ccca; --edge: #d2e1dd; --plaque: linear-gradient(130deg, #d8e3db, #a5bcb9); }
.podium-card.rank-1 { padding-top: 55px; --medal: #f2c354; --edge: #efbc43; --plaque: linear-gradient(125deg, #fbe2a0, #edc568); }
.podium-card.rank-3 { --medal: #ce8b54; --edge: #cf8945; --plaque: linear-gradient(125deg, #e9c29b, #ce9569); }
.podium-card::before { content: ''; position: absolute; z-index: -1; top: 25px; right: 0; bottom: 0; left: 0; border: 2px solid var(--edge); border-radius: 20px; background: linear-gradient(115deg, var(--medal), #ffffff25); }
.rank-1.podium-card::before { top: 4px; background: linear-gradient(115deg, #c89424, #f3cd61); }
.podium-rank, .rank-1 .podium-rank { position: absolute; top: -24px; z-index: 2; color: var(--medal); font: 800 76px/.9 var(--display); text-shadow: 0 3px 2px #00272d; }
.rank-1 .podium-rank { top: -61px; font-size: 116px; }
.podium-laurel { position: absolute; top: -30px; width: 126px; height: 93px; fill: none; stroke: currentColor; color: var(--medal); stroke-width: 1.4; margin: 0; letter-spacing: normal; }
.rank-1 .podium-laurel { top: -53px; width: 172px; height: 105px; color: var(--medal); }
.rank-3 .podium-laurel { color: var(--medal); }
.podium-plaque { width: 100%; border-radius: 28px 28px 16px 16px; padding: 17px 18px 12px; background: var(--plaque); color: #002d36; border: 1px solid #ffffff55; min-height: 125px; }
.podium-name { color: #002d36; font-size: clamp(20px, 1.65vw, 28px); letter-spacing: -.01em; line-height: 1.05; }
.podium-club { color: #07353b; font: 500 19px/1 var(--display); letter-spacing: .01em; margin-top: 5px; }
.podium-stats { margin: 10px 0 0; padding-top: 9px; border-top: 1px solid #16454b55; justify-content: center; gap: 18px; color: #002d36; font: 500 22px/1.1 var(--display); }
.podium-stats span { flex: 1; text-align: center; }
.podium-stats strong, .rank-1 .podium-stats strong { flex: 1; border-left: 1px solid #16454b77; color: #002d36; font: 800 30px/1 var(--display); white-space: nowrap; }
.podium-stats strong small { font-size: .65em; font-weight: 600; margin-left: 5px; }
.ranking-tab:focus-visible { outline-color: #00434a; outline-offset: -5px; }
.standings { margin-top: 14px; padding: 10px 12px 12px; border-radius: 26px; background: #f3eddf; color: #002f38; border: 1px solid #fff6de; box-shadow: 0 10px 25px #001b2433; }
.standings-head { margin: 0 20px 6px; align-items: end; }
.standings-head .toolbar-label { color: #09353c; font-size: 14px; }
.standings-head h3 { font-size: 34px; line-height: .95; }
.results-count { color: #173d43; font: 500 20px var(--display); }
.rank-table { border-color: #dcd4c0; border-radius: 20px; box-shadow: none; background: transparent; }
.rank-table-head, .list-row { grid-template-columns: 7% minmax(190px, 1.2fr) minmax(160px, 1.3fr) 13% 13%; padding: 0 26px; }
.rank-table-head { min-height: 36px; background: #00434a; color: #f7f0df; font: 600 18px var(--display); letter-spacing: .12em; }
.list-row { min-height: 34px; border-top: 0; background: #f5efdf; }
.list-row:nth-child(even) { background: #eae4d4; }
.list-row:hover { background: #e5d6ae; }
.list-row > span { padding: 5px 10px; border-left: 1px solid #dbd2bd77; }
.list-row > span:first-child { border: 0; padding-left: 0; }
.rank-position { color: #002d36; font-size: 22px; }
.rank-name { font-size: 21px; letter-spacing: -.005em; }
.rank-club { color: #153a40; font: 500 20px/1.1 var(--display); }
.rank-captures { color: #002d36; font-size: 21px; }
.rank-score { color: #00787b; font-size: 25px; }
.rank-captures small, .rank-score small { color: #173a40; font: 500 14px var(--display); margin-left: 7px; }
.empty-state { color: #173a40; }
footer { margin: 0 auto; color: #c5d5ca; border-top: 1px solid #b99c4966; padding: 16px 0; }
@media (max-width: 1300px) {
  .tournament-signature { display: none; }
  .hero-copy { max-width: 100%; }
  .ranking-tab { padding: 0 12px; gap: 9px; font-size: 19px; }
  .podium-stats { gap: 9px; font-size: 19px; }
  .podium-stats strong, .rank-1 .podium-stats strong { font-size: 26px; }
}
@media (max-width: 900px) {
  .topbar { padding: 0 22px; height: 74px; }
  .topbar::after { display: none; }
  .brand-mark { width: 65px; height: 48px; }
  .brand-copy strong { font-size: 26px; }
  .brand-copy small { font-size: 12px; }
  .updated-at { display: none; }
  .hero, .ranking-workspace, footer { width: calc(100% - 40px); max-width: none; }
  .hero { min-height: 170px; }
  .hero h1 { font-size: 62px; }
  .ranking-tabs { display: flex; }
  .ranking-tab { flex: 0 0 auto; min-height: 54px; padding: 0 20px; }
  .toolbar { margin: 18px 0 0; }
  .toolbar h2 { font-size: 29px; }
  .toolbar-label { font-size: 12px; }
  .toolbar .toolbar-label::after { display: none; }
  .podium-name { white-space: normal; min-height: 2.1em; font-size: 22px; }
  .podium-club { font-size: 16px; }
  .podium-plaque { padding: 14px 8px 12px; }
  .podium-stats { gap: 5px; font-size: 17px; }
  .podium-stats strong, .rank-1 .podium-stats strong { font-size: 23px; }
  .rank-table-head, .list-row { grid-template-columns: 7% minmax(170px, 1.3fr) minmax(110px, 1fr) 12% 14%; padding: 0 12px; }
}
@media (max-width: 600px) {
  .topbar { padding: 0 16px; height: 72px; gap: 8px; }
  .brand { gap: 7px; }
  .brand-mark { width: 50px; height: 43px; }
  .brand-copy strong { font-size: 22px; }
  .brand-copy small { display: block; font-size: 10px; }
  .live-status { font-size: 15px; padding: 8px 10px; gap: 6px; }
  .live-dot { width: 7px; height: 7px; }
  .hero, .ranking-workspace, footer { width: calc(100% - 28px); }
  .hero { min-height: 170px; }
  .hero-copy { padding: 22px 0; }
  .hero h1 { font-size: clamp(32px, 8.5vw, 49px); line-height: 1; }
  .hero h1 span:last-child { font-size: .79em; line-height: 1.05; margin-top: 5px; }
  .hero-copy > p:last-child { margin-top: 10px; max-width: none; font-size: 12px; line-height: 1.5; }
  .ranking-tabs-wrap { margin-right: 0; border-right: 1px solid #faf4e1; border-radius: 16px; }
  .ranking-tab { min-height: 48px; font-size: 18px; padding: 0 16px; }
  .ranking-tab.is-active { border-radius: 15px; }
  .tab-icon { width: 23px; height: 23px; }
  .toolbar { display: flex; flex-direction: column; align-items: stretch; gap: 12px; margin: 18px 0 0; }
  .toolbar h2 { font-size: 30px; }
  .search-box { width: 100%; height: 44px; }
  .search-box input { font-size: 18px; }
  .podium-section { min-height: 238px; margin-top: 76px; padding: 0; }
  .podium-container { gap: 5px; }
  .podium-card { padding-top: 35px; }
  .podium-card.rank-1 { padding-top: 48px; }
  .podium-card::before { top: 20px; border-radius: 13px; }
  .rank-1.podium-card::before { top: 0; }
  .podium-rank { font-size: 55px; top: -24px; }
  .rank-1 .podium-rank { font-size: 80px; top: -42px; }
  .podium-laurel { width: 80px; height: 64px; top: -25px; }
  .rank-1 .podium-laurel { width: 110px; height: 75px; top: -35px; }
  .podium-plaque { min-height: 160px; padding: 12px 5px; border-radius: 15px 15px 11px 11px; }
  .podium-name { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; min-height: 3.15em; max-height: 3.15em; white-space: normal; font-size: clamp(15px, 4.2vw, 22px); }
  .podium-club { font-size: 13px; min-height: 2em; line-height: 1; white-space: normal; }
  .podium-stats { flex-direction: column; align-items: stretch; font-size: 15px; gap: 5px; padding-top: 7px; margin-top: 7px; }
  .podium-stats strong, .rank-1 .podium-stats strong { font-size: 22px; border-left: 0; }
  .podium-stats strong small { display: block; margin: 3px 0 0; font-size: 12px; }
  .standings { padding: 10px 6px 7px; border-radius: 18px; margin-top: 16px; }
  .standings-head { margin: 0 8px 9px; }
  .standings-head h3 { font-size: 29px; }
  .standings-head .toolbar-label { font-size: 11px; }
  .results-count { font-size: 15px; }
  .rank-table { border-radius: 12px; }
  .rank-table-head, .list-row { display: grid; grid-template-columns: 29px minmax(0, 1fr) 71px; padding: 0 8px; }
  .rank-table-head { min-height: 32px; font-size: 12px; letter-spacing: .07em; }
  .rank-table-head span:nth-child(3), .rank-table-head span:nth-child(4), .rank-club, .rank-captures { display: none; }
  .rank-table-head span:nth-child(2) { text-align: left; }
  .list-row { min-height: 59px; }
  .list-row > span { padding: 9px 4px; border-left: 0; }
  .rank-position { font-size: 20px; }
  .rank-name { font-size: 16px; white-space: normal; line-height: 1.05; }
  .rank-mobile-meta { display: block; margin-top: 4px; color: #345258; font: 400 12px/1.2 var(--body); }
  .rank-score { font-size: 23px; }
  .rank-score small { display: block; margin: 2px 0 0; font-size: 11px; }
  footer { font-size: 10px; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { .live-dot { animation: none; } }
