/* ===== Série P: tmavý štítek s procentem + bílé plochy (podle ukázky) =====
   Bílá plocha pod nadpisem, ukazateli i každým řádkem; vlevo tmavý štítek s procentem, za ním pruh (měřítko 0–25 %). */
.p { --mute: #2B2B2B; --vot: #1A1919; }
/* hlavička = jako v ukázce od webařů: bílá plocha pod nadpisem a bílá plocha pod ukazateli (stejné HTML jako všude) */
.p header { border: 0; height: 190px; }
.p h1 { left: 0; top: 14px; background: rgba(255,255,255,.94); padding: 12px 64px 14px 32px; font-size: 72px; line-height: 1.15; box-shadow: 0 8px 24px rgba(20,30,50,.1); }
.p .stats { right: 0; top: 14px; background: rgba(255,255,255,.94); padding: 16px 40px 14px 28px; gap: 44px; box-shadow: 0 8px 24px rgba(20,30,50,.1); }
.p .gauge { width: 118px; height: 64px; } .p .stat { gap: 16px; } .p .stat .v { font-size: 54px; } .p .stat .v small { font-size: 36px; } .p .stat .l { font-size: 30px; }
.p .rows { top: 214px; gap: 12px; }
.p .row:nth-child(1) { --dc: #D2691E; } .p .row:nth-child(2) { --dc: #6B7680; } .p .row:nth-child(3) { --dc: #6A4BC0; } .p .row:nth-child(4) { --dc: #1E88C2; } .p .row:nth-child(5) { --dc: #6B7680; }
.p .row { height: 152px; background: rgba(255,255,255,.93); box-shadow: 0 8px 24px rgba(20,30,50,.1); padding: 6px 26px 14px; column-gap: 0; align-content: stretch;
  grid-template-columns: 270px 1fr auto; grid-template-rows: 68px 1fr; grid-template-areas: "name name votes" "pct bar bar"; }
.p .no { display: none; }
.p .name { grid-area: name; font-size: 64px; font-weight: 600; align-self: center; }
.p .votes { grid-area: votes; font-size: 46px; align-self: center; color: #3B4656; } .p .votes b { font-weight: 400; color: #3B4656; }
.p .pct { grid-area: pct; background: #243746; color: #fff; font-size: 62px; justify-content: center; align-items: center; height: 100%; }
.p .pct .i { width: auto; } .p .pct .s { color: #fff; font-size: .68em; }
.p .bar { grid-area: bar; height: 100%; background: #E1E5EA; border-radius: 0; }
.p .bar i { width: calc(var(--sh) / 25 * 100%); background: var(--dc); border-radius: 0; }

/* P02 – větší písmo a pruh */
.p2 .row { height: 156px; grid-template-columns: 300px 1fr auto; grid-template-rows: 66px 1fr; } .p2 .name { font-size: 68px; } .p2 .votes { font-size: 50px; } .p2 .pct { font-size: 68px; }
/* P03 – štítek ve ztmavené barvě strany */
.p3 .pct { background: color-mix(in srgb, var(--dc) 62%, #000); }
/* P04 – štítek s obrysem */
.p4 .pct { background: #fff; color: #000; border: 4px solid #000; } .p4 .pct .s { color: #000; } .p4 .bar { border: 4px solid #000; border-left: 0; }
/* P05 – štítek na pravém konci */
.p5 .row { grid-template-areas: "name name votes" "bar bar pct"; grid-template-columns: 1fr auto 300px; } .p5 .row .bar { margin-right: 0; }
/* P06 – hlasy uvnitř stopy vpravo */
.p6 .row { grid-template-areas: "name name name" "pct bar bar"; }
.p6 .votes { grid-area: bar; z-index: 2; justify-self: end; align-self: center; margin-right: 24px; color: #000; } .p6 .votes b { color: #000; font-weight: 700; }
/* P07 – bez ploch pod řádky, jen štítek + pruh */
.p7 .row { background: transparent; box-shadow: none; padding: 6px 0 14px; } .p7 .row .name, .p7 .row .votes { background: rgba(255,255,255,.9); padding: 0 16px; align-self: start; }
.p7 .name { justify-self: start; } .p7 .votes { justify-self: end; }
/* P08 – hranaté plochy s černým rámem */
.p8 .row { background: #fff; border: 4px solid #000; box-shadow: none; } .p8 .pct { background: #000; } .p8 h1, .p8 .stats { border: 4px solid #000; box-shadow: none; background: #fff; }
/* P09 – štítek přes celou výšku řádku, velké písmo */
.p9 .row { height: 158px; padding: 0 0 0 0; grid-template-columns: 320px 1fr auto; grid-template-rows: 70px 1fr; }
.p9 .name { padding-left: 340px; grid-column: 1 / 3; grid-row: 1; margin-bottom: -4px; font-size: 66px; } .p9 .votes { padding-right: 26px; font-size: 50px; }
.p9 .pct { grid-row: 1 / 3; grid-column: 1; font-size: 82px; } .p9 .bar { grid-row: 2; grid-column: 2 / 4; margin-right: 26px; margin-bottom: 14px; height: 64px; align-self: end; }
/* P10 – vítěz větší */
.p10 .row:first-child { height: 200px; grid-template-rows: 88px 1fr; } .p10 .row:first-child .name { font-size: 84px; } .p10 .row:first-child .votes { font-size: 56px; } .p10 .row:first-child .pct { font-size: 84px; }
.p10 .row:not(:first-child) { height: 140px; grid-template-rows: 60px 1fr; } .p10 .row:not(:first-child) .name { font-size: 58px; } .p10 .row:not(:first-child) .pct { font-size: 56px; } .p10 .rows { gap: 10px; }