/* KlipTok v130 · Reels (escritorio): columna de botones FUERA del reel, flechas subir/bajar y reel sin hueco.
   No se quita nada: los botones originales y el «⋯» siguen donde estaban. Deshacer: borrar este archivo, kt-v130-reels-rail.js y sus 2 líneas en index.html. */
.k130-rail, .k130-nav { display: none; }
@media (min-width: 1024px) {
  body.kt-reels .feed-card.k130-has { overflow: visible !important; }
  body.kt-reels .k130-rail { display: flex; position: absolute; left: calc(100% + .75rem); top: 0; bottom: 0; width: 3.4rem; z-index: 30;
    flex-direction: column; justify-content: flex-end; align-items: center; gap: .5rem; overflow-y: auto; overflow-x: visible; scrollbar-width: none; padding: .15rem; }
  body.kt-reels .k130-rail::-webkit-scrollbar { display: none; }
  /* la columna antigua (misma función) se esconde solo cuando la nueva existe; a pantalla completa vuelve a verse */
  body.kt-reels .feed-card.k130-has > .group:not(:fullscreen) > .absolute.bottom-4.right-3 { display: none !important; }
  .k130-b { flex: 0 0 auto; width: 2.7rem; min-height: 2.7rem; border: 0; border-radius: 999px; color: #fff; cursor: pointer; text-decoration: none;
    display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; padding: .2rem 0;
    box-shadow: 0 4px 12px rgba(15,23,42,.28), inset 0 1px 0 rgba(255,255,255,.35); transition: transform .12s ease, filter .12s ease; }
  .k130-b:hover { transform: scale(1.1); filter: brightness(1.1); }
  .k130-b:active { transform: scale(.94); }
  .k130-b svg { width: 1.2rem; height: 1.2rem; stroke: currentColor; }
  .k130-b small { font: 800 10px/1 system-ui, sans-serif; }
  .k130-sep { flex: 0 0 auto; width: 1.6rem; height: 2px; border-radius: 2px; background: rgba(124,58,237,.35); }
  /* flechas para subir / bajar reels, en el borde derecho de la zona de vídeo */
  body.kt-reels .k130-nav { position: fixed; z-index: 70; display: none; flex-direction: column; gap: .7rem; transform: translateY(-50%); }
  body.kt-reels .k130-nav.on { display: flex; }
  .k130-nav button { width: 3rem; height: 3rem; border: 0; border-radius: 999px; color: #fff; cursor: pointer; display: grid; place-items: center;
    background: linear-gradient(135deg, #2563eb, #7c3aed 55%, #ec4899); box-shadow: 0 6px 18px rgba(76,29,149,.4); transition: transform .12s ease, opacity .12s ease; }
  .k130-nav button:hover { transform: scale(1.08); }
  .k130-nav button:disabled { opacity: .35; cursor: default; transform: none; }
  .k130-nav svg { width: 1.5rem; height: 1.5rem; }
}
/* reel completo, sin que asome el siguiente: sin relleno arriba/abajo y alto = pantalla útil (solo ~.25rem de separación) */
@media (min-width: 768px) {
  body.kt-reels #feed-container { padding-top: 0 !important; padding-bottom: 0 !important; scroll-padding: 0 !important; }
  body.kt-reels #feed-container #dynamic-feed > .feed-card { margin-top: 0 !important; margin-bottom: .25rem !important; scroll-snap-align: start !important; scroll-snap-stop: always; }
  body.kt-reels #feed-container #dynamic-feed > .feed-card:not([data-kt-ar]) { height: calc(100cqh - .25rem) !important; }
}
