:root{--bg-primary: #000000;--bg-secondary: rgba(28, 28, 30, .8);--bg-tertiary: rgba(44, 44, 46, .8);--bg-overlay: rgba(0, 0, 0, .4);--bg-glass: rgba(28, 28, 30, .7);--accent-primary: #007AFF;--accent-secondary: #5AC8FA;--accent-dark: #0051D5;--accent-error: #FF3B30;--accent-success: #34C759;--text-primary: rgba(255, 255, 255, 1);--text-secondary: rgba(255, 255, 255, .6);--text-tertiary: rgba(255, 255, 255, .4);--text-inverse: #000000;--border-color: rgba(255, 255, 255, .1);--border-hover: rgba(255, 255, 255, .2);--space-xs: .5rem;--space-sm: 1rem;--space-md: 1.5rem;--space-lg: 2rem;--space-xl: 3rem;--space-2xl: 4rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-2xl: 24px;--transition-fast: all .2s cubic-bezier(.25, .46, .45, .94);--transition-base: all .3s cubic-bezier(.25, .46, .45, .94);--transition-spring: all .4s cubic-bezier(.68, -.55, .265, 1.55);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--shadow-xl: 0 12px 48px rgba(0, 0, 0, .6);--blur-sm: blur(10px);--blur-md: blur(20px);--blur-lg: blur(40px);--header-height: 64px}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;margin:0;padding:0;height:100%}body{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,SF Pro Text,Helvetica Neue,Helvetica,Arial,sans-serif;background:var(--bg-primary);color:var(--text-primary);height:100%;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;letter-spacing:-.01em;-webkit-overflow-scrolling:touch;touch-action:pan-y;position:relative;display:flex;flex-direction:column}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2;letter-spacing:-.02em;color:var(--text-primary)}h3{border-bottom:1px solid var(--border-color);padding-bottom:var(--space-xs);margin-bottom:var(--space-sm)}p{color:var(--text-secondary)}a{color:var(--accent-primary);text-decoration:none;transition:var(--transition-base)}a:hover{color:var(--accent-secondary);text-decoration:underline}input,button,textarea,select{font-family:inherit;color:inherit}::placeholder{color:var(--text-tertiary);opacity:1}::-ms-input-placeholder{color:var(--text-tertiary)}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:#fff3;border-radius:var(--radius-lg);border:2px solid var(--bg-primary)}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) var(--bg-primary)}header{height:var(--header-height);flex-shrink:0;box-sizing:border-box;padding:0 var(--space-lg);margin:0!important;display:flex;justify-content:space-between;align-items:center;border-bottom:.5px solid var(--border-color);position:sticky;top:0;background:#000c;backdrop-filter:var(--blur-md);-webkit-backdrop-filter:var(--blur-md);z-index:100}.logo{display:flex;align-items:center;gap:var(--space-sm)}.logo-text{font-weight:500;font-size:1.5rem;letter-spacing:-.05em;color:var(--text-primary)}.tagline{font-size:.875rem;font-weight:400;color:var(--text-secondary);letter-spacing:.02em}.header-actions{display:flex;align-items:center;gap:var(--space-md)}@media(max-width:768px){.header-actions{gap:var(--space-sm)}.api-status{font-size:.8125rem;padding:6px 10px}#logout-button{padding:8px 14px;font-size:.8125rem;min-width:auto}.logo-text{font-size:1.25rem}}.api-status{font-size:.875rem;color:var(--text-secondary);font-weight:500;display:flex;align-items:center;gap:var(--space-xs);transition:var(--transition-fast);background:transparent;border:none;cursor:pointer;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm)}.api-status:hover:not(:disabled){background:#ffffff0d;color:var(--text-primary)}.api-status:active:not(:disabled){background:#ffffff1a}.api-status:disabled{cursor:not-allowed;opacity:.7}.api-status.loading{cursor:wait}.api-status.loading:after{content:"";width:12px;height:12px;border:2px solid var(--text-tertiary);border-top-color:var(--text-secondary);border-radius:50%;animation:spin .8s linear infinite;margin-left:var(--space-xs)}@keyframes spin{to{transform:rotate(360deg)}}.api-status:before{content:"";width:8px;height:8px;border-radius:50%;background-color:var(--text-tertiary);transition:var(--transition-fast)}.api-status.connected:before{background-color:var(--accent-success);animation:pulse 2s infinite}.api-status.error:before{background-color:var(--accent-error)}@keyframes pulse{0%{box-shadow:0 0 #66bb6ab3}70%{box-shadow:0 0 0 10px #66bb6a00}to{box-shadow:0 0 #66bb6a00}}main{padding:0!important;margin:0!important;flex:1 1 auto;min-height:0;overflow:hidden;display:flex;flex-direction:column;position:relative;-webkit-overflow-scrolling:touch}#generator-section{height:100%;min-height:0;overflow:hidden;display:flex;flex-direction:column;flex:1 1 auto;position:relative}#generator-section.hidden{display:none!important;margin:0!important;padding:0!important;height:0!important;min-height:0!important;flex:0 0 0!important}#hero-section{flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--space-lg)}#hero-section.hidden{display:none!important;margin:0!important;padding:0!important;height:0!important;min-height:0!important;flex:0 0 0!important}.hero-container{max-width:800px}.hero-content h1{font-size:clamp(3rem,7vw,5rem);font-weight:700;line-height:1.1;color:var(--text-primary);margin-bottom:var(--space-md)}.hero-content .subtitle{font-size:clamp(1rem,2vw,1.25rem);color:var(--text-secondary);max-width:600px;margin:0 auto var(--space-lg)}#start-creating-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);font-size:1.125rem;padding:16px 40px;min-width:200px}.warning-text{margin-top:var(--space-md);font-size:.875rem;color:var(--text-tertiary);font-weight:400}.btn-primary,.btn-secondary,.btn-primary-large{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:12px 24px;border-radius:var(--radius-lg);font-size:.9375rem;font-weight:600;cursor:pointer;border:none;transition:var(--transition-base);text-align:center;text-transform:none;letter-spacing:-.01em;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.btn-primary,.btn-primary-large{background-color:var(--accent-primary);color:#fff;box-shadow:var(--shadow-sm)}.btn-primary:hover,.btn-primary-large:hover{background-color:var(--accent-secondary);box-shadow:var(--shadow-md);transform:scale(1.02)}.btn-primary:active,.btn-primary-large:active{transform:scale(.98);opacity:.8}.btn-primary:disabled,.btn-primary-large:disabled{background-color:#ffffff1a;color:var(--text-tertiary);cursor:not-allowed;box-shadow:none;transform:none;opacity:.5}.btn-primary-large{padding:16px 32px;font-size:1.0625rem;border-radius:var(--radius-xl)}.btn-secondary{border:.5px solid var(--border-color);color:var(--accent-primary);background-color:#ffffff0d;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm)}.btn-secondary:hover{background-color:#007aff1a;border-color:var(--accent-primary);transform:scale(1.02)}.btn-secondary:active{transform:scale(.98);opacity:.8}.video-model-select{width:100%;padding:10px 40px 10px 16px;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3e%3cpath fill='%23666' d='M6 9L1 4h10z'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 16px center;background-size:12px}.btn-small{padding:6px 12px;font-size:.8rem;font-weight:500;border-radius:var(--radius-sm)}.main-content{display:grid;grid-template-columns:420px 1fr;height:100%;overflow:hidden;min-height:0;min-width:0}@media(max-width:1200px){.main-content{grid-template-columns:360px 1fr}}@media(max-width:1024px){#sidebar-nav{display:none}.main-content{grid-template-columns:1fr}}#sidebar-nav{background:var(--bg-glass);backdrop-filter:var(--blur-md);-webkit-backdrop-filter:var(--blur-md);display:flex;flex-direction:row;padding:0;border-bottom:.5px solid var(--border-color);border-right:none;position:sticky;top:var(--header-height);z-index:99;flex-shrink:0}.sidebar-menu{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;gap:var(--space-xs);width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.sidebar-menu li{flex-shrink:0}.sidebar-menu-button{display:flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:12px 16px;background:transparent;border:none;border-radius:0;color:var(--text-secondary);font-size:.875rem;font-weight:500;cursor:pointer;transition:var(--transition-base);position:relative;white-space:nowrap;min-height:44px;border-bottom:2px solid transparent}.sidebar-menu-button svg{width:20px;height:20px;stroke-width:1.5;transition:var(--transition-fast);flex-shrink:0}.sidebar-menu-button span{display:none}.sidebar-menu-button:hover{color:var(--text-primary);background:#ffffff0d}.sidebar-menu-button.active{color:var(--accent-primary);font-weight:600;background:transparent;border-bottom-color:var(--accent-primary)}.sidebar-menu-button.active span{display:inline}.sidebar-menu-button.active:before{display:none}.control-panel{background:var(--bg-glass);backdrop-filter:var(--blur-md);-webkit-backdrop-filter:var(--blur-md);padding:var(--space-lg);overflow-y:auto;display:flex;flex-direction:column;min-height:0;border-right:.5px solid var(--border-color);-webkit-overflow-scrolling:touch;overscroll-behavior:contain}#control-panel-title{display:none!important}.panel-description{font-size:.875rem;color:var(--text-secondary);margin-bottom:var(--space-md);padding:var(--space-sm);background:#0000001a;border:1px solid var(--border-color);border-radius:var(--radius-md)}.form-group{margin-bottom:var(--space-md)}.form-group-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-xs)}.form-group-title{font-size:1rem;font-weight:500;color:var(--text-primary);margin-bottom:0}.optional-text{font-size:.8rem;font-weight:400;color:var(--text-tertiary)}.form-group label{display:block;font-size:.75rem;font-weight:500;color:var(--text-secondary);margin-bottom:var(--space-xs);text-transform:uppercase;letter-spacing:.05em}input[type=text],input[type=password],input[type=number],textarea,select{width:100%;background-color:#ffffff14;border:.5px solid var(--border-color);border-radius:var(--radius-md);padding:12px 40px 12px 16px;font-size:.875rem;color:var(--text-primary);transition:var(--transition-base);-webkit-appearance:none;-moz-appearance:none;appearance:none;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.6)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 1rem center;background-size:1.2em}input[type=text]:focus,input[type=password]:focus,input[type=number]:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent-primary);background-color:#007aff1a;box-shadow:0 0 0 3px #007aff1a}textarea{resize:vertical;min-height:80px}select option{background:var(--bg-tertiary);color:var(--text-primary);font-size:.875rem}select optgroup{background-color:#1a1a2e!important;color:#00d4ff!important;font-weight:700;font-size:.85rem;font-style:normal;padding:10px 12px;text-transform:uppercase;letter-spacing:.5px}select optgroup option{background-color:#2d2d44!important;color:#fff!important;font-weight:400;font-style:normal;padding:8px 16px 8px 24px}.prompt-mode-toggle .toggle-group,.image-mode-toggle .toggle-group,#voice-mode-toggle .toggle-group,.tabs-container{display:flex;background:#ffffff0d;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);border:.5px solid var(--border-color);border-radius:var(--radius-lg);padding:4px}.prompt-mode-toggle .toggle-btn,.image-mode-toggle .toggle-btn,#voice-mode-toggle .toggle-btn,.tab-button{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:8px 12px;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--text-secondary);font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s;position:relative;white-space:nowrap}.prompt-mode-toggle .toggle-btn:hover,.image-mode-toggle .toggle-btn:hover,#voice-mode-toggle .toggle-btn:hover,.tab-button:hover{color:var(--text-primary);background-color:#ffffff14}.prompt-mode-toggle .toggle-btn.active,.image-mode-toggle .toggle-btn.active,#voice-mode-toggle .toggle-btn.active,.tab-button.active{background:var(--accent-primary);color:#fff;box-shadow:var(--shadow-sm)}.mode-info{margin-top:var(--space-xs);font-size:.75rem;color:var(--text-tertiary);line-height:1.4}.image-upload-group{display:flex;align-items:center;gap:var(--space-sm)}.product-image-thumbnails{display:flex;gap:var(--space-sm);flex-wrap:wrap;margin-top:var(--space-xs)}.product-image-thumbnail{position:relative;width:80px;height:80px;border-radius:var(--radius-md);overflow:hidden;border:2px solid var(--border-color);cursor:pointer;transition:var(--transition-fast);background:var(--bg-secondary)}.product-image-thumbnail:hover{border-color:var(--accent-primary);transform:scale(1.05)}.product-image-thumbnail.active{border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--accent-primary)}.product-image-thumbnail img{width:100%;height:100%;object-fit:cover}.product-image-thumbnail-label{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.8),transparent);color:var(--text-primary);font-size:.75rem;padding:var(--space-xs);text-align:center;font-weight:500}.image-upload-preview-container{position:relative;width:80px;height:80px;flex-shrink:0}.image-upload-preview-container img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-lg);border:.5px solid var(--border-color)}.image-upload-remove-button{position:absolute;top:-6px;right:-6px;width:24px;height:24px;background:var(--bg-glass);backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);color:var(--text-primary);border:.5px solid var(--border-color);border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;line-height:1;transition:var(--transition-base);z-index:1;box-shadow:var(--shadow-sm)}.image-upload-remove-button:hover{background-color:var(--accent-error);border-color:var(--accent-error);transform:scale(1.15);box-shadow:var(--shadow-md)}.file-upload-label{display:flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:12px;background:#ffffff0d;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);border:1.5px dashed var(--border-color);border-radius:var(--radius-lg);cursor:pointer;transition:var(--transition-base);flex-grow:1;text-align:center}.file-upload-label:hover{border-color:var(--accent-primary);color:var(--accent-primary);background-color:#007aff1a;transform:scale(1.02)}#mass-model-preview-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:var(--space-sm);margin-top:var(--space-sm)}.mass-model-preview-item{position:relative;width:100%;aspect-ratio:1 / 1;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border-color)}.mass-model-preview-item img{width:100%;height:100%;object-fit:cover}.mass-model-remove-btn{position:absolute;top:4px;right:4px;width:20px;height:20px;background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--bg-primary);border-radius:50%;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;line-height:1;transition:var(--transition-fast);z-index:1;padding:0}.mass-model-remove-btn:hover{background-color:var(--accent-error);transform:scale(1.1)}.generate-button-wrapper{margin-top:auto;padding-top:var(--space-md);border-top:1px solid var(--border-color);flex-shrink:0}#generate-button{width:100%}#global-status{text-align:center;margin-top:var(--space-sm);font-size:.875rem;font-weight:500;min-height:20px;color:var(--text-secondary)}.results-panel{padding:var(--space-lg);overflow-y:auto;background-color:var(--bg-primary);border-left:.5px solid var(--border-color);min-height:0;min-width:0;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}@media(max-width:767px){.results-panel{overflow-y:visible!important;overflow-x:visible!important;-webkit-overflow-scrolling:auto}}.results-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-sm);width:100%;max-width:100%;min-width:0;flex-wrap:wrap;margin-bottom:var(--space-xs);padding:0}@media(max-width:767px){.results-header{flex-direction:column;gap:var(--space-xs)}.results-header h2,.results-header-buttons{width:100%}}.results-header h2{font-size:.875rem;font-weight:500;color:var(--text-secondary);margin:0;margin-bottom:var(--space-xs);text-transform:uppercase;letter-spacing:.05em}.results-header-buttons{display:flex;gap:var(--space-xs);align-items:center;flex-wrap:wrap;min-width:0}@media(max-width:767px){.results-header-buttons{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xs);width:100%}.results-header-buttons .btn-secondary{width:100%;min-width:0}}#results-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--space-lg);width:100%;max-width:100%;min-width:0;box-sizing:border-box;margin-top:0}.placeholder{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-2xl);color:var(--text-tertiary);border:1.5px dashed var(--border-color);border-radius:var(--radius-xl);min-height:300px;background:var(--bg-glass);backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm)}.placeholder svg{margin-bottom:var(--space-md);color:var(--text-tertiary)}.result-item{background:var(--bg-glass);backdrop-filter:var(--blur-md);-webkit-backdrop-filter:var(--blur-md);border-radius:var(--radius-xl);padding:var(--space-sm);display:flex;flex-direction:column;gap:var(--space-sm);position:relative;transition:var(--transition-base);box-shadow:var(--shadow-sm);border:.5px solid var(--border-color)}.result-item:hover{box-shadow:var(--shadow-md);transform:translateY(-4px) scale(1.01);border-color:#fff3}.card-prompt{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,SF Pro Text,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.875rem;color:var(--text-secondary);background:var(--bg-primary);padding:var(--space-xs);border-radius:var(--radius-sm);white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;max-width:100%;min-width:0;box-sizing:border-box}.editable-script-textarea,.editable-script-content{width:100%!important;padding:var(--space-xs)!important;border:none!important;border-radius:var(--radius-sm)!important;background:transparent!important;color:var(--text-primary)!important;font-family:inherit!important;font-size:.875rem!important;line-height:1.6!important;min-height:60px!important;max-height:none!important;height:auto!important;outline:none!important;box-sizing:border-box!important;word-wrap:break-word!important;overflow-wrap:break-word!important;white-space:pre-wrap!important;display:block!important;overflow:visible!important}.editable-script-content{resize:none!important}.result-item .editable-script-textarea,.result-item .editable-script-content{max-height:none!important;height:auto!important}.result-item{min-height:auto!important;max-height:none!important}.video-container,.image-container{width:100%;max-width:100%;position:relative;border-radius:var(--radius-md);overflow:hidden;background:var(--bg-primary);min-width:0;box-sizing:border-box}.aspect-16-9,.aspect-ratio-16-9{padding-top:56.25%}.aspect-9-16,.aspect-ratio-9-16{padding-top:177.77%}.aspect-1-1,.aspect-ratio-1-1{padding-top:100%}.video-container video,.image-container img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.card-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:var(--space-xs)}.card-button{display:flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:10px 16px;background:#ffffff0d;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);border:.5px solid var(--border-color);color:var(--accent-primary);border-radius:var(--radius-md);font-size:.875rem;font-weight:600;cursor:pointer;transition:var(--transition-base);text-transform:none}.card-button:hover{background:#007aff26;border-color:var(--accent-primary);transform:scale(1.05)}.card-button svg{width:16px;height:16px}.card-button:disabled,a.card-button[disabled]{opacity:.5;cursor:not-allowed;background:transparent;color:var(--text-tertiary);pointer-events:none}.card-button.active{background:#007aff33;color:var(--accent-primary);border-color:var(--accent-primary)}.add-to-storyboard-button{color:var(--accent-primary)!important;opacity:1!important}.add-to-storyboard-button.active{background:#007aff33;color:var(--accent-primary)!important;opacity:1!important}.add-to-storyboard-button:disabled{opacity:1!important;color:var(--accent-primary)!important}a.card-button[disabled]:hover{background:transparent;text-decoration:none}.card-button.downloaded{background:#34c75926;color:var(--accent-success);border-color:var(--accent-success);cursor:default}.card-button.downloaded:hover{background:#34c75933;border-color:var(--accent-success);transform:scale(1.05)}.status-error{color:var(--accent-error)}.status-success{color:var(--accent-primary)}.loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#121212cc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-sm);color:var(--text-primary);z-index:2;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border-radius:var(--radius-md);transition:opacity .3s}.loading-status-text{font-weight:500;text-align:center;padding:0 var(--space-xs)}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--bg-overlay);display:flex;align-items:center;justify-content:center;z-index:200;animation:fadeIn .2s ease-out}.modal-backdrop.hidden{display:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-content{background:var(--bg-glass);backdrop-filter:var(--blur-lg);-webkit-backdrop-filter:var(--blur-lg);padding:var(--space-lg);border-radius:var(--radius-2xl);max-width:500px;width:90%;text-align:left;box-shadow:var(--shadow-xl);border:.5px solid var(--border-color);animation:slideUp .3s cubic-bezier(.25,.46,.45,.94)}#login-modal .modal-content{max-width:420px}#login-modal input[type=email],#login-modal input[type=password]{transition:border-color .2s,box-shadow .2s}#login-modal input[type=email]:focus,#login-modal input[type=password]:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px #007aff1a}.modal-header{margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--border-color)}.modal-footer{margin-top:var(--space-lg);display:flex;justify-content:flex-end;gap:var(--space-xs)}.modal-title-text{font-size:1.25rem;color:var(--text-primary);margin-bottom:var(--space-md)}.spinner{width:32px;height:32px;border:4px solid var(--border-color);border-bottom-color:var(--accent-primary);border-radius:50%;display:inline-block;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.generating-text{display:inline-flex;align-items:center}.loading-dots{display:inline-block;margin-left:2px;width:1ch;text-align:left}.loading-dots:after{content:"...";animation:loading-dots 1.4s steps(4,end) infinite}@keyframes loading-dots{0%{content:""}25%{content:"."}50%{content:".."}75%,to{content:"..."}}#storyboard-scenes-container,#storyboard-scenes-container-v3{display:flex;flex-direction:column;gap:var(--space-md)}.scene-upload-slot{background:var(--bg-glass);backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);border:.5px solid var(--border-color);border-radius:var(--radius-xl);padding:var(--space-sm);display:flex;flex-direction:column;gap:var(--space-sm)}.scene-number{font-size:1.5rem;font-weight:500;color:var(--text-secondary);line-height:1}.scene-top-row{display:flex;align-items:center;gap:var(--space-sm);width:100%}.scene-image-container{position:relative;width:60px;height:60px;flex-shrink:0}.scene-preview-thumb{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-lg);border:.5px solid var(--border-color)}.scene-upload-placeholder-label{width:100%;height:100%;border-radius:var(--radius-lg);border:1.5px dashed var(--border-color);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition-base);background:#ffffff08}.scene-upload-placeholder-label:hover{border-color:var(--accent-primary);color:var(--accent-primary);background:#007aff1a;transform:scale(1.02)}.scene-file-info{display:flex;flex-direction:column;justify-content:center;min-width:0;flex-grow:1}.scene-filename-main{font-size:.9rem;color:var(--text-primary);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scene-filename-sub{font-size:.8rem;color:var(--text-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scene-remove-btn{background:transparent;border:none;color:var(--text-secondary);font-size:1.5rem;cursor:pointer;line-height:1;padding:4px 8px;border-radius:var(--radius-sm);transition:var(--transition-base);margin-left:auto}.scene-remove-btn:hover{color:var(--accent-error);background:#ff3b301a;transform:scale(1.1)}.scene-prompt-container{display:flex;flex-direction:column;gap:var(--space-xs)}.scene-prompt-textarea{background:#ffffff0d;backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);border-radius:var(--radius-md);border:.5px solid var(--border-color);padding:var(--space-sm);color:var(--text-primary);min-height:90px;transition:var(--transition-base)}.scene-prompt-textarea:focus{border-color:var(--accent-primary);background:#007aff1a;box-shadow:0 0 0 3px #007aff1a}.actor-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:var(--space-xs);margin-top:var(--space-sm)}.actor-card{background:var(--bg-glass);backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);border:.5px solid var(--border-color);border-radius:var(--radius-md);padding:8px 12px;cursor:pointer;transition:var(--transition-base);text-align:center;display:flex;align-items:center;justify-content:center;min-height:fit-content;height:fit-content}.actor-card:hover{background:#ffffff1a;border-color:var(--border-hover);transform:scale(1.05)}.actor-card.active{border-color:var(--accent-primary);background:#007aff33;box-shadow:0 0 0 2px #007aff4d}.actor-name{font-weight:500;color:var(--text-primary);font-size:.875rem;line-height:1.2;white-space:nowrap}@media(min-width:1400px){.generator-app{grid-template-columns:280px 1fr}.main-content{grid-template-columns:460px 1fr}}@media(max-width:1399px)and (min-width:1200px){.generator-app{grid-template-columns:260px 1fr}.main-content{grid-template-columns:420px 1fr}}@media(max-width:1199px)and (min-width:1024px){.generator-app{grid-template-columns:240px 1fr}.main-content{grid-template-columns:380px 1fr}#results-container{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media(max-width:1023px){.generator-app{grid-template-columns:220px 1fr}.main-content{grid-template-columns:340px 1fr}.control-panel{padding:var(--space-md)}#results-container{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--space-md)}header{padding:0 var(--space-md)}.logo{font-size:1.25rem}.tagline{display:none}}@media(max-width:767px){.generator-app{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden;padding:0!important;margin:0!important}#generator-section{padding:0!important;margin:0!important}#hero-section.hidden,#generator-section.hidden{display:none!important;margin:0!important;padding:0!important;height:0!important;min-height:0!important;flex:0 0 0!important}#sidebar-nav{display:flex;flex-direction:row;overflow:hidden;padding:0!important;margin:0!important;border-bottom:1px solid var(--border-color);border-top:none!important;height:auto!important;max-height:none!important;min-height:auto!important;flex-shrink:0;position:sticky;top:var(--header-height)!important;z-index:99;background:var(--bg-primary)!important;align-items:center;line-height:1!important;box-shadow:none!important;transform:translateY(0)!important;box-sizing:border-box!important;gap:0!important}header~main #generator-section .generator-app #sidebar-nav,header+main #generator-section .generator-app #sidebar-nav,main #generator-section .generator-app #sidebar-nav{margin-top:0!important;padding-top:0!important;margin-bottom:0!important}header{border-bottom-width:.5px!important;box-sizing:border-box!important}#sidebar-nav{box-sizing:border-box!important;margin-top:0!important;padding-top:0!important;top:var(--header-height)!important}header+main #sidebar-nav,header~main #sidebar-nav{margin-top:0!important;padding-top:0!important}#sidebar-nav>*{margin:0!important;padding-top:0!important;padding-bottom:0!important}.sidebar-header{display:none!important;height:0!important;margin:0!important;padding:0!important;visibility:hidden!important}.sidebar-menu{display:flex;flex-direction:row;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:thin;width:100%;margin:0!important;list-style:none;align-items:center;height:auto;min-height:44px}.sidebar-menu li{margin:0!important;padding:0!important;flex-shrink:0}.sidebar-menu-button{white-space:nowrap;min-width:fit-content;padding:12px 16px;font-size:.875rem;min-height:44px;border-bottom:2px solid transparent}.sidebar-menu-button.active{border-bottom-color:var(--accent-primary)}.sidebar-menu-button span{display:none}.sidebar-menu-button.active span{display:inline!important}.sidebar-menu-button svg{width:20px;height:20px}.main-content{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;height:100%;max-height:100%;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;position:relative;-webkit-transform:translateZ(0);transform:translateZ(0)}.control-panel{flex:0 0 auto;overflow:visible;border-bottom:.5px solid var(--border-color);border-right:none;padding:var(--space-xs) var(--space-sm);padding-top:var(--space-xs);min-height:0;position:relative;display:flex;flex-direction:column;touch-action:pan-y}.control-panel .form-group{margin-bottom:var(--space-sm)}.generate-button-wrapper{margin-top:var(--space-sm);flex-shrink:0}.results-panel{flex:0 0 auto;min-height:0;overflow:visible!important;overflow-y:visible!important;overflow-x:visible!important;padding:var(--space-md);border-left:none;position:relative;touch-action:pan-y;-webkit-overflow-scrolling:auto}#results-container{grid-template-columns:1fr;gap:var(--space-md);width:100%;max-width:100%;min-width:0;box-sizing:border-box}:root{--header-height: calc(48px + env(safe-area-inset-top, 0px)) }header{padding:0 var(--space-sm)!important;padding-top:env(safe-area-inset-top,0px)!important;padding-bottom:0!important;height:var(--header-height)!important;flex-shrink:0;position:sticky;top:0;z-index:100;background:var(--bg-primary)!important;border-bottom:.5px solid var(--border-color);margin:0!important;box-sizing:border-box!important;line-height:1!important}.logo{font-size:1rem}.tagline{display:none}main{padding:0!important;margin:0!important}header+main{margin-top:0!important;padding-top:0!important}#generator-section,.generator-app{padding-top:0!important;margin-top:0!important;margin-bottom:0!important}header{margin-bottom:0!important}header+main,header~main{margin-top:0!important;padding-top:0!important}.hero-content h1{font-size:2.5rem}.modal-content{width:95%;max-width:95%;padding:var(--space-md);margin:var(--space-sm);max-height:90vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.actor-grid{grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:var(--space-xs)}.actor-card{padding:5px 10px;min-height:44px}.actor-name{font-size:.8125rem}#video-model-options{grid-template-columns:1fr 1fr!important;gap:var(--space-sm)!important}input[type=text],input[type=password],input[type=number],textarea,select{min-height:44px;font-size:16px;padding:12px 40px 12px 16px}textarea{min-height:100px;font-size:16px}.btn-primary,.btn-secondary,.btn-primary-large{min-height:44px;padding:12px 24px;font-size:.9375rem}.tab-button,.card-button{min-height:44px;padding:10px 16px}.form-group{margin-bottom:var(--space-md)}.form-group label{font-size:.8125rem;margin-bottom:var(--space-xs)}.result-item{width:100%;max-width:100%;min-width:0;box-sizing:border-box}.card-actions{display:flex;flex-direction:column;gap:var(--space-xs);width:100%}.card-button{width:100%;box-sizing:border-box}.image-container,.video-container{width:100%;max-width:100%;min-width:0;box-sizing:border-box}.image-container img,.video-container video{width:100%;max-width:100%;height:auto}.scene-upload-slot{padding:var(--space-sm)}.scene-prompt-textarea{min-height:100px;font-size:16px}body{overflow:hidden;height:100%}.control-panel,.results-panel,#sidebar-nav{-webkit-overflow-scrolling:touch}.image-container,.video-container{width:100%;max-width:100%;aspect-ratio:9 / 16;min-width:0;box-sizing:border-box}.card-prompt{font-size:.8125rem;max-height:60px}#generate-button{width:100%;min-height:48px}}@media(max-width:480px){header{padding:0 var(--space-xs);height:52px}.logo{font-size:1rem}.logo-text{font-size:1.125rem}.tagline{display:none}.header-actions{gap:var(--space-xs)}.api-status{font-size:.75rem;padding:6px 10px}#logout-button{padding:6px 12px;font-size:.75rem;min-width:auto}#hero-section{padding:var(--space-md)}.hero-content h1{font-size:2rem}.control-panel{padding:var(--space-sm);max-height:none;flex:0 0 auto;overflow:visible;display:flex;flex-direction:column}.results-panel{overflow:visible;flex:0 0 auto}.form-group{margin-bottom:var(--space-sm)}.btn-primary,.btn-primary-large{padding:12px 20px;font-size:.875rem;min-height:44px;width:100%}.results-header-buttons .btn-secondary{width:100%;min-width:0}.btn-secondary:not(.results-header-buttons .btn-secondary){width:100%}.btn-primary-large{width:100%}.result-item{padding:var(--space-xs);width:100%;max-width:100%;min-width:0;box-sizing:border-box}#results-container{width:100%;max-width:100%;min-width:0;box-sizing:border-box}.card-actions{grid-template-columns:1fr;gap:var(--space-xs)}.card-button{width:100%;min-height:44px}.actor-grid{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:4px}.actor-card{padding:8px 4px;min-height:44px}.actor-name{font-size:.75rem}.scene-upload-slot{padding:var(--space-xs)}.scene-top-row{flex-wrap:wrap;gap:var(--space-xs)}input[type=text],input[type=password],input[type=number],textarea,select{padding:12px 36px 12px 12px;font-size:16px;min-height:44px}textarea{min-height:100px;font-size:16px}.modal-content{width:98%;max-width:98%;padding:var(--space-sm);margin:var(--space-xs)}.tabs-container{flex-wrap:wrap;gap:var(--space-xs)}.tab-button{flex:1 1 auto;min-width:calc(50% - var(--space-xs));min-height:44px}#generate-button{width:100%;min-height:48px;font-size:1rem}.sidebar-menu-button span{display:none}.sidebar-menu-button.active span{display:inline!important}.sidebar-menu-button{padding:12px 16px;min-width:fit-content;border-bottom:2px solid transparent}.sidebar-menu-button.active{border-bottom-color:var(--accent-primary)}}@media(max-width:360px){.hero-content h1{font-size:1.75rem}.control-panel{padding:var(--space-xs);max-height:none;flex:0 0 auto;overflow:visible;display:flex;flex-direction:column}.results-panel{overflow:visible!important;overflow-y:visible!important;overflow-x:visible!important;flex:0 0 auto;-webkit-overflow-scrolling:auto}.form-group label{font-size:.75rem}.actor-grid{grid-template-columns:repeat(auto-fill,minmax(55px,1fr))}.btn-primary,.btn-secondary,.btn-primary-large{padding:10px 16px;font-size:.8125rem}input[type=text],input[type=password],input[type=number],textarea,select{font-size:.875rem;padding:10px 32px 10px 10px;font-size:16px}.modal-content{padding:var(--space-xs)}button{min-height:44px}.result-item{width:100%}.card-actions{display:flex;flex-direction:column;gap:var(--space-xs)}.card-button{width:100%}}body,html{overflow-x:hidden;max-width:100vw}.main-content,.control-panel,.results-panel{min-width:0;max-width:100%}.responsive-text{font-size:clamp(.875rem,2vw,1rem)}img,video{max-width:100%;height:auto}table{width:100%;display:block;overflow-x:auto;white-space:nowrap}.main-content,.control-panel,.results-panel,#sidebar-nav{transition:all .3s ease}.flex-item{min-width:0;flex-shrink:1}@media(max-width:768px){.modal-content{max-width:calc(100vw - 2rem);margin:1rem}#crop-modal .modal-content{max-width:calc(100vw - 1rem);max-height:calc(100vh - 2rem)}}.video-model-options-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-xs);align-items:start}.video-model-options-grid .btn-secondary{border-radius:var(--radius-md)}.video-model-options-grid>div{display:flex;flex-direction:column}.video-model-options-grid label{margin-bottom:6px}.video-model-options-grid .mode-info{margin-top:6px;line-height:1.3}.video-model-btn{width:100%;height:32px;padding:6px 12px;font-size:.75rem;font-weight:400;line-height:1.2;border-radius:var(--radius-md)}.video-model-select{width:100%;height:32px;padding:6px 32px 6px 12px;font-size:.75rem;font-weight:400;line-height:1.2;border-radius:var(--radius-md);appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 12 12'%3e%3cpath fill='%23666' d='M6 9L1 4h10z'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 10px center;background-size:10px}#video-lipsync-toggle-text{font-size:.75rem;font-weight:400}@media(max-width:1024px){.video-model-options-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-xs)}.video-model-options-grid>*{min-width:0}}@media(max-width:767px){.video-model-options-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-xs)}.video-model-options-grid>*{min-width:0}.video-model-btn,.video-model-select{height:36px;padding:8px 12px;font-size:.7rem}.video-model-select{padding:8px 28px 8px 12px}.video-model-options-grid label{font-size:.7rem;margin-bottom:4px}.video-model-options-grid .mode-info{font-size:.65rem;margin-top:4px}}@media(max-width:480px){.video-model-options-grid{grid-template-columns:1fr;gap:var(--space-sm)}.video-model-btn,.video-model-select{height:40px;padding:10px 16px;font-size:.75rem}.video-model-select{padding:10px 36px 10px 16px}}.control-panel,.results-panel,#sidebar-nav,.main-content{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}@media(max-width:767px){.main-content{will-change:scroll-position;-webkit-transform:translate3d(0,0,0);transform:translateZ(0);-webkit-overflow-scrolling:touch;overflow-y:auto!important;overflow-x:hidden!important;-webkit-scroll-behavior:smooth;scroll-behavior:smooth;flex:1 1 auto;min-height:0;height:100%;max-height:100%}.control-panel,.results-panel{overflow:visible!important;overflow-y:visible!important;overflow-x:visible!important;-webkit-overflow-scrolling:auto!important}body{position:relative;overflow:hidden;height:100%;width:100%}html{height:100%;overflow:hidden}}.accounts-grid{display:flex;flex-direction:column;gap:var(--space-sm)}.account-card{background:var(--bg-glass);backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);border:.5px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-sm);transition:var(--transition-base)}.account-card:hover{border-color:#fff3;box-shadow:var(--shadow-sm)}.account-card-header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm)}.account-email{font-size:.875rem;font-weight:500;color:var(--text-primary);word-break:break-all}.account-status{display:flex;align-items:center;gap:6px;font-size:.75rem;font-weight:500;padding:4px 10px;border-radius:var(--radius-sm);flex-shrink:0}.account-status.healthy{background:#34c75926;color:var(--accent-success)}.account-status.unhealthy{background:#ff3b3026;color:var(--accent-error)}.account-status.unknown{background:#ffffff1a;color:var(--text-secondary)}.account-status-dot{width:8px;height:8px;border-radius:50%;background:currentColor}.account-status.healthy .account-status-dot{animation:pulse 2s infinite}.account-card-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--space-sm)}.account-detail-item{display:flex;flex-direction:column;gap:2px}.account-detail-label{font-size:.6875rem;font-weight:500;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.05em}.account-detail-value{font-size:.875rem;font-weight:600;color:var(--text-primary)}.account-detail-value.credits{color:var(--accent-secondary)}.account-detail-value.credits.low{color:var(--accent-error)}.account-detail-value.credits.medium{color:#ff9f0a}.account-detail-value.credits.high{color:var(--accent-success)}.account-card.loading{opacity:.7}.account-card.loading:after{content:"";position:absolute;top:50%;right:var(--space-md);width:16px;height:16px;border:2px solid var(--border-color);border-top-color:var(--accent-primary);border-radius:50%;animation:spin .8s linear infinite}.accounts-summary{display:flex;gap:var(--space-md);padding:var(--space-sm);background:#ffffff08;border-radius:var(--radius-md);margin-bottom:var(--space-md)}.summary-stat{display:flex;flex-direction:column;align-items:center;flex:1}.summary-stat-value{font-size:1.25rem;font-weight:600;color:var(--text-primary)}.summary-stat-label{font-size:.6875rem;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.05em}@media(max-width:767px){.account-card{padding:var(--space-sm)}.account-card-header{flex-direction:column;align-items:flex-start}.account-email{font-size:.8125rem}.account-card-details{grid-template-columns:1fr 1fr}.accounts-summary{flex-wrap:wrap}.summary-stat{min-width:calc(50% - var(--space-sm))}}.chart-card{background:var(--bg-glass);backdrop-filter:var(--blur-sm);-webkit-backdrop-filter:var(--blur-sm);border:.5px solid var(--border-color);border-radius:var(--radius-xl);padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-sm)}.chart-card-wide{grid-column:1 / -1}.chart-title{font-size:.875rem;font-weight:600;color:var(--text-primary);text-align:center;margin-bottom:var(--space-xs)}.chart-empty{text-align:center;padding:var(--space-lg);color:var(--text-tertiary);font-size:.875rem}.chart-donut-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-md)}.chart-donut{width:140px;height:140px;border-radius:50%;position:relative;display:flex;align-items:center;justify-content:center}.chart-donut-center{width:80px;height:80px;background:var(--bg-primary);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute}.chart-donut-value{font-size:1.5rem;font-weight:700;color:var(--text-primary);line-height:1}.chart-donut-label{font-size:.6875rem;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.05em}.chart-legend{display:flex;flex-direction:column;gap:var(--space-xs);width:100%}.chart-legend-item{display:flex;align-items:center;gap:var(--space-xs);font-size:.8125rem}.chart-legend-color{width:12px;height:12px;border-radius:3px;flex-shrink:0}.chart-legend-label{flex:1;color:var(--text-secondary)}.chart-legend-value{font-weight:500;color:var(--text-primary)}.chart-bar-wrapper{display:flex;flex-direction:column;gap:var(--space-xs)}.chart-bar-row{display:grid;grid-template-columns:120px 1fr 60px;gap:var(--space-sm);align-items:center}.chart-bar-label{font-size:.75rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chart-bar-container{height:20px;background:#ffffff0d;border-radius:var(--radius-sm);overflow:hidden}.chart-bar{height:100%;border-radius:var(--radius-sm);transition:width .5s ease-out;min-width:2px}.chart-bar-value{font-size:.75rem;font-weight:600;color:var(--text-primary);text-align:right}@media(max-width:767px){.chart-donut{width:120px;height:120px}.chart-donut-center{width:70px;height:70px}.chart-donut-value{font-size:1.25rem}.chart-bar-row{grid-template-columns:80px 1fr 50px;gap:var(--space-xs)}.chart-bar-label,.chart-bar-value{font-size:.6875rem}.chart-card{padding:var(--space-sm)}}@media(max-width:480px){.chart-bar-row{grid-template-columns:60px 1fr 45px}}