:root {
  --bg: #08090b;
  --surface: #111318;
  --surface-2: #181b21;
  --line: #2a2e36;
  --text: #f4f5f7;
  --muted: #8d929c;
  --lime: #c8ff18;
  --blue: #2c7dff;
  --gold: #d6ac43;
  --red: #ff4a55;
  --font-display: "Arial Narrow", "Roboto Condensed", Impact, sans-serif;
  --font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font-body); font-size: 16px; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
.app-shell { width: min(1440px, 100%); margin: 0 auto; min-height: 100vh; }
.topbar { height: 86px; padding: 0 34px; border-bottom: 1px solid var(--line); display: flex; align-items: center; gap: 32px; position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter: blur(14px); }
.brand { display: flex; gap: 12px; color: var(--text); text-decoration: none; align-items: center; min-width: 230px; }
.brand-mark { width: 46px; height: 46px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; overflow: hidden; transform: skew(-7deg); background: var(--lime); color: #090b08; padding: 5px; }
.brand-mark i { font: 900 25px/1 var(--font-display); font-style: normal; }
.brand strong, .brand small { display: block; }
.brand strong { font: 900 20px/1 var(--font-display); letter-spacing: 1.1px; }
.brand small { color: var(--muted); letter-spacing: 2.5px; margin-top: 5px; font-size: 10px; }
.desktop-nav { display: flex; align-self: stretch; margin: 0 auto; }
.desktop-nav a { color: var(--muted); text-decoration: none; padding: 0 18px; display: grid; place-items: center; border-bottom: 2px solid transparent; font-size: 14px; font-weight: 700; }
.desktop-nav a:hover, .desktop-nav a.active { color: var(--text); border-color: var(--lime); }
.profile-button { display: flex; gap: 10px; align-items: center; border: 0; background: transparent; cursor: pointer; padding: 6px; }
.bell-button { border: 1px solid var(--line); background: transparent; color: var(--text); width: 38px; height: 38px; border-radius: 999px; cursor: pointer; font-size: 16px; display: grid; place-items: center; margin-left: 8px; transition: transform .15s ease; }
.bell-button:hover { border-color: var(--lime); }
.bell-button.rung { animation: bell-ring .5s ease; }
@keyframes bell-ring { 0%, 100% { transform: rotate(0); } 20% { transform: rotate(-18deg); } 40% { transform: rotate(14deg); } 60% { transform: rotate(-10deg); } 80% { transform: rotate(6deg); } }
.psn-tag { display: block; color: var(--lime); font-size: 10px; font-weight: 800; letter-spacing: .03em; margin-top: 4px; }
.status-dot { width: 7px; height: 7px; background: var(--lime); border-radius: 50%; box-shadow: 0 0 12px var(--lime); }
.profile-copy { text-align: right; }
.profile-copy b, .profile-copy small { display: block; }
.profile-copy b { font-size: 13px; }
.profile-copy small { color: var(--muted); margin-top: 3px; font-size: 11px; }
.avatar { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #48505e; border-radius: 50%; background: #20242b; font-size: 12px; font-weight: 800; }
main { padding: 34px; }
.season-rail { min-height: 202px; border: 1px solid var(--line); padding: 34px; display: flex; justify-content: space-between; gap: 28px; align-items: flex-end; position: relative; overflow: hidden; background: radial-gradient(circle at 75% 20%, rgba(44,125,255,.23), transparent 28%), linear-gradient(120deg, #161a21, #0b0d11 68%); }
.season-rail::after { content: "CKL"; position: absolute; right: 7%; top: -35px; font: 900 230px/1 var(--font-display); color: rgba(255,255,255,.026); transform: skew(-9deg); pointer-events: none; }
.eyebrow { color: var(--muted); letter-spacing: 2.5px; font-size: 12px; font-weight: 800; }
h1, h2 { font-family: var(--font-display); text-transform: uppercase; margin: 0; letter-spacing: .3px; }
h1 { font-size: clamp(44px, 7vw, 82px); line-height: .88; max-width: 720px; }
.season-rail p { color: #c2c5cc; margin: 18px 0 0; }
.season-actions { display: flex; align-items: center; gap: 18px; position: relative; z-index: 1; }
.live-chip { color: var(--lime); font-size: 11px; font-weight: 900; letter-spacing: 1.5px; white-space: nowrap; }
.live-chip i { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 12px var(--lime); }
.primary-button { border: 1px solid var(--lime); background: var(--lime); color: #090b08; padding: 14px 20px; text-transform: uppercase; font-weight: 900; cursor: pointer; }
.primary-button:hover { filter: brightness(.92); }
.dashboard-grid { display: grid; grid-template-columns: 1.05fr 1.2fr .95fr; gap: 16px; margin-top: 16px; }
.panel { background: var(--surface); border: 1px solid var(--line); }
.dashboard-grid > .panel { min-height: 280px; padding: 24px; }
.panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.panel-head h2 { font-size: 24px; margin-top: 6px; }
.panel-head time { font: 800 11px/1 var(--font-body); color: var(--lime); letter-spacing: 1px; }
.matches-head-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.dialog-body { padding: 25px; }
.h2h-summary { display: flex; gap: 10px; margin: 18px 0; }
.h2h-summary div { flex: 1; text-align: center; padding: 12px 8px; background: #0c0e11; border: 1px solid var(--line); }
.h2h-summary strong { display: block; font-size: 22px; }
.h2h-summary small { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
.h2h-list { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow-y: auto; }
.h2h-list .h2h-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; background: #0c0e11; border: 1px solid var(--line); font-size: 13px; }
.h2h-list .h2h-row small { color: var(--muted); display: block; font-size: 10px; margin-top: 2px; }
#draft-team-search { width: 100%; margin-top: 8px; background: #0c0e11; border: 1px solid var(--line); color: var(--text); padding: 13px; box-sizing: border-box; font-family: inherit; font-size: 14px; }
.draft-team-list { max-height: 360px; overflow-y: auto; margin-top: 14px; display: flex; flex-direction: column; gap: 14px; }
.draft-team-list .league-group span { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px; }
.draft-team-list .league-group .teams-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 6px; }
.draft-team-list button.team-option { display: flex; align-items: center; gap: 8px; text-align: left; border: 1px solid var(--line); background: #0c0e11; color: var(--text); padding: 8px 10px; cursor: pointer; font-size: 12px; font-family: inherit; }
.draft-team-list button.team-option:hover { border-color: var(--lime); }
.draft-team-list .no-results { color: var(--muted); text-align: center; padding: 20px; font-size: 13px; }
.roster-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.roster-team-label { display: block; color: var(--muted); font-size: 10px; letter-spacing: 1px; margin-bottom: 6px; }
.roster-list { max-height: 260px; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; }
.roster-row { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 6px 8px; background: #0c0e11; border: 1px solid var(--line); font-size: 11px; }
.roster-row span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.roster-row label { display: flex; align-items: center; gap: 3px; margin: 0; font-size: 9px; color: var(--muted); }
.roster-row input { width: 32px; background: #171a1f; border: 1px solid var(--line); color: var(--text); text-align: center; font-size: 12px; padding: 3px; }
.goal-slot { display: flex; flex-direction: column; gap: 4px; padding: 8px; background: #0c0e11; border: 1px solid var(--line); margin-bottom: 6px; }
.goal-slot-label { font-size: 9px; letter-spacing: 1px; color: var(--muted); font-weight: 900; }
.goal-slot select { width: 100%; background: #171a1f; border: 1px solid var(--line); color: var(--text); padding: 6px; font-size: 12px; }
.roster-fallback-goals, .roster-fallback-assists { width: 100%; margin-top: 6px; background: #0c0e11; border: 1px solid var(--line); color: var(--text); padding: 10px; box-sizing: border-box; font-family: inherit; font-size: 13px; }
.admin-tab { margin-top: 14px; }
.admin-new-match { margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.admin-new-match-row { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.admin-new-match-row select { flex: 1; min-width: 110px; background: #0c0e11; border: 1px solid var(--line); color: var(--text); padding: 8px; font-size: 12px; }
.admin-list { max-height: 400px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
.admin-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px; background: #0c0e11; border: 1px solid var(--line); font-size: 12px; }
.admin-row .admin-row-label { flex: 1 1 100%; font-weight: 700; margin-bottom: 4px; }
.admin-row select, .admin-row input[type=number], .admin-row input[type=text] { background: #171a1f; border: 1px solid var(--line); color: var(--text); padding: 6px; font-size: 12px; }
.admin-row input[type=number] { width: 50px; text-align: center; }
.admin-row button { border: 1px solid var(--line); background: transparent; color: var(--text); padding: 6px 10px; font-size: 11px; cursor: pointer; }
.admin-row button.danger { color: #ff6b6b; border-color: #ff6b6b; }
.admin-row button:hover { border-color: var(--lime); color: var(--lime); }
.admin-row button.danger:hover { color: #ff6b6b; border-color: #ff6b6b; background: rgba(255,107,107,.1); }
.admin-fallback-scorer-btn.selected, .admin-fallback-assist-btn.selected { background: var(--lime); color: #0c0e11; border-color: var(--lime); }
.evidence-link { display: block; color: var(--lime); font-size: 12px; font-weight: 800; margin: 10px 0; text-decoration: none; }
.evidence-link:hover { text-decoration: underline; }
.diario-briefs { list-style: none; margin: 14px 0 0; padding: 12px 0 0; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 8px; }
.diario-briefs li { font-size: 12px; color: var(--muted); display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.diario-briefs .brief-left { display: flex; align-items: center; }
.diario-briefs li b { color: var(--text); font-weight: 700; }
.cut-score { display: flex; align-items: baseline; gap: 10px; margin: 38px 0 18px; }
.cut-score strong { font: 900 66px/.8 var(--font-display); color: var(--lime); }
.cut-score span { color: var(--muted); }
.progress-track { height: 8px; background: #292d33; overflow: hidden; }
.progress-track i { display: block; width: 66.66%; height: 100%; background: linear-gradient(90deg, var(--blue), var(--lime)); transition: width .4s ease; }
.cut-footer { display: flex; justify-content: space-between; align-items: center; color: var(--muted); font-size: 12px; margin-top: 16px; }
.cut-footer b { color: var(--text); }
#salvoconducto-btn { color: var(--lime); font-size: 12px; font-weight: 800; }
#salvoconducto-btn:disabled { color: var(--muted); cursor: default; }
.round-tag, .count-badge { background: var(--surface-2); color: var(--lime); padding: 7px 9px; font-size: 10px; font-weight: 900; }
.competition-tag { padding: 2px 6px; font-size: 9px; font-weight: 900; letter-spacing: .5px; border-radius: 3px; margin-left: 4px; }
.competition-tag.champions { background: rgba(88, 60, 200, .25); color: #b6a3ff; }
.competition-tag.europa { background: rgba(255, 140, 0, .2); color: #ffb35c; }
.europa-table { width: 100%; margin-top: 10px; }
.europa-table caption { text-align: left; font-size: 11px; font-weight: 900; color: var(--muted); letter-spacing: 1px; margin-bottom: 8px; }
.bracket-title { font: 900 16px var(--font-display); color: var(--lime); margin: 18px 0 10px; letter-spacing: .5px; }
.bracket-divider { border: none; border-top: 1px solid var(--line); margin: 24px 0; }
.bracket-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 480px) { .bracket-groups { grid-template-columns: 1fr; } }
.bracket-knockout { display: flex; flex-direction: column; gap: 16px; margin-top: 18px; }
.bracket-column { display: flex; flex-direction: column; gap: 10px; }
.bracket-match { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: #0c0e11; border: 1px solid var(--line); padding: 12px; }
.bracket-side { display: flex; align-items: center; gap: 8px; flex: 1; font-size: 12px; font-weight: 700; }
.bracket-side .club-badge { width: 28px; height: 28px; font-size: 9px; flex-shrink: 0; }
.bracket-side small { display: block; color: var(--muted); font-weight: 400; }
.bracket-side.bracket-winner { color: var(--lime); }
.bracket-agg { font: 900 15px var(--font-display); color: var(--text); padding: 0 10px; white-space: nowrap; }
.press-outlet { color: var(--muted); font-size: 10px; font-weight: 900; letter-spacing: 1px; margin-bottom: 6px; display: block; }
.press-question { margin-bottom: 20px; }
.press-question p { margin: 0 0 14px; font-size: 14px; line-height: 1.5; }
.press-options { display: flex; flex-direction: column; gap: 8px; }
.press-option { text-align: left; background: #0c0e11; border: 1px solid var(--line); color: var(--text); padding: 12px 14px; font-size: 13px; line-height: 1.4; cursor: pointer; }
.press-option:hover { border-color: var(--lime); }
.press-quote { border-left: 3px solid var(--lime); padding: 10px 0 10px 14px; margin: 0 0 18px; font-size: 14px; font-style: italic; color: var(--text); }
.press-quote small { display: block; font-style: normal; color: var(--muted); margin-top: 6px; }
.press-walkout { display: block; margin: 4px 0 20px; color: #ff6b6b; font-size: 12px; font-weight: 800; background: none; border: none; cursor: pointer; }
.press-done { color: var(--lime); font-weight: 900; font-size: 13px; margin-bottom: 18px; }
.press-recado textarea { width: 100%; min-height: 80px; background: #0c0e11; border: 1px solid var(--line); color: var(--text); padding: 10px; font-family: inherit; font-size: 13px; box-sizing: border-box; resize: vertical; }
.press-rival-block { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.news-list { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; }
.news-featured { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: 140px; padding: 14px; border: none; cursor: pointer; text-align: left; overflow: hidden; }
.news-featured .news-icon { position: absolute; top: 10px; right: 14px; font-size: 34px; opacity: .5; }
.news-featured-tag { color: var(--lime); font-size: 9px; font-weight: 900; letter-spacing: 1px; margin-bottom: 6px; }
.news-featured-title { color: #fff; font: 900 17px/1.25 var(--font-display); text-shadow: 0 2px 6px rgba(0,0,0,.5); }
.news-grid { display: flex; flex-direction: column; gap: 8px; }
.news-card { display: flex; align-items: center; gap: 10px; background: none; border: none; padding: 0; cursor: pointer; text-align: left; color: inherit; font-family: inherit; }
.news-card-cover { flex-shrink: 0; width: 52px; height: 52px; display: flex; align-items: center; justify-content: center; font-size: 22px; }
.news-card-copy { flex: 1; min-width: 0; }
.news-card-copy b { display: block; font-size: 12px; line-height: 1.3; }
.news-card-copy small { color: var(--muted); font-size: 10px; letter-spacing: .5px; }
.news-card:hover b { color: var(--lime); }
.news-dialog-cover { height: 90px; display: flex; align-items: center; justify-content: center; font-size: 36px; margin: 10px 0 16px; }
#news-dialog-body p { font-size: 14px; line-height: 1.6; margin-bottom: 12px; white-space: pre-line; }
.achievements-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 8px; margin-top: 8px; }
.achievement-badge { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 6px; background: #0c0e11; border: 1px solid var(--line); text-align: center; }
.achievement-badge .achievement-icon { font-size: 24px; }
.achievement-badge .achievement-name { font-size: 9px; font-weight: 800; color: var(--muted); letter-spacing: .3px; }
.achievement-badge.locked { opacity: .3; filter: grayscale(1); }
.achievement-badge.unlocked { border-color: var(--lime); }
.achievement-badge.unlocked .achievement-name { color: var(--lime); }
.reglamento-scroll { max-height: 45vh; overflow-y: auto; background: #0c0e11; border: 1px solid var(--line); padding: 16px; margin: 14px 0; font-size: 13px; line-height: 1.55; }
.reglamento-scroll h3 { color: var(--lime); font-size: 13px; margin: 16px 0 6px; }
.reglamento-scroll h3:first-child { margin-top: 0; }
.reglamento-scroll p { margin: 0 0 4px; color: var(--text); }
.reglamento-check { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--muted); line-height: 1.4; cursor: pointer; }
.reglamento-check input { margin-top: 2px; flex-shrink: 0; }
#reglamento-accept-btn:disabled { opacity: .4; cursor: not-allowed; }
.versus { display: grid; grid-template-columns: 1fr 62px 1fr; gap: 8px; align-items: center; margin: 30px 0 25px; }
.competitor { text-align: center; }
.competitor strong, .competitor small { display: block; }
.competitor strong { margin-top: 8px; }
.competitor small { color: var(--muted); font-size: 11px; margin-top: 4px; }
.club-badge { margin: auto; width: 54px; height: 54px; display: grid; place-items: center; clip-path: polygon(50% 0, 92% 15%, 84% 76%, 50% 100%, 16% 76%, 8% 15%); font: 900 12px/1 var(--font-display); color: #fff; }
.club-crest { margin: auto; width: 54px; height: 54px; object-fit: contain; display: block; }
.club-badge.inter { background: repeating-linear-gradient(90deg,#0a39a2 0 7px,#111 7px 14px); }
.club-badge.newcastle { color: #111; background: repeating-linear-gradient(90deg,#fff 0 7px,#222 7px 14px); }
.club-badge.milan { background: repeating-linear-gradient(90deg,#e0212e 0 7px,#111 7px 14px); }
.club-badge.chelsea { background: #1749a8; }
.club-badge.roma { background: #8c192d; }
.club-badge.psg { background: #182c67; }
.club-badge.napoli { background: #138dcc; }
.club-badge.villa { background: #7b2545; }
.versus-center { text-align: center; }
.versus-center span { font: 900 24px/1 var(--font-display); }
.versus-center small { display: block; color: var(--lime); margin-top: 7px; font-size: 9px; letter-spacing: 1px; }
.ghost-button { border: 1px solid #3a3f49; background: transparent; padding: 12px 16px; cursor: pointer; font-size: 12px; font-weight: 700; }
#season-selector { color: var(--text); }
#season-selector option { background: #101216; }
.full { width: 100%; }
.approval-card { margin-top: 28px; }
.approval-card > div:first-child { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; align-items: center; text-align: center; }
.approval-card strong { font: 900 28px/1 var(--font-display); }
.approval-card em { color: var(--muted); font-style: normal; }
.approval-card small { display: block; text-align: center; color: var(--muted); margin: 14px 0 20px; font-size: 11px; }
.approval-actions { display: grid; grid-template-columns: 1.3fr 1fr; gap: 8px; }
.approve-button, .reject-button { border: 1px solid var(--lime); padding: 12px; background: transparent; cursor: pointer; font-weight: 800; font-size: 12px; }
.approve-button { background: var(--lime); color: #090b08; }
.reject-button { border-color: #414650; }
.content-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(300px, .8fr); gap: 16px; margin-top: 16px; }
.standings-panel { padding: 26px; }
.text-button { border: 0; background: transparent; color: var(--lime); cursor: pointer; font-size: 12px; font-weight: 800; }
.table-wrap { overflow-x: auto; margin-top: 24px; }
table { width: 100%; border-collapse: collapse; }
th { color: var(--muted); font-size: 10px; letter-spacing: 1.4px; text-align: right; padding: 0 12px 12px; }
th:nth-child(2), td:nth-child(2) { text-align: left; }
th:first-child, td:first-child { text-align: center; }
td { border-top: 1px solid var(--line); padding: 14px 12px; text-align: right; font-weight: 700; }
td:first-child { width: 46px; color: var(--muted); font-family: var(--font-display); font-size: 20px; border-left: 3px solid transparent; }
tr.zone-champions td:first-child { border-left-color: var(--blue); color: var(--text); }
tr.zone-europa td:first-child { border-left-color: var(--gold); }
tr.zone-risk td:first-child { border-left-color: var(--red); }
.player-cell { display: flex; align-items: center; gap: 12px; }
.player-cell .club-badge { width: 35px; height: 35px; margin: 0; font-size: 8px; flex: 0 0 auto; }
.player-cell b, .player-cell small { display: block; }
.player-cell small { color: var(--muted); font-size: 11px; margin-top: 3px; font-weight: 500; }
.points { color: var(--lime); font-size: 18px; }
.legend { display: flex; flex-wrap: wrap; gap: 18px; color: var(--muted); font-size: 11px; margin-top: 20px; }
.legend i { display: inline-block; width: 3px; height: 12px; margin-right: 6px; vertical-align: middle; }
.legend .champions { background: var(--blue); }.legend .europa { background: var(--gold); }.legend .risk { background: var(--red); }
.side-column { display: grid; gap: 16px; }
.newspaper-frame { padding: 18px; background: linear-gradient(160deg, #6b4a30, #4a3220 60%, #3a2717); }
.paper-sheet {
  padding: 22px; color: #111;
  background:
    radial-gradient(rgba(0,0,0,.035) 1px, transparent 1px) 0 0/3px 3px,
    linear-gradient(#e8e4d9, #e8e4d9);
  box-shadow: 0 14px 26px rgba(0,0,0,.45), 0 -1px 0 rgba(255,255,255,.4) inset;
  position: relative;
}
.paper-sheet::after {
  content: ""; position: absolute; left: 6%; right: 6%; top: 46%; height: 1px;
  background: rgba(0,0,0,.12); box-shadow: 0 1px 0 rgba(255,255,255,.5);
}
.newspaper-kicker { border-bottom: 3px solid #111; padding-bottom: 8px; text-align: center; }
.newspaper-kicker span, .newspaper-kicker b { display: block; }
.newspaper-kicker span { font-size: 9px; letter-spacing: 4px; }
.newspaper-kicker b { font: 900 30px/1 var(--font-display); }
.paper-image { height: 160px; margin: 12px 0; background: linear-gradient(135deg, rgba(0,0,0,.15), rgba(0,0,0,.72)), repeating-linear-gradient(90deg,#202020 0 24px,#ececec 24px 48px); position: relative; overflow: hidden; }
.paper-image::after { content: ""; position: absolute; width: 150px; height: 150px; border: 28px solid rgba(200,255,24,.7); border-radius: 50%; right: -28px; top: 20px; }
.paper-score { position: absolute; z-index: 1; left: 16px; bottom: 10px; color: white; font: 900 56px/.8 var(--font-display); }
.paper-team { position: absolute; z-index: 1; right: 12px; top: 14px; background: var(--lime); padding: 5px 7px; font-size: 9px; font-weight: 900; }
.paper-badge { position: absolute; z-index: 1; left: 16px; top: 14px; }
.paper-badge .club-badge { width: 40px; height: 40px; font-size: 10px; }
.diario-briefs .brief-badge { display: inline-flex; vertical-align: middle; margin-right: 6px; }
.diario-briefs .brief-badge .club-badge { width: 22px; height: 22px; font-size: 8px; }
.paper-sheet h2 { font-size: 34px; line-height: .9; }
.paper-sheet p { font-family: Georgia, serif; font-size: 13px; line-height: 1.45; }
.side-notes-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(0,0,0,.15); }
.side-note { display: flex; gap: 8px; }
.side-note .side-note-photo { flex-shrink: 0; width: 46px; height: 46px; display: flex; align-items: center; justify-content: center; font-size: 18px; border: 1px solid rgba(0,0,0,.15); }
.side-note-copy b { display: block; color: #b3261e; font: 900 10px/1.2 var(--font-display); letter-spacing: .5px; margin-bottom: 2px; }
.side-note-copy span { font-family: Georgia, serif; font-size: 11px; line-height: 1.35; color: #222; }
@media (max-width: 420px) { .side-notes-grid { grid-template-columns: 1fr; } }
.paper-link { border: 0; border-top: 1px solid #777; width: 100%; padding: 12px 0 0; text-align: left; background: transparent; font-weight: 900; cursor: pointer; }
.streak-card { padding: 22px; }
.streak-card h2 { font-size: 22px; margin: 7px 0 15px; }
.streak-card ol { list-style: none; padding: 0; margin: 0; }
.streak-card li { display: grid; grid-template-columns: 38px 1fr auto; gap: 10px; align-items: center; padding: 11px 0; border-top: 1px solid var(--line); }
.rank { font: 900 24px/1 var(--font-display); }.rank.first { color: var(--gold); }.rank.second { color: #c9ccd1; }.rank.third { color: #b87846; }
.streak-card b, .streak-card small { display: block; }.streak-card small { color: var(--muted); margin-top: 3px; font-size: 10px; }.streak-card li > strong { color: var(--lime); }
.matches-section, .showcase { margin-top: 16px; padding: 26px; }
.segmented { display: flex; background: #0c0e11; border: 1px solid var(--line); padding: 3px; }
.segmented button { border: 0; background: transparent; color: var(--muted); padding: 8px 12px; cursor: pointer; font-size: 11px; }
.segmented button.selected { color: #090b08; background: var(--lime); font-weight: 900; }
.match-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 22px; }
.match-row { background: var(--surface-2); border-left: 3px solid #444a55; padding: 17px; }
.match-row.confirmed { border-left-color: var(--lime); }.match-row.pending { border-left-color: var(--gold); }.match-row.upcoming { border-left-color: var(--blue); }
.match-meta { display: flex; justify-content: space-between; color: var(--muted); font-size: 9px; letter-spacing: 1px; text-transform: uppercase; }
.match-score { display: grid; grid-template-columns: 1fr auto 1fr; text-align: center; gap: 7px; align-items: center; margin: 20px 0 13px; }
.match-score strong { font: 900 26px/1 var(--font-display); }.match-score span:first-child { text-align: left; }.match-score span:last-child { text-align: right; }
.match-row small { color: var(--muted); font-size: 10px; }
.match-row .share-button { display: block; margin-top: 8px; }
.showcase-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 20px; }
.showcase-grid > div { border: 1px solid var(--line); min-height: 120px; padding: 18px; background: linear-gradient(145deg, #1a1d23, #101216); }
.showcase-grid span, .showcase-grid strong, .showcase-grid small { display: block; }.showcase-grid span { color: var(--gold); font-size: 9px; letter-spacing: 1.5px; }.showcase-grid strong { font: 900 24px/1 var(--font-display); margin: 8px 0 5px; }.showcase-grid small { color: var(--muted); }
.showcase-grid .showcase-icon { font-size: 18px; margin-bottom: 4px; }
.showcase-grid .club-badge { width: 30px; height: 30px; font-size: 8px; margin: 6px 0 0; }
footer { padding: 34px; display: flex; align-items: center; gap: 15px; color: var(--muted); border-top: 1px solid var(--line); margin-top: 34px; font-size: 11px; letter-spacing: 1px; }
footer b { color: var(--lime); font: 900 22px/1 var(--font-display); } footer small { margin-left: auto; }
dialog { width: min(520px, calc(100% - 28px)); padding: 0; border: 1px solid #464d58; color: var(--text); background: var(--surface); box-shadow: 0 30px 90px rgba(0,0,0,.75); }
dialog::backdrop { background: rgba(0,0,0,.78); backdrop-filter: blur(5px); }
dialog form { padding: 25px; }
.dialog-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 24px; }.dialog-head h2 { font-size: 28px; margin-top: 6px; }
.close-button { border: 0; background: transparent; color: var(--muted); font-size: 30px; cursor: pointer; }
dialog label { display: block; color: var(--muted); font-size: 12px; margin-top: 18px; }
dialog select, dialog input[type=file] { width: 100%; margin-top: 8px; background: #0c0e11; border: 1px solid var(--line); color: var(--text); padding: 13px; }
dialog input[type=text], dialog input[type=email], dialog input[type=password], dialog input[type=tel], dialog input[type=date] { width: 100%; margin-top: 8px; background: #0c0e11; border: 1px solid var(--line); color: var(--text); padding: 13px; box-sizing: border-box; font-family: inherit; font-size: 14px; }
#auth-dialog .text-button { display: block; margin: 16px auto 0; }
#auth-error:empty { display: none; }
#auth-error { color: #ff6b6b; }

.draft-admin-controls { display: flex; gap: 8px; flex-wrap: wrap; }
.draft-clock { display: flex; align-items: center; gap: 16px; padding: 14px 18px; margin-bottom: 14px; background: #0c0e11; border: 1px solid var(--line); }
.draft-clock strong { font-size: 26px; font-variant-numeric: tabular-nums; }
.draft-order { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.draft-order li { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--line); background: #0c0e11; }
.draft-order li.is-active { border-color: var(--lime); background: rgba(200,255,24,.08); }
.draft-order li.is-skipped { opacity: .75; border-style: dashed; }
.draft-order li.is-completed { opacity: .55; }
.draft-order .draft-pos { width: 26px; height: 26px; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: #1a1d22; color: var(--muted); flex-shrink: 0; }
.draft-order .draft-name { flex: 1; }
.draft-order .draft-name b { display: block; }
.draft-order .draft-name small { color: var(--muted); }
.draft-order .draft-status { font-size: 11px; font-weight: 800; text-transform: uppercase; }
.draft-order .draft-reorder { display: flex; gap: 4px; }
.draft-order .draft-reorder button { border: 1px solid var(--line); background: transparent; color: var(--text); width: 24px; height: 24px; cursor: pointer; }
.score-inputs { display: grid; grid-template-columns: 1fr 24px 1fr; align-items: end; gap: 10px; margin-top: 18px; }.score-inputs > i { align-self: center; text-align: center; color: var(--muted); font-style: normal; }.score-inputs label { text-align: center; margin: 0; }.score-inputs label span, .score-inputs label b { display: block; }.score-inputs label span { font-size: 9px; letter-spacing: 1px; }.score-inputs label b { color: var(--text); font-size: 15px; margin: 5px 0; }.score-inputs input { width: 100%; height: 70px; background: #0c0e11; border: 1px solid var(--line); color: var(--text); text-align: center; font: 900 34px/1 var(--font-display); }
.score-stepper { display: grid; grid-template-columns: 32px 1fr 32px; gap: 4px; align-items: center; }
.score-stepper input { height: 70px; }
.score-stepper .step-btn { height: 70px; background: #0c0e11; border: 1px solid var(--line); color: var(--lime); font: 900 22px/1 var(--font-display); cursor: pointer; }
.score-stepper .step-btn:active { background: #171a1f; }
.form-note { color: var(--muted); font-size: 11px; line-height: 1.5; margin: 18px 0; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 30; background: var(--lime); color: #090b08; padding: 14px 18px; font-weight: 800; font-size: 12px; transform: translateY(120px); opacity: 0; transition: .25s ease; }.toast.show { transform: translateY(0); opacity: 1; }
.empty-approval { color: var(--muted); display: grid; place-items: center; min-height: 155px; text-align: center; font-size: 13px; }

@media (max-width: 1050px) {
  .desktop-nav { display: none; }
  .profile-button { margin-left: auto; }
  .dashboard-grid { grid-template-columns: 1fr 1fr; }
  .pending-panel { grid-column: span 2; }
  .content-grid { grid-template-columns: 1fr; }
  .side-column { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .topbar { height: 72px; padding: 0 16px; }.brand { min-width: 0; }.brand-mark { width: 40px; height: 40px; }.brand strong { font-size: 17px; }.profile-copy, .status-dot { display: none; }.avatar { width: 36px; height: 36px; }
  main { padding: 16px; }.season-rail { min-height: 285px; padding: 24px; align-items: flex-start; flex-direction: column; justify-content: flex-end; }.season-rail::after { font-size: 160px; right: -10%; }.season-actions { width: 100%; justify-content: space-between; }.season-actions .primary-button { padding-inline: 14px; }
  h1 { font-size: 49px; }.dashboard-grid, .content-grid, .side-column { grid-template-columns: 1fr; }.pending-panel { grid-column: auto; }.dashboard-grid > .panel { min-height: 0; }.cut-footer { gap: 10px; }
  .standings-panel, .matches-section, .showcase { padding: 19px; }.panel-head h2 { font-size: 21px; } th, td { padding-left: 8px; padding-right: 8px; } th:nth-child(4), td:nth-child(4) { display: none; }
  .side-column { display: grid; }.newspaper-frame { order: 1; }.match-list { grid-template-columns: 1fr; }.showcase-grid { grid-template-columns: 1fr 1fr; }.segmented { display: none; }
  footer { padding: 24px 16px; align-items: flex-start; flex-direction: column; } footer small { margin-left: 0; }
}
@media (max-width: 420px) { .showcase-grid { grid-template-columns: 1fr; }.season-actions { align-items: flex-start; flex-direction: column; }.season-actions .primary-button { width: 100%; }.legend { gap: 11px; } }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }