html.reels-locked{overflow:hidden}
.reels-layer{position:fixed;inset:0;z-index:var(--reels-z,1000);background:var(--reels-bg,#000);color:var(--reels-fg,#fff);font-family:var(--reels-font,inherit)}
.reels-layer[hidden]{display:none}
.reels-feed{height:100dvh;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none;outline:0}
.reels-feed::-webkit-scrollbar{display:none}
.reels-item{position:relative;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;display:grid;place-items:center;background:var(--reels-item-bg,#000)}
.reels-frame{position:relative;width:var(--reels-frame-width,min(100vw,100dvh * 9 / 16));height:var(--reels-frame-height,min(100dvh,100vw * 16 / 9));overflow:hidden;background:var(--reels-frame-bg,#000)}
.reels-frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:var(--reels-fit,contain)}
.reels-frame>img{position:absolute;inset:0;width:100%;height:100%;object-fit:var(--reels-fit,contain);transform-origin:var(--reels-zoom-origin,50% 40%);will-change:transform}
.reels-moving .reels-frame>img{animation:reels-drift var(--reels-zoom-time,14s) ease-in-out infinite alternate}
@keyframes reels-drift{from{transform:none}to{transform:scale(var(--reels-zoom,1.14))}}
.reels-tap{position:absolute;inset:0;padding:0;border:0;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.reels-tap::before,.reels-tap::after{content:"";position:absolute;left:50%;top:var(--reels-play-top,45%);opacity:0;transform:scale(.8);transition:opacity .2s,transform .25s cubic-bezier(.3,1.6,.5,1)}
.reels-tap::after{width:4.6rem;height:4.6rem;margin:-2.3rem 0 0 -2.3rem;box-sizing:border-box;border:2px solid var(--reels-accent,#fff);border-radius:50%;background:var(--reels-control-bg,rgba(0,0,0,.5))}
.reels-tap::before{z-index:1;width:2rem;height:2rem;margin:-1rem 0 0 -1rem;background:var(--reels-icon,var(--reels-fg,#fff));clip-path:polygon(35.4% 22.9%,35.4% 77.1%,79.2% 50%)}
.reels-paused .reels-tap::before,.reels-paused .reels-tap::after{opacity:1;transform:none}
.reels-tap:focus-visible{outline:3px solid var(--reels-accent,#fff);outline-offset:-6px}
.reels-info{position:absolute;inset-inline:0;bottom:0;display:grid;gap:var(--reels-info-gap,12px);justify-items:start;padding:var(--reels-info-pad,80px 20px max(20px,env(safe-area-inset-bottom)));background:var(--reels-info-bg,linear-gradient(to bottom,transparent,rgba(0,0,0,.8)));color:var(--reels-fg,#fff);text-align:start;pointer-events:none}
.reels-info a,.reels-info button{pointer-events:auto}
.reels-title,.reels-caption{margin:0}
.reels-title a{color:inherit;text-decoration:none}
.reels-close,.reels-sound{position:fixed;z-index:1;top:max(14px,env(safe-area-inset-top));height:44px;border:0;border-radius:999px;background:var(--reels-control-bg,rgba(0,0,0,.5));color:var(--reels-fg,#fff);font:inherit;cursor:pointer}
.reels-close{inset-inline-end:14px;width:44px;display:grid;place-items:center;padding:0}
.reels-close svg{width:26px;height:26px}
.reels-sound{inset-inline-start:14px;padding:0 16px}
.reels-sound[hidden]{display:none}
.reels-close:focus-visible,.reels-sound:focus-visible{outline:3px solid var(--reels-accent,#fff);outline-offset:3px}
@media (prefers-reduced-motion:reduce){
  .reels-tap::before,.reels-tap::after{transition:none}
  .reels-moving .reels-frame>img{animation:none}
}
