/* Stránka Všetko (/vsetko/, /vsetko/en/, /vsetko/de/). Generuje ops/design/postav-vsetko.mjs.
   Vizuálny jazyk rámu (paper.css A-093): noc #0a0908, meď #f2643c, ARLing Sans, tenké linky.
   Zoznam ako register, nie mriežka kariet: skupina vľavo, riadky vpravo, oddelené linkou.
   Filter funguje aj bez JavaScriptu (prepínače a :has), vsetko.js dopĺňa hľadanie a počty. */
.vsetko{--v-ink:#fafafa;--v-telo:#a8a4a0;--v-tichy:#8d8884;--v-linka:rgba(255,255,255,.10);--v-linka-2:rgba(255,255,255,.16);--v-med:#f2643c;--v-zhaslo:#ffb59d;--v-tik:cubic-bezier(.2,.7,.2,1);--v-pero:cubic-bezier(.16,1,.3,1)}
.vsetko [hidden]{display:none !important}
.vsetko .vs-skryte{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0;padding:0;border:0}

/* Úvod stránky */
.vsetko .vs-uvod{padding-top:clamp(40px,6vw,88px);padding-bottom:clamp(24px,3vw,36px)}
.vsetko .vs-uvod .kicker{margin:0 0 14px;font:600 12.5px/1.4 var(--ui);letter-spacing:.14em;text-transform:uppercase}
.vsetko .vs-uvod h1{margin:0;font-size:clamp(40px,6vw,76px)}
.vsetko .vs-uvod .lead{max-width:44ch;margin:26px 0 0}
.vsetko .vs-nove-veta{margin:12px 0 0;font:400 14px/1.5 var(--ui);color:var(--v-tichy)}

/* Ovládanie: hľadanie a skupiny, prilepené pod hlavičkou */
.vsetko .vs-ovladanie{position:sticky;top:var(--hlavicka,70px);z-index:20;background:rgba(10,9,8,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--v-linka);border-bottom:1px solid var(--v-linka)}
.vsetko .vs-ovladanie>.wrap{display:grid;grid-template-columns:minmax(240px,340px) minmax(0,1fr);align-items:center;gap:12px 22px;padding-top:14px;padding-bottom:14px}
.vsetko .vs-hladaj{position:relative;grid-column:1;grid-row:1}
.vsetko .vs-hladaj svg{position:absolute;left:15px;top:50%;width:18px;height:18px;transform:translateY(-50%);color:var(--v-tichy);pointer-events:none}
.vsetko .vs-hladaj input{box-sizing:border-box;width:100%;height:44px;margin:0;padding:0 16px 0 42px;border:1px solid var(--v-linka-2);border-radius:999px;background:rgba(255,255,255,.04);color:var(--v-ink);font:400 15px/1 var(--ui);letter-spacing:-.004em;outline:none;transition:border-color .2s var(--v-tik),background-color .2s var(--v-tik)}
.vsetko .vs-hladaj input::placeholder{color:var(--v-tichy);opacity:1}
.vsetko .vs-hladaj input:hover{border-color:rgba(255,255,255,.26)}
.vsetko .vs-hladaj input:focus-visible{border-color:rgba(255,255,255,.44);background:rgba(255,255,255,.06);box-shadow:0 0 0 3px rgba(242,100,60,.28)}
.vsetko .vs-filter{grid-column:1 / -1;grid-row:2;display:flex;flex-wrap:wrap;gap:8px;min-width:0;margin:0;padding:0;border:0}
.vsetko .vs-filter input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.vsetko .vs-filter label{display:inline-flex;align-items:center;gap:7px;flex:none;min-height:40px;margin:0;padding:0 13px;border:1px solid var(--v-linka-2);border-radius:999px;background:transparent;color:var(--v-telo);font:500 14px/1 var(--ui);letter-spacing:-.004em;white-space:nowrap;cursor:pointer;user-select:none;-webkit-user-select:none;transition:border-color .2s var(--v-tik),color .2s var(--v-tik),background-color .2s var(--v-tik)}
.vsetko .vs-filter label span{color:var(--v-tichy);font-weight:500;font-variant-numeric:tabular-nums}
.vsetko .vs-filter label:hover{border-color:rgba(255,255,255,.3);color:var(--v-ink)}
.vsetko .vs-filter input:checked+label{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.09);color:var(--v-ink)}
.vsetko .vs-filter input:checked+label span{color:var(--v-telo)}
.vsetko .vs-filter input:focus-visible+label{outline:2px solid var(--v-med);outline-offset:2px}
.vsetko .vs-filter #vs-f-nove+label{color:var(--v-zhaslo)}
.vsetko .vs-filter #vs-f-nove:checked+label{border-color:rgba(242,100,60,.6);background:rgba(242,100,60,.14)}
.vsetko .vs-stav{grid-column:2;grid-row:1;justify-self:end;margin:0;font:400 13px/1.4 var(--ui);color:var(--v-tichy)}

/* Skupiny: nadpis a veta vľavo, register vpravo */
.vsetko .vs-telo{padding-bottom:clamp(56px,8vw,112px)}
body.noc .vsetko section.vs-sek{display:grid;grid-template-columns:minmax(200px,300px) minmax(0,1fr);gap:18px clamp(28px,4vw,64px);padding:clamp(32px,4vw,48px) 0;border-top:1px solid var(--v-linka);scroll-margin-top:calc(var(--hlavicka,70px) + 132px)}
body.noc .vsetko section.vs-sek:first-child{border-top:0}
.vsetko .vs-hlava{display:grid;grid-template-columns:minmax(0,1fr) auto;align-content:start;column-gap:12px}
body.noc .vsetko .vs-hlava h2{grid-column:1;margin:0;font:700 22px/1.25 var(--display);letter-spacing:-.02em;color:var(--v-ink)}
.vsetko .vs-hlava .vs-pocet{grid-column:2;grid-row:1;align-self:center;margin:0;padding:2px 9px;border:1px solid var(--v-linka-2);border-radius:999px;font:500 12.5px/1.4 var(--ui);color:var(--v-tichy);font-variant-numeric:tabular-nums}
body.noc .vsetko .vs-hlava p:last-child{grid-column:1 / -1;max-width:36ch;margin:10px 0 0;font:400 14.5px/1.55 var(--ui);color:var(--v-telo)}
.vsetko .vs-zoznam{margin:0;padding:0;list-style:none;border-top:1px solid var(--v-linka)}
.vsetko .vs-pol{display:block;max-width:none;margin:0;padding:0;border:0}
.vsetko .vs-pol::before,.vsetko .vs-pol::after{content:none}
.vsetko .vs-pol a{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr) auto 18px;align-items:baseline;gap:4px 22px;padding:15px 10px;border-bottom:1px solid var(--v-linka);color:var(--v-telo);text-decoration:none;transition:background-color .16s var(--v-tik)}
.vsetko .vs-pol a:hover{background:rgba(255,255,255,.035)}
.vsetko .vs-pol a:active{background:rgba(255,255,255,.07);transition-duration:.1s}
.vsetko .vs-pol a:focus-visible{outline:2px solid var(--v-med);outline-offset:-2px;border-radius:6px}
.vsetko .vs-nazov{min-width:0}
.vsetko .vs-nazov b{font:600 16px/1.35 var(--ui);letter-spacing:-.012em;color:var(--v-ink)}
.vsetko .vs-nove{display:inline-block;vertical-align:1px;margin-left:9px;padding:0;border-radius:0;background:none;font:600 11px/1.4 var(--ui);font-style:normal;letter-spacing:.02em;color:var(--v-zhaslo)}
.vsetko .vs-popis{min-width:0;font:400 15px/1.45 var(--ui);color:var(--v-telo)}
.vsetko .vs-jaz{font:600 11px/1.4 var(--ui);letter-spacing:.08em;color:var(--v-tichy);white-space:nowrap}
.vsetko .vs-pol a>svg{align-self:center;width:18px;height:18px;color:var(--v-tichy);transition:transform .22s var(--v-pero),color .16s var(--v-tik)}
.vsetko .vs-pol a:hover>svg{transform:translateX(3px);color:var(--v-ink)}
/* Vývojári: krátke názvy, dva stĺpce riadkov */
.vsetko .vs-zoznam-dev{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;border-top:0}
.vsetko .vs-zoznam-dev .vs-pol a{grid-template-columns:minmax(0,1fr) auto 18px}
.vsetko .vs-zoznam-dev .vs-pol:nth-child(-n+2) a{border-top:1px solid var(--v-linka)}

.vsetko .vs-prazdne{margin:0;padding:48px 0 8px;font:400 16px/1.6 var(--ui);color:var(--v-telo)}
.vsetko .vs-prazdne b{color:var(--v-ink);font-weight:600}
.vsetko .vs-reset{margin:0;padding:0;border:0;border-bottom:1px solid var(--v-linka-2);background:none;color:var(--v-ink);font:inherit;cursor:pointer}
.vsetko .vs-reset:hover{border-bottom-color:var(--v-ink)}

/* Filter bez JavaScriptu: vybraná skupina, ostatné sa skryjú. vsetko.js robí to isté cez hidden. */
.vsetko:has(#vs-f-firmy:checked) .vs-sek:not([data-skupina="firmy"]),
.vsetko:has(#vs-f-eshopy:checked) .vs-sek:not([data-skupina="eshopy"]),
.vsetko:has(#vs-f-hry:checked) .vs-sek:not([data-skupina="hry"]),
.vsetko:has(#vs-f-knihy:checked) .vs-sek:not([data-skupina="knihy"]),
.vsetko:has(#vs-f-vyvojari:checked) .vs-sek:not([data-skupina="vyvojari"]),
.vsetko:has(#vs-f-nove:checked) .vs-pol:not([data-nova]),
.vsetko:has(#vs-f-nove:checked) .vs-sek:not(:has(.vs-pol[data-nova])){display:none}
.vsetko:has(#vs-f-firmy:checked) .vs-sek,.vsetko:has(#vs-f-eshopy:checked) .vs-sek,.vsetko:has(#vs-f-hry:checked) .vs-sek,.vsetko:has(#vs-f-knihy:checked) .vs-sek,.vsetko:has(#vs-f-vyvojari:checked) .vs-sek{border-top:0}

@media (prefers-reduced-motion:reduce){.vsetko *{transition:none !important}}
@media (prefers-reduced-transparency:reduce){.vsetko .vs-ovladanie{background:#0a0908;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media (hover:none){.vsetko .vs-pol a:hover{background:none}.vsetko .vs-pol a:hover>svg{transform:none}}

@media (max-width:1000px){
  body.noc .vsetko section.vs-sek{grid-template-columns:1fr}
  .vsetko .vs-hlava p:last-child{max-width:60ch}
  .vsetko .vs-ovladanie>.wrap{grid-template-columns:minmax(0,1fr) auto}
}
@media (max-width:760px){
  /* Skupiny v jednom riadku, ktorý sa posúva prstom a končí až na hrane obrazovky. */
  .vsetko .vs-ovladanie>.wrap{gap:10px;padding-top:10px;padding-bottom:10px}
  .vsetko .vs-filter{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;margin-right:-5.5vw;padding-right:5.5vw}
  .vsetko .vs-filter::-webkit-scrollbar{display:none}
  .vsetko .vs-filter label{min-height:44px}
  .vsetko .vs-ovladanie>.wrap{grid-template-columns:1fr}
  /* Počet na telefóne len pre čítačky (aria-live ostáva); zoznam pod lištou ukazuje výsledok sám. */
  .vsetko .vs-stav{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  body.noc .vsetko section.vs-sek{scroll-margin-top:calc(var(--hlavicka,60px) + 170px)}
  .vsetko .vs-pol a{grid-template-columns:minmax(0,1fr) auto 16px;gap:3px 12px;padding:14px 4px}
  .vsetko .vs-nazov{grid-column:1;grid-row:1}
  .vsetko .vs-jaz{grid-column:2;grid-row:1}
  .vsetko .vs-pol a>svg{grid-column:3;grid-row:1;width:16px;height:16px}
  .vsetko .vs-popis{grid-column:1 / -1;grid-row:2;font-size:14.5px}
  .vsetko .vs-zoznam-dev{grid-template-columns:1fr}
  .vsetko .vs-zoznam-dev .vs-pol:nth-child(2) a{border-top:0}
}
