/* GrowFlipbook — widżet katalogu w sklepie (RWD i Storefront) oraz podgląd w panelu.
   Presety to zestawy tokenów na .growflipbook[data-preset="a|b|c"]; sprzedawca nadpisuje --accent i --gf-card-radius.
   Font dziedziczony ze sklepu. Ruch tylko transform/opacity, wyłączony przy prefers-reduced-motion. */

.growflipbook,
.growflipbook *,
.growflipbook *::before,
.growflipbook *::after,
.gf-home,
.gf-home * { box-sizing: border-box; }

.growflipbook {
  /* Tokeny presetu (tabela FRONT): A domyślnie */
  --gf-stage-bg: #1d1d1f;
  --gf-page-shadow: 0 10px 30px rgba(0, 0, 0, .4);
  --gf-hotspot-color: var(--accent, #ffcc00);
  --gf-card-radius: 10px;
  --gf-thumb-h: 72px;
  --gf-toolbar-h: 48px;
  --gf-gap: 24px;
  --gf-font-size: 14px;
  --gf-hot-size: 18px;
  /* Tokeny semantyczne */
  --gf-chrome-fg: #f5f5f4;
  --gf-chrome-muted: #b5b0ab;
  --gf-chrome-line: rgba(255, 255, 255, .14);
  --gf-chrome-hover: rgba(255, 255, 255, .1);
  --gf-field-bg: rgba(255, 255, 255, .08);
  --gf-field-fg: #f5f5f4;
  --gf-results-bg: #26262a;
  --gf-skeleton: #2c2c30;
  --gf-skeleton-hi: rgba(255, 255, 255, .07);
  --gf-ink: #1c1917;
  --gf-text: #44403c;
  --gf-muted: #57534e;
  --gf-line: #e7e5e4;
  --gf-sale: #b42318;
  --gf-btn: 40px;
  --gf-page-max: 520px;
  --gf-page-ratio: 1.4142;
  --gf-chrome-v: 220px;
  --gf-dur: 180ms;
  --gf-ease: cubic-bezier(.2, .7, .2, 1);
  position: relative;
  min-width: 0;
  max-width: 100%;
  font-family: inherit;
  font-size: var(--gf-font-size);
  font-weight: 400;
  line-height: 1.45;
  color: var(--gf-chrome-fg);
  background: var(--gf-stage-bg);
  border-radius: 12px;
  overflow: clip;
  -webkit-tap-highlight-color: transparent;
}
.growflipbook[data-preset="b"] {
  --gf-stage-bg: #fff;
  --gf-page-shadow: 0 1px 3px rgba(0, 0, 0, .1);
  --gf-hotspot-color: var(--accent, #2155d9);
  --gf-card-radius: 8px;
  --gf-thumb-h: 0px;
  --gf-toolbar-h: 56px;
  --gf-gap: 32px;
  --gf-font-size: 14px;
  --gf-chrome-fg: #1c1917;
  --gf-chrome-muted: #57534e;
  --gf-chrome-line: #e7e5e4;
  --gf-chrome-hover: #f5f5f4;
  --gf-field-bg: #fff;
  --gf-field-fg: #1c1917;
  --gf-results-bg: #fafaf9;
  --gf-skeleton: #eeedeb;
  --gf-skeleton-hi: rgba(255, 255, 255, .7);
  --gf-page-max: 720px;
  overflow: visible;
  border-radius: 0;
}
.growflipbook[data-preset="c"] {
  --gf-stage-bg: #f5f5f5;
  --gf-page-shadow: none;
  --gf-hotspot-color: var(--accent, #2155d9);
  --gf-card-radius: 10px;
  --gf-thumb-h: 0px;
  --gf-toolbar-h: 44px;
  --gf-gap: 12px;
  --gf-font-size: 13px;
  --gf-hot-size: 14px;
  --gf-chrome-fg: #1c1917;
  --gf-chrome-muted: #57534e;
  --gf-chrome-line: #e2e0dd;
  --gf-chrome-hover: rgba(0, 0, 0, .05);
  --gf-field-bg: #fff;
  --gf-field-fg: #1c1917;
  --gf-results-bg: #fff;
  --gf-skeleton: #e7e5e4;
  --gf-skeleton-hi: rgba(255, 255, 255, .6);
  --gf-btn: 36px;
  --gf-chrome-v: 180px;
  border-radius: 16px;
}

/* Reset kontrolek: style przycisków sklepu albo panelu nie mogą rozciągać kropek i ikon. */
.growflipbook button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
  min-width: 0;
  min-height: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: inherit;
  font: inherit;
  letter-spacing: normal;
  text-transform: none;
  line-height: 1.2;
  opacity: 1;
  cursor: pointer;
}
.growflipbook input { font: inherit; margin: 0; }
.growflipbook [hidden], .growflipbook[hidden] { display: none !important; }
.gf-ico { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.growflipbook :focus { outline: none; }
.growflipbook :focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.growflipbook:focus-visible { outline: 2px solid var(--gf-ink); outline-offset: 3px; }

/* Pasek narzędzi */
.gf-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: var(--gf-toolbar-h);
  padding: 4px 8px;
  color: var(--gf-chrome-fg);
  background: var(--gf-stage-bg);
  border-bottom: 1px solid var(--gf-chrome-line);
}
.gf-bar:empty::before {
  content: "";
  width: 136px;
  height: 12px;
  margin-left: 8px;
  border-radius: 6px;
  background: var(--gf-skeleton);
}
.growflipbook .gf-bar button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: var(--gf-btn);
  height: var(--gf-btn);
  border-radius: 999px;
  color: var(--gf-chrome-fg);
  transition: background-color var(--gf-dur) ease, transform var(--gf-dur) var(--gf-ease);
}
@media (hover: hover) {
  .growflipbook .gf-bar button:hover { background: var(--gf-chrome-hover); }
}
.growflipbook .gf-bar button:active { transform: scale(.94); }
.gf-count {
  min-width: 6.5em;
  padding: 0 4px;
  text-align: center;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.growflipbook .gf-bar .gf-find { display: none; }
.growflipbook .gf-full { margin-left: 4px; }
.gf-full .gf-ico-min, .is-fullscreen .gf-full .gf-ico-max { display: none; }
.is-fullscreen .gf-full .gf-ico-min { display: block; }
.gf-search { display: flex; flex: 0 1 300px; min-width: 0; margin: 0 0 0 auto; }
.gf-search input {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 12px;
  border: 1px solid var(--gf-chrome-line);
  border-radius: 999px;
  background: var(--gf-field-bg);
  color: var(--gf-field-fg);
  font-size: 14px;
}
.gf-search input::placeholder { color: var(--gf-chrome-muted); opacity: 1; }
.growflipbook[data-preset="b"] .gf-search input, .growflipbook[data-preset="c"] .gf-search input { border-color: #d6d3d1; }
.gf-search input:focus-visible { outline: 2px solid var(--gf-chrome-fg); outline-offset: 1px; }

/* B: pasek przyklejony u góry podczas przewijania stron (tylko w sklepie; w panelu wyłączony w admin.css) */
.growflipbook[data-preset="b"] .gf-bar { position: sticky; top: 0; z-index: 5; }
.growflipbook[data-preset="b"] .gf-leaf { scroll-margin-top: calc(var(--gf-toolbar-h) + 16px); }

/* Wyniki szukania */
.gf-results {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  background: var(--gf-results-bg);
  color: var(--gf-chrome-muted);
  border-bottom: 1px solid var(--gf-chrome-line);
}
.growflipbook .gf-results button {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--gf-chrome-line);
  color: var(--gf-chrome-fg);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  transition: background-color var(--gf-dur) ease;
}
@media (hover: hover) {
  .growflipbook .gf-results button:hover { background: var(--gf-chrome-hover); }
}

/* Scena i strony */
.gf-stage {
  position: relative;
  padding: var(--gf-gap);
  background: var(--gf-stage-bg);
  overflow: hidden;
  touch-action: pan-y;
}
.growflipbook[data-preset="a"] .gf-stage, .growflipbook[data-preset="c"] .gf-stage { touch-action: pan-y pinch-zoom; perspective: 2400px; }
.gf-spread { display: flex; justify-content: center; gap: var(--gf-gap); }
.growflipbook[data-preset="a"] .gf-spread { gap: 0; }
.gf-scroll { display: flex; flex-direction: column; align-items: center; gap: var(--gf-gap); }
.gf-leaf {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  width: 100%;
  max-width: min(var(--gf-page-max), calc((100vh - var(--gf-chrome-v)) / var(--gf-page-ratio)));
  aspect-ratio: 1 / var(--gf-page-ratio);
  container-type: size;
}
@supports (height: 100svh) {
  .gf-leaf { max-width: min(var(--gf-page-max), calc((100svh - var(--gf-chrome-v)) / var(--gf-page-ratio))); }
}
/* Strona = obraz; kropki liczone od obrazu, nie od pola z marginesem. Wymiary strony wynikają z proporcji
   z danych katalogu (--gf-leaf-ratio = h/w), więc są znane przed wczytaniem obrazu (bez przesunięć układu). */
.gf-zoom {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  width: min(100cqw, calc(100cqh / var(--gf-leaf-ratio, 1.4142)));
  height: min(100cqh, calc(100cqw * var(--gf-leaf-ratio, 1.4142)));
  background: #fff;
  box-shadow: var(--gf-page-shadow);
  transform-origin: center;
}
.growflipbook .gf-leaf img {
  display: block;
  position: static;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  background: #fff;
}
.growflipbook[data-preset="a"] .gf-spread > .gf-leaf:first-child:not(:only-child) .gf-zoom { margin-right: 0; }
.growflipbook[data-preset="a"] .gf-spread > .gf-leaf:last-child:not(:only-child) .gf-zoom { margin-left: 0; }
.growflipbook[data-preset="a"] .gf-spread > .gf-leaf:not(:only-child) .gf-zoom::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  box-shadow: inset -22px 0 22px -18px rgba(0, 0, 0, .32);
}
.growflipbook[data-preset="a"] .gf-spread > .gf-leaf:last-child:not(:only-child) .gf-zoom::after { box-shadow: inset 22px 0 22px -18px rgba(0, 0, 0, .32); }
/* B: magazyn — jedna kolumna na środku. Na desktopie strony w naturalnej proporcji (wszystkie strony
   jedna pod drugą); na telefonie jedna strona w polu A4 jak w szkielecie, więc treść sklepu się nie przesuwa. */
.growflipbook[data-preset="b"] .gf-leaf { flex: none; }
.growflipbook[data-preset="b"] .gf-zoom { outline: 1px solid rgba(0, 0, 0, .06); }
@media (min-width: 761px) {
  /* Szkielet B ma wysokość ekranu: gotowe strony rosną w dół, a treść sklepu pod widżetem nie skacze w kadrze. */
  .growflipbook[data-preset="b"]:not(.is-narrow) .gf-stage:has(.gf-skeleton) { min-height: 100vh; }
  .growflipbook[data-preset="b"]:not(.is-narrow) .gf-leaf:not(.gf-skeleton) { aspect-ratio: auto; container-type: normal; max-width: var(--gf-page-max); }
  .growflipbook[data-preset="b"]:not(.is-narrow) .gf-leaf:not(.gf-skeleton) .gf-zoom { position: relative; inset: auto; width: 100%; height: auto; max-height: none; }
  .growflipbook[data-preset="b"]:not(.is-narrow) .gf-leaf:not(.gf-skeleton) img { width: 100%; height: auto; }
}
/* C: karuzela — strona na jasnym tle z cienką krawędzią */
.growflipbook[data-preset="c"] .gf-zoom { border-radius: 4px; outline: 1px solid rgba(0, 0, 0, .08); }
.growflipbook[data-preset="c"] .gf-leaf img { border-radius: 4px; }

/* Szkielet ładowania */
.gf-skeleton { background: var(--gf-skeleton); border-radius: 4px; overflow: hidden; }
.gf-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--gf-skeleton-hi);
  opacity: 0;
  animation: gf-shimmer 1.4s ease-in-out infinite;
}
.growflipbook[data-preset="a"] .gf-spread > .gf-skeleton + .gf-skeleton { margin-left: 2px; }
@keyframes gf-shimmer { 50% { opacity: .55; } }

/* Kropki produktów (A, C) i prostokąty (B) */
.gf-hot {
  position: absolute;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
}
.gf-hot::before {
  content: "";
  width: var(--gf-hot-size);
  height: var(--gf-hot-size);
  border-radius: 50%;
  background: var(--gf-hotspot-color);
  box-shadow: 0 0 0 2px #fff, 0 2px 8px rgba(0, 0, 0, .35);
  transition: transform var(--gf-dur) var(--gf-ease);
}
.growflipbook[data-preset="a"] .gf-hot::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--gf-hot-size);
  height: var(--gf-hot-size);
  margin: calc(var(--gf-hot-size) / -2) 0 0 calc(var(--gf-hot-size) / -2);
  border-radius: 50%;
  background: var(--gf-hotspot-color);
  opacity: 0;
  animation: gf-pulse 2s ease-out infinite;
  pointer-events: none;
}
@media (hover: hover) {
  .gf-hot:hover::before { transform: scale(1.18); }
}
.growflipbook .gf-hot:focus-visible { outline: 2px solid #fff; outline-offset: 0; box-shadow: 0 0 0 4px var(--gf-ink); }
.gf-hot:focus-visible::before { transform: scale(1.18); }
@keyframes gf-pulse {
  0% { transform: scale(1); opacity: .55; }
  70%, 100% { transform: scale(2.6); opacity: 0; }
}
.growflipbook[data-preset="b"] .gf-hot {
  display: block;
  transform: none;
  border-radius: 6px;
  border: 2px solid var(--gf-hotspot-color);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .7);
  transition: background-color var(--gf-dur) ease;
}
.growflipbook[data-preset="b"] .gf-hot::before {
  content: "+";
  position: absolute;
  top: -11px;
  right: -11px;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}
@media (hover: hover) {
  .growflipbook[data-preset="b"] .gf-hot:hover { background: rgba(255, 255, 255, .14); }
  .growflipbook[data-preset="b"] .gf-hot:hover::before { transform: scale(1.12); }
}
.growflipbook[data-preset="b"] .gf-hot:focus-visible { outline-offset: 2px; }

/* Karta produktu: dymek (desktop) i dolny arkusz (telefon) */
.gf-popover { position: absolute; z-index: 3; left: 12px; bottom: 12px; width: min(300px, calc(100% - 24px)); }
.gf-card {
  position: relative;
  display: grid;
  gap: 2px;
  width: 100%;
  padding: 16px;
  border-radius: var(--gf-card-radius);
  background: #fff;
  color: var(--gf-ink);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .06), 0 16px 36px -10px rgba(0, 0, 0, .45);
  font-size: 14px;
  text-align: left;
  overflow-wrap: anywhere;
}
.gf-popover .gf-card { animation: gf-pop var(--gf-dur) var(--gf-ease); }
@keyframes gf-pop { from { opacity: 0; transform: translateY(6px) scale(.98); } }
.growflipbook .gf-close {
  position: absolute;
  top: 8px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: var(--gf-muted);
}
@media (hover: hover) {
  .growflipbook .gf-close:hover { background: #f5f5f4; color: var(--gf-ink); }
}
.gf-close .gf-ico { width: 18px; height: 18px; }
.gf-name { margin: 0; padding-right: 32px; font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--gf-ink); }
.gf-price { margin: 6px 0 0; font-size: 18px; font-weight: 700; line-height: 1.3; font-variant-numeric: tabular-nums; color: var(--gf-ink); }
.gf-price:has(s) { color: var(--gf-sale); }
.gf-price s { margin-left: 8px; font-size: 14px; font-weight: 400; color: var(--gf-muted); }
.gf-omni { margin: 2px 0 0; font-size: 12px; line-height: 1.4; color: var(--gf-muted); }
.growflipbook .gf-atc, .growflipbook .gf-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  margin-top: 12px;
  padding: 10px 16px;
  border-radius: max(6px, calc(var(--gf-card-radius) - 4px));
  background: var(--gf-ink);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  transition: background-color var(--gf-dur) ease, transform var(--gf-dur) var(--gf-ease);
}
@media (hover: hover) {
  .growflipbook .gf-atc:not(:disabled):hover, .growflipbook .gf-link:hover { background: #44403c; }
}
.growflipbook .gf-atc:not(:disabled):active { transform: translateY(1px); }
.growflipbook .gf-link { background: #fff; color: var(--gf-ink); box-shadow: inset 0 0 0 1px #a8a29e; }
@media (hover: hover) {
  .growflipbook .gf-link:hover { background: #f5f5f4; }
}
.growflipbook .gf-atc:disabled { background: #f5f5f4; color: var(--gf-muted); box-shadow: inset 0 0 0 1px #d6d3d1; cursor: not-allowed; }
.growflipbook .gf-card :focus-visible { outline: 2px solid var(--gf-ink); outline-offset: 2px; }
.gf-sheet { color: var(--gf-ink); }

/* Miniatury (A) */
.gf-thumbs {
  display: flex;
  gap: 8px;
  height: var(--gf-thumb-h);
  max-width: 100%;
  min-width: 0;
  padding: 10px 12px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  background: #141416;
  scrollbar-width: thin;
  scrollbar-color: #4a4a50 transparent;
}
.growflipbook[data-preset="b"] .gf-thumbs, .growflipbook[data-preset="c"] .gf-thumbs { display: none; }
.growflipbook .gf-thumbs button {
  flex: none;
  height: 100%;
  aspect-ratio: 1 / var(--gf-leaf-ratio, 1.4142);
  border-radius: 4px;
  opacity: .55;
  transition: opacity var(--gf-dur) ease, transform var(--gf-dur) var(--gf-ease);
}
.growflipbook .gf-thumbs button[aria-current="true"] { opacity: 1; box-shadow: 0 0 0 2px var(--gf-hotspot-color); }
@media (hover: hover) {
  .growflipbook .gf-thumbs button:hover { opacity: 1; transform: translateY(-2px); }
}
.growflipbook .gf-thumbs button:focus-visible { opacity: 1; outline: 2px solid #fff; outline-offset: 2px; }
/* Miniatura i strona pochodzą z tej samej strony PDF, więc pole miniatury ma proporcję strony. */
.gf-thumbs img { display: block; width: 100%; height: 100%; object-fit: fill; border-radius: 4px; background: #2c2c30; }

/* Kropki (C): do 12 stron kropki, przy dłuższym katalogu pasek postępu z segmentów */
.gf-dots { display: none; justify-content: center; align-items: center; flex-wrap: wrap; gap: 0; min-height: var(--gf-dots-h); padding: 6px 12px; }
.growflipbook[data-preset="c"] .gf-dots { display: flex; }
.growflipbook .gf-dots button { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; }
.growflipbook .gf-dots button::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #c8c5c1;
  transition: transform var(--gf-dur) var(--gf-ease), background-color var(--gf-dur) ease;
}
.growflipbook .gf-dots button[aria-current="true"]::before { background: var(--gf-ink); transform: scale(1.35); }
@media (hover: hover) {
  .growflipbook .gf-dots button:hover::before { background: #78716c; }
}
.growflipbook[data-preset="c"] .gf-dots:has(> button:nth-child(13)) { flex-wrap: nowrap; gap: 2px; padding: 6px var(--gf-gap) 10px; }
.growflipbook .gf-dots:has(> button:nth-child(13)) button { flex: 1 1 0; min-width: 0; width: auto; height: 20px; border-radius: 0; }
.growflipbook .gf-dots:has(> button:nth-child(13)) button::before { width: 100%; height: 4px; border-radius: 2px; background: #dcd9d5; transform: none; }
.growflipbook .gf-dots:has(> button:nth-child(13)) button:has(~ button[aria-current="true"])::before,
.growflipbook .gf-dots:has(> button:nth-child(13)) button[aria-current="true"]::before { background: var(--gf-ink); }
.growflipbook .gf-dots button:focus-visible { outline: 2px solid var(--gf-ink); outline-offset: 0; }
/* C: miejsce na kropki zarezerwowane już w szkielecie (bez przesunięcia treści sklepu po załadowaniu) */
.growflipbook[data-preset="c"] { --gf-dots-h: 36px; }
.growflipbook[data-preset="c"]:has(> .gf-stage .gf-skeleton) .gf-thumbs { display: block; height: var(--gf-dots-h); padding: 0; background: transparent; }
/* Katalog jednostronicowy: bez strzałek i kropek (miejsce zostaje, układ się nie zmienia) */
.growflipbook:has(.gf-dots > button:only-child) .gf-bar .gf-prev,
.growflipbook:has(.gf-dots > button:only-child) .gf-bar .gf-next,
.growflipbook:has(.gf-dots > button:only-child) .gf-dots { visibility: hidden; }

/* C na desktopie: strzałki po bokach strony, jak w karuzeli */
@media (min-width: 761px) {
  .growflipbook[data-preset="c"]:not(.is-narrow) .gf-prev,
  .growflipbook[data-preset="c"]:not(.is-narrow) .gf-next {
    position: absolute;
    z-index: 4;
    top: calc(50% + (var(--gf-toolbar-h) - var(--gf-dots-h)) / 2);
    width: 44px;
    height: 44px;
    margin-top: -22px;
    background: #fff;
    color: var(--gf-ink);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .06), 0 6px 16px -6px rgba(0, 0, 0, .3);
  }
  .growflipbook[data-preset="c"]:not(.is-narrow) .gf-prev { left: 16px; }
  .growflipbook[data-preset="c"]:not(.is-narrow) .gf-next { right: 16px; }
  .growflipbook[data-preset="c"]:not(.is-narrow) .gf-bar { padding-left: 12px; }
  .growflipbook[data-preset="c"]:not(.is-narrow) .gf-count { text-align: left; min-width: 0; }
  .growflipbook[data-preset="c"]:not(.is-narrow) .gf-bar button:hover { background: #fff; }
  .growflipbook[data-preset="c"]:not(.is-narrow) .gf-prev:hover, .growflipbook[data-preset="c"]:not(.is-narrow) .gf-next:hover { transform: scale(1.06); }
}

/* Przewracanie i przesuwanie stron */
.gf-stage.is-turning .gf-zoom { animation: gf-open 420ms var(--gf-ease) both; animation-delay: var(--gf-turn-delay, 0ms); }
.growflipbook[data-dir="next"][data-preset="a"] .gf-stage.is-turning .gf-spread > .gf-leaf:first-child:not(:only-child) .gf-zoom {
  transform-origin: right center;
  animation-name: gf-land-left;
}
.growflipbook[data-dir="prev"][data-preset="a"] .gf-stage.is-turning .gf-spread > .gf-leaf:last-child:not(:only-child) .gf-zoom {
  transform-origin: left center;
  animation-name: gf-land-right;
}
.growflipbook[data-dir="next"][data-preset="a"] .gf-stage.is-turning .gf-spread > .gf-leaf:last-child:not(:only-child) .gf-zoom,
.growflipbook[data-dir="prev"][data-preset="a"] .gf-stage.is-turning .gf-spread > .gf-leaf:first-child:not(:only-child) .gf-zoom { animation-name: gf-reveal; }
.growflipbook[data-dir="next"] .gf-stage.is-turning .gf-leaf:only-child .gf-zoom { animation: gf-slide-next 260ms var(--gf-ease) both; animation-delay: var(--gf-turn-delay, 0ms); }
.growflipbook[data-dir="prev"] .gf-stage.is-turning .gf-leaf:only-child .gf-zoom { animation: gf-slide-prev 260ms var(--gf-ease) both; animation-delay: var(--gf-turn-delay, 0ms); }
@keyframes gf-open { from { opacity: 0; transform: scale(.985); } }
@keyframes gf-reveal { from { opacity: .7; } }
@keyframes gf-land-left { from { transform: perspective(1600px) rotateY(92deg); opacity: .4; } 60% { opacity: 1; } to { transform: perspective(1600px) rotateY(0); } }
@keyframes gf-land-right { from { transform: perspective(1600px) rotateY(-92deg); opacity: .4; } 60% { opacity: 1; } to { transform: perspective(1600px) rotateY(0); } }
@keyframes gf-slide-next { from { opacity: 0; transform: translateX(28px); } }
@keyframes gf-slide-prev { from { opacity: 0; transform: translateX(-28px); } }

/* Pusty katalog */
.gf-empty {
  margin: 0;
  padding: 48px 24px;
  text-align: center;
  color: var(--gf-chrome-muted);
  border: 1px dashed var(--gf-chrome-line);
  border-radius: 12px;
}

/* Pełny ekran */
.growflipbook.is-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  flex-direction: column;
  border-radius: 0;
  overflow: auto;
  --gf-chrome-v: 170px;
  --gf-page-max: 900px;
}
.growflipbook.is-fullscreen .gf-stage { flex: 1 0 auto; display: flex; flex-direction: column; justify-content: center; }

/* Blok „Nasze katalogi” */
.gf-home { margin: 0 0 32px; }
.gf-home h2 { margin: 0 0 16px; font-size: 22px; font-weight: 700; line-height: 1.25; }
.gf-home-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 208px)); gap: 24px 20px; }
.gf-home-card { display: grid; align-content: start; gap: 10px; color: inherit; text-decoration: none; border-radius: 10px; }
.gf-home-card img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1.4142;
  object-fit: cover;
  border-radius: 6px;
  background: #e7e5e4;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .06), 0 14px 26px -16px rgba(0, 0, 0, .55);
  transition: transform 220ms cubic-bezier(.2, .7, .2, 1), box-shadow 220ms ease;
}
.gf-home-card span { font-size: 15px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
@media (hover: hover) {
  .gf-home-card:hover img { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(0, 0, 0, .06), 0 22px 30px -16px rgba(0, 0, 0, .55); }
  .gf-home-card:hover span { text-decoration: underline; text-underline-offset: 3px; }
}
.gf-home-card:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

/* Telefon: zawsze jedna strona, pasek ‹ n/N › i lupa, karta w dolnym arkuszu */
@media (max-width: 760px) {
  .growflipbook { --gf-btn: 40px; --gf-gap: 12px; --gf-chrome-v: 150px; border-radius: 10px; }
  .growflipbook[data-preset="a"] { --gf-thumb-h: 64px; }
  .growflipbook[data-preset="b"] { --gf-toolbar-h: 48px; --gf-gap: 16px; border-radius: 0; }
  .growflipbook[data-preset="c"] { --gf-toolbar-h: 48px; --gf-btn: 40px; }
  .gf-spread { display: block; }
  .gf-spread > .gf-leaf.gf-skeleton ~ .gf-leaf.gf-skeleton { display: none; }
  .gf-leaf { max-width: none; margin: 0 auto; }
  .growflipbook .gf-bar .gf-full, .gf-search { display: none; }
  .growflipbook .gf-bar .gf-find { display: inline-flex; margin-left: auto; }
  .gf-bar { flex-wrap: wrap; }
  .growflipbook.is-searching .gf-search { display: flex; flex: 1 0 100%; order: 10; margin: 4px 0 4px; }
  .growflipbook.is-searching .gf-search input { height: 40px; font-size: 16px; }
  .gf-hot { width: 44px; height: 44px; }
  .growflipbook[data-preset="a"] .gf-spread > .gf-leaf .gf-zoom::after { display: none; }
  .gf-popover { display: none; }
  .gf-sheet {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2147482000;
    padding: 20px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    border-radius: 16px 16px 0 0;
    background: #fff;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, .25);
    animation: gf-sheet 220ms var(--gf-ease);
  }
  .gf-sheet::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 50%;
    width: 40px;
    height: 4px;
    margin-left: -20px;
    border-radius: 2px;
    background: #d6d3d1;
  }
  .gf-sheet .gf-card { width: 100%; padding: 4px 0 0; box-shadow: none; border-radius: 0; animation: none; }
  .gf-sheet .gf-close { top: -4px; right: -8px; }
  .gf-sheet .gf-name { font-size: 16px; }
  .gf-sheet .gf-atc, .gf-sheet .gf-link { min-height: 48px; }
  .gf-home-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 14px; }
  .gf-home h2 { font-size: 20px; }
}

/* --- Scalenie z rundą groka (WIP 13.10): tryb wąski z szerokości kontenera (.is-narrow) --- */
.growflipbook.is-narrow { --gf-btn: 40px; --gf-gap: 12px; --gf-chrome-v: 150px; border-radius: 10px; }
.growflipbook.is-narrow[data-preset="a"] { --gf-thumb-h: 64px; }
.growflipbook.is-narrow[data-preset="b"] { --gf-toolbar-h: 48px; --gf-gap: 16px; border-radius: 0; }
.growflipbook.is-narrow[data-preset="c"] { --gf-toolbar-h: 48px; --gf-btn: 40px; }
.growflipbook.is-narrow .gf-spread { display: block; }
.growflipbook.is-narrow .gf-spread > .gf-leaf.gf-skeleton ~ .gf-leaf.gf-skeleton { display: none; }
.growflipbook.is-narrow .gf-leaf { max-width: none; margin: 0 auto; }
.growflipbook.is-narrow .gf-bar .gf-full, .growflipbook.is-narrow .gf-search { display: none; }
.growflipbook.is-narrow .gf-bar .gf-find { display: inline-flex; margin-left: auto; }
.growflipbook.is-narrow .gf-bar { flex-wrap: wrap; }
.growflipbook.is-narrow.is-searching .gf-search { display: flex; flex: 1 0 100%; order: 10; margin: 4px 0 4px; }
.growflipbook.is-narrow.is-searching .gf-search input { height: 40px; font-size: 16px; }
.growflipbook.is-narrow .gf-hot { width: 44px; height: 44px; }
.growflipbook.is-narrow[data-preset="a"] .gf-spread > .gf-leaf .gf-zoom::after { display: none; }
.growflipbook.is-narrow .gf-popover { display: none; }
.growflipbook.is-narrow .gf-sheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 2147482000; padding: 20px 16px calc(16px + env(safe-area-inset-bottom, 0px)); border-radius: 16px 16px 0 0; background: #fff; box-shadow: 0 -12px 40px rgba(0, 0, 0, .25); animation: gf-sheet 220ms var(--gf-ease); }
.growflipbook.is-narrow .gf-sheet::before { content: ""; position: absolute; top: 8px; left: 50%; width: 40px; height: 4px; margin-left: -20px; border-radius: 2px; background: #d6d3d1; }
.growflipbook.is-narrow .gf-sheet .gf-card { width: 100%; padding: 4px 0 0; box-shadow: none; border-radius: 0; animation: none; }
.growflipbook.is-narrow .gf-sheet .gf-close { top: -4px; right: -8px; }
.growflipbook.is-narrow .gf-sheet .gf-name { font-size: 16px; }
.growflipbook.is-narrow .gf-sheet .gf-atc, .growflipbook.is-narrow .gf-sheet .gf-link { min-height: 48px; }
.growflipbook:not(.is-narrow) .gf-sheet { display: none !important; }
/* Nowe kontrolki paska groka */
.growflipbook .gf-bar .gf-pages, .growflipbook .gf-bar .gf-share { width: auto; min-width: var(--gf-btn); padding: 0 12px; border-radius: 999px; font-weight: 600; font-variant-numeric: tabular-nums; }
.growflipbook .gf-bar .gf-pages[aria-pressed="true"] { box-shadow: inset 0 0 0 1px var(--gf-chrome-line); }
.gf-goto { flex: none; width: 4.2em; height: 36px; padding: 0 10px; border: 1px solid var(--gf-chrome-line); border-radius: 999px; background: var(--gf-field-bg); color: var(--gf-field-fg); font-size: 14px; text-align: center; font-variant-numeric: tabular-nums; }
.gf-goto::placeholder { color: var(--gf-chrome-muted); opacity: 1; }
.growflipbook[data-preset="b"] .gf-goto, .growflipbook[data-preset="c"] .gf-goto { border-color: #d6d3d1; }
.growflipbook .gf-bar .gf-zoomout { margin-left: 8px; }
@media (max-width: 760px) {
  .growflipbook .gf-bar .gf-zoomin, .growflipbook .gf-bar .gf-zoomout, .growflipbook .gf-bar .gf-share, .growflipbook .gf-bar .gf-pages, .gf-goto { display: none; }
}
.growflipbook.is-narrow .gf-bar .gf-zoomin, .growflipbook.is-narrow .gf-bar .gf-zoomout, .growflipbook.is-narrow .gf-bar .gf-share, .growflipbook.is-narrow .gf-bar .gf-pages, .growflipbook.is-narrow .gf-goto { display: none; }
@keyframes gf-sheet { from { transform: translateY(100%); } }

@media (prefers-reduced-motion: reduce) {
  .growflipbook *, .growflipbook *::before, .growflipbook *::after, .gf-home * {
    animation: none !important;
    transition: none !important;
  }
}
@media (forced-colors: active) {
  .gf-hot::before { forced-color-adjust: none; background: Highlight; box-shadow: 0 0 0 2px Canvas; }
  .growflipbook[data-preset="b"] .gf-hot::before { background: Highlight; color: HighlightText; }
  .growflipbook .gf-dots button[aria-current="true"]::before,
  .growflipbook .gf-thumbs button[aria-current="true"] { forced-color-adjust: none; background: Highlight; }
}

/* Komunikat błędu katalogu (runda groka) */
.gf-error { margin: 0; padding: 14px 16px; background: #fff; color: #292524; border: 1px solid #e7e5e4; border-radius: 8px; font: inherit; }