/* ==========================================================
   NCN 2026 — COPERTINA / CENTRAL BOX v4.4.1
   Pile drag interaction — no snap hide
   ========================================================== */

:root {
  --ncn-cb-thumb-w: 188px;
  --ncn-cb-thumb-h: 126px;
}

/* ---------- COPERTINA PRINCIPALE ---------- */
.ncn-page .cb__stage[data-ncn-cb] {
  position: relative;
  overflow: hidden;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
  isolation: isolate;
}

.ncn-page .cb__stage[data-ncn-cb].is-cb-dragging {
  cursor: grabbing;
}

/* Durante il drag la posizione segue il puntatore senza ritardo. */
.ncn-page .cb__stage[data-ncn-cb].is-cb-dragging .cb-slide {
  transition: none !important;
}

/* La slide adiacente viene resa visibile solo durante la preview ibrida. */
.ncn-page .cb__stage[data-ncn-cb] .cb-slide.is-cb-preview-target,
.ncn-page .cb__stage[data-ncn-cb] .cb-slide.is-cb-preview-current {
  visibility: visible !important;
  will-change: transform, opacity;
}

.ncn-page .cb__stage[data-ncn-cb].is-cb-settling .cb-slide {
  will-change: transform, opacity;
}

/* Durante il completamento manuale la slide uscente si comporta come
   una fotografia fisica: resta sopra finche raggiunge il bordo, poi
   passa sotto la nuova cover. Ombra minima per dare profondita senza
   trasformare il CB in un effetto 3D vistoso. */
.ncn-page .cb__stage[data-ncn-cb].is-cb-pile-commit .cb-slide.is-cb-preview-current {
  box-shadow: 0 10px 28px rgba(0,0,0,.16);
  backface-visibility: hidden;
}

.ncn-page .cb__stage[data-ncn-cb].is-cb-pile-commit .cb-slide.is-cb-preview-target {
  backface-visibility: hidden;
}

/* Il riflesso si ferma durante l'interazione, così non sporca la dissolvenza. */
.ncn-page .cb__stage[data-ncn-cb].is-cb-dragging::after,
.ncn-page .cb__stage[data-ncn-cb].is-cb-settling::after {
  animation-play-state: paused;
  opacity: 0 !important;
}

.ncn-page .cb__stage[data-ncn-cb] .cb-slide {
  transition: opacity .58s ease, visibility .58s ease, transform .24s ease;
  will-change: opacity, transform;
}

.ncn-page .cb__stage[data-ncn-cb] .cb-slide:not(.is-active) {
  pointer-events: none;
}

.ncn-page .cb__stage[data-ncn-cb] .cb-slide__image {
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none;
}

/* Riflesso elegante e molto lento sulla copertina. */
.ncn-page .cb__stage[data-ncn-cb]::after {
  content: "";
  position: absolute;
  z-index: 7;
  top: -45%;
  left: -36%;
  width: 18%;
  height: 190%;
  pointer-events: none;
  opacity: 0;
  transform: skewX(-18deg);
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(194,239,255,.07) 28%,
    rgba(225,248,255,.31) 50%,
    rgba(194,239,255,.07) 72%,
    rgba(255,255,255,0) 100%
  );
  filter: blur(3px);
  animation: ncnCbMainShine 8.6s ease-in-out infinite;
}

@keyframes ncnCbMainShine {
  0%, 17% { left: -36%; opacity: 0; }
  22% { opacity: .68; }
  47% { left: 122%; opacity: .52; }
  52%, 100% { left: 122%; opacity: 0; }
}

/* ---------- STRISCIA MINIATURE ---------- */
.ncn-page .cb-thumbstrip {
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
  border: 6px solid #fff;
  background:
    radial-gradient(circle at 50% 0%, rgba(35,171,235,.13), transparent 48%),
    linear-gradient(180deg, #0a2946 0%, #071d31 100%);
  isolation: isolate;
  user-select: none;
  -webkit-user-select: none;
}

.ncn-page .cb-thumbstrip.cb-thumbstrip--shared-top { border-top: 0; }
.ncn-page .cb-thumbstrip.cb-thumbstrip--shared-bottom { border-bottom: 0; }

.ncn-page .cb-thumbstrip::before,
.ncn-page .cb-thumbstrip::after {
  content: "";
  position: absolute;
  z-index: 5;
  top: 0;
  bottom: 0;
  width: 58px;
  pointer-events: none;
}

.ncn-page .cb-thumbstrip::before {
  left: 0;
  background: linear-gradient(90deg, rgba(4,21,37,.92), rgba(4,21,37,0));
}

.ncn-page .cb-thumbstrip::after {
  right: 0;
  background: linear-gradient(270deg, rgba(4,21,37,.92), rgba(4,21,37,0));
}

.ncn-page .cb-thumbstrip__viewport {
  position: relative;
  z-index: 2;
  width: 100%;
  overflow: hidden;
  cursor: grab;
  touch-action: pan-y;
}

.ncn-page .cb-thumbstrip.is-dragging .cb-thumbstrip__viewport { cursor: grabbing; }

.ncn-page .cb-thumbstrip__track {
  display: flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  padding: 12px 16px;
  transform: translate3d(0,0,0);
  will-change: transform;
}

.ncn-page .cb-thumbstrip__item {
  position: relative;
  flex: 0 0 var(--ncn-cb-thumb-w);
  width: var(--ncn-cb-thumb-w);
  height: var(--ncn-cb-thumb-h);
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 2px;
  background: #031526;
  box-shadow: 0 5px 13px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.08);
  cursor: pointer;
  opacity: .69;
  filter: brightness(.78) saturate(.92);
  transition: opacity .28s ease, filter .28s ease, box-shadow .28s ease;
  -webkit-tap-highlight-color: transparent;
}

.ncn-page .cb-thumbstrip__item::before {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(135deg, rgba(117,224,255,.04), rgba(34,173,235,.26) 46%, rgba(0,113,184,.10));
  box-shadow: inset 0 0 0 1px rgba(151,231,255,.22), inset 0 0 24px rgba(25,172,236,.14);
  transition: opacity .28s ease;
}

.ncn-page .cb-thumbstrip__item::after {
  content: "";
  position: absolute;
  z-index: 3;
  top: -45%;
  left: -38%;
  width: 26%;
  height: 190%;
  opacity: 0;
  transform: skewX(-18deg);
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(196,241,255,.42), transparent);
  filter: blur(2px);
}

.ncn-page .cb-thumbstrip__item:hover,
.ncn-page .cb-thumbstrip__item:focus-visible {
  opacity: .98;
  filter: brightness(1.06) saturate(1.04);
  box-shadow: 0 7px 17px rgba(0,0,0,.34), 0 0 17px rgba(35,179,237,.18), inset 0 0 0 1px rgba(174,235,255,.18);
  outline: none;
}

.ncn-page .cb-thumbstrip__item:hover::before,
.ncn-page .cb-thumbstrip__item:focus-visible::before { opacity: 1; }

.ncn-page .cb-thumbstrip__item:hover::after,
.ncn-page .cb-thumbstrip__item:focus-visible::after {
  opacity: .58;
  animation: ncnCbThumbShine .78s ease forwards;
}

.ncn-page .cb-thumbstrip__item.is-active {
  opacity: 1;
  filter: brightness(1.14) saturate(1.07);
  box-shadow: 0 8px 19px rgba(0,0,0,.35), 0 0 21px rgba(39,185,241,.27), inset 0 0 0 1px rgba(181,239,255,.31);
}

.ncn-page .cb-thumbstrip__item.is-active::before { opacity: .72; }

.ncn-page .cb-thumbstrip__image {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
}

@keyframes ncnCbThumbShine {
  from { left: -38%; }
  to { left: 122%; }
}

@media (prefers-reduced-motion: reduce) {
  .ncn-page .cb__stage[data-ncn-cb]::after { animation: none; }
  .ncn-page .cb-thumbstrip__item { transition: none; }
  .ncn-page .cb-thumbstrip__item::after { animation: none !important; }
}

@media (max-width: 900px) {
  :root {
    --ncn-cb-thumb-w: 132px;
    --ncn-cb-thumb-h: 86px;
  }
  .ncn-page .cb-thumbstrip__track { gap: 6px; padding: 9px 10px; }
  .ncn-page .cb-thumbstrip::before,
  .ncn-page .cb-thumbstrip::after { width: 28px; }
}

/* v4.4.1 — durante il commit la cover uscente resta sopra fino a quando
   ha oltrepassato il bordo del CB. Nessun cambio di z-index intermedio. */
.ncn-page .cb__stage[data-ncn-cb].is-cb-pile-commit .cb-slide.is-cb-preview-current {
  z-index: 5;
  will-change: transform, opacity, filter;
}
.ncn-page .cb__stage[data-ncn-cb].is-cb-pile-commit .cb-slide.is-cb-preview-target {
  z-index: 3;
  will-change: transform, opacity, filter;
}

/* v4.4.2 · miniature moduli interni */
.ncn-page .cb-thumbstrip__module{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;padding:13px;box-sizing:border-box;text-align:left;background:radial-gradient(circle at 75% 15%,rgba(61,199,245,.36),transparent 34%),linear-gradient(135deg,#061c34,#0d6d99);color:#fff}.ncn-page .cb-thumbstrip__module small{font:900 8px Arial;letter-spacing:1px;color:#89defb;text-transform:uppercase}.ncn-page .cb-thumbstrip__module b{margin-top:4px;font:900 13px/1.05 Arial;color:#fff}.ncn-page .cb-thumbstrip__item.is-active .cb-thumbstrip__module{background:radial-gradient(circle at 75% 15%,rgba(89,219,255,.43),transparent 34%),linear-gradient(135deg,#07213b,#0c86b8)}