/* ===== Série F: facelift jejich současného slidu =====
   Struktura zůstává: ikona · číslo · název · hlasy vpravo · pruh s procentem uvnitř.
   Mění se jen velikosti, rozestupy a drobnosti (modifikátory f-…).                     */
.f .rows { top: 176px; gap: 20px; }
.f .row { --nfs: 48px; --vfs: 40px; --bh: 72px; --pfs: 48px; --fr: 0px; height: 156px; align-content: start; row-gap: 8px; column-gap: 14px;
  grid-template-columns: auto auto 1fr auto; grid-template-rows: 60px auto; grid-template-areas: "ico no name votes" "bar bar bar bar"; }
.f .ico { display: block; grid-area: ico; width: 44px; height: 44px; color: var(--ink); align-self: center; }
.f .no { grid-area: no; font-size: var(--nfs); font-weight: 700; color: var(--ink); }
.f .name { grid-area: name; font-size: var(--nfs); font-weight: 600; }
.f .votes { grid-area: votes; font-size: var(--vfs); }
.f .bar { grid-area: bar; height: var(--bh); border-radius: var(--fr); }
.f .bar i { border-radius: var(--fr); --minw: 330px; }
.f .pct { grid-area: bar; z-index: 2; align-self: center; justify-self: start; margin-left: 24px; font-size: var(--pfs); color: var(--on); }
.f .pct .s { color: var(--on); font-size: .68em; } .f .pct .i { width: auto; }

/* f-badge – barevný štítek s číslem místo ikony */
.f-badge .ico { display: none; }
.f-badge .no { min-width: 62px; height: 56px; padding: 0 12px; display: grid; place-items: center; align-self: center; background: var(--c); color: var(--on); border-radius: 12px; font-size: 34px; }
/* f-round – zaoblený pruh */
.f-round .row { --fr: 999px; --bh: 76px; --pfs: 52px; }
.f-round .pct { margin-left: 30px; }
/* f-celkem – zachovaný řádek „Celkem … hlasů“ pod názvem */
.f-celkem .row { --nfs: 48px; --vfs: 34px; --bh: 56px; --pfs: 40px; height: 160px; row-gap: 4px;
  grid-template-columns: auto auto 1fr; grid-template-rows: 56px 40px auto; grid-template-areas: "ico no name" "ico no votes" "bar bar bar"; }
.f-celkem .votes { justify-self: start; } .f-celkem .cl { display: inline; }
.f-celkem .ico { grid-row: 1 / 3; }
.f-celkem .rows { gap: 14px; }
/* f-zebra – pruhování řádků */
.f-zebra .row:nth-child(odd)::before { content: ""; position: absolute; left: -48px; right: -48px; top: -8px; bottom: -6px; background: rgba(0,0,0,.05); z-index: -1; }
.f-zebra .row { --bh: 64px; --pfs: 56px; }
/* f-end – procento za koncem pruhu */
.f-end .pct { margin-left: calc(var(--w) + 22px); color: var(--ink); }
.f-end .pct .s { color: var(--mute); }
.f-end .row:first-child .pct { margin-left: 0; margin-right: 24px; justify-self: end; color: var(--on); }
.f-end .row:first-child .pct .s { color: var(--on); }
.f-end .bar i { --minw: 64px; }
/* f-hair – tenké linky mezi řádky, bez ikon */
.f-hair .row:not(:last-child)::after { content: ""; position: absolute; left: 0; right: 0; bottom: -11px; height: 2px; background: var(--line); }
.f-hair .row { --nfs: 50px; --bh: 88px; --pfs: 60px; height: 158px; }
.f-noico .ico { display: none; } .f-noico .no { color: var(--mute); }
/* f-outline – pruh s obrysem */
.f-outline .bar { box-shadow: inset 0 0 0 3px var(--ink); } .f-outline .bar i { box-shadow: inset 0 0 0 3px var(--ink); }
/* f-tv – maximální čitelnost */
.f-tv .row { --nfs: 52px; --vfs: 44px; --bh: 96px; --pfs: 64px; height: 170px; grid-template-rows: 66px auto; }
.f-tv .rows { gap: 6px; }
/* f-cno – číslo v barvě strany */
.f-cno .no { color: var(--c); }