.reels-main{background:#000;overflow:hidden}.reels-toolbar{display:flex;justify-content:space-between;align-items:center;padding:28px 5%;gap:20px}.reels-toolbar p{margin:0;color:#aaa;font-size:14px}
.reel-slide{overflow:hidden;border-bottom:1px solid #ffffff12}.reel-stage{position:relative;aspect-ratio:16/9;isolation:isolate;background:radial-gradient(ellipse at 50% 0%,#a13f00 0%,#542100 32%,#1b0b00 53%,#000 76%)}
.reel-titles{position:absolute;inset:9% 6.5% auto;display:flex;justify-content:space-between;align-items:flex-start;transition:opacity .5s,transform .8s}.reel-titles h2{font-size:clamp(26px,2.65vw,52px);line-height:1.18;margin:0;letter-spacing:0}.reel-titles p{font-size:clamp(26px,2.7vw,52px);line-height:1.25;margin:0;font-weight:700}
.reel-card{position:absolute;top:20%;left:50%;width:22.5%;aspect-ratio:9/16;border:5px solid #635444;border-radius:7px;background:#161310;overflow:hidden;box-shadow:0 0 36px #ff78001f;transform:translateX(-50%);transition:left .8s cubic-bezier(.22,.75,.18,1),top .8s cubic-bezier(.22,.75,.18,1),transform .8s cubic-bezier(.22,.75,.18,1),opacity .6s,box-shadow .25s;will-change:transform,left,top}
.reel-position-0{left:24%;top:33%;transform:translateX(-50%) rotate(-30deg);z-index:1}.reel-position-1{z-index:2}.reel-position-2{left:77%;top:32%;transform:translateX(-50%) rotate(30deg);z-index:1}
.reel-card video{display:block;width:100%;height:100%;object-fit:cover;background:#000}.reel-full{position:absolute;inset:0;visibility:hidden}.reel-open{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;color:white;cursor:pointer}.reel-open:focus-visible{outline:3px solid #fa6500;outline-offset:-5px}.reel-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:58px;height:58px;background:#0006;border:1px solid #ffffff70;border-radius:50%;font-size:20px;opacity:0;transition:opacity .25s}.reel-number{position:absolute;left:16px;bottom:14px;font-size:16px;text-shadow:0 1px 6px #000}
.is-previewing.reel-position-0{transform:translate(-50%,-12px) rotate(-26deg) scale(1.035)}.is-previewing.reel-position-1{transform:translate(-50%,-12px) scale(1.035)}.is-previewing.reel-position-2{transform:translate(-50%,-12px) rotate(26deg) scale(1.035)}.is-previewing{box-shadow:0 0 50px #ff780045}.reel-card:hover .reel-play,.reel-open:focus-visible .reel-play{opacity:1}.is-previewing .reel-play{opacity:0!important}
.reel-group{position:absolute;bottom:3%;left:6.5%;font-size:13px;letter-spacing:2px;color:#bbb}
.is-playing .reel-titles{opacity:0;transform:translateY(-50px);pointer-events:none}.is-playing .is-selected{left:50%;top:50%;transform:translate(-50%,-50%) rotate(0deg);z-index:5}.is-selected .reel-full{visibility:visible}.is-selected .reel-preview{visibility:hidden}.is-selected .reel-open{visibility:hidden}.reel-card.exit-left{left:-70%;transform:translateX(-50%) rotate(-40deg);opacity:0;pointer-events:none}.reel-card.exit-right{left:170%;transform:translateX(-50%) rotate(40deg);opacity:0;pointer-events:none}
.reel-close{position:absolute;right:6%;top:6%;z-index:8;padding:12px 22px;border:1px solid #ffffff60;border-radius:30px;background:#0008;color:#fff;font:16px "CoFo Sans Arabic",Arial;cursor:pointer}.reel-close[hidden],.reel-resume[hidden]{display:none}.reel-close:focus-visible,.reel-resume:focus-visible{outline:2px solid #fa6500;outline-offset:4px}.reel-resume{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:7;white-space:nowrap;border:1px solid #aaa;border-radius:25px;padding:12px 20px;background:#000b;color:#fff;font:16px "CoFo Sans Arabic",Arial;cursor:pointer}
@media(max-width:800px){.reel-stage{aspect-ratio:auto;height:780px}.reel-titles{inset:7% 6% auto}.reel-titles h2,.reel-titles p{font-size:27px}.reel-card{width:34%;top:27%;border-width:3px}.reel-position-0{left:14%;top:40%}.reel-position-2{left:86%;top:40%}.is-playing .is-selected{width:50%;max-height:85%;aspect-ratio:9/16}.reel-play{opacity:1}}
@media(max-width:520px){.reels-toolbar{align-items:flex-start;flex-direction:column;gap:12px}.reels-toolbar p{font-size:12px}.reel-stage{height:650px}.reel-titles h2,.reel-titles p{font-size:22px}.reel-card{width:45%;top:27%}.reel-position-0{left:10%;top:42%;transform:translateX(-50%) rotate(-24deg)}.reel-position-2{left:90%;top:42%;transform:translateX(-50%) rotate(24deg)}.is-playing .is-selected{width:70%;top:52%;transform:translate(-50%,-50%);max-height:80%}.reel-close{top:4%;right:5%;font-size:14px;padding:10px 18px}.reel-play{width:40px;height:40px;font-size:15px}.reel-number{font-size:13px;left:10px;bottom:10px}}
@media(prefers-reduced-motion:reduce){.reel-card,.reel-titles{transition:none}.is-previewing{transform:translateX(-50%)}}

.is-selected .reel-full{object-fit:contain}

.reels-touch-hint{display:none}
.reel-preview-prompt{display:none;position:absolute;left:8px;right:8px;bottom:42px;z-index:3;border-radius:12px;padding:8px 5px;text-align:center;background:#000b;color:#fff;pointer-events:none;font:12px/1.4 "CoFo Sans Arabic",Arial,sans-serif}
.is-touch-preview .reel-preview-prompt{display:block}
.is-selected .reel-preview-prompt{display:none}
@media(hover:none){.reels-hover-hint{display:none}.reels-touch-hint{display:inline}}