/* ph-pavuk.css — ZLEPENÉ z tools/pavuk/*.py (needitovať ručne, generuje tools/navrh_pavuk.py) */

/* Výsledok ako na webe (.ph-df__res): pod obrázkom, tenká čiara, mono menovka vľavo (5 dielov), veta vpravo (7 dielov) */
html body [class^="pv-"] .vz-wres{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:24px;margin:28px 0 0;padding-top:20px}
html body [class^="pv-"] .vz-wres span:last-child{font-size:clamp(22px,2vw,28px);line-height:var(--lh-veta, 1.2)}
/* ---- p00 Memory · krabička okolo vrstiev ---- */

/* ---- p06 Radiálny pavúk · v izometrii ---- */

html body .pv-06 .ip-e,html body .pv-06 .ip-t{fill:var(--v-plate);stroke:var(--v-plate-s);stroke-width:1;vector-effect:non-scaling-stroke;transition:fill var(--t-zmena, 400ms)}
html body .pv-06 .ip.is-active .ip-t{fill:var(--v-act)}

html body .pv-06 .ip[data-step]{cursor:pointer}

html body .pv-06 svg{display:block;width:100%;height:auto;overflow:visible}
html body .pv-06 .rg{fill:none;stroke:var(--v-line);stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:2 6}
html body .pv-06 .rg1{stroke-dasharray:none;stroke-opacity:.7}
html body .pv-06 .sp{fill:none;stroke:var(--v-line);stroke-width:1;vector-effect:non-scaling-stroke}
html body .pv-06 .sf{fill:none;stroke:transparent;stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-dasharray:3 7}
html body .pv-06 .sf.is-active{stroke:var(--v-fg);animation:pvri-06 var(--t-pomaly, 900ms) linear infinite}
html.f-js body .pv-06:not(.is-vis) .sf.is-active{animation-play-state:paused}   /* 31. 10. 2026: mimo záberu stojí (is-vis: ph-viz.js) */
html body .pv-06 .sf.out.is-active{animation-direction:reverse}
@keyframes pvri-06{to{stroke-dashoffset:-20}}
html body .pv-06 .post{fill:none;stroke:var(--v-line-s);stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:2 4}
html body .pv-06 .shadow{fill:var(--v-fg);opacity:.06}
html body .pv-06 .num{font-family:var(--font-f-font-mono);font-size:10px;letter-spacing:.08em;fill:var(--v-mute)}
html body .pv-06 .rs-k{font-family:var(--font-f-font-mono);font-size:9px;letter-spacing:.14em;fill:var(--v-mute)}
html body .pv-06 .rs-t{font-size:17px;letter-spacing:-.01em;fill:var(--v-fg)}
html body .pv-06 .lk path{fill:var(--v-fg)}
html body .pv-06 .lk-suf{font-family:var(--font-f-font-mono);font-weight:500;letter-spacing:.08em;fill:var(--v-fg)}
html body .pv-06 .ip.is-active .num{fill:var(--v-act-fg)}
html body .pv-06 .cl{font-family:var(--font-f-font-mono);font-size:11px;letter-spacing:.12em;fill:var(--v-fg)}
html body .pv-06 .side{font-family:var(--font-f-font-mono);font-size:10px;letter-spacing:.14em;fill:var(--v-mute)}
html body .pv-06 .ld{fill:none;stroke:var(--v-line);stroke-width:1;vector-effect:non-scaling-stroke}
html body .pv-06 .ld.is-active{stroke:var(--v-line-s)}
html.f-js html body .pv-06:not(.is-in) .rg{opacity:0}
html body .pv-06 .rg{transition:opacity var(--t-pomaly, 900ms)}
html.f-js html body .pv-06:not(.is-in) .ip{opacity:0;transform:translateY(-18px)}
html body .pv-06 .ip{transition:opacity var(--t-nabeh, 600ms),transform var(--t-nabeh, 600ms) var(--f-ease)}
html body .pv-06 .ip.is-active{transform:translateY(-10px)}
@media (max-width:760px){html body .pv-06 .ld{display:none}}
@media (prefers-reduced-motion:reduce){html body .pv-06 .sf.is-active{animation:none;stroke-dasharray:none}html body .pv-06 .ip{transition:none}}

/* ---- p08 Radiálny pavúk · flat (podľa 06) ---- */

html body .pv-08 svg{display:block;width:100%;height:auto;overflow:visible}
html body .pv-08 .sp{fill:none;stroke:var(--v-line);stroke-width:1;vector-effect:non-scaling-stroke}
html body .pv-08 .sf{fill:none;stroke:transparent;stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-dasharray:3 7}
html body .pv-08 .sf.is-active{stroke:var(--v-fg);animation:pv08-f var(--t-pomaly, 900ms) linear infinite}
html body .pv-08 .sf.out.is-active{animation-direction:reverse}
@keyframes pv08-f{to{stroke-dashoffset:-20}}
html body .pv-08 .nd rect{fill:var(--v-plate);stroke:var(--v-plate-s);stroke-width:1;vector-effect:non-scaling-stroke;transition:fill var(--t-zmena, 400ms)}
html body .pv-08 .nd{cursor:pointer}
html body .pv-08 .nd.is-active rect{fill:var(--v-act)}
html body .pv-08 .num{font-family:var(--font-f-font-mono);font-size:9px;letter-spacing:.08em;fill:var(--v-mute);transition:fill var(--t-zmena, 400ms)}
html body .pv-08 .nd.is-active .num{fill:var(--v-act-fg)}
html body .pv-08 .core{fill:var(--v-plate);stroke:var(--v-plate-s);stroke-width:1;vector-effect:non-scaling-stroke}
html body .pv-08 .lk path{fill:var(--v-fg)}
html body .pv-08 .lk-suf{font-family:var(--font-f-font-mono);font-weight:500;letter-spacing:.08em;fill:var(--v-fg)}
html body .pv-08 .side{font-family:var(--font-f-font-mono);font-size:10px;letter-spacing:.14em;fill:var(--v-mute)}
html body .pv-08 .ld{fill:none;stroke:var(--v-line);stroke-width:1;vector-effect:non-scaling-stroke}
html body .pv-08 .ld.is-active{stroke:var(--v-line-s)}
html.f-js body .pv-08:not(.is-in) .nd{opacity:0;transform:translateY(-12px)}
html body .pv-08 .nd{transition:opacity var(--t-nabeh, 600ms),transform var(--t-nabeh, 600ms) var(--f-ease)}
@media (max-width:760px){html body .pv-08 .ld{display:none}}
@media (prefers-reduced-motion:reduce){html body .pv-08 .sf.is-active{animation:none;stroke-dasharray:none}html body .pv-08 .nd{transition:none}}