.gftc-outer {
  width: 100% !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  --gftc-radius: 14px;
  --gftc-gap: 16px;
  --gftc-visible-desktop: 4;
  --gftc-visible-mobile: 1.5;
}

/* ── nav arrows ── */
.gftc-nav {
  display: flex !important;
  gap: 10px !important;
  justify-content: flex-end !important;
  margin-bottom: 20px !important;
}
@media (max-width: 768px) {
  .gftc-nav {
    justify-content: flex-end !important;
    margin-bottom: 0 !important;
    margin-top: 16px !important;
    order: 2 !important;
    padding-right: 12px !important;
  }
  .gftc-outer {
    display: flex !important;
    flex-direction: column !important;
  }
  .gftc-wrap { order: 1 !important; }
}
.gftc-nav button {
  width: 40px !important; height: 40px !important;
  border-radius: 50% !important;
  background: transparent !important;
  border: 1.5px solid #000 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.18s, border-color 0.18s !important;
  padding: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.gftc-nav button:hover { background: rgba(0,0,0,0.06) !important; border-color: rgba(0,0,0,0.3) !important; }
.gftc-nav button.gftc-hidden { opacity: 0.3 !important; pointer-events: none !important; }
.gftc-nav button svg { width: 24px !important; height: 24px !important; fill: #222 !important; display: block !important; }

/* ── carousel wrap ── */
.gftc-wrap {
  width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
  display: block !important;
  padding: 14px 0 !important;
  margin: -14px 0 !important;
  box-sizing: border-box !important;
  cursor: grab !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}
.gftc-wrap.gftc-dragging { cursor: grabbing !important; }

/* ── track ── */
.gftc-track {
  display: flex !important;
  gap: var(--gftc-gap, 16px) !important;
  transition: transform 0.45s cubic-bezier(0.4,0,0.2,1) !important;
  will-change: transform !important;
  align-items: flex-start !important;
  padding: 0 !important;
  margin: 0 !important;
}
.gftc-track.gftc-no-transition { transition: none !important; }

/* ── each card ── */
.gftc-card {
  flex: 0 0 calc((100% - (var(--gftc-visible-desktop, 4) - 1) * var(--gftc-gap, 16px)) / var(--gftc-visible-desktop, 4)) !important;
  position: relative !important;
  aspect-ratio: 9/16 !important;
  border-radius: var(--gftc-radius, 14px) !important;
  overflow: hidden !important;
  cursor: pointer !important;
  background: #111 !important;
  display: block !important;
  box-sizing: border-box !important;
  transition: transform 0.4s cubic-bezier(0.25,0.46,0.45,0.94), opacity 0.4s ease, filter 0.4s ease !important;
  transform: scale(1) !important;
  opacity: 1 !important;
  transform-origin: center center !important;
}
/* dim all cards when any is focused (playing with sound) */
.gftc-track.gftc-has-active .gftc-card {
  opacity: 0.42 !important;
  filter: grayscale(0.25) brightness(0.85) !important;
  transform: scale(0.96) !important;
}
/* the focused card — pop forward */
.gftc-track.gftc-has-active .gftc-card.gftc-active {
  opacity: 1 !important;
  filter: none !important;
  transform: scale(1.04) !important;
  z-index: 2 !important;
}
@media (max-width: 768px) {
  .gftc-card { flex: 0 0 calc((100% - (var(--gftc-visible-mobile, 1.5) - 1) * var(--gftc-gap, 16px)) / var(--gftc-visible-mobile, 1.5)) !important; }
  .gftc-track.gftc-has-active .gftc-card { transform: scale(0.97) !important; }
  .gftc-track.gftc-has-active .gftc-card.gftc-active { transform: scale(1.03) !important; }
}

/* ── video fills card ── */
.gftc-card video {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: #000 !important;
  pointer-events: none !important;
  border-radius: var(--gftc-radius, 14px) !important;
}

.gftc-card .gftc-grad { display: none !important; }

/* small muted-preview speaker badge, shown only while auto-playing silently */
.gftc-card .gftc-mind {
  position: absolute !important;
  top: 10px !important; right: 10px !important;
  width: 28px !important; height: 28px !important;
  border-radius: 50% !important;
  background: rgba(0,0,0,0.4) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  opacity: 0 !important; transition: opacity 0.2s ease !important;
  pointer-events: none !important; z-index: 1 !important;
}
.gftc-card.gftc-previewing .gftc-mind { opacity: 1 !important; }
.gftc-card.gftc-started .gftc-mind { opacity: 0 !important; }
.gftc-card .gftc-mind svg { width: 14px !important; height: 14px !important; fill: #fff !important; display: block !important; }

/* ── glass center play/pause ── */
.gftc-card .gftc-btn {
  position: absolute !important;
  top: 50% !important; left: 50% !important;
  width: 64px !important; height: 64px !important;
  margin-top: -32px !important; margin-left: -32px !important;
  border-radius: 50% !important;
  background: rgba(0,0,0,0.42) !important;
  border: 1.5px solid rgba(255,255,255,0.22) !important;
  backdrop-filter: blur(10px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.5) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0 !important;
  transition: opacity 0.25s ease, transform 0.2s ease !important;
  pointer-events: none !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
  box-sizing: border-box !important;
}
.gftc-card:hover .gftc-btn,
.gftc-card.gftc-paused .gftc-btn { opacity: 1 !important; }
.gftc-card:hover .gftc-btn { transform: scale(1.06) !important; }

@media (max-width: 768px) {
  .gftc-card .gftc-btn { width: 48px !important; height: 48px !important; margin-top: -24px !important; margin-left: -24px !important; }
  .gftc-card .gftc-btn svg { width: 18px !important; height: 18px !important; }
}

.gftc-card .gftc-btn svg {
  width: 24px !important; height: 24px !important;
  fill: #fff !important; display: block !important;
  margin: 0 0 0 4px !important; padding: 0 !important;
  border: none !important; background: none !important;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.5)) !important;
  flex-shrink: 0 !important;
}
.gftc-card .gftc-btn.gftc-isplay svg { margin-left: 0 !important; }

/* ── bottom controls ── */
.gftc-card .gftc-ctrl {
  position: absolute !important;
  bottom: 0 !important; left: 0 !important; right: 0 !important;
  padding: 8px 10px 10px !important;
  display: flex !important; flex-direction: column !important; gap: 6px !important;
  opacity: 0 !important; transition: opacity 0.3s ease !important;
  pointer-events: none !important; background: transparent !important;
  box-sizing: border-box !important;
}
.gftc-card.gftc-started:hover .gftc-ctrl,
.gftc-card.gftc-started.gftc-paused .gftc-ctrl { opacity: 1 !important; pointer-events: auto !important; }

.gftc-card .gftc-prow {
  position: relative !important; width: 100% !important; height: 14px !important;
  display: flex !important; align-items: center !important; cursor: pointer !important;
}
.gftc-card .gftc-ptrack {
  width: 100% !important; height: 3px !important;
  background: rgba(255,255,255,0.25) !important; border-radius: 2px !important;
  position: relative !important; display: block !important;
  margin: 0 !important; padding: 0 !important; border: none !important; box-shadow: none !important;
}
.gftc-card .gftc-pfill {
  height: 100% !important; width: 0% !important; background: #fff !important;
  border-radius: 2px !important; display: block !important; pointer-events: none !important;
  position: relative !important; margin: 0 !important; padding: 0 !important;
}
.gftc-card .gftc-pfill::after {
  content: '' !important; position: absolute !important;
  right: -4px !important; top: 50% !important; transform: translateY(-50%) !important;
  width: 9px !important; height: 9px !important; background: #fff !important;
  border-radius: 50% !important; opacity: 0 !important; transition: opacity 0.15s !important; display: block !important;
}
.gftc-card .gftc-prow:hover .gftc-pfill::after { opacity: 1 !important; }
.gftc-card .gftc-pseek {
  position: absolute !important; top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important; opacity: 0 !important;
  cursor: pointer !important; -webkit-appearance: none !important; appearance: none !important;
  margin: 0 !important; padding: 0 !important; border: none !important; outline: none !important;
  background: transparent !important; box-shadow: none !important;
}

.gftc-card .gftc-brow {
  display: flex !important; flex-direction: row !important; align-items: center !important;
  gap: 6px !important; width: 100% !important; margin: 0 !important; padding: 0 !important;
}
.gftc-card .gftc-time {
  color: rgba(255,255,255,0.82) !important; font-size: 11px !important;
  font-family: sans-serif !important; white-space: nowrap !important; line-height: 1 !important;
  display: block !important; flex-shrink: 0 !important; background: transparent !important;
  border: none !important; padding: 0 !important; margin: 0 !important;
}
.gftc-card .gftc-sp { flex: 1 !important; display: block !important; min-width: 0 !important; }

.gftc-card .gftc-ibtn {
  display: flex !important; align-items: center !important; justify-content: center !important;
  width: 26px !important; height: 26px !important; background: transparent !important;
  border: none !important; outline: none !important; cursor: pointer !important;
  padding: 0 !important; margin: 0 !important; border-radius: 4px !important;
  box-shadow: none !important; flex-shrink: 0 !important; transition: background 0.15s !important;
  -webkit-appearance: none !important; appearance: none !important;
}
.gftc-card .gftc-ibtn:hover { background: rgba(255,255,255,0.13) !important; }
.gftc-card .gftc-ibtn svg {
  width: 15px !important; height: 15px !important; fill: #fff !important; display: block !important;
  margin: 0 !important; padding: 0 !important; background: none !important; border: none !important;
  box-shadow: none !important; flex-shrink: 0 !important;
}

.gftc-card .gftc-vol {
  -webkit-appearance: none !important; appearance: none !important;
  width: 48px !important; height: 3px !important; background: rgba(255,255,255,0.3) !important;
  border-radius: 2px !important; border: none !important; outline: none !important;
  cursor: pointer !important; padding: 0 !important; margin: 0 !important;
  box-shadow: none !important; flex-shrink: 0 !important; display: block !important; vertical-align: middle !important;
}
.gftc-card .gftc-vol::-webkit-slider-runnable-track {
  -webkit-appearance: none !important; height: 3px !important;
  background: rgba(255,255,255,0.3) !important; border-radius: 2px !important;
  border: none !important; box-shadow: none !important;
}
.gftc-card .gftc-vol::-moz-range-track {
  height: 3px !important; background: rgba(255,255,255,0.3) !important;
  border-radius: 2px !important; border: none !important; box-shadow: none !important;
}
.gftc-card .gftc-vol::-webkit-slider-thumb {
  -webkit-appearance: none !important; appearance: none !important;
  width: 10px !important; height: 10px !important; border-radius: 50% !important;
  background: #fff !important; border: none !important; box-shadow: none !important;
  cursor: pointer !important; margin-top: -3.5px !important;
}
.gftc-card .gftc-vol::-moz-range-thumb {
  width: 10px !important; height: 10px !important; border-radius: 50% !important;
  background: #fff !important; border: none !important; box-shadow: none !important; cursor: pointer !important;
}

/* ── Instagram promo card ── */
.gftc-instacard {
  text-decoration: none !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #405DE6 0%, #5B51D8 20%, #833AB4 40%, #C13584 60%, #E1306C 80%, #FD1D1D 100%) !important;
}
.gftc-instacard .gftc-ig-bg {
  position: absolute !important; top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; opacity: 0.32 !important;
  filter: saturate(1.1) !important; display: block !important; pointer-events: none !important;
}
.gftc-instacard .gftc-ig-overlay {
  position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  background: linear-gradient(180deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.55) 65%, rgba(0,0,0,0.78) 100%) !important;
  pointer-events: none !important;
}
.gftc-instacard .gftc-ig-content {
  position: relative !important; z-index: 2 !important;
  display: flex !important; flex-direction: column !important; align-items: center !important;
  gap: 10px !important; padding: 6% !important; text-align: center !important; width: 100% !important;
  box-sizing: border-box !important;
}
.gftc-instacard .gftc-ig-avatar {
  width: clamp(56px, 22%, 96px) !important; height: clamp(56px, 22%, 96px) !important;
  border-radius: 50% !important; padding: 3px !important;
  background: linear-gradient(135deg, #405DE6, #5B51D8, #833AB4, #C13584, #E1306C, #FD1D1D, #FCAF45) !important;
  display: block !important; flex-shrink: 0 !important;
}
.gftc-instacard .gftc-ig-avatar img {
  width: 100% !important; height: 100% !important; border-radius: 50% !important;
  object-fit: cover !important; border: 3px solid #1a1a1a !important; display: block !important;
}
.gftc-instacard .gftc-ig-icon svg {
  width: clamp(24px, 8%, 34px) !important; height: clamp(24px, 8%, 34px) !important;
  fill: #fff !important; display: block !important;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)) !important;
}
.gftc-instacard .gftc-ig-username {
  font-family: sans-serif !important; font-weight: 700 !important;
  font-size: clamp(13px, 4vw, 18px) !important; line-height: 1.2 !important;
  word-break: break-word !important; margin: 0 !important;
}
.gftc-instacard .gftc-ig-btn {
  margin-top: 4px !important; padding: clamp(8px, 2.2vw, 11px) clamp(14px, 4vw, 20px) !important;
  border-radius: 999px !important; background: #fff !important; color: #111 !important;
  font-weight: 700 !important; font-size: clamp(11px, 3vw, 14px) !important; font-family: sans-serif !important;
  white-space: nowrap !important; box-shadow: 0 4px 14px rgba(0,0,0,0.35) !important;
  transition: transform 0.2s ease !important; display: inline-block !important;
}
.gftc-instacard:hover .gftc-ig-btn { transform: scale(1.06) !important; }