.layout-creator-reels>.layout-bg,.layout-creator-reels>.layout-inner{z-index:auto}.creator-reels{container-type:inline-size;margin-inline:auto;max-width:min(100%,var(--container-rfs-max-width));padding-block:48px;color:var(--color-text)}.creator-reels--scrollable{padding-bottom:0}.creator-reels__carousel{visibility:visible;touch-action:pan-y pinch-zoom}.creator-reels .splide__slide{width:300px;flex-shrink:0}.creator-reels__carousel:not(.is-initialized) .splide__track{overflow-x:auto}.creator-reels__carousel:not(.is-initialized) .splide__slide{margin-right:16px}.creator-reels__card{aspect-ratio:9 / 16;display:flex;align-items:center;justify-content:center;width:100%;overflow:hidden;background:var(--boring-mauve);color:var(--color-text);text-decoration:none}.creator-reels__poster{display:block;width:100%;height:100%;object-fit:cover}.creator-reels__card:focus-visible{outline:3px solid var(--color-focus);outline-offset:-3px}.creator-reels__carousel.is-static .splide__list{justify-content:center;transform:none!important}.creator-reels__carousel.is-static .splide__slide:last-child{margin-right:0!important}.creator-reels__scrollbar{position:relative;height:1px;margin:48px 24px 0}.creator-reels__scrollbar input{appearance:none;-webkit-appearance:none;position:absolute;inset:-12px 0 auto;width:100%;height:25px;margin:0;padding:0;border:0;background:transparent;cursor:pointer;touch-action:pan-y}.creator-reels__scrollbar input::-webkit-slider-runnable-track{height:1px;background:#18161659}.creator-reels__scrollbar input::-moz-range-track{height:1px;background:#18161659}.creator-reels__scrollbar input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:25%;height:1px;border:0;border-radius:0;background:var(--boring-black)}.creator-reels__scrollbar input::-moz-range-thumb{width:25%;height:1px;border:0;border-radius:0;background:var(--boring-black)}.creator-reels__scrollbar input:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}@media(min-width:860px){.creator-reels__scrollbar{margin-inline:32px}}.creator-reels__empty,.creator-reels__missing{padding:32px;background:var(--color-surface-alt)}.creator-reels__dialog{--reel-block-gap: 40px;--reel-top-gap: max(var(--reel-block-gap), env(safe-area-inset-top));--reel-bottom-gap: max(var(--reel-block-gap), env(safe-area-inset-bottom));position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:var(--reel-top-gap) 72px var(--reel-bottom-gap);border:0;background:transparent;color:#fff;overflow:hidden;font-family:var(--font-body)}.creator-reels__dialog[open]{display:flex;align-items:center;justify-content:center}.creator-reels__dialog::backdrop{background:#000000f2}.creator-reels__stage{position:relative;container-type:inline-size;height:auto;width:min(calc((100dvh - var(--reel-top-gap) - var(--reel-bottom-gap)) * 9 / 16),calc(100vw - 144px));aspect-ratio:9 / 16;max-width:100%;background:#000}.creator-reels__stage video{display:block;width:100%;height:100%;object-fit:contain}.creator-reels__dialog button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:10px;color:#fff;background:#000000bf;border:0;cursor:pointer}.creator-reels__dialog button svg{width:24px;height:24px;pointer-events:none}.creator-reels__dialog button:focus-visible{outline:2px solid white;outline-offset:2px}.creator-reels__dialog button:hover{background:#000000a6}.creator-reels__dialog .creator-reels__play{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;padding:0;background:transparent;touch-action:pan-x pinch-zoom}.creator-reels__dialog .creator-reels__play:hover{background:transparent}.creator-reels__actions button{background:transparent;width:32px;height:32px;padding:2px}.creator-reels__actions button:hover{background:transparent}.creator-reels__actions button svg{width:28px;height:28px}.creator-reels__actions button[aria-pressed] svg{width:24px;height:24px}.creator-reels__play svg{opacity:0}.creator-reels__play:hover svg,.creator-reels__play:focus-visible svg{opacity:1}.creator-reels__play[aria-label="Play video"] svg{opacity:1}.creator-reels__dialog .creator-reels__play svg{width:44px;height:44px;padding:10px;border:1px solid var(--boring-orange);color:var(--boring-black);background:var(--boring-orange)}.creator-reels__play:hover svg{border-color:var(--boring-mauve);background:var(--boring-mauve)}.creator-reels__play:focus-visible svg{outline:2px solid white;outline-offset:2px}.creator-reels__top{position:absolute;inset:4px 16px auto}.creator-reels__top:before{content:"";position:absolute;top:-4px;right:-16px;bottom:-32px;left:-16px;background:linear-gradient(to bottom,rgb(0 0 0 / 25%),transparent);pointer-events:none}.creator-reels__top>*{position:relative}.creator-reels__seek{display:block;appearance:none;-webkit-appearance:none;width:100%;height:28px;margin:0;border:0;padding:0;border-radius:0;background:transparent;cursor:pointer}.creator-reels__seek::-webkit-slider-runnable-track{height:4px;background:linear-gradient(to right,white var(--reel-progress, 0%),rgb(255 255 255 / 20%) var(--reel-progress, 0%))}.creator-reels__seek::-moz-range-track{height:4px;background:#fff3}.creator-reels__seek::-moz-range-progress{height:4px;background:#fff}.creator-reels__seek::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:10px;height:10px;margin-top:-3px;background:#fff;border-radius:50%;opacity:0}.creator-reels__seek::-moz-range-thumb{width:10px;height:10px;opacity:0}.creator-reels__seek:focus-visible{outline:2px solid white;outline-offset:1px}.creator-reels__seek:focus-visible::-webkit-slider-thumb,.creator-reels__seek:hover::-webkit-slider-thumb{opacity:1}.creator-reels__actions{display:flex;justify-content:flex-end;gap:6px;margin-top:-4px}.creator-reels__branding{display:block;flex:none;align-self:center;width:88px;height:auto;margin-right:auto;pointer-events:none;-webkit-user-select:none;user-select:none}.creator-reels__navigation{position:absolute;top:50%;right:-56px;display:flex;flex-direction:column;gap:16px;transform:translateY(-50%)}.creator-reels__navigation button{width:40px;height:40px;border:1px solid var(--boring-light-mauve);color:var(--boring-black);background:var(--boring-light-mauve)}.creator-reels__navigation button:hover{border-color:var(--boring-orange);background:var(--boring-orange)}.creator-reels__navigation .icon,.creator-reels__navigation button svg{display:block;width:18px;height:18px}.creator-reels__message{position:absolute;inset-inline:16px;bottom:48px;max-height:calc(100% - 112px);overflow-y:auto;padding:16px;background:#000000d9;font-size:16px;line-height:1.4}.creator-reels__message p{margin:0}.creator-reels__message button{width:auto;max-width:100%;height:auto;min-height:44px;padding:8px 16px;margin-top:12px;border:1px solid}.creator-reels__loading{position:absolute;bottom:24px;left:50%;transform:translate(-50%);padding:4px 8px;background:#000000bf;font-size:14px;max-width:calc(100% - 16px);text-align:center;pointer-events:none}.creator-reels__dialog--floating[open]{inset:auto max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) auto;width:250px;max-width:50.625dvh;max-height:90dvh;height:auto;aspect-ratio:9 / 16;padding:0;z-index:51;overflow:visible;box-shadow:0 4px 24px #00000040}.creator-reels__dialog--floating .creator-reels__stage{width:100%;height:100%}.creator-reels__dialog--floating .creator-reels__navigation{right:12px;gap:12px;opacity:0}.creator-reels__dialog--floating .creator-reels__navigation button{width:30px;height:30px;padding:6px}.creator-reels__dialog--floating .creator-reels__stage:hover .creator-reels__navigation,.creator-reels__dialog--floating .creator-reels__stage:focus-within .creator-reels__navigation{opacity:1}.creator-reels__dialog--floating .creator-reels__stage--message .creator-reels__navigation{top:auto;bottom:8px;flex-direction:row;transform:none;opacity:1}.creator-reels__dialog--floating .creator-reels__message{font-size:13px;inset-inline:8px}@container (max-width: 700px){.creator-reels .splide__slide{width:225px}}@media(max-width:700px)and (orientation:portrait){.creator-reels__dialog{padding:0}.creator-reels__stage{width:100%;height:100%;max-width:none;aspect-ratio:auto}.creator-reels__stage video{object-fit:cover}.creator-reels__top{padding-top:env(safe-area-inset-top)}.creator-reels__navigation{right:12px;gap:12px;opacity:0}.creator-reels__navigation button{width:30px;height:30px;padding:6px}.creator-reels__stage:hover .creator-reels__navigation,.creator-reels__stage:focus-within .creator-reels__navigation{opacity:1}}@media(max-width:700px){.creator-reels__dialog--floating[open]{width:175px;right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom))}.creator-reels__dialog--floating .creator-reels__stage{aspect-ratio:9 / 16}.creator-reels__dialog--floating .creator-reels__top{padding-top:0}}@container (max-width: 250px){.creator-reels__top{inset:-12px 8px auto}.creator-reels__seek{width:calc(100% + 16px);margin-inline:-8px}.creator-reels__actions{gap:4px}.creator-reels__actions button{width:28px;height:28px}.creator-reels__actions button svg{width:24px;height:24px}}@container (max-width: 200px){.creator-reels__branding{position:absolute;top:36px;left:0;width:64px}}@container (max-width: 140px){.creator-reels__dialog--floating .creator-reels__navigation{top:auto;bottom:8px;flex-direction:row;gap:8px;transform:none}}@media(max-height:450px)and (orientation:landscape){.creator-reels__dialog{--reel-block-gap: 15px}}@media(hover:none){.creator-reels__dialog--floating .creator-reels__navigation{display:none}}@media(hover:none)and (max-width:700px){.creator-reels__navigation{display:none}}.creator-reels__viewport{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.creator-reels__content{position:relative;width:100%;height:100%}.creator-reels__outgoing,.creator-reels__swipe-preview{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;pointer-events:none;background:#000}@media(max-width:700px)and (orientation:portrait){.creator-reels__outgoing,.creator-reels__swipe-preview{object-fit:cover}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/creator-reels.css.map */