/* KOMPONENT vyroky — .ph-quotes, .ph-quote (krok 4 knižnice, 30. 10. 2026).
   Vybraté z: userStyles-b7accc8e732d.css. Hodnoty z tokeny.css.
   Vytvoril tools/komponent_vyber.py — pravidlá v pôvodnom poradí. */

/* --- z userStyles-b7accc8e732d.css --- */
.ph-quotes--dark { --c-fg: var(--f-paper); --c-bg: var(--f-ink); --c-on: var(--f-ink); --c-mute: var(--f-mute-dark); --c-body: var(--f-body-dark); --c-line: var(--f-line-d); --c-line-s: var(--f-line-d2); --c-line2: rgba(244,243,239,.35); --c-wash: rgba(244,243,239,.05); }
/* 31. 10. 2026: výroky berú farby z PLOCHY (sekcie) — čitateľné na tmavej, svetlej aj sivej; napevno svetlá téma zrušená */
html body .ph-quotes { --q-ink: var(--c-fg); --q-mute: var(--c-mute); --q-line: var(--c-line); --q-av: var(--c-line); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px var(--f-gap); }
html body .ph-quotes--dark { --q-av: rgba(244,243,239,.1); }
@media (max-width: 1100px) { html body .ph-quotes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) { html body .ph-quotes { grid-template-columns: minmax(0, 1fr); row-gap: 44px; } }
html body .ph-quote { margin: 0; display: grid; grid-template-rows: subgrid; grid-row: span 2; row-gap: 28px; align-content: start; color: var(--q-ink); }
/* 30. 10. 2026 (Martin): MASONRY — výroky v stĺpcoch tesne pod sebou (3 → 2 od 1100 px → 1 na mobile). Meno s fotkou
   a čiara ostávajú POD textom (skúška „meno hore“ vrátená). Len mriežka výrokov; posuvný pás (.ph-rail__track) ostáva. */
html body .ph-quotes:not(.ph-rail__track) { display: block; columns: 3; column-gap: var(--f-gap); }
@media (max-width: 1100px) { html body .ph-quotes:not(.ph-rail__track) { columns: 2; } }
@media (max-width: 860px) { html body .ph-quotes:not(.ph-rail__track) { columns: 1; } }
html body .ph-quotes:not(.ph-rail__track) > .ph-quote { display: flex; flex-direction: column; row-gap: 28px; break-inside: avoid; margin: 0 0 56px; }
@media (max-width: 860px) { html body .ph-quotes:not(.ph-rail__track) > .ph-quote { margin-bottom: 44px; } }
html body .ph-quotes .ph-quote__t { margin: 0; padding: 0; border: 0; font-style: normal; color: var(--q-ink); text-wrap: pretty; }
html body .ph-quotes .ph-quote__t::after { content: none; }
html body .ph-quotes .ph-quote__t { font-family: "freight-text-pro", Georgia, serif; font-weight: 400; font-variant-numeric: lining-nums; }
html body .ph-quotes .ph-quote__t { line-height: var(--lh-veta); letter-spacing: -.005em; }
html body .ph-quote__who { display: flex; align-items: center; column-gap: 14px; padding-top: 18px; border-top: 1px solid var(--q-line); }
html body .ph-quote__av { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--f-atom-r); background: var(--q-av); font-size: 12px; letter-spacing: var(--tr-popis); color: var(--q-ink); }
html body .ph-quote__av.has-photo { overflow: hidden; background: none; }
html body .ph-quote__av.has-photo img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
html body .ph-quote__id { display: flex; flex-direction: column; row-gap: 4px; min-width: 0; }
html body .ph-quote__name { font-size: var(--ts-text); font-weight: 500; line-height: var(--lh-veta); color: var(--q-ink); }
html body .ph-quote__role { font-size: 10.5px; text-transform: uppercase; color: var(--q-mute); }
html:root body .ph-quotes .ph-quote__t { font-size: var(--ts-text-l); line-height: var(--lh-text); letter-spacing: 0; }
html:root body .ph-quote .ph-quote__name { font-size: var(--ts-text); letter-spacing: var(--tr-text); }
html:root body .ph-quote .ph-quote__role, html:root body .ph-quote .ph-quote__av { font-size: var(--ts-popis); }