/* ============ TOKENY ============ */
:root{
  --papier:#F4F3ED;
  --papier-tmavsi:#ECEAE1;
  --ink:#191A1C;
  --ink-slaby:#5A5B56;
  --ciara:#D9D7CC;
  --crt:#101613;
  --crt-okraj:#22302A;
  --fosfor:#45D07E;        /* na tmavom */
  --fosfor-tmavy:#0E7A44;  /* na papieri */
  --magenta:#C2216B;
  --b1:#C2216B; --b2:#1D6FB8; --b3:#0E7A44; --b4:#D9822B; --b5:#6B4FA3; --b6:#0F8B8B;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Consolas, monospace;
  --sans:'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius:6px;
  --w:min(880px, 92vw);
}
*{box-sizing:border-box}
html{font-size:17px}
html.projektor{font-size:22px}
body{margin:0;background:var(--papier);color:var(--ink);font-family:var(--sans);line-height:1.55;
  background-image:repeating-linear-gradient(0deg, rgba(25,26,28,.025) 0 1px, transparent 1px 28px);}
h1,h2,h3{font-family:var(--mono);letter-spacing:.01em;line-height:1.2}
h2{font-size:1.35rem;margin:2.2rem 0 .8rem;text-transform:uppercase}
h3{font-size:1.02rem;margin:1.4rem 0 .5rem}
p{margin:.55rem 0}
a{color:var(--fosfor-tmavy)}
button{font-family:var(--mono);cursor:pointer}
:focus-visible{outline:3px solid var(--magenta);outline-offset:2px}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ============ HORNÁ LIŠTA ============ */
.lista{position:sticky;top:0;z-index:50;background:var(--crt);color:var(--fosfor);
  border-bottom:2px solid var(--crt-okraj);font-family:var(--mono)}
.lista-in{width:var(--w);margin:0 auto;display:flex;align-items:center;gap:.9rem;padding:.55rem 0;flex-wrap:wrap}
.lista a.logo{color:var(--fosfor);text-decoration:none;font-weight:700;letter-spacing:.06em}
.lista .hud{margin-left:auto;display:flex;align-items:center;gap:.9rem;font-size:.8rem}
.hud .xp{color:#fff}
.hud .xp b{color:var(--fosfor)}
.prep{background:none;border:1px solid var(--crt-okraj);color:var(--fosfor);padding:.25rem .6rem;
  border-radius:4px;font-size:.75rem}
.prep[aria-pressed="true"]{background:var(--fosfor);color:var(--crt);border-color:var(--fosfor)}

/* ============ ROZLOŽENIE ============ */
main{width:var(--w);margin:0 auto;padding:1.2rem 0 5rem}
section[data-view]{display:none}
section[data-view].aktivny{display:block}
.drobky{font-family:var(--mono);font-size:.78rem;color:var(--ink-slaby);margin:.8rem 0 0}
.drobky a{color:var(--ink-slaby)}

/* ============ HERO ============ */
.hero{padding:2.6rem 0 1.6rem}
.hero .eyebrow{font-family:var(--mono);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-slaby)}
.hero h1{font-size:clamp(2rem, 6vw, 3.1rem);margin:.4rem 0 .6rem;text-transform:uppercase}
.kurzor{display:inline-block;width:.55em;height:1em;background:var(--magenta);vertical-align:-.12em;
  animation:blik 1.05s steps(1) infinite}
@keyframes blik{50%{opacity:0}}
.hero .pod{max-width:46rem;font-size:1.05rem}
.hero .meta{font-family:var(--mono);font-size:.8rem;color:var(--ink-slaby);margin-top:.9rem}

/* ============ POLIČKA S KAZETAMI ============ */
.policka{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;margin-top:1.2rem}
.kazeta{position:relative;display:block;text-decoration:none;color:var(--ink);
  background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius);
  box-shadow:3px 3px 0 var(--ciara);overflow:hidden;transition:transform .12s ease, box-shadow .12s ease}
.kazeta:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ciara)}
.kazeta .pas{height:.55rem;background:var(--akc,var(--magenta))}
.kazeta .telo{padding:.8rem .9rem 1rem}
.kazeta .cislo{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;color:var(--ink-slaby)}
.kazeta h3{margin:.2rem 0 .3rem;font-size:1rem;text-transform:uppercase}
.kazeta .popis{font-size:.86rem;color:var(--ink-slaby);margin:0}
.kazeta .diera{position:absolute;top:1.5rem;right:.85rem;width:26px;height:26px;border:2px solid var(--ink);
  border-radius:50%;background:radial-gradient(circle at 50% 50%, var(--papier) 30%, transparent 31%),
  repeating-conic-gradient(var(--ink) 0 12deg, transparent 12deg 60deg)}
.stitok{display:inline-block;font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.12rem .45rem;border-radius:3px;background:var(--akc,var(--magenta));color:#fff;margin-top:.5rem}

/* ============ KARTY / SEKCIE ============ */
.karta{background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius);
  box-shadow:3px 3px 0 var(--ciara);padding:1rem 1.1rem;margin:1rem 0}
.karta.tichá{background:var(--papier-tmavsi);border-color:var(--ciara);box-shadow:none}
.karta h3{margin-top:0}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-slaby)}
.eyebrow.akcent{color:var(--akc,var(--magenta))}
ul.osnova{padding-left:1.1rem;margin:.4rem 0}
ul.osnova li{margin:.35rem 0}
.mena{font-family:var(--mono);font-size:.8rem;color:var(--ink-slaby)}

details.hlbka{border:1px solid var(--ciara);border-radius:var(--radius);background:#fff;margin:.6rem 0}
details.hlbka summary{cursor:pointer;padding:.6rem .8rem;font-family:var(--mono);font-size:.85rem;
  list-style:none;display:flex;gap:.5rem;align-items:center}
details.hlbka summary::before{content:"▸";color:var(--akc,var(--magenta));transition:transform .15s}
details.hlbka[open] summary::before{transform:rotate(90deg)}
details.hlbka .obsah{padding:0 .9rem .9rem;font-size:.94rem}

.dvoj{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:640px){.dvoj{grid-template-columns:1fr}}

table.body{width:100%;border-collapse:collapse;font-size:.92rem;margin:.6rem 0}
table.body th,table.body td{border:1px solid var(--ciara);padding:.45rem .6rem;text-align:left}
table.body th{font-family:var(--mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;background:var(--papier-tmavsi)}
table.body td.num{font-family:var(--mono);text-align:right;white-space:nowrap}

/* ============ CRT WIDGETY ============ */
.crt{background:var(--crt);color:#DCEFE4;border:2px solid var(--crt-okraj);border-radius:8px;
  padding:1rem 1.1rem 1.2rem;margin:1.1rem 0;position:relative;overflow:hidden;font-family:var(--mono)}
.crt::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg, rgba(255,255,255,.035) 0 1px, transparent 1px 3px)}
.crt .titulok{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;margin-bottom:.6rem}
.crt .titulok .led{width:.55rem;height:.55rem;border-radius:50%;background:var(--fosfor);box-shadow:0 0 8px var(--fosfor)}
.crt h3{color:var(--fosfor);margin:0;font-size:.95rem;text-transform:uppercase;letter-spacing:.08em}
.crt .pop{font-size:.8rem;color:#9FB8AA;margin:.1rem 0 .8rem;font-family:var(--sans)}
.crt button.tlac{background:transparent;border:1.5px solid var(--fosfor);color:var(--fosfor);
  padding:.45rem .8rem;border-radius:4px;font-size:.85rem}
.crt button.tlac:hover{background:rgba(69,208,126,.12)}
.crt button.tlac:disabled{opacity:.35;cursor:default}
.crt button.tlac.mag{border-color:#FF7AB8;color:#FF7AB8}
.crt button.tlac.mag:hover{background:rgba(255,122,184,.12)}
.crt .vysl{margin-top:.8rem;font-size:.9rem;color:#fff}
.crt .vysl b{color:var(--fosfor)}
.crt .vys{font-family:var(--sans);font-size:.88rem;color:#C9DCD1}

/* časová os */
.os-kupa,.os-rad{display:flex;flex-wrap:wrap;gap:.5rem;margin:.5rem 0}
.os-karta{border:1.5px solid var(--fosfor);color:var(--fosfor);background:transparent;border-radius:4px;
  padding:.4rem .6rem;font-size:.8rem}
.os-karta:disabled{opacity:.25}
.os-rad .os-karta{border-color:#8FD9AF;color:#DCEFE4;background:rgba(69,208,126,.08);cursor:default}
.os-rad .os-karta .rok{color:var(--fosfor);font-weight:700}
.os-chyba{animation:tras .3s}
@keyframes tras{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}

/* je to hra? */
.jth-karta{border:1.5px dashed #3B4A42;border-radius:6px;padding:.9rem;margin:.4rem 0;min-height:5.2rem}
.jth-karta .co{font-family:var(--sans);font-size:1.02rem;color:#fff}
.jth-volby{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.7rem}
.jth-stat{margin-top:.7rem;font-size:.78rem;color:#9FB8AA}
.bar{display:flex;align-items:center;gap:.5rem;margin:.25rem 0}
.bar .men{width:7.5rem;font-size:.72rem;color:#C9DCD1}
.bar .pruh{flex:1;height:.7rem;background:#1C241F;border-radius:3px;overflow:hidden}
.bar .pruh i{display:block;height:100%;background:var(--fosfor)}
.bar .val{width:2.6rem;text-align:right;font-size:.72rem}

/* triedič znakov */
.tz-item{font-family:var(--sans);font-size:1rem;color:#fff;margin:.2rem 0 .6rem}
.tz-volby{display:flex;gap:.5rem;flex-wrap:wrap}
.tz-fb{margin-top:.6rem;font-family:var(--sans);font-size:.86rem;color:#C9DCD1;border-left:3px solid var(--fosfor);padding-left:.6rem}

/* kukučka */
.kuk-text{font-family:var(--sans);font-size:.98rem;color:#EAF4EE;line-height:1.7}
.kuk-veta{cursor:pointer;border-bottom:1px dotted #567;border-radius:2px;padding:0 .1rem}
.kuk-veta:hover{background:rgba(255,255,255,.07)}
.kuk-veta.oznac{background:rgba(255,122,184,.22);border-bottom:1px solid #FF7AB8}
.kuk-veta.hit{background:rgba(69,208,126,.25);border-bottom:1px solid var(--fosfor)}
.kuk-veta.miss{background:rgba(255,90,90,.22);border-bottom:1px solid #FF5A5A}

/* grind&pay */
.gp-hud{display:flex;gap:1.2rem;flex-wrap:wrap;font-size:.85rem;margin:.4rem 0 .7rem}
.gp-hud b{color:var(--fosfor)}
.gp-vel{font-size:1.5rem;padding:.8rem 1.4rem!important}
.gp-ponuka{border:1.5px solid #FF7AB8;border-radius:6px;padding:.7rem .9rem;margin-top:.8rem;
  display:none;background:rgba(255,122,184,.06)}
.gp-ponuka.zobraz{display:block}
.gp-ponuka .naliehavo{color:#FF7AB8;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}

/* motivácie */
.mot-q{font-family:var(--sans);font-size:1rem;color:#fff;margin:.3rem 0 .6rem}

/* QR modal */
dialog{border:2px solid var(--ink);border-radius:8px;padding:1.2rem;max-width:20rem;text-align:center;font-family:var(--mono)}
dialog::backdrop{background:rgba(16,22,19,.55)}
dialog .qrbox{display:flex;justify-content:center;margin:.8rem 0}
dialog small{color:var(--ink-slaby);font-family:var(--sans)}

/* toast odznakov */
.toast{position:fixed;right:1rem;bottom:1rem;z-index:80;background:var(--crt);color:#fff;
  border:2px solid var(--fosfor);border-radius:8px;padding:.7rem 1rem;font-family:var(--mono);
  font-size:.85rem;box-shadow:0 6px 20px rgba(0,0,0,.35);transform:translateY(120%);transition:transform .25s}
.toast.zobraz{transform:translateY(0)}
.toast b{color:var(--fosfor)}

.pata{border-top:1px solid var(--ciara);margin-top:3rem;padding-top:1rem;font-size:.82rem;color:var(--ink-slaby)}
.dalsi{display:flex;justify-content:space-between;gap:1rem;margin-top:2rem;font-family:var(--mono);font-size:.85rem}
.chip{display:inline-block;font-family:var(--mono);font-size:.72rem;border:1px solid var(--ink);
  border-radius:999px;padding:.15rem .6rem;margin:.15rem .2rem 0 0;background:#fff}
.pozn-proto{border-left:4px solid var(--b4);background:#fff;padding:.6rem .9rem;font-size:.85rem;margin:.8rem 0}

/* ============ PREHRÁVAČ KAPITOLY ============ */
.player-lista{position:sticky;top:52px;z-index:30;display:flex;justify-content:space-between;align-items:center;
  gap:.8rem;background:var(--papier);border-bottom:2px solid var(--ink);padding:.5rem 0;flex-wrap:wrap}
.pl-info{display:flex;flex-direction:column;gap:.1rem}
.pl-info strong{font-family:var(--mono);font-size:.9rem;text-transform:uppercase}
.pl-ovl{display:flex;align-items:center;gap:.4rem}
.pl-poc{font-family:var(--mono);font-size:.8rem;color:var(--ink-slaby);margin-right:.3rem}
.pl-btn{border:1.5px solid var(--ink);background:#fff;color:var(--ink);border-radius:4px;
  padding:.35rem .7rem;font-size:.85rem}
.pl-btn[aria-pressed="true"]{background:var(--ink);color:#fff}
.pl-btn:disabled{opacity:.3}

.slajd{background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius);
  box-shadow:4px 4px 0 var(--ciara);padding:1.3rem 1.4rem 1.5rem;margin:1rem 0;min-height:24rem}
.slajd .sl-eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--akc,var(--b1))}
.slajd h2{margin:.25rem 0 .8rem;font-size:1.5rem;border:0}
.slajd ul{padding-left:1.15rem;margin:.4rem 0}
.slajd li{margin:.4rem 0}
.slajd .velke{font-size:1.25rem;line-height:1.45;max-width:38rem}

.med-riadok{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:.8rem;margin:1rem 0}
.med{border:1.5px dashed var(--ink-slaby);border-radius:6px;padding:.6rem .7rem;background:var(--papier-tmavsi);font-size:.82rem}
.med .typ{display:inline-block;font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;
  padding:.1rem .45rem;border-radius:3px;color:#fff;margin-bottom:.35rem}
.med .typ.video{background:#B3261E}.med .typ.foto{background:#1D6FB8}.med .typ.audio{background:#6B4FA3}
.med .typ.graf{background:#0E7A44}.med .typ.sken{background:#8a6d1d}.med .typ.akcia{background:var(--magenta)}
.med b{display:block;font-family:var(--sans);font-size:.86rem;margin-bottom:.15rem}
.med .zdroj{color:var(--ink-slaby);font-size:.75rem}
.med a{font-size:.75rem}

.drop-chip{display:inline-flex;align-items:center;gap:.45rem;border:2px solid var(--magenta);
  background:#fff;color:var(--magenta);font-family:var(--mono);font-size:.8rem;border-radius:999px;
  padding:.35rem .9rem;margin-top:.9rem;animation:pulz 1.6s ease-in-out infinite}
.drop-chip:disabled{animation:none;border-color:var(--fosfor-tmavy);color:var(--fosfor-tmavy);opacity:.9}
@keyframes pulz{50%{box-shadow:0 0 0 6px rgba(194,33,107,.12)}}

.loadbars{height:2.2rem;border:2px solid var(--ink);border-radius:4px;overflow:hidden;margin:1rem 0;
  background:repeating-linear-gradient(90deg,#C2216B 0 14px,#E8C766 14px 26px,#1D6FB8 26px 44px,#0E7A44 44px 52px)}
.loadbars.bezi{animation:load 0.5s linear infinite}
@keyframes load{to{background-position:52px 0}}

/* bočná lišta poznámok */
.pozn-drawer{position:fixed;top:0;right:0;bottom:0;width:min(360px,92vw);z-index:70;
  background:#fff;border-left:2px solid var(--ink);box-shadow:-8px 0 24px rgba(0,0,0,.18);
  transform:translateX(105%);transition:transform .22s ease;display:flex;flex-direction:column}
.pozn-drawer.otvor{transform:translateX(0)}
.pozn-hlava{display:flex;justify-content:space-between;align-items:center;gap:.6rem;
  padding:.7rem .9rem;border-bottom:1.5px solid var(--ciara);font-family:var(--mono);font-size:.85rem}
.pozn-zoznam{overflow-y:auto;padding:.6rem .9rem 2rem;flex:1}
.pozn-item{border:1px solid var(--ciara);border-left:4px solid var(--ciara);border-radius:5px;
  padding:.55rem .7rem;margin:.5rem 0;font-size:.84rem;cursor:pointer;background:#fff}
.pozn-item .pi-t{font-family:var(--mono);font-size:.7rem;color:var(--ink-slaby);text-transform:uppercase;letter-spacing:.06em}
.pozn-item.aktivna{border-left-color:var(--magenta);background:#FDF3F8}

.zvuk-btn{display:inline-flex;flex-direction:column;align-items:flex-start;gap:.15rem;
  border:1.5px solid var(--fosfor);background:transparent;color:#DCEFE4;border-radius:6px;
  padding:.5rem .8rem;font-size:.8rem;min-width:9.5rem}
.zvuk-btn small{color:#9FB8AA;font-size:.68rem}
.zvuk-btn.vybr{background:rgba(69,208,126,.15)}
.os-karta.zamk{border-style:dashed;opacity:.45;cursor:not-allowed}
/* ================= VIZUÁLNA VRSTVA ================= */
.svgart{display:block;max-width:min(340px,86%);height:auto;margin:0 auto}
.svgart *{transform-box:fill-box;transform-origin:center}
.ilu-box{margin:.2rem 0 1rem;padding:.9rem .6rem .7rem;border:1.5px solid var(--ciara);border-radius:8px;
  background:
    linear-gradient(var(--papier-tmavsi),var(--papier-tmavsi)) padding-box,
    repeating-linear-gradient(45deg,transparent 0 10px,rgba(0,0,0,.025) 10px 20px) border-box;
  background-color:var(--papier-tmavsi)}
.ilu-box::after{content:'';display:block;height:3px;margin:.7rem auto 0;width:64px;background:var(--akc);border-radius:2px}

/* prechody slajdov (smerové) a obrazoviek */
.slajd{animation:slFade .24s ease both}
.slajd.an-next{animation:slNext .26s cubic-bezier(.2,.7,.3,1) both}
.slajd.an-prev{animation:slPrev .26s cubic-bezier(.2,.7,.3,1) both}
@keyframes slFade{from{opacity:0}to{opacity:1}}
@keyframes slNext{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
@keyframes slPrev{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
section[data-view].aktivny{animation:viewIn .3s ease both}
@keyframes viewIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.slajd h2{position:relative}
.slajd h2::after{content:'';position:absolute;left:0;bottom:-6px;height:3px;width:52px;background:var(--akc);
  transform:scaleX(0);transform-origin:left;animation:sweep .5s .15s ease forwards}
@keyframes sweep{to{transform:scaleX(1)}}

/* cievky v lište prehrávača */
.reel-box{display:inline-flex;gap:6px;margin-right:.6rem;align-items:center}
.reel-box svg{width:22px;height:22px}
.reel-box .a-spin{animation-duration:7s}
.player-lista.navig .reel-box .a-spin{animation-duration:.7s}

/* mediálne karty: miniatúry */
.med{display:block}
.med-thumb{position:relative;display:block;aspect-ratio:16/9;margin-bottom:.5rem;border-radius:4px;overflow:hidden;
  border:1px solid var(--ciara);background:var(--papier)}
.med-thumb svg{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;opacity:.9}
.med-thumb .med-real{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.med-thumb .med-glyph{position:absolute;right:6px;bottom:4px;font-style:normal;font-family:var(--mono);
  font-size:.8rem;line-height:1;color:var(--papier);background:rgba(0,0,0,.55);padding:3px 6px;border-radius:3px}
.med{transition:transform .18s ease, box-shadow .18s ease}
.med:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.08)}

/* mikrointerakcie */
.tlac,.pl-btn{transition:transform .12s ease, filter .15s ease}
.tlac:hover,.pl-btn:hover{filter:brightness(1.06)}
.tlac:active,.pl-btn:active{transform:translateY(1px) scale(.99)}
.karta{transition:transform .18s ease, box-shadow .18s ease}
.slajd .karta:hover{transform:translateY(-2px);box-shadow:0 5px 12px rgba(0,0,0,.07)}
.crt .led{animation:led 2.2s ease-in-out infinite}
@keyframes led{0%,100%{opacity:1}50%{opacity:.35}}
.bar .pruh i{animation:growX .55s ease both;transform-origin:left}
@keyframes growX{from{transform:scaleX(0)}}
.drop-chip{animation:chipPop .35s cubic-bezier(.2,1.4,.4,1) both}
@keyframes chipPop{from{transform:scale(.85);opacity:0}}
details.hlbka summary{transition:color .15s ease}
details.hlbka summary::before{content:'▸';display:inline-block;margin-right:.4rem;transition:transform .2s ease}
details.hlbka[open] summary::before{transform:rotate(90deg)}
.kazeta-karta{transition:transform .18s ease, box-shadow .18s ease}
.kazeta-karta:hover{transform:translateY(-3px) rotate(-.3deg);box-shadow:0 8px 18px rgba(0,0,0,.1)}

/* animácie SVG scén */
@keyframes aSpin{to{transform:rotate(360deg)}}         .a-spin{animation:aSpin 6s linear infinite}
@keyframes aBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} .a-bob{animation:aBob 2.6s ease-in-out infinite}
@keyframes aBlink{0%,55%,100%{opacity:1}70%,85%{opacity:.15}} .a-blink{animation:aBlink 2.4s steps(1) infinite}
.a-blink2{animation:aBlink 1.6s steps(1) infinite}
@keyframes aBx{0%,100%{transform:translateX(28px)}50%{transform:translateX(184px)}} .a-bx{animation:aBx 2.3s linear infinite alternate}
@keyframes aBy{0%,100%{transform:translateY(16px)}50%{transform:translateY(96px)}} .a-by{animation:aBy 1.6s linear infinite alternate}
@keyframes aBy2{0%,100%{transform:translateY(0)}50%{transform:translateY(62px)}} .a-by2{animation:aBy2 1.9s ease-in-out infinite}
@keyframes aP1{0%,100%{transform:translateY(-8px)}50%{transform:translateY(14px)}} .a-p1{animation:aP1 2.1s ease-in-out infinite}
.a-p2{animation:aP1 2.1s 1.05s ease-in-out infinite}
@keyframes aFall{0%{transform:translateY(-34px)}80%{transform:translateY(70px)}100%{transform:translateY(70px)}} .a-fall{animation:aFall 2.8s ease-in infinite}
@keyframes aBelt{to{transform:translateX(-80px)}} .a-belt{animation:aBelt 2.4s linear infinite}
@keyframes aDash{to{stroke-dashoffset:-40}} .a-dash{animation:aDash 2.2s linear infinite}
@keyframes aWave{0%{transform:translateX(0)}100%{transform:translateX(-40px)}} .a-wave{animation:aWave 1.4s linear infinite}
@keyframes aSway{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}} .a-sway{animation:aSway 3.4s ease-in-out infinite}
@keyframes aHop{0%,100%{transform:translate(0,0)}25%{transform:translate(17px,-10px)}50%{transform:translate(34px,0)}75%{transform:translate(17px,-10px)}} .a-hop{animation:aHop 3s ease-in-out infinite}
@keyframes aReel{0%,18%{transform:translateY(0)}22%,100%{transform:translateY(0)}10%{transform:translateY(-10px)}} 
.a-reel1{animation:aSpinY 1.1s ease-in-out infinite alternate}
.a-reel2{animation:aSpinY 1.1s .18s ease-in-out infinite alternate}
.a-reel3{animation:aSpinY 1.1s .36s ease-in-out infinite alternate}
@keyframes aSpinY{0%{transform:translateY(-3px)}100%{transform:translateY(3px)}}
@keyframes aLever{0%,70%,100%{transform:translateY(0)}80%{transform:translateY(9px)}} .a-lever{animation:aLever 3.2s ease infinite}
@keyframes aFlipL{0%,78%,100%{transform:rotate(0)}86%{transform:rotate(-22deg)}} .a-flipL{animation:aFlipL 2.6s ease infinite;transform-origin:left center}
@keyframes aFlipR{0%,82%,100%{transform:rotate(0)}90%{transform:rotate(22deg)}} .a-flipR{animation:aFlipR 2.6s .3s ease infinite;transform-origin:right center}
@keyframes aHammer{0%,60%,100%{transform:rotate(0)}72%{transform:rotate(-38deg)}80%{transform:rotate(6deg)}} .a-hammer{animation:aHammer 3.4s ease infinite;transform-origin:78% 80%}
@keyframes aOrbit{to{transform:rotate(360deg)}} .a-orbit{animation:aOrbit 14s linear infinite}
@keyframes aPop{from{transform:scale(.6);opacity:0}60%{transform:scale(1.08)}to{transform:scale(1);opacity:1}} .a-pop{animation:aPop .5s cubic-bezier(.2,1.3,.4,1) both}
@keyframes aBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}} .a-breathe{animation:aBreathe 3.6s ease-in-out infinite}
@keyframes aSmoke{0%{opacity:0;transform:translateY(0) scale(.7)}25%{opacity:.6}100%{opacity:0;transform:translateY(-42px) scale(1.5)}} .a-smoke{animation:aSmoke 2.8s ease-out infinite}
@keyframes aLift{0%,100%{transform:translate(0,0)}50%{transform:translate(0,-6px)}} .a-lift{animation:aLift 3.2s ease-in-out infinite}
@keyframes aStep{0%{opacity:0}12%,60%{opacity:1}100%{opacity:0}} .a-step{animation:aStep 2.7s linear infinite}
@keyframes aHand{to{transform:rotate(360deg)}} .a-hand{animation:aHand 6s linear infinite;transform-origin:center 74%}
.stopky .a-hand{transform-origin:80px 66px}
@keyframes aChat{0%{opacity:0;transform:translateY(14px)}15%,70%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-8px)}} .a-chat{animation:aChat 2.6s ease infinite}
@keyframes aDrop{0%{opacity:0;transform:translateY(0)}15%{opacity:1}70%{opacity:1;transform:translateY(78px)}100%{opacity:0;transform:translateY(84px)}} .a-drop{animation:aDrop 2.8s ease-in infinite}
@keyframes aScan{0%{transform:translate(52px,34px)}45%{transform:translate(96px,60px)}100%{transform:translate(60px,92px)}} .a-scan{animation:aScan 3.6s ease-in-out infinite alternate}
@keyframes aShake{0%,58%,100%{transform:rotate(0)}62%{transform:rotate(-4deg)}66%{transform:rotate(4deg)}70%{transform:rotate(-3deg)}74%{transform:rotate(2deg)}} .a-shake{animation:aShake 3.1s ease infinite;transform-origin:center 80%}
@keyframes aSpark{0%,55%{opacity:0;transform:translateY(4px)}68%{opacity:1;transform:translateY(-4px)}85%,100%{opacity:0;transform:translateY(-10px)}} .a-spark{animation:aSpark 3.1s ease infinite}
@keyframes aGate{0%,45%,100%{transform:translateY(0)}60%,80%{transform:translateY(-34px)}} .a-gate{animation:aGate 4.2s ease infinite}
@keyframes aWaveH{0%,70%,100%{transform:rotate(0)}78%{transform:rotate(-18deg)}86%{transform:rotate(12deg)}} .a-wavehand{animation:aWaveH 2.8s ease infinite;transform-origin:center bottom}
@keyframes aStamp{0%{transform:scale(1.5) rotate(-14deg);opacity:0}55%{transform:scale(.95) rotate(-9deg);opacity:1}70%{transform:scale(1.02) rotate(-9deg)}100%{transform:scale(1) rotate(-9deg);opacity:1}} .a-stamp{animation:aStamp .9s ease both}
@keyframes aDrift{0%{opacity:1;transform:translate(0,0)}100%{opacity:0;transform:translate(26px,10px)}} .a-drift{animation:aDrift 2.4s ease-in infinite}

/* šetrný režim */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}


/* recenzia: jadro, pohľady, pás */
.sl-badge{font-family:var(--mono);font-size:.55rem;letter-spacing:.1em;padding:2px 6px;border-radius:3px;margin-left:.5rem;vertical-align:middle}
.b-jadro{background:var(--akc);color:var(--papier)}
.b-rozs{background:var(--papier-tmavsi);color:var(--ink-slaby);border:1px solid var(--ciara)}
.poh-pas{display:flex;flex-wrap:wrap;gap:.35rem;margin:.4rem 0 .9rem}
.poh-chip{font-family:var(--mono);font-size:.6rem;padding:3px 7px;border:1px solid var(--ciara);border-radius:99px;color:var(--ink-slaby);background:var(--papier)}
.poh-chip.akt{background:var(--akc);color:var(--papier);border-color:var(--akc)}
.met-pas{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;margin:.3rem 0 1rem;padding:.5rem .6rem;border:1.5px dashed var(--ciara);border-radius:6px;font-family:var(--mono);font-size:.62rem;color:var(--ink-slaby)}
.met-pas i{font-style:normal;color:var(--akc)}
.pi-rozs .pi-t{opacity:.75}
.pi-rozs .pi-t::after{content:' · rozš.';font-size:.72em;color:var(--ink-slaby)}
.pozn-zoznam.rezim-jadro .pi-rozs{opacity:.4}
.pl-btn[aria-pressed="true"]{background:var(--akc);color:var(--papier);border-color:var(--akc)}

/* projekčný režim (stopgap do finálneho dizajnu) */
#projTlac{position:fixed;right:14px;bottom:14px;z-index:60}
body.projekcia{--ink:#12160f;--ink-slaby:#3a423d}
body.projekcia .slajd{font-size:1.22em;line-height:1.6}
body.projekcia .slajd h2{font-size:1.9em}
body.projekcia .crt{font-size:1.1em}
body.projekcia .poh-pas,body.projekcia .met-pas{font-size:.7rem}

/* panel hodiny + živé výsledky */
#hodinaTlac{position:fixed;right:14px;bottom:58px;z-index:60}
#hodinaPanel{position:fixed;right:14px;bottom:100px;z-index:61;width:260px;padding:14px;border:2px solid var(--ink);border-radius:12px;background:var(--papier);box-shadow:0 18px 40px -18px rgba(0,0,0,.5);display:none}
body.hp-otvorene #hodinaPanel{display:block}
.hp-hlava{font-family:var(--mono);font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.hp-znacka{font-family:var(--mono);font-size:.6rem;padding:2px 6px;border-radius:99px;background:var(--papier-tmavsi);color:var(--ink-slaby)}
.hp-znacka.ziva{background:#0E7A44;color:#fff}
.hp-znacka.demo{background:#C58A00;color:#fff}
.hp-pole{display:block;font-size:.78rem;color:var(--ink-slaby);margin-bottom:8px}
.hp-pole input{display:block;width:100%;margin-top:3px;padding:8px;border:1.5px solid var(--ciara);border-radius:6px;font-family:var(--mono);font-size:.95rem}
.hp-tlac{display:block;width:100%;padding:9px;margin-top:8px;border:1.5px solid var(--ink);border-radius:8px;background:var(--papier);font:inherit;font-size:.85rem;cursor:pointer}
.hp-tlac.hlavne{background:var(--ink);color:var(--papier);font-weight:600}
.hp-tlac.tichy{border-color:var(--ciara);color:var(--ink-slaby)}
.hp-mala{font-size:.72rem;color:var(--ink-slaby);margin:8px 0 0}
.hp-chyba{font-size:.75rem;color:#B3261E;margin:8px 0 0}
.hp-qr{display:flex;gap:10px;align-items:center;margin-bottom:8px}
.hp-qr #hpQr img,.hp-qr #hpQr canvas{width:96px;height:96px;display:block}
.qr-nahrada{font-family:var(--mono);font-size:.7rem;width:96px;word-break:break-all}
.hp-kod{font-family:var(--mono);font-size:.72rem;line-height:1.4;color:var(--ink-slaby)}
.hp-kod b{display:block;font-size:1.25rem;color:var(--ink)}
.hp-akt{font-size:.8rem;background:var(--papier-tmavsi);padding:8px;border-radius:6px;margin-bottom:6px}
.zp-box{border:2px solid var(--ink);border-radius:10px;padding:14px;margin:0 0 1rem;background:var(--papier-tmavsi)}
.zp-znacka{font-family:var(--mono);font-size:.62rem;color:var(--ink-slaby);margin-bottom:8px}
.zp-hlava{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin-bottom:10px}
.zp-hlava span{font-family:var(--mono);font-size:.72rem;color:var(--ink-slaby)}
.zp-caka{font-size:.85rem;color:var(--ink-slaby);margin:6px 0 0}
.zp-riadok{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.zp-popis{flex:0 0 34%;font-size:.85rem}
.zp-bar{flex:1;height:20px;background:var(--papier);border:1.5px solid var(--ciara);border-radius:4px;overflow:hidden}
.zp-bar i{display:block;height:100%;background:var(--akc);transition:width .4s ease}
.zp-hod{font-family:var(--mono);font-size:.85rem;min-width:2.2em;text-align:right}
.zp-cislo{font-family:var(--mono);font-size:2.4rem;font-weight:600}
.zp-skup{margin-bottom:12px}
.zp-skup b{display:block;font-size:.85rem;margin-bottom:5px}
.zp-texty{display:grid;gap:6px}
.zp-text{font-size:.85rem;background:var(--papier);border-left:4px solid var(--akc);padding:7px 9px;border-radius:0 6px 6px 0}
.zp-text i{display:block;font-family:var(--mono);font-size:.62rem;color:var(--ink-slaby);font-style:normal}
.zp-gildy{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;font-family:var(--mono);font-size:.68rem;color:var(--ink-slaby)}
body.projekcia .zp-popis{font-size:1.05rem}
body.projekcia .zp-cislo{font-size:3.4rem}