/* story viewer */
html.sv-lock,html.sv-lock body{overflow:hidden}
.sv{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;font-family:Tajawal,sans-serif}
.sv.open{display:flex;animation:svIn .25s ease-out}
@keyframes svIn{from{opacity:0}to{opacity:1}}
.sv-bg{position:absolute;inset:0;background:rgba(3,14,9,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.sv-stage{position:relative;width:100vw;height:100dvh;background:#000;overflow:hidden}
.sv-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.sv-bars{position:absolute;top:calc(10px + env(safe-area-inset-top));left:12px;right:12px;z-index:3;display:flex;gap:4px;direction:rtl}
.sv-bars i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.3);overflow:hidden}
.sv-bars s{display:block;height:100%;width:0;background:#fff}
.sv-top{position:absolute;top:calc(22px + env(safe-area-inset-top));left:10px;right:14px;z-index:3;display:flex;align-items:center;gap:6px;color:#fff}
.sv-n{flex:1;font-size:15px;font-weight:800;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.sv-b{width:44px;height:44px;border:0;border-radius:50%;background:rgba(0,0,0,.35);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.sv-b svg{width:22px;height:22px}
.sv-q{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:60px 20px calc(28px + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(0,0,0,.75));color:#fff;pointer-events:none}
.sv-q p{font-size:19px;font-weight:900;line-height:1.5;text-wrap:balance}
.sv-tap{position:absolute;top:80px;bottom:120px;z-index:1;width:30%;border:0;background:transparent;cursor:pointer}
.sv-prev{right:0}.sv-next{left:0}
.sv-arw{display:none}
.sv-b:focus-visible,.sv-arw:focus-visible,.sv-tap:focus-visible{outline:2px solid #3DD68C;outline-offset:2px}
@media (min-width:760px){
  .sv-stage{width:min(420px,calc((100dvh - 64px)*9/16));height:auto;aspect-ratio:9/16;border-radius:24px;box-shadow:0 40px 90px -30px rgba(0,0,0,.8)}
  .sv-arw{display:flex;position:relative;z-index:2;width:52px;height:52px;margin:0 24px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;align-items:center;justify-content:center;cursor:pointer;transition:background .2s}
  .sv-arw:hover{background:rgba(255,255,255,.26)}
  .sv-arw svg{width:24px;height:24px}
  .sv-arw[hidden]{visibility:hidden;display:flex}
  .sv-al{order:1}.sv-stage{order:2}.sv-ar{order:3}
}
@media (prefers-reduced-motion:reduce){.sv.open{animation:none}}