/* ===== Série V: kombinace toho, co zůstalo =====
   pevné kotvy (číslo strany v bloku/kruhu/čtverci, sloupcové zarovnání), tmavý štítek s procentem,
   celá scéna na bílé desce nebo jemné plochy pod řádky. Hlavička a pozadí beze změny. */
.v .no { display: none; }
/* společná bílá deska pod hlavičkou i řádky (jako T09) */
.vb::before { content: ""; position: absolute; left: 24px; right: 24px; top: 20px; bottom: 24px; background: rgba(255,255,255,.96); border-radius: 30px; box-shadow: 0 18px 50px rgba(20,30,50,.24), 0 3px 10px rgba(20,30,50,.12); }
.vb { --gt: #DAD6D2; }
.vb header, .vb .rows { z-index: 1; }
.vb header { left: 64px; right: 64px; top: 20px; }
.vb .rows { left: 64px; right: 64px; top: 190px; bottom: 44px; gap: 0; }
.vb .row { flex: 1; min-height: 0; border-bottom: 2px solid #E6E8EC; }
.vb .row:last-child { border-bottom: 0; }

/* V01 – tabule + tabulka s pořadím a záhlavím */
.v1 .thead { display: grid; position: absolute; left: 64px; right: 64px; top: 182px; height: 38px; z-index: 1; grid-template-columns: 96px 1fr 300px 330px 400px; column-gap: 20px; font-size: 24px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #4A4643; align-items: center; padding: 0 10px; }
.v1 .thead span:nth-child(3), .v1 .thead span:nth-child(4) { text-align: right; }
.v1 .rows { top: 224px; }
.v1 .row { grid-template-columns: 96px 1fr 300px 330px 400px; column-gap: 20px; padding: 0 10px; grid-template-areas: "rank name votes pct bar"; }
.v1 .rank { display: grid; grid-area: rank; place-items: center; width: 78px; height: 78px; border-radius: 50%; background: var(--c); color: var(--on); font-size: 44px; font-weight: 700; }
.v1 .name { grid-area: name; font-size: 56px; } .v1 .votes { grid-area: votes; font-size: 44px; justify-self: end; } .v1 .pct { grid-area: pct; font-size: 86px; justify-self: end; } .v1 .bar { grid-area: bar; height: 28px; }

/* V02 – jemné plochy, blok s číslem, tmavý štítek s procentem na konci pruhu */
.v2 .rows { top: 178px; gap: 12px; }
.v2 .row { height: 156px; background: rgba(255,255,255,.9); border-radius: 16px; box-shadow: 0 8px 22px rgba(20,30,50,.12); overflow: hidden; padding-right: 22px; grid-template-columns: 150px 1fr 270px; grid-template-rows: 1fr 66px; grid-template-areas: "no name votes" "no bar pct"; column-gap: 0; align-content: stretch; padding-bottom: 14px; }
.v2 .no { display: grid; grid-area: no; grid-row: 1 / 3; height: 100%; place-items: center; background: var(--c); color: var(--on); font-size: 72px; font-weight: 700; margin-bottom: -14px; }
.v2 .name { grid-area: name; font-size: 58px; margin-left: 28px; align-self: end; } .v2 .votes { grid-area: votes; font-size: 42px; justify-self: end; align-self: end; margin-bottom: 4px; }
.v2 .bar { grid-area: bar; height: 100%; border-radius: 0; margin-left: 28px; background: #E4E7EB; } .v2 .bar i { border-radius: 0; }
.v2 .pct { grid-area: pct; background: #243746; color: #fff; height: 100%; justify-content: center; align-items: center; font-size: 60px; } .v2 .pct .s { color: #fff; }

/* V03 – tabule, čtverec s číslem, tenký pruh a obří procento */
.v3 .row { grid-template-columns: 108px 1fr auto 420px; grid-template-rows: 1fr 1fr; grid-template-areas: "sq name votes pct" "sq bar bar pct"; column-gap: 30px; }
.v3 .no { display: grid; grid-area: sq; width: 96px; height: 96px; border-radius: 22px; place-items: center; background: var(--c); color: var(--on); font-size: 52px; font-weight: 700; align-self: center; }
.v3 .name { grid-area: name; font-size: 58px; align-self: end; } .v3 .votes { grid-area: votes; font-size: 42px; align-self: end; margin-bottom: 4px; }
.v3 .bar { grid-area: bar; height: 20px; align-self: start; margin-top: 16px; } .v3 .pct { grid-area: pct; font-size: 108px; justify-self: end; }

/* V04 – tabule, kruh s číslem, tmavý štítek vpravo */
.v4 .row { grid-template-columns: 170px 1fr auto 300px; grid-template-areas: "ring name votes pct"; column-gap: 24px; }
.v4 .bar { grid-area: ring; width: 128px; height: 128px; border-radius: 50%; justify-self: center; position: relative; background: conic-gradient(var(--c) var(--w), #E1E5EA 0); overflow: visible; } .v4 .bar i { display: none; }
.v4 .bar::after { content: ""; position: absolute; inset: 16px; border-radius: 50%; background: #fff; }
.v4 .no { display: block; grid-area: ring; z-index: 2; justify-self: center; align-self: center; font-size: 46px; font-weight: 700; color: #1A1919; }
.v4 .name { grid-area: name; font-size: 60px; } .v4 .votes { grid-area: votes; font-size: 44px; }
.v4 .pct { grid-area: pct; background: #243746; color: #fff; height: 96px; border-radius: 14px; justify-content: center; align-items: center; font-size: 68px; align-self: center; } .v4 .pct .s { color: #fff; }

/* V05 – jemné plochy, čtvercová značka, tmavé procento za pruhem */
.v5 .rows { top: 178px; gap: 12px; }
.v5 .row { height: 158px; background: rgba(255,255,255,.88); border-radius: 14px; box-shadow: 0 8px 22px rgba(20,30,50,.1); padding: 8px 24px 12px; grid-template-columns: 76px 1fr auto; grid-template-rows: 62px 74px; grid-template-areas: "sq name votes" "bar bar bar"; column-gap: 16px; }
.v5 .no { display: grid; grid-area: sq; width: 62px; height: 62px; border-radius: 12px; place-items: center; background: var(--c); color: var(--on); font-size: 34px; font-weight: 700; align-self: center; }
.v5 .name { grid-area: name; font-size: 58px; } .v5 .votes { grid-area: votes; font-size: 42px; }
.v5 .bar { grid-area: bar; height: 70px; border-radius: 0; background: #E4E7EB; } .v5 .bar i { border-radius: 0; --minw: 30px; }
.v5 .pct { grid-area: bar; z-index: 2; justify-self: start; align-self: center; margin-left: calc(var(--w) + 22px); font-size: 78px; }
.v5 .row:first-child .pct { margin-left: 0; margin-right: 24px; justify-self: end; color: var(--on); } .v5 .row:first-child .pct .s { color: var(--on); }