:root{color-scheme:dark;--bg:#0c0c0f;--panel:#141417;--raised:#1f1c25;--line:#2a2830;--ink:#ebe9f0;--muted:#93909c;--purple:#c7b3ed}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:13px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #c7b3ed;outline-offset:3px}button{border:0;color:inherit;background:none}a{color:inherit}h1,h2,p{margin:0}h1{font-size:27px;font-weight:500;letter-spacing:-.8px}h2{font-size:13px;font-weight:500}.app{display:grid;grid-template-columns:184px minmax(0,1fr);max-width:1600px;margin:0 auto;min-height:100vh}aside{background:#111114;border-right:1px solid var(--line);padding:35px 18px 24px;display:flex;flex-direction:column}.brand{display:block;padding:0 10px}.brand img{width:126px;display:block}.app-name{padding:14px 10px 0;color:#b8b2c2;font-size:12px}.app-name span{display:block;font-size:10px;color:#716b7d;margin-top:5px}nav{display:grid;gap:7px;margin-top:33px}.nav{display:flex;align-items:center;text-align:left;gap:11px;border-radius:8px;padding:12px 13px;color:#a19ba9;white-space:nowrap}.nav span{font-size:17px;width:17px;text-align:center}.nav small{margin-left:auto;font-size:10px;color:#8b7d9e}.nav.active{background:#27222f;color:var(--purple)}.nav-line{height:1px;background:var(--line);margin:11px 10px}.aside-bottom{margin-top:auto;padding:65px 10px 0;color:#96909f;font-size:10px}.aside-bottom small{font-size:10px;color:#655f70}main{padding:32px 30px 0;min-width:0}header{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:29px}.eyebrow{font-size:10px;color:#7f768c;letter-spacing:1.3px;margin-bottom:8px}.waiting{color:#b8a5d5;background:#211c2a;padding:5px 10px;font-size:10px;border-radius:6px;white-space:nowrap}.waiting i,footer i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#bda5df;vertical-align:middle;margin-right:6px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 245px;gap:26px}.section-label{display:flex;align-items:center;justify-content:space-between;margin:0 0 13px}.section-label span{color:#76707e;font-size:10px}.stage{aspect-ratio:16/9;background:#1c1b25;position:relative;overflow:hidden;border-radius:9px;isolation:isolate;--effect-strength:.7;--title-size:56px;--motion-time:.8s;--text-color:#efedf6}.scene{position:absolute;inset:0;background:linear-gradient(#34333f 0%,#56515d 47%,#34303e 48%,#22232e 100%)}.horizon{position:absolute;inset:46% 0 0;background:linear-gradient(#74717e33,#11121b)}.sun{width:11%;aspect-ratio:1;position:absolute;right:29%;top:24%;border-radius:50%;background:#d6cbd5;box-shadow:0 0 60px 5px #c5accc33}.mountain{position:absolute;bottom:34%;background:#272733;clip-path:polygon(0 100%,0 76%,15% 56%,24% 65%,41% 25%,52% 40%,66% 5%,78% 30%,92% 50%,100% 44%,100% 100%);width:75%;height:50%}.m1{left:-7%}.m2{right:-20%;bottom:29%;height:39%;background:#33313e;transform:scaleX(-1)}.water{position:absolute;inset:65% 0 0;background:repeating-linear-gradient(178deg,transparent 0px,#c8b4cf08 1px,transparent 2px,transparent 11px)}.canvas-title{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;color:var(--text-color);transition:color .2s}.canvas-title #title-copy{font-size:clamp(30px,4.5vw,var(--title-size));font-weight:500;letter-spacing:.18em;text-indent:.18em;line-height:1.5}.title-kicker{font-size:9px;letter-spacing:.18em;color:#efedf6a6}.title-caption{font-size:10px;letter-spacing:.26em;opacity:.6}.safe-marker{position:absolute;width:14px;height:14px;opacity:.35;border-color:#e9deef}.top-left{left:8%;top:12%;border-left:1px solid;border-top:1px solid}.top-right{right:8%;top:12%;border-right:1px solid;border-top:1px solid}.bottom-left{left:8%;bottom:12%;border-left:1px solid;border-bottom:1px solid}.bottom-right{right:8%;bottom:12%;border-right:1px solid;border-bottom:1px solid}.stage.no-guides .safe-marker{display:none}.frame-label,.frame-badge{position:absolute;bottom:12px;font-size:9px;color:#ddd7e7aa}.frame-label{left:15px}.frame-badge{right:15px;background:#16121b70;padding:2px 8px;border-radius:4px}.stage.original .canvas-title{opacity:0}.stage.playing .canvas-title{animation:title-in var(--motion-time) ease both}.stage.style-type .canvas-title #title-copy{overflow:hidden;white-space:nowrap}.stage.style-outline .canvas-title #title-copy{-webkit-text-stroke:1px var(--text-color);color:transparent}.stage.style-focus .canvas-title{background:radial-gradient(ellipse,#0a071566,transparent 65%)}.stage.style-letter .canvas-title #title-copy{letter-spacing:.45em;text-indent:.45em}.stage.style-lower .canvas-title{align-items:flex-start;justify-content:flex-end;padding:0 0 15% 10%}.stage.style-lower .title-caption{margin-left:4px}.stage.image-effect .canvas-title{opacity:0}.stage.style-glow .scene{filter:brightness(calc(1 + var(--effect-strength)*.35)) blur(calc(var(--effect-strength)*1px))}.stage.style-grain .scene:after{content:"";position:absolute;inset:0;opacity:calc(var(--effect-strength)*.5);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.6' filter='url(%23n)'/%3E%3C/svg%3E")}.stage.style-vignette .scene:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse,transparent 20%,#04020ce6);opacity:var(--effect-strength)}.stage.style-letterbox:after{content:"";position:absolute;inset:0;pointer-events:none;border-block:18px solid #0a090c}.stage.style-dispersion .scene{filter:contrast(1.2) saturate(.7);transform:scale(1.01)}.stage.style-flash.playing .scene{animation:flash var(--motion-time) ease both}@keyframes title-in{from{opacity:0;transform:translateY(14px);filter:blur(4px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}@keyframes flash{from{filter:brightness(3)}to{filter:brightness(1)}}.transport{display:flex;justify-content:space-between;align-items:center;margin:10px 0 13px;font-size:10px;color:#bbb4c6;gap:12px}.transport-left,.transport-right{display:flex;gap:10px;align-items:center}.transport-right label{display:flex;align-items:center;gap:5px;font-size:10px;color:#aaa2b8}.transport input{accent-color:var(--purple)}.timecode{font-variant-numeric:tabular-nums}.muted{color:#686070}.icon-btn{color:#c2b0dc;border-radius:5px;padding:3px 7px}.text-btn{font-size:10px;color:#9e91af}.track{height:28px;border-radius:5px;background:#211d29;position:relative;overflow:hidden;margin-bottom:30px}.track-fill{position:absolute;inset:0 auto 0 0;background:#3a304a;width:49%}.track i{position:absolute;left:49%;height:100%;border-left:1px solid #c7b3ed}.track span{font-size:9px;position:relative;display:block;padding:7px 10px;color:#ae9fc2}.library-heading{display:flex;gap:15px;align-items:center;justify-content:space-between}.library-heading>div{display:flex;gap:12px;align-items:center}.library-heading span{font-size:10px;color:#797182}.search{display:flex;gap:8px;align-items:center;padding:7px 10px;background:#151317;border:1px solid var(--line);border-radius:6px}.search input{border:0;background:none;color:var(--ink);width:125px;font-size:10px;outline-offset:5px}.search input::placeholder{color:#6e6678}.filters{display:flex;gap:8px;margin:17px 0 16px}.filter{padding:4px 11px;border-radius:5px;font-size:10px;color:#8d8398}.filter.selected{color:var(--purple);background:#25202d}.effect-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.effect{min-width:0;text-align:left;background:#151417;border:1px solid var(--line);border-radius:8px;padding:0;overflow:hidden}.effect[aria-pressed=true]{border-color:#8b73ad}.effect-sample{height:74px;display:grid;place-content:center;background:linear-gradient(135deg,#25212d,#15131c);color:#d1c6df;position:relative;overflow:hidden}.effect-sample strong{font-size:18px;font-weight:400;letter-spacing:3px}.effect-sample small{font-size:6px;letter-spacing:3px;text-align:center;opacity:.45;margin-top:3px}.effect-name{font-size:11px;padding:9px 11px 2px;display:block}.effect-meta{font-size:9px;color:#776d83;display:block;padding:0 11px 9px}.effect.sample-outline strong{-webkit-text-stroke:1px #c9bad9;color:transparent}.effect.sample-lower .effect-sample{place-content:end start;padding:12px}.effect.sample-type strong{border-right:1px solid #b7a1d2}.effect.sample-glow .effect-sample{background:radial-gradient(ellipse at 70% 25%,#7e698950,#24202c 60%)}.effect.sample-vignette .effect-sample{background:radial-gradient(ellipse,#595161,#0a090d)}.effect.sample-grain .effect-sample{background:repeating-linear-gradient(96deg,#2a2536 0,#272333 2px,#24202f 4px)}.effect.sample-letterbox .effect-sample{border-block:12px solid #08070a}.effect.sample-dispersion strong{text-shadow:-2px 0 #87679b99,2px 0 #b6a1b599}.inspector{padding:19px;background:#131316;border:1px solid var(--line);border-radius:11px;align-self:start}.inspector-heading{display:flex;justify-content:space-between;align-items:center}.inspector-heading .icon-btn{font-size:21px;line-height:1}.selected-label{font-size:10px;color:#82758f;margin-top:5px}.settings-section{border-top:1px solid var(--line);padding-top:19px;margin-top:19px}.field-label{font-size:11px;color:#b6acbf;display:block;margin-bottom:9px}textarea,select{width:100%;border:1px solid #33303a;background:#0e0d11;color:#ddd6e7;border-radius:6px;padding:9px 10px;font-size:11px;resize:vertical}textarea{margin-bottom:14px;min-height:58px}.control-label{display:flex;justify-content:space-between;font-size:11px;color:#aaa0b7;gap:10px;margin-bottom:8px}.control-label output{font-size:10px;color:#c5b2e0;font-variant-numeric:tabular-nums}input[type=range]{width:100%;height:3px;accent-color:#b69bdc;margin:0 0 21px;display:block}.settings-section input[type=range]:last-child{margin-bottom:5px}.color-row{display:flex;gap:8px;align-items:center;margin-bottom:19px}.swatch{width:23px;height:23px;background:var(--swatch);border:2px solid #141317;border-radius:6px}.swatch.selected{outline:1px solid #af92d1}.color-row>span{margin-left:auto;color:#7f758c;font-size:10px}.switch-line{display:flex;justify-content:space-between;align-items:center;color:#a49aaf;font-size:10px;margin-top:15px}.switch-line input{accent-color:#b69bdc}.preset{margin-top:21px}.secondary{display:flex;align-items:center;justify-content:space-between;width:100%;padding:9px 11px;border:1px solid #332c3f;background:#221c2c;border-radius:6px;color:#c2acdF;font-size:10px}.preset p{color:#6f647e;font-size:9px;margin-top:8px}.coming-soon{border-top:1px solid var(--line);margin-top:22px;padding-top:20px;text-align:center}.coming-soon span{color:#766b84;font-size:10px}.coming-soon button{display:block;width:100%;padding:10px;border-radius:7px;background:#222026;color:#82798b;font-size:11px;margin-top:9px;cursor:default}.coming-soon p{font-size:10px;color:#766983;margin-top:9px}footer{display:flex;justify-content:space-between;gap:12px;font-size:9px;color:#6f667a;border-top:1px solid var(--line);padding:16px 0;margin-top:26px}#empty-state{padding:25px 0;color:#9f91ad;font-size:12px}@media(min-width:1400px){main{padding:38px 40px 0}.workspace{grid-template-columns:minmax(0,1fr) 270px;gap:32px}.effect-sample{height:100px}}@media(max-width:1050px){.app{grid-template-columns:160px minmax(0,1fr)}aside{padding-inline:12px}.workspace{grid-template-columns:minmax(0,1fr) 215px;gap:18px}main{padding:25px 22px 0}.brand img{width:116px}.transport-right{gap:5px}.effect-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-label span{display:none}.search input{width:88px}.library-heading>div{gap:6px}}@media(max-width:800px){.app{grid-template-columns:1fr}aside{padding:20px;display:block;border-right:0;border-bottom:1px solid var(--line)}.brand img{width:120px}.app-name{padding:6px 10px 0}.app-name span{display:inline;margin-left:10px}nav{display:flex;overflow:auto;gap:7px;margin-top:18px}.nav{padding:8px 10px}.nav small,.nav-line,.aside-bottom{display:none}.workspace{grid-template-columns:minmax(0,1fr)}.inspector{display:grid;grid-template-columns:1fr 1fr;gap:18px}.inspector-heading,.selected-label,.coming-soon{grid-column:1/-1}.inspector .settings-section{margin:0}.coming-soon{margin:0}h1{font-size:24px}.effect-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:480px){main{padding:24px 16px 0}.waiting{display:none}.effect-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.transport{align-items:flex-start;flex-direction:column}.library-heading{align-items:flex-start;flex-direction:column}.inspector{grid-template-columns:1fr}.inspector-heading,.selected-label,.coming-soon{grid-column:auto}.canvas-title #title-copy{font-size:30px}.title-kicker{font-size:6px}footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.canvas-title #title-copy{max-width:88%;text-align:center}.stage.original .scene{filter:none!important;transform:none!important}.stage.original .scene:after{display:none}.stage.original:after{display:none}.stage.style-type.playing #title-copy{animation:reveal var(--motion-time) steps(8,end) both}@keyframes reveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

/* Preview interactions remain responsive inside the stage. */
[hidden]{display:none!important}.stage{container-type:inline-size;--title-scale:56}.canvas-title #title-copy{font-size:clamp(16px,calc(var(--title-scale)*.125cqw),88px);overflow-wrap:anywhere}.stage.style-type .canvas-title #title-copy{white-space:normal}.stage.original .canvas-title,.stage.image-effect .canvas-title{opacity:0!important;animation:none!important}.stage.style-letterbox:after{border-block-width:calc(var(--effect-strength)*26px)}.stage.style-dispersion .scene{filter:contrast(calc(1 + var(--effect-strength)*.3)) saturate(calc(1 - var(--effect-strength)*.3))}.stage.style-dispersion .scene:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#9171c977,transparent 5%,transparent 95%,#d4c3e577);opacity:var(--effect-strength)}@keyframes flash{from{filter:brightness(calc(1 + var(--effect-strength)*3))}to{filter:brightness(1)}}

/* Effects app identity */
.app-identity{display:flex;align-items:center;gap:10px;margin:19px 8px 0}.app-identity>img{display:block;flex:0 0 48px;width:48px;height:48px}.app-identity .app-name{padding:0}.app-identity .app-name span{display:block;margin:3px 0 0}