/* ============================================================
   LIVE SCORE PAGE CSS
   - Red cards on team names
   - Halftime score
   - Filter bar (All / Live / Upcoming / Finished)
   - Green minutes (live)
   - Goal flash + badge
============================================================ */

.page-shell{ max-width:1080px; margin:24px auto 40px; padding:0 14px; position: relative; z-index: 2; }

.glass-card{
  background:rgba(255,255,255,0.86);
  padding:22px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,0.7);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
  box-shadow:0 24px 60px rgba(15,23,42,0.18);
}

.page-intro h1{ margin:0 0 10px; font-size:28px; font-weight:800; letter-spacing: -0.3px; line-height: 1.2; color:#0f172a; }
.page-intro .last-updated{ display: inline-block; font-size: 12.5px; color: #666; background: rgba(0,0,0,0.04); padding: 4px 10px; border-radius: 999px; margin-bottom: 14px; }
.page-intro p{ font-size:14.5px; margin:8px 0; color:#444; line-height: 1.6; }

.info-strip{ display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 4px; }
.info-chip{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px; border-radius: 999px;
  background: rgba(0,0,0,0.04);
  font-size: 12.5px; font-weight: 600; color: #333;
  border: 1px solid rgba(0,0,0,0.06);
}
.info-chip .dot{
  width: 8px; height: 8px; border-radius: 50%;
  background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.15);
  animation: dot-pulse 1.6s infinite;
}
@keyframes dot-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }

.ls-controls{ margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap; }
.ls-sound-btn{
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px;
  background: rgba(255,255,255,.65);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 999px;
  font-size: 13px; font-weight: 600; color: #333;
  cursor: pointer; transition: all .2s ease;
}
.ls-sound-btn:hover{
  background: #0f172a; color: #fff;
  border-color: #0f172a; transform: translateY(-1px);
}
.ls-sound-btn[aria-pressed="true"]{
  background: linear-gradient(135deg, #22c55e, #16a34a);
  color: #fff; border-color: transparent;
  box-shadow: 0 4px 12px rgba(34,197,94,.3);
}
.ls-sound-icon{ font-size: 15px; }

.ls-board{
  margin-top: 18px; border-radius: 20px; overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,0.85), rgba(249,250,255,0.75));
  border: 1px solid rgba(15,23,42,0.06);
  box-shadow: 0 4px 12px rgba(15,23,42,0.04), inset 0 1px 0 rgba(255,255,255,0.8);
}

/* ============================================================
   FILTER BAR
============================================================ */
.ls-filter-bar{
  display: flex;
  gap: 8px;
  padding: 12px 14px;
  background: linear-gradient(180deg, #ffffff, #f8faff);
  border-bottom: 1px solid rgba(15,23,42,0.08);
  flex-wrap: wrap;
}

.ls-filter-btn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  background: rgba(15,23,42,0.04);
  border: 1px solid rgba(15,23,42,0.06);
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 700;
  color: #475569;
  cursor: pointer;
  transition: all .15s ease;
  letter-spacing: 0.2px;
}
.ls-filter-btn:hover{
  background: rgba(15,23,42,0.08);
  transform: translateY(-1px);
}
.ls-filter-btn.is-active{
  background: linear-gradient(135deg, #0f172a, #1e293b);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 10px rgba(15,23,42,0.2);
}
.ls-filter-btn.ls-filter-live{
  position: relative;
}
.ls-filter-btn.ls-filter-live::before{
  content: "";
  display: inline-block;
  width: 7px; height: 7px; border-radius: 50%;
  background: #16a34a;
  animation: filter-live-pulse 1.6s infinite;
  margin-right: 2px;
}
.ls-filter-btn.ls-filter-live.is-active{
  background: linear-gradient(135deg, #16a34a, #15803d);
  box-shadow: 0 4px 10px rgba(34,197,94,0.35);
}
.ls-filter-btn.ls-filter-live.is-active::before{
  background: #fff;
  box-shadow: 0 0 0 3px rgba(255,255,255,0.3);
}
@keyframes filter-live-pulse{
  0%,100%{ opacity:1; transform: scale(1); }
  50%{ opacity:.5; transform: scale(0.8); }
}

.ls-filter-count{
  display: inline-block;
  background: rgba(0,0,0,0.08);
  color: inherit;
  padding: 1px 7px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  min-width: 18px;
  text-align: center;
}
.ls-filter-btn.is-active .ls-filter-count{
  background: rgba(255,255,255,0.22);
  color: #fff;
}

/* ============================================================
   LOADING / EMPTY
============================================================ */
.ls-loading{ padding: 50px 20px; text-align: center; color: #64748b; font-size: 14px; }
.ls-spinner{
  width: 36px; height: 36px; margin: 0 auto 16px;
  border: 3px solid rgba(15,23,42,0.08); border-top-color: #0f172a;
  border-radius: 50%; animation: ls-spin 0.8s linear infinite;
}
@keyframes ls-spin{ to{ transform: rotate(360deg); } }

.ls-empty{ padding: 60px 20px; text-align: center; color: #64748b; }
.ls-empty-icon{ font-size: 42px; margin-bottom: 12px; opacity: .5; }
.ls-empty-title{ font-size: 17px; font-weight: 700; color: #334155; margin-bottom: 6px; }
.ls-empty-text{ font-size: 13.5px; line-height: 1.5; max-width: 360px; margin: 0 auto; }
.ls-empty-filter{ padding: 40px 20px; }

/* ============================================================
   FAVORITES & LIVE-PINNED SECTIONS
============================================================ */
.ls-favorites-section{ border-bottom: 2px solid rgba(245,158,11,.2); }
.ls-favorites-header{
  background: linear-gradient(90deg, #f59e0b, #eab308);
  color: #fff; padding: 10px 16px;
  font-weight: 700; font-size: 12.5px; letter-spacing: 0.4px;
  text-transform: uppercase; display: flex; align-items: center; gap: 8px;
}

.ls-league-header{
  background: linear-gradient(90deg, #0f172a, #1e293b);
  color: #fff; padding: 10px 16px;
  font-weight: 700; font-size: 12.5px; letter-spacing: 0.4px;
  text-transform: uppercase; display: flex; align-items: center; gap: 8px;
}
.ls-league-country{
  margin-left: auto; font-size: 10.5px; opacity: 0.7;
  font-weight: 500; text-transform: none; letter-spacing: 0;
}

/* ============================================================
   MATCH ROW
============================================================ */
.ls-match{
  display: grid;
  grid-template-columns: 60px 36px 1fr 92px 28px;
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(15,23,42,0.05);
  cursor: pointer;
  transition: background .15s ease;
  gap: 8px;
  position: relative;
}
.ls-match:hover{ background: linear-gradient(180deg, rgba(0,163,255,0.04), rgba(0,163,255,0.02)); }
.ls-match.is-open{ background: linear-gradient(180deg, rgba(0,163,255,0.06), rgba(0,163,255,0.03)); }
.ls-match:last-child{ border-bottom: none; }

.ls-match.ls-not-clickable{ cursor: default; }
.ls-match.ls-not-clickable:hover{ background: transparent; }

.ls-match-finished{ opacity: 0.78; }
.ls-match-upcoming{ background: rgba(99,102,241,0.02); }

/* ============================================================
   TIME (Green for LIVE)
============================================================ */
.ls-time{
  font-size: 12px; font-weight: 700; white-space: nowrap;
  display: flex; align-items: center; gap: 5px;
}
.ls-time-live{ color: #16a34a; }
.ls-time-live::before{
  content: ""; display: inline-block;
  width: 7px; height: 7px; border-radius: 50%; background: #16a34a;
  animation: live-pulse 1.5s infinite;
}
@keyframes live-pulse{
  0%,100%{ opacity:1; transform: scale(1); }
  50%{ opacity:.4; transform: scale(0.85); }
}
.ls-time-upcoming{ color: #6366f1; font-weight: 700; font-size: 13px; }
.ls-time-badge{
  display: inline-block; padding: 3px 7px; border-radius: 6px;
  background: rgba(15,23,42,0.08); color: #64748b;
  font-size: 11px; font-weight: 700;
}
.ls-badge-ht{ background: rgba(245,158,11,0.15); color: #b45309; }
.ls-badge-ft{ background: rgba(100,116,139,0.12); color: #475569; }

.ls-star{
  background: transparent; border: 0; cursor: pointer;
  padding: 4px; font-size: 18px; color: #cbd5e1;
  transition: all .15s ease; line-height: 1;
}
.ls-star:hover{ transform: scale(1.15); color: #f59e0b; }
.ls-star.is-starred{ color: #f59e0b; }

.ls-teams{ font-size: 14px; font-weight: 600; color: #0f172a; line-height: 1.4; }
.ls-team{ display: inline; }
.ls-teams-vs{ color: #94a3b8; font-weight: 400; font-size: 11.5px; margin: 0 4px; }

/* ============================================================
   RED CARDS ON TEAM NAMES
============================================================ */
.ls-redcards{
  display: inline-flex;
  gap: 2px;
  margin-left: 5px;
  vertical-align: middle;
}
.ls-card-red-icon{
  display: inline-block;
  width: 9px;
  height: 13px;
  background: #ef4444;
  border-radius: 1px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}

/* ============================================================
   SCORE + HALFTIME (stacked)
============================================================ */
.ls-score-wrap{
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.ls-score{
  font-size: 16px; font-weight: 800;
  color: #0f172a; letter-spacing: 1.5px;
  font-variant-numeric: tabular-nums;
  transition: color .2s ease;
  line-height: 1.2;
}
.ls-score-upcoming{ color: #94a3b8; font-size: 13px; font-weight: 600; letter-spacing: 0.5px; }
.ls-score-finished{ color: #475569; }
.ls-ht-score{
  font-size: 10px;
  color: #94a3b8;
  font-weight: 600;
  letter-spacing: 0.3px;
  font-variant-numeric: tabular-nums;
}

.ls-chevron{
  text-align: right; font-size: 16px; color: #94a3b8;
  transition: transform .2s ease;
}
.ls-chevron-empty{ width: 16px; }
.ls-match.is-open .ls-chevron{ transform: rotate(180deg); color: #0f172a; }

/* ============================================================
   GOAL FLASH + BADGE
============================================================ */
.ls-match.ls-goal-flash{
  animation: ls-row-flash 1.5s ease-out;
  z-index: 1;
}
@keyframes ls-row-flash{
  0%   { background: rgba(34,197,94,0.40); box-shadow: inset 0 0 0 2px rgba(34,197,94,0.7); }
  40%  { background: rgba(34,197,94,0.22); box-shadow: inset 0 0 0 2px rgba(34,197,94,0.35); }
  100% { background: transparent; box-shadow: none; }
}

.ls-score.ls-score-flash{
  animation: ls-score-pulse 1.2s ease-out;
}
@keyframes ls-score-pulse{
  0%   { transform: scale(1);    color: #16a34a; }
  30%  { transform: scale(1.35); color: #15803d; text-shadow: 0 0 12px rgba(34,197,94,0.6); }
  100% { transform: scale(1);    color: #0f172a; text-shadow: none; }
}

.ls-goal-badge{
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.4px;
  border-radius: 999px;
  color: #fff;
  vertical-align: middle;
  white-space: nowrap;
  animation: ls-badge-pop 0.45s cubic-bezier(.34,1.56,.64,1), ls-badge-pulse 1.4s ease-in-out infinite 0.45s;
}
.ls-goal-badge-home{
  background: linear-gradient(135deg, #22c55e, #16a34a);
  box-shadow: 0 2px 10px rgba(34,197,94,0.45);
}
.ls-goal-badge-away{
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  box-shadow: 0 2px 10px rgba(59,130,246,0.45);
}
@keyframes ls-badge-pop{
  0%   { transform: scale(0) rotate(-15deg); opacity: 0; }
  60%  { transform: scale(1.25) rotate(6deg); opacity: 1; }
  100% { transform: scale(1) rotate(0); opacity: 1; }
}
@keyframes ls-badge-pulse{
  0%, 100%{ transform: scale(1); }
  50%     { transform: scale(1.08); }
}

/* ============================================================
   STATS PANEL
============================================================ */
.ls-stats-panel{
  background: linear-gradient(180deg, #f8faff, #eef2fa);
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease, padding .35s ease;
  border-bottom: 1px solid rgba(15,23,42,0.05);
}
.ls-stats-panel.is-open{ max-height: 5000px; padding: 18px 20px; }

.ls-stats-loading{ text-align: center; padding: 24px; color: #64748b; font-size: 13px; }

.ls-stats-teams{
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 14px;
  font-size: 13.5px; font-weight: 700; color: #0f172a;
}
.ls-stats-teams .ls-stats-label{
  font-size: 11px; font-weight: 600; color: #64748b;
  text-transform: uppercase; letter-spacing: 0.5px;
}

.ls-stat-row{ margin-bottom: 10px; }
.ls-stat-row:last-child{ margin-bottom: 0; }
.ls-stat-header{
  display: flex; justify-content: space-between;
  font-size: 11.5px; font-weight: 600; color: #475569;
  margin-bottom: 4px;
}
.ls-stat-name{ color: #94a3b8; letter-spacing: 0.3px; }
.ls-stat-bar{
  display: flex; height: 6px; border-radius: 3px; overflow: hidden;
  background: rgba(15,23,42,0.06);
}
.ls-stat-bar-home{ background: #0f172a; }
.ls-stat-bar-away{ background: #94a3b8; }

.ls-stats-extras{
  display: flex; justify-content: space-around;
  margin-top: 14px; padding-top: 14px;
  border-top: 1px solid rgba(15,23,42,0.06);
}
.ls-stats-extra{ text-align: center; }
.ls-stats-extra-label{
  font-size: 10px; color: #94a3b8;
  text-transform: uppercase; letter-spacing: 0.4px;
  margin-bottom: 4px;
}
.ls-stats-extra-value{ font-size: 13px; font-weight: 700; color: #0f172a; }

/* ============================================================
   MOBILE — takım adları ALT ALTA (uzun isim sorunu çözümü)
============================================================ */
@media (max-width: 640px){
  .page-intro h1{ font-size: 22px; }
  .glass-card{ padding: 16px; }

  /* Mobilde grid yerine flex — 5 eleman (time/star/teams/score/chevron) düzgün dizilsin */
  .ls-match{
    display: flex;
    align-items: center;
    padding: 10px 10px;
    gap: 8px;
  }
  .ls-time{ flex: 0 0 auto; min-width: 38px; }
  .ls-star{ flex: 0 0 auto; }
  .ls-teams{ flex: 1 1 auto; }
  .ls-score-wrap{ flex: 0 0 auto; }
  .ls-chevron{ flex: 0 0 auto; }

  /* Takım adları artık alt alta: ev sahibi üstte, deplasman altta */
  .ls-teams{
    font-size: 13px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    line-height: 1.25;
    min-width: 0;
  }
  .ls-team{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    word-break: break-word;
  }
  /* Mobilde "vs" gizlenir, alt alta dizilim zaten ayırıyor */
  .ls-teams-vs{ display: none; }

  /* Skor + HT sağda */
  .ls-score-wrap{ min-width: 52px; }
  .ls-score{ font-size: 16px; letter-spacing: 1px; }
  .ls-ht-score{ font-size: 9.5px; }

  .ls-time{ font-size: 11px; }
  .ls-time-upcoming{ font-size: 12px; }
  .ls-star{ font-size: 16px; padding: 2px; }

  .ls-chevron{ font-size: 13px; margin-left: 4px; }
  .ls-chevron-empty{ width: 0; }

  .ls-stats-panel.is-open{ padding: 14px 12px; }
  .ls-stats-teams{ font-size: 12px; }
  .ls-goal-badge{ font-size: 9px; padding: 1px 6px; margin-left: 4px; }
  .ls-card-red-icon{ width: 8px; height: 11px; }
  .ls-filter-btn{ padding: 6px 11px; font-size: 11.5px; }
  .ls-filter-count{ font-size: 10px; padding: 1px 5px; }

  .ls-lineups-grid{ grid-template-columns: 1fr; }
}

@media (max-width: 380px){
  .ls-match{
    padding: 9px 8px;
    gap: 6px;
  }
  .ls-time{ min-width: 32px; }
  .ls-teams{ font-size: 12.5px; }
  .ls-score{ font-size: 15px; }
  .ls-score-wrap{ min-width: 46px; }
  .ls-goal-badge{ font-size: 8.5px; padding: 1px 5px; margin-left: 3px; }
  .ls-filter-bar{ padding: 10px 8px; gap: 6px; }
  .ls-time{ font-size: 10.5px; }
}

/* ============================================================
   ARTICLE / CONTENT
============================================================ */
.article{ margin-top:26px; }
.article h2{ font-size:22px; margin-bottom:12px; font-weight: 800; letter-spacing: -0.2px; color:#0f172a; }
.article h3{ font-size:18px; margin-top:22px; font-weight: 700; color:#0f172a; }
.article p{ font-size:14.5px; line-height:1.75; color:#444; }
.article ul, .article ol{ font-size:14.5px; color: #444; line-height: 1.75; padding-left: 22px; }
.article a{ color:#0a6dd1; }

.livescore-legend{
  width: 100%; border-collapse: collapse; margin: 14px 0 8px;
  font-size: 13.5px; background: rgba(255,255,255,0.7);
  border-radius: 12px; overflow: hidden;
  border: 1px solid rgba(15,23,42,0.08);
}
.livescore-legend th, .livescore-legend td{
  padding: 10px 14px; text-align: left;
  border-bottom: 1px solid rgba(15,23,42,0.06);
}
.livescore-legend th{
  background: linear-gradient(135deg, #0f172a, #1e293b);
  color: #fff; font-weight: 700; font-size: 12px;
  letter-spacing: 0.4px; text-transform: uppercase;
}
.livescore-legend tr:last-child td{ border-bottom: none; }
.livescore-legend td:first-child{ font-weight: 800; color: #0f172a; white-space: nowrap; }
.livescore-legend tr td:first-child{ background: linear-gradient(135deg, #f1f5ff, #e4ebff); }

.author-byline{ display:flex; align-items:flex-start; gap:16px; padding:20px; margin-top: 26px; background: linear-gradient(180deg, rgba(255,255,255,0.95), rgba(249,250,255,0.85)); border:1px solid rgba(15,23,42,0.07); border-radius:18px; box-shadow: 0 6px 18px rgba(15,23,42,0.05); }
.author-byline .ab-avatar{ width:64px; height:64px; border-radius:50%; overflow:hidden; flex-shrink:0; background: linear-gradient(135deg, #0f172a, #1e293b); display:flex; align-items:center; justify-content:center; color:#ffd700; font-weight:800; font-size:22px; border:2px solid rgba(255,215,0,.35); }
.author-byline .ab-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.author-byline .ab-info{ min-width:0; flex:1; }
.author-byline .ab-kicker{ font-size:11px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:#64748b; margin-bottom:3px; }
.author-byline .ab-name{ font-size:17px; font-weight:800; color:#0f172a; text-decoration:none; letter-spacing:-0.2px; display:inline-block; margin-bottom:2px; }
.author-byline .ab-name:hover{ color:#0a6dd1; }
.author-byline .ab-style{ font-size:12.5px; color:#64748b; font-weight:600; margin-bottom: 2px; }
.author-byline .ab-bio{ font-size:13.5px; color:#475569; line-height:1.6; margin: 8px 0 10px; }
.author-byline .ab-links{ display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.author-byline .ab-more{ font-size:12.5px; font-weight:700; color:#0a6dd1; text-decoration:none; transition:color .15s ease; }
.author-byline .ab-more:hover{ color:#084a8e; text-decoration:underline; }
.author-byline .ab-social{ font-size:12px; font-weight:700; color:#475569; text-decoration:none; padding: 4px 11px; background: rgba(15,23,42,0.06); border-radius: 999px; transition: all .15s ease; }
.author-byline .ab-social:hover{ background: #0f172a; color:#fff; }

figure.hero-fig{ margin: 30px 0 6px; text-align: center; }
figure.hero-fig img{ width: 100%; max-width: 600px; height: auto; border-radius: 22px; box-shadow: 0 20px 50px rgba(0,0,0,.18); }
figure.hero-fig figcaption{ font-size: 12.5px; color: #666; margin-top: 10px; }

@media (max-width: 720px){
  .article h2{ font-size: 19px; }
  .article h3{ font-size: 16px; }
  .livescore-legend{ font-size: 12.5px; }
  .livescore-legend th, .livescore-legend td{ padding: 8px 10px; }
  .author-byline{ padding:16px; gap:12px; }
  .author-byline .ab-avatar{ width:52px; height:52px; font-size: 19px; }
  .author-byline .ab-name{ font-size:16px; }
}

/* ============================================================
   MATCH EVENTS TIMELINE
============================================================ */
.ls-events-container{
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(15,23,42,0.08);
}
.ls-events-loading{ text-align: center; padding: 12px; color: #94a3b8; font-size: 12.5px; }
.ls-events-header{
  text-align: center; font-size: 11px; font-weight: 700; color: #64748b;
  text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 12px;
}
.ls-events-timeline{ display: flex; flex-direction: column; gap: 8px; }
.ls-event{
  display: grid; grid-template-columns: 1fr 90px 1fr;
  align-items: center; gap: 8px; padding: 8px 4px;
  font-size: 12.5px; border-bottom: 1px dashed rgba(15,23,42,0.05);
}
.ls-event:last-child{ border-bottom: none; }
.ls-event-left, .ls-event-right{ min-width: 0; }
.ls-event-left{ text-align: right; padding-right: 6px; }
.ls-event-right{ text-align: left; padding-left: 6px; }
.ls-event-center{
  display: flex; align-items: center; justify-content: center; gap: 6px;
  font-size: 11px; font-weight: 700; color: #475569; white-space: nowrap;
}
.ls-event-minute{
  display: inline-block; padding: 2px 7px; background: rgba(15,23,42,0.06);
  border-radius: 6px; color: #475569; font-variant-numeric: tabular-nums;
  min-width: 32px; text-align: center;
}
.ls-event-icon{ font-size: 15px; line-height: 1; }
.ls-event-detail strong{ color: #0f172a; font-weight: 700; }
.ls-event-assist{ font-size: 11px; color: #94a3b8; margin-top: 1px; }

.ls-event-icon-goal .ls-event-icon{ color: #f59e0b; }
.ls-event-icon-goal .ls-event-minute{ background: rgba(245,158,11,0.12); color: #b45309; }
.ls-event-icon-penalty .ls-event-icon{ color: #f59e0b; }
.ls-event-icon-missed-penalty .ls-event-icon{ color: #94a3b8; text-decoration: line-through; }
.ls-event-icon-own-goal .ls-event-icon{ color: #ef4444; }

.ls-card-yellow{
  display: inline-block; width: 9px; height: 13px;
  background: #facc15; border-radius: 1px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}
.ls-card-red{
  display: inline-block; width: 9px; height: 13px;
  background: #ef4444; border-radius: 1px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}

.ls-event-icon-substitution .ls-event-icon{ color: #16a34a; }
.ls-event-out{ color: #ef4444; text-decoration: line-through; font-size: 12px; }
.ls-event-in{ color: #16a34a; font-weight: 600; font-size: 12px; }
.ls-event-arrow{ color: #94a3b8; margin: 0 4px; }
.ls-event-icon-var .ls-event-icon{ color: #6366f1; }

@media (max-width: 640px){
  .ls-event{ grid-template-columns: 1fr 70px 1fr; font-size: 12px; gap: 4px; }
  .ls-event-center{ font-size: 10px; }
  .ls-event-minute{ padding: 2px 5px; font-size: 10px; min-width: 28px; }
  .ls-event-icon{ font-size: 13px; }
}
@media (max-width: 380px){
  .ls-event{ grid-template-columns: 1fr 60px 1fr; }
  .ls-event-assist{ font-size: 10px; }
}

/* ============================================================
   LINEUPS
============================================================ */
.ls-lineups-container{
  margin-top: 18px; padding-top: 16px;
  border-top: 1px solid rgba(15,23,42,0.08);
}
.ls-lineups-header{
  text-align: center; font-size: 11px; font-weight: 700; color: #64748b;
  text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 14px;
}
.ls-lineups-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ls-lineup-team{
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(15,23,42,0.08);
  border-radius: 12px; padding: 12px;
}
.ls-lineup-team-header{
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 4px; gap: 8px;
}
.ls-lineup-team-name{
  font-size: 13px; font-weight: 700; color: #0f172a;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ls-lineup-formation{
  font-size: 11px; font-weight: 700;
  background: linear-gradient(135deg, #0f172a, #1e293b);
  color: #ffd700; padding: 3px 8px; border-radius: 999px;
  letter-spacing: 0.5px; flex-shrink: 0;
}
.ls-lineup-coach{ font-size: 11px; color: #94a3b8; margin-bottom: 10px; font-style: italic; }
.ls-lineup-list{ display: flex; flex-direction: column; gap: 4px; }
.ls-lineup-player{
  display: grid; grid-template-columns: 28px 1fr 32px;
  align-items: center; gap: 6px; font-size: 12px;
  padding: 4px 6px; border-radius: 6px;
  background: rgba(15,23,42,0.02);
}
.ls-lineup-player:hover{ background: rgba(15,23,42,0.05); }
.ls-lineup-number{
  font-weight: 700; text-align: center;
  background: #0f172a; color: #fff; font-size: 10.5px;
  padding: 2px 0; border-radius: 4px; font-variant-numeric: tabular-nums;
}
.ls-lineup-name{
  color: #0f172a; font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ls-lineup-pos{
  text-align: center; font-size: 9.5px; font-weight: 800;
  padding: 2px 0; border-radius: 4px;
  letter-spacing: 0.3px; text-transform: uppercase;
}
.ls-pos-g{ background: rgba(245,158,11,0.15); color: #b45309; }
.ls-pos-d{ background: rgba(59,130,246,0.15); color: #1d4ed8; }
.ls-pos-m{ background: rgba(34,197,94,0.15); color: #15803d; }
.ls-pos-f{ background: rgba(239,68,68,0.15); color: #b91c1c; }

.ls-lineup-subs{
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed rgba(15,23,42,0.08);
}
.ls-lineup-subs summary{
  cursor: pointer; font-size: 11.5px; font-weight: 700; color: #64748b;
  padding: 4px 0; letter-spacing: 0.2px; user-select: none;
}
.ls-lineup-subs summary:hover{ color: #0f172a; }
.ls-lineup-list-subs{ margin-top: 8px; }
.ls-lineup-sub{ opacity: 0.85; }
.ls-lineup-sub .ls-lineup-number{ background: #64748b; }

@media (max-width: 640px){
  .ls-lineups-grid{ grid-template-columns: 1fr; gap: 10px; }
  .ls-lineup-team-name{ font-size: 12.5px; }
  .ls-lineup-player{
    grid-template-columns: 26px 1fr 30px;
    font-size: 11.5px; padding: 3px 5px;
  }
  .ls-lineup-number{ font-size: 10px; }
  .ls-lineup-pos{ font-size: 9px; }
}