@import"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap";:root{--font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--color-accent: #0079fe;--color-accent-hover: #0068dc;--color-accent-active: #0056b8;--color-accent-subtle: rgba(0, 121, 254, .12);--color-accent-text: #ffffff;--color-success: #22c55e;--color-warning: #f59e0b;--color-danger: #ef4444;--color-info: #0ea5e9;--radius-xs: 4px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 9999px;--transition-fast: .15s ease;--transition-normal: .25s ease;--kf-size: 10px;--kf-pill-height: 24px;--kf-pill-font: 10.5px}[data-theme=dark],:root:not([data-theme=light]){--bg-app: #121214;--bg-bento: #18181b;--bg-bento-subtle: #212124;--bg-bento-hover: #27272b;--bg-surface: #2d2d33;--bg-surface-active: #383840;--bg-surface-elevated: #33333a;--border-color: #27272b;--border-subtle: #212124;--border-active: #3e3e46;--border-focus: #0079fe;--text-primary: #f4f4f6;--text-secondary: #a1a1aa;--text-muted: #71717a;--text-disabled: #52525b;--bg-viewport: #151518;--viewport-grid: #232328;--timeline-track-bg: #141416;--timeline-ruler-bg: #1b1b1f;--timeline-timecode-bg: #222226;--timeline-playhead: #0079fe;--timeline-playhead-line: #0079fe;--timeline-keyframe-marker: #0079fe;--timeline-keyframe-selected: #ffffff;--timeline-clip-bg: rgba(0, 121, 254, .16);--timeline-clip-border: rgba(0, 121, 254, .4);--timeline-clip-text: #66b2ff;--timeline-clip-text-muted: rgba(102, 178, 255, .65);--timeline-lane-hover: rgba(255, 255, 255, .03)}[data-theme=light]{--bg-app: #f0f0f3;--bg-bento: #ffffff;--bg-bento-subtle: #f6f6f9;--bg-bento-hover: #ebebee;--bg-surface: #eaeaf0;--bg-surface-active: #dedee6;--bg-surface-elevated: #ffffff;--border-color: #e2e2e8;--border-subtle: #ececf2;--border-active: #c8c8d2;--border-focus: #0079fe;--text-primary: #18181b;--text-secondary: #52525b;--text-muted: #8e8e99;--text-disabled: #a1a1aa;--bg-viewport: #e7e7eb;--viewport-grid: #d5d5dc;--timeline-track-bg: #f7f7fa;--timeline-ruler-bg: #ebebef;--timeline-timecode-bg: #e2e2e8;--timeline-playhead: #0079fe;--timeline-playhead-line: #0079fe;--timeline-keyframe-marker: #0079fe;--timeline-keyframe-selected: #18181b;--timeline-clip-bg: rgba(0, 121, 254, .12);--timeline-clip-border: rgba(0, 121, 254, .35);--timeline-clip-text: #0068dc;--timeline-clip-text-muted: rgba(0, 104, 220, .6);--timeline-lane-hover: rgba(0, 121, 254, .05)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;box-shadow:none!important;outline:none!important;-webkit-tap-highlight-color:transparent}html,body{width:100vw;height:100vh;overflow:hidden;font-family:var(--font-family);background-color:var(--bg-app);color:var(--text-primary);font-size:13px;line-height:1.4;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.isax{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;stroke-width:1.5;stroke:currentColor;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;vertical-align:middle}.isax-sm{width:14px;height:14px}.isax-md{width:18px;height:18px}.isax-lg{width:22px;height:22px}.isax-xl{width:28px;height:28px}.isax-fill{fill:currentColor;stroke:none}strong,b,h1,h2,h3,h4,h5,h6{font-weight:400}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 12px;font-family:inherit;font-size:12px;font-weight:400;border-radius:var(--radius-md);border:1px solid var(--border-color);background-color:var(--bg-surface);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.btn:hover{background-color:var(--bg-surface-active);color:var(--text-primary)}.btn:active{transform:translateY(1px)}.btn-primary{background-color:var(--color-accent);border-color:var(--color-accent);color:#fff}.btn-primary:hover{background-color:var(--color-accent-hover);border-color:var(--color-accent-hover);color:#fff}.btn-primary:active{background-color:var(--color-accent-active)}.btn-ghost{background:transparent;border-color:transparent;color:var(--text-secondary)}.btn-ghost:hover{background-color:var(--bg-surface);color:var(--text-primary)}.btn-ghost.active{background-color:var(--bg-surface-active);color:var(--color-accent)}.btn-icon{width:32px;height:32px;padding:0;border-radius:var(--radius-md)}.btn-icon-sm{width:26px;height:26px;padding:0;border-radius:var(--radius-sm);font-size:11px}.form-group{display:flex;flex-direction:column;gap:6px}.form-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.form-label{font-size:11.5px;font-weight:400;color:var(--text-secondary);display:flex;align-items:center;gap:4px}.input-text,.input-search,.input-number{background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:6px 10px;font-family:inherit;font-size:12px;color:var(--text-primary);transition:border-color var(--transition-fast),background-color var(--transition-fast);width:100%}.input-text:focus,.input-search:focus,.input-number:focus{border-color:var(--border-focus);background-color:var(--bg-bento)}.search-wrap{position:relative;display:flex;align-items:center;width:100%}.search-wrap .isax{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--text-muted);pointer-events:none;display:flex;align-items:center;justify-content:center;transition:color var(--transition-fast);z-index:2}.search-wrap .isax svg{width:15px;height:15px}.search-wrap:focus-within .isax{color:var(--color-accent)}.search-wrap .input-search,#gallery-search-input{padding:8px 14px 8px 40px!important;border-radius:var(--radius-full);font-size:12px;line-height:1.2}.search-wrap .input-search::placeholder,#gallery-search-input::placeholder{color:var(--text-muted);opacity:.85}.vector-inputs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.vector-field{display:flex;align-items:center;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);overflow:hidden}.vector-tag{padding:4px 6px;font-size:10px;font-weight:400;background-color:var(--bg-bento-subtle);color:var(--text-muted);border-right:1px solid var(--border-color)}.vector-tag.tag-x{color:#ef4444}.vector-tag.tag-y{color:#22c55e}.vector-tag.tag-z{color:#3b82f6}.vector-field input{background:transparent;border:none;font-family:inherit;font-size:11.5px;font-weight:400;color:var(--text-primary);width:100%;padding:4px 6px;text-align:right}.slider-group{display:flex;align-items:center;gap:8px;width:100%}.slider-input{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:var(--radius-full);background-color:var(--border-active);outline:none}.slider-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:var(--radius-full);background-color:var(--color-accent);cursor:pointer;border:none;transition:transform var(--transition-fast)}.slider-input::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-value{font-size:11px;font-weight:400;color:var(--text-secondary);min-width:36px;text-align:right}.btn-keyframe-toggle{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;color:var(--text-muted);border-radius:var(--radius-xs);transition:all var(--transition-fast)}.btn-keyframe-toggle:hover{color:var(--text-primary);background-color:var(--bg-surface)}.btn-keyframe-toggle.active{color:var(--color-accent)}.btn-keyframe-toggle svg{width:12px;height:12px}.select-input{background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:6px 10px;font-family:inherit;font-size:12px;color:var(--text-primary);width:100%;cursor:pointer}.select-input:focus{border-color:var(--border-focus)}.color-picker-wrap{display:flex;align-items:center;gap:8px}.color-preview-box{width:32px;height:32px;border-radius:var(--radius-sm);border:1px solid var(--border-color);cursor:pointer;position:relative;overflow:hidden;flex-shrink:0}.color-preview-box input[type=color]{position:absolute;opacity:0;width:200%;height:200%;top:-50%;left:-50%;cursor:pointer}.color-swatches-preset{display:flex;gap:6px;flex-wrap:wrap}.color-swatch-dot{width:20px;height:20px;border-radius:var(--radius-full);border:1px solid var(--border-color);cursor:pointer;transition:transform var(--transition-fast)}.color-swatch-dot:hover{transform:scale(1.2)}.color-swatch-dot.active{border:2px solid var(--color-accent)}.screen-dropzone{border:2px dashed var(--border-color);border-radius:var(--radius-md);padding:16px 12px;background-color:var(--bg-bento-subtle);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;cursor:pointer;transition:all var(--transition-fast);position:relative}.screen-dropzone:hover,.screen-dropzone.drag-over{border-color:var(--color-accent);background-color:var(--color-accent-subtle)}.screen-dropzone-icon{width:36px;height:36px;border-radius:var(--radius-full);background-color:var(--bg-surface);display:flex;align-items:center;justify-content:center;color:var(--color-accent)}.screen-dropzone-title{font-size:12px;font-weight:400;color:var(--text-primary)}.screen-dropzone-desc{font-size:10.5px;color:var(--text-muted)}.screen-media-preview-container{display:none;flex-direction:column;gap:8px;width:100%}.screen-media-preview-box{width:100%;height:100px;border-radius:var(--radius-sm);background-color:#000;overflow:hidden;display:flex;align-items:center;justify-content:center;position:relative}.screen-media-preview-box img,.screen-media-preview-box video{max-width:100%;max-height:100%;object-fit:contain}.material-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--radius-full);font-size:10.5px;font-weight:400;background-color:var(--color-accent-subtle);color:var(--color-accent)}.segmented-control{display:flex;background-color:var(--bg-surface);border-radius:var(--radius-md);padding:3px;gap:2px}.segmented-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 8px;border-radius:var(--radius-sm);font-size:11.5px;font-weight:400;color:var(--text-secondary);background:transparent;border:none;cursor:pointer;transition:all var(--transition-fast)}.segmented-btn:hover{color:var(--text-primary)}.segmented-btn.active{background-color:var(--bg-bento);color:var(--text-primary)}.editor-section{background-color:var(--bg-bento-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:12px;display:flex;flex-direction:column;gap:12px}.editor-section-header{display:flex;align-items:center;justify-content:space-between}.editor-section-title{font-size:12px;font-weight:400;color:var(--text-primary);display:flex;align-items:center;gap:6px}.toast-container{display:none!important;position:fixed;bottom:24px;right:24px;flex-direction:column;gap:8px;z-index:9999;pointer-events:none}.toast{background-color:var(--bg-bento);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:10px 16px;display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:400;color:var(--text-primary);pointer-events:auto;animation:toastIn .2s ease}.toast.toast-accent{border-left:3px solid var(--color-accent)}.toast.toast-success{border-left:3px solid var(--color-success)}@keyframes toastIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.dropdown-wrapper{position:relative;display:inline-flex}.dropdown-trigger{display:inline-flex;align-items:center;gap:6px}.dropdown-trigger .isax-chevron{width:13px;height:13px;margin-left:2px;transition:transform var(--transition-fast);color:var(--text-secondary)}.dropdown-wrapper.active .dropdown-trigger .isax-chevron{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:1000;min-width:270px;background-color:var(--bg-bento);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:6px;display:flex;flex-direction:column;gap:2px;box-shadow:0 12px 32px #00000073;animation:dropdownFadeIn .15s ease-out}.dropdown-menu[hidden]{display:none}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{display:flex;align-items:center;gap:10px;padding:8px 10px;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;text-align:left;transition:background-color var(--transition-fast),color var(--transition-fast);width:100%}.dropdown-item:hover{background-color:var(--bg-surface-active)}.dropdown-item:active{background-color:var(--bg-surface)}.dropdown-item-icon{width:32px;height:32px;border-radius:var(--radius-xs);background-color:var(--bg-surface);display:flex;align-items:center;justify-content:center;color:var(--color-accent);flex-shrink:0;transition:background-color var(--transition-fast),color var(--transition-fast)}.dropdown-item:hover .dropdown-item-icon{background-color:var(--color-accent);color:#fff}.dropdown-item-content{display:flex;flex-direction:column;gap:2px;flex:1}.dropdown-item-title{font-size:12px;font-weight:500;color:var(--text-primary)}.dropdown-item-desc{font-size:10.5px;color:var(--text-secondary);line-height:1.25}.dropdown-divider{height:1px;background-color:var(--border-subtle);margin:4px 0}.render-settings-dropdown{position:fixed;top:58px;right:14px;z-index:1000;width:320px;max-width:calc(100vw - 24px);max-height:calc(100vh - 100px);overflow-y:auto;background-color:var(--bg-bento);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:14px;display:flex;flex-direction:column;gap:12px}.render-settings-dropdown[hidden]{display:none}.rsd-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.rsd-header strong{display:block;font-size:13px;color:var(--text-primary)}.rsd-header span{font-size:11px;color:var(--text-muted)}.rsd-presets{display:flex;align-items:center;justify-content:space-between;gap:8px}.rsd-presets .rsd-label{font-size:11px;font-weight:400;color:var(--text-secondary)}.pt-segmented{display:flex;align-items:center;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);overflow:hidden}.pt-segmented button{appearance:none;border:none;background:transparent;color:var(--text-secondary);font-family:inherit;font-size:11px;font-weight:400;padding:5px 9px;cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast)}.pt-segmented button+button{border-left:1px solid var(--border-color)}.pt-segmented button:hover{color:var(--text-primary);background-color:var(--bg-bento-hover)}.pt-segmented button.active{background-color:var(--color-accent);color:var(--color-accent-text)}.rsd-section{display:flex;flex-direction:column;gap:10px;padding-top:10px;border-top:1px solid var(--border-color)}.rsd-section h3{font-size:11px;font-weight:400;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.rsd-row{display:flex;flex-direction:column;gap:4px}.rsd-row>span{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--text-secondary)}.rsd-row output{font-weight:400;color:var(--text-primary)}.rsd-row input[type=range]{width:100%;height:14px;accent-color:var(--color-accent);cursor:pointer}.rsd-select{width:130px;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);font-family:inherit;font-size:11px;padding:4px 6px;cursor:pointer}.rsd-select:focus{border-color:var(--border-focus)}.hdri-editor-container{display:flex;flex-direction:column;gap:12px}.hdri-canvas-wrapper{position:relative;width:100%;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border-color);background-color:#0d0e12;box-shadow:inset 0 0 10px #00000080}#hdri-preview-canvas{width:100%;aspect-ratio:2 / 1;display:block;image-rendering:auto;cursor:crosshair}.hdri-canvas-tip{font-size:10px;font-weight:400;color:var(--text-muted);text-align:center;margin-top:-2px}.hdri-toolbar{display:flex;align-items:center;justify-content:space-between;gap:6px;background-color:var(--bg-bento-subtle);padding:4px 6px;border-radius:var(--radius-sm);border:1px solid var(--border-subtle)}.hdri-toolbar-left,.hdri-toolbar-right{display:flex;align-items:center;gap:4px}.hdri-layers-card{display:flex;flex-direction:column;gap:4px}.hdri-layers-box{display:flex;flex-direction:column;background-color:var(--bg-bento-subtle);border:1px solid var(--border-color);border-radius:var(--radius-sm);max-height:150px;overflow-y:auto}.hdri-layer-item{display:flex;align-items:center;gap:8px;padding:6px 10px;font-size:11.5px;cursor:pointer;border-bottom:1px solid var(--border-subtle);-webkit-user-select:none;user-select:none;transition:background-color var(--transition-fast)}.hdri-layer-item:last-child{border-bottom:none}.hdri-layer-item:hover{background-color:var(--bg-bento-hover)}.hdri-layer-item.active{background-color:#0079fe1f;border-left:2.5px solid var(--color-accent);color:var(--text-primary);font-weight:400}.hdri-layer-vis{cursor:pointer;color:var(--text-muted);font-size:11px}.hdri-layer-vis:hover{color:var(--text-primary)}.hdri-layer-swatch{width:10px;height:10px;border-radius:50%;border:1px solid rgba(255,255,255,.25);flex-shrink:0}.hdri-layer-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hdri-layer-badge{font-size:9.5px;font-weight:400;padding:1px 5px;border-radius:var(--radius-xs);background-color:var(--bg-surface);color:var(--text-secondary)}.hdri-layer-shadow{cursor:pointer;font-size:11px;opacity:.3;transition:opacity var(--transition-fast),transform var(--transition-fast)}.hdri-layer-shadow:hover{opacity:.8;transform:scale(1.2)}.hdri-layer-shadow.active{opacity:1;filter:drop-shadow(0 0 4px rgba(255,183,3,.6))}.hdri-layer-trash{opacity:.4;cursor:pointer;transition:opacity var(--transition-fast)}.hdri-layer-trash:hover{opacity:1;color:var(--color-danger)}.gobo-presets-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;width:100%}.gobo-preset-chip{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px 4px;background-color:var(--bg-bento-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none}.gobo-preset-chip:hover{background-color:var(--bg-bento-hover);border-color:#a855f766;transform:translateY(-1px)}.gobo-preset-chip.active{background:#a855f726;border-color:#a855f7;box-shadow:0 0 8px #a855f74d}.gobo-preset-chip .gobo-icon{font-size:15px;line-height:1}.gobo-preset-chip .gobo-label{font-size:10px;font-weight:500;color:var(--text-secondary)}.gobo-preset-chip.active .gobo-label{color:#d8b4fe;font-weight:600}.gobo-type-params{display:flex;flex-direction:column;gap:8px}#hdri-gobos-list .hdri-layer-item.active{background-color:#a855f71f;border-left:2.5px solid #a855f7;color:var(--text-primary)}.tier-badge{display:inline-flex;align-items:center;gap:3px;padding:2px 6px;font-size:9.5px;font-weight:700;letter-spacing:.5px;border-radius:var(--radius-sm);text-transform:uppercase;-webkit-user-select:none;user-select:none}.tier-badge.tier-free{background:var(--bg-surface);color:var(--text-secondary);border:1px solid var(--border-color)}.tier-badge.tier-pro{background:linear-gradient(135deg,#eab30833,#f59e0b4d);color:#facc15;border:1px solid rgba(234,179,8,.45);box-shadow:0 0 8px #eab30833}.tier-badge.tier-admin{background:linear-gradient(135deg,#a855f733,#ec489940);color:#f472b6;border:1px solid rgba(168,85,247,.4)}.user-profile-btn{display:inline-flex;align-items:center;gap:7px;padding:4px 8px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.user-profile-btn:hover{background:var(--bg-surface-active);border-color:var(--border-subtle)}.user-avatar-pill{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,var(--color-accent),#8b5cf6);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center}.user-account-dropdown-menu{min-width:250px;padding:10px}.user-profile-header{display:flex;align-items:center;gap:10px;padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid var(--border-color)}.user-profile-info{display:flex;flex-direction:column;gap:2px}.user-profile-name{font-size:12px;font-weight:600;color:var(--text-primary)}.user-profile-email{font-size:10.5px;color:var(--text-secondary)}.demo-account-switcher{display:flex;flex-direction:column;gap:4px;margin-top:6px}.demo-account-chip{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:var(--radius-sm);background:var(--bg-surface);border:1px solid var(--border-color);font-size:11px;cursor:pointer;transition:all var(--transition-fast);color:var(--text-primary)}.demo-account-chip:hover{background:var(--bg-surface-active);border-color:var(--color-accent)}.demo-account-chip.active{background:#0079fe1f;border-color:var(--color-accent);color:var(--color-accent)}.pro-modal-backdrop{position:fixed;inset:0;z-index:9999;background:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;pointer-events:none;transition:opacity .25s ease}.pro-modal-backdrop.open{opacity:1;pointer-events:auto}.pro-modal-card{width:100%;max-width:440px;background:var(--bg-bento);border:1px solid rgba(234,179,8,.35);border-radius:var(--radius-lg);padding:24px;box-shadow:0 20px 50px #0009,0 0 30px #eab30826;transform:scale(.95) translateY(10px);transition:transform .25s ease;position:relative;overflow:hidden}.pro-modal-backdrop.open .pro-modal-card{transform:scale(1) translateY(0)}.pro-modal-glow{position:absolute;top:-80px;right:-80px;width:200px;height:200px;background:radial-gradient(circle,rgba(234,179,8,.25) 0%,transparent 70%);pointer-events:none}.pro-modal-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}.pro-badge-pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;background:linear-gradient(135deg,#eab30840,#f59e0b59);border:1px solid rgba(234,179,8,.5);border-radius:999px;color:#fde047;font-size:11px;font-weight:700;letter-spacing:.5px}.pro-modal-title{font-size:18px;font-weight:700;color:var(--text-primary);margin-top:8px}.pro-modal-desc{font-size:12.5px;color:var(--text-secondary);line-height:1.5;margin-top:4px}.pro-features-list{display:flex;flex-direction:column;gap:10px;margin:18px 0;padding:12px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md)}.pro-feature-item{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-primary)}.pro-feature-item svg{color:#facc15;flex-shrink:0}.pro-modal-actions{display:flex;flex-direction:column;gap:8px;margin-top:18px}.btn-pro-action{width:100%;padding:10px 16px;background:linear-gradient(135deg,#eab308,#ca8a04);color:#000;font-weight:700;font-size:13px;border:none;border-radius:var(--radius-md);cursor:pointer;box-shadow:0 4px 14px #eab3084d;transition:all var(--transition-fast)}.btn-pro-action:hover{filter:brightness(1.1);transform:translateY(-1px)}.gallery-tab-switcher{display:flex;gap:4px;padding:3px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);margin-bottom:8px}.gallery-tab-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:5px 8px;font-size:11.5px;font-weight:500;color:var(--text-secondary);border:none;background:transparent;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.gallery-tab-btn.active{background:var(--bg-bento);color:var(--text-primary);font-weight:600;box-shadow:0 2px 6px #0003}.viewport-empty-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:10;pointer-events:none;transition:opacity .3s ease,visibility .3s ease}.viewport-empty-state.hidden{opacity:0;visibility:hidden}.empty-state-card{pointer-events:auto;text-align:center;max-width:380px;padding:28px 24px;background:#121216bf;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:0 16px 36px #0006}.empty-state-icon{width:52px;height:52px;margin:0 auto 14px;border-radius:50%;background:#0079fe1f;border:1px solid rgba(0,121,254,.3);display:flex;align-items:center;justify-content:center;color:#0079fe;font-size:24px}.empty-state-card h3{font-size:15px;font-weight:700;color:var(--text-primary);margin-bottom:6px}.empty-state-card p{font-size:12px;color:var(--text-secondary);line-height:1.5;margin-bottom:16px}.empty-state-card code{background:var(--bg-surface);padding:2px 5px;border-radius:4px;font-size:11px;color:#38bdf8}.empty-state-actions{display:flex;justify-content:center;gap:8px}#app{display:grid;grid-template-rows:52px 1fr 195px;grid-template-columns:290px 1fr 340px;gap:12px;width:100vw;height:100vh;padding:12px;background-color:var(--bg-app);overflow:hidden;-webkit-user-select:none;user-select:none}.app-cards-container{display:contents}.mobile-card-nav{display:none}.cards-deck-wrapper{display:contents}.top-bar{grid-row:1;grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;height:52px;padding:0 16px;background-color:var(--bg-bento);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);flex-shrink:0;z-index:100}.top-bar-left{display:flex;align-items:center;gap:16px}.brand-logo{display:flex;align-items:center;gap:10px;font-weight:400;font-size:15px;color:var(--text-primary);letter-spacing:-.3px;cursor:pointer}.brand-icon{width:32px;height:32px;background-color:var(--color-accent);color:#fff;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-weight:400;font-size:16px}.project-meta{display:flex;align-items:center;gap:8px;padding-left:12px;border-left:1px solid var(--border-color)}.project-title-input{background:transparent;border:none;font-size:13px;font-weight:400;color:var(--text-primary);font-family:inherit;width:180px;padding:4px 6px;border-radius:var(--radius-sm);transition:background var(--transition-fast)}.project-title-input:hover,.project-title-input:focus{background-color:var(--bg-surface)}.save-badge{font-size:11px;font-weight:400;color:var(--color-success);display:flex;align-items:center;gap:4px}.save-dot{width:6px;height:6px;background-color:var(--color-success);border-radius:var(--radius-full)}.top-bar-center{display:flex;align-items:center;gap:8px}.top-bar-right{display:flex;align-items:center;gap:10px}.top-bar-divider{width:1px;height:20px;background-color:var(--border-color);margin:0 4px}.bento-card{background-color:var(--bg-bento);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);display:flex;flex-direction:column;overflow:hidden;position:relative;min-width:0;min-height:0}.panel-header{display:flex;align-items:center;justify-content:space-between;height:48px;padding:0 16px;background-color:var(--bg-bento-subtle);border-bottom:1px solid var(--border-color);flex-shrink:0}.panel-title{font-size:13px;font-weight:400;color:var(--text-primary);display:flex;align-items:center;gap:8px;letter-spacing:-.2px}.panel-actions{display:flex;align-items:center;gap:6px}.panel-content{flex:1;overflow-y:auto;min-height:0;padding:14px;display:flex;flex-direction:column;gap:16px}.viewport-panel{grid-row:2;grid-column:2;position:relative;background-color:#0b0b0d;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:16px;-webkit-user-select:none;user-select:none}#viewport-canvas-container{position:relative;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 32px #000000b3,0 0 0 1px #ffffff1a;border-radius:6px;overflow:hidden;flex-shrink:0;margin:auto;background-color:#151518;transition:width .2s cubic-bezier(.4,0,.2,1),height .2s cubic-bezier(.4,0,.2,1)}#viewport-canvas-container canvas{width:100%!important;height:100%!important;display:block}.viewport-top-controls{position:absolute;top:14px;left:14px;display:none;align-items:center;gap:8px;z-index:10}.viewport-top-right-controls{position:absolute;top:14px;right:14px;display:flex;align-items:center;gap:8px;z-index:10}.floating-pill{background-color:var(--bg-bento);border:1px solid var(--border-color);border-radius:var(--radius-full);padding:4px 8px;display:flex;align-items:center;gap:4px}.viewport-drop-overlay{position:absolute;inset:12px;border-radius:var(--radius-md);border:2px dashed var(--color-accent);background-color:#0079fe14;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:50;pointer-events:none}.viewport-drop-overlay.active{display:flex}.drop-overlay-content{background-color:var(--bg-bento);padding:16px 24px;border-radius:var(--radius-lg);border:1px solid var(--border-color);display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}.drop-overlay-content h4{font-size:14px;font-weight:400;color:var(--text-primary)}.drop-overlay-content p{font-size:12px;color:var(--text-secondary)}.viewport-loading-overlay{position:absolute;inset:0;background-color:#151518bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:60;transition:opacity .3s ease}.viewport-loading-overlay.active{display:flex}.viewport-loading-spinner{width:36px;height:36px;border:3px solid rgba(255,255,255,.15);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.viewport-loading-text{font-size:13px;font-weight:400;color:var(--text-primary)}.viewport-loading-bar-wrap{width:180px;height:4px;background-color:#ffffff1a;border-radius:2px;overflow:hidden}.viewport-loading-bar{height:100%;width:0%;background-color:var(--color-accent);transition:width .15s ease}#card-gallery{grid-row:2 / -1;grid-column:1}.gallery-panel{display:flex;flex-direction:column}.gallery-search{padding:12px 14px 6px;display:flex;flex-direction:column;gap:10px}.gallery-search .search-wrap .input-search{padding-left:40px!important}.category-chips{display:flex;gap:5px;align-items:center;justify-content:space-between;overflow-x:auto;overflow-y:visible;padding:2px 2px 6px;scrollbar-width:none}.category-chips::-webkit-scrollbar{display:none}.category-chip{position:relative;width:32px;height:32px;min-width:32px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-md);background-color:var(--bg-surface);color:var(--text-secondary);cursor:pointer;white-space:nowrap;transition:all var(--transition-fast);border:1px solid transparent;flex-shrink:0}.category-chip .isax{width:16px;height:16px;display:flex;align-items:center;justify-content:center;pointer-events:none}.category-chip .isax svg{width:16px;height:16px}.category-chip:hover{color:var(--text-primary);background-color:var(--bg-surface-active);border-color:var(--border-color);transform:translateY(-1px)}.category-chip.active{background-color:var(--color-accent);color:#fff;border-color:var(--color-accent);box-shadow:0 2px 8px #0066ff4d}.category-chip.active .isax{color:#fff}.category-chip:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%) translateY(4px);background-color:var(--bg-surface-elevated, #2a2a32);color:var(--text-primary, #ffffff);font-size:11px;font-weight:400;padding:3px 8px;border-radius:var(--radius-sm, 4px);white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .15s ease,transform .15s ease,visibility .15s ease;box-shadow:0 4px 12px #0006;border:1px solid var(--border-color);z-index:100}.category-chip:hover:after{opacity:1;visibility:visible;transform:translate(-50%) translateY(0)}.mockup-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:0 14px 14px;overflow-y:auto}.mockup-item-card{background-color:var(--bg-bento-subtle);border-radius:var(--radius-md);padding:10px;cursor:pointer;transition:all var(--transition-fast);display:flex;flex-direction:column;align-items:center;gap:8px;border:1px solid transparent;position:relative}.mockup-item-card:hover{background-color:var(--bg-bento-hover);border-color:var(--border-color)}.mockup-item-card.selected{background-color:var(--bg-bento-subtle);border-color:var(--color-accent)}.mockup-thumb-wrap{width:100%;height:80px;background-color:var(--bg-surface);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);overflow:hidden}.mockup-thumb-wrap svg{width:44px;height:44px}.mockup-info{width:100%;text-align:left}.mockup-name{font-size:12px;font-weight:400;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mockup-meta{font-size:10.5px;color:var(--text-muted);display:flex;align-items:center;gap:4px;margin-top:2px}#card-editor{grid-row:2 / -1;grid-column:3}.editor-panel{display:flex;flex-direction:column}.editor-tabs-nav{display:flex;background-color:var(--bg-bento-subtle);border-bottom:1px solid var(--border-color);padding:4px 8px;gap:4px}.editor-tab-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:34px;border-radius:var(--radius-md);font-size:12px;font-weight:400;color:var(--text-secondary);background:transparent;border:none;cursor:pointer;transition:all var(--transition-fast)}.editor-tab-btn:hover{color:var(--text-primary);background-color:var(--bg-surface)}.editor-tab-btn.active{background-color:var(--bg-surface-active);color:var(--color-accent)}.tab-pane{display:none;flex-direction:column;gap:16px}.tab-pane.active{display:flex}#card-timeline{grid-row:3;grid-column:2}.timeline-container{height:100%;flex-shrink:0;display:flex;flex-direction:column;overflow:hidden;background-color:var(--bg-bento);border-radius:var(--radius-lg);border:1px solid var(--border-subtle)}.timeline-top-bar{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 16px;background-color:var(--bg-bento-subtle);border-bottom:1px solid var(--border-color);flex-shrink:0}.timeline-playback-controls{display:flex;align-items:center;gap:6px}.timeline-timecode-box{display:flex;align-items:center;gap:6px;background-color:var(--timeline-timecode-bg);padding:4px 10px;border-radius:var(--radius-sm);font-family:DM Mono,monospace,sans-serif;font-size:12px;font-weight:400;color:var(--text-primary);letter-spacing:.5px}.timeline-timecode-box span.separator,.timeline-timecode-box span.total-time{color:var(--text-muted)}.timeline-body-wrap{display:flex;flex:1;overflow:hidden;position:relative;min-height:0}.timeline-track-headers{width:180px;flex-shrink:0;background-color:var(--bg-bento-subtle);border-right:1px solid var(--border-color);display:flex;flex-direction:column;overflow:hidden}.timeline-ruler-header-spacer{height:30px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;padding:0 12px;font-size:11px;font-weight:400;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.track-header-item{height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid var(--border-subtle);font-size:11.5px;font-weight:400;color:var(--text-secondary)}.track-header-item.video-track-header{height:46px;background-color:var(--bg-surface);font-weight:400;color:var(--text-primary)}.timeline-scroll-area{flex:1;overflow-x:auto;overflow-y:hidden;position:relative;background-color:var(--timeline-track-bg);min-height:0}@media(max-width:1180px)and (min-width:901px){#app{grid-template-columns:240px 1fr 300px;gap:8px;padding:8px}}@media(max-width:900px){#app{display:flex;flex-direction:column;width:100vw;height:100dvh;padding:8px;gap:8px;overflow:hidden}.top-bar{height:44px;padding:0 10px;border-radius:var(--radius-md);flex-shrink:0}.brand-logo{font-size:13px;gap:8px}.brand-icon{width:26px;height:26px;font-size:12px}.project-meta{display:none}.top-bar-center{gap:4px}#btn-top-bar-export{padding:5px 8px;font-size:11px}#btn-top-bar-export span:last-child{display:none}#viewport-panel{flex:1 1 52%;min-height:200px;border-radius:var(--radius-lg);border:1px solid var(--border-subtle);background-color:var(--bg-viewport);position:relative;overflow:hidden}.viewport-top-controls{top:8px;left:8px;gap:6px}.viewport-top-right-controls{top:8px;right:8px}.app-cards-container{display:flex;flex-direction:column;flex:1 1 48%;min-height:200px;background-color:var(--bg-bento);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);overflow:hidden;position:relative}.mobile-card-nav{display:flex;align-items:center;justify-content:space-between;height:38px;background-color:var(--bg-bento-subtle);border-bottom:1px solid var(--border-color);padding:3px 6px;gap:4px;flex-shrink:0;z-index:10}.mobile-card-nav-btn{flex:1;height:30px;display:inline-flex;align-items:center;justify-content:center;gap:5px;background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-secondary);font-size:11px;font-weight:400;cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none}.mobile-card-nav-btn:hover{color:var(--text-primary);background-color:var(--bg-surface)}.mobile-card-nav-btn.active{background-color:var(--color-accent);color:#fff}.cards-deck-wrapper{display:flex;flex:1;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-behavior:smooth;position:relative;min-height:0}.cards-deck-wrapper::-webkit-scrollbar{display:none}.card-item{flex:0 0 100%;width:100%;height:100%;min-height:0;scroll-snap-align:start;scroll-snap-stop:always;border:none!important;border-radius:0!important;background:transparent!important;display:flex;flex-direction:column;overflow-y:auto}.timeline-container{height:100%!important}.timeline-top-bar{height:38px;padding:0 8px}.timeline-playback-controls{gap:4px}.timeline-timecode-box{padding:3px 6px;font-size:11px}.timeline-track-headers{width:115px}.timeline-ruler-header-spacer{padding:0 8px;font-size:10px}.track-header-item{padding:0 8px;font-size:10.5px}.track-header-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mockup-grid{grid-template-columns:repeat(2,1fr);gap:8px;padding:0 10px 10px}.mockup-thumb-wrap{height:65px}.mockup-thumb-wrap svg{width:36px;height:36px}.mockup-name{font-size:11.5px}.editor-tabs-nav{padding:3px 6px;gap:3px}.editor-tab-btn{height:30px;font-size:11px;gap:4px}.panel-content{padding:10px;gap:12px}}.timeline-view{display:flex;flex-direction:column;height:100%;width:100%;position:relative;background-color:var(--timeline-track-bg)}.timeline-ruler-track{height:30px;background-color:var(--timeline-ruler-bg);border-bottom:1px solid var(--border-color);position:relative;width:2000px;cursor:pointer;-webkit-user-select:none;user-select:none}.ruler-ticks-canvas{width:100%;height:100%;display:block}.timeline-playhead-cursor{position:absolute;top:0;left:120px;width:2px;height:100%;background-color:var(--timeline-playhead-line);border-radius:var(--radius-full);z-index:50;pointer-events:none}.playhead-head{position:absolute;top:5px;left:-6px;width:14px;height:14px;background-color:var(--timeline-playhead);border-radius:var(--radius-full);border:2px solid var(--bg-app);cursor:ew-resize;pointer-events:auto}.timeline-tier-video{height:46px;padding:5px 0;background-color:var(--timeline-track-bg);border-bottom:1px solid var(--border-color);position:relative;width:2000px;display:flex;align-items:center}.video-media-clip{position:absolute;left:4px;width:600px;height:36px;background-color:var(--timeline-clip-bg);border:1px solid var(--timeline-clip-border);border-radius:10px;display:flex;align-items:center;padding:0 12px;gap:8px;overflow:hidden;cursor:grab}.video-media-clip .isax{width:15px;height:15px;flex-shrink:0;color:var(--timeline-clip-text)}.video-clip-info{display:flex;flex-direction:column;gap:1px;min-width:0}.video-clip-title{font-size:11.5px;font-weight:400;color:var(--timeline-clip-text);white-space:nowrap}.video-clip-duration{font-size:9.5px;font-weight:400;color:var(--timeline-clip-text-muted);white-space:nowrap;letter-spacing:.3px}.timeline-tier-keyframes{display:flex;flex-direction:column;width:2000px;flex:1}.keyframe-track-lane{height:40px;border-bottom:1px solid var(--border-subtle);position:relative;display:flex;align-items:center}.keyframe-track-lane:nth-child(2n){background-color:#ffffff04}.keyframe-track-lane:hover{background-color:var(--timeline-lane-hover);cursor:copy}.keyframe-pill{position:absolute;top:50%;transform:translateY(-50%);display:flex;align-items:stretch;height:28px;border-radius:8px;background-color:var(--color-accent-subtle);border:1px solid var(--color-accent);color:var(--color-accent);overflow:hidden;cursor:grab;-webkit-user-select:none;user-select:none;transition:background-color var(--transition-fast),color var(--transition-fast);z-index:20}.keyframe-pill-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:0 8px;overflow:hidden}.keyframe-pill-time{font-size:10px;font-weight:400;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.keyframe-pill-sub{font-size:8.5px;font-weight:400;line-height:1.25;opacity:.75;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.keyframe-pill-handle{width:9px;flex-shrink:0;position:relative;cursor:ew-resize}.keyframe-pill-handle:before{content:"";position:absolute;top:7px;bottom:7px;left:3.5px;width:2px;border-radius:var(--radius-full);background-color:currentColor;opacity:.5;transition:opacity var(--transition-fast)}.keyframe-pill:hover .keyframe-pill-handle:before{opacity:.95}.keyframe-pill:hover,.keyframe-pill.selected{background-color:var(--color-accent);color:var(--color-accent-text)}.keyframe-connector-line{position:absolute;top:50%;height:2px;border-radius:var(--radius-full);background-color:var(--color-accent);opacity:.35;transform:translateY(-50%);pointer-events:none}.export-overlay{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;background:#09090bb8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.export-overlay.active{display:flex}.export-modal{width:min(440px,calc(100vw - 32px));padding:20px;border-radius:var(--radius-lg, 16px);box-shadow:0 24px 64px #00000073}.export-modal-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.export-modal-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:400;color:var(--text-primary, #fafafa)}.export-modal-title .isax{color:var(--color-accent)}.export-progress-bar-wrap{margin-top:14px;height:8px;border-radius:999px;background:var(--bg-tertiary, #27272a);overflow:hidden}.export-progress-bar{height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--color-accent),#7c9cff);transition:width .18s ease-out}.export-phase-desc{margin-top:10px;font-size:12px;color:var(--text-muted, #a1a1aa);min-height:16px}.export-stats-row{margin-top:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.export-stat{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-radius:10px;background:var(--bg-secondary, #18181b)}.export-stat-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted, #a1a1aa)}.export-stat-value{font-family:DM Mono,monospace;font-size:13px;font-weight:400;color:var(--text-primary, #fafafa)}[data-theme=light] .export-overlay{background:#18181b73}.virtual-canvas-modal-backdrop{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;background-color:#000000b8;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;transition:opacity var(--transition-normal)}.virtual-canvas-modal-backdrop.active{display:flex;opacity:1}.virtual-canvas-modal{display:flex;flex-direction:column;width:90vw;max-width:920px;height:85vh;max-height:740px;background-color:var(--bg-bento);border:1px solid var(--border-color);border-radius:var(--radius-xl);box-shadow:0 24px 48px -12px #000000a6;overflow:hidden;animation:vcModalIn .22s cubic-bezier(.16,1,.3,1)}@keyframes vcModalIn{0%{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.virtual-canvas-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border-color);background-color:var(--bg-bento-subtle)}.virtual-canvas-title-group{display:flex;align-items:center;gap:10px}.virtual-canvas-title{font-size:14px;font-weight:400;color:var(--text-primary);display:flex;align-items:center;gap:8px}.virtual-canvas-badge{font-size:10px;font-weight:400;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:var(--radius-full);background-color:var(--color-accent-subtle);color:var(--color-accent)}.virtual-canvas-subtitle{font-size:11.5px;color:var(--text-muted)}.virtual-canvas-body{flex:1;position:relative;display:flex;align-items:center;justify-content:center;padding:24px;background-color:var(--bg-app);overflow:hidden;-webkit-user-select:none;user-select:none}.virtual-canvas-preview-wrapper{position:relative;display:flex;align-items:center;justify-content:center;max-width:100%;max-height:100%;border-radius:var(--radius-md);border:1px solid var(--border-color);overflow:hidden;box-shadow:0 8px 24px #0006;cursor:grab;background-image:linear-gradient(45deg,var(--bg-surface) 25%,transparent 25%),linear-gradient(-45deg,var(--bg-surface) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--bg-surface) 75%),linear-gradient(-45deg,transparent 75%,var(--bg-surface) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0px}.virtual-canvas-preview-wrapper.is-dragging{cursor:grabbing}.virtual-canvas-preview-canvas{display:block;max-width:100%;max-height:100%;object-fit:contain}.virtual-canvas-hint{position:absolute;bottom:14px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:6px 14px;border-radius:var(--radius-full);background-color:#18181bd9;border:1px solid var(--border-color);font-size:11px;font-weight:400;color:var(--text-secondary);pointer-events:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.virtual-canvas-loading{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;background-color:#121214d9;z-index:10;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.virtual-canvas-loading.active{display:flex}.virtual-canvas-spinner{width:32px;height:32px;border:3px solid var(--border-color);border-top-color:var(--color-accent);border-radius:50%;animation:vcSpin .7s linear infinite}@keyframes vcSpin{to{transform:rotate(360deg)}}.virtual-canvas-footer{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-top:1px solid var(--border-color);background-color:var(--bg-bento-subtle);gap:16px;flex-wrap:wrap}.virtual-canvas-controls-group{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.virtual-canvas-mode-group{display:flex;align-items:center;padding:3px;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);gap:2px}.vc-mode-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;font-size:11.5px;font-weight:400;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.vc-mode-btn.active{background-color:var(--bg-bento);color:var(--text-primary);box-shadow:0 2px 6px #00000040}.virtual-canvas-zoom-control{display:flex;align-items:center;gap:8px}.virtual-canvas-zoom-slider{width:110px;height:4px;-webkit-appearance:none;appearance:none;background:var(--bg-surface-active);border-radius:var(--radius-full);outline:none}.virtual-canvas-zoom-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--color-accent);cursor:pointer;box-shadow:0 0 0 2px var(--bg-bento)}.virtual-canvas-zoom-val{font-size:11px;font-weight:400;color:var(--text-secondary);min-width:38px}.virtual-canvas-bg-control{display:none;align-items:center;gap:8px}.virtual-canvas-bg-control.active{display:flex}.vc-color-swatch-wrapper{position:relative;width:24px;height:24px;border-radius:var(--radius-sm);border:1px solid var(--border-color);overflow:hidden;cursor:pointer}.vc-color-input{position:absolute;inset:-10px;width:200%;height:200%;opacity:0;cursor:pointer}.vc-color-preview{width:100%;height:100%;background-color:#000}.virtual-canvas-actions{display:flex;align-items:center;gap:8px;margin-left:auto}