/* MATCH card deck — Cue / Peel / Lift
   Promote later: wrap post/pre tickets in .hv2-deck inside zone-cards.
   Cheap motion: translate only. No scale/rotate/blur in the deck. */

#view-home-v2 .zone-cards--deck,
#view-match-lab .zone-cards--deck {
  display: block;
  overflow: visible;
  padding-bottom: 6px;
}

#view-home-v2 .hv2-deck,
#view-match-lab .hv2-deck {
  --hv2-deck-front: 90%;
  position: relative;
  width: 100%;
  overflow: visible;
  touch-action: pan-y;
}

#view-home-v2 .hv2-deck.is-drag,
#view-match-lab .hv2-deck.is-drag {
  touch-action: none;
}

#view-home-v2 .hv2-deck.is-drag .hv2-deck-layer,
#view-match-lab .hv2-deck.is-drag .hv2-deck-layer {
  transition: none;
}

/* Wide front card — stacked edges still peek on the right */
#view-home-v2 .hv2-deck-layer,
#view-match-lab .hv2-deck-layer {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--hv2-deck-front, 90%);
  height: 100%;
  transform-origin: left center;
  pointer-events: none;
  backface-visibility: hidden;
  transform: translateZ(0);
  transition: transform 0.22s cubic-bezier(0.25, 0.82, 0.25, 1);
}

#view-home-v2 .hv2-deck-layer.is-front,
#view-match-lab .hv2-deck-layer.is-front {
  pointer-events: auto;
}

#view-home-v2 .hv2-deck .hv2-ticket,
#view-home-v2 .hv2-deck .hv2-pre-wrap,
#view-match-lab .hv2-deck .hv2-ticket,
#view-match-lab .hv2-deck .hv2-pre-wrap {
  margin: 0;
  width: 100%;
  transform: none;
  box-shadow: none;
}

#view-home-v2 .hv2-deck .hv2-ticket-stub,
#view-home-v2 .hv2-deck .mc3-action,
#view-match-lab .hv2-deck .hv2-ticket-stub,
#view-match-lab .hv2-deck .mc3-action {
  touch-action: pan-y;
}

#view-home-v2 .hv2-deck--peel .hv2-deck-layer.is-out,
#view-home-v2 .hv2-deck .hv2-deck-layer.is-out,
#view-match-lab .hv2-deck--peel .hv2-deck-layer.is-out,
#view-match-lab .hv2-deck .hv2-deck-layer.is-out {
  transition:
    transform 0.22s cubic-bezier(0.25, 0.82, 0.25, 1),
    opacity 0.14s linear;
  opacity: 0;
}

#view-home-v2 .hv2-deck .hv2-deck-layer.is-out,
#view-match-lab .hv2-deck .hv2-deck-layer.is-out {
  transform: translate3d(-102%, 0, 0) !important;
}

#view-home-v2 .hv2-deck .hv2-deck-layer.is-out-right,
#view-match-lab .hv2-deck .hv2-deck-layer.is-out-right {
  transform: translate3d(102%, 0, 0) !important;
}

/* Drop expensive paint while cards move */
#view-home-v2 .hv2-deck .hv2-ticket-paper,
#view-home-v2 .hv2-deck .hv2-ticket-perf,
#view-home-v2 .hv2-deck .hv2-mark-glow-wrap::before,
#view-home-v2 .hv2-deck .hv2-stub-stars,
#view-match-lab .hv2-deck .hv2-ticket-paper,
#view-match-lab .hv2-deck .hv2-ticket-perf,
#view-match-lab .hv2-deck .hv2-mark-glow-wrap::before,
#view-match-lab .hv2-deck .hv2-stub-stars {
  display: none !important;
}

#view-home-v2 .hv2-deck .hv2-mark,
#view-home-v2 .hv2-deck .hv2-mark--hero,
#view-match-lab .hv2-deck .hv2-mark,
#view-match-lab .hv2-deck .hv2-mark--hero {
  filter: none !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16) !important;
}

#view-home-v2 .hv2-deck-dots,
#view-match-lab .hv2-deck-dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  padding: 10px 0 2px;
}

#view-home-v2 .hv2-deck-dots i,
#view-match-lab .hv2-deck-dots i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
}

#view-home-v2 .hv2-deck-dots i.on,
#view-match-lab .hv2-deck-dots i.on {
  width: 14px;
  border-radius: 99px;
}

#view-home-v2 .zone-block:has(.zone-hdr.post) .hv2-deck-dots i.on,
#view-match-lab .mlab-sec--post .hv2-deck-dots i.on {
  background: #8f3ee0;
}

#view-home-v2 .zone-block:has(.zone-hdr.done) .hv2-deck-dots i.on,
#view-match-lab .mlab-sec--done .hv2-deck-dots i.on {
  background: var(--green);
}

#view-home-v2 .zone-block:has(.zone-hdr.pre) .hv2-deck-dots i.on,
#view-match-lab .mlab-sec--pre .hv2-deck-dots i.on {
  background: var(--pre);
}

#view-home-v2 .hv2-deck[data-swipe="cue"]:not(.is-swiped)::after,
#view-match-lab .hv2-deck[data-swipe="cue"]:not(.is-swiped)::after {
  content: 'σύρε  ←';
  position: absolute;
  right: calc(100% - var(--hv2-deck-front, 90%) + 2px);
  top: 50%;
  z-index: 20;
  transform: translateY(-50%);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
  pointer-events: none;
  animation: hv2swipehint 1.5s ease-in-out infinite;
}

@keyframes hv2swipehint {
  0%, 100% { transform: translate(-6px, -50%); opacity: 0.35; }
  50% { transform: translate(-16px, -50%); opacity: 0.9; }
}

.mlab-cue-deck {
  padding: 0 8px 8px;
}

@media (prefers-reduced-motion: reduce) {
  #view-home-v2 .hv2-deck-layer,
  #view-match-lab .hv2-deck-layer {
    transition-duration: 0.01s !important;
  }
}