/* Large, consistent creative-app previews. */
.workspace-tour .tour-tabs{flex-wrap:nowrap}
.workspace-tour .tour-tabs button{padding-inline:23px}
.creative-carousel{min-width:0}
.carousel-choices{display:flex;justify-content:center;gap:8px;padding:22px 18px 0}
.carousel-choices button{display:flex;align-items:center;gap:9px;background:#f4f6fa;color:#64718a;border:1px solid transparent;border-radius:99px;padding:9px 15px;font-size:12px;font-weight:550;transition:background .18s,color .18s}
.carousel-choices img{border-radius:7px;width:25px;height:25px}
.carousel-choices button:hover{background:#eaf0ff;color:#175cff}
.carousel-choices button[aria-pressed=true]{color:#172c51;background:#fff;border-color:#cfdcf0;box-shadow:0 3px 12px #1637660d}
.carousel-slides{touch-action:pan-y}
.creative-slide .tour-caption{min-height:133px}
.creative-slide .tour-screen{aspect-ratio:16/9;border-bottom:1px solid #bccddd;border-radius:10px}
.creative-slide .screen-crop>img{top:-5.98958333%}
.full-editor{position:relative;margin:0 18px;aspect-ratio:var(--capture-ratio);overflow:hidden;background:#202124;border:1px solid #394150;border-radius:10px}
.full-editor>img{position:absolute;max-width:none;width:100%;height:auto;top:-9.51%;left:0}
.effects-editor>img{top:-9.36%}
.photos-editor{max-height:none}
.carousel-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:17px 24px 20px}
.carousel-note{font-size:10px;color:#728097;line-height:1.6}
.carousel-controls{display:flex;align-items:center;gap:15px;flex-shrink:0}
.carousel-controls>span{font-size:11px;letter-spacing:1px;color:#63738a;min-width:33px;text-align:center}
.carousel-arrow{width:37px;height:37px;border-radius:50%;background:#f1f4f9;color:#223b63;font-size:20px}
.carousel-arrow:hover{background:#175cff;color:white}
.effect-preview-demo{position:absolute;left:33.8%;top:21.54%;width:32.42%;height:30.9%;overflow:hidden}
.effect-preview-demo .motion-demo{width:100%;height:100%;border-radius:0;aspect-ratio:auto}
.effect-preview-demo .motion-caption{font-size:clamp(7px,1.35vw,17px)}
.effect-preview-demo .motion-keyframes{bottom:7%}
.creative-card{overflow:hidden;padding-top:0!important}
.creative-demo-wrap{position:relative;margin:0 -27px 26px;flex-shrink:0;align-self:stretch;width:calc(100% + 54px)}
.motion-demo{width:100%;aspect-ratio:1.43;overflow:hidden;position:relative;isolation:isolate;background:#111526;container-type:inline-size}
.demo-example-label{position:absolute;left:15px;bottom:12px;color:#c1c8e4;font-size:7px;font-weight:600;letter-spacing:1.5px;z-index:5}
.demo-toggle{position:absolute;right:12px;bottom:9px;width:30px;height:30px;border-radius:50%;background:#ffffff19;border:1px solid #ffffff32;color:#fff;z-index:5;backdrop-filter:blur(8px);font-size:12px}
.demo-toggle:hover{background:#ffffff35}
.creative-card .creative-icon{width:58px;height:58px;margin-bottom:17px}
.creative-card .feature-status{position:static;align-self:flex-start;margin-bottom:17px}
.creative-card h3{font-size:27px}
.demo-effects{background:radial-gradient(ellipse at 46% 20%,#4d2920,#251c21 65%,#161a27);color:#fff}
.bounce-floor{position:absolute;left:14%;right:14%;bottom:23%;height:1px;background:linear-gradient(90deg,transparent,#e6a77b77,transparent)}
.bounce-travel{position:absolute;left:calc(50% - 8%);top:calc(77% - 16cqw);width:16%;aspect-ratio:1;animation:ball-bounce 2s cubic-bezier(.36,0,.66,1) infinite;will-change:transform}
.bounce-ball{width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 32% 25%,#ffe8b9 0%,#ffb956 26%,#f17b25 58%,#c03d15 85%,#7c2519);box-shadow:inset -3px -5px 10px #79351833,0 0 24px #ff993021;animation:ball-squash 2s linear infinite}
.bounce-shadow{position:absolute;left:38%;width:24%;height:6%;bottom:21%;border-radius:50%;background:#04060c88;filter:blur(4px);animation:ball-shadow 2s ease-in-out infinite}
.motion-caption{position:absolute;left:8%;top:9%;font-size:5.2cqw;font-weight:550;line-height:1.2;letter-spacing:-.5px;color:#ffe5cf}
.motion-keyframes{position:absolute;left:33%;right:33%;bottom:10%;display:flex;align-items:center;justify-content:center;gap:6px}
.motion-keyframes i{width:5px;height:5px;border:1px solid #ffb76d;transform:rotate(45deg)}
.motion-keyframes span{height:1px;background:#b6815766;flex:1}
@keyframes ball-bounce{0%,100%{transform:translateY(-140%)}50%{transform:translateY(0)}}
@keyframes ball-squash{0%,35%,65%,100%{transform:scale(1)}46%{transform:scale(.87,1.13)}50%{transform:scale(1.22,.78)}55%{transform:scale(.9,1.1)}}
@keyframes ball-shadow{0%,100%{transform:scale(.55);opacity:.22}50%{transform:scale(1);opacity:.8}}
.demo-photos{background:radial-gradient(ellipse at 30% 20%,#193d65,#0e213c 75%)}
.photo-demo-canvas{position:absolute;left:9%;top:9%;width:69%;height:72%;border:1px solid #ffffff40;box-shadow:0 10px 23px #0004;overflow:hidden}
.photo-demo-canvas>img{width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
.photo-grade{position:absolute;inset:0;background:linear-gradient(145deg,#fc997680,#d8561115 45%,#02657a88);mix-blend-mode:color;animation:photo-grade 6s ease-in-out infinite}
.photo-type{position:absolute;left:11%;top:15%;font-size:12cqw;font-weight:750;line-height:.91;letter-spacing:-.08em;color:#fff;animation:photo-title 6s ease-in-out infinite;text-shadow:0 1px 15px #17365f35}
.photo-type span{display:block;font-size:2cqw;letter-spacing:.28em;line-height:1;margin:18px 0 0 4px}
.photo-selection{position:absolute;inset:12% 17% 39% 8%;border:1px solid #84caff;animation:photo-selection 6s ease-in-out infinite}
.photo-selection i{position:absolute;width:5px;height:5px;background:#d0efff;border:1px solid #257ced}
.photo-selection i:nth-child(1){top:-3px;left:-3px}.photo-selection i:nth-child(2){top:-3px;right:-3px}.photo-selection i:nth-child(3){bottom:-3px;left:-3px}.photo-selection i:nth-child(4){bottom:-3px;right:-3px}
.demo-layer-stack{position:absolute;right:7%;bottom:25%;display:grid;gap:5px;width:30%;font-size:2.3cqw;perspective:600px}
.demo-layer-stack>span{display:flex;align-items:center;gap:6px;background:#213552ed;color:#dceaff;border:1px solid #accfff33;border-radius:5px;padding:9px 8px;box-shadow:0 6px 16px #0003;animation:layer-build 6s ease-in-out infinite}
.demo-layer-stack>span:nth-child(2){animation-delay:-.3s}.demo-layer-stack>span:nth-child(3){animation-delay:-.6s}
.demo-layer-stack i{width:12px;height:12px;background:#48a3fa;border-radius:2px}.demo-layer-stack>span:first-child i{background:#f6d8b5}.demo-layer-stack>span:nth-child(2) i{background:linear-gradient(45deg,#ffaf77,#74bad2)}
@keyframes photo-grade{0%,12%,100%{opacity:0}35%,85%{opacity:1}}
@keyframes photo-title{0%,25%,100%{opacity:0;transform:translateY(12px)}40%,85%{opacity:1;transform:translateY(0)}}
@keyframes photo-selection{0%,33%,82%,100%{opacity:0}42%,68%{opacity:1}}
@keyframes layer-build{0%,8%,100%{opacity:.2;transform:translateX(14px)}30%,85%{opacity:1;transform:translateX(0)}}
.demo-studio{background:radial-gradient(ellipse at 50% 20%,#3f2e62,#181727 80%)}
.video-demo-view{position:absolute;left:12%;top:8%;width:76%;height:47%;overflow:hidden;border-radius:5px;box-shadow:0 10px 20px #0005}
.video-demo-view img{width:100%;height:100%;object-fit:cover;animation:video-pan 7s ease-in-out infinite}
.video-demo-title{position:absolute;left:7%;bottom:12%;font-size:4.2cqw;line-height:1.13;letter-spacing:-.4px;color:#fff;text-shadow:0 2px 12px #162539;font-weight:450;animation:video-title 7s ease-in-out infinite}
.video-demo-title b{font-weight:700}
.demo-timeline{position:absolute;left:8%;right:8%;top:61%;height:26%;background:#12121caa;border-radius:4px;padding:5px 8px}
.demo-ruler{display:flex;justify-content:space-between;font:1.7cqw ui-monospace,monospace;color:#8990ae;margin-bottom:6px}
.demo-track{height:22%;margin-bottom:3px;border-radius:2px;position:relative;overflow:hidden}
.demo-track>span{font-size:1.6cqw;line-height:1;position:absolute;left:7px;top:23%;white-space:nowrap}
.text-track{background:#b782dd;width:58%;color:#24163d}
.video-track{background:#5977b5;width:89%;color:#e9efff;animation:clip-trim 7s ease-in-out infinite;border-right:3px solid #cfb6ff}
.audio-track{background:#306861;width:95%}
.audio-track span{inset:16% 4%;background:repeating-linear-gradient(90deg,#85d8bd88 0 1px,transparent 1px 3px);clip-path:polygon(0 45%,4% 25%,7% 40%,10% 0,15% 30%,22% 10%,26% 40%,31% 0,39% 30%,45% 10%,50% 20%,57% 0,65% 30%,71% 10%,76% 35%,81% 0,89% 20%,95% 35%,100% 40%,100% 60%,95% 65%,89% 80%,81% 100%,76% 65%,71% 90%,65% 70%,57% 100%,50% 80%,45% 90%,39% 70%,31% 100%,26% 60%,22% 90%,15% 70%,10% 100%,7% 60%,4% 75%,0 55%)}
.demo-playhead{position:absolute;top:19%;bottom:0;left:4%;width:1px;background:#ede9ff;box-shadow:0 0 3px #fff;animation:playhead-sweep 7s linear infinite}
.demo-playhead:before{content:"";position:absolute;top:-4px;left:-3px;border-top:5px solid #fff;border-left:3px solid transparent;border-right:3px solid transparent}
@keyframes video-pan{0%,100%{transform:scale(1)}50%,80%{transform:scale(1.12) translateX(-2%)}}
@keyframes video-title{0%,15%,95%,100%{opacity:0;transform:translateY(9px)}25%,85%{opacity:1;transform:translateY(0)}}
@keyframes clip-trim{0%,15%,100%{width:89%}35%,85%{width:72%}}
@keyframes playhead-sweep{0%,10%{left:4%}90%,100%{left:94%}}
.is-paused *, .motion-demo.is-offscreen *{animation-play-state:paused!important}
.duo-section{padding-top:90px;padding-bottom:55px;scroll-margin-top:98px}
.duo-section .duo-stage{margin:0;height:540px;border-radius:26px;gap:10%;padding-top:35px}
.duo-section .duo-folded{max-width:220px;width:23%}.duo-section .duo-expanded{max-width:510px;width:49%}
@media(min-width:1001px){.creative-demo-wrap{margin-inline:-27px}}
@media(max-width:1000px){.creative-demo-wrap{margin-inline:-20px;width:calc(100% + 40px)}.creative-card h3{font-size:23px}.demo-layer-stack>span{padding:6px}.duo-section .duo-stage{height:430px}.workspace-tour .tour-tabs button{padding-inline:16px}}
@media(max-width:700px){
 .workspace-tour .tour-tabs{display:flex;flex-wrap:wrap;gap:3px}
 .workspace-tour .tour-tabs button{padding:10px 8px;flex-direction:row;gap:5px;font-size:10px}
 .workspace-tour .tour-tabs svg{width:15px;height:15px}
 .carousel-choices{gap:4px;padding:15px 6px 0}
 .carousel-choices button{font-size:10px;padding:7px 9px;gap:5px}
 .carousel-choices img{width:20px;height:20px;border-radius:5px}
 .creative-slide .tour-caption{min-height:180px;padding:22px 17px;gap:13px}
 .creative-slide .tour-caption h3{font-size:23px}
 .creative-slide .tour-caption>p{font-size:12px}
 .full-editor{margin-inline:7px;border-radius:6px}
 .carousel-footer{padding:13px 12px;gap:15px}
 .carousel-note{font-size:8px;max-width:165px}
 .carousel-controls{gap:9px}.carousel-arrow{width:32px;height:32px}
 .creative-demo-wrap{margin-inline:-28px;margin-bottom:26px;width:calc(100% + 56px)}
 .creative-card .feature-status{position:static;transform:none;display:inline-block}
 .creative-card h3{font-size:29px}
 .duo-section{padding-top:65px;padding-bottom:30px}
 .duo-section .duo-stage{height:auto;min-height:260px;padding:28px 5% 42px;gap:8%}
 .duo-section .duo-folded{width:27%;max-width:150px}.duo-section .duo-expanded{width:55%}
 .duo-section .stage-note{font-size:8px;bottom:12px}
 .duo-section .duo-view figcaption b{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.motion-demo *{animation:none!important}.photo-type{opacity:1}.photo-grade{opacity:.8}.photo-selection{opacity:0}.demo-toggle{display:none}}

.preview-motion-toggle{width:32px;height:32px;border-radius:50%;background:#fff2e4;color:#935026;font-size:14px}.preview-motion-toggle:hover{background:#ffe1c1}

/* One fixed 16:9 screen, with a real draggable strip and automatic rotation. */
.carousel-slides{overflow:hidden;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.carousel-slides:active{cursor:grabbing}
.carousel-track{display:flex;align-items:stretch;transform:translate3d(calc(var(--slide,0)*-100% + var(--drag,0px)),0,0);transition:transform .65s cubic-bezier(.22,.72,.2,1);will-change:transform}
.carousel-track.is-dragging{transition:none}
.carousel-track .creative-slide{display:block!important;flex:0 0 100%;min-width:0}
.carousel-track .creative-slide .tour-screen,.carousel-track .full-editor{aspect-ratio:16/9;width:calc(100% - 36px);margin:0 18px;height:auto;border-radius:10px}
.carousel-track img{pointer-events:none;-webkit-user-drag:none}
.carousel-track .full-editor>img{width:100%;height:100%;top:0;left:0;object-fit:cover}
.carousel-auto{width:34px;height:34px;border-radius:50%;background:#edf3ff;color:#2b64d7;font-size:13px;cursor:pointer}
.carousel-auto:hover{background:#dce8ff}.carousel-auto[aria-pressed=true]{background:#f2f4f8;color:#6b7990}
@media(max-width:700px){.carousel-track .creative-slide .tour-screen,.carousel-track .full-editor{width:calc(100% - 14px);margin-inline:7px}.carousel-controls{gap:6px}}
@media(prefers-reduced-motion:reduce){.carousel-track{transition:none}}

/* Preserve the entire captured desktop, including the menu bar and Dock. */
.effect-preview-demo{left:37.27%;top:24.73%;width:25.41%;height:26.18%}
.effect-preview-demo .motion-caption{font-size:clamp(6px,1.05vw,13px)}