* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: #000; overflow-x: hidden; }
#reel { display: block; width: 100vw; margin: 0; padding: 0; }
/* Permanently disable clicks/drag/select on videos/iframes */
.clip, .videoWrapper, iframe {
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}
.clip { display: block; position: relative; will-change: transform; transform: translateZ(0); margin: 0; }
.clip .frame {
  position: relative;
  width: 100vw;
  aspect-ratio: 16 / 9;      /* default true aspect ratio */
  background: #000;
  pointer-events: none;       /* keep non-interactive */
  will-change: transform;
  transform: translateZ(0);
}
.clip .frame iframe {
  position: absolute; inset: 0; width: 100%; height: 100%;
  border: 0;
  pointer-events: none;       /* no HUD/controls interaction */
}
/* Fullscreen transparent overlay that captures ONLY the first interaction */
#clickCatcher {
  position: fixed;
  inset: 0;
  z-index: 999999;         /* above everything for one interaction */
  background: transparent;
  cursor: pointer;
  /* do NOT set pointer-events:none; this must receive the first click/tap */
}
.watermark{
  position: fixed;
  right: 16px;
  bottom: 12px;
  font-size: 14px;
  line-height: 1;
  color: #fff;
  opacity: 0.17 !important;   /* adjust to taste */
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  pointer-events: none;
  user-select: none;
  z-index: 2147483647;         /* always above iframes */
}