.composer-types.has-visual-story{grid-template-columns:repeat(4,minmax(0,1fr))}.composer-types.has-visual-story svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}.composer-types [data-composer-mode="visual-story"] .visual-story-composer-icon{width:24px;height:24px;color:#08715d;stroke:#08715d;stroke-width:1.9;filter:drop-shadow(0 2px 3px rgba(8,113,93,.2))}.composer-types [data-composer-mode="visual-story"] .visual-story-play-mark{fill:#08715d;stroke:#08715d}.composer-types [data-composer-mode="visual-story"]:hover .visual-story-composer-icon{color:#02372e;stroke:#02372e;transform:scale(1.06)}
.visual-story-editor{margin:12px 0;padding:16px;border:1px solid #cbded7;border-radius:16px;background:#f7fbf9;color:#173a34}.visual-story-editor[hidden]{display:none!important}.visual-story-editor>header{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:14px}.visual-story-editor>header div{display:grid;gap:3px}.visual-story-editor>header b{color:#02372e;font-size:17px}.visual-story-editor>header small{color:#64756f}.visual-story-editor>header button,.visual-scene-card header button{border:0;background:transparent;color:#61736e;cursor:pointer}.visual-story-editor>header button{font-size:25px}.visual-story-settings,.visual-scene-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.visual-story-editor label{display:grid;gap:5px;color:#3c5750;font-size:11px;font-weight:800}.visual-story-editor select,.visual-story-editor textarea,.visual-story-editor input[type=file]{width:100%;min-width:0}
.visual-scene-list{display:grid;gap:8px;margin:10px 0}.visual-scene-card{padding:9px;border:1px solid #d8e5e0;border-radius:12px;background:#fff}.visual-scene-card>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.visual-scene-card>header div{display:flex}.visual-scene-card header button{width:27px;height:25px;border-radius:7px;font-size:14px}.visual-scene-card header button:hover{background:#eef6f3}.visual-scene-card textarea{min-height:48px;resize:vertical}.visual-scene-grid{grid-template-columns:minmax(170px,1.5fr) repeat(4,minmax(92px,.7fr));align-items:end;gap:7px;margin-top:7px}.visual-scene-grid label{align-content:end}.visual-scene-grid input,.visual-scene-grid select{min-height:34px;padding-block:5px;font-size:11px}.visual-story-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.visual-story-actions>span{margin-inline-start:auto;color:#08715d;font-size:11px;font-weight:800}.visual-story-editor.over-limit .visual-story-actions>span{color:#b42318}.visual-story-preview{display:grid;place-items:center;margin-top:10px;padding:8px;border-radius:13px;background:#dfeae6}
.visual-story-player{position:relative;width:min(100%,520px);margin:12px auto;overflow:hidden;border-radius:18px;background:#02372e;box-shadow:0 10px 30px rgba(2,55,46,.18);isolation:isolate}.visual-story-player.ratio-9-16{aspect-ratio:9/16;max-height:72vh}.visual-story-player.ratio-1-1{aspect-ratio:1}.visual-story-player.ratio-16-9{aspect-ratio:16/9;width:100%;max-width:none}.visual-story-stage,.visual-story-scene{position:absolute;inset:0}.visual-story-scene{margin:0;overflow:hidden;opacity:0;visibility:hidden;transform:scale(1.02);transition:opacity .7s ease,transform .7s ease}.visual-story-scene.active{z-index:2;opacity:1;visibility:visible;transform:none}.visual-story-scene img,.visual-story-scene video{width:100%;height:100%;object-fit:cover}.visual-story-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.56))}.visual-story-scene figcaption{position:absolute;z-index:2;right:8%;bottom:14%;left:8%;color:#fff;font-size:clamp(20px,5vw,38px);font-weight:850;line-height:1.3;text-align:center;text-shadow:0 2px 12px rgba(0,0,0,.45);white-space:pre-wrap}.visual-story-scene.active .effect-fade-up{animation:story-fade-up .7s both}.visual-story-scene.active .effect-zoom-in{animation:story-zoom .75s both}.visual-story-scene.active .effect-slide-left{animation:story-slide .7s both}.visual-story-scene.active .effect-slide-right{animation:story-slide-right .7s both}.visual-story-scene.active .effect-typewriter{overflow:hidden;white-space:nowrap;animation:story-type 1.5s steps(24,end) both}.visual-story-scene.active .effect-bounce-in{animation:story-bounce .85s both}.visual-story-scene.active .effect-blur-in{animation:story-blur-in .85s both}.visual-story-scene.active .effect-rotate-in{animation:story-rotate .75s both}.visual-story-scene.active .effect-reveal{animation:story-text-reveal .9s both}.transition-zoom.active img,.transition-zoom.active video,.transition-pan.active img,.transition-pan.active video{animation:story-ken-burns 8s ease-out both}.transition-wipe.active{clip-path:inset(0);animation:story-wipe .65s ease both}.transition-flip.active{transform-origin:center;animation:story-flip .7s ease both}.transition-blur.active{animation:story-scene-blur .7s ease both}.transition-circle.active{animation:story-circle .75s ease both}
.visual-story-controls{position:absolute;z-index:5;right:12px;bottom:12px;left:12px;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:9px;padding:8px 10px;border-radius:999px;background:rgba(0,30,25,.68);color:#fff;backdrop-filter:blur(6px)}.visual-story-controls button{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:#c49439;color:#02372e}.visual-story-controls>div{height:3px;overflow:hidden;border-radius:4px;background:rgba(255,255,255,.25)}.visual-story-controls i{display:block;width:0;height:100%;background:#fff}.visual-story-controls span{font-size:10px;font-weight:800}.visual-story-controls .visual-story-fullscreen{background:rgba(255,255,255,.18);color:#fff}.visual-story-fullscreen svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.visual-story-player:fullscreen,.visual-story-player:-webkit-full-screen,.visual-story-player.visual-story-pseudo-fullscreen{width:100vw!important;max-width:none!important;height:100vh!important;height:100dvh!important;max-height:none!important;margin:0!important;border-radius:0!important;background:#000}.visual-story-player.visual-story-pseudo-fullscreen{position:fixed!important;z-index:30000!important;inset:0!important;aspect-ratio:auto!important}.visual-story-player:fullscreen .visual-story-controls,.visual-story-player:-webkit-full-screen .visual-story-controls,.visual-story-player.visual-story-pseudo-fullscreen .visual-story-controls{right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));left:max(14px,env(safe-area-inset-left))}.visual-story-player-fullscreen-open{overflow:hidden!important}
@keyframes story-progress{to{width:100%}}@keyframes story-fade-up{from{opacity:0;transform:translateY(28px)}}@keyframes story-zoom{from{opacity:0;transform:scale(.72)}}@keyframes story-slide{from{opacity:0;transform:translateX(45px)}}@keyframes story-slide-right{from{opacity:0;transform:translateX(-45px)}}@keyframes story-type{from{width:0}to{width:84%}}@keyframes story-bounce{0%{opacity:0;transform:scale(.6)}65%{transform:scale(1.1)}100%{opacity:1;transform:scale(1)}}@keyframes story-blur-in{from{opacity:0;filter:blur(18px);transform:scale(1.08)}}@keyframes story-rotate{from{opacity:0;transform:rotate(-7deg) scale(.78)}}@keyframes story-text-reveal{from{opacity:0;clip-path:inset(0 100% 0 0)}}@keyframes story-ken-burns{from{transform:scale(1)}to{transform:scale(1.1) translate3d(-2%,-1%,0)}}@keyframes story-wipe{from{clip-path:inset(0 100% 0 0)}}@keyframes story-flip{from{opacity:0;transform:perspective(900px) rotateY(75deg)}}@keyframes story-scene-blur{from{opacity:0;filter:blur(22px);transform:scale(1.08)}}@keyframes story-circle{from{clip-path:circle(0 at 50% 50%)}to{clip-path:circle(75% at 50% 50%)}}
.story-library-button{margin-top:5px;padding:7px 9px;border:1px solid #b8d2c9;border-radius:9px;background:#eef7f4;color:#075f50;font-size:11px;font-weight:800}.story-media-library{margin-top:14px;padding:14px;border:1px solid #c9ddd6;border-radius:14px;background:#fff}.story-media-library[hidden]{display:none!important}.story-media-library>header{display:flex;justify-content:space-between;gap:12px}.story-media-library>header div{display:grid;gap:3px}.story-media-library>header button{border:0;background:none;font-size:24px}.story-media-library [data-story-library-search]{display:grid;grid-template-columns:minmax(150px,1fr) auto auto auto;gap:8px;margin:12px 0}.story-media-library input,.story-media-library select{min-width:0}.story-library-status{min-height:22px;color:#64756f;font-size:12px}.story-library-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:430px;overflow:auto;filter: invert(1) hue-rotate(300deg);}.story-library-results button{display:grid;gap:5px;padding:5px;border:1px solid #dce8e3;border-radius:10px;background:#fff;text-align:start}.story-library-results button:hover{border-color:#08715d}.story-library-results button>span{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;border-radius:7px;background:#dce8e3;color:#fff;font-size:26px}.story-library-results img{position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover}.story-library-results small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.story-media-library>footer{margin-top:9px;color:#64756f;font-size:10px}
@media(max-width:700px){.composer-types.has-visual-story{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-story-editor{padding:12px}.visual-story-settings,.visual-scene-grid{grid-template-columns:1fr 1fr}.visual-scene-grid label:first-child{grid-column:1/-1}.visual-story-player.ratio-9-16{width:min(100%,390px);max-height:68vh}.visual-story-scene figcaption{font-size:clamp(20px,7vw,32px)}.story-media-library [data-story-library-search]{grid-template-columns:1fr 1fr}.story-media-library [data-story-library-search] input{grid-column:1/-1}.story-library-results{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.visual-story-scene,.visual-story-scene>img:not(.visual-story-overlay),.visual-story-scene>video{transition-duration:.2s!important}}
.post.has-visual-story>.post-media,.post.has-visual-story>.post-slideshow{display:none!important}
.visual-story-scene.outgoing{z-index:1;opacity:1;visibility:visible;transform:none}.visual-story-scene.active{z-index:2}.visual-story-scene.transition-slide.active{animation:story-scene-slide .7s ease both}.visual-story-scene.transition-pan.active{animation:story-scene-pan .75s ease both}@keyframes story-scene-slide{from{opacity:1;transform:translateX(100%)}}@keyframes story-scene-pan{from{opacity:.8;transform:translateX(8%) scale(1.04)}}
.visual-story-overlay{position:absolute!important;z-index:1;right:7%;bottom:8%;width:min(38%,190px)!important;height:auto!important;max-height:44%;object-fit:contain!important;filter:drop-shadow(0 8px 12px rgba(0,0,0,.3));animation:story-overlay-in .9s cubic-bezier(.16,1,.3,1) both}.visual-story-scene figcaption{will-change:transform,opacity,filter;transform-origin:center bottom;animation-duration:.9s!important;animation-timing-function:cubic-bezier(.16,1,.3,1)!important}.visual-story-scene.outgoing figcaption{opacity:0;transform:translateY(-12px);transition:opacity .28s ease,transform .28s ease}@keyframes story-overlay-in{from{opacity:0;transform:translateY(24px) scale(.84)}to{opacity:1;transform:none}}.story-library-more{display:block;margin:10px auto}.story-library-button.overlay{background:#f8f2ff;border-color:#d8c6ec;color:#673c89}
.visual-story-inline-editor{margin:12px 0}.visual-story-inline-editor .edit-media-retained input[type=file],.visual-story-inline-editor .edit-media-retained .story-library-button,.visual-story-inline-editor .edit-media-retained small{display:none}.visual-story-inline-editor .edit-media-retained:after{content:"Existing media retained";display:block;padding:8px;border-radius:8px;background:#eef6f3;color:#55716a;font-size:10px}.visual-story-scene figcaption:empty{display:none}
html[lang="ar"] .visual-story-inline-editor .edit-media-retained:after{content:"سيتم الاحتفاظ بالوسائط الحالية"}
.visual-story-scene.outgoing figcaption.exit-fade-out{opacity:0;transform:none}.visual-story-scene.outgoing figcaption.exit-slide-up-out{opacity:0;transform:translateY(-44px)}.visual-story-scene.outgoing figcaption.exit-zoom-out{opacity:0;transform:scale(.72)}.visual-story-scene.outgoing figcaption.exit-blur-out{opacity:0;filter:blur(15px);transform:scale(1.04)}.visual-story-scene.outgoing figcaption.exit-none{opacity:1;transform:none;filter:none}.visual-story-overlay.overlay-float-in{animation:story-overlay-in .9s cubic-bezier(.16,1,.3,1) both}.visual-story-overlay.overlay-pop-in{animation:story-overlay-pop .7s cubic-bezier(.16,1,.3,1) both}.visual-story-overlay.overlay-slide-in{animation:story-overlay-slide .8s cubic-bezier(.16,1,.3,1) both}.visual-story-overlay.overlay-rotate-in{animation:story-overlay-rotate .85s cubic-bezier(.16,1,.3,1) both}.visual-story-overlay.overlay-drift{animation:story-overlay-drift 4s ease-in-out infinite alternate}.visual-story-overlay.overlay-none{animation:none}@keyframes story-overlay-pop{from{opacity:0;transform:scale(.35)}70%{transform:scale(1.08)}to{opacity:1;transform:scale(1)}}@keyframes story-overlay-slide{from{opacity:0;transform:translateX(70px)}to{opacity:1;transform:none}}@keyframes story-overlay-rotate{from{opacity:0;transform:rotate(-24deg) scale(.6)}to{opacity:1;transform:none}}@keyframes story-overlay-drift{from{transform:translate3d(-7px,4px,0) rotate(-1deg)}to{transform:translate3d(8px,-8px,0) rotate(1deg)}}
.visual-story-overlay{animation:none}.visual-story-scene.active .visual-story-overlay.overlay-float-in{animation:story-overlay-in .9s cubic-bezier(.16,1,.3,1) both}.visual-story-scene.active .visual-story-overlay.overlay-pop-in{animation:story-overlay-pop .7s cubic-bezier(.16,1,.3,1) both}.visual-story-scene.active .visual-story-overlay.overlay-slide-in{animation:story-overlay-slide .8s cubic-bezier(.16,1,.3,1) both}.visual-story-scene.active .visual-story-overlay.overlay-rotate-in{animation:story-overlay-rotate .85s cubic-bezier(.16,1,.3,1) both}.visual-story-scene.active .visual-story-overlay.overlay-drift{animation:story-overlay-drift 4s ease-in-out infinite alternate}.visual-story-scene.active .visual-story-overlay.overlay-none{animation:none}
.visual-story-scene.outgoing figcaption.exit-slide-left-out{opacity:0;transform:translateX(-55px)}.visual-story-scene.outgoing figcaption.exit-slide-right-out{opacity:0;transform:translateX(55px)}.visual-story-scene.outgoing figcaption.exit-rotate-out{opacity:0;transform:rotate(9deg) scale(.8)}.visual-story-scene.outgoing figcaption.exit-shrink-out{opacity:0;transform:scale(.25)}.visual-story-scene.outgoing figcaption.exit-wipe-out{opacity:0;clip-path:inset(0 100% 0 0)}.visual-story-scene.outgoing figcaption.exit-type-out{overflow:hidden;width:0;white-space:nowrap}.visual-story-scene.outgoing figcaption{transition-duration:.42s;transition-timing-function:cubic-bezier(.4,0,.2,1)}
.visual-story-scene.ready{z-index:2;opacity:1;visibility:visible;transform:none}.visual-story-background{position:absolute;inset:0;overflow:hidden;background:inherit}.visual-story-background>img,.visual-story-background>video{width:100%;height:100%;object-fit:cover}.visual-story-scene.active{animation:none!important}.visual-story-scene.active.transition-fade .visual-story-background{animation:story-bg-fade .72s ease both}.visual-story-scene.active.transition-slide .visual-story-background{animation:story-bg-slide .72s cubic-bezier(.22,1,.36,1) both}.visual-story-scene.active.transition-zoom .visual-story-background{animation:story-bg-zoom .8s cubic-bezier(.22,1,.36,1) both}.visual-story-scene.active.transition-wipe .visual-story-background{animation:story-bg-wipe .72s ease both}.visual-story-scene.active.transition-flip .visual-story-background{animation:story-bg-flip .75s ease both}.visual-story-scene.active.transition-blur .visual-story-background{animation:story-bg-blur .75s ease both}.visual-story-scene.active.transition-circle .visual-story-background{animation:story-bg-circle .78s ease both}.visual-story-scene.active.transition-pan .visual-story-background{animation:story-bg-pan .8s ease both}@keyframes story-bg-fade{from{opacity:0}}@keyframes story-bg-slide{from{transform:translateX(100%)}}@keyframes story-bg-zoom{from{opacity:.45;transform:scale(1.18)}}@keyframes story-bg-wipe{from{clip-path:inset(0 100% 0 0)}}@keyframes story-bg-flip{from{opacity:.4;transform:perspective(900px) rotateY(72deg)}}@keyframes story-bg-blur{from{opacity:.35;filter:blur(22px);transform:scale(1.08)}}@keyframes story-bg-circle{from{clip-path:circle(0 at 50% 50%)}to{clip-path:circle(75% at 50% 50%)}}@keyframes story-bg-pan{from{opacity:.7;transform:translateX(9%) scale(1.06)}}
.visual-story-scene.text-leaving figcaption{transition-duration:.5s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.visual-story-scene.text-leaving figcaption.exit-fade-out{opacity:0}.visual-story-scene.text-leaving figcaption.exit-slide-up-out{opacity:0;transform:translateY(-50px)}.visual-story-scene.text-leaving figcaption.exit-slide-left-out{opacity:0;transform:translateX(-60px)}.visual-story-scene.text-leaving figcaption.exit-slide-right-out{opacity:0;transform:translateX(60px)}.visual-story-scene.text-leaving figcaption.exit-zoom-out{opacity:0;transform:scale(1.35)}.visual-story-scene.text-leaving figcaption.exit-blur-out{opacity:0;filter:blur(18px)}.visual-story-scene.text-leaving figcaption.exit-rotate-out{opacity:0;transform:rotate(10deg) scale(.75)}.visual-story-scene.text-leaving figcaption.exit-shrink-out{opacity:0;transform:scale(.2)}.visual-story-scene.text-leaving figcaption.exit-wipe-out{opacity:0;clip-path:inset(0 100% 0 0)}.visual-story-scene.text-leaving figcaption.exit-type-out{overflow:hidden;width:0;white-space:nowrap}.visual-story-scene.text-leaving figcaption.exit-none{opacity:1;transform:none;filter:none}
.visual-story-stage>.visual-story-scene{transform:none;transition:none}.visual-story-stage>.visual-story-scene.active,.visual-story-stage>.visual-story-scene.ready{transform:none!important}
.visual-scene-grid input[type="color"]{width:100%;height:36px;padding:3px;border:1px solid #cbdad5;border-radius:9px;background:#fff;cursor:pointer}.visual-story-scene figcaption.text-position-top{top:9%;bottom:auto}.visual-story-scene figcaption.text-position-middle{top:50%;bottom:auto;translate:0 -50%}.visual-story-scene figcaption.text-position-bottom{top:auto;bottom:14%}
.visual-scene-primary{display:grid;grid-template-columns:minmax(190px,2.2fr) repeat(4,minmax(88px,1fr));align-items:end;gap:8px}.visual-scene-primary textarea{height:52px;min-height:52px}.visual-scene-media-row{display:grid;grid-template-columns:minmax(190px,1.35fr) minmax(150px,1fr) minmax(150px,1fr);align-items:end;gap:8px;margin-top:7px}.visual-scene-media-row>label{min-width:0}.visual-scene-media-row>.story-library-button{width:100%;min-height:34px;margin:0}.visual-scene-media-row>small{grid-column:1/-1;min-height:0}.visual-scene-grid{grid-template-columns:repeat(4,minmax(105px,1fr))}.visual-story-scene.active figcaption[class*="effect-"]{animation-duration:1.15s!important}.visual-story-scene.text-leaving figcaption,.visual-story-scene.outgoing figcaption{transition-duration:.6s}
@media(max-width:700px){.visual-scene-primary{grid-template-columns:1fr 1fr}.visual-scene-primary>label:first-child{grid-column:1/-1}.visual-scene-media-row{grid-template-columns:1fr 1fr}.visual-scene-media-row>label{grid-column:1/-1}.visual-scene-grid{grid-template-columns:1fr 1fr}.visual-scene-grid label:first-child{grid-column:auto}}

/* Dedicated Visual Story workspace: one scene at a time below the site header. */
body.visual-story-workspace-open{overflow:hidden}
.visual-story-workspace{position:fixed;z-index:990;top:var(--visual-story-top,0);right:0;bottom:0;left:0;width:auto;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:#f4faf7;box-shadow:none;display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.visual-story-workspace[hidden]{display:none!important}
.visual-story-workspace>header{min-height:62px;margin:0;padding:10px clamp(14px,3vw,34px);border-bottom:1px solid #cbded7;background:#fff}
.visual-story-workspace>header button{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#eef6f3;font-size:24px}
.visual-story-workspace-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;padding:14px clamp(14px,3vw,34px) 24px}
.visual-story-workspace .visual-story-settings{max-width:850px;margin:0 auto 10px}
.visual-scene-tabs{display:grid;grid-template-columns:38px minmax(0,850px) 38px;justify-content:center;align-items:center;gap:7px;position:sticky;z-index:4;top:-14px;margin:0 auto 12px;padding:8px 0;background:#f4faf7}
.visual-scene-tabs>button{width:36px;height:36px;padding:0;border:1px solid #bfd8cf;border-radius:50%;background:#fff;color:#075f50;font-size:24px;cursor:pointer}
.visual-scene-tabs>button:disabled{opacity:.35;cursor:default}
.visual-scene-tabs>[data-scene-tabs]{display:flex;gap:7px;min-width:0;padding:2px;overflow-x:auto;scrollbar-width:thin;scroll-snap-type:x proximity}
.visual-scene-tabs [data-scene-tab]{flex:0 0 auto;min-width:88px;padding:8px 13px;border:1px solid #cbded7;border-radius:999px;background:#fff;color:#3c5750;font-weight:750;scroll-snap-align:center;cursor:pointer}
.visual-scene-tabs [data-scene-tab][aria-selected="true"]{border-color:#08715d;background:#08715d;color:#fff;box-shadow:0 4px 12px rgba(8,113,93,.18)}
.visual-story-workspace-grid{display:grid;grid-template-columns:minmax(0,850px) minmax(280px,420px);justify-content:center;align-items:start;gap:20px}
.visual-story-workspace .visual-scene-list{margin:0}
.visual-story-workspace .visual-scene-card{display:none;padding:14px;border-color:#c7ddd5;box-shadow:0 5px 18px rgba(2,55,46,.06)}
.visual-story-workspace .visual-scene-card.is-active{display:block}
.visual-story-workspace .visual-scene-card>header [data-scene-up],.visual-story-workspace .visual-scene-card>header [data-scene-down]{display:none}
.visual-story-workspace .visual-story-actions{margin-top:10px}
.visual-story-preview-column{display:grid;justify-items:center;gap:9px;position:sticky;top:60px;filter: invert(1) hue-rotate(300deg);}
.visual-story-workspace .visual-story-preview{width:100%;margin:0;padding:7px;background:#dfeae6}
.visual-story-workspace .visual-story-preview[hidden]{display:grid!important;min-height:360px;background:#101817}
.visual-story-workspace .visual-story-preview[hidden]:before{content:"Preview";align-self:center;color:#8ea29c;font-size:13px}
html[lang="ar"] .visual-story-workspace .visual-story-preview[hidden]:before{content:"المعاينة"}
.visual-story-workspace .visual-story-player{max-height:min(58vh,620px);margin:0}
.visual-story-workspace .story-media-library{max-width:1290px;margin:18px auto 0}
.visual-story-workspace-footer{display:flex;justify-content:flex-end;align-items:center;gap:9px;min-height:62px;padding:10px clamp(14px,3vw,34px);border-top:1px solid #cbded7;background:#fff;box-shadow:0 -5px 18px rgba(2,55,46,.07)}
.visual-story-workspace-footer .btn{min-width:120px}

@media(max-width:900px){.visual-story-workspace-grid{grid-template-columns:minmax(0,680px)}.visual-story-preview-column{position:static}.visual-story-workspace .visual-story-preview{width:min(100%,420px)}.visual-story-workspace .visual-story-preview[hidden]{min-height:300px}}
@media(max-width:700px){.visual-story-workspace>header{min-height:54px;padding-block:7px}.visual-story-workspace>header small{font-size:10px}.visual-story-workspace-scroll{padding:8px 8px 18px}.visual-story-workspace .visual-story-settings{gap:6px;margin-bottom:6px}.visual-scene-tabs{grid-template-columns:32px minmax(0,1fr) 32px;top:-8px;margin-bottom:7px;padding:6px 0}.visual-scene-tabs>button{width:30px;height:30px;font-size:20px}.visual-scene-tabs [data-scene-tab]{min-width:76px;padding:6px 10px;font-size:11px}.visual-story-workspace .visual-scene-card{padding:9px}.visual-story-workspace .visual-scene-primary,.visual-story-workspace .visual-scene-media-row,.visual-story-workspace .visual-scene-grid{gap:5px}.visual-story-workspace .visual-story-preview[hidden]{min-height:240px}.visual-story-workspace-footer{min-height:54px;padding:7px 10px}.visual-story-workspace-footer .btn{min-width:0;flex:1}}
/* Story timing: background transition, then text entrance; text exits before the next transition. */
.visual-story-scene.active figcaption.effect-fade-up,.visual-story-scene.active figcaption.effect-zoom-in,.visual-story-scene.active figcaption.effect-slide-left,.visual-story-scene.active figcaption.effect-slide-right,.visual-story-scene.active figcaption.effect-typewriter,.visual-story-scene.active figcaption.effect-bounce-in,.visual-story-scene.active figcaption.effect-blur-in,.visual-story-scene.active figcaption.effect-rotate-in,.visual-story-scene.active figcaption.effect-reveal{animation-delay:.82s!important;animation-duration:1.3s!important;animation-fill-mode:both!important}.visual-story-scene.active figcaption.effect-none{opacity:1;animation:none!important}
@keyframes story-fade-up{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:translateY(0)}}@keyframes story-zoom{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes story-slide{from{opacity:0;transform:translateX(55px)}to{opacity:1;transform:translateX(0)}}@keyframes story-slide-right{from{opacity:0;transform:translateX(-55px)}to{opacity:1;transform:translateX(0)}}@keyframes story-type{from{opacity:1;width:0}to{opacity:1;width:84%}}@keyframes story-bounce{0%{opacity:0;transform:scale(.55)}65%{opacity:1;transform:scale(1.1)}100%{opacity:1;transform:scale(1)}}@keyframes story-blur-in{from{opacity:0;filter:blur(18px);transform:scale(1.08)}to{opacity:1;filter:blur(0);transform:scale(1)}}@keyframes story-rotate{from{opacity:0;transform:rotate(-8deg) scale(.76)}to{opacity:1;transform:rotate(0) scale(1)}}@keyframes story-text-reveal{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
.visual-story-scene.text-leaving figcaption.exit-fade-out{animation:story-exit-fade .78s ease-in both!important}.visual-story-scene.text-leaving figcaption.exit-slide-up-out{animation:story-exit-up .78s cubic-bezier(.4,0,1,1) both!important}.visual-story-scene.text-leaving figcaption.exit-slide-left-out{animation:story-exit-left .78s cubic-bezier(.4,0,1,1) both!important}.visual-story-scene.text-leaving figcaption.exit-slide-right-out{animation:story-exit-right .78s cubic-bezier(.4,0,1,1) both!important}.visual-story-scene.text-leaving figcaption.exit-zoom-out{animation:story-exit-zoom .78s ease-in both!important}.visual-story-scene.text-leaving figcaption.exit-blur-out{animation:story-exit-blur .78s ease-in both!important}.visual-story-scene.text-leaving figcaption.exit-rotate-out{animation:story-exit-rotate .78s ease-in both!important}.visual-story-scene.text-leaving figcaption.exit-shrink-out{animation:story-exit-shrink .78s ease-in both!important}.visual-story-scene.text-leaving figcaption.exit-wipe-out{animation:story-exit-wipe .78s ease-in both!important}.visual-story-scene.text-leaving figcaption.exit-type-out{animation:story-exit-type .78s steps(24,end) both!important}.visual-story-scene.text-leaving figcaption.exit-none{animation:none!important;opacity:1!important}
@keyframes story-exit-fade{from{opacity:1}to{opacity:0}}@keyframes story-exit-up{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-55px)}}@keyframes story-exit-left{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-65px)}}@keyframes story-exit-right{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(65px)}}@keyframes story-exit-zoom{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.38)}}@keyframes story-exit-blur{from{opacity:1;filter:blur(0)}to{opacity:0;filter:blur(20px)}}@keyframes story-exit-rotate{from{opacity:1;transform:rotate(0) scale(1)}to{opacity:0;transform:rotate(12deg) scale(.72)}}@keyframes story-exit-shrink{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.15)}}@keyframes story-exit-wipe{from{opacity:1;clip-path:inset(0 0 0 0)}to{opacity:0;clip-path:inset(0 100% 0 0)}}@keyframes story-exit-type{from{opacity:1;max-width:100%}to{opacity:1;max-width:0}}

/* Compact scene workspace: keep many scenes manageable without weakening readability. */
.visual-story-editor{padding:11px;border-radius:13px}
.visual-story-editor>header{gap:9px;margin-bottom:8px}
.visual-story-editor>header b{font-size:14px}
.visual-story-editor>header small{font-size:10px;line-height:1.3}
.visual-story-editor>header button{font-size:20px}
.visual-story-settings{gap:6px}
.visual-story-editor label{gap:2px;font-size:9.5px;font-weight:650;line-height:1.2}
.visual-story-editor select,.visual-story-editor textarea,.visual-story-editor input[type=file]{font-size:10px;font-weight:500}
.visual-scene-list{gap:5px;margin:7px 0}
.visual-scene-card{padding:6px 7px;border-radius:10px;box-shadow:0 2px 8px rgba(2,55,46,.035)}
.visual-scene-card>header{margin-bottom:4px}
.visual-scene-card>header b{font-size:12px;font-weight:700}
.visual-scene-card header button{width:25px;height:24px;padding:0;border-radius:6px;font-size:12px}
.visual-scene-primary{grid-template-columns:minmax(170px,2.3fr) repeat(4,minmax(78px,1fr));gap:5px}
.visual-scene-primary textarea{height:39px;min-height:39px;padding:5px 7px;line-height:1.25;resize:vertical;border: dashed 1px;}
.visual-scene-media-row{grid-template-columns:minmax(165px,1.35fr) minmax(130px,1fr) minmax(130px,1fr);gap:5px;margin-top:4px}
.visual-scene-grid{grid-template-columns:repeat(4,minmax(90px,1fr));gap:5px;margin-top:4px}
.visual-scene-grid input,.visual-scene-grid select,.visual-scene-primary select,.visual-story-settings select{min-height:29px;height:29px;padding:3px 6px;font-size:10px;border: 1px solid #9ea09f;}
.visual-scene-grid input[type="color"]{height:29px;padding:2px;border-radius:7px}
.visual-scene-media-row input[type="file"]{height:30px;padding:2px;font-size:9px;border: 1px solid #9ea09f;}
.visual-scene-media-row input[type="file"]::file-selector-button{height:24px;margin:0 5px 0 0;padding:2px 7px;border:0;border-radius:6px;background:#eaf4f0;color:#075f50;font-size:9px;font-weight:650}
[dir="rtl"] .visual-scene-media-row input[type="file"]::file-selector-button{margin:0 0 0 5px}
.visual-scene-media-row>.story-library-button{min-height:29px;height:29px;padding:4px 7px;font-size:9.5px;font-weight:650}
.visual-scene-media-row>small{font-size:9px;line-height:1.2}
.visual-scene-media-row>small:empty{display:none}
.visual-story-actions{gap:5px}
.visual-story-actions .btn{min-height:31px;padding:5px 9px;font-size:10px;font-weight:650}
.visual-story-actions>span{font-size:9.5px;font-weight:700}

@media(max-width:700px){.visual-story-editor{padding:8px}.visual-scene-card{padding:6px}.visual-scene-primary{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.visual-scene-primary>label:first-child{grid-column:1/-1}.visual-scene-media-row{grid-template-columns:1fr 1fr;gap:4px}.visual-scene-media-row>label{grid-column:1/-1}.visual-scene-grid{grid-template-columns:1fr 1fr;gap:4px}.visual-scene-card header button{width:29px;height:27px}.visual-scene-primary textarea{height:36px;min-height:36px}.visual-scene-grid input,.visual-scene-grid select,.visual-scene-primary select,.visual-story-settings select{height:28px;min-height:28px}.visual-scene-media-row>.story-library-button{height:28px;min-height:28px}.visual-story-settings{grid-template-columns:1fr 1fr}}

/* Keep the full-screen workspace immune from the generic compact editor box. */
.visual-story-editor.visual-story-workspace{width:auto;max-width:none;margin:0;padding:0;border:0;border-radius:0;filter: invert(1) hue-rotate(60deg);background: #6aa59f;}
.visual-story-editor.visual-story-workspace>header{margin:0}
@media(max-width:700px){.visual-story-editor.visual-story-workspace{padding:0}}
@media(max-width:700px){.visual-story-workspace .visual-scene-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}.visual-story-workspace .visual-scene-grid label{min-width:0}.visual-story-workspace .visual-scene-grid select{width:100%;padding-inline:4px}}
.visual-story-edit-scroll>.visual-story-settings,.visual-story-edit-scroll>.visual-scene-tabs,.visual-story-edit-scroll>.visual-scene-list{width:min(850px,100%);margin-inline:auto}
.visual-story-edit-preview{width:min(420px,100%);margin:14px auto 0;position:static}