/* Statistics screen: CHOGUI LEAGUE broadcast dashboard. */
.brand-page-shell #estadisticas .stats-showcase { position: relative; min-height: 178px; margin-bottom: 10px; padding: 33px clamp(20px,4.8vw,64px); overflow: hidden; border: 1px solid rgba(255,255,255,.09); border-radius: 11px; background: linear-gradient(90deg,rgba(5,13,19,.94),rgba(5,13,19,.75) 54%,rgba(5,13,19,.25)),url('/images/chogui-hero-cinematic.jpg') center 54% / cover no-repeat; }
.brand-page-shell #estadisticas .stats-showcase-kicker { color: #c3cbd0; font-size: .61rem; font-weight: 800; letter-spacing: .19em; }
.brand-page-shell #estadisticas .stats-showcase h1 { margin: 10px 0 6px; color: #fff; font-size: clamp(2rem,3.55vw,3.15rem); line-height: 1.02; font-weight: 950; letter-spacing: -.02em; }
.brand-page-shell #estadisticas .stats-showcase h1 span { color: var(--gold); }
.brand-page-shell #estadisticas .stats-showcase p { max-width: 660px; margin: 0; color: #d4dde2; font-size: clamp(.81rem,1.2vw,1rem); }
.brand-page-shell #estadisticas .stats-showcase-mark { position: absolute; right: 24px; top: 42px; color: #e9eef0; font-size: .6rem; font-weight: 750; line-height: 1.65; letter-spacing: .28em; text-align: right; }
.brand-page-shell #estadisticas .stats-dashboard-controls { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 11px; }
.brand-page-shell #estadisticas .stats-dashboard-tabs { display: grid; grid-template-columns: repeat(4,minmax(105px,1fr)); gap: 7px; width: min(630px,55%); }
.brand-page-shell #estadisticas .stats-dashboard-tabs button { min-height: 44px; padding: 10px 15px; border: 1px solid rgba(255,255,255,.17); border-radius: 8px; background: #17242c; color: #e4eaed; font: inherit; font-size: .78rem; font-weight: 780; cursor: pointer; }
.brand-page-shell #estadisticas .stats-dashboard-tabs button:hover { border-color: var(--gold); }
.brand-page-shell #estadisticas .stats-dashboard-tabs button.active { border-color: var(--gold); background: var(--gold); color: #171300; }
.brand-page-shell #estadisticas .stats-dashboard-filters { display: flex; gap: 9px; min-width: 0; }
.brand-page-shell #estadisticas .stats-dashboard-filters .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.brand-page-shell #estadisticas .stats-dashboard-filters input,
.brand-page-shell #estadisticas .stats-dashboard-filters select { min-height: 43px; padding: 9px 13px; border: 1px solid rgba(255,255,255,.17); border-radius: 8px; background: #12202a; color: #eef2f4; font: inherit; font-size: .72rem; }
.brand-page-shell #estadisticas .stats-dashboard-filters input { width: clamp(180px,19vw,270px); }
.brand-page-shell #estadisticas .stats-dashboard-filters select { width: clamp(145px,14vw,190px); }
.brand-page-shell #estadisticas .stats-dashboard-grid { display: grid; grid-template-columns: minmax(0,2.5fr) minmax(280px,.92fr); gap: 11px; }
.brand-page-shell #estadisticas .stats-dashboard-main,
.brand-page-shell #estadisticas .stats-dashboard-sidebar { display: grid; align-content: start; gap: 11px; min-width: 0; }
.brand-page-shell #estadisticas .stats-dashboard-card { min-width: 0; padding: 12px; border: 1px solid rgba(255,255,255,.13); border-radius: 11px; background: #15222b; }
.brand-page-shell #estadisticas .stats-dashboard-card h2 { margin: 0; color: #fff; font-size: .91rem; line-height: 1.3; }
.brand-page-shell #estadisticas .stats-dashboard-card h2::before { content: ''; display: inline-block; width: 4px; height: 15px; margin: 0 9px 0 0; border-radius: 2px; background: var(--gold); vertical-align: -2px; }
.brand-page-shell #estadisticas .stats-dashboard-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.brand-page-shell #estadisticas .stats-dashboard-heading button { padding: 5px 7px; border: 0; background: none; color: var(--gold); font: inherit; font-size: .66rem; cursor: pointer; white-space: nowrap; }
.brand-page-shell #estadisticas .stats-dashboard-muted { margin: 7px 0 0; color: #abb8c0; font-size: .71rem; line-height: 1.45; }
.brand-page-shell #estadisticas .stats-leaders-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.brand-page-shell #estadisticas .stats-leader { min-width: 0; min-height: 137px; padding: 10px; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; background: #101d26; }
.brand-page-shell #estadisticas .stats-leader > a { display: block; height: 100%; color: #fff; text-decoration: none; }
.brand-page-shell #estadisticas .stats-leader:hover { border-color: rgba(255,193,7,.55); }
.brand-page-shell #estadisticas .stats-leader small { display: block; overflow: hidden; color: #dbe3e7; font-size: .6rem; font-weight: 790; text-overflow: ellipsis; white-space: nowrap; }
.brand-page-shell #estadisticas .stats-leader-body { display: flex; align-items: center; gap: 7px; min-width: 0; margin-top: 12px; }
.brand-page-shell #estadisticas .stats-leader-avatar { width: 45px; height: 54px; flex: none; border-radius: 50%; background: #27323a; object-fit: contain; }
.brand-page-shell #estadisticas .stats-leader-body > div { display: grid; min-width: 0; flex: 1; gap: 2px; }
.brand-page-shell #estadisticas .stats-leader-body strong,
.brand-page-shell #estadisticas .stats-leader-body span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brand-page-shell #estadisticas .stats-leader-body strong { font-size: .67rem; }
.brand-page-shell #estadisticas .stats-leader-body span { color: #becbd1; font-size: .59rem; }
.brand-page-shell #estadisticas .stats-leader-body b { margin-top: 1px; color: var(--gold); font-size: 1.32rem; line-height: 1; }
.brand-page-shell #estadisticas .stats-leader-body > img:last-child { width: 27px; height: 27px; object-fit: contain; }
.brand-page-shell #estadisticas .stats-table-scroll { max-width: 100%; overflow-x: auto; scrollbar-width: thin; }
.brand-page-shell #estadisticas .stats-dashboard-table { width: 100%; border-collapse: collapse; color: #f5f7f8; font-size: .67rem; }
.brand-page-shell #estadisticas .stats-dashboard-table th { padding: 6px 5px; border-top: 1px solid rgba(255,255,255,.13); border-bottom: 1px solid rgba(255,255,255,.14); background: #10202a; color: #c4ced4; font-size: .6rem; text-align: left; white-space: nowrap; }
.brand-page-shell #estadisticas .stats-dashboard-table th button { padding: 3px 0; border: 0; background: none; color: inherit; font: inherit; font-weight: 800; cursor: pointer; white-space: nowrap; }
.brand-page-shell #estadisticas .stats-dashboard-table th button:hover { color: var(--gold); }
.brand-page-shell #estadisticas .stats-dashboard-table td { height: 35px; padding: 5px; border-bottom: 1px solid rgba(255,255,255,.09); white-space: nowrap; }
.brand-page-shell #estadisticas .stats-dashboard-table tbody tr:hover { background: rgba(255,255,255,.035); }
.brand-page-shell #estadisticas .stats-dashboard-table td:nth-child(n+4),
.brand-page-shell #estadisticas .stats-dashboard-table th:nth-child(n+4) { text-align: right; }
.brand-page-shell #estadisticas .stats-rank { width: 26px; color: #c4ced3; }
.brand-page-shell #estadisticas .stats-person-link,
.brand-page-shell #estadisticas .stats-team-link { display: inline-flex; align-items: center; gap: 7px; color: #fff; text-decoration: none; }
.brand-page-shell #estadisticas .stats-person-link:hover,
.brand-page-shell #estadisticas .stats-team-link:hover { color: var(--gold); }
.brand-page-shell #estadisticas .stats-person-link img { width: 23px; height: 23px; border-radius: 50%; background: #26343c; object-fit: contain; }
.brand-page-shell #estadisticas .stats-team-link img { width: 20px; height: 20px; object-fit: contain; }
.brand-page-shell #estadisticas .stats-empty-row { padding: 20px !important; color: #bac5ca; text-align: center !important; }
.brand-page-shell #estadisticas .stats-table-footer { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 10px; color: #aebbc2; font-size: .68rem; }
.brand-page-shell #estadisticas .stats-table-footer nav { display: flex; gap: 5px; }
.brand-page-shell #estadisticas .stats-table-footer button { min-width: 26px; height: 26px; border: 1px solid rgba(255,255,255,.14); border-radius: 5px; background: #1b2a33; color: #dce4e8; font: inherit; cursor: pointer; }
.brand-page-shell #estadisticas .stats-table-footer button.active { border-color: var(--gold); background: var(--gold); color: #171300; font-weight: 900; }
.brand-page-shell #estadisticas .stats-table-footer button:disabled { opacity: .4; cursor: default; }
.brand-page-shell #estadisticas .stats-dashboard-sidebar .stats-dashboard-card { min-height: 120px; }
.brand-page-shell #estadisticas .stats-trend-list { display: grid; gap: 6px; margin-top: 10px; }
.brand-page-shell #estadisticas .stats-trend-list > div { display: flex; align-items: center; gap: 10px; padding: 8px; border: 1px solid rgba(255,255,255,.09); border-radius: 7px; background: #101d26; }
.brand-page-shell #estadisticas .stats-trend-list strong { min-width: 38px; color: var(--gold); font-size: 1.03rem; text-align: center; }
.brand-page-shell #estadisticas .stats-trend-list span { color: #d9e1e5; font-size: .69rem; }
.brand-page-shell #estadisticas .stats-spotlight-player { display: flex; align-items: center; gap: 10px; margin-top: 11px; padding: 8px; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; color: #fff; text-decoration: none; background: #101d26; }
.brand-page-shell #estadisticas .stats-spotlight-player > img { width: 64px; height: 74px; flex: none; border-radius: 50%; background: #27323a; object-fit: contain; }
.brand-page-shell #estadisticas .stats-spotlight-player > span { display: grid; min-width: 0; gap: 3px; }
.brand-page-shell #estadisticas .stats-spotlight-player strong { overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.brand-page-shell #estadisticas .stats-spotlight-player small { color: #c5d0d6; font-size: .65rem; }
.brand-page-shell #estadisticas .stats-spotlight-player b { color: var(--gold); font-size: .69rem; }
.brand-page-shell #estadisticas .stats-week-chart { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0,1fr); gap: 7px; align-items: end; height: 128px; padding: 7px 0 0; }
.brand-page-shell #estadisticas .stats-week-chart > div { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; min-width: 0; }
.brand-page-shell #estadisticas .stats-week-chart strong { margin-bottom: 3px; color: #f6f8f9; font-size: .6rem; }
.brand-page-shell #estadisticas .stats-week-bar { display: block; width: min(32px,90%); min-height: 4px; background: var(--gold); }
.brand-page-shell #estadisticas .stats-week-chart small { margin-top: 4px; color: #b3c0c6; font-size: .55rem; white-space: nowrap; }
.brand-page-shell #estadisticas .stats-dashboard-more { display: block; width: 100%; min-height: 42px; margin-top: 12px; border: 1px solid rgba(255,193,7,.5); border-radius: 8px; background: #14222a; color: var(--gold); font: inherit; font-size: .76rem; font-weight: 800; cursor: pointer; }
.brand-page-shell #estadisticas .stats-dashboard-more:hover { background: #1e2d35; }
.brand-page-shell #estadisticas #statisticsAdvanced[hidden] { display: none !important; }
.brand-page-shell #estadisticas #statisticsAdvanced { margin-top: 14px; }
@media (max-width: 1100px) { .brand-page-shell #estadisticas .stats-dashboard-controls { flex-wrap: wrap; } .brand-page-shell #estadisticas .stats-dashboard-tabs { width: 100%; } .brand-page-shell #estadisticas .stats-dashboard-filters { width: 100%; } .brand-page-shell #estadisticas .stats-dashboard-filters input { flex: 1; width: auto; } .brand-page-shell #estadisticas .stats-dashboard-grid { grid-template-columns: minmax(0,1fr) minmax(240px,.55fr); } .brand-page-shell #estadisticas .stats-leaders-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 800px) { .brand-page-shell #estadisticas .stats-dashboard-grid { grid-template-columns: minmax(0,1fr); } .brand-page-shell #estadisticas .stats-dashboard-sidebar { grid-template-columns: repeat(2,minmax(0,1fr)); } .brand-page-shell #estadisticas #statsDashboardProduction { grid-column: 1 / -1; } }
@media (max-width: 560px) { .brand-page-shell #estadisticas .stats-showcase { min-height: 170px; padding: 25px 17px; background-position: 67% center; } .brand-page-shell #estadisticas .stats-showcase-mark { display: none; } .brand-page-shell #estadisticas .stats-showcase h1 { max-width: 300px; font-size: 2.1rem; } .brand-page-shell #estadisticas .stats-showcase p { max-width: 300px; font-size: .75rem; } .brand-page-shell #estadisticas .stats-dashboard-tabs { display: flex; overflow-x: auto; gap: 6px; } .brand-page-shell #estadisticas .stats-dashboard-tabs button { min-width: 95px; } .brand-page-shell #estadisticas .stats-dashboard-filters { flex-wrap: wrap; } .brand-page-shell #estadisticas .stats-dashboard-filters input { width: 100%; flex: auto; } .brand-page-shell #estadisticas .stats-dashboard-filters select { width: 100%; } .brand-page-shell #estadisticas .stats-leaders-grid { gap: 6px; } .brand-page-shell #estadisticas .stats-leader { min-height: 128px; padding: 8px; } .brand-page-shell #estadisticas .stats-leader-avatar { width: 35px; height: 43px; } .brand-page-shell #estadisticas .stats-leader-body > img:last-child { display: none; } .brand-page-shell #estadisticas .stats-dashboard-sidebar { grid-template-columns: minmax(0,1fr); } .brand-page-shell #estadisticas #statsDashboardProduction { grid-column: auto; } .brand-page-shell #estadisticas .stats-table-footer { align-items: flex-start; flex-direction: column; } }