.empty-state,.error-state,.processing-state{text-align:center;max-width:400px}.studio-app{margin:0;padding:0;height:100vh;overflow:hidden;display:flex;flex-direction:column}.studio-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;background-color:var(--color-bg);border-bottom:1px solid var(--color-border);flex-shrink:0}.studio-header-left{display:flex;align-items:center;gap:var(--spacing-md)}.studio-logo{height:28px;width:auto}.studio-name{font-family:var(--font-family);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:hsl(var(--foreground))}.dropdown-item,.user-avatar{font-size:var(--font-size-sm)}.sidebar-title,.user-avatar{font-weight:600}.studio-header-center{flex:1}.studio-header-right{display:flex;align-items:center;gap:var(--spacing-lg)}.btn-group,.checkbox-group,.completed-actions,.preview-actions{gap:var(--spacing-sm)}.user-menu{position:relative}.user-avatar{width:36px;height:36px;border-radius:50%;background-color:var(--color-primary);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.dropdown-item,.dropdown-item:hover,.sidebar-title{color:var(--color-text)}.btn-toggle,.user-dropdown{border:1px solid var(--color-border)}.user-avatar:hover{background-color:var(--color-primary-hover)}.user-dropdown{position:absolute;top:calc(100% + .5rem);right:0;min-width:180px;background-color:var(--color-bg);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:.5rem 0;display:none;z-index:1000}.dropdown-item:hover,.studio-sidebar{background-color:var(--color-bg-alt)}.user-dropdown.active{display:block}.dropdown-item{display:block;padding:.625rem 1rem;transition:background-color var(--transition-fast)}.sidebar-title,.upload-text{font-size:var(--font-size-base)}.dropdown-divider{margin:.5rem 0;border:none;border-top:1px solid var(--color-border)}.sidebar-title,.upload-icon{margin-bottom:var(--spacing-md)}.studio-layout{display:flex;flex:1;overflow:hidden}.studio-sidebar{width:320px;border-right:1px solid var(--color-border);overflow-y:auto;flex-shrink:0}.btn-toggle,.setting-select,.upload-zone{background-color:var(--color-bg);cursor:pointer}.sidebar-section{padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.upload-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-xl);border:2px dashed var(--color-border);border-radius:var(--radius-lg);transition:all var(--transition-base)}.upload-zone.drag-over,.upload-zone:hover{border-color:var(--color-primary);background-color:var(--color-primary-light)}.upload-icon{color:var(--color-text-light)}.upload-text{font-weight:500;color:var(--color-text);margin-bottom:var(--spacing-xs)}.upload-subtext{font-size:var(--font-size-sm);color:var(--color-text-light);margin-bottom:var(--spacing-md)}.upload-formats{font-size:var(--font-size-xs);color:var(--color-text-light);text-align:center;margin-top:var(--spacing-md);margin-bottom:0}.btn-toggle,.progress-text,.setting-label,.setting-select,.slider-value{font-size:var(--font-size-sm)}.setting-group{margin-bottom:var(--spacing-lg)}.empty-state h2,.setting-label{margin-bottom:var(--spacing-sm)}.setting-label{display:block;font-weight:500;color:var(--color-text)}.btn-group{display:flex}.btn-toggle{flex:1;padding:.5rem 1rem;font-weight:500;color:var(--color-text-secondary);border-radius:var(--radius-md);transition:all var(--transition-fast)}.btn-toggle:hover{background-color:var(--color-bg-alt)}.btn-toggle.active,input[type=checkbox]:checked+.switch-slider{background-color:var(--color-primary)}.btn-toggle.active{color:#fff;border-color:var(--color-primary)}.setting-select{width:100%;padding:.5rem .75rem;color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-md)}.btn-icon,.empty-state p,.progress-text,.slider-value{color:var(--color-text-secondary)}.setting-slider{width:100%;height:6px;border-radius:var(--radius-full);background:var(--color-border);outline:0;-webkit-appearance:none;appearance:none}.setting-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--color-primary);cursor:pointer}.setting-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--color-primary);cursor:pointer;border:none}.slider-value{margin-top:var(--spacing-sm)}.checkbox-group{display:flex;flex-direction:column}.checkbox-switch{position:relative;padding-left:3rem}.switch-slider{position:absolute;left:0;top:0;width:44px;height:24px;background-color:var(--color-border);border-radius:var(--radius-full);transition:background-color var(--transition-base);cursor:pointer}.switch-slider::before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;background-color:#fff;border-radius:50%;transition:transform var(--transition-base)}input[type=checkbox]:checked+.switch-slider::before{transform:translateX(20px)}.studio-main{flex:1;background-color:var(--color-bg);overflow-y:auto;display:flex;align-items:center;justify-content:center}.studio-state{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:var(--spacing-2xl)}.empty-icon{width:80px;height:80px;margin-bottom:var(--spacing-lg);opacity:.5}.empty-state h2{font-size:var(--font-size-2xl)}.empty-state p{margin-bottom:0}.preview-container{width:100%;height:100%;display:flex;flex-direction:column}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.preview-actions{display:flex}.btn-icon{padding:.5rem;background:0 0;border:none;cursor:pointer;border-radius:var(--radius-md);transition:all var(--transition-fast)}.btn-icon:hover{background-color:var(--color-bg-alt);color:var(--color-text)}.preview-content{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--spacing-2xl);overflow:auto}.preview-content img,.preview-content video{max-width:100%;max-height:100%;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}.spinner{width:60px;height:60px;margin:0 auto var(--spacing-lg);border:4px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:1s linear infinite spin}.progress-bar,.progress-fill{border-radius:var(--radius-full)}@keyframes spin{to{transform:rotate(360deg)}}.progress-bar{width:100%;height:8px;background-color:var(--color-border);overflow:hidden;margin:var(--spacing-lg) 0 var(--spacing-sm)}.progress-fill{height:100%;background-color:var(--color-primary);transition:width var(--transition-base)}.completed-state{width:100%;height:100%;display:flex;flex-direction:column}.completed-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.completed-actions{display:flex}.result-preview{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--spacing-2xl)}.error-icon{font-size:4rem;margin-bottom:var(--spacing-lg)}@media (max-width:768px){.studio-sidebar{position:fixed;left:-320px;top:60px;bottom:0;z-index:100;transition:left var(--transition-base)}.studio-sidebar.active{left:0}}