/* FrameMind Live — pás běžících zápasů + živá tabulka.
   Modul live.js je vizuálně neutrální; tenhle soubor mu dodává vzhled Velké
   pětky. Barvy jsou tytéž tokeny, jaké nese projekce nad tabulkou: zóny
   (titul jantar / Evropa modrá / sestup červená) znamenají v obou tabulkách
   totéž, takže se dají číst vedle sebe.

   Semafor --v-exact / --v-outcome / --v-miss je definovaný ve styles.css
   a používá se i na kartách zápasů; tady ho nese forma a sloupec Δ. */

.fml-strip {
  margin: 0 0 22px; padding: 16px 18px;
  border: 1px solid color-mix(in oklab, var(--accent) 34%, transparent);
  border-radius: 14px;
  background: linear-gradient(168deg,
              color-mix(in oklab, var(--accent) 8%, transparent),
              rgba(var(--fg-rgb),.022) 52%);
}
.fml-strip[hidden] { display: none; }

.fml-strip-head {
  display: flex; align-items: center; gap: 9px;
  font-family: var(--display); font-weight: 700;
  text-transform: uppercase; letter-spacing: .16em; font-size: 10.5px;
  color: var(--ink-3); margin-bottom: 12px;
}
.fml-strip-head b { color: var(--accent-ink); }
.fml-strip-head small { margin-left: auto; letter-spacing: .1em; }

/* tep běžících zápasů — jediná animace v modulu, klidná a pomalá */
.fml-dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--accent);
  display: inline-block; flex: none;
  animation: fml-pulse 2.4s ease-out infinite;
}
@keyframes fml-pulse {
  0%   { box-shadow: 0 0 0 0 color-mix(in oklab, var(--accent) 50%, transparent); }
  70%  { box-shadow: 0 0 0 9px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}
@media (prefers-reduced-motion: reduce) { .fml-dot { animation: none; } }

.fml-strip-list {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.fml-live-match {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px;
  padding: 12px 14px; border: 1px solid var(--line-2); border-radius: 12px;
  background: rgba(var(--sunk-rgb),.3);
}
.fml-lm-team { display: flex; align-items: center; gap: 8px; min-width: 0;
  font-weight: 500; font-size: 14px; }
.fml-lm-team.away { justify-content: flex-end; text-align: right; }
.fml-lm-team img { width: 24px; height: 24px; object-fit: contain; flex: none; }
.fml-lm-team span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fml-lm-score { text-align: center; line-height: 1.1; font-family: var(--display); }
.fml-lm-score b { font-size: 24px; font-weight: 800; letter-spacing: -.03em;
  font-variant-numeric: tabular-nums; }
.fml-lm-score i { font-style: normal; color: var(--ink-3); margin: 0 2px; }
.fml-lm-score small {
  display: block; margin-top: 2px; font-size: 10px; font-weight: 700;
  letter-spacing: .14em; color: var(--accent-ink);
}

/* ---------- živá tabulka ---------- */
/* Modul dává tabulce popisek pro čtečky. Velká pětka .sr-only nikde neměla,
   takže se vypisoval nahoře nad tabulkou jako titulek. */
.sr-only {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.fml-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.fml-table th {
  font-family: var(--display); font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .14em; color: var(--ink-3);
  text-align: left; padding: 0 8px 12px; white-space: nowrap;
}
.fml-table th.fml-num { text-align: right; }
.fml-table td { padding: 10px 8px; border-top: 1px solid var(--line); vertical-align: middle; }
.fml-table tbody tr { transition: background .25s var(--ease); }
.fml-table tbody tr:hover { background: rgba(var(--fg-rgb),.035); }

.fml-pos {
  font-family: var(--display); font-weight: 700; color: var(--ink-3);
  width: 38px; font-variant-numeric: tabular-nums;
}
.fml-club { display: flex; align-items: center; gap: 10px; font-weight: 500; }
.fml-club img { width: 24px; height: 24px; object-fit: contain; flex: none;
  filter: drop-shadow(0 2px 6px var(--sh-sm)); }
.fml-num { text-align: right; font-variant-numeric: tabular-nums;
  color: var(--ink-2); white-space: nowrap; }
.fml-pts { font-family: var(--display); font-weight: 800; color: var(--ink); font-size: 16px; }
.fml-gd { color: var(--ink-3); }

.fml-live-tag { display: inline-flex; align-items: center; margin-left: 4px; }
.fml-playing { background: color-mix(in oklab, var(--accent) 7%, transparent); }
.fml-playing .fml-pts { color: var(--accent-ink); }

/* forma — posledních pět dohraných zápasů, nejnovější vpravo.
   Týž semafor jako u hodnocení tipů na kartách zápasů. */
.fml-form { white-space: nowrap; }
.fml-f {
  display: inline-block; width: 18px; height: 18px; margin-right: 3px;
  border-radius: 5px; font-family: var(--display); font-style: normal;
  font-size: 10px; font-weight: 700; line-height: 18px; text-align: center;
}
.fml-f-w { background: var(--v-exact); color: var(--on-exact); }
.fml-f-d { background: var(--pb-d); color: var(--pb-d-ink); }
.fml-f-l { background: var(--v-miss); color: var(--on-miss); }

/* Δ proti projekci — o kolik je klub jinde, než ho model čekal */
.fml-delta .up { color: var(--v-hit-txt); }
.fml-delta .down { color: color-mix(in oklab, var(--v-miss) 52%, var(--ink)); }
.fml-delta .same { color: var(--ink-3); }

.fml-empty { padding: 26px 8px; color: var(--ink-2); text-align: center; }

/* Zóny soutěže. Význam je stejný jako v projekci nad tabulkou, proto i barvy. */
.fml-z-title td:first-child { box-shadow: inset 3px 0 0 var(--z-title); }
.fml-z-eur   td:first-child { box-shadow: inset 3px 0 0 var(--z-eur); }
.fml-z-rel   td:first-child { box-shadow: inset 3px 0 0 var(--z-rel); }

.fml-legend {
  display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 16px;
  font-size: 12px; color: var(--ink-3);
}
.fml-legend i { display: inline-block; width: 10px; height: 10px;
  border-radius: 3px; margin-right: 7px; vertical-align: middle; }
.fml-legend .z-title { background: var(--z-title); }
.fml-legend .z-eur   { background: var(--z-eur); }
.fml-legend .z-rel   { background: var(--z-rel); }

/* přesun v pořadí po gólu */
.fml-moved-up td { background: color-mix(in oklab, var(--v-exact) 14%, transparent); }
.fml-moved-down td { background: color-mix(in oklab, var(--v-miss) 14%, transparent); }
.fml-moved-up td, .fml-moved-down td { transition: background 1.2s ease; }

.live-stamp { font-size: 12.5px; color: var(--ink-3); margin: 0 0 14px;
  display: flex; align-items: center; gap: 8px; }
.live-wrap { overflow-x: auto; }

@media (max-width: 760px) {
  .fml-table { font-size: 13px; }
  .fml-table th, .fml-table td { padding-left: 5px; padding-right: 5px; }
  /* na úzkém displeji ustoupí výhry/remízy/prohry — skóre a body zůstávají */
  .fml-table th:nth-child(4), .fml-table td:nth-child(4),
  .fml-table th:nth-child(5), .fml-table td:nth-child(5),
  .fml-table th:nth-child(6), .fml-table td:nth-child(6),
  .fml-form-h, .fml-form { display: none; }
  .fml-lm-team span { font-size: 13px; }
}