:root{--bg-base:#0a0a0e;--bg-panel:#141418;--bg-toolbar:#1a1a1f;--bg-input:#1e1e24;--bg-card:#2a2a30;--border:#222;--border-active:#3a3a45;--text:#aaa;--text-bright:#fff;--text-dim:#7a7a7a;--text-muted:#6e6e6e;--accent:#7defa0;--accent-bg:#2d5a3d;--accent-dim:#1a3828;--danger:#ef7d7d;--danger-bg:#3d2d2d;--info:#7db8ef;--warning:#efb87d;--hover-bg:#ffffff0f;--overlay:#0006;--shadow:#0006;--radius:6px;--radius-lg:8px}html.light-mode{--bg-base:#eeeef2;--bg-panel:#f8f8fa;--bg-toolbar:#fff;--bg-input:#e8e8ee;--bg-card:#f0f0f5;--border:#0000001a;--border-active:#0000002e;--text:#2c2c3a;--text-bright:#111118;--text-dim:#5a5a70;--text-muted:#70708a;--accent:#1a9a52;--accent-bg:#d4f0e0;--accent-dim:#e6f7ed;--danger:#d94444;--danger-bg:#fde8e8;--info:#3b8ed0;--warning:#d09030;--hover-bg:#0000000a;--overlay:#0000004d;--shadow:#00000026;--radius:6px;--radius-lg:8px}*{box-sizing:border-box;margin:0;padding:0}button:focus-visible,select:focus-visible,input:focus-visible,.tool-btn:focus-visible,.toolbar-item:focus-visible,.layer-item:focus-visible,.effect-card-header:focus-visible,.switch-root:focus-visible{outline-offset:2px;outline:2px solid #7defa099}.skip-to-content{z-index:200;background:var(--accent);color:var(--bg-base);border-radius:var(--radius);padding:8px 16px;font-size:13px;font-weight:600;text-decoration:none;position:absolute;top:-100%;left:16px}.skip-to-content:focus{top:8px}body{background:var(--bg-base);color:var(--text);font-family:var(--font-sans), system-ui, -apple-system, sans-serif;height:100dvh;font-size:13px;overflow:hidden}.editor{background:var(--border);grid-template-rows:42px 1fr 170px;grid-template-columns:240px 1fr 280px;gap:1px;height:100dvh;display:grid}.toolbar{background:var(--bg-toolbar);grid-column:1/-1;align-items:center;gap:12px;padding:0 16px;display:flex}.toolbar-logo{color:var(--text-bright);letter-spacing:.06em;font-size:15px;font-weight:700}.toolbar-sep{color:var(--text-muted);opacity:.3}.toolbar-item{color:var(--text-dim);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;align-items:center;padding:5px 10px;font-size:13px;transition:color .15s,background .15s;display:inline-flex}.toolbar-item:hover{color:var(--text);background:var(--hover-bg)}.toolbar-spacer{flex:1}.toolbar-share{background:var(--accent-bg);color:var(--accent);border-radius:var(--radius);cursor:pointer;border:none;align-items:center;padding:6px 16px;font-size:12px;font-weight:500;transition:background .15s,transform .1s;display:inline-flex}.toolbar-share:hover{background:#366e4a}.toolbar-share:active{transform:scale(.97)}.toolbar-dropdown-wrap{position:relative}.toolbar-dropdown-backdrop{z-index:99;position:fixed;inset:0}.toolbar-dropdown{z-index:100;background:var(--bg-toolbar);border:1px solid var(--border-active);border-radius:var(--radius-lg);min-width:200px;box-shadow:0 8px 24px var(--shadow);padding:4px;animation:.12s ease-out dropdown-in;position:absolute;top:calc(100% + 6px);left:0}@keyframes dropdown-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.toolbar-dropdown-item{width:100%;color:var(--text);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;align-items:center;gap:10px;padding:8px 12px;font-size:12px;transition:background .12s,color .12s;display:flex}.toolbar-dropdown-item:hover:not(:disabled){background:var(--hover-bg);color:var(--text-bright)}.toolbar-dropdown-item:disabled{opacity:.35;cursor:not-allowed}.panel{background:var(--bg-panel);scrollbar-width:thin;scrollbar-color:var(--bg-card) transparent;overflow-y:auto}.properties-panel{flex-direction:column;display:flex}.panel-section{border-bottom:1px solid var(--border);padding:14px 12px}.panel-section--effects{flex-direction:column;flex:1;display:flex;overflow:hidden}.panel-section--shortcuts{border-bottom:none}.panel-label{text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);justify-content:space-between;align-items:center;margin-bottom:10px;font-size:10px;font-weight:500;display:flex}.viewport{background:var(--bg-base);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.viewport-info{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--text-muted);font-size:10px;font-family:var(--font-mono,"SFMono-Regular"), "SFMono-Regular", Consolas, monospace;z-index:5;white-space:nowrap;background:#1a1a1f99;border-radius:999px;align-items:center;gap:8px;max-width:calc(100% - 20px);padding:5px 12px 5px 5px;display:flex;position:absolute;bottom:10px;left:50%;overflow:hidden;transform:translate(-50%)}.viewport-info>span{white-space:nowrap}.viewport-info-sep{color:var(--text-muted);opacity:.2}@media (max-width:600px){.viewport-info{gap:6px;padding:4px 10px;font-size:9px}.viewport-info .viewport-info-sep{display:none}}.viewport-canvas{isolation:isolate;position:relative;overflow:hidden}.viewport-canvas .hero-bg,.viewport-canvas .hero-vignette,.viewport-canvas .ascii-overlay{position:absolute;inset:0}.viewport-canvas .hero-bg{background-position:50%;background-size:100% 100%;transform:scale(1.03)}.viewport-canvas .ascii-overlay{white-space:pre;-webkit-user-select:none;user-select:none;pointer-events:none;font-family:var(--font-mono), "JetBrains Mono", SFMono-Regular, Consolas, monospace;font-variant-ligatures:none;text-shadow:0 0 8px #ffffff0a,0 0 16px #8cb4ff08;margin:0;padding:0;font-weight:700}.drop-overlay{z-index:20;border:2px dashed var(--accent);color:var(--accent);background:#0a0a0ed9;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:12px;animation:1s ease-in-out infinite alternate drop-pulse;display:flex;position:absolute;inset:0}@keyframes drop-pulse{0%{border-color:#7defa066}to{border-color:#7defa0cc}}.drop-overlay-text{color:var(--accent);opacity:.8;font-size:14px}.timeline{background:var(--bg-panel);border-top:1px solid var(--border);flex-direction:column;grid-column:1/-1;display:flex}.timeline-controls{border-bottom:1px solid var(--bg-input);align-items:center;gap:10px;padding:6px 16px;display:flex}.timeline-btn{color:var(--text);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;font-size:14px;transition:color .12s,background .12s;display:inline-flex}.timeline-btn:hover{color:var(--text-bright);background:var(--hover-bg)}.timeline-btn-play{color:var(--accent);font-size:16px}.timeline-btn-play:hover{color:var(--accent);background:var(--accent-dim)}.timeline-btn-loop{color:var(--text-dim)}.timeline-btn-loop:hover{color:var(--accent)}.timeline-time{color:var(--text-dim);min-width:100px;font-family:SFMono-Regular,Consolas,monospace;font-size:11px}.timeline-tracks{flex:1;display:flex;overflow:hidden}.timeline-labels{border-right:1px solid var(--bg-input);flex-direction:column;flex-shrink:0;width:140px;font-size:11px;display:flex}.timeline-label{border-bottom:1px solid var(--bg-base);color:var(--text-bright);white-space:nowrap;text-overflow:ellipsis;align-items:center;height:24px;padding:4px 12px;display:flex;overflow:hidden}.timeline-label:first-child{margin-top:22px}.timeline-label--disabled{color:var(--text-muted)}.timeline-bars{cursor:pointer;flex-direction:column;flex:1;display:flex;position:relative}.timeline-ruler{color:var(--text-muted);border-bottom:1px solid var(--bg-input);-webkit-user-select:none;user-select:none;height:22px;padding:4px 0;font-size:9px;display:flex}.timeline-tick{text-align:center;flex:1}.timeline-playhead{z-index:10;pointer-events:none;width:1px;position:absolute;top:0;bottom:0}.timeline-playhead-head{background:var(--accent);clip-path:polygon(0 0,100% 0,50% 100%);border-radius:2px;width:8px;height:8px;position:absolute;top:2px;left:-3.5px}.timeline-playhead-line{background:var(--accent);opacity:.6;width:1px;position:absolute;top:10px;bottom:0;left:0}.timeline-bar{border-bottom:1px solid var(--bg-base);height:24px;padding:4px 8px}.timeline-bar-fill{background:var(--accent-bg);border-radius:4px;height:14px;transition:width .1s;position:relative}.timeline-bar-handle{cursor:col-resize;z-index:2;width:6px;position:absolute;top:0;bottom:0}.timeline-bar-handle--start{border-radius:3px 0 0 3px;left:-2px}.timeline-bar-handle--end{border-radius:0 3px 3px 0;right:-2px}.timeline-bar-handle:hover{background:#7defa066}.timeline-bar-handle:focus-visible{outline-offset:1px;background:#7defa080;outline:2px solid #7defa099}.timeline-setting{align-items:center;gap:3px;margin-left:8px;display:inline-flex}.timeline-setting-label{color:var(--text-muted);font-size:11px}.timeline-setting-input{border:1px solid var(--border);background:var(--bg-dark);width:42px;color:var(--text);text-align:center;-moz-appearance:textfield;border-radius:4px;padding:2px 4px;font-size:11px}.timeline-setting-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.timeline-setting-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.timeline-setting-unit{color:var(--text-muted);font-size:11px}.timeline-bar-fill--disabled{background:var(--bg-toolbar);border:1px dashed var(--bg-card)}.layer-item{border-radius:var(--radius);background:var(--bg-input);cursor:pointer;border:1px solid #0000;justify-content:space-between;align-items:center;margin-bottom:4px;padding:8px;font-size:11px;transition:background .12s,border-color .12s;display:flex}.layer-item:hover{background:var(--bg-card)}.layer-item--active{background:var(--bg-card);border-color:var(--border-active)}.layer-vis{cursor:pointer;opacity:.5;color:var(--text);background:0 0;border:none;font-size:12px;transition:opacity .15s;display:inline-flex}.layer-vis:hover{opacity:1}.effects-list{scrollbar-width:thin;scrollbar-color:var(--bg-card) transparent;flex:1;margin-bottom:8px;overflow-y:auto}.effect-card{background:var(--bg-input);border-radius:var(--radius);border:1px solid #0000;margin-bottom:4px;transition:border-color .15s}.effect-card:hover,.effect-card--expanded{border-color:var(--border-active)}.effect-card-drag{cursor:grab;color:var(--text-dim);align-items:center;margin-right:2px;padding:0 2px;display:flex}.effect-card-drag:active{cursor:grabbing}.effect-card--drag-over{border-top:2px solid var(--accent,#7defa0)}.effect-card[draggable]{transition:opacity .15s}.effect-card-header{cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:8px 10px;display:flex}.effect-card-title{align-items:center;gap:6px;font-size:11px;display:flex}.effect-card-caret{color:var(--text-muted);display:inline-flex}.effect-card-icon{color:var(--text-dim);display:inline-flex}.effect-card-name{font-weight:500}.effect-card-actions{align-items:center;gap:8px;display:flex}.effect-card-body{border-top:1px solid var(--border);padding:4px 10px 10px}.effect-card-region{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.effect-control{margin-bottom:6px}.effect-select{background:var(--bg-card);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:4px;outline:none;padding:3px 6px;font-size:10px;transition:border-color .12s}.effect-select:hover{border-color:var(--border-active)}.effect-select:focus{border-color:var(--accent)}.select-trigger{background:var(--bg-card);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:4px;outline:none;align-items:center;gap:4px;padding:3px 6px;font-size:10px;transition:border-color .12s;display:inline-flex}.select-trigger:hover{border-color:var(--border-active)}.select-trigger[data-state=open]{border-color:var(--accent)}.select-icon{color:var(--text-dim)}.select-content{background:var(--bg-toolbar);border:1px solid var(--border-active);box-shadow:0 8px 24px var(--shadow);z-index:200;min-width:var(--radix-select-trigger-width);border-radius:6px;padding:3px;animation:.1s ease-out menu-in}.select-viewport{flex-direction:column;gap:1px;display:flex}.select-item{color:var(--text);cursor:pointer;border-radius:4px;outline:none;justify-content:space-between;align-items:center;gap:8px;padding:5px 8px;font-size:11px;transition:background 80ms;display:flex}.select-item[data-highlighted]{background:var(--hover-bg);color:var(--text-bright)}.select-item[data-state=checked]{color:var(--accent)}.select-check{color:var(--accent);display:inline-flex}.effect-text-input{background:var(--bg-card);color:var(--text-bright);border:1px solid var(--border);border-radius:4px;outline:none;width:60px;padding:3px 8px;font-family:SFMono-Regular,Consolas,monospace;font-size:10px;transition:border-color .12s}.effect-text-input:focus{border-color:var(--accent)}.effect-color-input{border:1px solid var(--border);cursor:pointer;appearance:none;background:0 0;border-radius:4px;width:28px;height:22px;padding:0}.effect-color-input::-webkit-color-swatch-wrapper{padding:2px}.effect-color-input::-webkit-color-swatch{border:none;border-radius:2px}.color-list{flex-wrap:wrap;gap:4px;margin-top:4px;display:flex}.color-swatch-wrap{position:relative}.color-swatch{border:2px solid var(--border);cursor:pointer;appearance:none;background:0 0;border-radius:4px;width:28px;height:28px;padding:0}.color-swatch::-webkit-color-swatch-wrapper{border-radius:2px;padding:0;overflow:hidden}.color-swatch::-webkit-color-swatch{border:none;border-radius:2px}.color-swatch::-moz-color-swatch{border:none;border-radius:2px}.color-swatch:hover{border-color:var(--accent)}.color-remove{background:var(--danger);color:#fff;cursor:pointer;z-index:2;border:none;border-radius:50%;justify-content:center;align-items:center;width:14px;height:14px;padding:0;line-height:0;display:none;position:absolute;top:-5px;right:-5px}@media (pointer:coarse){.color-remove:after{content:"";position:absolute;inset:-15px}}.color-swatch-wrap:hover .color-remove{display:inline-flex}.color-add{border:1px dashed var(--border-active);width:28px;height:28px;color:var(--text-dim);cursor:pointer;background:0 0;border-radius:4px;justify-content:center;align-items:center;padding:0;line-height:0;display:inline-flex}.color-add:hover{border-color:var(--accent);color:var(--accent)}.effect-card-remove{border-radius:var(--radius);width:22px;height:22px;color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #0000;justify-content:center;align-items:center;padding:0;transition:color .12s,background .12s,border-color .12s;display:inline-flex}.effect-card-remove:hover{color:var(--danger);background:var(--danger-bg);border-color:color-mix(in srgb, var(--danger) 15%, transparent)}.effect-presets{border-top:1px solid var(--border);margin-top:4px;padding-top:8px}.preset-save-btn{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:4px;padding:2px 8px;font-size:11px}.preset-save-btn:hover{background:var(--hover-bg);color:var(--text)}.preset-list{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.preset-item{display:inline-flex;position:relative}.preset-load-btn{border:1px solid var(--border);background:var(--bg-card);color:var(--text);cursor:pointer;border-radius:6px;padding:5px 12px;font-size:11px;transition:background .12s,border-color .12s}.preset-load-btn:hover{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.preset-delete-btn{background:var(--danger);color:#fff;cursor:pointer;z-index:2;border:none;border-radius:50%;justify-content:center;align-items:center;width:14px;height:14px;padding:0;line-height:0;display:none;position:absolute;top:-5px;right:-5px}@media (pointer:coarse){.preset-delete-btn:after{content:"";position:absolute;inset:-15px}}.preset-item:hover .preset-delete-btn{display:inline-flex}.add-effect-wrap{z-index:100;padding:0 0 4px;position:relative}.add-effect-row{gap:6px;display:flex}.clear-effects-btn{border:1px solid var(--border);border-radius:var(--radius);width:34px;color:var(--text-dim);cursor:pointer;background:0 0;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:color .12s,background .12s,border-color .12s;display:inline-flex}.clear-effects-btn:hover{color:var(--danger);background:var(--danger-bg);border-color:color-mix(in srgb, var(--danger) 15%, transparent)}.add-effect-btn{background:var(--bg-card);border:1px dashed var(--border-active);border-radius:var(--radius);width:100%;color:var(--text);cursor:pointer;justify-content:center;align-items:center;gap:6px;padding:9px;font-size:11px;font-weight:500;transition:border-color .15s,color .15s,background .15s;display:flex}.add-effect-btn:hover{background:var(--bg-input);border-color:var(--text-dim);color:var(--text-bright)}.add-effect-menu{background:var(--bg-toolbar);border:1px solid var(--border-active);border-radius:var(--radius-lg);z-index:1000;max-height:300px;box-shadow:0 -8px 24px var(--shadow);padding:4px;animation:.12s ease-out menu-in;position:absolute;bottom:calc(100% + 4px);left:0;right:0;overflow-y:auto}@keyframes menu-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.add-effect-option{width:100%;color:var(--text);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;align-items:center;gap:10px;padding:7px 10px;font-size:12px;transition:background .12s,color .12s;display:flex}.add-effect-option:hover{background:var(--hover-bg);color:var(--text-bright)}.add-effect-option-icon{color:var(--text-dim);display:inline-flex}.tool-grid{grid-template-columns:repeat(4,1fr);gap:4px;display:grid}.tool-btn{background:var(--bg-card);border-radius:var(--radius);text-align:center;cursor:pointer;color:var(--text);border:1px solid #0000;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;font-size:14px;transition:border-color .15s,background .15s;display:flex}.tool-btn:hover{border-color:var(--text-muted);background:var(--bg-card)}.tool-btn--active{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.tool-shortcut{color:var(--text-muted);font-family:SFMono-Regular,Consolas,monospace;font-size:8px}.tool-btn--active .tool-shortcut{color:var(--accent);opacity:.6}.mask-actions{gap:6px;margin-bottom:8px;display:flex}.mask-btn{background:var(--bg-card);border-radius:var(--radius);text-align:center;color:var(--text);cursor:pointer;border:1px solid #0000;flex:1;padding:6px 8px;font-size:11px;transition:border-color .15s,color .15s}.mask-btn:hover{border-color:var(--text-muted)}.mask-btn--active{border-color:var(--accent);color:var(--accent)}.mask-clear-btn{border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text-muted);cursor:pointer;background:0 0;justify-content:center;align-items:center;gap:6px;margin-top:10px;padding:5px 8px;font-size:10px;transition:border-color .12s,color .12s;display:flex}.mask-clear-btn:hover{border-color:var(--text-dim);color:var(--text)}.shortcut-list{flex-direction:column;gap:4px;display:flex}.shortcut-item{color:var(--text-dim);justify-content:space-between;align-items:center;gap:8px;font-size:11px;display:flex}.shortcut-item>span:last-child{flex:1}.kbd-group{flex-shrink:0;order:2;align-items:center;gap:3px;display:inline-flex}.shortcut-item kbd{background:var(--bg-card);border:1px solid var(--border);min-width:18px;height:18px;color:var(--text);text-align:center;border-radius:3px;justify-content:center;align-items:center;padding:1px 5px;font-family:SFMono-Regular,Consolas,monospace;font-size:9px;display:inline-flex}.prop-row{justify-content:space-between;align-items:center;margin-bottom:6px;font-size:11px;display:flex}.prop-label{color:var(--text-dim)}.prop-value{color:var(--text-bright);font-family:SFMono-Regular,Consolas,monospace;font-size:10px}.prop-value--input{text-align:right;background:var(--bg-card);border:1px solid var(--border);width:52px;height:22px;color:var(--text-bright);box-sizing:border-box;border-radius:4px;outline:none;padding:0 6px;font-family:SFMono-Regular,Consolas,monospace;font-size:11px;transition:border-color .12s}.prop-value--input:hover{border-color:var(--border-active)}.prop-value--input:focus{border-color:var(--accent)}.prop-value-group{align-items:center;gap:4px;display:inline-flex}.prop-reset-btn{border:1px solid var(--border);background:var(--bg-card);width:22px;height:22px;color:var(--text-dim);cursor:pointer;border-radius:4px;justify-content:center;align-items:center;padding:0;transition:border-color .12s,color .12s,background .12s;display:inline-flex;position:relative}@media (pointer:coarse){.prop-reset-btn:after{content:"";position:absolute;inset:-11px}}.prop-reset-btn:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-dim)}.upload-overlay{z-index:10;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:16px;transition:background .2s;display:flex;position:absolute;inset:0}.upload-overlay:hover{background:#ffffff05}.upload-overlay-icon{opacity:.3;color:var(--text);font-size:48px}.upload-overlay-text{color:var(--text-dim);font-size:14px}.slider-root{touch-action:none;-webkit-user-select:none;user-select:none;align-items:center;width:100%;height:20px;display:flex;position:relative}.slider-track{background:var(--bg-card);border-radius:9999px;flex-grow:1;height:3px;position:relative}.slider-range{background:var(--accent);border-radius:9999px;height:100%;position:absolute}.slider-thumb{background:var(--text-bright);cursor:grab;border-radius:50%;width:12px;height:12px;transition:background .15s,transform .1s;display:block;position:relative}@media (pointer:coarse){.slider-thumb:after{content:"";position:absolute;inset:-16px}}.slider-thumb:hover{background:var(--accent);transform:scale(1.2)}.slider-thumb:active{cursor:grabbing}.switch-root{background:var(--text-muted);cursor:pointer;border:none;border-radius:8px;flex-shrink:0;width:28px;height:16px;padding:0;transition:background .15s;position:relative}.switch-root[data-state=checked]{background:var(--accent-bg)}.switch-thumb{background:var(--text-dim);border-radius:50%;width:12px;height:12px;transition:transform .15s,background .15s;display:block;transform:translate(2px)}.switch-root[data-state=checked] .switch-thumb{background:var(--accent);transform:translate(14px)}.toast-container{z-index:1000;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:24px;right:24px}.toast{background:var(--bg-toolbar);border:1px solid var(--border-active);border-radius:var(--radius-lg);box-shadow:0 4px 16px var(--shadow);color:var(--text);pointer-events:auto;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);align-items:center;gap:8px;padding:10px 14px;font-size:12px;animation:.2s ease-out toast-in;display:flex}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.toast--success .toast-icon{color:var(--accent)}.toast--info .toast-icon{color:var(--info)}.toast--warning .toast-icon{color:var(--warning)}.toast-text{flex:1}.toast-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:2px;transition:color .12s;display:inline-flex}.toast-close:hover{color:var(--text)}.perf-overlay{min-width:0;font:11px/1.4 var(--font-jb-mono), SFMono-Regular, Consolas, monospace;color:var(--accent);pointer-events:none;white-space:nowrap;opacity:1;align-items:center;padding:0 12px 0 10px;transition:opacity .12s,transform .16s cubic-bezier(.2,.9,.25,1);display:flex;transform:translate(0)}.confirm-overlay{background:var(--overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;animation:.15s fade-in;position:fixed;inset:0}.confirm-content{z-index:101;border:1px solid var(--border);background:var(--bg-panel);width:90%;max-width:360px;box-shadow:0 16px 48px var(--shadow);border-radius:12px;padding:20px 24px;animation:.15s fade-in;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.confirm-title{color:var(--text-bright);margin:0 0 6px;font-size:14px;font-weight:600}.confirm-desc{color:var(--text-muted);margin:0 0 18px;font-size:13px;line-height:1.5}.confirm-actions{justify-content:flex-end;gap:8px;display:flex}.confirm-btn{border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:6px 16px;font-size:13px;font-weight:500;transition:background .15s,border-color .15s}.confirm-btn--cancel{color:var(--text);background:0 0}.confirm-btn--cancel:hover{background:var(--hover-bg)}.confirm-btn--confirm{color:#ff6b6b;background:#ff505033;border-color:#ff505066}.confirm-btn--confirm:hover{background:#ff50504d;border-color:#ff505099}.preset-name-input{background:var(--bg-input,#1e1e24);border:1px solid var(--border,#222);width:100%;color:var(--text-bright,#fff);border-radius:6px;outline:none;margin-bottom:16px;padding:8px 12px;font-size:13px;transition:border-color .12s}.preset-name-input:focus{border-color:var(--accent,#7defa0)}.preset-name-input::placeholder{color:var(--text-dim,#666)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.editor{transition:grid-template-columns .2s}.editor--left-collapsed{grid-template-columns:48px 1fr 280px}.editor--right-collapsed{grid-template-columns:240px 1fr 36px}.editor--left-collapsed.editor--right-collapsed{grid-template-columns:48px 1fr 36px}.editor--timeline-collapsed{grid-template-rows:42px 1fr 36px}.panel--collapsed{flex-direction:column;align-items:center;gap:8px;padding:8px 0;display:flex;overflow:hidden}.panel--collapsed-right{align-items:center}.panel-collapse-header{justify-content:flex-end;align-items:center;padding:6px 8px 0;display:flex}.panel-collapse-header--right{justify-content:flex-start}.panel-collapse-btn{color:var(--text-dim);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:4px;transition:color .12s,background .12s;display:inline-flex}.panel-collapse-btn:hover{color:var(--text-bright);background:var(--hover-bg)}.panel-collapsed-tools{flex-direction:column;align-items:center;gap:4px;width:100%;padding:0 4px;display:flex}.panel-collapsed-tools .tool-btn{justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex}.panel-collapsed-label{writing-mode:vertical-rl;text-orientation:mixed;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);flex:1;justify-content:center;align-items:center;font-size:10px;font-weight:500;display:flex;transform:rotate(180deg)}.perf-hud-wrap{--perf-control-size:30px;z-index:10;pointer-events:none;display:flex;position:absolute;top:8px;right:8px}.perf-hud{min-height:var(--perf-control-size);pointer-events:auto;box-sizing:border-box;align-items:center;display:inline-flex}.perf-panel-clip{align-items:stretch;min-width:0;max-width:32rem;transition:max-width .18s cubic-bezier(.2,.9,.25,1);display:flex;overflow:hidden}.perf-hud[data-open=false] .perf-panel-clip{max-width:0}.perf-hud[data-open=false] .perf-overlay{opacity:0;transform:translate(8px)}.perf-toggle-btn{appearance:none;color:var(--text-dim);cursor:pointer;width:var(--perf-control-size);height:var(--perf-control-size);box-sizing:border-box;flex:0 0 var(--perf-control-size);font:11px/1.4 var(--font-jb-mono), SFMono-Regular, Consolas, monospace;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;padding:6px;line-height:0;transition:color .12s,background .12s,transform .16s cubic-bezier(.2,.9,.25,1),box-shadow .16s;display:inline-flex}.perf-hud--chip{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#121216f2;border:1px solid #ffffff14;border-radius:999px;transition:border-color .16s,box-shadow .16s,background .16s;overflow:hidden;box-shadow:0 4px 12px #0003}.perf-hud--chip .perf-toggle-btn{width:var(--perf-control-size);height:var(--perf-control-size);flex-basis:var(--perf-control-size);border-radius:inherit;box-shadow:none;background:0 0}.perf-hud--chip .perf-toggle-btn:hover{background:var(--hover-bg);color:var(--text-bright)}.perf-hud--chip[data-open=true]{border-color:#7defa038;box-shadow:0 14px 32px #0000004d,0 0 0 1px #7defa00d}.perf-hud--chip[data-open=true] .perf-toggle-btn{color:var(--accent);background:#7defa01f;transform:scale(1.03)}.perf-hud--chip .perf-overlay{padding-left:6px;padding-right:14px}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.brush-circle{pointer-events:none;z-index:9999;mix-blend-mode:difference;border:1.5px solid #fffc;border-radius:50%;display:none;position:fixed;transform:translate(-50%,-50%)}.zoom-btn{border:1px solid var(--border);width:20px;height:20px;color:var(--text-muted);cursor:pointer;aspect-ratio:1;background:0 0;border-radius:50%;flex:0 0 20px;justify-content:center;align-items:center;padding:0;font-size:11px;line-height:1;display:inline-flex;position:relative}@media (pointer:coarse){.zoom-btn:after{content:"";position:absolute;inset:-12px}}.zoom-btn:hover{background:var(--hover-bg)}@media (max-width:1024px){.editor{grid-template-columns:200px 1fr 240px}}@media (max-width:768px){.editor{grid-template-rows:auto 1fr auto auto;grid-template-columns:1fr}.toolbar{flex-wrap:wrap;gap:4px;height:auto;min-height:42px;padding:6px 12px}.panel{max-height:200px;overflow-y:auto}.timeline{max-height:120px}.viewport{min-height:300px}.toolbar-spacer{display:none}.toolbar-share{margin-left:auto}}@media (max-width:480px){.toolbar,.toolbar-item{padding:4px 8px;font-size:12px}.panel{max-height:160px;padding:8px}.panel-label{font-size:11px}}@media (max-width:375px){.toolbar-item span{display:none}.panel{max-height:140px;padding:6px}.viewport{min-height:240px}.timeline-controls{gap:2px}.timeline-setting-label{display:none}}
