/* ══════════════════════════════════════════════════════════
   LIGA DERBY — Design System "Afiche Urbano"
   ══════════════════════════════════════════════════════════ */

/* ═══ TOKENS ═══ */
:root {
  /* Core palette */
  --ink: #090909;
  --bone: #EFEFEF;
  --paper: #FFFFFF;
  --fog: #444444;
  --chalk: #D8D8D8;
  --dim: #777777;

  /* Discipline badges */
  --f11: #40C686;
  --f7: #577BC9;
  --f5m: #F26B1F;
  --f5f: #693B5C;

  /* Functional */
  --rd: #E63946;
  --gr-dk: #1F7A2A;
  --yw: #F2D32C;

  /* Active accent (changes per discipline) */
  --accent: #F26B1F;
}

/* ═══ RESET ═══ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; overflow: hidden; }
body {
  font-family: 'Inter Tight', sans-serif;
  background: var(--bone);
  -webkit-font-smoothing: antialiased;
}

/* ═══ ANIMATIONS ═══ */
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }
@keyframes slideIn { from{transform:translateX(100%);opacity:0} to{transform:translateX(0);opacity:1} }
@keyframes slideBack { from{transform:translateX(-100%);opacity:0} to{transform:translateX(0);opacity:1} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes loadingDot { 0%,80%,100%{opacity:.2} 40%{opacity:1} }

/* ═══ APP SHELL ═══ */
.app-shell {
  width: 100%; min-height: 100vh;
  background: var(--bone);
  display: flex; flex-direction: column;
  position: relative;
}
.app-content {
  flex:1; overflow-y:auto; overflow-x:hidden;
  scrollbar-width:none; -ms-overflow-style:none; position:relative;
}
.app-content::-webkit-scrollbar { display:none; }

/* Mobile: safe areas + full height */
@media (max-width:600px) {
  .app-shell { min-height:100dvh; }
  .app-content { padding-top:env(safe-area-inset-top,0px); }
}

/* ═══ LOADING STATE ═══ */
.loading-state {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  height:100%; gap:24px; animation:fadeIn .3s ease-out;
}
.loading-logo { width:64px; height:64px; object-fit:contain; }
.loading-dots { display:flex; gap:6px; }
.loading-dots span {
  width:8px; height:8px; background:var(--ink); border-radius:50%;
  animation:loadingDot 1.2s infinite ease-in-out;
}
.loading-dots span:nth-child(2) { animation-delay:.15s; }
.loading-dots span:nth-child(3) { animation-delay:.3s; }

/* ═══ EMPTY STATE ═══ */
.empty-state {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:60px 20px; gap:12px; text-align:center;
}
.empty-state-icon { font-size:32px; opacity:.4; }
.empty-state-title {
  font-family:'Anton',sans-serif; font-style:italic; font-size:18px; color:var(--ink);
}
.empty-state-sub {
  font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--dim);
  letter-spacing:.08em; text-transform:uppercase;
}

/* ═══ SCREENS ═══ */
.screen { display:none; flex-direction:column; animation:slideIn .25s ease-out; }
.screen.active { display:flex; }
.screen.slide-back { animation:slideBack .25s ease-out; }

/* ═══ BACK BUTTON ═══ */
.back-btn {
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  -webkit-tap-highlight-color:transparent; padding:6px 0;
}
.back-btn:hover .back-btn-label { color:#fff; }
.back-btn:hover .back-btn-arrow { background:rgba(255,255,255,.15); }
.back-btn-arrow {
  width:28px; height:28px; border:1px solid rgba(255,255,255,.25);
  display:flex; align-items:center; justify-content:center;
  font-family:'JetBrains Mono',monospace; font-size:14px; color:rgba(255,255,255,.7);
  transition:background .15s; flex-shrink:0;
}
.back-btn-label {
  font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.5);
  transition:color .15s; line-height:1.3;
}
.back-btn-label small {
  display:block; font-size:8px; font-weight:500; letter-spacing:.06em; color:rgba(255,255,255,.3);
}

/* ═══ TOPBAR ═══ */
.topbar { background:var(--ink); color:var(--bone); padding:16px 24px 14px; flex-shrink:0; position:sticky; top:0; z-index:10; border-bottom:3px solid var(--accent); }
.topbar-row { display:flex; align-items:flex-end; justify-content:space-between; gap:8px; }
.topbar-info { flex:1; min-width:0; }
.topbar-title { font-family:'Anton',sans-serif; font-style:italic; font-size:18px; line-height:1; }
.topbar-sub {
  font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.12em;
  color:rgba(255,255,255,.45); text-transform:uppercase; margin-top:3px;
}
.topbar-badge {
  width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}

/* ═══ HOME ═══ */
.home-header { background:var(--ink); color:var(--bone); padding:20px 24px 10px; position:sticky; top:0; z-index:10; border-bottom:3px solid var(--accent); }
.home-logo {
  display:flex; align-items:center; gap:10px;
}
.home-logo img { height:32px; width:auto; object-fit:contain; }
.home-logo-text {
  font-family:'Anton',sans-serif; font-style:italic; font-size:20px;
  display:flex; align-items:baseline; line-height:1;
}
.home-logo-text .dot { width:5px; height:5px; background:var(--bone); border-radius:50%; margin-left:2px; }
.home-year { font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.15em; color:rgba(255,255,255,.4); }
.home-hero { background:var(--ink); color:var(--bone); padding:28px 24px 24px; }
.home-hero-title { font-family:'Anton',sans-serif; font-style:italic; font-size:36px; line-height:.92; }
.home-hero-title small { display:block; font-size:13px; color:rgba(255,255,255,.4); margin-top:6px; letter-spacing:.02em; }

/* ═══ DAY ROWS ═══ */
.days-list { max-width:900px; margin:0 auto; padding:0; }
@media (min-width:601px) {
  .days-list { padding:16px 24px; display:flex; flex-direction:column; gap:8px; }
}
.day-row {
  background:var(--paper); border-bottom:1px solid var(--chalk); padding:14px 16px 14px 0;
  display:flex; align-items:stretch; gap:12px; cursor:pointer;
  -webkit-tap-highlight-color:transparent; transition:background .12s;
}
@media (min-width:601px) {
  .day-row { border:1px solid var(--chalk); border-bottom:1px solid var(--chalk); }
  .day-row:hover { border-color:var(--dim); }
}
.day-row:hover { background:#f8f8f8; }
.day-row:active { background:#f0f0f0; }
.day-stripe { width:4px; flex-shrink:0; }
.day-body { flex:1; min-width:0; padding-left:12px; }
.day-name { font-family:'Anton',sans-serif; font-style:italic; font-size:20px; color:var(--ink); line-height:1; }
.day-date { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.12em; color:var(--dim); margin-top:3px; text-transform:uppercase; }
.disc-badges { display:flex; gap:8px; align-items:center; margin-top:8px; flex-wrap:wrap; }
.disc-badge { display:inline-flex; align-items:center; gap:5px; }
.disc-seal {
  width:20px; height:20px; display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.disc-label { font-family:'Anton',sans-serif; font-style:italic; font-size:12px; line-height:1; }
.disc-sep { width:1px; height:14px; background:var(--chalk); }
.day-arrow { font-family:'JetBrains Mono',monospace; font-size:16px; color:var(--dim); align-self:center; flex-shrink:0; }

/* ═══ SUBMENU ═══ */
.submenu-header { background:var(--ink); color:var(--bone); padding:16px 24px 16px; position:sticky; top:0; z-index:10; border-bottom:3px solid var(--accent); }
.submenu-day-title { font-family:'Anton',sans-serif; font-style:italic; font-size:28px; line-height:1; margin-top:8px; }
.submenu-prompt { font-family:'JetBrains Mono',monospace; font-size:9px; color:rgba(255,255,255,.45); letter-spacing:.12em; text-transform:uppercase; margin-top:5px; }
.disc-list { max-width:900px; margin:0 auto; }
@media (min-width:601px) {
  .disc-list { padding:16px 24px; display:flex; flex-direction:column; gap:8px; }
}
.disc-card {
  padding:16px 20px; background:var(--paper); border-bottom:1px solid var(--chalk);
  display:flex; align-items:center; gap:14px; cursor:pointer;
  -webkit-tap-highlight-color:transparent; transition:background .12s;
}
@media (min-width:601px) {
  .disc-card { border:1px solid var(--chalk); }
  .disc-card:hover { border-color:var(--dim); }
}
.disc-card:hover { background:#f8f8f8; }
.disc-card-seal {
  width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.disc-card-info { flex:1; }
.disc-card-name { font-family:'Anton',sans-serif; font-style:italic; font-size:18px; line-height:1; }
.disc-card-meta { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.1em; color:var(--dim); text-transform:uppercase; margin-top:3px; }

/* ═══ DIVISION STRIP ═══ */
.div-strip { display:flex; gap:0; background:var(--bone); border-bottom:1px solid var(--chalk); flex-shrink:0; overflow-x:auto; scrollbar-width:none; }
.div-strip::-webkit-scrollbar { display:none; }
.div-strip-btn {
  flex:1; min-width:0; padding:10px 6px; font-family:'Anton',sans-serif; font-style:italic; font-size:13px;
  text-align:center; color:var(--dim); cursor:pointer; -webkit-tap-highlight-color:transparent;
  border:none; background:none; position:relative; transition:color .15s,background .15s;
  white-space:nowrap; border-right:1px solid var(--chalk);
}
.div-strip-btn:last-child { border-right:none; }
.div-strip-btn:hover { background:rgba(0,0,0,.03); color:var(--ink); }
.div-strip-btn.active { color:var(--ink); background:var(--paper); }
.div-strip-btn.active::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:var(--accent); }
.div-strip-btn .div-strip-count {
  display:block; font-family:'JetBrains Mono',monospace; font-style:normal; font-size:8px;
  font-weight:500; color:var(--dim); letter-spacing:.06em; margin-top:1px;
}

/* ═══ TABS ═══ */
.tabs-bar { background:var(--paper); border-bottom:2px solid var(--ink); display:flex; flex-shrink:0; }
.tab-btn {
  flex:1; padding:12px 8px; font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.08em; text-align:center; color:var(--dim); cursor:pointer;
  position:relative; -webkit-tap-highlight-color:transparent; border:none; background:none; transition:color .15s;
}
.tab-btn:hover { color:var(--ink); }
.tab-btn.active { color:var(--ink); }
.tab-btn.active::after { content:''; position:absolute; bottom:-2px; left:0; right:0; height:3px; background:var(--accent); }

/* ═══ TABLE ═══ */
.leader-callout { padding:14px 20px; display:flex; align-items:center; gap:12px; border-bottom:2px solid var(--ink); }
.leader-shield { width:36px; height:36px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.leader-info { flex:1; }
.leader-name { font-family:'Inter Tight',sans-serif; font-size:14px; font-weight:700; }
.leader-meta { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); letter-spacing:.06em; margin-top:2px; }
.leader-pts { font-family:'Anton',sans-serif; font-style:italic; font-size:32px; line-height:1; }
.pos-table { width:100%; border-collapse:collapse; table-layout:fixed; }
.pos-table th {
  padding:8px 10px; font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700;
  text-align:left; text-transform:uppercase; letter-spacing:.06em; color:var(--fog);
  border-bottom:1px solid var(--ink); background:var(--paper); position:sticky; top:0; z-index:2;
}
.pos-table th:nth-child(1) { width:36px; text-align:center; }
.pos-table th:nth-child(3),.pos-table th:nth-child(4) { text-align:center; width:60px; }
.pos-table th:nth-child(5) { text-align:right; padding-right:16px; width:70px; }
.pos-table td {
  padding:10px 10px; border-bottom:1px solid var(--chalk); font-family:'JetBrains Mono',monospace;
  font-size:12px; vertical-align:middle;
}
.pos-table td:nth-child(1) { text-align:center; font-weight:700; width:36px; }
.pos-table td:nth-child(3),.pos-table td:nth-child(4) { text-align:center; width:60px; }
.pos-table td:nth-child(5) {
  text-align:right; padding-right:16px; font-family:'Anton',sans-serif; font-style:italic; font-size:18px; width:70px;
}
@media (max-width:480px) {
  .pos-table th:nth-child(3),.pos-table th:nth-child(4) { width:36px; }
  .pos-table th:nth-child(5) { width:50px; }
  .pos-table td:nth-child(3),.pos-table td:nth-child(4) { width:36px; }
  .pos-table td:nth-child(5) { width:50px; font-size:16px; }
  .pos-table td { padding:9px 6px; font-size:11px; }
}
.pos-table .team-cell { display:flex; align-items:center; gap:8px; }
.team-shield-sm { width:22px; height:22px; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.team-name-cell { font-family:'Inter Tight',sans-serif; font-size:13px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:480px) { .team-name-cell { font-size:12px; } }
.pos-table tr.zone-asc td { background:rgba(242,107,31,.05); }
.pos-table tr.zone-asc td:first-child { border-left:3px solid var(--accent); }
.pos-table tr.zone-desc td { background:rgba(230,57,70,.04); }
.pos-table tr.zone-desc td:first-child { border-left:3px solid var(--rd); }
.pos-table tr.zone-sep td { border-bottom:2px dashed var(--chalk); }
.dg-pos { color:var(--gr-dk); }
.dg-neg { color:var(--rd); }

/* ═══ FIXTURE ═══ */
.jornada-nav { display:flex; align-items:center; justify-content:center; padding:10px 20px; background:var(--paper); border-bottom:2px solid var(--ink); gap:20px; }
.jornada-arrow { font-family:'JetBrains Mono',monospace; font-size:18px; color:var(--dim); cursor:pointer; padding:4px 8px; -webkit-tap-highlight-color:transparent; }
.jornada-arrow:hover { color:var(--ink); }
.jornada-label { font-family:'Anton',sans-serif; font-style:italic; font-size:16px; }
.hora-header { background:var(--ink); color:var(--bone); padding:8px 20px; display:flex; justify-content:space-between; align-items:center; }
.hora-time { font-family:'Anton',sans-serif; font-style:italic; font-size:14px; }
.hora-count { font-family:'JetBrains Mono',monospace; font-size:9px; color:rgba(255,255,255,.4); letter-spacing:.1em; text-transform:uppercase; }
.match-row {
  display:grid; grid-template-columns:40px 1fr 80px 1fr 22px; align-items:center;
  padding:12px 10px 12px 0; border-bottom:1px solid var(--chalk); background:var(--paper);
  cursor:pointer; -webkit-tap-highlight-color:transparent; border-left:3px solid transparent; transition:background .12s;
}
@media (max-width:480px) {
  .match-row { grid-template-columns:28px 1fr 60px 1fr 22px; padding:10px 6px 10px 0; }
}
.match-row:hover { background:#f8f8f8; }
.match-row.live { background:rgba(230,57,70,.04); border-left-color:var(--rd); }
.match-row.finished { opacity:.85; }
.match-ch { font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:var(--dim); text-align:center; letter-spacing:.04em; padding-left:4px; }
.match-team { font-family:'Inter Tight',sans-serif; font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 6px; }
.match-team.away { text-align:right; }
.match-score { text-align:center; font-family:'Anton',sans-serif; font-style:italic; font-size:18px; line-height:1; }
@media (max-width:480px) {
  .match-team { font-size:13px; padding:0 4px; }
  .match-score { font-size:16px; }
}
.match-score.live { color:var(--rd); }
.match-score.vs { font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:var(--chalk); font-style:normal; }
.match-arrow-sm { font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--chalk); text-align:center; }
.live-dot-inline { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--rd); animation:pulse 1.2s infinite; margin-right:4px; vertical-align:middle; }

/* ═══ STATS ═══ */
.stat-callout { background:var(--paper); border-bottom:2px solid var(--ink); padding:14px 20px; display:flex; align-items:center; gap:12px; }
.stat-callout-icon { width:36px; height:36px; background:var(--ink); display:flex; align-items:center; justify-content:center; font-family:'Anton',sans-serif; font-style:italic; font-size:12px; color:#fff; flex-shrink:0; }
.stat-callout-info { flex:1; }
.stat-callout-name { font-family:'Inter Tight',sans-serif; font-size:14px; font-weight:700; }
.stat-callout-meta { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); letter-spacing:.06em; margin-top:2px; }
.stat-callout-num { font-family:'Anton',sans-serif; font-style:italic; font-size:32px; }
.stabs { display:flex; gap:4px; padding:8px 16px; background:var(--bone); flex-wrap:wrap; }
.stab-btn {
  padding:6px 10px; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700;
  text-transform:uppercase; letter-spacing:.06em; border:1px solid var(--chalk);
  background:var(--paper); color:var(--fog); cursor:pointer; -webkit-tap-highlight-color:transparent;
}
.stab-btn.active { background:var(--ink); color:var(--bone); border-color:var(--ink); }
.scorer-row { display:flex; align-items:center; gap:10px; padding:10px 20px; border-bottom:1px solid var(--chalk); background:var(--paper); }
.scorer-rk { font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; width:18px; text-align:center; color:var(--dim); }
.scorer-rk.r1 { color:var(--ink); }
.scorer-info { flex:1; min-width:0; }
.scorer-name { font-family:'Inter Tight',sans-serif; font-size:13px; font-weight:700; }
.scorer-team-label { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); letter-spacing:.06em; }
.scorer-val { font-family:'Anton',sans-serif; font-style:italic; font-size:18px; }

/* ═══ CONTENT WRAPPER (centers content in wide screens) ═══ */
.content-wrap { max-width:900px; margin:0 auto; transition:opacity .15s ease-out; }
.content-wrap.loading { opacity:.35; pointer-events:none; }

/* ═══ FICHA ═══ */
.ficha-topbar { background:var(--ink); color:var(--bone); padding:16px 24px 10px; position:sticky; top:0; z-index:10; border-bottom:3px solid var(--accent); }
.ficha-hero { background:var(--ink); color:var(--bone); padding:12px 20px 20px; display:flex; flex-direction:column; align-items:center; gap:10px; }
.ficha-status { display:inline-flex; align-items:center; gap:6px; padding:4px 12px; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; }
.ficha-status.live { color:var(--rd); background:rgba(230,57,70,.14); border:1px solid rgba(230,57,70,.4); }
.ficha-status.upcoming { color:rgba(255,255,255,.7); border:1px solid rgba(255,255,255,.2); }
.ficha-status.finished { color:rgba(255,255,255,.55); border:1px solid rgba(255,255,255,.2); }
.ficha-teams-grid { display:grid; grid-template-columns:1fr auto 1fr; gap:14px; align-items:center; width:100%; }
.ficha-team-col { display:flex; flex-direction:column; align-items:center; gap:6px; }
.ficha-shield { width:40px; height:40px; display:flex; align-items:center; justify-content:center; }
.ficha-team-name { font-family:'Anton',sans-serif; font-style:italic; font-size:12px; text-align:center; line-height:1.1; }
.ficha-score-box { display:flex; align-items:center; gap:8px; }
.ficha-num { font-family:'Anton',sans-serif; font-style:italic; font-size:44px; line-height:1; }
.ficha-num.live-num { color:var(--rd); }
.ficha-num.muted { color:rgba(255,255,255,.25); }
.ficha-num.empty-score { color:rgba(255,255,255,.15); font-size:30px; }
.ficha-sep { font-family:'JetBrains Mono',monospace; font-size:20px; color:rgba(255,255,255,.18); }
.ficha-meta-line { font-family:'JetBrains Mono',monospace; font-size:9px; color:rgba(255,255,255,.4); text-transform:uppercase; letter-spacing:.1em; margin-top:4px; }
.ficha-section-title { background:var(--ink); padding:8px 20px; border-top:1px solid rgba(255,255,255,.06); font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:rgba(255,255,255,.85); }

/* ═══ MATCH INFO BAR ═══ */
.match-info-bar { display:grid; grid-template-columns:1fr 1px 1fr; background:var(--paper); border-bottom:2px solid var(--ink); }
.match-info-cell { padding:12px 16px; display:flex; align-items:center; gap:10px; }
.match-info-cell:last-child { justify-content:flex-end; text-align:right; }
.match-info-icon { width:36px; height:36px; background:var(--ink); display:flex; align-items:center; justify-content:center; font-family:'Anton',sans-serif; font-style:italic; font-size:11px; color:var(--bone); flex-shrink:0; line-height:1; }
.match-info-value { font-family:'Anton',sans-serif; font-style:italic; font-size:18px; line-height:1; color:var(--ink); }
.match-info-label { font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; color:var(--dim); letter-spacing:.1em; text-transform:uppercase; margin-top:2px; }
.match-info-divider { background:var(--chalk); margin:8px 0; }
.match-info-ref { padding:8px 16px; background:var(--bone); border-bottom:1px solid var(--chalk); display:flex; align-items:center; gap:8px; }
.match-info-ref-icon { font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:var(--dim); letter-spacing:.06em; }
.match-info-ref-name { font-family:'Inter Tight',sans-serif; font-size:11px; font-weight:600; color:var(--fog); }

/* ═══ EVENTS TIMELINE ═══ */
.events-timeline { position:relative; background:var(--paper); }
.events-timeline::before { content:''; position:absolute; top:0; bottom:0; left:50%; width:1px; background:var(--chalk); z-index:0; }
.ev-row { display:grid; grid-template-columns:1fr 44px 1fr; align-items:center; min-height:42px; position:relative; border-bottom:1px solid rgba(0,0,0,.04); }
.ev-row:last-child { border-bottom:1px solid var(--chalk); }
.ev-center { display:flex; align-items:center; justify-content:center; z-index:1; }
.ev-min { font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:var(--paper); background:var(--ink); width:34px; height:22px; display:flex; align-items:center; justify-content:center; letter-spacing:.02em; }
.ev-left,.ev-right { display:flex; align-items:center; gap:6px; padding:8px 12px; }
.ev-left { justify-content:flex-end; text-align:right; }
.ev-right { justify-content:flex-start; text-align:left; }
.ev-left .ev-content { order:0; } .ev-left .ev-ico { order:1; }
.ev-right .ev-content { order:1; } .ev-right .ev-ico { order:0; }
.ev-empty { padding:8px; }
.ev-ico { font-size:14px; flex-shrink:0; width:18px; text-align:center; }
.ev-card { width:10px; height:14px; display:inline-block; flex-shrink:0; }
.ev-card.yellow { background:var(--yw); }
.ev-card.red { background:var(--rd); }
.ev-player { font-family:'Inter Tight',sans-serif; font-size:12px; font-weight:700; line-height:1.2; }
.ev-detail { font-family:'JetBrains Mono',monospace; font-size:8px; color:var(--dim); letter-spacing:.04em; text-transform:uppercase; margin-top:1px; }
.ev-row.is-goal .ev-min { background:var(--ink); }
.ev-row.is-subs .ev-min { background:var(--fog); font-size:8px; letter-spacing:0; }
.ev-subs-label { font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:var(--fog); letter-spacing:.04em; text-transform:uppercase; display:flex; align-items:center; gap:5px; }
.ev-subs-label::before { content:''; width:12px; height:12px; border:2px solid var(--fog); display:inline-flex; flex-shrink:0; }
.ev-subs-count { font-family:'JetBrains Mono',monospace; font-size:8px; color:var(--dim); letter-spacing:.04em; }
.ev-halftime { display:flex; align-items:center; justify-content:center; padding:6px 20px; background:var(--bone); border-bottom:1px solid var(--chalk); gap:10px; }
.ev-halftime-line { flex:1; height:1px; background:var(--chalk); }
.ev-halftime-label { font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; color:var(--dim); letter-spacing:.15em; text-transform:uppercase; }

/* ═══ FICHA SECTIONS ═══ */
.stat-compare { display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:center; padding:10px 20px; background:var(--paper); border-bottom:1px solid var(--chalk); }
.stat-val-l,.stat-val-r { font-family:'Anton',sans-serif; font-style:italic; font-size:16px; }
.stat-val-l { text-align:left; }
.stat-val-r { text-align:right; color:var(--dim); }
.stat-label { font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:var(--dim); text-transform:uppercase; letter-spacing:.08em; text-align:center; }
.figura-row { display:flex; align-items:center; gap:12px; padding:12px 20px; background:var(--paper); border-bottom:1px solid var(--chalk); }
.figura-icon { font-size:20px; }
.figura-info { flex:1; }
.figura-name { font-family:'Inter Tight',sans-serif; font-size:13px; font-weight:700; }
.figura-meta { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); }
.forma-badges { display:flex; gap:4px; }
.forma-badge { width:22px; height:22px; display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:#fff; }
.forma-badge.w { background:var(--gr-dk); }
.forma-badge.d { background:var(--dim); }
.forma-badge.l { background:var(--rd); }

/* ═══ PROFILE SCREENS ═══ */
.profile-hero { background:var(--ink); color:var(--bone); padding:12px 20px 20px; display:flex; flex-direction:column; align-items:center; gap:8px; }
.profile-shield { width:64px; height:64px; display:flex; align-items:center; justify-content:center; }
.profile-name { font-family:'Anton',sans-serif; font-style:italic; font-size:24px; text-align:center; line-height:1; }
.profile-meta { font-family:'JetBrains Mono',monospace; font-size:9px; color:rgba(255,255,255,.45); letter-spacing:.1em; text-transform:uppercase; text-align:center; }
.profile-disc-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border:1px solid rgba(255,255,255,.15); margin-top:4px; }
.profile-disc-badge span { font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:rgba(255,255,255,.7); letter-spacing:.06em; }
.profile-kpis { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:2px solid var(--ink); }
.profile-kpi { padding:12px 8px; text-align:center; background:var(--paper); border-right:1px solid var(--chalk); }
.profile-kpi:last-child { border-right:none; }
.profile-kpi-val { font-family:'Anton',sans-serif; font-style:italic; font-size:22px; line-height:1; color:var(--ink); }
.profile-kpi-label { font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; color:var(--dim); letter-spacing:.08em; text-transform:uppercase; margin-top:3px; }
.profile-section-title { background:var(--ink); padding:8px 20px; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:rgba(255,255,255,.85); }
.profile-row { display:flex; align-items:center; gap:10px; padding:10px 20px; border-bottom:1px solid var(--chalk); background:var(--paper); }
.profile-row.clickable { cursor:pointer; -webkit-tap-highlight-color:transparent; transition:background .12s; }
.profile-row.clickable:hover { background:#f8f8f8; }
.profile-row-icon { width:28px; height:28px; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:16px; }
.profile-row-info { flex:1; min-width:0; }
.profile-row-main { font-family:'Inter Tight',sans-serif; font-size:13px; font-weight:700; line-height:1.2; }
.profile-row-sub { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); letter-spacing:.04em; margin-top:1px; }
.profile-row-val { font-family:'Anton',sans-serif; font-style:italic; font-size:16px; flex-shrink:0; }
.profile-row-arrow { font-family:'JetBrains Mono',monospace; font-size:14px; color:var(--chalk); flex-shrink:0; }
.history-row { display:flex; align-items:center; gap:10px; padding:10px 20px; border-bottom:1px solid var(--chalk); background:var(--paper); }
.history-year { font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:var(--dim); width:32px; flex-shrink:0; }
.history-info { flex:1; min-width:0; }
.history-title { font-family:'Inter Tight',sans-serif; font-size:12px; font-weight:700; }
.history-detail { font-family:'JetBrains Mono',monospace; font-size:9px; color:var(--dim); letter-spacing:.04em; }
.history-badge { font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; padding:3px 6px; text-transform:uppercase; letter-spacing:.06em; flex-shrink:0; }
.history-badge.champ { background:var(--ink); color:var(--bone); }
.history-badge.asc { background:var(--gr-dk); color:#fff; }
.history-badge.desc { background:var(--rd); color:#fff; }
.history-badge.mid { background:var(--chalk); color:var(--fog); }
.player-avatar { width:64px; height:64px; background:var(--fog); display:flex; align-items:center; justify-content:center; font-family:'Anton',sans-serif; font-style:italic; font-size:24px; color:#fff; }
.player-position-badge { display:inline-flex; padding:3px 8px; border:1px solid rgba(255,255,255,.2); font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:rgba(255,255,255,.6); letter-spacing:.08em; text-transform:uppercase; }
.team-link { cursor:pointer; -webkit-tap-highlight-color:transparent; transition:opacity .12s; }
.team-link:hover { opacity:.7; }

/* ═══ DEBUG (hidden by default, shown with ?debug=1) ═══ */
.debug-panel { position:fixed; bottom:16px; left:16px; background:rgba(0,0,0,.85); color:#0f0; font-family:'JetBrains Mono',monospace; font-size:10px; padding:10px 14px; z-index:9999; max-width:220px; line-height:1.5; }
.debug-panel .debug-label { color:#666; font-size:8px; letter-spacing:.1em; text-transform:uppercase; }
.reset-btn { position:fixed; bottom:16px; right:16px; background:var(--ink); color:var(--bone); font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; padding:8px 14px; border:none; cursor:pointer; z-index:9999; letter-spacing:.06em; }
.reset-btn:hover { background:#333; }