/* Czytnik „zajrzyj do środka” — przeniesiony 1:1 z głównej Akademii (zdjęty 04.10), teraz na stronach książek (05.10, Rafał: „pierwszy był lepszy”). */
.czytnik-ks .czyt-okno{background:var(--bg-2);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.czytnik-ks .czyt-pasek{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;padding:11px 16px;border-bottom:1px solid var(--line);
  font:700 10.5px/1.35 "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.czytnik-ks .czyt-pasek b{color:var(--amber)}
.czytnik-ks .czyt-pasek .cp-p{color:var(--ink-2)}
.czytnik-ks .czyt-scena{position:relative;display:flex;justify-content:center;padding:28px clamp(10px,4vw,64px);perspective:2400px;touch-action:pan-y pinch-zoom;outline:none;
  background:radial-gradient(ellipse at 50% 35%,rgba(255,255,255,.05),transparent 65%)}
.czytnik-ks .czyt-scena:focus-visible{box-shadow:inset 0 0 0 2px var(--amber)}
.czytnik-ks .rozkl{position:relative;display:grid;grid-template-columns:1fr 1fr;width:min(100%,calc(min(64vh,620px) / 1.4142 * 2));aspect-ratio:2 / 1.4142;
  transform-style:preserve-3d}
.czytnik-ks .str{position:relative;background:#fff;overflow:hidden;box-shadow:0 24px 40px -24px rgba(0,0,0,.55)}
.czytnik-ks .str img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
/* LUPA (26.09, Rafał: „tylko przybliżyć”, bez okna na cały ekran): koło pod kursorem, 1,8× (podgląd ma ograniczoną rozdzielczość, większe rozmywa).
   Nie łapie kliknięć (pointer-events:none), więc klik w stronę dalej ją przewraca. Telefon: szczypanie dwoma palcami. */
.czytnik-ks .czyt-lupa{position:absolute;z-index:6;width:190px;height:190px;border-radius:50%;pointer-events:none;
  border:2px solid var(--amber);box-shadow:0 14px 34px -10px rgba(0,0,0,.7);background-color:#fff;background-repeat:no-repeat;display:none}
@media (hover:hover){.czytnik-ks .str img{cursor:zoom-in}}
.czytnik-ks .czyt-kup{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;
  padding:16px 18px;border-top:1px solid var(--line)}
.czytnik-ks .czyt-kup .ck-txt{margin:0;font:500 14px/1.5 Inter,sans-serif;color:var(--ink-2);max-width:62ch}
.czytnik-ks .czyt-kup .ck-txt b{color:var(--ink)}
.czytnik-ks .czyt-kup .cta{display:inline-flex;align-items:center;min-height:50px;padding:0 28px;border:0;border-radius:6px;
  background:#F0A63C;color:#0E1116;font:700 16px/1 "Space Grotesk",sans-serif;cursor:pointer;white-space:nowrap}
.czytnik-ks .czyt-kup .cta:hover{background:#F5B85E}
@media (max-width:600px){.czytnik-ks .czyt-kup .cta{width:100%;justify-content:center}}
.czytnik-ks .czyt-podp{margin:8px 0 0;text-align:center;font:500 11.5px/1.4 "JetBrains Mono",monospace;color:var(--ink-3)}
.czytnik-ks .str.L{border-radius:4px 0 0 4px}
.czytnik-ks .str.P{border-radius:0 4px 4px 0}
.czytnik-ks .str.L::after,.czytnik-ks .str.P::after,.czytnik-ks .kartka .str::after{content:"";position:absolute;top:0;bottom:0;width:26px;pointer-events:none}
.czytnik-ks .str.L::after{right:0;background:linear-gradient(90deg,transparent,rgba(0,0,0,.16))}
.czytnik-ks .str.P::after{left:0;background:linear-gradient(270deg,transparent,rgba(0,0,0,.16))}
.czytnik-ks .str.pusta{background:transparent;box-shadow:none}
.czytnik-ks .str.pusta::after{display:none}
/* okładka jako strona — typografia skalowana szerokością strony */
/* karta końcowa */
.czytnik-ks .str.koncowa{background:linear-gradient(160deg,#1B2129 0%,#11151B 70%);color:#EDE9E1;container-type:inline-size}
.czytnik-ks .czyt-cta{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:4cqw;padding:12%}
.czytnik-ks .czyt-cta[hidden]{display:none}
.czytnik-ks .czyt-cta .cz-eb{font:700 3cqw/1.3 "JetBrains Mono",monospace;letter-spacing:.16em;text-transform:uppercase;color:#F0A63C;margin:0}
.czytnik-ks .czyt-cta .cz-t{font:700 8.4cqw/1.05 "Space Grotesk",sans-serif;letter-spacing:-.02em;margin:0}
.czytnik-ks .czyt-cta .cz-p{font:400 4.2cqw/1.5 Inter,sans-serif;color:#B8C0CA;margin:0}
.czytnik-ks .czyt-cta .cta{justify-self:start;align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;padding:0 5cqw;border:0;border-radius:6px;
  background:#F0A63C;color:#0E1116;font:700 max(13px,3.6cqw)/1 "Space Grotesk",sans-serif;cursor:pointer}
.czytnik-ks .czyt-cta .cz-m{font:500 2.9cqw/1.4 "JetBrains Mono",monospace;color:#8C95A1;margin:0}
/* kartka w locie */
.czytnik-ks .kartka{position:absolute;top:0;bottom:0;width:50%;transform-style:preserve-3d;z-index:3;display:none}
.czytnik-ks .kartka.do-przodu{left:50%;transform-origin:0 50%}
.czytnik-ks .kartka.do-tylu{left:0;transform-origin:100% 50%}
.czytnik-ks .kartka > .str{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.czytnik-ks .kartka > .tyl{transform:rotateY(180deg)}
.czytnik-ks .kartka.do-przodu > .przod{border-radius:0 4px 4px 0}
.czytnik-ks .kartka.do-przodu > .tyl{border-radius:4px 0 0 4px}
.czytnik-ks .kartka.do-tylu > .przod{border-radius:4px 0 0 4px}
.czytnik-ks .kartka.do-tylu > .tyl{border-radius:0 4px 4px 0}
.czytnik-ks .kartka.leci{display:block}
.czytnik-ks .kartka.do-przodu.leci{animation:czKartkaP .75s cubic-bezier(.45,.05,.3,1) forwards}
.czytnik-ks .kartka.do-tylu.leci{animation:czKartkaL .75s cubic-bezier(.45,.05,.3,1) forwards}
@keyframes czKartkaP{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}
@keyframes czKartkaL{from{transform:rotateY(0)}to{transform:rotateY(180deg)}}
/* nawigacja */
.czytnik-ks .czyt-nav{position:absolute;top:50%;z-index:5;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;
  border:1px solid var(--line-2);background:var(--card);color:var(--ink);font:600 18px/1 "Space Grotesk",sans-serif;cursor:pointer;
  box-shadow:0 8px 18px -10px rgba(0,0,0,.5)}
.czytnik-ks .czyt-nav.wstecz{left:10px}
.czytnik-ks .czyt-nav.dalej{right:10px}
.czytnik-ks .czyt-nav:disabled{opacity:.3;cursor:default}
.czytnik-ks .czyt-etyk{display:flex;flex-wrap:wrap;gap:6px;padding:12px 16px 16px;border-top:1px solid var(--line)}
.czytnik-ks .czyt-etyk button{min-height:36px;padding:0 11px;border-radius:6px;border:1px solid var(--line-2);background:none;cursor:pointer;
  color:var(--ink-2);font:700 10.5px/1 "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase}
.czytnik-ks .czyt-etyk button[aria-current="true"]{background:var(--amber);border-color:transparent;color:var(--on-amber)}
/* telefon: jedna strona */
@media (max-width:760px){
  .czytnik-ks .rozkl{grid-template-columns:1fr;width:min(100%,430px);aspect-ratio:1 / 1.4142}
  .czytnik-ks .str.L{display:none}
  .czytnik-ks .str.P{border-radius:4px}
  .czytnik-ks .str.P::after{display:none}
  .czytnik-ks .czyt-scena{padding:18px 6px 22px}
  .czytnik-ks .czyt-nav{top:auto;bottom:-8px;transform:none;width:44px;height:44px}
  .czytnik-ks .czyt-nav.wstecz{left:calc(50% - 56px)}
  .czytnik-ks .czyt-nav.dalej{right:calc(50% - 56px)}
  .czytnik-ks .czyt-scena{padding-bottom:58px}
}
@media (prefers-reduced-motion:no-preference){
  .czytnik-ks .str.P.wjazd-dalej{animation:czWjazdD .45s cubic-bezier(.2,.8,.2,1)}
  .czytnik-ks .str.P.wjazd-wstecz{animation:czWjazdW .45s cubic-bezier(.2,.8,.2,1)}
}
@keyframes czWjazdD{from{transform:translateX(34px) rotateY(-14deg);opacity:0}to{transform:none;opacity:1}}
@keyframes czWjazdW{from{transform:translateX(-34px) rotateY(14deg);opacity:0}to{transform:none;opacity:1}}

.czytnik-ks .str.okl-img img{object-fit:cover;object-position:top}
.czytnik-ks .czyt-cta{position:absolute;inset:0}
