#reel-screen{position:fixed;inset:0;box-sizing:border-box;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;overflow:hidden;background:transparent;color:#fff;overscroll-behavior:contain;touch-action:pan-x;color-scheme:dark}
#reel-screen::backdrop{background:transparent}
.reel-screen-stage{position:fixed;overflow:hidden;container-type:size;background:#080808;isolation:isolate;will-change:width,height,left,top,clip-path}
.reel-screen-video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border:0;border-radius:inherit;pointer-events:none;background:#080808}
#reel-screen.reel-is-waiting{opacity:0;pointer-events:none}
#reel-screen .reel-screen-exit{position:absolute;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%);display:grid;place-items:center;width:52px;height:52px;padding:0;border:1px solid #ffffff60;border-radius:50%;background:#0004;color:#fff;cursor:pointer;z-index:2;opacity:0;pointer-events:none;transition:opacity .25s ease,background .2s ease;backdrop-filter:blur(10px)}
#reel-screen.reel-is-open .reel-screen-exit{opacity:1;pointer-events:auto}
#reel-screen .reel-screen-exit:hover{background:#0008}
.reel-screen-exit svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hero-reel.reel-is-expanded{visibility:hidden}
.hero-reel.reel-is-loading .reel-disc::after{content:'';position:absolute;inset:5px;border:2px solid #ffffff40;border-top-color:#fff;border-radius:50%;animation:reel-loading .9s linear infinite;pointer-events:none}
@keyframes reel-loading{to{transform:rotate(360deg)}}
.reel-load-error{font-size:14px;color:var(--ink);line-height:1.6;max-width:440px;margin:24px 0 0}.reel-load-error[hidden]{display:none}.reel-load-error a{text-decoration:underline;text-underline-offset:4px}
@media(max-width:600px){#reel-screen .reel-screen-exit{width:46px;height:46px;bottom:max(20px,env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){#reel-screen .reel-screen-exit{transition:none}.hero-reel.reel-is-loading .reel-disc::after{animation:none}}
#reel-screen.reel-is-open{background:var(--bg)}
#reel-screen .reel-screen-exit{bottom:max(64px,calc(env(safe-area-inset-bottom) + 48px))}
#reel-screen .reel-screen-mute{position:absolute;right:max(24px,env(safe-area-inset-right));top:max(24px,env(safe-area-inset-top));display:grid;place-items:center;width:46px;height:46px;padding:0;border:1px solid #ffffff60;border-radius:50%;background:#0004;color:#fff;cursor:pointer;z-index:2;opacity:0;pointer-events:none;transition:opacity .25s ease,background .2s ease;backdrop-filter:blur(10px)}
#reel-screen.reel-is-open .reel-screen-mute,#reel-screen.reel-is-open .reel-screen-progress{opacity:1;pointer-events:auto}
#reel-screen .reel-screen-mute:hover{background:#0008}
.reel-screen-mute svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.reel-screen-mute .reel-sound-off,.reel-screen-mute.is-muted .reel-sound-waves{display:none}
.reel-screen-mute.is-muted .reel-sound-off{display:block}
.reel-screen-progress{position:absolute;left:32px;bottom:max(18px,env(safe-area-inset-bottom));width:calc(100% - 64px);height:28px;margin:0;padding:0;appearance:none;-webkit-appearance:none;outline-offset:3px;background:transparent;cursor:pointer;z-index:2;opacity:0;pointer-events:none;transition:opacity .25s ease;touch-action:none;--reel-progress:0%}
.reel-screen-progress::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(to right,#fff var(--reel-progress),#ffffff55 var(--reel-progress))}
.reel-screen-progress::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:12px;margin-top:-4.5px;background:#fff;border:0;border-radius:50%;box-shadow:0 0 4px #0005}
.reel-screen-progress::-moz-range-track{height:3px;border-radius:3px;background:#ffffff55}
.reel-screen-progress::-moz-range-progress{height:3px;background:#fff;border-radius:3px}
.reel-screen-progress::-moz-range-thumb{width:12px;height:12px;background:#fff;border:0;border-radius:50%}
@media(max-width:600px){#reel-screen .reel-screen-mute{right:16px;top:max(16px,env(safe-area-inset-top));width:42px;height:42px}.reel-screen-progress{left:20px;width:calc(100% - 40px);bottom:max(12px,env(safe-area-inset-bottom))}#reel-screen .reel-screen-exit{bottom:max(56px,calc(env(safe-area-inset-bottom) + 42px))}}
@media(prefers-reduced-motion:reduce){#reel-screen .reel-screen-mute,.reel-screen-progress{transition:none}}
