react-riyils 1.0.0 → 2.0.0

package/dist/index.umd.css

@@ -1 +1 @@
-.react-riyils .swiper-slide{height:auto!important;opacity:.5!important;overflow:visible!important;transition:opacity .8s ease,transform .8s ease,width .8s ease!important;width:100px!important}.react-riyils .swiper-slide-active{opacity:1!important;width:220px!important}.react-riyils .swiper-wrapper{transition-timing-function:ease!important}@media (min-width:640px){.react-riyils .swiper-slide{opacity:.6!important;width:160px!important}.react-riyils .swiper-slide-active{max-width:none!important;opacity:1!important;width:280px!important}}@media (min-width:768px){.react-riyils .swiper-slide{opacity:.65!important;width:200px!important}.react-riyils .swiper-slide-active{opacity:1!important;width:340px!important}}@media (min-width:1024px){.react-riyils .swiper-slide{opacity:.7!important;width:220px!important}.react-riyils .swiper-slide-active{opacity:1!important;width:380px!important}}.react-riyils__slide-button{background:transparent;border:0;cursor:pointer;height:100%;margin:0;outline:none;padding:0;position:relative;transition:all .6s cubic-bezier(.4,0,.2,1);width:100%}.react-riyils__slide-button--inactive{opacity:1}.react-riyils__video-container{aspect-ratio:9/16;background:linear-gradient(135deg,#1e293b,#0f172a);border-radius:20px;height:100%;overflow:hidden;position:relative;transition:all .6s cubic-bezier(.4,0,.2,1);will-change:transform,box-shadow}.react-riyils__video-container--active{border-radius:24px;box-shadow:0 0 0 3px rgba(59,130,246,.5),0 0 20px rgba(59,130,246,.3),0 4px 12px -4px rgba(0,0,0,.2);transform:scale(.9);z-index:10}.react-riyils__video-container--inactive{border-radius:18px;box-shadow:0 4px 12px -4px rgba(0,0,0,.15);transform:scale(.75)}.react-riyils__video-container--inactive:before{background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.12));border-radius:inherit;content:"";inset:0;pointer-events:none;position:absolute;z-index:1}@media (min-width:768px){.react-riyils__video-container--active{border-radius:28px;box-shadow:0 0 0 4px rgba(59,130,246,.6),0 0 30px rgba(59,130,246,.4),0 6px 16px -6px rgba(0,0,0,.25);transform:scale(.9)}.react-riyils__video-container--inactive{border-radius:22px;box-shadow:0 5px 15px -5px rgba(0,0,0,.18);transform:scale(.72)}.react-riyils__video-container--inactive:hover{box-shadow:0 6px 18px -5px rgba(0,0,0,.2);transform:scale(.93)}.react-riyils__video-container--inactive:before{background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.1))}}.react-riyils__video{height:100%;object-fit:cover;transition:opacity .3s ease-out;width:100%}.react-riyils__loading{align-items:center;background:rgba(0,0,0,.2);display:flex;inset:0;justify-content:center;pointer-events:none;position:absolute;z-index:20}.react-riyils__spinner{animation:react-riyils-spin 1s linear infinite;border:3px solid hsla(0,0%,100%,.2);border-radius:50%;border-top-color:#fff;height:48px;width:48px}@keyframes react-riyils-spin{to{transform:rotate(1turn)}}.react-riyils__progress-container{backdrop-filter:blur(4px);background:hsla(0,0%,100%,.2);border-top-left-radius:inherit;border-top-right-radius:inherit;height:5px;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:20}.react-riyils__progress{appearance:none;background:transparent;border:none;height:100%;width:100%}.react-riyils__progress::-webkit-progress-bar{background:transparent}.react-riyils__progress::-webkit-progress-value{background:currentColor;box-shadow:0 0 8px currentColor;transition:width .15s linear}.react-riyils__progress::-moz-progress-bar{background:currentColor;box-shadow:0 0 8px currentColor;transition:width .15s linear}.react-riyils__overlay-gradient{background:linear-gradient(180deg,rgba(0,0,0,.08) 0,rgba(0,0,0,.15) 50%,rgba(0,0,0,.22));inset:0;position:absolute;transition:opacity .6s ease-out;z-index:2}.react-riyils__overlay-blur{background:rgba(0,0,0,.05);inset:0;position:absolute;transition:background .6s ease-out;z-index:2}.react-riyils__cta-container{background:linear-gradient(0deg,rgba(0,0,0,.95) 0,rgba(0,0,0,.75) 40%,transparent);border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;left:0;padding:40px 12px 12px;pointer-events:auto;position:absolute;right:0;will-change:transform;z-index:10}@media (min-width:768px){.react-riyils__cta-container{padding:50px 20px 20px}}.react-riyils__cta-button{align-items:center;background:transparent;border:0;cursor:pointer;display:flex;gap:8px;padding:0;transform-origin:left center;transition:all .4s cubic-bezier(.4,0,.2,1);will-change:transform}.react-riyils__cta-button:hover{gap:14px;transform:translateX(2px)}@media (min-width:768px){.react-riyils__cta-button{gap:12px}.react-riyils__cta-button:hover{gap:18px;transform:translateX(4px)}}.react-riyils__cta-badge{align-items:center;backdrop-filter:blur(16px);background:linear-gradient(135deg,hsla(0,0%,100%,.15),hsla(0,0%,100%,.08));border:1px solid hsla(0,0%,100%,.25);border-radius:9999px;box-shadow:0 4px 20px rgba(0,0,0,.3),inset 0 1px 0 hsla(0,0%,100%,.2);display:flex;gap:6px;padding:6px 12px;transition:all .4s cubic-bezier(.4,0,.2,1)}.react-riyils__cta-badge:hover{background:linear-gradient(135deg,hsla(0,0%,100%,.22),hsla(0,0%,100%,.12));border-color:hsla(0,0%,100%,.35);box-shadow:0 6px 25px rgba(0,0,0,.4),inset 0 1px 0 hsla(0,0%,100%,.3);transform:translateY(-2px)}@media (min-width:640px){.react-riyils__cta-badge{gap:8px;padding:8px 16px}}@media (min-width:768px){.react-riyils__cta-badge{gap:10px;padding:10px 20px}}.react-riyils__cta-icon{color:#fff;flex-shrink:0;height:10px;width:10px}@media (min-width:640px){.react-riyils__cta-icon{height:12px;width:12px}}@media (min-width:768px){.react-riyils__cta-icon{height:16px;width:16px}}.react-riyils__cta-text{color:#fff;font-size:10px;font-weight:600;letter-spacing:.05em;white-space:nowrap}@media (min-width:640px){.react-riyils__cta-text{font-size:12px}}@media (min-width:768px){.react-riyils__cta-text{font-size:14px}}.react-riyils__container{cursor:pointer;overflow:visible;padding:60px 0;position:relative;user-select:none}.react-riyils__container[data-height-mobile]{height:calc(var(--container-height-mobile)*1.08)}@media (min-width:768px){.react-riyils__container{padding:70px 0}.react-riyils__container[data-height-desktop]{height:calc(var(--container-height-desktop)*1.1)}}.react-riyils-viewer{background:#000;border:0;height:100%;inset:0;margin:0;max-height:none;max-width:none;padding:0;position:fixed;width:100%;z-index:50}.react-riyils-viewer__section{align-items:center;background:#000;display:flex;height:100%;justify-content:center;position:relative;width:100%}.react-riyils-viewer__interaction-area{background:transparent;border:0;cursor:default;inset:0;margin:0;padding:0;position:absolute}.react-riyils-viewer__video{height:auto;max-height:100%;max-width:100%;object-fit:contain;user-select:none;width:auto}.react-riyils-viewer__loading{align-items:center;display:flex;inset:0;justify-content:center;pointer-events:none;position:absolute}.react-riyils-viewer__loading-spinner{animation:react-riyils-spin 1s linear infinite;border:4px solid hsla(0,0%,100%,.2);border-radius:50%;border-top-color:#fff;height:64px;width:64px}.react-riyils-viewer__pause-indicator{align-items:center;display:flex;inset:0;justify-content:center;pointer-events:none;position:absolute}.react-riyils-viewer__pause-icon{align-items:center;background:rgba(0,0,0,.5);border-radius:50%;display:flex;height:80px;justify-content:center;width:80px}.react-riyils-viewer__pause-bars{border-left:12px solid transparent;border-right:12px solid transparent;height:40px;width:20px}.react-riyils-viewer__speed-indicator{pointer-events:none;position:absolute;right:32px;top:50%;transform:translateY(-50%)}.react-riyils-viewer__speed-badge{backdrop-filter:blur(4px);background:rgba(0,0,0,.6);border-radius:9999px;padding:8px 16px}.react-riyils-viewer__speed-text{color:#fff;font-size:18px;font-weight:700}.react-riyils-viewer__overlay{inset:0;pointer-events:none;position:absolute;z-index:50}.react-riyils-viewer__header{left:0;pointer-events:auto;position:absolute;right:0;top:0;z-index:50}.react-riyils-viewer__header-content{align-items:center;display:flex;justify-content:space-between;padding:16px}.react-riyils-viewer__progress-wrapper{flex:1;padding-right:16px}.react-riyils-viewer__progress-track{border-radius:9999px;height:2px;overflow:hidden}.react-riyils-viewer__progress-bar{height:100%;transition:all .1s linear}.react-riyils-viewer__close-button{backdrop-filter:blur(4px);background:rgba(0,0,0,.3);border:0;border-radius:9999px;color:#fff;cursor:pointer;flex-shrink:0;padding:8px;transition:background .3s}.react-riyils-viewer__close-button:hover{background:rgba(0,0,0,.5)}.react-riyils-viewer__close-icon{height:24px;width:24px}.react-riyils-viewer__swipe-tip{bottom:96px;left:50%;pointer-events:none;position:absolute;transform:translateX(-50%);z-index:40}.react-riyils-viewer__swipe-tip-content{align-items:center;backdrop-filter:blur(4px);background:rgba(0,0,0,.3);border-radius:9999px;display:flex;flex-direction:row;gap:16px;padding:12px 24px}.react-riyils-viewer__swipe-tip-text{color:hsla(0,0%,100%,.9);font-size:14px;font-weight:500}.react-riyils-viewer__swipe-tip-icon-wrapper{height:32px;position:relative;width:32px}.react-riyils-viewer__swipe-tip-icon{animation:react-riyils-bounce 1.5s infinite;height:32px;position:absolute;width:32px}.react-riyils-viewer__swipe-tip-icon--1{animation-delay:0ms;color:hsla(0,0%,100%,.9)}.react-riyils-viewer__swipe-tip-icon--2{animation-delay:.2s;color:hsla(0,0%,100%,.5);top:8px}.react-riyils-viewer__swipe-tip-icon--3{animation-delay:.4s;color:hsla(0,0%,100%,.2);top:16px}@keyframes react-riyils-bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:translateY(0)}}.react-riyils-viewer__mute-button-wrapper{bottom:24px;pointer-events:auto;position:absolute;right:24px;z-index:50}.react-riyils-viewer__mute-button{backdrop-filter:blur(4px);background:hsla(0,0%,100%,.1);border:0;border-radius:9999px;color:#fff;cursor:pointer;padding:12px;transition:background .3s}.react-riyils-viewer__mute-button:hover{background:hsla(0,0%,100%,.2)}.react-riyils-viewer__mute-icon{height:24px;width:24px}@media (min-width:640px){.react-riyils .swiper-slide{opacity:.65!important;width:140px!important}.react-riyils .swiper-slide-active{max-width:none!important;opacity:1!important;width:240px!important}}@media (min-width:768px){.react-riyils .swiper-slide{opacity:.7!important;width:190px!important}.react-riyils .swiper-slide-active{opacity:1!important;width:260px!important}}.react-riyils .swiper-button-next,.react-riyils .swiper-button-prev{display:none!important}@media (min-width:768px){.react-riyils .swiper-button-next,.react-riyils .swiper-button-prev{align-items:center!important;backdrop-filter:blur(24px)!important;background:linear-gradient(to bottom right,#fff,#fff,#f9fafb)!important;border:1px solid rgba(229,231,235,.6)!important;border-radius:9999px!important;box-shadow:0 8px 30px rgba(0,0,0,.12)!important;display:flex!important;height:48px!important;justify-content:center!important;transition:all .5s!important;width:48px!important}.react-riyils .swiper-button-next:hover,.react-riyils .swiper-button-prev:hover{background:linear-gradient(to bottom right,#fff,#fff)!important;box-shadow:0 20px 40px rgba(0,0,0,.18)!important;transform:scale(1.1)!important}.react-riyils .swiper-button-next:after,.react-riyils .swiper-button-prev:after{color:#374151!important;font-size:24px!important;font-weight:800!important}.react-riyils .swiper-button-prev{left:24px!important}.react-riyils .swiper-button-next{right:24px!important}}:root{--swiper-theme-color:#007aff}:host{display:block;margin-left:auto;margin-right:auto;position:relative;z-index:1}.swiper{display:block;list-style:none;margin-left:auto;margin-right:auto;overflow:hidden;padding:0;position:relative;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{box-sizing:content-box;display:flex;height:100%;position:relative;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);width:100%;z-index:1}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{display:block;flex-shrink:0;height:100%;position:relative;transition-property:transform;width:100%}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{backface-visibility:hidden;transform:translateZ(0)}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px;.swiper-cube-shadow,.swiper-slide{transform-style:preserve-3d}}.swiper-css-mode{>.swiper-wrapper{-ms-overflow-style:none;overflow:auto;scrollbar-width:none;&::-webkit-scrollbar{display:none}}>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}&.swiper-horizontal{>.swiper-wrapper{scroll-snap-type:x mandatory}}&.swiper-vertical{>.swiper-wrapper{scroll-snap-type:y mandatory}}&.swiper-free-mode{>.swiper-wrapper{scroll-snap-type:none}>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}}&.swiper-centered{>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}}&.swiper-centered.swiper-horizontal{>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}}&.swiper-centered.swiper-vertical{>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}>.swiper-wrapper:before{height:var(--swiper-centered-offset-after);min-width:1px;width:100%}}}.swiper-3d{.swiper-slide-shadow,.swiper-slide-shadow-bottom,.swiper-slide-shadow-left,.swiper-slide-shadow-right,.swiper-slide-shadow-top{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:10}.swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-slide-shadow-left{background-image:linear-gradient(270deg,rgba(0,0,0,.5),transparent)}.swiper-slide-shadow-right{background-image:linear-gradient(90deg,rgba(0,0,0,.5),transparent)}.swiper-slide-shadow-top{background-image:linear-gradient(0deg,rgba(0,0,0,.5),transparent)}.swiper-slide-shadow-bottom{background-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent)}}.swiper-lazy-preloader{border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top:4px solid transparent;box-sizing:border-box;height:42px;left:50%;margin-left:-21px;margin-top:-21px;position:absolute;top:50%;transform-origin:50%;width:42px;z-index:10}.swiper-watch-progress .swiper-slide-visible,.swiper:not(.swiper-watch-progress){.swiper-lazy-preloader{animation:swiper-preloader-spin 1s linear infinite}}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{align-items:center;color:var(--swiper-navigation-color,var(--swiper-theme-color));cursor:pointer;display:flex;height:var(--swiper-navigation-size);justify-content:center;position:absolute;width:var(--swiper-navigation-size);z-index:10;&.swiper-button-disabled{cursor:auto;opacity:.35;pointer-events:none}&.swiper-button-hidden{cursor:auto;opacity:0;pointer-events:none}.swiper-navigation-disabled &{display:none!important}svg{fill:currentColor;height:100%;object-fit:contain;pointer-events:none;transform-origin:center;width:100%}}.swiper-button-lock{display:none}.swiper-button-next,.swiper-button-prev{margin-top:calc(0px - var(--swiper-navigation-size)/2);top:var(--swiper-navigation-top-offset,50%)}.swiper-button-prev{left:var(--swiper-navigation-sides-offset,4px);right:auto;.swiper-navigation-icon{transform:rotate(180deg)}}.swiper-button-next{left:auto;right:var(--swiper-navigation-sides-offset,4px)}.swiper-horizontal{.swiper-button-next,.swiper-button-prev,~.swiper-button-next,~.swiper-button-prev{margin-left:0;margin-top:calc(0px - var(--swiper-navigation-size)/2);top:var(--swiper-navigation-top-offset,50%)}&.swiper-rtl .swiper-button-next,&.swiper-rtl~.swiper-button-next,&~.swiper-button-prev,.swiper-button-prev{left:var(--swiper-navigation-sides-offset,4px);right:auto}&.swiper-rtl .swiper-button-prev,&.swiper-rtl~.swiper-button-prev,&~.swiper-button-next,.swiper-button-next{left:auto;right:var(--swiper-navigation-sides-offset,4px)}&.swiper-rtl .swiper-button-next,&.swiper-rtl~.swiper-button-next,&~.swiper-button-prev,.swiper-button-prev{.swiper-navigation-icon{transform:rotate(180deg)}}&.swiper-rtl .swiper-button-prev,&.swiper-rtl~.swiper-button-prev{.swiper-navigation-icon{transform:rotate(0deg)}}}.swiper-vertical{.swiper-button-next,.swiper-button-prev,~.swiper-button-next,~.swiper-button-prev{left:var(--swiper-navigation-top-offset,50%);margin-left:calc(0px - var(--swiper-navigation-size)/2);margin-top:0;right:auto}.swiper-button-prev,~.swiper-button-prev{bottom:auto;top:var(--swiper-navigation-sides-offset,4px);.swiper-navigation-icon{transform:rotate(-90deg)}}.swiper-button-next,~.swiper-button-next{bottom:var(--swiper-navigation-sides-offset,4px);top:auto;.swiper-navigation-icon{transform:rotate(90deg)}}}
+:root{--rr-slide-width-mobile:220px;--rr-slide-width-desktop:300px;--rr-slide-height-mobile:400px;--rr-slide-height-desktop:540px;--rr-primary:#3b82f6;--rr-transition-bezier:cubic-bezier(0.25,0.1,0.25,1);--rr-safe-bottom:env(safe-area-inset-bottom,20px)}.react-riyils__container{align-items:center;background:transparent;display:flex;height:auto;justify-content:center;max-width:100%;overflow:hidden;padding:80px 0 120px;position:relative;width:100%}.react-riyils{height:auto;overflow:visible!important;padding:0!important;width:100%;z-index:1}.react-riyils .swiper-wrapper{align-items:center;overflow:visible}.react-riyils .swiper-slide{align-items:center;background-position:50%;background-size:cover;display:flex;height:var(--rr-slide-height-mobile);justify-content:center;transform-style:preserve-3d;transition:all .3s ease;width:var(--rr-slide-width-mobile)}.react-riyils .swiper-slide-active{z-index:20}.react-riyils__card{-webkit-backface-visibility:hidden;backface-visibility:hidden;background:#000;border-radius:24px;box-shadow:0 10px 20px rgba(0,0,0,.3);filter:brightness(.7);height:100%;overflow:hidden;position:relative;transform:translateZ(0);transition:filter .3s ease,box-shadow .3s ease,transform .3s ease;width:100%}.react-riyils__card.active{box-shadow:0 25px 50px -12px rgba(0,0,0,.6),0 0 0 1px hsla(0,0%,100%,.15);filter:brightness(1);transform:scale(1.05)}.react-riyils .swiper-slide-active .swiper-slide-shadow-coverflow,.react-riyils .swiper-slide-active .swiper-slide-shadow-left,.react-riyils .swiper-slide-active .swiper-slide-shadow-right{background:none!important;display:none!important;opacity:0!important}.swiper-slide-shadow-coverflow,.swiper-slide-shadow-left,.swiper-slide-shadow-right{background-image:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.6))!important;border-radius:24px!important;opacity:1!important}.react-riyils__video{display:block;height:100%;object-fit:cover;transform:translateZ(0);width:100%}.react-riyils__slide-button{all:unset;cursor:pointer;display:block;height:100%;position:relative;width:100%}.react-riyils__cta-container{bottom:24px;left:50%;opacity:0;pointer-events:none;position:absolute;transform:translateX(-50%) translateY(15px);transition:opacity .3s ease,transform .3s ease;width:max-content;z-index:30}.react-riyils__card.active .react-riyils__cta-container{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}.react-riyils__cta-button{align-items:center;backdrop-filter:blur(16px);background:hsla(0,0%,8%,.8);border:1px solid hsla(0,0%,100%,.2);border-radius:9999px;box-shadow:0 10px 25px rgba(0,0,0,.4);color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:8px;padding:12px 24px;transition:all .2s ease}.react-riyils__cta-button:hover{background:rgba(40,40,40,.9);border-color:hsla(0,0%,100%,.4);transform:scale(1.05)}@media (min-width:768px){.react-riyils__container{padding:100px 0 140px}.react-riyils .swiper-slide{height:var(--rr-slide-height-desktop);width:var(--rr-slide-width-desktop)}}.react-riyils-viewer{background:#000;background-color:#000;display:flex;flex-direction:column;height:100%;inset:0;left:0;overflow:hidden;position:fixed;top:0;touch-action:none;user-select:none;-webkit-user-select:none;width:100%;z-index:99999}.react-riyils-viewer__header{background:linear-gradient(180deg,rgba(0,0,0,.6) 0,transparent);left:0;padding:env(safe-area-inset-top,16px) 16px 16px;position:absolute;right:0;top:0;z-index:60}.react-riyils-viewer__progress-track{background:hsla(0,0%,100%,.2);border-radius:2px;height:2px;margin-bottom:0;overflow:hidden;width:100%}.react-riyils-viewer__progress-bar{background:#fff;border-radius:2px;height:100%;transition:width .1s linear}.react-riyils-viewer__close-button{align-items:center;backdrop-filter:blur(4px);background:hsla(0,0%,100%,.1);border:none;border-radius:50%;cursor:pointer;display:flex;height:36px;justify-content:center;position:absolute;right:24px;top:env(safe-area-inset-top,24px);transition:background .2s;width:36px}.react-riyils-viewer__close-button:hover{background:hsla(0,0%,100%,.2)}.react-riyils-viewer__gradient-top{background:linear-gradient(180deg,rgba(0,0,0,.7) 0,transparent);height:150px;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:40}.react-riyils-viewer__gradient-bottom{background:linear-gradient(0deg,rgba(0,0,0,.9) 0,rgba(0,0,0,.4) 50%,transparent);bottom:0;display:flex;flex-direction:column;justify-content:flex-end;left:0;padding:100px 16px env(safe-area-inset-bottom,20px);pointer-events:none;position:absolute;right:0;z-index:40}.react-riyils-viewer__btn{align-items:center;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:hsla(0,0%,100%,.15);border:1px solid hsla(0,0%,100%,.1);border-radius:50%;color:hsla(0,0%,100%,.9);cursor:pointer;display:flex;justify-content:center;pointer-events:auto;transition:all .2s ease}.react-riyils-viewer__btn:active{background:hsla(0,0%,100%,.25);transform:scale(.92)}.react-riyils-viewer__btn:hover{background:hsla(0,0%,100%,.2);color:#fff}.react-riyils-viewer__close-container{pointer-events:auto;position:absolute;right:24px;top:24px;top:env(safe-area-inset-top,24px);z-index:50}.react-riyils-viewer__btn-close{height:44px;width:44px}.react-riyils-viewer__controls-row{align-items:flex-end;display:flex;justify-content:flex-end;margin-bottom:16px;pointer-events:auto;width:100%}.react-riyils-viewer__btn-mute{height:48px;width:48px}.react-riyils-viewer__progress-container{background:hsla(0,0%,100%,.25);border-radius:4px;cursor:pointer;height:4px;margin-bottom:12px;overflow:hidden;pointer-events:auto;transition:height .3s ease;width:100%}.react-riyils-viewer__progress-container:hover{height:8px}.react-riyils-viewer__progress-fill{border-radius:4px;box-shadow:0 0 10px hsla(0,0%,100%,.7);height:100%;transition:width .1s linear}.react-riyils-viewer__gesture-grid{display:grid;grid-template-columns:25% 50% 25%;height:100%;inset:0;position:absolute;width:100%;z-index:30}.react-riyils-viewer__gesture-zone{-webkit-tap-highlight-color:transparent;appearance:none;-webkit-appearance:none;background:transparent;border:none;cursor:pointer;height:100%;margin:0;outline:none;padding:0;width:100%}.react-riyils-viewer__gesture-zone:active{background:hsla(0,0%,100%,.05)}@keyframes rr-fade-zoom-in{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes rr-fade-zoom-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}@keyframes rr-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.react-riyils-viewer__loader{animation:rr-spin 1s linear infinite;border:3px solid hsla(0,0%,100%,.2);border-radius:50%;border-top-color:#fff;height:32px;width:32px}.react-riyils-viewer__feedback-center{align-items:center;display:flex;inset:0;justify-content:center;pointer-events:none;position:absolute;z-index:35}.react-riyils-viewer__feedback-icon{align-items:center;backdrop-filter:blur(4px);background:rgba(0,0,0,.5);border-radius:50%;color:#fff;display:flex;justify-content:center;padding:20px}.react-riyils-viewer__feedback-icon.animate-in{animation:rr-fade-zoom-in .2s cubic-bezier(.175,.885,.32,1.275) forwards}.react-riyils-viewer__feedback-icon.animate-out{animation:rr-fade-zoom-out .5s ease forwards}.react-riyils-viewer__feedback-speed{align-items:center;backdrop-filter:blur(8px);background:rgba(0,0,0,.6);border:1px solid hsla(0,0%,100%,.1);border-radius:20px;color:#fff;display:flex;font-size:13px;font-weight:700;gap:6px;left:50%;opacity:0;padding:8px 16px;pointer-events:none;position:absolute;top:80px;transform:translateX(-50%);transition:opacity .3s,transform .3s;z-index:35}.react-riyils-viewer__feedback-speed.visible{opacity:1;transform:translateX(-50%) translateY(0)}.react-riyils-viewer__feedback-seek{align-items:center;display:flex;inset:0;pointer-events:none;position:absolute;z-index:35}.react-riyils-viewer__feedback-seek.left{justify-content:flex-start;padding-left:15%}.react-riyils-viewer__feedback-seek.right{justify-content:flex-end;padding-right:15%}.react-riyils-viewer__seek-circle{align-items:center;animation:rr-fade-zoom-in .2s cubic-bezier(.175,.885,.32,1.275) forwards;backdrop-filter:blur(8px);background:rgba(0,0,0,.6);border-radius:50%;color:#fff;display:flex;flex-direction:column;height:80px;justify-content:center;width:80px}.react-riyils-viewer__seek-text{font-size:11px;font-weight:700;margin-top:4px}.react-riyils-viewer__video{display:block;height:100%;object-fit:contain;width:100%}.react-riyils-viewer__slide{align-items:center;background:#000;display:flex;height:100%;justify-content:center;position:relative;width:100%}:root{--swiper-theme-color:#007aff}:host{display:block;margin-left:auto;margin-right:auto;position:relative;z-index:1}.swiper{display:block;list-style:none;margin-left:auto;margin-right:auto;overflow:hidden;padding:0;position:relative;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{box-sizing:content-box;display:flex;height:100%;position:relative;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);width:100%;z-index:1}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{display:block;flex-shrink:0;height:100%;position:relative;transition-property:transform;width:100%}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{backface-visibility:hidden;transform:translateZ(0)}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px;.swiper-cube-shadow,.swiper-slide{transform-style:preserve-3d}}.swiper-css-mode{>.swiper-wrapper{-ms-overflow-style:none;overflow:auto;scrollbar-width:none;&::-webkit-scrollbar{display:none}}>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}&.swiper-horizontal{>.swiper-wrapper{scroll-snap-type:x mandatory}}&.swiper-vertical{>.swiper-wrapper{scroll-snap-type:y mandatory}}&.swiper-free-mode{>.swiper-wrapper{scroll-snap-type:none}>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}}&.swiper-centered{>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}}&.swiper-centered.swiper-horizontal{>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}}&.swiper-centered.swiper-vertical{>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}>.swiper-wrapper:before{height:var(--swiper-centered-offset-after);min-width:1px;width:100%}}}.swiper-3d{.swiper-slide-shadow,.swiper-slide-shadow-bottom,.swiper-slide-shadow-left,.swiper-slide-shadow-right,.swiper-slide-shadow-top{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:10}.swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-slide-shadow-left{background-image:linear-gradient(270deg,rgba(0,0,0,.5),transparent)}.swiper-slide-shadow-right{background-image:linear-gradient(90deg,rgba(0,0,0,.5),transparent)}.swiper-slide-shadow-top{background-image:linear-gradient(0deg,rgba(0,0,0,.5),transparent)}.swiper-slide-shadow-bottom{background-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent)}}.swiper-lazy-preloader{border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top:4px solid transparent;box-sizing:border-box;height:42px;left:50%;margin-left:-21px;margin-top:-21px;position:absolute;top:50%;transform-origin:50%;width:42px;z-index:10}.swiper-watch-progress .swiper-slide-visible,.swiper:not(.swiper-watch-progress){.swiper-lazy-preloader{animation:swiper-preloader-spin 1s linear infinite}}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode{.swiper-wrapper:after{content:"";left:0;pointer-events:none;position:absolute;top:0}}.swiper-virtual.swiper-css-mode.swiper-horizontal{.swiper-wrapper:after{height:1px;width:var(--swiper-virtual-size)}}.swiper-virtual.swiper-css-mode.swiper-vertical{.swiper-wrapper:after{height:var(--swiper-virtual-size);width:1px}}