:root{color-scheme:dark;font-family:Inter,SF Pro Display,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;color:#e9f2ee;background:#0a121f;font-synthesis:none;text-rendering:geometricPrecision}*{box-sizing:border-box}html,body,#root{min-width:1180px;min-height:100%;margin:0}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline:2px solid #daffa6;outline-offset:2px}.app-shell{min-height:100vh;padding:14px;overflow:hidden;background:radial-gradient(circle at 50% -20%,rgba(42,75,109,.35),transparent 42%),#0a121f}.topbar,.panel,.stage-toolbar,.stage-status{border:1px solid rgba(164,194,192,.12);background:#0d1928e8;box-shadow:0 16px 50px #00000026}.topbar{min-height:66px;padding:10px 12px 10px 16px;border-radius:14px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:12px}.brand__mark{width:38px;height:38px;padding:8px;border-radius:10px;background:#daffa6;display:grid;grid-template-columns:repeat(2,1fr);gap:4px;box-shadow:0 0 28px #daffa61f}.brand__mark i{display:block;border-radius:50%;background:#183158}.brand__mark i:nth-child(2),.brand__mark i:nth-child(3){border-radius:1px}.brand strong,.brand small{display:block}.brand strong{font-size:15px;font-weight:650;letter-spacing:.08em}.brand small{margin-top:3px;color:#7f929d;font-size:10px;letter-spacing:.14em}.topbar__meta{display:flex;align-items:center;gap:7px}.topbar__meta span{padding:6px 10px;border:1px solid rgba(218,255,166,.13);border-radius:999px;color:#a9bac0;background:#daffa609;font-size:10px;letter-spacing:.04em}.topbar__actions{justify-self:end;display:flex;gap:8px}.button,.icon-button,.play-button{border:0;cursor:pointer}.button{min-height:38px;padding:0 15px;border-radius:9px;font-size:12px;font-weight:600}.button--quiet{border:1px solid rgba(164,194,192,.16);color:#a9bac0;background:#ffffff09}.button--quiet:hover{background:#ffffff12}.button--primary{color:#132440;background:#daffa6;box-shadow:0 8px 25px #daffa61f}.button--primary:hover{background:#e2ffb9}.button--export{border:1px solid rgba(218,255,166,.35);color:#daffa6;background:#daffa614}.button:disabled,.clip__export:disabled{cursor:wait;opacity:.48}.workspace{height:min(690px,calc(100vh - 222px));min-height:545px;margin-top:10px;display:grid;grid-template-columns:226px minmax(620px,1fr) 258px;gap:10px}.panel{border-radius:12px}.panel__heading{height:48px;padding:0 14px;border-bottom:1px solid rgba(164,194,192,.1);display:flex;align-items:center;justify-content:space-between}.panel__heading>span{font-size:12px;font-weight:620;letter-spacing:.06em}.panel__heading small{color:#607784;font-size:10px}.panel__heading button{padding:0;border:0;color:#7f929d;background:transparent;cursor:pointer;font-size:10px}.effect-panel{overflow:hidden}.effect-list{height:calc(100% - 48px);padding:8px;overflow:auto}.effect-list::-webkit-scrollbar,.parameter-scroll::-webkit-scrollbar{width:5px}.effect-list::-webkit-scrollbar-thumb,.parameter-scroll::-webkit-scrollbar-thumb{border-radius:999px;background:#a4c2c021}.effect-card{width:100%;min-height:78px;margin-bottom:6px;padding:7px;border:1px solid transparent;border-radius:9px;display:grid;grid-template-columns:66px 1fr;align-items:center;gap:10px;text-align:left;background:transparent;cursor:pointer}.effect-card:hover{background:#ffffff07}.effect-card.is-active{border-color:#daffa633;background:#daffa611}.effect-card__preview{position:relative;width:66px;height:58px;overflow:hidden;border-radius:6px;display:grid;place-items:center;color:#eaffdc;background-color:#031229;background-image:radial-gradient(circle,rgba(218,255,166,.35) 1px,transparent 1.4px);background-size:8px 8px}.effect-card__preview:after{content:"";position:absolute;top:-30%;right:-30%;bottom:-30%;left:-30%;opacity:.75;background:radial-gradient(circle,rgba(218,255,166,.36),transparent 54%);animation:preview-drift 3.6s ease-in-out infinite alternate}.effect-card__preview--vertical-wave:after{animation-direction:alternate-reverse;transform:rotate(90deg)}.effect-card__preview--radial-ripple:after{background:radial-gradient(circle,transparent 25%,rgba(218,255,166,.38) 28%,transparent 48%);animation:preview-pulse 2.7s ease-in-out infinite}.effect-card__preview--diagonal-scan:after{background:linear-gradient(115deg,transparent 38%,rgba(218,255,166,.38) 48%,transparent 58%)}.effect-card__preview b{position:relative;z-index:1;font-size:24px;font-weight:400}@keyframes preview-drift{0%{transform:translate(-22%)}to{transform:translate(22%)}}@keyframes preview-pulse{0%,to{transform:scale(.7);opacity:.35}50%{transform:scale(1.35);opacity:.9}}.effect-card__copy strong,.effect-card__copy small{display:block}.effect-card__copy strong{margin-bottom:6px;color:#dbe6e2;font-size:12px;font-weight:600}.effect-card.is-active .effect-card__copy strong{color:#daffa6}.effect-card__copy small{max-width:116px;color:#6f828d;font-size:9px;line-height:1.45}.stage-section{min-width:0;display:grid;grid-template-rows:48px minmax(0,1fr) 32px}.stage-toolbar{position:relative;z-index:2;padding:0 10px 0 14px;border-radius:12px 12px 0 0;display:flex;align-items:center;justify-content:space-between}.stage-toolbar>div:first-child{min-width:0}.stage-toolbar strong{margin-right:10px;font-size:12px;font-weight:620}.stage-toolbar>div:first-child span{color:#657a85;font-size:10px}.stage-toolbar__controls{display:flex;align-items:center;gap:7px}.icon-button,.play-button{height:30px;border-radius:7px;background:#ffffff0e}.icon-button{width:30px;color:#82959e}.play-button{min-width:58px;color:#183158;background:#daffa6;font-size:10px;font-weight:700}.timecode{min-width:80px;color:#d2deda;font-size:10px;font-variant-numeric:tabular-nums;text-align:right}.timecode span{color:#607784}.stage-frame{position:relative;min-height:0;overflow:hidden;display:grid;place-items:center;background:#080f1b;box-shadow:inset 0 0 60px #0000003d}.stage-host{width:min(100%,calc((100vh - 270px)*1.8289));max-height:100%;aspect-ratio:2341 / 1280;overflow:hidden;background:#031229;box-shadow:0 20px 70px #00000047,0 0 0 1px #daffa614}.stage-canvas{width:100%;height:100%;display:block}.stage-frame__edge{position:absolute;left:50%;width:min(100%,calc((100vh - 270px)*1.8289));height:1px;transform:translate(-50%);background:#daffa614;pointer-events:none}.stage-frame__edge--top{top:0}.stage-frame__edge--bottom{bottom:0}.stage-status{padding:0 12px;border-radius:0 0 12px 12px;display:flex;align-items:center;gap:12px;color:#607784;font-size:9px}.stage-status span:not(.status-dot)+span{padding-left:12px;border-left:1px solid rgba(164,194,192,.1)}.status-dot{width:5px;height:5px;border-radius:50%;background:#637681}.status-dot.is-live{background:#daffa6;box-shadow:0 0 10px #daffa6b3}.parameter-panel{overflow:hidden}.panel__heading--parameters{padding-right:12px;gap:8px}.parameter-tabs{align-self:stretch;display:flex;align-items:center;gap:2px}.panel__heading .parameter-tabs button{height:30px;padding:0 8px;border-radius:6px;color:#657a85;font-size:9px;font-weight:600}.panel__heading .parameter-tabs button:hover{color:#a9bac0;background:#ffffff09}.panel__heading .parameter-tabs button.is-active{color:#daffa6;background:#daffa614}.parameter-scroll{height:calc(100% - 48px);padding:0 13px 18px;overflow:auto}.parameter-group{padding:16px 0 8px;border-bottom:1px solid rgba(164,194,192,.08)}.parameter-group h2{margin:0 0 15px;color:#6f828d;font-size:9px;font-weight:600;letter-spacing:.12em}.param-control{margin-bottom:15px;display:block}.param-control__header{margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;color:#9aadb4;font-size:10px}.param-control output{min-width:47px;color:#daffa6;font-size:10px;font-variant-numeric:tabular-nums;text-align:right}.param-control input[type=range]{width:100%;height:3px;margin:0;border-radius:999px;display:block;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#a4c2c024;cursor:pointer}.param-control input[type=range]::-webkit-slider-thumb{width:12px;height:12px;border:3px solid #162a42;border-radius:50%;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#daffa6;box-shadow:0 0 0 1px #daffa66b}.advanced-toggle{width:100%;padding:13px 0;border:0;display:flex;justify-content:space-between;color:#71858e;background:transparent;cursor:pointer;font-size:10px}.advanced-toggle span{color:#daffa6}.parameter-group--advanced{padding-top:4px}.mask-panel-content__top{padding-top:13px}.mask-toggle{position:relative;min-height:32px;margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;color:#9aadb4;cursor:pointer;font-size:10px}.mask-toggle input{position:absolute;opacity:0;pointer-events:none}.mask-toggle i{position:relative;width:34px;height:18px;border-radius:999px;display:block;background:#a4c2c024;transition:background .16s ease}.mask-toggle i:after{content:"";position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;background:#71858e;transition:transform .16s ease,background .16s ease}.mask-toggle input:checked+i{background:#daffa633}.mask-toggle input:checked+i:after{transform:translate(16px);background:#daffa6}.mask-toggle:has(input:disabled){cursor:not-allowed;opacity:.55}.mask-toggle input:focus-visible+i{outline:2px solid #daffa6;outline-offset:2px}.mask-mode{margin-bottom:11px;padding:3px;border-radius:7px;display:grid;grid-template-columns:1fr 1fr;gap:3px;background:#a4c2c014}.mask-mode button{height:29px;border:0;border-radius:5px;color:#71858e;background:transparent;cursor:pointer;font-size:9px}.mask-mode button.is-active{color:#daffa6;background:#daffa617}.mask-file-input{display:none}.mask-upload{width:100%;min-height:38px;border:1px dashed rgba(218,255,166,.24);border-radius:7px;color:#a9bac0;background:#daffa609;cursor:pointer;font-size:9px}.mask-upload span{margin-right:5px;color:#daffa6}.mask-error{margin:9px 0 0;color:#ff9f93;font-size:9px;line-height:1.45}.mask-examples{display:grid;grid-template-columns:1fr 1fr;gap:7px}.mask-examples button{min-width:0;min-height:58px;padding:8px;border:1px solid rgba(164,194,192,.1);border-radius:7px;text-align:left;color:#71858e;background:#031229;cursor:pointer}.mask-examples button.is-active{border-color:#daffa64d;color:#daffa6}.mask-examples strong,.mask-examples span{display:block}.mask-examples strong{margin-bottom:5px;color:#eaffdc;font-size:12px}.mask-examples span{overflow:hidden;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.mask-preview{padding:7px;border:1px solid rgba(164,194,192,.1);border-radius:8px;display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:8px;background:#ffffff06}.mask-preview img,.mask-preview video{width:58px;height:34px;border-radius:4px;display:block;object-fit:contain;background:#000}.mask-preview strong,.mask-preview small{display:block}.mask-preview strong{overflow:hidden;color:#cddad6;font-size:9px;text-overflow:ellipsis;white-space:nowrap}.mask-preview small{margin-top:3px;color:#607784;font-size:8px}.mask-preview button{padding:0;border:0;color:#82959e;background:transparent;cursor:pointer;font-size:8px}.timeline{height:116px;margin-top:10px;padding:10px 12px 12px;overflow:hidden}.timeline__heading{height:28px;display:flex;align-items:flex-start;justify-content:space-between}.timeline__heading strong{margin-right:10px;font-size:11px;font-weight:620}.timeline__heading span,.timeline__legend{color:#607784;font-size:9px}.timeline__legend{display:flex;align-items:center;gap:6px}.timeline__legend span{width:6px;height:6px;border-radius:50%;background:#daffa6}.timeline__track{height:62px;padding:6px;overflow-x:auto;border-radius:8px;display:flex;gap:5px;background:repeating-linear-gradient(90deg,transparent 0,transparent 49px,rgba(164,194,192,.045) 50px),#050c158c}.timeline__empty{width:100%;border:1px dashed rgba(164,194,192,.14);border-radius:6px;color:#5e7380;background:transparent;cursor:pointer;font-size:9px}.timeline__empty span{margin-right:7px;color:#daffa6}.clip{position:relative;min-width:150px;max-width:360px;border:1px solid rgba(218,255,166,.14);border-radius:6px;display:flex;background:linear-gradient(135deg,#daffa617,#1831585c)}.clip__body{min-width:0;flex:1;padding:6px 25px 6px 7px;border:0;display:flex;align-items:center;gap:8px;text-align:left;background:transparent;cursor:pointer}.clip__index{width:24px;height:24px;border-radius:5px;display:grid;place-items:center;color:#183158;background:#daffa6;font-size:8px;font-weight:700}.clip__body strong,.clip__body small{display:block;white-space:nowrap}.clip__body strong{overflow:hidden;color:#cddad6;font-size:9px;font-weight:600;text-overflow:ellipsis}.clip__body small{margin-top:3px;color:#657a85;font-size:8px}.clip__remove{position:absolute;top:4px;right:5px;width:19px;height:19px;padding:0;border:0;color:#637782;background:transparent;cursor:pointer}.clip__export{align-self:center;height:26px;margin:0 28px 0 0;padding:0 9px;border:1px solid rgba(218,255,166,.18);border-radius:5px;color:#bedd96;background:#daffa60f;cursor:pointer;font-size:8px}.export-overlay{position:fixed;z-index:80;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#050b13b8;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.export-card{width:340px;padding:28px;border:1px solid rgba(218,255,166,.2);border-radius:16px;text-align:center;background:#0e1b2c;box-shadow:0 30px 90px #0000007a}.export-card__pulse{width:32px;height:32px;margin:0 auto 16px;border:7px solid rgba(218,255,166,.13);border-top-color:#daffa6;border-radius:50%;display:block;animation:export-spin .9s linear infinite}.export-card strong{color:#eef7ea;font-size:15px}.export-card p{margin:8px 0 18px;color:#82959e;font-size:10px}.export-card__bar{height:5px;overflow:hidden;border-radius:99px;background:#daffa61a}.export-card__bar i{height:100%;display:block;border-radius:inherit;background:#daffa6;transition:width .1s linear}.export-card small{margin-top:12px;display:block;color:#607784;font-size:9px}@keyframes export-spin{to{transform:rotate(360deg)}}.toast{position:fixed;right:24px;bottom:24px;z-index:20;padding:11px 15px;border:1px solid rgba(218,255,166,.19);border-radius:8px;color:#daffa6;background:#0c1927f5;box-shadow:0 18px 50px #00000057;font-size:11px;animation:toast-in .18s ease-out}@keyframes toast-in{0%{transform:translateY(5px);opacity:0}}@media (max-height: 760px){.workspace{height:540px;min-height:540px}.stage-host,.stage-frame__edge{width:min(100%,760px)}}
