/* KOMPONENT tabulka-prac — .ph-work, .ph-cell (krok 4 knižnice, 30. 10. 2026).
   Vybraté z: style-a5de0145ecc1.css, userStyles-b7accc8e732d.css. Hodnoty z tokeny.css.
   Vytvoril tools/komponent_vyber.py — pravidlá v pôvodnom poradí.
   1. 11. 2026, krok 9: bez výnimiek „important“ (20×), bez html body / html:root body (html.f-js body → .f-js) a bez väzby
   na stránku (#praca → .ph-work) — výsledok rovnaký (overené vypočítanými štýlmi aj v stave „tabuľka v zábere“):
   súperili pravidlá komponentu navzájom (vyhráva to isté pravidlo vyššou špecificitou alebo poradím); zvonka len
   f-atom.css (bunka „pripravujeme“ — tu vyššia špecificita) a :has(+ .f-figcap.is-below) z f-figcap.css (legenda — tiež). */

/* --- z style-a5de0145ecc1.css --- */
.ph-work__head { display: grid; align-items: end; border-bottom: 1px solid var(--c-fg); padding-bottom: 14px; grid-template-columns: 72px minmax(0px, 1fr) minmax(0px, 360px) repeat(5, 104px); }
@media (max-width: 860px) { .ph-work__head { display: none; } }
.ph-work__row { display: grid; min-height: 88px; align-items: center; border-bottom: 1px solid var(--c-line); grid-template-columns: 72px minmax(0px, 1fr) minmax(0px, 360px) repeat(5, 104px); }
@media (max-width: 860px) { .ph-work__row { row-gap: 10px; padding: 20px 0px; grid-template-columns: 32px minmax(0px, 1fr); } }
.ph-work__head > span:nth-child(n+4) { text-align: center; line-height: var(--lh-uvod); }
.ph-work__row:last-child { border-bottom-color: var(--c-fg); }
.ph-work__name { font-size: clamp(26px, 2.5vw, 36px); font-weight: 500; }
.ph-work__type { color: var(--c-body); font-size: 15px; }
@media (max-width: 860px) { .ph-work__type { grid-column-end: auto; grid-column-start: 2; } }
.ph-work__cells { display: contents; }
@media (max-width: 860px) { .ph-work__cells { row-gap: 8px; display: flex; flex-wrap: wrap; column-gap: 14px; grid-row-end: auto; padding-top: 4px; grid-row-start: auto; grid-column-end: auto; grid-column-start: 2; } }
.ph-cell { width: 12px; height: 12px; box-shadow: inset 0 0 0 1px var(--f-line-l2); justify-self: center; }
.ph-cell.is-on { box-shadow: none; background: var(--c-fg); }
.ph-work__legend { row-gap: 10px; display: flex; flex-wrap: wrap; column-gap: 28px; padding-top: 16px; }
.ph-work__legend > span { display: flex; column-gap: 10px; align-items: center; }
.ph-work__legend .ph-cell { justify-self: auto; }
.f-js .ph-work .ph-work__row .ph-cell { transform: scale(0) rotate(-90deg); transition: transform var(--t-nabeh) var(--f-ease); transition-delay: var(--d, 0ms); }
.f-js .ph-work.is-in .ph-work__row .ph-cell { transform: none; }
.f-js .ph-work .ph-work__row { opacity: 0; transition: opacity var(--t-nabeh) var(--f-ease); transition-delay: var(--rd, 0ms); }
.f-js .ph-work.is-in .ph-work__row { opacity: 1; }
@media (max-width: 860px) { .ph-work__cells .ph-cell { color: var(--c-mute); width: auto; height: auto; display: inline-flex; box-shadow: none; column-gap: 7px; align-items: center; font-family: var(--font-f-font-mono); font-weight: 500; justify-self: auto; letter-spacing: var(--tr-popis); text-transform: uppercase; background-clip: initial; background-size: initial; background-color: initial; background-image: none; background-origin: initial; background-repeat: initial; background-position-x: initial; background-position-y: initial; background-attachment: initial; } }
@media (max-width: 860px) { .ph-work__cells .ph-cell::before { width: 10px; height: 10px; content: ""; box-shadow: inset 0 0 0 1px var(--f-line-l2); flex-shrink: 0; } }
@media (max-width: 860px) { .ph-work__cells .ph-cell.is-on { color: var(--c-fg); } }
@media (max-width: 860px) { .ph-work__cells .ph-cell.is-on::before { box-shadow: none; background: var(--c-fg); } }
@media (max-width: 860px) { .ph-work__cells .ph-cell:nth-child(1)::after { content: "Stratégia"; } }
@media (max-width: 860px) { .ph-work__cells .ph-cell:nth-child(2)::after { content: "Identita"; } }
@media (max-width: 860px) { .ph-work__cells .ph-cell:nth-child(3)::after { content: "Verbálny branding"; } }
@media (max-width: 860px) { .ph-work__cells .ph-cell:nth-child(4)::after { content: "Web"; } }
@media (max-width: 860px) { .ph-work__cells .ph-cell:nth-child(5)::after { content: "Dlhodobo"; } }

/* --- z userStyles-b7accc8e732d.css --- */
.ph-work { margin-top: 0; }
.ph-work__name { letter-spacing: var(--tr-velky); }
.ph-cell { border-radius: var(--f-atom-r); -webkit-mask: url(../../../uploads/atom.svg) no-repeat center / 100% 100%; mask: url(../../../uploads/atom.svg) no-repeat center / 100% 100%; }
@media (max-width: 860px) { .ph-work__cells .ph-cell { border-radius: 0; -webkit-mask: none; mask: none; } }
@media (max-width: 860px) { .ph-work__cells .ph-cell::before { border-radius: var(--f-atom-r); -webkit-mask: url(../../../uploads/atom.svg) no-repeat center / 100% 100%; mask: url(../../../uploads/atom.svg) no-repeat center / 100% 100%; } }
@media (max-width: 860px) { .ph-work .ph-work__row .ph-work__cells .ph-cell.is-plan { background: none; box-shadow: none; } }
@media (max-width: 860px) { .ph-work .ph-work__row .ph-work__cells .ph-cell.is-plan::before { background: var(--f-max-grad); box-shadow: none; } }
@media (max-width: 860px) { .ph-work .ph-work__row .ph-work__cells .ph-cell.is-plan { color: var(--c-fg); } }
@media (max-width: 860px) { .f-js .ph-work .ph-work__row .ph-cell { transform: none; opacity: 0; transition: opacity var(--t-zmena) var(--f-ease) var(--d, 0ms); } }
@media (max-width: 860px) { .f-js .ph-work.is-in .ph-work__row .ph-cell { opacity: 1; } }
@media (min-width: 861px) and (max-width: 1280px) { .ph-work__head, .ph-work__row { grid-template-columns: 48px minmax(0, 1fr) repeat(5, 76px); } }
@media (min-width: 861px) and (max-width: 1280px) { .ph-work__head > span:nth-child(3) { display: none; } }
@media (min-width: 861px) and (max-width: 1280px) { .ph-work__row { row-gap: 4px; padding: 18px 0; } }
@media (min-width: 861px) and (max-width: 1280px) { .ph-work__row > .f-mono { grid-column: 1; grid-row: 1 / span 2; align-self: start; padding-top: 10px; } }
@media (min-width: 861px) and (max-width: 1280px) { .ph-work__row > .ph-work__name { grid-column: 2; grid-row: 1; } }
@media (min-width: 861px) and (max-width: 1280px) { .ph-work__row > .ph-work__type { grid-column: 2; grid-row: 2; } }
@media (min-width: 861px) and (max-width: 1280px) { .ph-work__row .ph-cell { grid-row: 1 / span 2; } }
@media (min-width: 1281px) { .ph-work__head, .ph-work__row { grid-template-columns: 72px minmax(220px, 1fr) minmax(0, 360px) repeat(5, 104px); } }
.ph-sec .ph-work:has(+ .ph-work__legend) { margin-top: var(--f-sp-obsah); }
.ph-work { border-top: 1px solid var(--c-line); }
.ph-work__head { padding-top: 16px; }
.ph-work:has(+ .ph-work__legend) { margin-top: 96px; }
.ph-work__legend:has(+ .f-figcap.is-below) { margin-top: 0; justify-content: flex-end; padding-top: 16px; }
.ph-work__legend + .f-figcap.is-below { margin-top: 24px; }
@media (max-width: 900px) { .ph-work:not(.is-vis) + .ph-work__legend:has(+ .f-figcap.is-below) { position: relative; bottom: auto; } }
@media (max-width: 900px) { .ph-work__legend:has(+ .f-figcap.is-below) { position: sticky; bottom: 12px; z-index: 5; justify-content: flex-start; margin-top: 16px; padding: 14px 16px; background: var(--f-neutral); column-gap: 20px; } }
.ph-work__cells .ph-cell.is-plan::before { background: var(--f-max-grad); }
.ph-work .ph-work__name { font-size: var(--ts-velky); letter-spacing: var(--tr-velky); }
@media (max-width: 860px) { .ph-work__cells .ph-cell { font-size: var(--ts-popis); } }