.voice-settings-panel{display:flex;flex-direction:column;gap:16px;padding:16px;background:#fff!important;border:1px solid #e0e0e0;border-radius:8px;box-shadow:0 2px 4px #00000005}.voice-settings-panel h4{font-size:16px;font-weight:600;color:#333!important;margin:0 0 4px;display:flex;align-items:center;gap:8px}.voice-settings-panel h4 svg{width:18px;height:18px;color:#2196f3}.voice-settings-panel .voice-provider-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.voice-settings-panel .voice-provider-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px 8px;background:#fff!important;border:1px solid #cccccc;border-radius:6px;cursor:pointer;transition:all .2s;position:relative;min-height:60px;box-shadow:0 1px 2px #0000000d}.voice-settings-panel .voice-provider-btn:hover:not(.disabled){border-color:#2196f3;background:#f5f5f5!important;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.voice-settings-panel .voice-provider-btn.active{border-color:#2196f3;background:#e3f2fd!important;box-shadow:0 0 0 2px #2196f333}.voice-settings-panel .voice-provider-btn.disabled{opacity:.5;cursor:not-allowed;background:#f5f5f5!important}.voice-settings-panel .voice-provider-btn .provider-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center}.voice-settings-panel .voice-provider-btn .provider-icon svg{width:20px;height:20px;color:#555!important}.voice-settings-panel .voice-provider-btn.active .provider-icon svg{color:#2196f3!important}.voice-settings-panel .voice-provider-btn .provider-name{font-size:11px;font-weight:600;color:#222!important;text-align:center;line-height:1.2}.voice-settings-panel .voice-provider-btn.active .provider-name{color:#1565c0!important;font-weight:700}.voice-settings-panel .voice-provider-btn .provider-tag{position:absolute;top:-6px;right:-6px;padding:2px 6px;border-radius:10px;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.3px}.voice-settings-panel .voice-provider-btn .provider-tag.free{background:#e8f5e9;color:#2e7d32!important}.voice-settings-panel .voice-provider-btn .provider-tag.neural{background:#e3f2fd;color:#1565c0!important}.voice-settings-panel .voice-provider-btn .provider-tag.local{background:#fff3e0;color:#e65100!important}.voice-settings-panel .voice-provider-btn .provider-check{position:absolute;bottom:-4px;right:-4px;width:16px;height:16px;background:#4caf50;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center}.voice-settings-panel .voice-provider-btn .provider-check svg{width:10px;height:10px;color:#fff!important}.voice-settings-panel .voice-provider-desc{font-size:12px;color:#1a1a1a!important;margin-bottom:12px;padding:10px 12px;background:#f0f7ff;border-radius:6px;border-left:3px solid #2196f3;font-weight:500}.voice-settings-panel .voice-select-section{display:flex;flex-direction:column;gap:8px}.voice-settings-panel .voice-select-row{display:flex;gap:8px;align-items:stretch}.voice-settings-panel .voice-select-row select{flex:1;padding:10px 12px;border:1px solid #cccccc;border-radius:6px;font-size:13px;color:#222!important;background:#fff!important;cursor:pointer;transition:all .2s}.voice-settings-panel .voice-select-row select:hover{border-color:#2196f3}.voice-settings-panel .voice-select-row select:focus{outline:none;border-color:#2196f3;box-shadow:0 0 0 2px #2196f333}.voice-settings-panel .voice-preview-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#fff!important;border:1px solid #cccccc;border-radius:6px;cursor:pointer;transition:all .2s;color:#555!important;box-shadow:0 1px 2px #0000000d}.voice-settings-panel .voice-preview-btn:hover:not(:disabled){background:#2196f3!important;border-color:#1976d2;color:#fff!important;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.voice-settings-panel .voice-preview-btn.playing{background:#f44336!important;border-color:#d32f2f;color:#fff!important}.voice-settings-panel .voice-preview-btn.playing:hover:not(:disabled){background:#d32f2f!important;border-color:#c62828}.voice-settings-panel .voice-preview-btn:disabled{opacity:.5;cursor:not-allowed}.voice-settings-panel .voice-preview-btn svg{width:18px;height:18px}.voice-settings-panel .voice-preview-btn .preview-spinner{width:16px;height:16px;border:2px solid #e0e0e0;border-top-color:#2196f3;border-radius:50%;animation:voice-spin .8s linear infinite}@keyframes voice-spin{to{transform:rotate(360deg)}}.voice-settings-panel .voice-lang-hint{font-size:11px;color:#555!important;display:flex;align-items:center;gap:4px;font-weight:500}.voice-settings-panel .voice-sliders-section{display:flex;flex-direction:column;gap:14px;background:#f5f5f5!important;border-radius:6px;padding:14px;border:1px solid #dddddd}.voice-settings-panel .voice-slider-row{display:flex;flex-direction:column;gap:6px}.voice-settings-panel .voice-slider-header{display:flex;justify-content:space-between;align-items:center}.voice-settings-panel .voice-slider-label{font-size:13px;font-weight:600;color:#222!important}.voice-settings-panel .voice-slider-value{font-size:12px;font-family:Consolas,Monaco,monospace;color:#1565c0!important;font-weight:700;background:#e3f2fd;padding:3px 10px;border-radius:4px}.voice-settings-panel .voice-slider-controls{display:flex;align-items:center;gap:8px}.voice-settings-panel .voice-slider-adjust-btn{width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:#fff!important;border:1px solid #cccccc;border-radius:4px;cursor:pointer;font-size:16px;font-weight:700;color:#333!important;transition:all .2s;box-shadow:0 1px 2px #0000000d}.voice-settings-panel .voice-slider-adjust-btn:hover{background:#f0f0f0!important;border-color:#aaa;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.voice-settings-panel .voice-slider-controls input[type=range]{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#d0d0d0;border-radius:3px;cursor:pointer}.voice-settings-panel .voice-slider-controls input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:#2196f3;border-radius:50%;cursor:pointer;transition:transform .2s;box-shadow:0 1px 3px #0000004d}.voice-settings-panel .voice-slider-controls input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.voice-settings-panel .voice-slider-controls input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#2196f3;border-radius:50%;cursor:pointer;border:none}.voice-settings-panel .voice-slider-ticks{display:flex;justify-content:space-between;padding:0 2px;margin-top:2px}.voice-settings-panel .voice-slider-ticks span{font-size:10px;color:#444!important;font-weight:500}.voice-settings-panel .voice-feature-badges{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;padding-top:12px;border-top:1px solid #dddddd;margin-top:4px}.voice-settings-panel .voice-feature-badge{display:flex;align-items:center;gap:4px;padding:5px 12px;border-radius:12px;font-size:10px;font-weight:600;text-transform:uppercase;background:#f0f0f0!important;color:#444!important;border:1px solid #cccccc;transition:all .2s}.voice-settings-panel .voice-feature-badge.active{background:#2196f3!important;color:#fff!important;border-color:#1976d2}.voice-settings-panel .voice-feature-badge svg{width:10px;height:10px}.voice-settings-panel .voice-unavailable-error{background:#fff8e1;border:1px solid #ffcc02;border-radius:6px;padding:12px;margin:8px 0}.voice-settings-panel .voice-unavailable-error p{margin:0;font-size:13px;color:#5d4700!important;font-weight:500}.voice-settings-panel .voice-unavailable-error .hint{margin-top:6px;font-size:12px;color:#5d4700!important}.voice-panel-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:transparent;display:flex;justify-content:flex-end;align-items:stretch;z-index:100001;animation:fadeIn .15s ease;padding:0;pointer-events:none}.voice-panel{pointer-events:auto;background:#fff;border-radius:0;box-shadow:-5px 0 25px #00000026;border-left:1px solid #e5e7eb;width:28.125%;min-width:400px;max-width:none;height:100vh;max-height:100vh;display:flex;flex-direction:column;animation:slideInRight .3s cubic-bezier(.16,1,.3,1);overflow:hidden}[data-theme=dark] .voice-panel{background:#1f2937;border-left-color:#374151}.voice-panel-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#4682b4,#315c80);color:#fff}[data-theme=dark] .voice-panel-header{border-bottom-color:#374151;background:linear-gradient(135deg,#315c80,#1d364d)}.voice-panel-header h3{margin:0;font-size:1rem;font-weight:600;display:flex;align-items:center;gap:8px}.voice-panel-header h3 svg{opacity:.9}.voice-panel-close-btn{background:#fff3;border:none;border-radius:6px;padding:4px;cursor:pointer;color:#fff;display:flex;align-items:center;justify-content:center;transition:background .15s ease}.voice-panel-close-btn:hover{background:#ffffff4d}.voice-panel-tabs{display:flex;align-items:flex-end;gap:4px;padding:12px 16px 0;background:#f8fafc;border-bottom:1px solid #e5e7eb;flex-wrap:wrap}[data-theme=dark] .voice-panel-tabs{background:#0f172a;border-bottom-color:#1e293b}.voice-panel-tab{display:flex;align-items:center;gap:4px;padding:8px 6px;background:transparent;border:none;border-bottom:2px solid transparent;border-radius:4px 4px 0 0;margin-bottom:-1px;font-size:.75rem;font-weight:500;color:#64748b;cursor:pointer;transition:all .15s ease;white-space:nowrap;max-width:105px;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}.voice-panel-tab:hover:not(:disabled){background:#e2e8f0;color:#334155}.voice-panel-tab.active{background:transparent;border-bottom-color:#4682b4;color:#4682b4;font-weight:600;box-shadow:none}[data-theme=dark] .voice-panel-tab{color:#94a3b8}[data-theme=dark] .voice-panel-tab:hover:not(:disabled){background:#1e293b;color:#e2e8f0}[data-theme=dark] .voice-panel-tab.active{background:transparent;border-bottom-color:#5b9bd5;color:#5b9bd5}.voice-panel-tab .tab-icon{display:flex;width:16px;height:16px}.voice-panel-tab .tab-icon svg{width:100%;height:100%}.voice-panel-tab .tab-count{font-size:.7rem;opacity:.7}.tab-divider{width:1px;height:24px;background:#e2e8f0;margin:0 4px}[data-theme=dark] .tab-divider{background:#475569}.voice-panel-tab.favorites-tab{color:#ec4899}.voice-panel-tab.favorites-tab.active{border-bottom-color:#ec4899;color:#ec4899}.voice-panel-tab.favorites-tab .tab-icon svg{stroke:currentColor}.voice-panel-tab.locked{opacity:.5;cursor:not-allowed}.voice-panel-tab.locked:hover{background:transparent}.voice-panel-tab .tab-lock{margin-left:4px;display:flex;color:#ef4444}.voice-panel-content{flex:1;overflow-y:auto;padding:16px;background:#fff}[data-theme=dark] .voice-panel-content{background:#111827}.voice-panel-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#64748b;text-align:center}.voice-panel-error p{margin:12px 0 0;font-size:.9rem}.voice-panel-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:#94a3b8;text-align:center;padding:20px}.voice-panel-empty p{margin:12px 0 4px;font-size:.95rem;font-weight:600;color:#64748b}.voice-panel-empty span{font-size:.8rem;color:#94a3b8}[data-theme=dark] .voice-panel-empty p{color:#cbd5e1}[data-theme=dark] .voice-panel-empty span{color:#64748b}.voice-category{margin-bottom:20px}.voice-category:last-child{margin-bottom:0}.voice-category-header{margin:0 0 10px;padding:0 0 6px;font-size:.75rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid #e5e7eb}[data-theme=dark] .voice-category-header{color:#94a3b8;border-bottom-color:#374151}.voice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px}.voice-card{position:relative;display:flex;flex-direction:column;align-items:center;padding:8px 6px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;cursor:pointer;transition:all .15s ease}.voice-card.female{border-left:3px solid #ec4899}.voice-card.male{border-left:3px solid #3b82f6}.voice-card:hover{border-color:#4682b4;background:#f1f5f9}.voice-card.selected{border-color:#10b981;background:#10b98126;box-shadow:0 0 0 2px #10b98140}[data-theme=dark] .voice-card{background:#1e293b;border-color:#334155}[data-theme=dark] .voice-card:hover{border-color:#5b9bd5;background:#273548}[data-theme=dark] .voice-card.selected{border-color:#10b981;background:#10b98133}.voice-gender-dot{position:absolute;top:4px;left:4px;width:8px;height:8px;border-radius:50%}.voice-gender-dot.female{background:#ec4899}.voice-gender-dot.male{background:#3b82f6}.voice-card-fav-btn{position:absolute;top:2px;right:2px;width:20px;height:20px;padding:2px;background:transparent;border:none;cursor:pointer;color:#cbd5e1;opacity:0;transition:all .15s ease}.voice-card:hover .voice-card-fav-btn{opacity:1}.voice-card-fav-btn.active{opacity:1;color:#ec4899}.voice-card-fav-btn:hover{color:#ec4899;transform:scale(1.1)}.voice-card-fav-btn svg{width:100%;height:100%}[data-theme=dark] .voice-card-fav-btn{color:#475569}[data-theme=dark] .voice-card-fav-btn.active{color:#ec4899}.voice-card-play-btn{width:22px;height:22px;border-radius:50%;border:none;background:#4682b4;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;margin-bottom:2px;flex-shrink:0}.voice-card-play-btn:hover:not(:disabled){background:#315c80;transform:scale(1.05)}.voice-card-play-btn.playing{background:#ef4444}.voice-card-play-btn.playing:hover:not(:disabled){background:#dc2626}.voice-card-play-btn:disabled{cursor:default}.voice-card-play-btn svg{width:10px;height:10px}.voice-card-spinner{width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.voice-card-name{font-size:.65rem;font-weight:600;color:#334155;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;line-height:1.2}[data-theme=dark] .voice-card-name{color:#e2e8f0}.voice-card-desc{font-size:.55rem;color:#94a3b8;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;line-height:1.1;margin-top:1px;font-style:italic}[data-theme=dark] .voice-card-desc{color:#64748b}.voice-card-delay{position:absolute;top:2px;left:2px;font-size:.5rem;color:#10b981;background:#10b98126;padding:1px 3px;border-radius:3px;font-weight:600}[data-theme=dark] .voice-card-delay{color:#34d399;background:#34d39933}.voice-card-check{position:absolute;bottom:2px;right:2px;width:14px;height:14px;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.voice-card-check svg{width:10px;height:10px}.voice-panel-footer{padding:12px 16px;background:#f8fafc;border-top:1px solid #e5e7eb;display:flex;flex-direction:column;gap:10px}[data-theme=dark] .voice-panel-footer{background:#0f172a;border-top-color:#1e293b}.voice-slider-compact{display:flex;align-items:center;gap:10px}.voice-slider-compact label{font-size:.75rem;font-weight:600;color:#64748b;min-width:50px}[data-theme=dark] .voice-slider-compact label{color:#94a3b8}.voice-slider-compact input[type=range]{flex:1;height:4px;background:#e2e8f0;border-radius:2px;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.voice-slider-compact input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:#4682b4;border-radius:50%;cursor:pointer;transition:transform .1s ease}.voice-slider-compact input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}[data-theme=dark] .voice-slider-compact input[type=range]{background:#334155}.voice-slider-compact span{font-size:.75rem;font-weight:600;color:#334155;min-width:40px;text-align:right}[data-theme=dark] .voice-slider-compact span{color:#e2e8f0}@media (max-width: 540px){.voice-panel{width:100%;min-width:auto}.voice-grid{grid-template-columns:repeat(3,1fr)}}.voice-defaults-section{border-top:1px solid #e5e7eb;flex-shrink:0}.defaults-toggle{width:100%;display:flex;align-items:center;gap:8px;padding:10px 16px;background:#f9fafb;border:none;cursor:pointer;font-size:.8rem;font-weight:500;color:#4b5563;text-align:left;transition:background .15s ease}.defaults-toggle:hover{background:#f3f4f6}.defaults-toggle.open{background:#e8f4fd;color:#1565c0}.defaults-toggle svg{flex-shrink:0}.defaults-toggle .toggle-chevron{margin-left:auto;transition:transform .2s ease}.defaults-toggle.open .toggle-chevron{transform:rotate(180deg)}.defaults-content{padding:12px 16px;background:#fff;border-top:1px solid #e5e7eb}.defaults-hint{font-size:.75rem;color:#6b7280;margin-bottom:10px}.defaults-buttons{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.default-btn{padding:5px 10px;font-size:.7rem;font-weight:500;border-radius:4px;border:1px solid #d1d5db;background:#f9fafb;color:#374151;cursor:pointer;transition:all .15s ease}.default-btn:hover{background:#e5e7eb}.default-btn.global-btn{background:#ecfdf5;border-color:#10b981;color:#047857}.default-btn.global-btn:hover{background:#d1fae5}.default-btn.project-btn.has-default{background:#e8f4fd;border-color:#4682b4;color:#1565c0}.default-indicator{font-weight:700;color:#f59e0b;margin-left:2px}.defaults-current{display:flex;align-items:center;gap:6px;font-size:.7rem;padding-top:8px;border-top:1px dashed #e5e7eb}.current-label{color:#9ca3af}.current-value{color:#374151;font-weight:500}.current-provider{color:#9ca3af;font-weight:400;margin-left:2px}[data-theme=dark] .voice-defaults-section{border-color:#374151}[data-theme=dark] .defaults-toggle{background:#1f2937;color:#d1d5db}[data-theme=dark] .defaults-toggle:hover{background:#374151}[data-theme=dark] .defaults-toggle.open{background:#1e3a5f;color:#60a5fa}[data-theme=dark] .defaults-content{background:#111827;border-color:#374151}[data-theme=dark] .defaults-hint{color:#9ca3af}[data-theme=dark] .default-btn{background:#1f2937;border-color:#374151;color:#d1d5db}[data-theme=dark] .default-btn:hover{background:#374151}[data-theme=dark] .defaults-current{border-color:#374151}[data-theme=dark] .current-label{color:#6b7280}[data-theme=dark] .current-value{color:#e5e7eb}.ai-feature-grid{display:flex;flex-direction:column;width:100%;border:1px solid var(--border-color);border-radius:8px;overflow:hidden;background:var(--bg-surface);font-family:Inter,sans-serif}.grid-header{display:flex;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);padding:12px 16px;font-weight:600;color:var(--text-secondary);font-size:.85rem;text-transform:uppercase;letter-spacing:.05em}.grid-row{display:flex;padding:12px 16px;border-bottom:1px solid var(--border-color);align-items:center;transition:background-color .2s}.grid-row:last-child{border-bottom:none}.grid-row:hover{background-color:var(--bg-hover)}.header-cell,.grid-cell{display:flex}.feature-col,.feature-cell{flex:2;flex-direction:column}.provider-col,.provider-cell{flex:1.5;justify-content:center}.model-col,.model-cell{flex:2}.feature-name{font-weight:500;color:var(--text-primary);font-size:.95rem}.feature-desc{font-size:.8rem;color:var(--text-muted);margin-top:2px}.provider-toggle{display:flex;background:var(--bg-input);border-radius:6px;padding:2px;border:1px solid var(--border-input)}.provider-btn{border:none;background:transparent;padding:4px 12px;border-radius:4px;font-size:.8rem;font-weight:500;cursor:pointer;color:var(--text-muted);transition:all .2s}.provider-btn:hover{color:var(--text-primary)}.provider-btn.active{background:var(--bg-surface);color:var(--primary-color);box-shadow:0 1px 2px #0000001a;font-weight:600}.provider-btn.gemini.active{color:#4285f4}.provider-btn.anthropic.active{color:#d97757}.model-select{width:100%;padding:6px 10px;border-radius:6px;border:1px solid var(--border-input);background:var(--bg-input);color:var(--text-primary);font-size:.9rem;cursor:pointer}.model-select:hover{border-color:var(--primary-color)}.model-select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px var(--primary-color-alpha)}.project-info-panel{display:flex;flex-direction:column;gap:8px;padding:10px;background:var(--bg-secondary, #f8f9fa);border-radius:8px;flex:1;min-height:0;overflow-y:auto}.project-info-panel::-webkit-scrollbar{width:6px}.project-info-panel::-webkit-scrollbar-track{background:transparent}.project-info-panel::-webkit-scrollbar-thumb{background:var(--border-color, #dee2e6);border-radius:3px}.project-info-panel::-webkit-scrollbar-thumb:hover{background:var(--text-muted, #6c757d)}.info-section{background:var(--bg-primary, #ffffff);border:1px solid var(--border-color, #dee2e6);border-radius:6px;padding:8px 10px}.section-title{display:flex;align-items:center;gap:6px;margin:0 0 6px;font-size:11px;font-weight:700;color:#1a1a1a;text-transform:uppercase;letter-spacing:.5px}.section-title svg{opacity:.85;flex-shrink:0;color:#333}.info-content{font-size:12px;color:#333}.project-name-input{width:100%;padding:6px 10px;font-size:13px;font-weight:600;border:1px solid var(--border-color, #dee2e6);border-radius:4px;background:var(--bg-primary, #ffffff);color:#1a1a1a;transition:border-color .2s,box-shadow .2s}.project-name-input:focus{outline:none;border-color:var(--primary-color, #007bff);box-shadow:0 0 0 2px #007bff26}.project-name-input::placeholder{color:#888}.project-name{font-weight:600;color:#1a1a1a}.prompt-text{margin:0;padding:6px 10px;background:var(--bg-secondary, #f8f9fa);border-radius:4px;font-size:12px;line-height:1.4;color:#333;max-height:80px;overflow-y:auto;white-space:pre-wrap;word-break:break-word}.empty-state{color:#777;font-style:italic;font-size:11px}.stats-grid{display:flex;flex-wrap:wrap;gap:6px 12px;padding:4px 0}.stat-item{display:flex;flex-direction:row;align-items:center;gap:4px;padding:0;background:transparent}.stat-value{font-size:13px;font-weight:800;color:#111;line-height:1}.stat-label{font-size:10px;color:#555;text-transform:none;letter-spacing:0;font-weight:500}.settings-list{display:flex;flex-direction:column;gap:3px}.setting-row{display:flex;justify-content:space-between;align-items:center;padding:3px 6px;background:var(--bg-secondary, #f8f9fa);border-radius:3px}.setting-label{font-size:11px;color:#444;font-weight:500}.setting-value{font-size:11px;font-weight:600;color:#1a1a1a}.setting-value.enabled{color:#16a34a}.setting-value.disabled{color:#888}@media (max-width: 400px){.stats-grid{gap:4px 8px}}@media (prefers-color-scheme: dark){.project-info-panel{background:#1a1a1a}.info-section{background:#252525;border-color:#3a3a3a}.section-title{color:#f0f0f0}.section-title svg{color:#ccc}.info-content{color:#ddd}.project-name-input{background:#2a2a2a;border-color:#3a3a3a;color:#f0f0f0}.project-name-input::placeholder{color:#888}.project-name{color:#f0f0f0}.prompt-text,.setting-row{background:#1e1e1e}.stat-item{background:transparent}.prompt-text{color:#ddd}.stat-value{color:#fff}.stat-label{color:#aaa}.setting-label{color:#bbb}.setting-value{color:#f0f0f0}.setting-value.enabled{color:#4ade80}.setting-value.disabled,.empty-state{color:#888}}.avatar-panel{display:flex;flex-direction:column;height:100%;background:var(--surface, #ffffff);overflow:hidden;font-family:Inter,sans-serif;max-width:100%}.avatar-tabs{display:flex;background:#f8fafc;border-bottom:1px solid #e2e8f0;flex-shrink:0}.avatar-tab-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 4px;border:none;background:transparent;color:#64748b;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:all .2s;position:relative}.avatar-tab-btn:hover{background:#f1f5f9;color:#475569}.avatar-tab-btn.active{background:#fff;color:#4f46e5;box-shadow:inset 0 -2px #4f46e5}.avatar-tab-status{position:absolute;top:8px;right:8px;width:5px;height:5px;border-radius:50%}.avatar-tab-status.online{background-color:#10b981}.avatar-tab-status.offline{background-color:#ef4444}.avatar-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 12px 60px;display:flex;flex-direction:column}.avatar-content::-webkit-scrollbar{width:5px}.avatar-content::-webkit-scrollbar-track{background:transparent}.avatar-content::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.enable-section-compact{display:flex;justify-content:space-between;align-items:center;padding:10px 4px;margin-bottom:8px;border-bottom:1px solid #f1f5f9;flex-shrink:0;width:100%}.enable-checkbox-wrapper{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none}.enable-checkbox{width:16px;height:16px;border:1px solid #cbd5e1;border-radius:3px;color:#4f46e5;cursor:pointer;accent-color:#4f46e5}.enable-label-text{font-size:11px;font-weight:600;color:#334155;text-transform:uppercase;letter-spacing:.5px}.status-btn-flat{font-size:11px;padding:4px 8px;border:1px solid #e2e8f0;background:#fff;color:#64748b;border-radius:4px;cursor:pointer;display:flex;align-items:center;gap:5px}.status-btn-flat:hover{border-color:#cbd5e1;color:#334155}.sub-tabs{display:flex;margin-bottom:12px;border-bottom:1px solid #e2e8f0;width:100%}.sub-tab-btn{flex:1;text-align:center;padding:8px 4px;font-size:11px;font-weight:600;color:#64748b;background:transparent;border:none;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s}.sub-tab-btn:hover{color:#334155;background:#f8fafc}.sub-tab-btn.active{color:#4f46e5;border-bottom-color:#4f46e5}.avatar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.rive-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:12px}.rive-grid-col-2{grid-column:span 2}.avatar-card{aspect-ratio:1;border:1px solid #e2e8f0;border-radius:6px;overflow:hidden;position:relative;cursor:pointer}.avatar-card:hover{border-color:#818cf8}.avatar-card.selected{border-color:#4f46e5;box-shadow:inset 0 0 0 2px #4f46e5}.avatar-card-image{width:100%;height:100%;object-fit:cover}.avatar-card-name{position:absolute;bottom:0;left:0;right:0;background:#000000b3;color:#fff;font-size:10px;padding:3px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{display:block;font-size:11px;font-weight:600;color:#64748b;margin-bottom:4px}input[type=text],input[type=number],select,textarea{width:100%;font-size:12px;padding:6px 8px;border:1px solid #cbd5e1;background:#fff;color:#1e293b;border-radius:4px;outline:none;box-sizing:border-box}input:focus,select:focus,textarea:focus{border-color:#6366f1;box-shadow:0 0 0 1px #6366f133}.helper-text{font-size:10px;color:#94a3b8;margin-top:4px;line-height:1.4}.hint-text{font-size:10px;color:#94a3b8;font-style:italic;margin-top:8px;line-height:1.4}.avatar-btn-primary{width:100%;padding:8px;background:#4f46e5;color:#fff;border:none;border-radius:4px;font-size:12px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .2s}.avatar-btn-primary:hover{background:#4338ca}.avatar-btn-primary:disabled{background:#94a3b8;cursor:not-allowed}.upload-area{border:1px dashed #cbd5e1;background:#f8fafc;padding:16px;text-align:center;cursor:pointer;border-radius:6px;transition:all .2s}.upload-area:hover{border-color:#6366f1;background:#f1f5f9}.upload-icon{color:#64748b;margin-bottom:8px}.upload-area:hover .upload-icon{color:#4f46e5}.upload-text-primary{font-size:12px;font-weight:600;color:#334155;margin:0 0 4px}.upload-text-secondary{font-size:10px;color:#94a3b8;margin:0}.ai-info-box{background:#eff6ff;border:1px solid #dbeafe;border-radius:6px;padding:12px;margin-bottom:16px}.ai-info-title{font-size:12px;font-weight:700;color:#1e40af;margin:0 0 6px;display:block}.ai-info-text{font-size:11px;color:#1e3a8a;margin:0;line-height:1.5}.avatar-transform-controls{margin-top:16px;padding:14px 12px;border:1px solid #e2e8f0;border-radius:8px;background:linear-gradient(135deg,#f8fafc,#f1f5f9);box-shadow:0 1px 3px #0000000d}.transform-header{display:flex;align-items:center;gap:8px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid #e2e8f0}.transform-header svg{color:#6366f1;flex-shrink:0}.transform-header h4{font-size:12px;text-transform:uppercase;color:#334155;font-weight:700;margin:0;letter-spacing:.5px;flex:1}.transform-header .mode-badge{font-size:9px;font-weight:700;color:#fff;background:#6366f1;padding:2px 6px;border-radius:4px;letter-spacing:.3px}.avatar-section-header{font-size:11px;text-transform:uppercase;color:#94a3b8;font-weight:700;margin:0 0 8px;letter-spacing:.5px}.avatar-transform-controls>h4{font-size:11px;text-transform:uppercase;color:#94a3b8;font-weight:700;margin:0 0 10px;letter-spacing:.5px}.control-grid-compact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.control-row{display:flex;flex-direction:row;align-items:center;gap:8px;min-width:0}.control-row label{margin-bottom:0;flex-shrink:0;width:42px;font-size:11px;color:#64748b}.value-input{flex:1;padding:4px 6px!important;text-align:right;background:#f8fafc!important;height:28px!important;font-size:12px!important;font-weight:500;min-width:0;border:1px solid #cbd5e1;border-radius:4px}.reset-transform-btn{width:100%;margin-top:10px;padding:6px;background:#fff;border:1px solid #e2e8f0;color:#64748b;font-size:11px;border-radius:4px;cursor:pointer}.reset-transform-btn:hover{background:#f8fafc;color:#334155;border-color:#cbd5e1}.prerender-progress-compact{display:flex;align-items:center;gap:8px;padding:8px 10px;background:#f8fafc;border-top:1px solid #e2e8f0;margin-top:auto}.progress-label-inline{font-size:10px;color:#64748b;white-space:nowrap;flex-shrink:0}.progress-bar-compact{flex:1;height:4px;background:#e2e8f0;border-radius:2px;overflow:hidden}.progress-fill-compact{height:100%;background:#4f46e5;border-radius:2px;transition:width .3s ease}.progress-percent{font-size:10px;color:#4f46e5;font-weight:600;min-width:28px;text-align:right}.avatar-visibility-section{padding:8px 0}.avatar-visibility-section label{display:block;margin-bottom:8px}.avatar-visibility-section .flex{display:flex}.avatar-visibility-section .gap-2{gap:8px}.avatar-visibility-section button{flex:1;padding:8px 12px;font-size:11px;font-weight:600;border:1px solid #e2e8f0;border-radius:6px;cursor:pointer;transition:all .2s ease;background:#f8fafc;color:#64748b}.avatar-visibility-section button:hover{border-color:#a855f7;background:#faf5ff}.avatar-visibility-section button.bg-purple-600{background:#9333ea!important;color:#fff!important;border-color:#9333ea!important}.avatar-visibility-section p{margin-top:6px;font-size:10px;color:#94a3b8;line-height:1.4}.avatar-tabs-container{display:flex;align-items:stretch;background:#f8fafc;border-bottom:1px solid #e2e8f0;flex-shrink:0}.avatar-tabs-container .avatar-tabs{flex:1;border-bottom:none}.avatar-tab-settings-btn{display:flex;align-items:center;justify-content:center;padding:0 10px;border:none;background:transparent;color:#94a3b8;cursor:pointer;transition:all .2s;border-left:1px solid #e2e8f0}.avatar-tab-settings-btn:hover{background:#f1f5f9;color:#64748b}.avatar-tab-settings-panel{background:#fefefe;border-bottom:1px solid #e2e8f0;padding:12px;box-shadow:inset 0 -4px 8px -4px #0000000d}.avatar-tab-settings-panel label{display:flex;align-items:center;gap:8px;padding:4px 0;cursor:pointer}.avatar-tab-settings-panel label:hover{background:#f8fafc;margin:0 -8px;padding:4px 8px;border-radius:4px}.avatar-tab-settings-panel input[type=checkbox]{width:16px;height:16px;accent-color:#9333ea}.voice-mismatch-warning{display:flex;gap:10px;padding:10px 12px;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #f59e0b;border-radius:8px;margin-top:12px}.voice-mismatch-warning .warning-icon{font-size:18px;flex-shrink:0}.voice-mismatch-warning .warning-content{flex:1;min-width:0}.voice-mismatch-warning .warning-title{font-weight:600;font-size:12px;color:#92400e;margin-bottom:4px}.voice-mismatch-warning .warning-text{font-size:11px;color:#78350f;margin-bottom:8px;word-break:break-word}.voice-mismatch-warning .warning-text strong{color:#451a03}.voice-mismatch-warning .warning-actions{display:flex;gap:6px}.voice-mismatch-warning .warning-btn{flex:1;padding:5px 8px;font-size:10px;font-weight:600;border-radius:4px;border:none;cursor:pointer;transition:all .15s}.voice-mismatch-warning .warning-btn.dismiss{background:#fef3c7;color:#92400e;border:1px solid #f59e0b}.voice-mismatch-warning .warning-btn.dismiss:hover{background:#fde68a}.voice-mismatch-warning .warning-btn.regenerate{background:#f59e0b;color:#fff}.voice-mismatch-warning .warning-btn.regenerate:hover{background:#d97706}.layers-panel{background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0;margin-top:16px;overflow:hidden}.layers-panel-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:#f1f5f9;border-bottom:1px solid #e2e8f0}.layers-panel-header h3{font-size:13px;font-weight:600;color:#334155;margin:0}.layers-count{background:#cbd5e1;color:#475569;font-size:11px;font-weight:600;padding:2px 6px;border-radius:10px}.layers-panel-empty{padding:24px 16px;text-align:center;color:#94a3b8;font-size:13px}.layers-list{max-height:280px;overflow-y:auto}.layer-item{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid #f1f5f9;cursor:pointer;transition:background-color .15s ease;-webkit-user-select:none;user-select:none}.layer-item:hover{background:#f1f5f9}.layer-item.selected{background:#e0f2fe;border-left:3px solid #0ea5e9;padding-left:7px}.layer-item.dragging{opacity:.5;background:#e2e8f0}.layer-item.drag-over{border-top:2px solid #0ea5e9}.layer-item.layer-type-avatar .layer-icon{background:#dcfce7}.layer-item.layer-type-logo .layer-icon{background:#fef3c7}.layer-item.layer-type-image .layer-icon{background:#e0e7ff}.layer-item.layer-type-text .layer-icon{background:#fce7f3}.layer-item.layer-type-background .layer-icon{background:#f3e8ff}.layer-item.layer-type-intro .layer-icon{background:#ffedd5}.layer-visibility{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:none;background:transparent;cursor:pointer;color:#64748b;border-radius:4px;flex-shrink:0}.layer-visibility:hover{background:#e2e8f0;color:#334155}.layer-visibility.hidden{color:#cbd5e1}.layer-visibility.hidden:hover{color:#64748b}.layer-lock{display:flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;border:none;background:transparent;cursor:pointer;color:#cbd5e1;border-radius:4px;flex-shrink:0}.layer-lock:hover{background:#e2e8f0;color:#64748b}.layer-lock.locked{color:#f97316}.layer-lock.locked:hover{color:#ea580c}.layer-icon{display:flex;align-items:center;justify-content:center;width:22px;height:22px;font-size:12px;border-radius:4px;flex-shrink:0}.layer-name{flex:1;font-size:12px;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-item.selected .layer-name{font-weight:500}.layer-scope{display:flex;align-items:center;justify-content:center;min-width:24px;height:16px;font-size:9px;font-weight:600;border-radius:8px;padding:0 4px;flex-shrink:0}.layer-scope.global{background:#dbeafe;color:#1d4ed8}.layer-scope.scene{background:#fef3c7;color:#b45309}.layer-drag-handle{display:flex;align-items:center;justify-content:center;width:20px;height:20px;color:#cbd5e1;cursor:grab;flex-shrink:0}.layer-drag-handle:hover{color:#94a3b8}.layer-item.dragging .layer-drag-handle{cursor:grabbing}.layers-panel-footer{padding:8px 12px;background:#f8fafc;border-top:1px solid #e2e8f0}.layers-hint{font-size:10px;color:#94a3b8;font-style:italic}.layers-list::-webkit-scrollbar{width:6px}.layers-list::-webkit-scrollbar-track{background:#f1f5f9}.layers-list::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.layers-list::-webkit-scrollbar-thumb:hover{background:#94a3b8}.canvas-toolbar{position:relative;width:100%;height:48px;flex-shrink:0;display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--surface-secondary, #f9fafb);border-bottom:1px solid var(--border-color, #e5e7eb);z-index:10;-webkit-user-select:none;user-select:none}.canvas-toolbar.disabled{opacity:.6;pointer-events:none}.toolbar-section{display:flex;align-items:center;gap:1px;background:#0000000f;border-radius:8px;padding:3px}.board-style-section,.edit-toggles-section{gap:1px}.toolbar-divider{width:1px;height:20px;background:var(--border-color, #d1d5db);margin:0 8px;flex-shrink:0}.toolbar-spacer{flex:1}.toolbar-btn{display:flex;align-items:center;justify-content:center;gap:0;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:var(--text-tertiary, #6b7280);font-size:10px;font-weight:500;cursor:pointer;transition:all .15s ease}.toolbar-btn span{display:none}.toolbar-btn:hover:not(:disabled){background:var(--hover-bg, #d1d5db);color:var(--text-secondary, #374151)}.toolbar-btn.active{background:#6366f11a;color:#4338ca;box-shadow:0 1px 2px #0000000d,inset 0 0 0 1px #6366f133}.toolbar-btn.active:hover:not(:disabled){background:#6366f126;color:#4338ca}.toolbar-btn:disabled{opacity:.4;cursor:not-allowed}.toolbar-btn.icon-only{width:28px;padding:0}.toolbar-btn svg{flex-shrink:0}.toolbar-btn.avatar-toggle{position:relative;width:32px;height:28px}.toolbar-btn.avatar-toggle.active{background:#10b98126;color:#059669}.toolbar-btn.avatar-toggle.active:hover:not(:disabled){background:#10b98140}.toolbar-btn.avatar-toggle:not(.active){color:#9ca3af}.scene-indicator{font-size:11px;font-weight:600;color:var(--text-secondary, #64748b);min-width:36px;text-align:center;font-variant-numeric:tabular-nums}.zoom-indicator{font-size:10px;font-weight:600;color:var(--text-secondary, #64748b);min-width:40px;text-align:center;font-variant-numeric:tabular-nums}.scene-nav-section,.zoom-section{gap:4px;background:transparent;padding:0}.playback-section{gap:6px;background:transparent;padding:0}.toolbar-btn.play-btn{width:36px;height:28px;background:linear-gradient(135deg,#e68a2e,#d97706);color:#fff;border-radius:6px;box-shadow:0 2px 4px #e68a2e4d;transition:all .2s ease}.toolbar-btn.play-btn:hover:not(:disabled){background:linear-gradient(135deg,#f59e0b,#e68a2e);color:#fff;transform:scale(1.02);box-shadow:0 3px 8px #e68a2e66}.toolbar-btn.play-btn.playing{background:linear-gradient(135deg,#6b7280,#4b5563);box-shadow:0 2px 4px #4b55634d}.toolbar-btn.play-btn.playing:hover:not(:disabled){background:linear-gradient(135deg,#9ca3af,#6b7280)}.recording-section{gap:8px;background:transparent;padding:0}.toolbar-select.quality-select{background:var(--surface-secondary, #f3f4f6);border:1px solid var(--border-color, #e5e7eb);color:var(--text-secondary, #374151);padding:4px 8px;border-radius:6px;font-size:11px;font-weight:500;cursor:pointer;min-width:100px;height:28px}.toolbar-select.quality-select:hover:not(:disabled){background:var(--hover-bg, #e5e7eb);border-color:var(--border-color-hover, #d1d5db)}.toolbar-select.quality-select:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 2px #4f46e51a}.toolbar-select.quality-select:disabled{opacity:.4;cursor:not-allowed}.toolbar-select.quality-select option{background:#fff;color:#374151;padding:8px}.toolbar-btn.record-btn{width:32px;height:32px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border-radius:50%;box-shadow:0 2px 4px #ef44444d}.toolbar-btn.record-btn:hover:not(:disabled){background:linear-gradient(135deg,#f87171,#ef4444);transform:scale(1.05);box-shadow:0 3px 8px #ef444466}.toolbar-btn.record-btn:disabled{opacity:.4}.toolbar-btn.stop-btn{background:linear-gradient(135deg,#6b7280,#4b5563);color:#fff;border-radius:6px}.toolbar-btn.stop-btn:hover:not(:disabled){background:linear-gradient(135deg,#9ca3af,#6b7280);transform:scale(1.02)}.recording-timer{font-size:12px;font-weight:600;color:#ef4444;min-width:48px;text-align:center;font-variant-numeric:tabular-nums;animation:recording-pulse 1.5s ease-in-out infinite}.recording-timer.paused{color:#6b7280;animation:none}.recording-countdown{font-size:18px;font-weight:700;color:#ef4444;min-width:32px;text-align:center;font-variant-numeric:tabular-nums;animation:countdown-pulse 1s ease-in-out infinite}@keyframes recording-pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes countdown-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}to{transform:scale(1);opacity:1}}@media (max-width: 900px){.toolbar-divider{margin:0 4px}.toolbar-section{padding:2px}.toolbar-btn{width:24px;height:24px}}.recording .canvas-toolbar,.fullscreen-recording .canvas-toolbar{display:none}.user-avatar-button{padding:0;border:none;background:none;cursor:pointer;border-radius:50%;transition:opacity .2s ease}.user-avatar-button:hover{opacity:.85}.user-avatar-button:focus{outline:2px solid #1976d2;outline-offset:2px}.user-avatar-circle{position:relative;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;overflow:hidden;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 4px #0000001a}.user-avatar-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border-radius:50%}.user-avatar-initials{position:relative;z-index:1;-webkit-user-select:none;user-select:none;text-transform:uppercase;letter-spacing:.5px}.user-avatar-circle:has(.user-avatar-image:not([style*="display: none"])) .user-avatar-initials{opacity:0}.user-menu{position:relative;display:inline-block}.user-menu-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:220px;background:#fff;border-radius:8px;box-shadow:0 4px 20px #00000026;z-index:100000;overflow:hidden;animation:dropdownFadeIn .15s ease-out}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.user-menu-header{padding:12px 16px;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-bottom:1px solid #e0e0e0}.user-menu-name{display:block;font-weight:600;font-size:14px;color:#1a1a1a;margin-bottom:2px}.user-menu-email{display:block;font-size:12px;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-menu-divider{height:1px;background:#e0e0e0;margin:4px 0}.user-menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 16px;border:none;background:none;font-size:14px;color:#333;cursor:pointer;text-align:left;transition:background-color .15s ease}.user-menu-item:hover{background-color:#f5f5f5}.user-menu-item svg{flex-shrink:0;color:#666}.user-menu-item span{flex:1}.user-menu-item-danger{color:#d32f2f}.user-menu-item-danger svg{color:#d32f2f}.user-menu-item-danger:hover{background-color:#ffebee}@media (prefers-color-scheme: dark){.user-menu-dropdown{background:#2d2d2d;box-shadow:0 4px 20px #0006}.user-menu-header{background:linear-gradient(135deg,#3d3d3d,#2d2d2d);border-bottom-color:#444}.user-menu-name{color:#fff}.user-menu-email{color:#aaa}.user-menu-divider{background:#444}.user-menu-item{color:#e0e0e0}.user-menu-item:hover{background-color:#3d3d3d}.user-menu-item svg{color:#aaa}.user-menu-item-danger{color:#f44336}.user-menu-item-danger svg{color:#f44336}.user-menu-item-danger:hover{background-color:#f443361a}}.user-profile-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .2s ease-out}.user-profile-modal{background:#fff;border-radius:12px;width:100%;max-width:480px;max-height:90vh;overflow:hidden;box-shadow:0 20px 60px #0000004d;animation:slideUp .25s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.user-profile-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #e0e0e0;background:linear-gradient(135deg,#f8f9fa,#e9ecef)}.user-profile-modal-header h2{margin:0;font-size:18px;font-weight:600;color:#1a1a1a}.user-profile-modal-header .close-btn{padding:4px;border:none;background:none;cursor:pointer;border-radius:4px;color:#666;transition:all .15s ease}.user-profile-modal-header .close-btn:hover{background:#0000000d;color:#333}.user-profile-modal-content{padding:24px 20px;overflow-y:auto;max-height:calc(90vh - 60px)}.user-profile-message{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:8px;margin-bottom:20px;font-size:14px}.user-profile-message.error{background:#ffebee;color:#c62828}.user-profile-message.success{background:#e8f5e9;color:#2e7d32}.user-profile-photo-section{display:flex;flex-direction:column;align-items:center;margin-bottom:24px}.user-profile-photo-wrapper{position:relative;cursor:pointer;border-radius:50%;overflow:hidden}.user-profile-photo-wrapper:hover .user-profile-photo-overlay{opacity:1}.user-profile-photo-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;transition:opacity .2s ease;border-radius:50%}.user-profile-remove-photo{margin-top:12px;padding:6px 12px;border:1px solid #d32f2f;background:none;color:#d32f2f;border-radius:4px;font-size:13px;cursor:pointer;transition:all .15s ease}.user-profile-remove-photo:hover{background:#d32f2f;color:#fff}.user-profile-form{display:flex;flex-direction:column;gap:16px;margin-bottom:20px}.user-profile-field{display:flex;flex-direction:column;gap:6px}.user-profile-field label{font-size:13px;font-weight:600;color:#555}.user-profile-field input{padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;transition:border-color .2s ease,box-shadow .2s ease}.user-profile-field input:focus{outline:none;border-color:#1976d2;box-shadow:0 0 0 3px #1976d21a}.user-profile-field input.disabled{background:#f5f5f5;color:#888;cursor:not-allowed}.user-profile-field .field-hint{font-size:12px;color:#888}.user-profile-save-btn{width:100%;padding:12px;border:none;border-radius:8px;background:#1976d2;color:#fff;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s ease}.user-profile-save-btn:hover:not(:disabled){background:#1565c0}.user-profile-save-btn:disabled{background:#90caf9;cursor:not-allowed}.user-profile-password-section{margin-top:24px;padding-top:20px;border-top:1px solid #e0e0e0}.user-profile-password-toggle{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #ddd;background:none;border-radius:6px;font-size:14px;color:#555;cursor:pointer;transition:all .15s ease}.user-profile-password-toggle:hover{background:#f5f5f5;border-color:#ccc}.user-profile-password-form{margin-top:16px;display:flex;flex-direction:column;gap:12px}.user-profile-password-btn{padding:10px 16px;border:none;border-radius:6px;background:#f57c00;color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s ease}.user-profile-password-btn:hover:not(:disabled){background:#e65100}.user-profile-password-btn:disabled{background:#ffcc80;cursor:not-allowed}.user-profile-tabs{display:flex;border-bottom:1px solid #e0e0e0;background:#f8f9fa}.user-profile-tab{flex:1;padding:12px 16px;border:none;background:none;font-size:14px;font-weight:500;color:#666;cursor:pointer;transition:all .2s ease;position:relative}.user-profile-tab:hover{background:#0000000d;color:#333}.user-profile-tab.active{color:#1976d2;background:#fff}.user-profile-tab.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#1976d2}.user-subscription-content{padding:8px 0}.user-subscription-content h3{font-size:16px;font-weight:600;color:#333;margin:0 0 16px}.subscription-current-plan{margin-bottom:32px}.plan-card{background:linear-gradient(135deg,#e3f2fd,#bbdefb);border-radius:12px;padding:20px;border:1px solid #90caf9}.plan-name{font-size:24px;font-weight:700;color:#1565c0;margin-bottom:8px}.plan-status{margin-bottom:8px}.status-badge{display:inline-block;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase}.status-badge.free{background:#e0e0e0;color:#666}.status-badge.active{background:#c8e6c9;color:#2e7d32}.status-badge.past_due{background:#ffecb3;color:#f57c00}.status-badge.canceled{background:#ffcdd2;color:#c62828}.plan-price{font-size:14px;color:#555}.subscription-upgrade h3{margin-bottom:16px}.plans-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.upgrade-plan-card{background:#fff;border:1px solid #e0e0e0;border-radius:12px;padding:20px;transition:all .2s ease}.upgrade-plan-card:hover{box-shadow:0 4px 12px #0000001a}.upgrade-plan-card.featured{border-color:#1976d2;box-shadow:0 0 0 2px #1976d233}.plan-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.plan-title{font-size:18px;font-weight:700;color:#333}.plan-price-tag{font-size:16px;font-weight:600;color:#1976d2}.plan-features{list-style:none;padding:0;margin:0 0 16px}.plan-features li{font-size:13px;color:#666;padding:6px 0;border-bottom:1px solid #f0f0f0}.plan-features li:before{content:"✓";color:#4caf50;margin-right:8px}.upgrade-btn{width:100%;padding:10px;border:1px solid #ddd;border-radius:6px;background:#f5f5f5;color:#666;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.upgrade-btn:hover:not(:disabled){background:#e0e0e0}.upgrade-btn.primary{background:#1976d2;border-color:#1976d2;color:#fff}.upgrade-btn.primary:hover:not(:disabled){background:#1565c0}.upgrade-btn:disabled{opacity:.6;cursor:not-allowed}.upgrade-note{font-size:13px;color:#888;text-align:center;margin:0;font-style:italic}@media (prefers-color-scheme: dark){.user-profile-modal{background:#2d2d2d}.user-profile-modal-header{background:linear-gradient(135deg,#3d3d3d,#2d2d2d);border-bottom-color:#444}.user-profile-modal-header h2{color:#fff}.user-profile-modal-header .close-btn{color:#aaa}.user-profile-modal-header .close-btn:hover{background:#ffffff1a;color:#fff}.user-profile-message.error{background:#c6282833;color:#ef5350}.user-profile-message.success{background:#2e7d3233;color:#66bb6a}.user-profile-field label{color:#aaa}.user-profile-field input{background:#3d3d3d;border-color:#555;color:#fff}.user-profile-field input:focus{border-color:#42a5f5;box-shadow:0 0 0 3px #42a5f533}.user-profile-field input.disabled{background:#333;color:#777}.user-profile-field .field-hint{color:#777}.user-profile-password-section{border-top-color:#444}.user-profile-password-toggle{border-color:#555;color:#aaa}.user-profile-password-toggle:hover{background:#3d3d3d;border-color:#666}.user-profile-tabs{background:#333;border-bottom-color:#444}.user-profile-tab{color:#aaa}.user-profile-tab:hover{background:#ffffff0d;color:#fff}.user-profile-tab.active{color:#42a5f5;background:#2d2d2d}.user-profile-tab.active:after{background:#42a5f5}.user-subscription-content h3{color:#fff}.plan-card{background:linear-gradient(135deg,#1e3a5f,#0d2137);border-color:#2a4d6e}.plan-name{color:#64b5f6}.plan-price{color:#aaa}.upgrade-plan-card{background:#333;border-color:#444}.upgrade-plan-card.featured{border-color:#42a5f5;box-shadow:0 0 0 2px #42a5f54d}.plan-title{color:#fff}.plan-features li{color:#aaa;border-bottom-color:#444}.upgrade-btn{background:#444;border-color:#555;color:#aaa}.upgrade-btn:hover:not(:disabled){background:#555}.upgrade-note{color:#777}}.token-usage-indicator{display:flex;align-items:center;gap:6px;padding:6px 12px;background:linear-gradient(135deg,#4682b4,#315c80);border:none;border-radius:20px;color:#fff;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px #4682b44d;margin-right:12px}.token-usage-indicator:hover{background:linear-gradient(135deg,#5b9bd5,#4682b4);transform:translateY(-1px);box-shadow:0 4px 8px #4682b466}.token-usage-indicator:active{transform:translateY(0);box-shadow:0 2px 4px #4682b44d}.token-usage-icon{flex-shrink:0}.token-usage-tokens{opacity:.9}.token-usage-cost{background:#fff3;padding:2px 6px;border-radius:10px;font-size:.7rem}[data-theme=dark] .token-usage-indicator{background:linear-gradient(135deg,#315c80,#1d364d);box-shadow:0 2px 4px #0000004d}[data-theme=dark] .token-usage-indicator:hover{background:linear-gradient(135deg,#4682b4,#315c80)}.token-usage-popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:transparent;display:flex;justify-content:flex-end;align-items:stretch;z-index:100001;animation:fadeIn .15s ease;padding:0;pointer-events:none}.token-usage-popup{pointer-events:auto;background:#fff;border-radius:0;box-shadow:-5px 0 25px #00000026;border-left:1px solid #e5e7eb;width:28.125%;min-width:400px;max-width:none;height:100vh;max-height:100vh;display:flex;flex-direction:column;animation:slideInRight .3s cubic-bezier(.16,1,.3,1);overflow:hidden}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}[data-theme=dark] .token-usage-popup{background:#1f2937;color:#f3f4f6}.token-usage-popup-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#4682b4,#315c80);color:#fff}[data-theme=dark] .token-usage-popup-header{border-bottom-color:#374151;background:linear-gradient(135deg,#315c80,#1d364d)}.token-usage-popup-header h3{margin:0;font-size:1rem;font-weight:600}.popup-close-btn{background:#fff3;border:none;border-radius:6px;padding:4px;cursor:pointer;color:#fff;display:flex;align-items:center;justify-content:center;transition:background .15s ease}.popup-close-btn:hover{background:#ffffff4d}.token-usage-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:16px 20px;background:#f8fafc;border-bottom:1px solid #e2e8f0}[data-theme=dark] .token-usage-stats{background:#0f172a;border-bottom-color:#1e293b}.stat-box{background:#fff!important;border-radius:8px;padding:10px 8px;box-shadow:0 2px 4px -1px #0000000f,0 1px 2px -1px #00000008;border:1px solid #d1d5db;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;opacity:1!important;visibility:visible!important;filter:none!important;-webkit-filter:none!important;min-height:auto}[data-theme=dark] .stat-box{background:#1e293b;border-color:#334155;box-shadow:0 4px 6px -1px #0003}.stat-box:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a}.stat-box:after{content:"";position:absolute;top:0;left:0;width:3px;height:100%;background:#cbd5e1;z-index:0;border-radius:8px 0 0 8px}.stat-box:nth-child(1):after{background:#3b82f6}.stat-box:nth-child(2):after{background:#8b5cf6}.stat-box:nth-child(3):after{background:#10b981}.stat-box:nth-child(4):after{background:#f59e0b}.token-usage-stats .stat-label{position:relative;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#1e293b!important;font-weight:600!important;z-index:2;opacity:1!important;display:block;text-align:center;background:transparent!important}[data-theme=dark] .token-usage-stats .stat-label{color:#e2e8f0!important}.token-usage-stats .stat-value{position:relative;font-size:1.1rem;font-weight:700;color:#0f172a!important;line-height:1.2;font-feature-settings:"tnum";z-index:2;opacity:1!important;display:block;text-align:center;background:transparent!important}[data-theme=dark] .token-usage-stats .stat-value{color:#f8fafc!important}.stat-cost .stat-value{color:#059669!important}[data-theme=dark] .stat-cost .stat-value{color:#34d399!important}.token-usage-tabs{display:flex;border-bottom:1px solid #e5e7eb;padding:0 20px}[data-theme=dark] .token-usage-tabs{border-bottom-color:#374151}.tab-btn{flex:1;padding:12px 16px;background:none;border:none;border-bottom:2px solid transparent;color:#6b7280;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .15s ease}.tab-btn:hover{color:#374151;background:#f3f4f6}[data-theme=dark] .tab-btn:hover{color:#d1d5db;background:#374151}.tab-btn.active{color:#4682b4;border-bottom-color:#4682b4}[data-theme=dark] .tab-btn.active{color:#5b9bd5;border-bottom-color:#5b9bd5}.token-usage-content{flex:1;overflow-y:auto;padding:20px;min-height:400px;max-height:600px;background:#fff}[data-theme=dark] .token-usage-content{background:#111827}.usage-table{display:flex;flex-direction:column;gap:12px}.table-header{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:16px;padding:12px 16px;background:#f1f5f9;border-radius:8px;font-size:.75rem;font-weight:700;color:#334155!important;text-transform:uppercase;letter-spacing:.05em;border:1px solid #e2e8f0}[data-theme=dark] .table-header{background:#374151;color:#e5e7eb!important;border-color:#4b5563}.table-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:16px;padding:16px;background:#fff;border-radius:10px;font-size:.9rem;align-items:center;color:#1e293b!important;border:1px solid #e2e8f0;box-shadow:0 1px 3px #0000000d;transition:transform .15s ease,box-shadow .15s ease}[data-theme=dark] .table-row{background:#1f2937;border-color:#374151;color:#f3f4f6!important;box-shadow:0 1px 3px #0003}.table-row:hover{transform:translateY(-1px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border-color:#cbd5e1}[data-theme=dark] .table-row:hover{background:#273548;border-color:#4b5563}.model-name,.service-name{font-weight:700;font-size:.9rem;word-break:break-word;color:#0f172a!important}.history-list{display:flex;flex-direction:column;gap:10px}.history-item{padding:12px;background:#f9fafb;border-radius:8px;border-left:3px solid #10b981}[data-theme=dark] .history-item{background:#1f2937}.history-item.error{border-left-color:#ef4444}.history-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.history-service{font-weight:700;font-size:.9rem;color:#000!important}[data-theme=dark] .history-service{color:#f3f4f6!important}.history-time{font-size:.75rem;font-weight:600;color:#000!important}.history-item-details{display:flex;gap:12px;flex-wrap:wrap;font-size:.8rem;color:#000!important;font-weight:600}.test-name{font-weight:800;font-size:.95rem;color:#0f172a!important;display:block;margin-bottom:2px}[data-theme=dark] .test-name{color:#f3f4f6!important}.test-desc{font-size:.75rem;color:#64748b!important;font-family:Menlo,Monaco,Courier New,monospace;font-weight:500;background:#f1f5f9;padding:2px 6px;border-radius:4px}[data-theme=dark] .test-desc{color:#cbd5e1!important;background:#374151}.comp-label{font-size:.85rem;color:#000!important;font-weight:700}[data-theme=dark] .comp-label{color:#d1d5db!important}.comp-value{font-size:.9rem;font-weight:800;color:#000!important}.comp-value.error{color:#ef4444}.fetch-btn{padding:4px 12px;background:#e5e7eb;border:none;border-radius:4px;color:#374151;font-size:.75rem;cursor:pointer;transition:background .15s ease}.fetch-btn:hover{background:#d1d5db}[data-theme=dark] .fetch-btn{background:#374151;color:#f3f4f6}[data-theme=dark] .fetch-btn:hover{background:#4b5563}.external-link{display:inline-block;padding:8px 16px;background:#dbeafe;border-radius:6px;color:#1d4ed8;font-size:.85rem;text-decoration:none;transition:background .15s ease}.external-link:hover{background:#bfdbfe}[data-theme=dark] .external-link{background:#3b82f633;color:#60a5fa}[data-theme=dark] .external-link:hover{background:#3b82f64d}.verify-note{margin:12px 0 0;font-size:.75rem;color:#6b7280;line-height:1.5}[data-theme=dark] .verify-note{color:#9ca3af}@media (max-width: 940px){.token-usage-popup{max-width:95%;margin:0 10px}}@media (max-width: 540px){.token-usage-popup{max-width:100%;margin:0 10px;max-height:95vh}.token-usage-content{min-height:300px;max-height:450px}.token-usage-stats{grid-template-columns:repeat(2,1fr)}.table-header,.table-row{grid-template-columns:1.5fr .5fr 1fr .8fr;font-size:.75rem;padding:8px}.history-item-details{gap:8px}.verify-test-row{grid-template-columns:1fr;gap:8px}.test-status{text-align:left}}.popup-header-actions{display:flex;align-items:center;gap:8px}.popup-dashboard-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#fff3;border:none;border-radius:6px;color:#fff;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .15s ease}.popup-dashboard-btn:hover{background:#ffffff4d}.popup-dashboard-btn svg{flex-shrink:0}.usage-dashboard-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100002;background:#0f172a;overflow:hidden;animation:dashboardFadeIn .2s ease}@keyframes dashboardFadeIn{0%{opacity:0}to{opacity:1}}.dashboard-close-btn{position:fixed;top:16px;right:16px;z-index:100003;background:#334155;border:none;border-radius:8px;padding:8px;color:#f1f5f9;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;box-shadow:0 4px 12px #0000004d}.dashboard-close-btn:hover{background:#475569;transform:scale(1.05)}.usage-dashboard-overlay .usage-dashboard{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%}.test-btn{padding:6px 16px;background:#3b82f6!important;border:none;border-radius:6px;color:#fff!important;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .15s ease;box-shadow:0 1px 2px #0000001a;opacity:1!important}.test-btn:hover:not(:disabled){background:#2563eb!important;transform:translateY(-1px)}.test-btn:disabled{opacity:.6!important;cursor:not-allowed;background:#93c5fd!important}.fetch-btn{padding:4px 12px;background:#e5e7eb!important;border:none;border-radius:4px;color:#374151!important;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .15s ease}.fetch-btn:hover{background:#d1d5db!important}[data-theme=dark] .fetch-btn{background:#374151!important;color:#f3f4f6!important}.external-link{display:block;text-align:center;margin-top:10px;padding:10px 16px;background:#dbeafe!important;border-radius:6px;color:#1d4ed8!important;font-size:.85rem;font-weight:600;text-decoration:none;transition:all .15s ease}.external-link:hover{background:#bfdbfe!important}[data-theme=dark] .external-link{background:#3b82f633!important;color:#60a5fa!important}.test-details-cell{font-size:.75rem;color:#000!important;font-family:monospace;font-weight:600;word-break:break-all}[data-theme=dark] .test-details-cell{color:#d1d5db!important}:root{--color-primary-600: #3A6F8F;--color-primary-700: #2F5E79;--color-primary-800: #254A61;--color-primary-300: #8FB6CF;--color-primary-150: #C9DEE9;--color-bg: #000000;--color-surface: #0F1218;--color-surface-raised: #1A202C;--color-border: #2D3748;--color-divider: #4A5568;--color-text-primary: #FFFFFF;--color-text-secondary: #FFFFFF;--color-text-muted: #F1F5F9;--color-text-disabled: #E2E8F0;--color-success-base: #4ADE80;--color-success-soft: rgba(74, 222, 128, .15);--color-warning-base: #FCD34D;--color-warning-soft: rgba(251, 191, 36, .15);--color-error-base: #F87171;--color-error-soft: rgba(248, 113, 113, .15)}.usage-dashboard{display:flex;min-height:100vh;background:var(--color-bg);color:var(--color-text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:.02em}.usage-sidebar{width:260px;min-width:260px;background:#050505;border-right:1px solid var(--color-border);padding:1rem 1rem 4rem;display:flex;flex-direction:column;gap:1rem;height:100vh;position:sticky;top:0;overflow-y:auto}.usage-sidebar::-webkit-scrollbar{width:6px}.usage-sidebar::-webkit-scrollbar-track{background:transparent}.usage-sidebar::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}.sidebar-section{background:#ffffff08;border:1px solid rgba(255,255,255,.05);border-radius:8px;padding:.75rem;flex-shrink:0}.sidebar-section h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:#fff!important;margin-bottom:.5rem;font-weight:900;opacity:1}.quick-stat{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:1px solid rgba(255,255,255,.1)}.quick-stat:last-child{border-bottom:none}.usage-dashboard .stat-label,.quick-stat .stat-label{font-size:.85rem;color:#fff!important;font-weight:700;opacity:.9}.usage-dashboard .stat-value,.quick-stat .stat-value{font-size:1rem;font-weight:800;font-family:JetBrains Mono,monospace;color:#fff!important}.usage-dashboard .stat-value.cost,.quick-stat .stat-value.cost{color:#86efac!important}.nav-btn{display:block;width:100%;padding:.6rem .75rem;margin-bottom:.25rem;background:transparent;border:1px solid transparent;border-radius:6px;color:#fff!important;font-size:.9rem;text-align:left;cursor:pointer;transition:all .2s;font-weight:600;opacity:.85}.nav-btn:hover{background:#ffffff26;color:#fff!important;opacity:1}.nav-btn.active{background:var(--color-primary-600);color:#fff!important;border-color:var(--color-primary-700);font-weight:800;opacity:1;border:1px solid #FFFFFF}.provider-status{display:flex;align-items:center;gap:.75rem;padding:.6rem 0;font-size:.85rem;border-bottom:1px solid rgba(255,255,255,.05);color:#fff}.provider-status:last-child{border-bottom:none}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--color-text-disabled)}.provider-status.ok .status-dot{background:var(--color-success-base);box-shadow:0 0 8px var(--color-success-soft)}.provider-status.error .status-dot,.provider-status.quota .status-dot{background:var(--color-error-base);box-shadow:0 0 8px var(--color-error-soft)}.provider-status.testing .status-dot{background:var(--color-warning-base);animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.provider-name{flex:1;color:#fff!important;font-weight:700}.status-text{font-family:JetBrains Mono,monospace;font-size:.75rem;color:#f8fafc!important;font-weight:500}.test-all-btn{width:100%;padding:.6rem;margin-bottom:1rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#fff;font-size:.85rem;font-weight:700;cursor:pointer;transition:all .2s}.test-all-btn:hover{background:#fff3}.usage-main{flex:1;padding:2rem;overflow-y:auto;max-height:100vh}.usage-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-divider)}.usage-header h1{font-size:1.75rem;font-weight:900;color:var(--color-text-primary);letter-spacing:-.02em}.header-controls{display:flex;gap:1rem;align-items:center}.last-updated{font-size:.85rem;color:#f1f5f9!important;font-weight:600;font-family:JetBrains Mono,monospace}.header-controls select{padding:.5rem 2rem .5rem 1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-primary);font-size:.9rem;font-weight:700;cursor:pointer}.refresh-btn{padding:.5rem 1.25rem;background:var(--color-primary-600);border:none;border-radius:6px;color:#fff;font-size:.9rem;font-weight:700;cursor:pointer;transition:background .2s;box-shadow:0 0 10px #3a6f8f4d}.refresh-btn:hover{background:var(--color-primary-700)}.loading-state{display:flex;align-items:center;justify-content:center;min-height:400px;color:var(--color-text-muted);font-size:1.1rem}.dashboard-section{margin-bottom:2.5rem}.dashboard-section h2{font-size:1.25rem;font-weight:800;margin-bottom:1.25rem;color:var(--color-text-primary)}.metric-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-bottom:2rem}.metric-card{background:var(--color-surface);border-radius:8px;padding:1.5rem;display:flex;align-items:center;gap:1.25rem;border:1px solid var(--color-border);box-shadow:0 4px 6px -1px #0000004d}.metric-icon{font-size:2rem;opacity:1!important;color:var(--color-primary-300)}.metric-content{display:flex;flex-direction:column;gap:.25rem}.metric-label{font-size:.85rem;color:#fff!important;text-transform:uppercase;letter-spacing:.05em;font-weight:800;opacity:.9}.metric-value{font-size:1.75rem;font-weight:900;font-family:JetBrains Mono,monospace;color:var(--color-text-primary)}.chart-container{background:var(--color-surface);border-radius:8px;padding:1.75rem;margin-bottom:1.5rem;border:1px solid var(--color-border)}.chart-container h3{font-size:1rem;font-weight:700;margin-bottom:1.5rem;color:var(--color-text-primary)}.data-table{background:var(--color-surface);border-radius:8px;overflow:hidden;border:1px solid var(--color-border)}.data-table table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:1rem 1.25rem;text-align:left;border-bottom:1px solid rgba(255,255,255,.15)}.data-table th{background:var(--color-surface-raised);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:#fff!important;font-weight:900;opacity:1;border-bottom:2px solid rgba(255,255,255,.15)}.data-table td{font-size:.9rem;color:#fff!important;font-weight:600}.data-table tr:hover td{background:#1e293b!important;color:#fff!important}.data-table tr:nth-child(2n) td{background-color:#ffffff08!important}.data-table tr:nth-child(odd) td{background-color:transparent!important}.data-table .model-name{font-family:JetBrains Mono,monospace;font-size:.85rem;color:#fff!important;font-weight:700}.attribution-section .section-desc{color:#f1f5f9!important;margin-bottom:2rem;font-size:1rem;font-weight:500;opacity:1}.cost-alerts{background:var(--color-surface);border-radius:8px;padding:1.25rem;margin-bottom:2rem;border:1px solid var(--color-border)}.cost-alerts h3{font-size:.9rem;color:var(--color-text-primary);margin-bottom:1rem;font-weight:800}.alert-item{display:flex;align-items:center;gap:1rem;padding:1rem;margin-bottom:.75rem;border-radius:6px;font-size:.95rem;border-left:4px solid transparent;color:#fff!important;font-weight:700;background-color:var(--color-surface-raised)}.alert-item.critical{background:#dc26264d!important;border-left-color:#ef4444;border:1px solid #EF4444}.alert-item.warning{background:#d977064d!important;border-left-color:#f59e0b;border:1px solid #F59E0B}.alert-icon{font-size:1.2rem}.attribution-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:2rem;margin-bottom:2rem}.attribution-card{background:var(--color-surface);border-radius:8px;padding:1.25rem;border:1px solid var(--color-border);display:flex;flex-direction:column}.attribution-card.full-width{grid-column:1 / -1}.attribution-card h4{font-size:1rem;font-weight:800;color:var(--color-text-primary);margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--color-border)}.attribution-table .table-header{display:grid;grid-template-columns:2fr repeat(3,1fr);padding:.85rem 1rem;background:var(--color-surface-raised);border-bottom:2px solid rgba(255,255,255,.15);color:#fff!important;font-weight:900;text-transform:uppercase;font-size:.8rem;letter-spacing:.05em;border-radius:4px 4px 0 0}.attribution-card.full-width .table-header{grid-template-columns:2fr 1fr 1fr 1fr 1fr 1fr}.attribution-table .table-row{display:grid;grid-template-columns:2fr repeat(3,1fr);padding:.85rem 1rem;border-bottom:1px solid rgba(255,255,255,.15);align-items:center;color:#fff!important;background-color:transparent;font-size:.9rem;transition:background .1s;font-weight:600}.attribution-table .table-row:nth-child(2n){background-color:#ffffff08!important}.attribution-table .table-row:nth-child(odd){background-color:transparent!important}.attribution-table .table-row:hover{background:#1e293b!important;cursor:pointer;border-bottom:1px solid #ffffff}.attribution-card.full-width .table-row{grid-template-columns:2fr 1fr 1fr 1fr 1fr 1fr}.attribution-table .table-row:last-child{border-bottom:none}.attribution-table .table-row.critical{background:#dc26264d!important;color:#fff!important;border-left:3px solid #EF4444}.attribution-table .table-row.warning{background:#d977064d!important;color:#fff!important;border-left:3px solid #F59E0B}.attribution-table .table-row.critical span,.attribution-table .table-row.warning span,.attribution-table .table-row span{color:#fff!important}.user-email{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff!important;font-weight:600}.ip-address{font-family:JetBrains Mono,monospace;display:flex;align-items:center;gap:.75rem;color:var(--color-text-primary);font-weight:600}.ip-badge{font-size:.7rem;padding:.15rem .5rem;border-radius:4px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-family:Inter,sans-serif}.ip-badge.loopback{background:var(--color-primary-800);color:#fff;border:1px solid var(--color-primary-600)}.ip-badge.internal{background:var(--color-success-soft);color:var(--color-success-base);border:1px solid var(--color-success-base)}.ip-badge.external{background:var(--color-surface-raised);color:#fff;border:1px solid var(--color-border)}.cost-value{font-weight:700;color:var(--color-text-primary);font-family:JetBrains Mono,monospace}.percentage{font-weight:700}.total-row{margin-top:1rem;padding:1rem;background:var(--color-surface-raised);border-radius:6px;text-align:right;border:1px solid var(--color-border);color:var(--color-text-primary);font-weight:800}.pagination{display:flex;align-items:center;justify-content:center;gap:1rem;padding:1rem;background:var(--color-surface);border-top:1px solid var(--color-border);margin-top:auto}.pagination button{padding:.4rem 1rem;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:4px;color:#fff;cursor:pointer;font-weight:600;font-size:.9rem;transition:all .2s}.pagination button:hover:not(:disabled){background:var(--color-primary-600);border-color:var(--color-primary-700)}.pagination button:disabled{opacity:.5;cursor:not-allowed;color:var(--color-text-disabled)}.pagination span{color:var(--color-text-muted);font-size:.9rem;font-weight:500}.verification-section .section-desc{color:#f8fafc!important;margin-bottom:2rem}.comparison-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:2rem}.comparison-card{background:var(--color-surface);border:1px solid var(--color-border);padding:1.5rem;border-radius:8px;display:flex;flex-direction:column}.comparison-card h4{color:#fff!important;font-size:1.1rem;font-weight:800;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.05em}.comparison-desc{color:#e2e8f0!important;font-size:.9rem;margin-bottom:1rem;line-height:1.4}.comparison-value{display:flex;align-items:baseline;gap:1.5rem;margin-top:auto;padding-top:1rem;border-top:1px solid var(--color-border)}.comparison-value .tokens{font-family:JetBrains Mono,monospace;font-weight:700;color:#fff!important;font-size:1.1rem}.comparison-value .cost{font-family:JetBrains Mono,monospace;font-weight:800;color:var(--color-success-base);font-size:1.1rem}.comparison-card.external{justify-content:center;gap:1rem}.external-link{display:block;width:100%;padding:.75rem 1rem;background:var(--color-primary-600);color:#fff!important;text-decoration:none;text-align:center;border-radius:6px;font-weight:700;transition:background .2s;border:1px solid rgba(255,255,255,.1)}.external-link:hover{background:var(--color-primary-700)}.verification-notes{background:var(--color-surface-raised);padding:1.5rem;border-radius:8px;border:1px solid var(--color-border);margin-bottom:2rem}.verification-notes h4{color:#fff!important;margin-bottom:1rem;font-weight:800}.verification-notes ul{list-style-type:none;padding:0;display:flex;flex-direction:column;gap:.75rem}.verification-notes li{color:#f1f5f9!important;font-size:.95rem;padding-left:1.5rem;position:relative;line-height:1.5}.verification-notes li:before{content:"•";color:var(--color-primary-300);position:absolute;left:0;font-weight:700}.verification-notes strong{color:#fff!important;font-weight:700}.provider-tests{background:var(--color-surface);padding:1.5rem;border-radius:8px;border:1px solid var(--color-border)}.provider-tests h4{color:#fff!important;margin-bottom:1rem;font-weight:800}.test-results{display:flex;flex-direction:column;gap:.5rem;margin-top:1rem}.test-result{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:var(--color-surface-raised);border-radius:6px;color:#fff!important;border:1px solid var(--color-border);font-weight:600}.test-result.idle{background:var(--color-surface);color:var(--color-text-disabled)!important}.test-name{color:#fff!important;font-weight:700}.test-status{font-family:JetBrains Mono,monospace;font-size:.9rem;color:#f8fafc!important}.test-result.error .test-status{color:var(--color-error-base)!important}.test-result.ok .test-status{color:var(--color-success-base)!important}@media (max-width: 1200px){.usage-sidebar{width:240px}}@media (max-width: 900px){.usage-dashboard{flex-direction:column}.usage-sidebar{width:100%;height:auto;position:relative;flex-direction:row;flex-wrap:wrap;padding:1rem;overflow:visible}.sidebar-section{flex:1;min-width:200px}.attribution-table .table-header{display:none}.attribution-table .table-row{grid-template-columns:1fr;gap:.5rem;padding:1rem}.attribution-table .table-row>span{display:flex;justify-content:space-between}.attribution-table .table-row>span:before{content:attr(data-label);font-weight:600;color:var(--color-text-muted)}}.lipsync-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:20000;animation:lipsyncFadeIn .2s ease-out}@keyframes lipsyncFadeIn{0%{opacity:0}to{opacity:1}}.lipsync-modal{background:#fff;border-radius:16px;width:100%;max-width:420px;overflow:hidden;box-shadow:0 25px 80px #0006;animation:lipsyncSlideUp .3s ease-out}@keyframes lipsyncSlideUp{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.lipsync-modal-header{display:flex;align-items:center;gap:12px;padding:20px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.lipsync-modal-header.progress{background:linear-gradient(135deg,#11998e,#38ef7d)}.lipsync-modal-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:#fff3;border-radius:12px}.lipsync-modal-spinner{position:relative;display:flex;align-items:center;justify-content:center;width:48px;height:48px}.lipsync-modal-spinner svg{animation:lipsyncSpin 1s linear infinite}@keyframes lipsyncSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.lipsync-modal-spinner .progress-text{position:absolute;font-size:10px;font-weight:700}.lipsync-modal-header h2{margin:0;font-size:18px;font-weight:600}.lipsync-modal-content{padding:24px}.lipsync-modal-description{margin:0 0 16px;font-size:14px;color:#555;line-height:1.5}.lipsync-modal-info{background:#f8f9fa;border-radius:8px;padding:12px 16px;margin-bottom:16px}.info-row{display:flex;justify-content:space-between;padding:6px 0}.info-row:not(:last-child){border-bottom:1px solid #e9ecef}.info-label{font-size:13px;color:#666}.info-value{font-size:13px;font-weight:600;color:#333}.lipsync-modal-warning{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#fff3cd;border:1px solid #ffc107;border-radius:8px;font-size:12px;color:#856404}.lipsync-modal-warning.progress{background:#e8f5e9;border-color:#4caf50;color:#2e7d32}.lipsync-modal-actions{display:flex;gap:12px;padding:16px 24px;background:#f8f9fa;border-top:1px solid #e9ecef}.lipsync-modal-btn{flex:1;padding:12px 20px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s ease}.lipsync-modal-btn.cancel{background:#e9ecef;color:#495057}.lipsync-modal-btn.cancel:hover{background:#dee2e6}.lipsync-modal-btn.confirm{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.lipsync-modal-btn.confirm:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.lipsync-progress-bar-container{height:8px;background:#e9ecef;border-radius:4px;overflow:hidden;margin-bottom:16px}.lipsync-progress-bar{height:100%;background:linear-gradient(90deg,#11998e,#38ef7d);border-radius:4px;transition:width .3s ease}.lipsync-progress-status{margin:0 0 8px;font-size:14px;color:#333;font-weight:500;text-align:center}.lipsync-progress-detail{margin:0 0 16px;font-size:12px;color:#666;text-align:center}.settings-summary-panel{position:fixed;top:56px;right:0;width:260px;max-width:90vw;height:calc(100vh - 56px);background:var(--surface, #ffffff);border-left:1px solid var(--border, #e5e7eb);box-shadow:-4px 0 12px #0000001a;z-index:200;display:flex;flex-direction:column;transform:translate(100%);transition:transform .2s ease-out;overflow:hidden;pointer-events:auto}.settings-summary-panel.open{transform:translate(0)}.settings-summary-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border, #e5e7eb);background:var(--surface-elevated, #f9fafb);flex-shrink:0}.settings-summary-title{font-size:14px;font-weight:600;color:var(--text-primary, #1f2937);display:flex;align-items:center;gap:8px}.settings-summary-title:before{content:"";display:inline-block;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236b7280'%3E%3Cpath d='M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z'/%3E%3C/svg%3E") center / contain no-repeat}.settings-summary-close{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:transparent;color:var(--text-secondary, #6b7280);border-radius:4px;cursor:pointer;transition:all .15s ease}.settings-summary-close:hover{background:var(--surface-hover, #f3f4f6);color:var(--text-primary, #1f2937)}.settings-summary-content{flex:1;overflow-y:auto;padding:8px 0}.settings-summary-section{padding:8px 16px 12px;border-bottom:1px solid var(--border-light, #f3f4f6)}.settings-summary-section:last-child{border-bottom:none}.settings-summary-section-title{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted, #9ca3af);margin-bottom:8px}.settings-summary-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;gap:12px}.settings-label{font-size:12px;color:var(--text-secondary, #6b7280);flex-shrink:0}.settings-value{font-size:12px;font-weight:500;color:var(--text-primary, #1f2937);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.settings-value.script-value{font-style:italic;color:var(--text-secondary, #6b7280)}.settings-value:contains("ON"){color:var(--success, #10b981)}.settings-value:contains("OFF"){color:var(--text-muted, #9ca3af)}.settings-summary-content::-webkit-scrollbar{width:6px}.settings-summary-content::-webkit-scrollbar-track{background:transparent}.settings-summary-content::-webkit-scrollbar-thumb{background:var(--border, #e5e7eb);border-radius:3px}.settings-summary-content::-webkit-scrollbar-thumb:hover{background:var(--text-muted, #9ca3af)}@media (prefers-color-scheme: dark){.settings-summary-panel{background:var(--surface-dark, #1f2937);border-left-color:var(--border-dark, #374151)}.settings-summary-header{background:var(--surface-elevated-dark, #111827);border-bottom-color:var(--border-dark, #374151)}.settings-summary-section{border-bottom-color:var(--border-dark, #374151)}}@media (max-width: 600px){.settings-summary-panel{width:100%;max-width:100%}}/*!
 * Quill Editor v1.3.7
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */.ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}.ql-container.ql-disabled .ql-tooltip{visibility:hidden}.ql-container.ql-disabled .ql-editor ul[data-checked]>li:before{pointer-events:none}.ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}.ql-clipboard p{margin:0;padding:0}.ql-editor{box-sizing:border-box;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}.ql-editor>*{cursor:text}.ql-editor p,.ql-editor ol,.ql-editor ul,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{margin:0;padding:0;counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}.ql-editor ol,.ql-editor ul{padding-left:1.5em}.ql-editor ol>li,.ql-editor ul>li{list-style-type:none}.ql-editor ul>li:before{content:"•"}.ql-editor ul[data-checked=true],.ql-editor ul[data-checked=false]{pointer-events:none}.ql-editor ul[data-checked=true]>li *,.ql-editor ul[data-checked=false]>li *{pointer-events:all}.ql-editor ul[data-checked=true]>li:before,.ql-editor ul[data-checked=false]>li:before{color:#777;cursor:pointer;pointer-events:all}.ql-editor ul[data-checked=true]>li:before{content:"☑"}.ql-editor ul[data-checked=false]>li:before{content:"☐"}.ql-editor li:before{display:inline-block;white-space:nowrap;width:1.2em}.ql-editor li:not(.ql-direction-rtl):before{margin-left:-1.5em;margin-right:.3em;text-align:right}.ql-editor li.ql-direction-rtl:before{margin-left:.3em;margin-right:-1.5em}.ql-editor ol li:not(.ql-direction-rtl),.ql-editor ul li:not(.ql-direction-rtl){padding-left:1.5em}.ql-editor ol li.ql-direction-rtl,.ql-editor ul li.ql-direction-rtl{padding-right:1.5em}.ql-editor ol li{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-0}.ql-editor ol li:before{content:counter(list-0,decimal) ". "}.ql-editor ol li.ql-indent-1{counter-increment:list-1}.ql-editor ol li.ql-indent-1:before{content:counter(list-1,lower-alpha) ". "}.ql-editor ol li.ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-2{counter-increment:list-2}.ql-editor ol li.ql-indent-2:before{content:counter(list-2,lower-roman) ". "}.ql-editor ol li.ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-3{counter-increment:list-3}.ql-editor ol li.ql-indent-3:before{content:counter(list-3,decimal) ". "}.ql-editor ol li.ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-4{counter-increment:list-4}.ql-editor ol li.ql-indent-4:before{content:counter(list-4,lower-alpha) ". "}.ql-editor ol li.ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-5{counter-increment:list-5}.ql-editor ol li.ql-indent-5:before{content:counter(list-5,lower-roman) ". "}.ql-editor ol li.ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-6{counter-increment:list-6}.ql-editor ol li.ql-indent-6:before{content:counter(list-6,decimal) ". "}.ql-editor ol li.ql-indent-6{counter-reset:list-7 list-8 list-9}.ql-editor ol li.ql-indent-7{counter-increment:list-7}.ql-editor ol li.ql-indent-7:before{content:counter(list-7,lower-alpha) ". "}.ql-editor ol li.ql-indent-7{counter-reset:list-8 list-9}.ql-editor ol li.ql-indent-8{counter-increment:list-8}.ql-editor ol li.ql-indent-8:before{content:counter(list-8,lower-roman) ". "}.ql-editor ol li.ql-indent-8{counter-reset:list-9}.ql-editor ol li.ql-indent-9{counter-increment:list-9}.ql-editor ol li.ql-indent-9:before{content:counter(list-9,decimal) ". "}.ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}.ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}.ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}.ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}.ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}.ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}.ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}.ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}.ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}.ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}.ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}.ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}.ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}.ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}.ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}.ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}.ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}.ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}.ql-editor .ql-video{display:block;max-width:100%}.ql-editor .ql-video.ql-align-center{margin:0 auto}.ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}.ql-editor .ql-bg-black{background-color:#000}.ql-editor .ql-bg-red{background-color:#e60000}.ql-editor .ql-bg-orange{background-color:#f90}.ql-editor .ql-bg-yellow{background-color:#ff0}.ql-editor .ql-bg-green{background-color:#008a00}.ql-editor .ql-bg-blue{background-color:#06c}.ql-editor .ql-bg-purple{background-color:#93f}.ql-editor .ql-color-white{color:#fff}.ql-editor .ql-color-red{color:#e60000}.ql-editor .ql-color-orange{color:#f90}.ql-editor .ql-color-yellow{color:#ff0}.ql-editor .ql-color-green{color:#008a00}.ql-editor .ql-color-blue{color:#06c}.ql-editor .ql-color-purple{color:#93f}.ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}.ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}.ql-editor .ql-size-small{font-size:.75em}.ql-editor .ql-size-large{font-size:1.5em}.ql-editor .ql-size-huge{font-size:2.5em}.ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}.ql-editor .ql-align-center{text-align:center}.ql-editor .ql-align-justify{text-align:justify}.ql-editor .ql-align-right{text-align:right}.ql-editor.ql-blank:before{color:#0009;content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}.ql-snow.ql-toolbar:after,.ql-snow .ql-toolbar:after{clear:both;content:"";display:table}.ql-snow.ql-toolbar button,.ql-snow .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}.ql-snow.ql-toolbar button svg,.ql-snow .ql-toolbar button svg{float:left;height:100%}.ql-snow.ql-toolbar button:active:hover,.ql-snow .ql-toolbar button:active:hover{outline:none}.ql-snow.ql-toolbar input.ql-image[type=file],.ql-snow .ql-toolbar input.ql-image[type=file]{display:none}.ql-snow.ql-toolbar button:hover,.ql-snow .ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus,.ql-snow .ql-toolbar button:focus,.ql-snow.ql-toolbar button.ql-active,.ql-snow .ql-toolbar button.ql-active,.ql-snow.ql-toolbar .ql-picker-label:hover,.ql-snow .ql-toolbar .ql-picker-label:hover,.ql-snow.ql-toolbar .ql-picker-label.ql-active,.ql-snow .ql-toolbar .ql-picker-label.ql-active,.ql-snow.ql-toolbar .ql-picker-item:hover,.ql-snow .ql-toolbar .ql-picker-item:hover,.ql-snow.ql-toolbar .ql-picker-item.ql-selected,.ql-snow .ql-toolbar .ql-picker-item.ql-selected{color:#06c}.ql-snow.ql-toolbar button:hover .ql-fill,.ql-snow .ql-toolbar button:hover .ql-fill,.ql-snow.ql-toolbar button:focus .ql-fill,.ql-snow .ql-toolbar button:focus .ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#06c}.ql-snow.ql-toolbar button:hover .ql-stroke,.ql-snow .ql-toolbar button:hover .ql-stroke,.ql-snow.ql-toolbar button:focus .ql-stroke,.ql-snow .ql-toolbar button:focus .ql-stroke,.ql-snow.ql-toolbar button.ql-active .ql-stroke,.ql-snow .ql-toolbar button.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow.ql-toolbar button:hover .ql-stroke-miter,.ql-snow .ql-toolbar button:hover .ql-stroke-miter,.ql-snow.ql-toolbar button:focus .ql-stroke-miter,.ql-snow .ql-toolbar button:focus .ql-stroke-miter,.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#06c}@media (pointer: coarse){.ql-snow.ql-toolbar button:hover:not(.ql-active),.ql-snow .ql-toolbar button:hover:not(.ql-active){color:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#444}}.ql-snow,.ql-snow *{box-sizing:border-box}.ql-snow .ql-hidden{display:none}.ql-snow .ql-out-bottom,.ql-snow .ql-out-top{visibility:hidden}.ql-snow .ql-tooltip{position:absolute;transform:translateY(10px)}.ql-snow .ql-tooltip a{cursor:pointer;text-decoration:none}.ql-snow .ql-tooltip.ql-flip{transform:translateY(-10px)}.ql-snow .ql-formats{display:inline-block;vertical-align:middle}.ql-snow .ql-formats:after{clear:both;content:"";display:table}.ql-snow .ql-stroke{fill:none;stroke:#444;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.ql-snow .ql-stroke-miter{fill:none;stroke:#444;stroke-miterlimit:10;stroke-width:2}.ql-snow .ql-fill,.ql-snow .ql-stroke.ql-fill{fill:#444}.ql-snow .ql-empty{fill:none}.ql-snow .ql-even{fill-rule:evenodd}.ql-snow .ql-thin,.ql-snow .ql-stroke.ql-thin{stroke-width:1}.ql-snow .ql-transparent{opacity:.4}.ql-snow .ql-direction svg:last-child{display:none}.ql-snow .ql-direction.ql-active svg:last-child{display:inline}.ql-snow .ql-direction.ql-active svg:first-child{display:none}.ql-snow .ql-editor h1{font-size:2em}.ql-snow .ql-editor h2{font-size:1.5em}.ql-snow .ql-editor h3{font-size:1.17em}.ql-snow .ql-editor h4{font-size:1em}.ql-snow .ql-editor h5{font-size:.83em}.ql-snow .ql-editor h6{font-size:.67em}.ql-snow .ql-editor a{text-decoration:underline}.ql-snow .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}.ql-snow .ql-editor code,.ql-snow .ql-editor pre{background-color:#f0f0f0;border-radius:3px}.ql-snow .ql-editor pre{white-space:pre-wrap;margin-bottom:5px;margin-top:5px;padding:5px 10px}.ql-snow .ql-editor code{font-size:85%;padding:2px 4px}.ql-snow .ql-editor pre.ql-syntax{background-color:#23241f;color:#f8f8f2;overflow:visible}.ql-snow .ql-editor img{max-width:100%}.ql-snow .ql-picker{color:#444;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}.ql-snow .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}.ql-snow .ql-picker-label:before{display:inline-block;line-height:22px}.ql-snow .ql-picker-options{background-color:#fff;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}.ql-snow .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}.ql-snow .ql-picker.ql-expanded .ql-picker-label{color:#ccc;z-index:2}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}.ql-snow .ql-color-picker,.ql-snow .ql-icon-picker{width:28px}.ql-snow .ql-color-picker .ql-picker-label,.ql-snow .ql-icon-picker .ql-picker-label{padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-label svg,.ql-snow .ql-icon-picker .ql-picker-label svg{right:4px}.ql-snow .ql-icon-picker .ql-picker-options{padding:4px 0}.ql-snow .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}.ql-snow .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""]):before{content:attr(data-label)}.ql-snow .ql-picker.ql-header{width:98px}.ql-snow .ql-picker.ql-header .ql-picker-label:before,.ql-snow .ql-picker.ql-header .ql-picker-item:before{content:"Normal"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before{content:"Heading 1"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before{content:"Heading 2"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before{content:"Heading 3"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before{content:"Heading 4"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before{content:"Heading 5"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before{content:"Heading 6"}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before{font-size:2em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before{font-size:1.5em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before{font-size:1.17em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before{font-size:1em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before{font-size:.83em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before{font-size:.67em}.ql-snow .ql-picker.ql-font{width:108px}.ql-snow .ql-picker.ql-font .ql-picker-label:before,.ql-snow .ql-picker.ql-font .ql-picker-item:before{content:"Sans Serif"}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{content:"Serif"}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{content:"Monospace"}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{font-family:Georgia,Times New Roman,serif}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{font-family:Monaco,Courier New,monospace}.ql-snow .ql-picker.ql-size{width:98px}.ql-snow .ql-picker.ql-size .ql-picker-label:before,.ql-snow .ql-picker.ql-size .ql-picker-item:before{content:"Normal"}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before{content:"Small"}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before{content:"Large"}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{content:"Huge"}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before{font-size:10px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before{font-size:18px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{font-size:32px}.ql-snow .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}.ql-snow .ql-color-picker.ql-color .ql-picker-item{background-color:#000}.ql-toolbar.ql-snow{border:1px solid #ccc;box-sizing:border-box;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;padding:8px}.ql-toolbar.ql-snow .ql-formats{margin-right:15px}.ql-toolbar.ql-snow .ql-picker-label{border:1px solid transparent}.ql-toolbar.ql-snow .ql-picker-options{border:1px solid transparent;box-shadow:#0003 0 2px 8px}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label,.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{border-color:#ccc}.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover{border-color:#000}.ql-toolbar.ql-snow+.ql-container.ql-snow{border-top:0px}.ql-snow .ql-tooltip{background-color:#fff;border:1px solid #ccc;box-shadow:0 0 5px #ddd;color:#444;padding:5px 12px;white-space:nowrap}.ql-snow .ql-tooltip:before{content:"Visit URL:";line-height:26px;margin-right:8px}.ql-snow .ql-tooltip input[type=text]{display:none;border:1px solid #ccc;font-size:13px;height:26px;margin:0;padding:3px 5px;width:170px}.ql-snow .ql-tooltip a.ql-preview{display:inline-block;max-width:200px;overflow-x:hidden;text-overflow:ellipsis;vertical-align:top}.ql-snow .ql-tooltip a.ql-action:after{border-right:1px solid #ccc;content:"Edit";margin-left:16px;padding-right:8px}.ql-snow .ql-tooltip a.ql-remove:before{content:"Remove";margin-left:8px}.ql-snow .ql-tooltip a{line-height:26px}.ql-snow .ql-tooltip.ql-editing a.ql-preview,.ql-snow .ql-tooltip.ql-editing a.ql-remove{display:none}.ql-snow .ql-tooltip.ql-editing input[type=text]{display:inline-block}.ql-snow .ql-tooltip.ql-editing a.ql-action:after{border-right:0px;content:"Save";padding-right:0}.ql-snow .ql-tooltip[data-mode=link]:before{content:"Enter link:"}.ql-snow .ql-tooltip[data-mode=formula]:before{content:"Enter formula:"}.ql-snow .ql-tooltip[data-mode=video]:before{content:"Enter video:"}.ql-snow a{color:#06c}.ql-container.ql-snow{border:1px solid #ccc}.richtext-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:20000;animation:richtextFadeIn .2s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@keyframes richtextFadeIn{0%{opacity:0}to{opacity:1}}.richtext-modal{background:#fff;border-radius:16px;width:90%;max-width:900px;height:85vh;max-height:700px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 25px 80px #0006;animation:richtextSlideUp .3s ease-out}@keyframes richtextSlideUp{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.richtext-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;flex-shrink:0}.richtext-modal-title{display:flex;align-items:center;gap:12px}.richtext-modal-title svg{opacity:.9}.richtext-modal-title h2{margin:0;font-size:18px;font-weight:600}.richtext-modal-subtitle{font-size:12px;opacity:.85;margin-top:2px;display:block}.richtext-modal-actions{display:flex;gap:10px}.richtext-btn{display:flex;align-items:center;gap:6px;padding:10px 18px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s ease}.richtext-btn.cancel{background:#fff3;color:#fff}.richtext-btn.cancel:hover{background:#ffffff4d}.richtext-btn.save{background:#fff;color:#3b82f6}.richtext-btn.save:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0003}.richtext-modal-body{flex:1;display:flex;flex-direction:column;overflow:hidden;padding:16px;background:#f8fafc}.richtext-modal-body .quill{flex:1;display:flex;flex-direction:column;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #0000001a}.richtext-modal-body .ql-toolbar{border:none;border-bottom:1px solid #e2e8f0;background:#f8fafc;padding:12px}.richtext-modal-body .ql-toolbar .ql-formats{margin-right:12px}.richtext-modal-body .ql-container{flex:1;border:none;font-size:16px;overflow-y:auto}.richtext-modal-body .ql-editor{padding:20px;min-height:200px;line-height:1.6}.richtext-modal-body .ql-editor.ql-blank:before{color:#94a3b8;font-style:normal;left:20px;right:20px}.richtext-modal-body .ql-editor h1{font-size:2em;font-weight:700;margin:0 0 .5em;color:#1e293b}.richtext-modal-body .ql-editor h2{font-size:1.5em;font-weight:600;margin:0 0 .4em;color:#334155}.richtext-modal-body .ql-editor h3{font-size:1.25em;font-weight:600;margin:0 0 .3em;color:#475569}.richtext-modal-body .ql-editor p{margin:0 0 .8em}.richtext-modal-body .ql-editor ul,.richtext-modal-body .ql-editor ol{margin:0 0 .8em;padding-left:1.5em}.richtext-modal-body .ql-editor li{margin:.3em 0}.richtext-loading{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#64748b}.richtext-spinner{width:32px;height:32px;border:3px solid #e2e8f0;border-top-color:#3b82f6;border-radius:50%;animation:richtextSpin .8s linear infinite}@keyframes richtextSpin{to{transform:rotate(360deg)}}.richtext-modal-footer{padding:12px 24px;background:#f1f5f9;border-top:1px solid #e2e8f0;flex-shrink:0}.richtext-tips{display:flex;align-items:center;gap:8px;font-size:12px;color:#64748b}.richtext-tips svg{flex-shrink:0;color:#3b82f6}.richtext-tips strong{color:#475569}.richtext-tips kbd{display:inline-block;padding:2px 6px;background:#fff;border:1px solid #d1d5db;border-radius:4px;font-family:monospace;font-size:11px;box-shadow:0 1px 2px #0000000d}@media (max-width: 768px){.richtext-modal{width:95%;height:90vh;max-height:none;border-radius:12px}.richtext-modal-header{padding:12px 16px}.richtext-modal-body{padding:12px}.richtext-modal-footer{padding:10px 16px}.richtext-tips{flex-wrap:wrap}}.confirm-dialog-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .15s ease-out}.confirm-dialog{background:var(--surface, #ffffff);border-radius:12px;padding:24px;max-width:400px;width:90%;box-shadow:0 20px 40px #0003;animation:slideUp .2s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.confirm-dialog-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;margin:0 auto 16px}.confirm-dialog.warning .confirm-dialog-icon{background:#f59e0b1a;color:#f59e0b}.confirm-dialog.danger .confirm-dialog-icon{background:#ef44441a;color:#ef4444}.confirm-dialog.info .confirm-dialog-icon{background:#3b82f61a;color:#3b82f6}.confirm-dialog-content{text-align:center;margin-bottom:24px}.confirm-dialog-title{font-size:18px;font-weight:600;color:var(--text-primary, #111827);margin:0 0 8px}.confirm-dialog-message{font-size:14px;color:var(--text-secondary, #6b7280);margin:0;line-height:1.5}.confirm-dialog-actions{display:flex;gap:12px;justify-content:center}.confirm-dialog-btn{padding:10px 20px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s ease;min-width:100px}.confirm-dialog-btn.cancel{background:var(--surface-secondary, #f3f4f6);border:1px solid var(--border-color, #e5e7eb);color:var(--text-primary, #374151)}.confirm-dialog-btn.cancel:hover{background:var(--surface-tertiary, #e5e7eb)}.confirm-dialog-btn.confirm{border:none;color:#fff}.confirm-dialog-btn.confirm.warning{background:#f59e0b}.confirm-dialog-btn.confirm.warning:hover{background:#d97706}.confirm-dialog-btn.confirm.danger{background:#ef4444}.confirm-dialog-btn.confirm.danger:hover{background:#dc2626}.confirm-dialog-btn.confirm.info{background:#3b82f6}.confirm-dialog-btn.confirm.info:hover{background:#2563eb}.canvas-tab-bar{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;background:#f5f5f5;border-bottom:1px solid #e0e0e0;min-height:40px}.canvas-tabs{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.canvas-tab{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #ddd;border-bottom:none;background:#fff;border-radius:6px 6px 0 0;font-size:13px;color:#555;cursor:pointer;transition:all .15s ease;position:relative}.canvas-tab:hover{background:#f0f0f0;color:#333}.canvas-tab.active{background:#fff;color:#1976d2;border-color:#1976d2;border-bottom:2px solid #1976d2;margin-bottom:-1px}.canvas-tab svg{flex-shrink:0;opacity:.7}.canvas-tab.active svg{opacity:1}.canvas-tab.main-tab{font-weight:600}.canvas-tab .tab-name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.canvas-tab .tab-name-input{width:100px;padding:2px 4px;border:1px solid #1976d2;border-radius:3px;font-size:13px;outline:none}.canvas-tab .tab-shortcut{font-size:10px;color:#999;background:#f0f0f0;padding:1px 4px;border-radius:3px;margin-left:2px}.canvas-tab.active .tab-shortcut{background:#e3f2fd;color:#1976d2}.canvas-tab .tab-remove-btn{padding:2px;border:none;background:none;cursor:pointer;color:#999;border-radius:3px;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .15s ease}.canvas-tab:hover .tab-remove-btn{opacity:1}.canvas-tab .tab-remove-btn:hover{background:#ffebee;color:#d32f2f}.canvas-tab.add-tab-btn{padding:6px 10px;border-style:dashed;color:#888}.canvas-tab.add-tab-btn:hover:not(:disabled){background:#e3f2fd;border-color:#1976d2;color:#1976d2}.canvas-tab.add-tab-btn:disabled,.canvas-tab.add-tab-btn.disabled{opacity:.5;cursor:not-allowed}.tab-playback-hint{display:flex;align-items:center;gap:6px;font-size:12px;color:#666;padding:4px 8px;background:#fff3cd;border-radius:4px}.tab-playback-hint svg{color:#856404}@media (prefers-color-scheme: dark){.canvas-tab-bar{background:#2d2d2d;border-bottom-color:#444}.canvas-tab{background:#3d3d3d;border-color:#555;color:#ccc}.canvas-tab:hover{background:#4d4d4d;color:#fff}.canvas-tab.active{background:#3d3d3d;color:#42a5f5;border-color:#42a5f5;border-bottom-color:#42a5f5}.canvas-tab .tab-shortcut{background:#444;color:#888}.canvas-tab.active .tab-shortcut{background:#42a5f533;color:#42a5f5}.canvas-tab .tab-name-input{background:#333;border-color:#42a5f5;color:#fff}.canvas-tab .tab-remove-btn:hover{background:#f4433633;color:#f44336}.canvas-tab.add-tab-btn:hover{background:#42a5f51a;border-color:#42a5f5;color:#42a5f5}.tab-playback-hint{background:#ffc10726;color:#ffc107}.tab-playback-hint svg{color:#ffc107}}.ascii-viewer-container{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:none;overflow:hidden}.ascii-viewer-empty{display:flex;align-items:center;justify-content:center}.ascii-empty-message{display:flex;flex-direction:column;align-items:center;gap:12px;font-size:14px;opacity:.6}.ascii-empty-icon{font-size:48px;opacity:.5}.ascii-scroll-area{width:100%;height:100%;overflow:auto;padding:40px;box-sizing:border-box;scroll-behavior:smooth;display:flex;justify-content:center;align-items:flex-start}.ascii-scroll-area::-webkit-scrollbar{width:12px;height:12px}.ascii-scroll-area::-webkit-scrollbar-track{background:#0003;border-radius:6px}.ascii-scroll-area::-webkit-scrollbar-thumb{background:#80808080;border-radius:6px;border:2px solid transparent;background-clip:padding-box}.ascii-scroll-area::-webkit-scrollbar-thumb:hover{background:#808080b3}.ascii-scroll-area{scrollbar-width:auto;scrollbar-color:rgba(128,128,128,.5) rgba(0,0,0,.2)}.ascii-content{transition:transform .15s ease-out;will-change:transform;flex-shrink:0}.ascii-content pre{background:transparent;padding:0;margin:0;overflow:visible;border:none;box-shadow:none}.ascii-viewer-container code{font-family:JetBrains Mono,Fira Code,Consolas,Monaco,Courier New,monospace;font-size:14px;font-weight:500;line-height:1.25;letter-spacing:0;font-variant-ligatures:none;text-shadow:none;white-space:pre;display:block}@media (max-width: 640px){.ascii-scroll-area{padding:20px}.ascii-viewer-container code{font-size:12px}}.browser-window{display:flex;flex-direction:column;width:100%;height:100%;background:var(--surface, #ffffff);border-radius:0;border:none;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.browser-window-paste-trap{position:absolute;opacity:0;width:1px;height:1px;top:0;left:0;z-index:-10}.browser-window-hidden-input{display:none}.browser-window-toolbar{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;padding:8px 12px;height:48px;flex-shrink:0;background:var(--surface-secondary, #f9fafb);border-bottom:1px solid var(--border-color, #e5e7eb);overflow:hidden}.browser-window-toolbar-section{display:flex;align-items:center;gap:4px;flex-shrink:0}.browser-window-toolbar-section--grow{flex:1;min-width:0}.browser-window-toolbar-divider{width:1px;height:20px;background:var(--border-color, #d1d5db);flex-shrink:0}.browser-window-nav-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:var(--text-tertiary, #9ca3af);cursor:pointer;transition:background-color .15s,color .15s}.browser-window-nav-btn:hover:not(:disabled){background:var(--hover-bg, #f3f4f6);color:var(--text-secondary, #6b7280)}.browser-window-nav-btn:disabled{opacity:.4;cursor:not-allowed}.browser-window-url-bar{display:flex;align-items:center;gap:4px;flex:1;min-width:0;max-width:400px;height:36px;padding:0 4px;background:var(--surface, #ffffff);border:1px solid var(--border-color, #d1d5db);border-radius:8px;box-shadow:0 1px 2px #0000000d;transition:border-color .15s,box-shadow .15s}.browser-window-url-bar:focus-within{border-color:var(--primary-color, #4f46e5);box-shadow:0 0 0 2px #4f46e51a}.browser-window-url-bar--disabled{background:var(--surface-secondary, #f9fafb);opacity:.6}.browser-window-proxy-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:var(--text-tertiary, #9ca3af);cursor:pointer;transition:all .15s;flex-shrink:0}.browser-window-proxy-btn:hover{background:var(--hover-bg, #f3f4f6);color:var(--text-secondary, #6b7280)}.browser-window-proxy-btn--active{background:#22c55e1a;color:#16a34a}.browser-window-proxy-btn--active:hover{background:#22c55e26;color:#15803d}.browser-window-url-input{flex:1;min-width:0;height:28px;padding:0 4px;border:none;outline:none;background:transparent;font-size:12px;color:var(--text-primary, #374151)}.browser-window-url-input::placeholder{color:var(--text-tertiary, #9ca3af)}.browser-window-go-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:var(--primary-color, #4f46e5);color:#fff;cursor:pointer;box-shadow:0 1px 2px #0000001a;transition:background-color .15s;flex-shrink:0}.browser-window-go-btn:hover{background:var(--primary-hover, #4338ca)}.browser-window-control-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid var(--border-color, #d1d5db);border-radius:6px;background:var(--surface, #ffffff);color:var(--text-secondary, #6b7280);cursor:pointer;box-shadow:0 1px 2px #0000000d;transition:all .15s}.browser-window-control-btn:hover{background:var(--hover-bg, #f9fafb);color:var(--text-primary, #374151)}.browser-window-control-btn--active{background:#4f46e51a;border-color:#4f46e54d;color:var(--primary-color, #4f46e5)}.browser-window-mode-toggle-group{display:flex;align-items:center;gap:2px;padding:2px;background:var(--surface-muted, #e5e7eb);border-radius:8px;flex-shrink:0}.browser-window-mode-toggle-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:6px;background:transparent;color:var(--text-secondary, #6b7280);cursor:pointer;transition:all .15s ease}.browser-window-mode-toggle-btn:hover{background:var(--surface, #ffffff);color:var(--text-primary, #374151)}.browser-window-mode-toggle-btn--active{background:var(--surface, #ffffff);color:var(--primary-color, #4f46e5);box-shadow:0 1px 3px #0000001a,inset 0 0 0 1px #4f46e533}.browser-window-mode-toggle-btn svg{flex-shrink:0}.browser-window-unified-input{display:flex;align-items:center;gap:4px;flex:1;min-width:0;max-width:500px;height:36px;padding:0 4px;background:var(--surface, #ffffff);border:1px solid var(--border-color, #d1d5db);border-radius:8px;box-shadow:0 1px 2px #0000000d;transition:border-color .15s,box-shadow .15s}.browser-window-unified-input:focus-within{border-color:var(--primary-color, #4f46e5);box-shadow:0 0 0 2px #4f46e51a}.browser-window-unified-input--has-content{border-color:var(--success-color, #10b981);background:#10b9810d}.browser-window-unified-input-icon{display:flex;align-items:center;justify-content:center;width:28px;height:28px;color:var(--text-tertiary, #9ca3af);flex-shrink:0}.browser-window-unified-input-field{flex:1;min-width:0;height:28px;padding:0 4px;border:none;outline:none;background:transparent;font-size:13px;color:var(--text-primary, #374151)}.browser-window-unified-input-field::placeholder{color:var(--text-tertiary, #9ca3af);font-size:12px}.browser-window-unified-input-field:read-only{cursor:pointer}.browser-window-unified-go-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:var(--primary-color, #4f46e5);color:#fff;cursor:pointer;box-shadow:0 1px 2px #0000001a;transition:background-color .15s;flex-shrink:0}.browser-window-unified-go-btn:hover{background:var(--primary-hover, #4338ca)}.browser-window-mode-selector{display:flex;align-items:center;gap:2px;padding:2px;background:var(--surface-muted, #f3f4f6);border-radius:8px;margin:0 8px}.browser-window-mode-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;border:none;border-radius:6px;background:transparent;color:var(--text-secondary, #6b7280);font-size:11px;font-weight:500;cursor:pointer;transition:all .15s ease;white-space:nowrap}.browser-window-mode-btn:hover{background:var(--surface, #ffffff);color:var(--text-primary, #374151)}.browser-window-mode-btn--active{background:var(--surface, #ffffff);color:var(--primary, #10b981);box-shadow:0 1px 3px #0000001a}.browser-window-mode-btn svg{flex-shrink:0}.browser-window-paste-btn{position:relative}.browser-window-paste-status{position:absolute;bottom:-32px;left:50%;transform:translate(-50%);padding:4px 8px;background:var(--text-primary, #111827);color:#fff;font-size:10px;white-space:nowrap;border-radius:4px;box-shadow:0 4px 12px #00000026;z-index:50;animation:fadeInUp .2s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translate(-50%) translateY(4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.browser-window-recordable{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;cursor:help;transition:background-color .15s}.browser-window-recordable--yes{background:#22c55e1a;border:1px solid rgba(34,197,94,.3);color:#16a34a}.browser-window-recordable--yes:hover{background:#22c55e26}.browser-window-recordable--no{background:#f59e0b1a;border:1px solid rgba(245,158,11,.3);color:#d97706}.browser-window-recordable--no:hover{background:#f59e0b26}.browser-window-tools-group{display:flex;background:#e5e7eb;border-radius:8px;padding:2px;gap:2px;flex-shrink:0}.browser-window-tool-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:6px;background:transparent;color:#6b7280;cursor:pointer;transition:all .15s ease}.browser-window-tool-btn:hover:not(:disabled){color:#374151;background:#d1d5db}.browser-window-tool-btn:disabled{opacity:.4;cursor:not-allowed}.browser-window-tool-btn.active{background:#6366f11a;color:#4338ca;box-shadow:0 1px 2px #0000000d,inset 0 0 0 1px #6366f133}.browser-window-tools{display:flex;gap:2px;padding:2px;background:#e5e7eb;border-radius:8px}.browser-window-tool-btn--active{background:#6366f11a;color:#4338ca;box-shadow:0 1px 2px #0000000d,inset 0 0 0 1px #6366f133}.browser-window-context-controls{display:flex;align-items:center;gap:12px;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.browser-window-shape-group{display:flex;gap:2px;padding:2px;background:var(--surface-secondary, #f3f4f6);border-radius:6px}.browser-window-shape-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--text-tertiary, #9ca3af);cursor:pointer;transition:all .15s}.browser-window-shape-btn:hover{color:var(--text-secondary, #6b7280)}.browser-window-shape-btn--active{background:var(--surface, #ffffff);color:var(--primary-color, #4f46e5);box-shadow:0 1px 2px #0000001a}.browser-window-size-select{height:32px;padding:0 8px;border:1px solid var(--border-color, #d1d5db);border-radius:4px;background:transparent;font-size:12px;color:var(--text-primary, #374151);outline:none;cursor:pointer}.browser-window-size-select:focus{border-color:var(--primary-color, #4f46e5)}.browser-window-draw-mode-btn{display:flex;align-items:center;gap:6px;height:32px;padding:0 12px;border:1px solid var(--border-color, #d1d5db);border-radius:6px;background:var(--surface, #ffffff);font-size:12px;font-weight:500;color:var(--text-secondary, #6b7280);cursor:pointer;transition:all .15s}.browser-window-draw-mode-btn:hover{border-color:var(--border-color-hover, #9ca3af)}.browser-window-draw-mode-btn--active{background:#4f46e51a;border-color:#4f46e54d;color:var(--primary-color, #4f46e5)}.browser-window-clear-btn{display:flex;align-items:center;gap:6px;height:32px;padding:0 12px;border:1px solid var(--border-color, #d1d5db);border-radius:6px;background:var(--surface, #ffffff);font-size:12px;font-weight:500;color:var(--text-secondary, #6b7280);cursor:pointer;transition:all .15s}.browser-window-clear-btn:hover:not(:disabled){background:#ef44441a;border-color:#ef44444d;color:#dc2626}.browser-window-clear-btn:disabled{opacity:.5;cursor:not-allowed}.browser-window-zoom-controls{display:flex;align-items:center;gap:4px;margin-left:auto}.browser-window-zoom-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--text-secondary, #6b7280);cursor:pointer;transition:background-color .15s}.browser-window-zoom-btn:hover{background:var(--hover-bg, #e5e7eb)}.browser-window-zoom-value{width:40px;font-size:12px;font-family:SF Mono,Monaco,monospace;text-align:center;color:var(--text-secondary, #6b7280)}.browser-window-reset-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--text-tertiary, #9ca3af);cursor:pointer;margin-left:4px;transition:all .15s}.browser-window-reset-btn:hover{background:var(--hover-bg, #f3f4f6);color:var(--primary-color, #4f46e5)}.browser-window-gallery{display:flex;align-items:center;gap:4px;width:100%;max-width:400px;height:36px;padding:0 4px;background:var(--surface, #ffffff);border:1px solid var(--border-color, #e5e7eb);border-radius:8px;box-shadow:0 1px 2px #0000000d}.browser-window-gallery-close{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--text-tertiary, #9ca3af);cursor:pointer;transition:all .15s}.browser-window-gallery-close:hover{background:#ef44441a;color:#dc2626}.browser-window-gallery-divider{width:1px;height:20px;background:var(--border-color, #e5e7eb);margin:0 4px}.browser-window-gallery-nav{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:4px;background:transparent;color:var(--text-tertiary, #9ca3af);cursor:pointer;flex-shrink:0;transition:color .15s}.browser-window-gallery-nav:hover:not(:disabled){color:var(--text-primary, #374151)}.browser-window-gallery-nav:disabled{opacity:.3;cursor:not-allowed}.browser-window-gallery-items{display:flex;gap:4px;flex:1;justify-content:center;align-items:center;overflow:hidden;padding:0 4px}.browser-window-gallery-item{position:relative;width:28px;height:28px;padding:0;border:1px solid var(--border-color, #e5e7eb);border-radius:4px;background:transparent;cursor:pointer;overflow:hidden;flex-shrink:0;opacity:.8;transition:all .15s}.browser-window-gallery-item:hover{opacity:1;border-color:var(--border-color-hover, #9ca3af)}.browser-window-gallery-item--selected{opacity:1;border-color:transparent;box-shadow:0 0 0 2px var(--primary-color, #4f46e5),0 0 0 4px #4f46e533}.browser-window-gallery-item img{width:100%;height:100%;object-fit:cover}.browser-window-gallery-video-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--text-primary, #1f2937);color:#fff}.browser-window-gallery-index{position:absolute;bottom:0;right:0;padding:0 2px;background:#000000b3;font-size:8px;font-weight:700;color:#fff;border-top-left-radius:2px}.browser-window-content{position:relative;flex:1;display:flex;align-items:center;justify-content:center;background:var(--surface-secondary, #f3f4f6);overflow:hidden;outline:none;-webkit-user-select:none;user-select:none;aspect-ratio:var(--canvas-aspect-ratio, 16 / 9);max-width:95%;max-height:calc(100% - 16px);margin:8px auto;border:2px solid var(--border-color, #e5e7eb);border-radius:8px;isolation:isolate}.browser-window-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px;border:2px dashed var(--border-color, #d1d5db);border-radius:12px;background:#f9fafb80;pointer-events:none}.browser-window-empty-icon{display:flex;align-items:center;justify-content:center;width:80px;height:80px;margin-bottom:16px;background:var(--surface, #ffffff);border-radius:16px;box-shadow:0 1px 3px #0000001a;color:#4f46e54d}.browser-window-empty-title{margin:0 0 16px;font-size:18px;font-weight:700;color:var(--text-secondary, #6b7280)}.browser-window-empty-options{display:flex;align-items:center;gap:16px}.browser-window-empty-option{padding:12px 16px;background:var(--surface, #ffffff);border:1px solid var(--border-color, #e5e7eb);border-radius:8px;box-shadow:0 1px 2px #0000000d;font-size:13px;text-align:center;color:var(--text-secondary, #6b7280)}.browser-window-empty-option-label{display:block;margin-bottom:4px;font-weight:700;color:var(--primary-color, #4f46e5)}.browser-window-empty-or{font-size:13px;font-weight:700;color:var(--border-color, #d1d5db)}.browser-window-iframe-container{position:relative;width:100%;height:100%}.browser-window-iframe{width:100%;height:100%;border:none;background:var(--surface, #ffffff)}.browser-window-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:var(--surface, #ffffff);z-index:40}.browser-window-spinner{width:32px;height:32px;border:3px solid var(--border-color, #e5e7eb);border-top-color:var(--primary-color, #4f46e5);border-radius:50%;animation:spin .8s linear infinite}.browser-window-loading span{font-size:14px;font-weight:500;color:var(--primary-color, #4f46e5)}.browser-window-lock-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;pointer-events:none}.browser-window-lock-badge{position:absolute;top:16px;right:16px;padding:6px 12px;background:var(--primary-color, #4f46e5);border-radius:999px;font-size:12px;font-weight:500;color:#fff;box-shadow:0 4px 12px #4f46e54d;animation:pulse 2s ease-in-out infinite}.browser-window-tools-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;background:transparent}.browser-window-annotations-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:20}.browser-window-annotation{position:absolute;border:2px solid #ef4444;background:#ef44441a;box-shadow:0 1px 3px #0000001a;border-radius:2px}.browser-window-annotation--drawing{border-style:dashed;background:#ef44440d}.browser-window-media-wrapper{position:relative;width:fit-content;height:fit-content;transition:transform 75ms ease-out;transform-origin:center center}.browser-window-image{display:block;max-width:none;border-radius:4px;box-shadow:0 10px 40px #00000026;-webkit-user-select:none;user-select:none}.browser-window-video{display:block;max-width:none;border-radius:4px;box-shadow:0 10px 40px #00000026}.browser-window-lens{position:relative;pointer-events:none}.browser-window-lens-crosshair{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;opacity:.3}.browser-window-lens-crosshair-h{width:8px;height:2px;background:var(--primary-color, #4f46e5)}.browser-window-lens-crosshair-v{position:absolute;width:2px;height:8px;background:var(--primary-color, #4f46e5)}.browser-window-viewport-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;pointer-events:none;z-index:30}.browser-window-viewport-mask{background:#0009}.browser-window-viewport-mask--top,.browser-window-viewport-mask--bottom{flex:1;width:100%;min-height:0}.browser-window-viewport-mask--left,.browser-window-viewport-mask--right{flex:1;min-width:0}.browser-window-viewport-row{display:flex;width:100%;flex-shrink:0}.browser-window-viewport-window{position:relative;flex-shrink:0;border:2px solid rgba(255,255,255,.9);box-sizing:border-box}.browser-window-viewport-crosshair{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.3}.browser-window-viewport-crosshair-h{position:absolute;top:50%;left:0;right:0;height:1px;background:#ffffff80}.browser-window-viewport-crosshair-v{position:absolute;left:50%;top:0;bottom:0;width:1px;background:#ffffff80}.browser-window-flowchart-container{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--surface-secondary, #f3f4f6);overflow:hidden;z-index:5}.browser-window-ascii-input-panel{display:flex;flex-direction:column;width:100%;max-width:700px;height:100%;max-height:500px;padding:24px;background:var(--surface-elevated, #ffffff);border-radius:12px;box-shadow:0 8px 32px #0000001f;margin:24px}.ascii-input-header{margin-bottom:16px}.ascii-input-header h3{margin:0 0 4px;font-size:1.125rem;font-weight:600;color:var(--text-primary, #111)}.ascii-input-header p{margin:0;font-size:.875rem;color:var(--text-secondary, #666)}.ascii-input-textarea{flex:1;width:100%;padding:16px;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:13px;line-height:1.5;background:var(--surface, #fafafa);border:1px solid var(--border-color, #e0e0e0);border-radius:8px;resize:none;color:var(--text-primary, #111)}.ascii-input-textarea:focus{outline:none;border-color:var(--primary, #10b981);box-shadow:0 0 0 3px #10b9811a}.ascii-input-textarea::placeholder{color:var(--text-muted, #999);white-space:pre}.ascii-input-actions{display:flex;gap:12px;margin-top:16px;justify-content:flex-end}.ascii-input-btn{padding:10px 20px;font-size:.875rem;font-weight:500;border-radius:8px;border:none;cursor:pointer;transition:all .15s ease}.ascii-input-btn-primary{background:var(--primary, #10b981);color:#fff}.ascii-input-btn-primary:hover:not(:disabled){background:var(--primary-hover, #059669)}.ascii-input-btn-primary:disabled{opacity:.5;cursor:not-allowed}.ascii-input-btn-secondary{background:transparent;color:var(--text-secondary, #666);border:1px solid var(--border-color, #e0e0e0)}.ascii-input-btn-secondary:hover{background:var(--surface-hover, #f5f5f5)}.browser-window-flowchart-panel-wrapper{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0000000d;z-index:10}.browser-window-flowchart-svg-wrapper{position:relative;display:flex;align-items:center;justify-content:center;transition:transform 75ms ease-out;transform-origin:center center}.browser-window-ascii-viewer-wrapper{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:5;overflow:auto}.browser-window-ascii-viewer-wrapper .ascii-viewer-container{width:100%;height:100%;min-height:unset;border-radius:0;border:none}.browser-window-ascii-viewer-wrapper .browser-window-flowchart-edit-btn{position:absolute;top:16px;right:16px;z-index:20;opacity:1;background:#0f111abf;color:#fffc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1)}.browser-window-ascii-viewer-wrapper .browser-window-flowchart-edit-btn:hover{background:#0f111ae6;color:#fff}.browser-window-flowchart-svg{display:flex;align-items:center;justify-content:center;padding:40px;background:#fff;border-radius:8px;box-shadow:0 4px 20px #0000001a}.browser-window-flowchart-svg svg{max-width:100%;max-height:100%;display:block}.browser-window-flowchart-edit-btn{position:absolute;top:8px;right:8px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;background:#ffffffe6;color:var(--text-secondary, #6b7280);border-radius:6px;cursor:pointer;box-shadow:0 2px 8px #0000001a;transition:all .15s ease;opacity:0}.browser-window-flowchart-svg-wrapper:hover .browser-window-flowchart-edit-btn{opacity:1}.browser-window-flowchart-edit-btn:hover{background:#fff;color:var(--primary-color, #6366f1);transform:scale(1.05)}.browser-window-control-btn--active{background:var(--primary-color, #6366f1)!important;color:#fff!important}.browser-window-control-btn--active:hover{background:var(--primary-hover, #4f46e5)!important}.browser-window-flowchart-controls{display:flex;align-items:center;gap:4px;background:#0f111a;padding:4px 8px;border-radius:6px;margin-left:8px;border:1px solid rgba(255,255,255,.1)}.browser-window-flowchart-ctrl-btn{background:transparent;border:none;color:#fffc;cursor:pointer;padding:4px 8px;border-radius:4px;font-size:14px;font-weight:600;transition:all .15s ease;min-width:24px;display:flex;align-items:center;justify-content:center}.browser-window-flowchart-ctrl-btn:hover{background:#ffffff26;color:#fff}.browser-window-flowchart-ctrl-btn:active{transform:scale(.95)}.browser-window-flowchart-zoom-label{color:#ffffffb3;font-size:11px;font-family:JetBrains Mono,Fira Code,monospace;min-width:40px;text-align:center;padding:0 4px}.browser-window-flowchart-theme-select{background:#ffffff1a;border:1px solid rgba(255,255,255,.15);color:#ffffffe6;padding:4px 24px 4px 8px;border-radius:4px;font-size:11px;cursor:pointer;margin-left:8px;min-width:130px;position:relative;z-index:100;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.7)' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 6px center}.browser-window-flowchart-theme-select:hover{background-color:#ffffff26;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}.browser-window-flowchart-theme-select:focus{outline:none;border-color:var(--primary-color, #6366f1);box-shadow:0 0 0 2px #6366f140}.browser-window-flowchart-theme-select option{background:#1f2937;color:#fff;padding:8px 12px}.browser-window-flowchart-ctrl-btn.active{background:var(--primary-color, #6366f1);color:#fff}.browser-window-ascii-edit-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:#0f111af2;z-index:15;padding:20px}.browser-window-ascii-edit-textarea{flex:1;width:100%;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:20px;color:#c0caf5;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:14px;line-height:1.25;resize:none;outline:none}.browser-window-ascii-edit-textarea:focus{border-color:var(--primary-color, #6366f1)}.browser-window-ascii-edit-hint{padding:10px 0 0;color:#ffffff80;font-size:12px;text-align:center}.browser-window-video-url-group{display:flex;align-items:center;gap:4px;margin-left:8px}.browser-window-video-url-input{width:160px;height:28px;padding:0 8px;border:1px solid rgba(255,255,255,.2);border-radius:4px;background:#0000004d;color:#fff;font-size:12px;outline:none;transition:border-color .2s}.browser-window-video-url-input::placeholder{color:#fff6}.browser-window-video-url-input:focus{border-color:var(--primary-color, #6366f1)}.browser-window-video-url-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:4px;background:var(--primary-color, #6366f1);color:#fff;cursor:pointer;transition:background .2s,opacity .2s}.browser-window-video-url-btn:hover:not(:disabled){background:var(--primary-hover, #4f46e5)}.browser-window-video-url-btn:disabled{opacity:.5;cursor:not-allowed}.browser-window-video-play-btn{background:#6366f11a!important;border-color:#6366f14d!important;color:#818cf8!important}.browser-window-video-play-btn:hover{background:#6366f133!important;color:#a5b4fc!important}.browser-window-video-mute-btn{margin-left:4px}.browser-window-video-mute-btn--muted{color:#f87171!important;background:#f871711a!important;border-color:#f871714d!important}.browser-window-video-mute-btn:not(.browser-window-video-mute-btn--muted){color:#4ade80!important;background:#4ade801a!important;border-color:#4ade804d!important}.browser-window-youtube-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;transform-origin:center center}.browser-window-youtube-iframe{width:100%;height:100%;border:none;background:#000}.fullscreen-controls{position:fixed;bottom:0;left:0;right:0;height:44px;z-index:10001;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;padding:0 16px;background:#111;border-top:1px solid rgba(255,255,255,.1);opacity:1;transition:opacity .3s ease}.fullscreen-controls.hidden{opacity:.3}.fullscreen-controls-tab{display:flex;align-items:center;color:#fff9;font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.3px}.tab-indicator{padding:2px 6px;background:#ffffff1a;border-radius:3px;color:#fffc;font-size:10px}.fullscreen-controls-buttons{display:flex;align-items:center;gap:4px}.fullscreen-control-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:50%;background:#ffffff26;color:#fff;cursor:pointer;transition:all .15s ease}.fullscreen-control-btn:hover{background:#ffffff40}.fullscreen-control-btn:active{transform:scale(.95)}.fullscreen-control-btn.play-pause{width:32px;height:32px;background:#10b981}.fullscreen-control-btn.play-pause:hover{background:#059669}.fullscreen-control-btn.exit{width:24px;height:24px;background:#ef444466}.fullscreen-control-btn.exit:hover{background:#ef444499}.fullscreen-control-btn.countdown{width:26px;height:26px;background:#3b82f666}.fullscreen-control-btn.countdown:hover{background:#3b82f699}.fullscreen-control-btn svg{width:16px;height:16px}.fullscreen-control-btn.play-pause svg{width:18px;height:18px}.fullscreen-control-btn.exit svg{width:14px;height:14px}.fullscreen-control-btn.countdown svg{width:14px;height:14px}.fullscreen-controls-hints{display:flex;align-items:center;gap:8px;color:#fff6;font-size:9px;margin-left:4px}.fullscreen-controls-hints span{white-space:nowrap}.fullscreen-controls-tab-toggles{display:flex;align-items:center;gap:3px;margin-left:6px;padding-left:6px;border-left:1px solid rgba(255,255,255,.15)}.fullscreen-tab-toggle{padding:3px 8px;border:none;border-radius:10px;background:#ffffff1a;color:#fff9;font-size:9px;font-weight:500;cursor:pointer;transition:all .15s ease;white-space:nowrap;max-width:80px;overflow:hidden;text-overflow:ellipsis}.fullscreen-tab-toggle:hover{background:#fff3;color:#ffffffe6}.fullscreen-tab-toggle.active{background:#10b981cc;color:#fff}.fullscreen-tab-toggle.active:hover{background:#10b981}.fullscreen-countdown-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10002;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000000e6;animation:countdown-fade-in .2s ease}@keyframes countdown-fade-in{0%{opacity:0}to{opacity:1}}.countdown-number{font-size:140px;font-weight:700;color:#fff;text-shadow:0 0 30px rgba(255,255,255,.4);animation:countdown-pulse 1s ease infinite;display:flex;align-items:center;justify-content:center}.countdown-number svg{width:100px;height:100px;animation:countdown-pulse 1s ease infinite}@keyframes countdown-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}.countdown-hint{margin-top:30px;color:#ffffff80;font-size:13px}.countdown-hint kbd{display:inline-block;padding:3px 6px;margin:0 3px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:3px;font-family:Monaco,Consolas,monospace;font-size:11px}@media (max-width: 768px){.fullscreen-controls{padding:3px 6px;bottom:4px}.fullscreen-controls-hints{display:none}.countdown-number{font-size:100px}}.phase-rail{display:flex;flex-direction:column;align-items:center;width:64px;height:100%;background:linear-gradient(180deg,#1e1b4b,#312e81);border-right:1px solid rgba(255,255,255,.1);padding:12px 0;gap:8px}.phase-rail-logo{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:#ffffff1a;color:#a5b4fc;margin-bottom:8px;transition:all .2s ease}.phase-rail-logo:hover{background:#ffffff26;color:#c7d2fe}.phase-rail-logo svg{flex-shrink:0}.phase-rail-nav{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1;padding:8px 0}.phase-rail-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:56px;padding:10px 4px;border:none;border-radius:10px;background:transparent;color:#fff9;cursor:pointer;transition:all .2s ease;position:relative}.phase-rail-btn:hover:not(:disabled){background:#ffffff40;color:#fff}.phase-rail-btn.active{background:#ffffff26;color:#fff}.phase-rail-btn.active:hover:not(:disabled){background:#fff3;color:#fff!important}.phase-rail-btn.active:before{content:"";position:absolute;left:-8px;top:50%;transform:translateY(-50%);width:3px;height:24px;background:#818cf8;border-radius:0 2px 2px 0}.phase-rail-btn:disabled{opacity:.4;cursor:not-allowed}.phase-rail-icon{display:flex;align-items:center;justify-content:center}.phase-rail-icon svg{width:20px;height:20px}.phase-rail-label{font-size:10px;font-weight:500;text-align:center;white-space:nowrap;font-family:Inter,system-ui,sans-serif}.phase-rail-footer{display:flex;flex-direction:column;align-items:center;gap:4px;padding-top:8px;border-top:1px solid rgba(255,255,255,.1);margin-top:auto}.phase-rail-divider{width:36px;height:1px;background:#ffffff26;margin:4px 0}.phase-rail-footer .phase-rail-btn{width:56px;padding:8px 4px}.phase-rail-projects{color:#fff9}.phase-rail-projects:hover{background:#ffffff1a;color:#818cf8}.phase-rail-voice{color:#fff9}.phase-rail-voice:hover{background:#ffffff1a;color:#4682b4}.phase-rail-settings{color:#ffffff80}.phase-rail-settings:hover{background:#ffffff1a;color:#fffc}.phase-rail-footer .phase-rail-btn svg{flex-shrink:0}@media (max-width: 900px){.phase-rail{display:none}}@media (prefers-color-scheme: dark){.phase-rail{background:linear-gradient(180deg,#0f0d24,#1e1b4b)}}.ai-settings-panel{display:flex;flex-direction:column;gap:12px;padding:12px;max-width:100%}.ai-settings-header{margin-bottom:6px;padding-bottom:10px;border-bottom:1px solid var(--border-color, #e5e7eb)}.ai-settings-header h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:14px;font-weight:600;color:var(--text-primary, #111827)}.ai-settings-header h3 svg{width:18px;height:18px;color:var(--primary-color, #4f46e5);filter:drop-shadow(0 1px 2px rgba(79,70,229,.2))}.ai-settings-header p{margin:0;font-size:11px;color:var(--text-secondary, #6b7280);line-height:1.4}.ai-settings-section{background:var(--surface, #ffffff);border:1px solid var(--border-color, #e5e7eb);border-radius:8px;padding:12px;transition:box-shadow .2s ease}.ai-settings-section:hover{box-shadow:0 2px 8px #0000000a}.section-title{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--text-primary, #111827);margin-bottom:10px}.section-title svg{width:16px;height:16px;color:var(--primary-color, #4f46e5);opacity:.8}.section-description{font-size:11px;color:var(--text-secondary, #6b7280);margin:0 0 10px;line-height:1.4}.toggle-row{display:flex;align-items:center;gap:10px;cursor:pointer;padding:6px 8px;margin:-6px -8px;border-radius:6px;transition:background .15s ease}.toggle-row:hover{background:#4f46e50a}.toggle-row input[type=checkbox]{width:36px;height:20px;accent-color:var(--primary-color, #4f46e5);cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:#e5e7eb;border-radius:10px;position:relative;transition:background .2s ease}.toggle-row input[type=checkbox]:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:50%;box-shadow:0 1px 3px #00000026;transition:transform .2s ease}.toggle-row input[type=checkbox]:checked{background:var(--primary-color, #4f46e5)}.toggle-row input[type=checkbox]:checked:after{transform:translate(16px)}.toggle-label{font-size:12px;color:var(--text-primary, #111827);font-weight:500}.settings-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border-color, #e5e7eb)}.setting-field{display:flex;flex-direction:column;gap:4px}.setting-field label{font-size:10px;font-weight:600;color:var(--text-secondary, #6b7280);text-transform:uppercase;letter-spacing:.3px}.setting-field select{padding:6px 8px;border:1px solid var(--border-color, #d1d5db);border-radius:6px;font-size:12px;color:var(--text-primary, #374151);background:var(--background, #f9fafb);cursor:pointer;transition:all .15s ease}.setting-field select:hover{border-color:var(--primary-color, #4f46e5);background:var(--surface, #ffffff)}.setting-field select:focus{outline:none;border-color:var(--primary-color, #4f46e5);box-shadow:0 0 0 3px #4f46e51a;background:var(--surface, #ffffff)}.field-hint{font-size:10px;color:var(--text-tertiary, #9ca3af);font-style:italic;margin-top:2px}.content-mode-options{display:flex;flex-direction:column;gap:4px;background:var(--background, #f3f4f6);border-radius:8px;padding:4px}.content-mode-option{display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:10px 12px;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease;background:transparent}.content-mode-option:hover{background:#ffffff80}.content-mode-option.selected{background:var(--surface, #ffffff);box-shadow:0 1px 3px #0000001a}.content-mode-option input[type=radio]{display:none}.content-mode-option .option-content{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.content-mode-option .option-title{font-size:12px;font-weight:500;color:var(--text-primary, #111827)}.content-mode-option.selected .option-title{color:var(--primary-color, #4f46e5);font-weight:600}.content-mode-option .option-desc{font-size:10px;color:var(--text-secondary, #6b7280);max-width:100%;text-align:left}.diagram-options{display:flex;flex-direction:column;gap:4px;background:var(--background, #f3f4f6);border-radius:8px;padding:4px}.diagram-option{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease;flex:1;min-width:fit-content;background:transparent}.diagram-option:hover{background:#ffffff80}.diagram-option.selected{background:var(--surface, #ffffff);box-shadow:0 1px 3px #0000001a}.option-content{display:flex;flex-direction:column;align-items:center;gap:2px}.option-title{font-size:11px;font-weight:500;color:var(--text-primary, #111827);white-space:nowrap}.diagram-option.selected .option-title{color:var(--primary-color, #4f46e5);font-weight:600}.option-desc{font-size:9px;color:var(--text-secondary, #6b7280);text-align:center;max-width:100px;line-height:1.2}.ai-settings-info{display:flex;align-items:center;gap:8px;padding:10px 12px;background:linear-gradient(135deg,#4f46e50d,#8b5cf60d);border:1px solid rgba(79,70,229,.1);border-radius:8px;font-size:11px;color:var(--text-secondary, #6b7280)}.ai-settings-info svg{flex-shrink:0;width:14px;height:14px;color:var(--primary-color, #4f46e5)}@media (max-width: 400px){.settings-grid{grid-template-columns:1fr}.diagram-options{flex-direction:column;gap:4px}.diagram-option{padding:10px}}@media (prefers-color-scheme: dark){.ai-settings-header h3{color:#f9fafb}.ai-settings-header h3 svg{color:#818cf8;filter:drop-shadow(0 1px 2px rgba(129,140,248,.2))}.ai-settings-header p{color:#9ca3af}.ai-settings-header{border-bottom-color:#374151}.ai-settings-section{background:#1f2937;border-color:#374151}.ai-settings-section:hover{box-shadow:0 2px 8px #0003}.section-title{color:#f9fafb}.section-title svg{color:#818cf8}.section-description{color:#9ca3af}.toggle-row:hover{background:#818cf814}.toggle-row input[type=checkbox]{background:#4b5563}.toggle-row input[type=checkbox]:checked{background:#818cf8}.toggle-label{color:#f9fafb}.settings-grid{border-top-color:#374151}.setting-field label{color:#9ca3af}.setting-field select{background:#374151;border-color:#4b5563;color:#f9fafb}.setting-field select:hover{border-color:#818cf8;background:#4b5563}.setting-field select:focus{border-color:#818cf8;box-shadow:0 0 0 3px #818cf826;background:#4b5563}.content-mode-options,.diagram-options{background:#374151}.content-mode-option:hover,.diagram-option:hover{background:#ffffff0d}.content-mode-option.selected,.diagram-option.selected{background:#4b5563;box-shadow:0 1px 3px #0000004d}.content-mode-option .option-title,.option-title{color:#f9fafb}.content-mode-option.selected .option-title,.diagram-option.selected .option-title{color:#818cf8}.content-mode-option .option-desc,.option-desc{color:#9ca3af}.ai-settings-info{background:linear-gradient(135deg,#818cf81a,#a78bfa1a);border-color:#818cf826;color:#9ca3af}.ai-settings-info svg{color:#818cf8}}.audio-player-controls{background:#2d2d2d;border-radius:12px;padding:16px 20px;display:flex;flex-direction:column;gap:12px}.audio-player-buttons{display:flex;align-items:center;justify-content:center;gap:16px}.audio-control-btn{display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:#e0e0e0;cursor:pointer;padding:8px;border-radius:8px;transition:all .15s ease}.audio-control-btn:hover{background:#ffffff1a;color:#fff}.audio-control-btn.active{color:#4682b4}.audio-control-btn:disabled{opacity:.4;cursor:not-allowed}.audio-control-btn.play-btn{width:48px;height:48px;background:#ffffff1a;border-radius:50%}.audio-control-btn.play-btn:hover{background:#fff3;transform:scale(1.05)}.audio-player-progress{display:flex;align-items:center;gap:12px}.audio-time{font-size:12px;font-family:monospace;color:#aaa;min-width:36px}.audio-time.current{text-align:right}.audio-time.duration{text-align:left}.audio-progress-slider{flex:1;height:6px;background:#555;border-radius:3px;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;outline:none}.audio-progress-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:#fff;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px #0000004d;transition:transform .1s ease}.audio-progress-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.audio-progress-slider::-moz-range-thumb{width:14px;height:14px;background:#fff;border-radius:50%;border:none;cursor:pointer;box-shadow:0 2px 4px #0000004d}.audio-player-controls.light{background:#f8f9fa;border:1px solid #e0e0e0}.audio-player-controls.light .audio-control-btn{color:#555}.audio-player-controls.light .audio-control-btn:hover{background:#00000014;color:#333}.audio-player-controls.light .audio-control-btn.play-btn{background:#4682b4;color:#fff}.audio-player-controls.light .audio-control-btn.play-btn:hover{background:#315c80}.audio-player-controls.light .audio-progress-slider{background:#ddd}.audio-player-controls.light .audio-progress-slider::-webkit-slider-thumb{background:#4682b4}.audio-player-controls.light .audio-time{color:#666}.audio-player-controls.compact{padding:10px 14px;gap:8px}.audio-player-controls.compact .audio-player-buttons{gap:10px}.audio-player-controls.compact .audio-control-btn{padding:6px}.audio-player-controls.compact .audio-control-btn.play-btn{width:36px;height:36px}.audio-player-controls.compact .audio-control-btn.play-btn svg{width:18px;height:18px}.segment-context-menu{position:fixed;z-index:10000;background:#fff;border:1px solid #e0e0e0;border-radius:8px;box-shadow:0 4px 16px #00000026,0 2px 4px #0000001a;min-width:180px;padding:6px 0;animation:contextMenuFadeIn .15s ease-out}@keyframes contextMenuFadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu-list{list-style:none;margin:0;padding:0}.context-menu-item{display:flex;align-items:center;gap:10px;padding:8px 14px;font-size:13px;color:#333;cursor:pointer;transition:background .15s}.context-menu-item:hover{background:#f5f5f5}.context-menu-item svg{flex-shrink:0;color:#666}.context-menu-item:hover svg{color:#333}.context-menu-item span{flex:1}.context-menu-arrow{opacity:.5;margin-left:auto}.context-menu-item.play:hover{background:#2196f31a}.context-menu-item.play:hover svg{color:#2196f3}.context-menu-item.play:hover span{color:#1976d2}.context-menu-item.delete{color:#c62828}.context-menu-item.delete svg{color:#c62828}.context-menu-item.delete:hover{background:#c628281a}.context-menu-divider{height:1px;background:#e0e0e0;margin:4px 0}.context-menu-pause-input{padding:10px 14px}.pause-input-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:12px;font-weight:600;color:#555}.pause-input-back{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;background:transparent;border-radius:4px;color:#666;cursor:pointer;transition:all .15s}.pause-input-back:hover{background:#f0f0f0;color:#333}.pause-input-row{display:flex;align-items:center;gap:8px}.pause-input-row input{width:70px;padding:6px 10px;border:1px solid #ddd;border-radius:4px;font-size:14px;font-family:JetBrains Mono,monospace;text-align:center}.pause-input-row input:focus{outline:none;border-color:#2196f3;box-shadow:0 0 0 2px #2196f333}.pause-input-unit{font-size:12px;color:#888}.pause-input-add{padding:6px 14px;border:none;border-radius:4px;background:#2196f3;color:#fff;font-size:13px;font-weight:500;cursor:pointer;transition:background .15s}.pause-input-add:hover{background:#1976d2}.video-player-panel{display:flex;flex-direction:column;gap:12px;padding:12px;background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px}.video-player-panel.disabled{opacity:.6;pointer-events:none}.video-player-container{position:relative;width:100%;background:#1a1a1a;border-radius:6px;overflow:hidden}.video-player-video{display:block;width:100%;max-height:320px;object-fit:contain;background:#000;cursor:pointer}.video-player-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;padding:32px;color:#888;text-align:center;gap:16px}.video-player-placeholder svg{opacity:.5}.video-player-placeholder p{margin:0;font-size:14px}.video-player-upload-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;background:#4682b4;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s}.video-player-upload-btn:hover{background:#315c80}.video-player-controls{display:flex;align-items:center;gap:12px;padding:8px 12px;background:#fff;border:1px solid #e0e0e0;border-radius:6px}.video-player-controls-left,.video-player-controls-right{display:flex;align-items:center;gap:4px;flex-shrink:0}.video-player-timeline{flex:1;display:flex;align-items:center;gap:8px;min-width:0}.video-player-slider{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e0e0e0;border-radius:3px;outline:none;cursor:pointer}.video-player-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#4682b4;cursor:pointer;transition:transform .15s;border:2px solid #fff;box-shadow:0 1px 3px #0003}.video-player-slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.video-player-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#4682b4;cursor:pointer;border:2px solid #fff;box-shadow:0 1px 3px #0003}.video-player-time{font-size:12px;font-family:JetBrains Mono,monospace;color:#555;min-width:50px;text-align:center;flex-shrink:0}.video-player-btn{display:flex;align-items:center;justify-content:center;padding:6px;background:#f8f9fa;border:1px solid #ddd;border-radius:4px;color:#555;cursor:pointer;transition:all .15s;min-width:32px;min-height:32px}.video-player-btn:hover:not(:disabled){background:#e9ecef;border-color:#ccc;color:#333}.video-player-btn:disabled{opacity:.4;cursor:not-allowed}.video-player-btn.primary{background:#4682b4;border-color:#4682b4;color:#fff}.video-player-btn.primary:hover:not(:disabled){background:#315c80;border-color:#315c80}.video-player-btn.danger{color:#dc3545}.video-player-btn.danger:hover:not(:disabled){background:#dc35451a;border-color:#dc3545}.video-player-btn.active{background:#4682b4;border-color:#4682b4;color:#fff}.video-player-btn.small{min-width:28px;min-height:28px;padding:4px 8px;font-size:12px}.video-player-sync-controls{display:flex;flex-wrap:wrap;gap:16px;padding:10px 12px;background:#fff;border:1px solid #e0e0e0;border-radius:6px}.video-player-control-group{display:flex;align-items:center;gap:6px}.video-player-control-label{font-size:12px;font-weight:500;color:#666;min-width:45px}.video-player-offset-value{min-width:45px;text-align:center;font-size:12px;font-family:JetBrains Mono,monospace;color:#4682b4;font-weight:600}.video-player-toggle-group{display:flex;gap:2px;background:#e9ecef;border-radius:4px;padding:2px}.video-player-toggle-group .video-player-btn{border:none;background:transparent}.video-player-toggle-group .video-player-btn.active{background:#4682b4;color:#fff;border-radius:3px}.video-player-speed-buttons{display:flex;gap:2px}.video-player-speed-buttons .video-player-btn{min-width:36px;font-size:11px}.video-player-segment-info{display:flex;align-items:center;gap:12px;padding:10px 12px;background:linear-gradient(90deg,#4682b41a,#4682b40d);border:1px solid rgba(70,130,180,.2);border-left:3px solid #4682b4;border-radius:6px;font-size:13px}.video-player-segment-label{color:#333;flex-shrink:0}.video-player-segment-label strong{color:#4682b4}.video-player-segment-gap{color:#888;font-style:italic}.video-player-segment-text{color:#555;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.video-player-filename{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#f8f9fa;border-radius:4px;font-size:11px;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.video-player-filename svg{flex-shrink:0;opacity:.6}@media (max-width: 600px){.video-player-sync-controls{flex-direction:column;gap:12px}.video-player-control-group{width:100%;justify-content:space-between}.video-player-speed-buttons{flex-wrap:wrap}}.live-narrator-tab{display:flex;flex-direction:column;height:100%;gap:0;color:#333;overflow:hidden;padding:0}.live-narrator-header{margin-bottom:8px}.live-narrator-header h2{font-size:18px;font-weight:600;color:#1a1a1a;margin:0 0 4px;display:flex;align-items:center;gap:8px}.live-narrator-header p{font-size:13px;color:#666;margin:0}.narrator-stepper{display:flex;justify-content:space-between;margin-bottom:12px;position:relative;padding:0 10px;flex-shrink:0}.narrator-stepper:before{content:"";position:absolute;top:12px;left:10px;right:10px;height:2px;background-color:#e0e0e0;z-index:0}.step-indicator{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;opacity:.6;transition:all .2s}.step-indicator.active{opacity:1}.step-indicator.completed .step-number{background-color:#4caf50;color:#fff;border-color:#4caf50}.step-indicator.available .step-number{border-color:#90caf9;color:#64b5f6}.step-indicator.available:hover .step-number{border-color:#2196f3;color:#2196f3;transform:scale(1.05)}.step-indicator.disabled{opacity:.4;cursor:not-allowed!important}.step-number{width:24px;height:24px;border-radius:50%;background-color:#fff;border:2px solid #ccc;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:#666;transition:all .2s}.step-indicator.active .step-number{border-color:#2196f3;color:#2196f3;transform:scale(1.1)}.step-label{font-size:11px;font-weight:500;color:#666}.wizard-step{background:#fff;border:1px solid #eee;border-radius:8px;padding:16px;box-shadow:0 2px 4px #00000005}.narrator-actions{margin-top:24px;padding-top:16px;flex-shrink:0;background:#fff;position:sticky;bottom:0;z-index:10;border-top:1px solid #ddd;padding-bottom:8px}.step-title{font-size:16px;font-weight:600;margin:0 0 16px;color:#333}.narrator-input-group{margin-bottom:16px;display:flex;flex-direction:column;flex:1;min-height:0}.narrator-label{display:block;font-size:13px;font-weight:500;margin-bottom:6px;color:#444}.narrator-textarea{width:100%;min-height:120px;flex:1;padding:10px;border:1px solid #ddd;border-radius:6px;font-family:inherit;font-size:13px;resize:vertical}.narrator-textarea:focus{outline:none;border-color:#2196f3;box-shadow:0 0 0 2px #2196f31a}.narrator-btn{padding:8px 16px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;border:none;transition:all .2s}.narrator-btn.primary{background-color:#2196f3;color:#fff}.narrator-btn.primary:hover{background-color:#1976d2}.narrator-btn:disabled{opacity:.6;cursor:not-allowed}.segments-list{display:flex;flex-direction:column;gap:1px;background:#e0e0e0;min-height:100%;height:100%}.segment-item{display:flex;gap:12px;padding:12px 16px;background:#fff;align-items:flex-start;font-size:13px;border-left:4px solid transparent}.segment-item.narration{border-left-color:#2196f3}.segment-item.cue{background:#f8fbff;border-left-color:#ff9800}.segment-item.pause{background:#fafafa;border-left-color:#9e9e9e;border-bottom:1px dashed #e0e0e0}.segment-icon{font-size:16px;margin-top:2px;flex-shrink:0;width:24px;text-align:center}.segment-content{flex:1;min-width:0}.segment-header{display:flex;justify-content:space-between;margin-bottom:4px;font-size:11px}.segment-type-badge{font-weight:700;color:#666;font-size:10px;letter-spacing:.5px}.segment-duration{font-family:monospace;background:#eee;padding:2px 6px;border-radius:4px;color:#555}.segment-text{color:#333;line-height:1.4}.segment-action{margin-top:4px;font-size:11px;color:#d84315;background:#fbe9e7;display:inline-block;padding:2px 6px;border-radius:4px}.action-label{font-weight:600}.segments-summary{padding:12px 16px;background:#eee;text-align:right;font-weight:600;color:#333;border-top:1px solid #ccc;font-size:13px}.live-narrator-header-row{display:flex;justify-content:space-between;align-items:flex-start;flex-shrink:0;padding:8px 0 0}.header-title h2{font-size:16px;margin:0}.header-title p{font-size:12px;color:#666;margin:0;line-height:1.3}.project-actions{display:flex;gap:8px}.narrator-btn.small{padding:4px 12px;font-size:12px;height:32px;display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #ddd;box-shadow:0 1px 2px #0000000d}.narrator-btn.small:hover{background:#f8f9fa;border-color:#ccc;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.narrator-btn.outline{background:transparent;border:1px solid #ddd;color:#333}.narrator-btn.outline:hover{background:#f5f5f5;border-color:#ccc}.narrator-btn.small.primary{background:#2196f3;color:#fff;border-color:#1976d2}.narrator-btn.small.primary:hover{background:#1976d2;border-color:#1565c0}.project-name-bar{margin-bottom:10px;display:flex;gap:8px;align-items:center;flex-shrink:0}.project-name-input{width:100%;padding:6px 10px;font-size:14px;border:1px solid #ddd;border-radius:4px;background:#fdfdfd;transition:all .2s}.project-name-input:focus{border-color:#2196f3;outline:none;background:#fff}.duration-input{width:60px;padding:2px 4px;border:1px solid #ddd;border-radius:3px;font-size:11px;font-family:monospace;text-align:right}.processing-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#ffffffe6;z-index:100;display:flex;align-items:center;justify-content:center;border-radius:8px}.processing-box{background:#fff;padding:20px;border-radius:8px;box-shadow:0 4px 12px #00000026;text-align:center;width:80%;max-width:300px}.spinner{width:24px;height:24px;border:3px solid #f3f3f3;border-top:3px solid #2196f3;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 12px}.processing-text{font-size:13px;font-weight:500;color:#333;margin-bottom:10px}.progress-bar-container{height:6px;background:#eee;border-radius:3px;overflow:hidden;margin-bottom:6px}.progress-bar-fill{height:100%;background:#2196f3;width:0%;transition:width .3s ease}.progress-stats{font-size:11px;color:#888}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:1000;display:flex;align-items:center;justify-content:center}.modal-content{background:#fff;padding:20px;border-radius:8px;width:90%;max-width:400px;max-height:80vh;display:flex;flex-direction:column}.modal-content h3{margin:0 0 16px;font-size:16px}.project-list{overflow-y:auto;flex:1;border:1px solid #eee;border-radius:6px}.project-list-item{padding:10px;border-bottom:1px solid #eee;cursor:pointer;transition:background .2s}.project-list-item:hover{background:#f5f5f5}.project-list-item:last-child{border-bottom:none}.project-name{font-weight:500;font-size:13px;color:#333}.project-date{font-size:11px;color:#888;margin-top:2px}.empty-projects{padding:20px;text-align:center;color:#888;font-size:13px}.export-options{margin-top:10px;display:flex;align-items:center;gap:8px;font-size:13px}.format-select{padding:4px 8px;border-radius:4px;border:1px solid #ddd;font-size:13px}.live-narrator-split-view{display:flex;gap:12px;flex:1;min-height:0;overflow:hidden;padding:8px}.live-narrator-main-panel{flex:0 0 380px;max-width:380px;min-width:0;display:flex;flex-direction:column;min-height:0;height:100%;overflow-y:auto;overflow-x:hidden;padding:12px;box-sizing:border-box}.live-narrator-script-panel{flex:1;background:#fff;border:1px solid #e0e0e0;border-radius:8px;display:flex;flex-direction:column;min-height:0;overflow:hidden;box-shadow:0 2px 8px #0000000d}.script-panel-header{padding:10px 16px;background:#f8f9fa;border-bottom:1px solid #e0e0e0;font-weight:600;color:#495057;display:flex;justify-content:space-between;align-items:center;font-size:13px;flex-shrink:0}.script-segment-count{font-size:12px;color:#888;font-weight:400;margin-left:auto;margin-right:16px}.script-teleprompter{flex:1;overflow-y:auto;padding:20px;font-family:Segoe UI,system-ui,sans-serif;background:#fdfdfd}.tele-segment{margin-bottom:4px;padding:8px 12px;border-radius:6px;transition:all .2s;border:1px solid transparent;display:grid;grid-template-columns:32px 44px 36px 1fr;gap:8px;align-items:start}.tele-segment:hover{background:#f8f9fa;border-color:#eee}.tele-segment:focus{outline:2px solid #2196f3;outline-offset:2px;background-color:#e3f2fd}.tele-segment.narration{border-left:4px solid #2196f3;background:#f1f8ff}.tele-segment.cue{border-left:4px solid #ff9800;background:#fff9db}.tele-segment.pause{border-left:4px solid #adb5bd;background:#f8f9fa;color:#868e96;font-style:italic;border:1px dashed #e0e0e0}.tele-row-number{font-size:10px;color:#999;font-family:monospace;text-align:right;padding-top:2px}.tele-cumulative-time{font-size:10px;color:#4682b4;font-family:monospace;background:#e8f4fc;padding:2px 4px;border-radius:3px;text-align:center;white-space:nowrap}.tele-timestamp{font-size:10px;color:#666;font-family:monospace;background:#eee;padding:2px 6px;border-radius:4px;text-align:center;white-space:nowrap}.tele-text{font-size:14px;line-height:1.5;color:#333}.tele-action{font-size:13px;font-weight:600;color:#d84315;margin-top:4px;display:block}.wizard-content{flex:1;overflow-y:auto;overflow-x:hidden;padding-right:4px;min-height:0;display:flex;flex-direction:column}.wizard-step{flex:1;display:flex;flex-direction:column;overflow-y:auto;padding-right:4px;height:100%;min-height:0}.preview-container{flex:1 1 auto;min-height:150px;overflow-y:auto}.live-narrator-main-panel.preview-mode .wizard-content{overflow:hidden;flex:1;display:flex;flex-direction:column;height:100%}.live-narrator-main-panel.preview-mode .wizard-step{overflow:hidden;flex:1;display:flex;flex-direction:column;height:100%;min-height:0}.live-narrator-main-panel.preview-mode .preview-container{flex:1;overflow-y:auto;min-height:0}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.narrator-toast{animation:slideInRight .3s ease-out}.voice-finetune-section .narrator-range{height:6px;background:#e0e0e0;border-radius:3px;cursor:pointer}.voice-finetune-section .narrator-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;background:#2196f3;border-radius:50%;cursor:pointer}.tele-pause-input:focus{outline:none;border-color:#2196f3!important;box-shadow:0 0 0 2px #2196f333}.tele-pause-input:hover{border-color:#aaa!important}.teleprompter-search-input:focus{border-color:#2196f3!important;box-shadow:0 0 0 2px #2196f31a}.tele-editable-text{outline:none;transition:all .2s ease}.tele-editable-text:hover{background:#2196f30d!important;border-color:#e0e0e0!important}.tele-cue-text:hover{background:#ff98000d!important}.voice-finetune-section input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e0e0e0;border-radius:2px;height:4px}.voice-finetune-section input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;background:#2196f3;border-radius:50%;cursor:pointer}.voice-finetune-section input[type=range]::-moz-range-thumb{width:12px;height:12px;background:#2196f3;border-radius:50%;cursor:pointer;border:none}.tele-row-number{min-width:24px!important;font-size:10px!important;color:#999!important}.live-narrator-main-panel.preview-mode{overflow:hidden!important}.live-narrator-main-panel.preview-mode .wizard-content{overflow:hidden;display:flex!important;flex-direction:column;flex:1;height:100%}.live-narrator-main-panel.preview-mode .wizard-step{display:flex!important;flex-direction:column;flex:1;height:100%;overflow:hidden;min-height:0}.live-narrator-main-panel.preview-mode .preview-container{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;display:flex;flex-direction:column}.live-narrator-main-panel.preview-mode .preview-container .segments-list{flex:1;min-height:0}.segment-item.live-playing,.tele-segment.live-playing,.tele-segment.live-narrator-playing,.tele-segment.voice-dubbing-playing{background:linear-gradient(135deg,#00c8c82e,#0096b41f)!important;border-left-color:#00c8c8!important;box-shadow:0 0 12px #00c8c866,inset 0 0 10px #00c8c814!important;border:2px solid rgba(0,200,200,.5)!important;border-left-width:4px!important;animation:livePlayingPulse 1.5s ease-in-out infinite;z-index:10;position:relative}@keyframes livePlayingPulse{0%,to{box-shadow:0 0 12px #00c8c866,inset 0 0 10px #00c8c814}50%{box-shadow:0 0 18px #00c8c88c,inset 0 0 15px #00c8c81f}}.segment-item.live-playing:after,.tele-segment.live-playing:after,.tele-segment.live-narrator-playing:after,.tele-segment.voice-dubbing-playing:after{content:"🔊";position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:16px;animation:speakerBounce .6s ease-in-out infinite alternate}@keyframes speakerBounce{0%{transform:translateY(-50%) scale(1);opacity:.8}to{transform:translateY(-50%) scale(1.15);opacity:1}}.tele-segment.segment-played .tele-timestamp,.segment-item.segment-played .segment-duration{background:#d4edda!important;color:#155724!important;border:1px solid #c3e6cb}.tele-segment.segment-played .tele-timestamp:after,.segment-item.segment-played .segment-duration:after{content:" ✓";font-size:10px;color:#28a745}.tele-segment{position:relative}.tele-segment .segment-play-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:#4682b4;border:none;color:#fff;display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 6px #0003;transition:all .2s;z-index:20}.tele-segment:hover .segment-play-btn{display:flex}.tele-segment .segment-play-btn:hover{background:#00c8c8;transform:translateY(-50%) scale(1.1);box-shadow:0 0 10px #00c8c880}.tele-segment.live-playing .segment-play-btn,.tele-segment.live-narrator-playing .segment-play-btn,.tele-segment.voice-dubbing-playing .segment-play-btn{display:none!important}.tele-segment.pause,.segment-item.pause{min-height:48px!important;padding:10px 16px!important;background:linear-gradient(to bottom,#f5f5f5,#eee)!important;border:1px dashed #bdbdbd!important;border-left:4px solid #9e9e9e!important;display:flex!important;align-items:center;gap:12px}.tele-segment.pause .tele-row-number{font-weight:700!important;color:#555!important}.tele-segment.pause .tele-timestamp,.segment-item.pause .segment-duration{font-size:14px!important;font-weight:600!important;min-width:50px!important;padding:4px 10px!important;background:#e0e0e0!important;border-radius:4px!important;text-align:center}.tele-segment.pause .tele-pause-input,.segment-item.pause .duration-input{font-size:14px!important;font-weight:600!important;min-width:60px!important;padding:4px 8px!important;text-align:center;background:#fff!important;border:1px solid #bdbdbd!important;border-radius:4px!important}.tele-segment.pause .tele-pause-input:focus,.segment-item.pause .duration-input:focus{border-color:#2196f3!important;box-shadow:0 0 0 2px #2196f333!important}.tele-segment.pause .tele-text{font-size:12px!important;color:#757575!important;font-style:italic!important}.tele-segment{position:relative;cursor:context-menu}.tele-segment:focus-visible{outline:2px solid #2196f3;outline-offset:2px}.voice-dubbing-tab{display:flex;flex-direction:column;height:100%;gap:0;color:#333;overflow:hidden;padding:0;max-width:100%;margin:0;background:transparent}.voice-dubbing-header{text-align:left;margin-bottom:4px;padding-bottom:12px;border-bottom:1px solid #e0e0e0}.voice-dubbing-title{font-size:1.25rem;font-weight:600;color:#1a1a1a;margin:0;white-space:nowrap}.voice-dubbing-subtitle{font-size:.8125rem;color:#666;margin:0}.voice-dubbing-input-section{display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid #ddd;border-radius:8px;padding:14px;box-shadow:0 1px 2px #0000000d}.voice-dubbing-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px}.voice-dubbing-toolbar-left,.voice-dubbing-toolbar-right{display:flex;align-items:center;gap:8px}.voice-dubbing-toolbar-left{flex:1;min-width:0;overflow:hidden}.voice-dubbing-upload-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;background:var(--primary-color, #4682b4);color:#fff;border:none;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:background .2s}.voice-dubbing-upload-btn:hover{background:var(--primary-hover, #315c80)}.voice-dubbing-upload-btn svg{flex-shrink:0}.voice-dubbing-hidden-input{display:none}.voice-dubbing-format-badge{display:inline-flex;align-items:center;padding:4px 10px;background:#4682b41a;color:#315c80;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;border:1px solid rgba(70,130,180,.2)}.voice-dubbing-sample-container{display:flex;flex-direction:column;gap:12px;width:100%}.voice-dubbing-audio{width:100%;max-width:100%;height:auto}.voice-dubbing-format-badge--srt{background:#22c55e26;color:#166534}.voice-dubbing-format-badge--vtt{background:#4682b426;color:#1e40af}.voice-dubbing-format-badge--youtube{background:#ef444426;color:#b91c1c}.voice-dubbing-format-badge--plain-timestamps{background:#a855f726;color:#7c3aed}.voice-dubbing-format-badge--unknown{background:#94a3b826;color:#475569}.voice-dubbing-file-name{color:#666;font-size:.75rem;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.voice-dubbing-clear-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:transparent;border:1px solid #ddd;border-radius:6px;color:#666;cursor:pointer;transition:all .2s}.voice-dubbing-clear-btn:hover{background:#ef44441a;border-color:#ef4444;color:#ef4444}.voice-dubbing-textarea{width:100%;min-height:160px;max-height:300px;padding:12px;background:#fff;border:1px solid #ddd;border-radius:6px;color:#333;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.8125rem;line-height:1.5;resize:vertical;transition:border-color .2s}.voice-dubbing-textarea::placeholder{color:#999}.voice-dubbing-textarea:focus{outline:none;border-color:#4682b4;box-shadow:0 0 0 2px #4682b433}.voice-dubbing-textarea:disabled{opacity:.5;cursor:not-allowed}.voice-dubbing-parse-summary{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:12px 16px;background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px}.voice-dubbing-parse-stats{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.875rem;color:#555}.voice-dubbing-stat strong{color:#333;font-weight:600}.voice-dubbing-stat-divider{opacity:.4;color:#999}.voice-dubbing-preview-toggle{display:flex;align-items:center;gap:4px;padding:4px 8px;background:transparent;border:none;color:#666;font-size:.75rem;cursor:pointer;transition:color .2s}.voice-dubbing-preview-toggle:hover{color:#333}.voice-dubbing-preview-toggle svg{transition:transform .2s}.voice-dubbing-segment-preview{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto;padding:12px;background:#f8f9fa;border-radius:8px;border:1px solid #e0e0e0}.voice-dubbing-segment-item{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:8px 12px;background:#fff;border-radius:6px;font-size:.8125rem;border:1px solid #eee}.voice-dubbing-segment-time{display:flex;align-items:center;gap:4px;color:#4682b4;font-family:JetBrains Mono,monospace;font-size:.75rem;white-space:nowrap}.voice-dubbing-segment-arrow{opacity:.5;color:#999}.voice-dubbing-segment-text{color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.voice-dubbing-segment-meta{color:#888;font-size:.6875rem;white-space:nowrap}.voice-dubbing-segment-more{text-align:center;color:#666;font-size:.75rem;padding:8px}.voice-dubbing-errors{display:flex;flex-direction:column;gap:6px}.voice-dubbing-error{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#fef2f2;border:1px solid #fecaca;border-radius:6px;color:#b91c1c;font-size:.8125rem}.voice-dubbing-error svg{flex-shrink:0;color:#dc2626}.voice-dubbing-config-section{display:flex;flex-direction:column;gap:14px;background:#fff;border:1px solid #ddd;border-radius:8px;padding:16px;box-shadow:0 1px 2px #0000000d}.voice-dubbing-config-title{font-size:.75rem;font-weight:700;color:#888;text-transform:uppercase;letter-spacing:.8px;margin:0 0 4px}.voice-dubbing-config-row{display:flex;flex-direction:column;gap:8px}.voice-dubbing-config-label{font-size:.8125rem;font-weight:500;color:#444}.voice-dubbing-toggle-group{display:flex;gap:6px;flex-wrap:wrap}.voice-dubbing-toggle-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#f8f9fa;border:1px solid #ddd;border-radius:6px;color:#666;font-size:.8125rem;font-weight:500;cursor:pointer;transition:all .15s}.voice-dubbing-toggle-btn:hover:not(:disabled){background:#f1f3f5;border-color:#ccc;color:#333}.voice-dubbing-toggle-btn.active{background:#e3f2fd;border-color:#2196f3;color:#1565c0}.voice-dubbing-toggle-btn.active{background-color:#2196f3!important;color:#fff!important;border-color:#1976d2!important}.voice-dubbing-toggle-btn.active svg{color:#fff!important}.voice-dubbing-toggle-btn:disabled{opacity:.4;cursor:not-allowed}.voice-dubbing-toggle-btn svg{flex-shrink:0}.voice-dubbing-checkbox-btn{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#f8f9fa;border:1px solid #ddd;border-radius:6px;color:#333;font-size:.8125rem;font-weight:500;cursor:pointer;transition:all .15s;width:fit-content}.voice-dubbing-checkbox-btn:hover:not(:disabled){background:#f1f3f5;color:#000}.voice-dubbing-checkbox-btn.active{background:#e3f2fd;border-color:#2196f3;color:#1565c0}.voice-dubbing-checkbox{display:flex;align-items:center;justify-content:center;width:16px;height:16px;background:#fff;border:2px solid #ccc;border-radius:4px;transition:all .15s}.voice-dubbing-checkbox-btn.active .voice-dubbing-checkbox{background:#2196f3;border-color:#2196f3}.voice-dubbing-checkbox svg{color:#fff}.voice-dubbing-config-hint{font-size:.6875rem;color:#666;margin-top:2px}.voice-dubbing-progress{display:flex;flex-direction:column;gap:6px;padding:12px;background:#4682b41a;border:1px solid rgba(70,130,180,.2);border-radius:8px}.voice-dubbing-progress-bar{height:4px;background:#ffffff26;border-radius:2px;overflow:hidden}.voice-dubbing-progress-fill{height:100%;background:#4682b4;border-radius:2px;transition:width .3s ease}.voice-dubbing-progress-text{display:flex;justify-content:space-between;align-items:center;font-size:.75rem;color:#555}.voice-dubbing-progress-count{font-family:JetBrains Mono,monospace;font-size:.6875rem;color:#777}.voice-dubbing-actions{display:flex;flex-direction:column;gap:12px;padding-top:8px}.voice-dubbing-actions>div{width:100%}.voice-dubbing-generate-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 24px;width:100%;background:#4682b4;border:none;border-radius:8px;color:#fff;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .15s}.voice-dubbing-generate-btn:hover:not(:disabled){background:#315c80}.voice-dubbing-generate-btn:active:not(:disabled){transform:scale(.98)}.voice-dubbing-generate-btn:disabled{opacity:.4;cursor:not-allowed}.voice-dubbing-spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:voice-dubbing-spin .8s linear infinite}@keyframes voice-dubbing-spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.02)}}.synthesizing-badge{animation:pulse 1s ease-in-out infinite}.synthesizing-badge svg{animation:spin 1s linear infinite}.tele-segment.segment-selected{border-left:3px solid #6B8E23!important;background:linear-gradient(90deg,rgba(107,142,35,.08) 0%,transparent 100%)!important}.tele-segment.segment-selected .tele-row-number{color:#6b8e23;font-weight:700}.notes-indicator{transition:transform .2s ease}.tele-segment:hover .notes-indicator{transform:scale(1.1)}.voice-dubbing-test-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 16px;width:100%;background:#f8f9fa;border:1px solid #ddd;color:#333;border-radius:8px;cursor:pointer;font-weight:600;font-size:.875rem}.voice-dubbing-test-btn:hover:not(:disabled){background:#f1f3f5;border-color:#ccc}.voice-dubbing-test-btn:disabled{opacity:.4;cursor:not-allowed}.voice-dubbing-download-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:#e3f2fd;color:#1565c0;border:1px solid #90caf9;border-radius:8px;text-decoration:none;font-weight:600;font-size:.875rem;cursor:pointer;transition:all .15s}.voice-dubbing-download-btn:hover{background:#bbdefb;border-color:#64b5f6}.voice-dubbing-download-btn:disabled{opacity:.4;cursor:not-allowed}.voice-dubbing-download-btn svg{flex-shrink:0}.voice-dubbing-download-group{display:flex;align-items:stretch;gap:8px;width:100%}.voice-dubbing-download-group button{flex:1;min-width:0;justify-content:center}.voice-dubbing-toast{position:relative;padding:8px 12px;background:#0009;color:#fff;border-radius:8px;font-size:.875rem}.voice-dubbing-tab.split-view{flex-direction:row;overflow:hidden;padding:0;gap:0}.voice-dubbing-left-panel{flex:0 0 380px;max-width:380px;min-width:0;display:flex;flex-direction:column;gap:20px;padding:20px;height:100%;overflow-y:auto;border-right:1px solid #e0e0e0;box-sizing:border-box}.voice-dubbing-right-panel{flex:1;display:flex;flex-direction:column;height:100%;padding:0;background:#fff;overflow:hidden;min-width:0}.voice-dubbing-right-panel .live-narrator-script-panel{flex:1;height:100%;border-radius:0;border:none;border-left:1px solid #e0e0e0}.voice-dubbing-right-header{padding:12px 16px;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;align-items:center;background:#f8f9fa;margin-bottom:0}.voice-dubbing-right-title{font-size:14px;font-weight:600;color:#495057;margin:0}.voice-dubbing-transcript-viz{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding:20px;background:#fdfdfd}.transcript-segment-card{padding:12px;background:#fff;border:1px solid #e0e0e0;border-radius:6px;transition:all .2s;box-shadow:0 1px 2px #0000000d}.transcript-segment-card:hover{background:#f8f9fa;border-color:#d0d0d0}.transcript-segment-header{display:flex;justify-content:space-between;margin-bottom:6px;font-size:.75rem}.transcript-segment-timestamp{font-family:JetBrains Mono,monospace;color:#555;background:#eee;padding:2px 6px;border-radius:4px}.transcript-segment-index{color:#999}.transcript-segment-content{color:#333;line-height:1.6;font-size:14px}.transcript-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#888;text-align:center;gap:12px}.transcript-empty-icon{opacity:.5}.voice-fine-tuning-section{padding:14px!important}.voice-fine-tuning-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.voice-fine-tuning-header .voice-dubbing-config-title{margin:0}.voice-fine-tuning-test-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#4682b4;color:#fff;border:none;border-radius:6px;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .15s}.voice-fine-tuning-test-btn:hover:not(:disabled){background:#315c80}.voice-fine-tuning-test-btn:disabled{opacity:.5;cursor:not-allowed}.voice-fine-tuning-presets{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}.voice-fine-tuning-preset-btn{padding:5px 10px;background:#f8f9fa;border:1px solid #ddd;border-radius:4px;font-size:.7rem;font-weight:500;color:#555;cursor:pointer;transition:all .15s}.voice-fine-tuning-preset-btn:hover:not(:disabled){background:#f1f3f5;border-color:#ccc}.voice-fine-tuning-preset-btn.active{background:#e3f2fd;border-color:#2196f3;color:#1565c0}.voice-fine-tuning-preset-btn:disabled{opacity:.5;cursor:not-allowed}.voice-fine-tuning-control{margin-bottom:10px}.voice-fine-tuning-control:last-child{margin-bottom:0}.voice-fine-tuning-control-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.voice-fine-tuning-label{font-size:.75rem;font-weight:500;color:#333}.voice-fine-tuning-value{font-size:.7rem;font-weight:600;color:#4682b4;font-family:JetBrains Mono,monospace}.voice-fine-tuning-slider-row{display:flex;align-items:center;gap:8px}.voice-fine-tuning-adjust-btn{width:24px;height:24px;display:flex;align-items:center;justify-content:center;padding:0;background:#f8f9fa;border:1px solid #ddd;border-radius:4px;font-size:1rem;font-weight:600;color:#555;cursor:pointer;transition:all .15s;flex-shrink:0}.voice-fine-tuning-adjust-btn:hover:not(:disabled){background:#e9ecef;border-color:#ccc;color:#333}.voice-fine-tuning-adjust-btn:disabled{opacity:.4;cursor:not-allowed}.voice-fine-tuning-slider{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e9ecef;border-radius:3px;outline:none;cursor:pointer}.voice-fine-tuning-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#4682b4;cursor:pointer;transition:all .15s;border:2px solid #fff;box-shadow:0 1px 3px #0003}.voice-fine-tuning-slider::-webkit-slider-thumb:hover{background:#315c80;transform:scale(1.1)}.voice-fine-tuning-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#4682b4;cursor:pointer;border:2px solid #fff;box-shadow:0 1px 3px #0003}.voice-fine-tuning-slider:disabled{opacity:.5;cursor:not-allowed}.voice-fine-tuning-slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.voice-dubbing-mode-toggle{display:flex;align-items:center;gap:5px;padding:5px 10px;background:#f8f9fa;border:1px solid #ddd;border-radius:6px;font-size:.75rem;font-weight:600;color:#555;cursor:pointer;transition:all .15s}.voice-dubbing-mode-toggle:hover:not(:disabled){background:#f1f3f5;border-color:#ccc}.voice-dubbing-mode-toggle.edit-mode{background:#e3f2fd;border-color:#2196f3;color:#1565c0}.voice-dubbing-mode-toggle.view-mode{background:#fff3e0;border-color:#ff9800;color:#e65100}.voice-dubbing-mode-toggle:disabled{opacity:.5;cursor:not-allowed}.voice-dubbing-mode-toggle svg{flex-shrink:0}.voice-dubbing-view-mode{width:100%;min-height:160px;max-height:300px;padding:12px;background:#fafafa;border:1px solid #ddd;border-radius:6px;overflow-y:auto}.voice-dubbing-view-content{margin:0;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.8125rem;line-height:1.5;color:#333;white-space:pre-wrap;word-wrap:break-word}.voice-dubbing-view-empty{display:flex;align-items:center;justify-content:center;height:100%;min-height:130px;color:#999;font-size:.8125rem;font-style:italic}.voice-fine-tuning-preset-btn:focus,.voice-fine-tuning-preset-btn:active{outline:2px solid #2196f3;outline-offset:1px;color:#333}.voice-fine-tuning-preset-btn.active:focus,.voice-fine-tuning-preset-btn.active:active{color:#1565c0}.voice-fine-tuning-adjust-btn:focus,.voice-fine-tuning-adjust-btn:active{outline:2px solid #2196f3;outline-offset:1px;color:#333}.voice-dubbing-toggle-btn:focus,.voice-dubbing-toggle-btn:active{outline:2px solid #2196f3;outline-offset:1px}.voice-dubbing-toggle-btn.active:focus,.voice-dubbing-toggle-btn.active:active{color:#1565c0}.narrator-btn:focus,.narrator-btn:active{outline:2px solid #2196f3;outline-offset:1px}.narrator-btn.small:focus,.narrator-btn.small:active{color:#333}.narrator-btn.small.primary:focus,.narrator-btn.small.primary:active{color:#fff!important;background-color:#1976d2}.narrator-btn.small.primary:hover{color:#fff!important;background-color:#1976d2}.export-dropdown-menu.show{display:block!important}.voice-dubbing-right-panel .tele-segment{margin-bottom:4px;padding:8px 12px;border-radius:6px;border:1px solid transparent;display:grid;grid-template-columns:32px 44px 36px 1fr;gap:8px;align-items:start}.voice-dubbing-right-panel .tele-row-number{font-size:10px;color:#999;font-family:monospace;text-align:right;padding-top:2px}.voice-dubbing-right-panel .tele-timestamp{font-size:10px;color:#666;font-family:monospace;background:#eee;padding:2px 6px;border-radius:4px;text-align:center;white-space:nowrap}.voice-dubbing-right-panel .tele-text{font-size:14px;line-height:1.5;color:#333}.voice-dubbing-right-panel .tele-segment:focus{outline:2px solid #2196f3;outline-offset:2px;background-color:#e3f2fd}.voice-dubbing-container .voice-dubbing-main-panel{display:flex;flex-direction:column;height:100%;min-height:0;overflow-y:auto!important;overflow-x:hidden;padding-bottom:16px}.voice-dubbing-container .voice-dubbing-main-panel .wizard-step{display:block!important;flex-shrink:0}.voice-dubbing-container .voice-dubbing-main-panel .wizard-step .narrator-input-group{display:flex;flex-direction:column;margin-bottom:16px}.voice-dubbing-container .voice-dubbing-main-panel .wizard-step .narrator-actions{display:flex!important;position:static!important;margin-top:20px!important;padding-top:16px;border-top:1px solid #e0e0e0;gap:8px;order:unset!important}.voice-dubbing-right-panel .tele-segment.pause{min-height:60px!important;padding:16px 20px!important;background:linear-gradient(to bottom,#f5f5f5,#eee)!important;border:2px dashed #bdbdbd!important;border-left:4px solid #9e9e9e!important;display:flex!important;align-items:center;gap:16px}.voice-dubbing-right-panel .tele-segment.pause .tele-timestamp{font-size:18px!important;font-weight:600!important;min-width:60px!important;padding:6px 12px!important;background:#e0e0e0!important;border-radius:6px!important;text-align:center}.voice-dubbing-right-panel .tele-segment.pause:before{content:"";display:inline-block;width:32px;height:32px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23757575'%3E%3Crect x='6' y='4' width='4' height='16' rx='1'/%3E%3Crect x='14' y='4' width='4' height='16' rx='1'/%3E%3C/svg%3E") center/contain no-repeat;flex-shrink:0}.voice-dubbing-right-panel .tele-segment.pause .tele-pause-input{font-size:18px!important;font-weight:600!important;min-width:80px!important;padding:8px 12px!important;text-align:center;background:#fff!important;border:2px solid #bdbdbd!important;border-radius:6px!important}.voice-dubbing-right-panel .tele-segment.pause .tele-pause-input:focus{border-color:#2196f3!important;box-shadow:0 0 0 3px #2196f333!important}.voice-dubbing-right-panel .tele-segment.pause .tele-text{font-size:14px!important;color:#757575!important;font-style:italic!important}.voice-dubbing-right-panel .tele-segment{position:relative;cursor:context-menu}.voice-dubbing-right-panel .tele-segment:focus-visible{outline:2px solid #2196f3;outline-offset:2px}.wizard-step.video-mode-active{border-left:3px solid #4682b4;padding-left:16px}.video-mode-container{transition:all .3s ease}.review-segment-row{transition:all .2s ease}.review-segment-row.video-active{background:linear-gradient(90deg,#4682b426,#4682b40d);border-left:4px solid #4682b4;position:relative}.review-segment-row.video-active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#4682b4;animation:pulse-highlight 1.5s ease-in-out infinite}@keyframes pulse-highlight{0%,to{opacity:1}50%{opacity:.5}}.tele-segment.video-active{background:linear-gradient(90deg,#4682b426,#4682b40d)!important;border-left:4px solid #4682b4!important}.tele-segment.video-active .tele-timestamp{color:#4682b4;font-weight:600}.wizard-step.video-mode-active .review-segment-row{scroll-margin-top:50px;scroll-margin-bottom:50px}.video-mode-active [style*="overflowY: auto"]{scroll-behavior:smooth}.vc-right-panel{flex:1;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid #e0e0e0;border-radius:8px;box-shadow:0 2px 8px #0000000d;min-width:0}.vc-panel-header{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:#f8f9fa;border-bottom:1px solid #e0e0e0;color:#495057;font-size:13px;font-weight:600;flex-shrink:0}.vc-panel-header-count{font-size:12px;font-weight:400;color:#888}.vc-toolbar{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#fff;border-bottom:1px solid #e0e0e0;flex-shrink:0}.vc-compact-controls{display:flex;align-items:center;gap:10px;flex:1;background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px;padding:6px 12px}.vc-play-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:#2196f3;color:#fff;cursor:pointer;flex-shrink:0;transition:all .15s;box-shadow:0 2px 4px #2196f34d}.vc-play-btn:hover{background:#1976d2;transform:scale(1.05)}.vc-time{font-size:11px;font-family:JetBrains Mono,monospace;color:#555;min-width:80px;white-space:nowrap;background:#eee;padding:2px 8px;border-radius:4px}.vc-slider{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e0e0e0;border-radius:3px;cursor:pointer}.vc-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#2196f3;cursor:pointer;border:2px solid #fff;box-shadow:0 1px 3px #0003}.vc-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#2196f3;cursor:pointer;border:2px solid #fff;box-shadow:0 1px 3px #0003}.vc-rec-indicator{display:flex;align-items:center;gap:6px;padding:4px 12px;background:#fef2f2;border:1px solid #fecaca;border-radius:6px;font-size:11px;font-weight:700;color:#dc2626;letter-spacing:.5px}.vc-rec-dot-pulse{width:8px;height:8px;border-radius:50%;background:#dc2626;animation:vc-pulse 1.2s ease-in-out infinite}@keyframes vc-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}.vc-view-toggle{display:flex;gap:0;border:1px solid #ddd;border-radius:6px;overflow:hidden;background:#f8f9fa}.vc-view-btn{padding:6px 14px;font-size:12px;font-weight:500;border:none;background:transparent;color:#666;cursor:pointer;transition:all .15s}.vc-view-btn+.vc-view-btn{border-left:1px solid #ddd}.vc-view-btn:hover:not(.active){background:#f1f3f5;color:#333}.vc-view-btn.active{background:#2196f3;color:#fff}.vc-audio-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#fff;border-bottom:1px solid #e0e0e0;font-size:13px;color:#333}.vc-audio-bar span:first-child{font-weight:500}.vc-audio-bar span:last-child{font-family:JetBrains Mono,monospace;color:#1565c0;font-weight:600;background:#2196f314;padding:2px 8px;border-radius:4px}.vc-video-area{flex:1;display:flex;align-items:center;justify-content:center;min-height:200px;max-height:400px;background:#1a1a1a;overflow:hidden}.vc-video-element{width:100%;height:100%;object-fit:contain;display:block}.vc-video-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#888;padding:40px 20px}.vc-video-placeholder svg{opacity:.5}.vc-video-placeholder span{font-size:13px;color:#888}.vc-dual-segments{display:flex;flex:1;min-height:140px;border-top:1px solid #e0e0e0;overflow:hidden}.vc-seg-panel{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.vc-seg-panel+.vc-seg-panel{border-left:1px solid #e0e0e0}.vc-seg-header{padding:8px 12px;font-size:11px;font-weight:600;color:#495057;background:#f8f9fa;border-bottom:1px solid #e0e0e0;flex-shrink:0;text-transform:uppercase;letter-spacing:.5px}.vc-seg-list{flex:1;overflow-y:auto;padding:4px 0;background:#fdfdfd}.vc-seg-list::-webkit-scrollbar{width:5px}.vc-seg-list::-webkit-scrollbar-track{background:transparent}.vc-seg-list::-webkit-scrollbar-thumb{background:#ccc;border-radius:3px}.vc-seg-item{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:12px;transition:all .15s;cursor:default;color:#333;border-left:3px solid transparent}.vc-seg-item:hover{background:#f8f9fa}.vc-seg-item.active{background:linear-gradient(90deg,rgba(33,150,243,.1) 0%,transparent 100%);border-left-color:#2196f3}.vc-seg-item.done{opacity:.7}.vc-seg-item.done .vc-seg-time{background:#d4edda;color:#155724}.vc-seg-idx{min-width:20px;font-weight:600;color:#999;font-family:JetBrains Mono,monospace;font-size:10px;text-align:right}.vc-seg-time{min-width:40px;color:#666;font-family:JetBrains Mono,monospace;font-size:10px;background:#eee;padding:2px 6px;border-radius:4px;text-align:center}.vc-seg-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#333;line-height:1.4}.vc-seg-dur{min-width:32px;color:#666;font-family:JetBrains Mono,monospace;font-size:10px;text-align:right;background:#eee;padding:2px 6px;border-radius:4px}.vc-seg-empty{padding:24px;text-align:center;color:#888;font-size:13px;font-style:italic}.vc-sync-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.vc-sync-dot.good{background:#4caf50;box-shadow:0 0 4px #4caf5066}.vc-sync-dot.warn{background:#ff9800;box-shadow:0 0 4px #ff980066}.vc-sync-dot.bad{background:#f44336;box-shadow:0 0 4px #f4433666}.vc-seg-action{width:20px;height:20px;display:flex;align-items:center;justify-content:center;border:1px solid #ddd;border-radius:4px;background:#fff;cursor:pointer;flex-shrink:0;color:#666;transition:all .15s}.vc-seg-action:hover{background:#e3f2fd;border-color:#2196f3;color:#1976d2}.vc-seg-status{font-size:10px;padding:2px 8px;border-radius:4px;font-weight:600;white-space:nowrap}.vc-seg-status.generating{background:#e3f2fd;color:#1565c0;animation:vc-gen-pulse 1.5s infinite}@keyframes vc-gen-pulse{0%,to{opacity:1}50%{opacity:.6}}.vc-seg-status.error{background:#ffebee;color:#c62828}.vc-seg-status.pending{background:#f5f5f5;color:#888}.vc-seg-status.processing{background:#fff3e0;color:#e65100}.vc-voice-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:linear-gradient(135deg,#4caf5014,#4caf5008);border:1px solid rgba(76,175,80,.25);border-radius:8px}.vc-voice-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#4caf5026;border-radius:50%;color:#4caf50;flex-shrink:0}.vc-voice-info{flex:1;min-width:0}.vc-voice-name{font-size:13px;font-weight:600;color:#333;margin-bottom:2px}.vc-voice-meta{font-size:10px;color:#666}.vc-video-info-row{display:flex;align-items:center;gap:8px;padding:6px 10px;background:#f8f9fa;border:1px solid #e0e0e0;border-radius:6px}.vc-filename{flex:1;font-size:12px;color:#333;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vc-duration{font-size:10px;color:#1565c0;font-family:JetBrains Mono,monospace;background:#4682b41a;padding:2px 6px;border-radius:4px}.vc-level-meter{position:relative;height:16px;background:#1a1a1a;border-radius:4px;overflow:hidden;border:1px solid #333}.vc-level-fill{height:100%;background:linear-gradient(90deg,#4caf50,#8bc34a,#ffeb3b,#ff9800,#f44336);transition:width .05s linear;border-radius:3px;opacity:.85}.vc-level-fill.speaking{opacity:1}.vc-level-db{position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:9px;color:#fff;font-family:JetBrains Mono,monospace;text-shadow:0 1px 2px rgba(0,0,0,.5);font-weight:600}.vc-record-status{display:flex;justify-content:space-between;font-size:10px;color:#666;padding:2px 0 0}.vc-record-status span:last-child{color:#4682b4;font-weight:500}.phase-content.create-phase{display:flex;flex-direction:column;height:100%;overflow:hidden}.create-phase .narrator-stepper{display:flex;justify-content:space-between;padding:16px 8px 12px;margin:0;flex-shrink:0;background:#fff;border-bottom:1px solid #e0e0e0;position:relative}.create-phase .narrator-stepper:before{content:"";position:absolute;top:28px;left:30px;right:30px;height:2px;background-color:#e0e0e0;z-index:0}.create-phase .step-indicator{display:flex;flex-direction:column;align-items:center;gap:6px;flex:0 0 auto;min-width:48px;max-width:56px;position:relative;z-index:1;cursor:pointer;transition:all .2s}.create-phase .step-indicator:hover:not(.disabled){transform:translateY(-1px)}.create-phase .step-number{width:24px;height:24px;border-radius:50%;background-color:#fff;border:2px solid #ccc;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:#666;transition:all .2s}.create-phase .step-indicator.active .step-number{border-color:#2196f3;color:#2196f3;transform:scale(1.1);box-shadow:0 2px 8px #2196f34d}.create-phase .step-indicator.completed .step-number{background-color:#4caf50;border-color:#4caf50;color:#fff}.create-phase .step-indicator.available .step-number{border-color:#90caf9;color:#64b5f6}.create-phase .step-indicator.disabled{opacity:.4;cursor:not-allowed}.create-phase .step-label{font-size:10px;font-weight:500;color:#666;white-space:nowrap;text-align:center;line-height:1.2}.create-phase .step-indicator.active .step-label{color:#2196f3;font-weight:600}.create-phase .step-indicator.completed .step-label{color:#4caf50}.wizard-content-container{flex:1;overflow-y:auto;padding:16px;background:#fafafa}.wizard-content{min-height:200px;height:100%}.preview-placeholder,.export-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:200px;text-align:center;color:#666;padding:40px 20px}.preview-placeholder h3,.export-placeholder h3{margin:0 0 16px;font-size:20px;color:#333;font-weight:600}.preview-placeholder p,.export-placeholder p{margin:0 0 8px;font-size:14px;line-height:1.5}.wizard-navigation{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-top:1px solid #e0e0e0;background:#f8f9fa;flex-shrink:0}.wizard-nav-btn{padding:8px 20px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.wizard-nav-btn.prev{background:#fff;color:#333;border:1px solid #ddd}.wizard-nav-btn.prev:hover:not(:disabled){background:#f5f5f5;border-color:#ccc}.wizard-nav-btn.next{background:#2196f3;color:#fff}.wizard-nav-btn.next:hover:not(:disabled){background:#1976d2}.wizard-nav-btn:disabled{opacity:.5;cursor:not-allowed}.wizard-step-count{font-size:13px;color:#666}.voice-dubbing-content,.live-narrator-content{padding:0;height:calc(100% + 32px);width:calc(100% + 32px);margin:-16px}.format-content,.intro-outro-content,.settings-content,.script-content,.generate-content{padding:8px}.generate-step-container{max-width:100%}.generate-step-title{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:600;color:#333;margin:0 0 4px}.generate-step-title svg{color:#2196f3}.generate-step-subtitle{font-size:13px;color:#666;margin:0 0 16px}.generate-settings-section{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:12px;margin-bottom:16px}.generate-section-header{font-size:13px;font-weight:600;color:#333;margin:0 0 10px;display:flex;align-items:center;gap:6px}.generate-settings-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.generate-setting-field{display:flex;flex-direction:column;gap:4px}.generate-setting-field label{font-size:11px;font-weight:500;color:#666}.generate-number-input{width:100%;padding:8px 10px;border:1px solid #ddd;border-radius:6px;font-size:14px;font-weight:500;text-align:center;transition:border-color .2s,box-shadow .2s}.generate-number-input:focus{outline:none;border-color:#2196f3;box-shadow:0 0 0 2px #2196f326}.generate-number-input:disabled{background:#f5f5f5;cursor:not-allowed}.generate-summary-section{background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px;padding:12px;margin-bottom:16px}.generate-summary-categories{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.summary-category{background:#fff;border:1px solid #eee;border-radius:6px;padding:10px}.category-header{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#555;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid #f0f0f0}.category-header svg{color:#2196f3}.category-items{display:flex;flex-direction:column;gap:6px}.summary-item{display:flex;justify-content:space-between;align-items:center;font-size:12px}.summary-item .item-label{color:#666}.summary-item .item-value{font-weight:500;color:#333}.summary-item .item-value.status-enabled{color:#4caf50}.summary-item .item-value.status-disabled{color:#999}.summary-item .item-value.uuid{font-family:monospace;font-size:11px;color:#888}.summary-item.highlight{background:#2196f314;padding:4px 6px;margin:2px -6px;border-radius:4px}.summary-item.highlight .item-value{color:#2196f3;font-weight:600}.generate-action-section{text-align:center;padding-top:8px}.generate-animation-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 32px;background:linear-gradient(135deg,#2196f3,#1976d2);color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #2196f34d}.generate-animation-btn:hover:not(:disabled){background:linear-gradient(135deg,#1e88e5,#1565c0);box-shadow:0 4px 12px #2196f366;transform:translateY(-1px)}.generate-animation-btn:disabled{background:#ccc;cursor:not-allowed;box-shadow:none}.generate-animation-btn .spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.generate-hint{font-size:12px;color:#999;margin-top:8px}.time-settings-vertical{display:flex;flex-direction:column;gap:14px}.time-setting-field{display:flex;flex-direction:column;gap:6px}.time-setting-field label{font-size:13px;font-weight:600;color:#333;display:flex;align-items:center;gap:6px}.time-setting-field .duration-lock-icon{color:#999;display:inline-flex}.time-setting-select,.time-setting-input{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;font-weight:500;background:#fff;transition:border-color .2s,box-shadow .2s}.time-setting-select:focus,.time-setting-input:focus{outline:none;border-color:#2196f3;box-shadow:0 0 0 2px #2196f326}.time-setting-select:disabled,.time-setting-input:disabled{background:#f5f5f5;cursor:not-allowed}.time-setting-hint{font-size:11px;color:#888;margin:0;line-height:1.4}.time-setting-field.duration-field{background:#f0f7ff;padding:12px;border-radius:6px;border:1px solid #bbdefb}.time-setting-field.duration-field label{color:#1565c0;font-size:12px}.duration-display{display:flex;align-items:baseline;gap:8px;padding:8px 0}.duration-value{font-size:24px;font-weight:700;color:#1565c0}.duration-formatted{font-size:16px;font-weight:500;color:#42a5f5}.time-setting-field.duration-field .time-setting-hint{color:#64b5f6;font-size:10px}@media (max-width: 768px){.create-phase .narrator-stepper{padding:10px 12px;overflow-x:auto}.wizard-navigation{flex-wrap:wrap;gap:12px}.wizard-step-count{order:-1;width:100%;text-align:center}}.summary-item.voice-item .item-value.voice-value{display:flex;align-items:center;flex-wrap:wrap;gap:4px}.change-voice-btn{font-size:10px;padding:2px 6px;margin-left:8px;background:#e3f2fd;border:1px solid #2196f3;border-radius:4px;color:#1976d2;cursor:pointer;transition:all .15s ease}.change-voice-btn:hover{background:#bbdefb;color:#0d47a1}.ai-logo-generator{padding:1rem}.ai-logo-generator .generator-section{margin-bottom:1.25rem}.ai-logo-generator .section-label{display:block;font-size:.8rem;font-weight:600;color:#666;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:.5px}.ai-logo-generator .section-hint{font-size:.75rem;color:#888;margin:0 0 .5rem}.ai-logo-generator .brand-input,.ai-logo-generator .modifier-input{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:8px;font-size:.9rem;transition:border-color .2s,box-shadow .2s}.ai-logo-generator .brand-input:focus,.ai-logo-generator .modifier-input:focus{border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a;outline:none}.ai-logo-generator .brand-input:disabled,.ai-logo-generator .modifier-input:disabled{background:#f5f5f5;cursor:not-allowed}.ai-logo-generator .modifier-hint{font-size:.75rem;color:#888;margin:.25rem 0 0}.ai-logo-generator .category-buttons{display:flex;flex-wrap:wrap;gap:.5rem}.ai-logo-generator .category-btn{padding:.5rem .75rem;border:1px solid #ddd;border-radius:20px;background:#fff;color:#666;font-size:.8rem;cursor:pointer;transition:all .2s}.ai-logo-generator .category-btn:hover:not(:disabled){border-color:#6366f1;color:#6366f1}.ai-logo-generator .category-btn.active{background:#6366f1;border-color:#6366f1;color:#fff}.ai-logo-generator .category-btn:disabled{opacity:.5;cursor:not-allowed}.ai-logo-generator .style-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.ai-logo-generator .style-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.75rem .5rem;border:2px solid #e5e7eb;border-radius:8px;background:#fff;cursor:pointer;transition:all .2s;min-height:70px}.ai-logo-generator .style-card:hover:not(:disabled){border-color:#6366f1;transform:translateY(-2px);box-shadow:0 4px 12px #6366f11a}.ai-logo-generator .style-card.selected{border-color:#6366f1;background:linear-gradient(135deg,#f0f0ff,#fff);box-shadow:0 0 0 3px #6366f11a}.ai-logo-generator .style-card:disabled{opacity:.5;cursor:not-allowed}.ai-logo-generator .style-emoji{font-size:1.5rem;margin-bottom:.25rem}.ai-logo-generator .style-name{font-size:.7rem;color:#666;text-align:center;line-height:1.2}.ai-logo-generator .generate-btn{width:100%;padding:.875rem;border:none;border-radius:8px;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s;margin-bottom:1rem}.ai-logo-generator .generate-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 15px #6366f166}.ai-logo-generator .generate-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.ai-logo-generator .generate-btn .spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.ai-logo-generator .error-message{padding:.75rem;border-radius:8px;background:#fef2f2;border:1px solid #fecaca;color:#dc2626;font-size:.85rem;margin-bottom:1rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.ai-logo-generator .error-dismiss{background:none;border:none;color:#dc2626;font-size:1.2rem;cursor:pointer;padding:0;line-height:1;opacity:.6;transition:opacity .2s}.ai-logo-generator .error-dismiss:hover{opacity:1}.ai-logo-generator .section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.ai-logo-generator .section-header .section-label{margin-bottom:0}.ai-logo-generator .clear-all-btn{padding:.25rem .5rem;font-size:.7rem;color:#888;background:transparent;border:1px solid #ddd;border-radius:4px;cursor:pointer;transition:all .2s}.ai-logo-generator .clear-all-btn:hover{color:#dc2626;border-color:#dc2626;background:#fef2f2}.ai-logo-generator .logo-gallery{display:flex;flex-direction:column;gap:.75rem}.ai-logo-generator .logo-item{position:relative;border:2px solid #e5e7eb;border-radius:8px;overflow:hidden;background:#fff;transition:all .2s;display:flex;flex-direction:row;align-items:stretch}.ai-logo-generator .logo-item:hover,.ai-logo-generator .logo-item.previewing{border-color:#6366f1;box-shadow:0 4px 12px #6366f133}.ai-logo-generator .logo-item.previewing{background:linear-gradient(135deg,#f0f0ff,#fff)}.ai-logo-generator .logo-thumbnail{width:80px;height:80px;min-width:80px;padding:.35rem;display:flex;align-items:center;justify-content:center;background:#fafafa}.ai-logo-generator .logo-thumbnail img{max-width:100%;max-height:100%;object-fit:contain;display:block}.ai-logo-generator .logo-info{flex:1;padding:.5rem .75rem;display:flex;flex-direction:column;justify-content:center;background:#fff;border-left:1px solid #e5e7eb}.ai-logo-generator .logo-style{font-size:.8rem;color:#333;font-weight:500}.ai-logo-generator .logo-actions{display:flex;flex-direction:column;justify-content:center;gap:.35rem;padding:.5rem;background:#f8f9fa;border-left:1px solid #e5e7eb}.ai-logo-generator .action-btn{width:28px;height:28px;border:none;border-radius:4px;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;color:#666}.ai-logo-generator .action-btn:hover{transform:scale(1.1)}.ai-logo-generator .apply-btn:hover{background:#22c55e;color:#fff}.ai-logo-generator .download-btn:hover{background:#3b82f6;color:#fff}.ai-logo-generator .remove-btn:hover{background:#ef4444;color:#fff}.ai-logo-generator .empty-state{text-align:center;padding:2rem 1rem;color:#888}.ai-logo-generator .empty-icon{margin-bottom:.5rem}.ai-logo-generator .empty-state p{margin:0 0 .25rem;font-weight:500;color:#666}.ai-logo-generator .empty-state small{font-size:.8rem}.ai-logo-generator .color-mode-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}.ai-logo-generator .color-mode-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.5rem;border:2px solid #e5e7eb;border-radius:8px;background:#fff;cursor:pointer;transition:all .2s;min-height:50px}.ai-logo-generator .color-mode-btn:hover:not(:disabled){border-color:#6366f1;transform:translateY(-1px)}.ai-logo-generator .color-mode-btn.selected{border-color:#6366f1;background:linear-gradient(135deg,#f0f0ff,#fff);box-shadow:0 0 0 3px #6366f11a}.ai-logo-generator .color-mode-btn:disabled{opacity:.5;cursor:not-allowed}.ai-logo-generator .color-mode-emoji{font-size:1rem;margin-bottom:.15rem}.ai-logo-generator .color-mode-label{font-size:.65rem;color:#666;font-weight:500}.ai-logo-generator .mono-color-picker{margin-top:.75rem;padding:.75rem;background:#f8f9fa;border-radius:8px;border:1px solid #e5e7eb}.ai-logo-generator .color-picker-label{display:block;font-size:.75rem;color:#666;margin-bottom:.5rem}.ai-logo-generator .color-picker-row{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.ai-logo-generator .color-input{width:40px;height:32px;border:2px solid #ddd;border-radius:6px;padding:0;cursor:pointer;background:none}.ai-logo-generator .color-input::-webkit-color-swatch-wrapper{padding:2px}.ai-logo-generator .color-input::-webkit-color-swatch{border-radius:3px;border:none}.ai-logo-generator .color-hex{font-family:monospace;font-size:.75rem;color:#666;background:#fff;padding:.35rem .5rem;border-radius:4px;border:1px solid #ddd}.ai-logo-generator .color-presets{display:flex;gap:.35rem;flex-wrap:wrap}.ai-logo-generator .color-preset{width:22px;height:22px;border:2px solid;border-radius:4px;cursor:pointer;transition:all .15s;padding:0}.ai-logo-generator .color-preset:hover:not(:disabled){transform:scale(1.15)}.ai-logo-generator .color-preset.active{box-shadow:0 0 0 2px #fff,0 0 0 4px #6366f1}.ai-logo-generator .color-preset:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 480px){.ai-logo-generator .style-grid,.ai-logo-generator .color-mode-grid{grid-template-columns:repeat(2,1fr)}}.hybrid-header{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 12px;background:var(--surface, #ffffff);border-bottom:1px solid var(--border-color, #e5e7eb);box-shadow:0 1px 2px #0000000a;z-index:100;overflow:visible;position:relative}.header-left{display:flex;align-items:center;gap:10px;min-width:200px;flex-shrink:0}.header-logo{display:flex;align-items:center;gap:8px;color:var(--primary-color, #4f46e5);font-weight:700;font-size:18px}.header-logo svg{flex-shrink:0}.header-logo-text{font-family:Inter,system-ui,sans-serif}.header-divider{width:1px;height:24px;background:var(--border-color, #e5e7eb)}.header-project{display:flex;align-items:center;gap:8px}.header-project-name{font-size:14px;font-weight:500;color:var(--text-primary, #111827);cursor:pointer;padding:4px 8px;border-radius:4px;transition:background .15s;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-project-name:hover{background:var(--surface-secondary, #f9fafb)}.header-project-input{font-size:14px;font-weight:500;padding:4px 8px;border:1px solid var(--primary-color, #4f46e5);border-radius:4px;outline:none;width:200px}.header-project-uuid{font-size:10px;font-weight:600;color:var(--text-secondary, #6b7280);background:var(--surface-secondary, #f9fafb);padding:2px 6px;border-radius:4px;font-family:monospace}.header-save-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:6px;background:transparent;color:var(--text-secondary, #6b7280);cursor:pointer;transition:all .15s}.header-save-btn:hover:not(:disabled){background:var(--surface-secondary, #f9fafb);color:var(--primary-color, #4f46e5)}.header-save-btn:disabled{opacity:.4;cursor:not-allowed}.header-new-project-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;border-radius:8px;background:var(--primary-color, #4f46e5);color:#fff;cursor:pointer;transition:all .15s;flex-shrink:0}.header-new-project-btn:hover{background:var(--primary-hover, #4338ca);transform:scale(1.05)}.header-new-project-btn:active{transform:scale(.98)}.header-new-project-btn svg{flex-shrink:0}.header-button-group{display:flex;align-items:center;gap:4px;background:var(--surface-secondary, #f3f4f6);padding:4px;border-radius:8px}.header-button-group .header-new-project-btn,.header-button-group .header-save-btn{display:flex;align-items:center;justify-content:center;gap:5px;width:auto;padding:6px 12px;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}.header-button-group .header-new-project-btn{background:var(--primary-color, #4f46e5);color:#fff}.header-button-group .header-new-project-btn:hover{background:var(--primary-hover, #4338ca)}.header-button-group .header-save-btn{background:var(--surface, #ffffff);color:var(--text-primary, #374151);border:1px solid var(--border-color, #e5e7eb)}.header-button-group .header-save-btn:hover:not(:disabled){background:var(--primary-color, #4f46e5);color:#fff;border-color:var(--primary-color, #4f46e5)}.header-button-group .header-save-btn:disabled{opacity:.4;cursor:not-allowed;background:var(--surface-secondary, #f9fafb);border-color:transparent}.header-button-group .header-save-btn.save-success{background:#10b981!important;color:#fff!important;border-color:#10b981!important}.header-button-group .header-save-btn.save-error{background:#ef4444!important;color:#fff!important;border-color:#ef4444!important}.header-button-group .header-save-btn .spin{animation:spin 1s linear infinite}.header-center{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center}.header-center .header-project{display:flex;align-items:center;gap:8px}.header-center .header-project-name{font-size:14px;font-weight:600;color:var(--text-primary, #111827);cursor:pointer;padding:4px 10px;border-radius:6px;transition:background .15s;max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-center .header-project-name:hover{background:var(--surface-secondary, #f9fafb)}.header-center .header-project-uuid{font-size:11px;font-weight:600;color:var(--text-secondary, #6b7280);background:var(--surface-secondary, #f3f4f6);padding:3px 8px;border-radius:4px;font-family:monospace;letter-spacing:.5px}.header-project-uuid-group{display:flex;align-items:center;gap:2px}.uuid-copy-btn{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;background:transparent;border:none;border-radius:4px;color:var(--text-secondary, #6b7280);cursor:pointer;opacity:.6;transition:all .15s ease}.uuid-copy-btn:hover{opacity:1;background:var(--surface-secondary, #f3f4f6);color:var(--primary-color, #4f46e5)}.uuid-copy-btn.copied{color:var(--success-color, #10b981);opacity:1}.header-phases{display:flex;align-items:center;gap:4px;background:var(--surface-secondary, #f9fafb);padding:4px;border-radius:10px}.phase-tab{display:flex;align-items:center;gap:6px;padding:8px 16px;border:none;border-radius:8px;background:transparent;color:var(--text-secondary, #6b7280);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s}.phase-tab:hover{color:var(--text-primary, #111827);background:#fffc}.phase-tab.active{background:var(--surface, #ffffff);color:var(--primary-color, #4f46e5);box-shadow:0 1px 3px #0000001a}.phase-tab svg{width:16px;height:16px;flex-shrink:0}.phase-tab span{font-family:Inter,system-ui,sans-serif}.header-center-spacer{flex:1;min-width:0}.header-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.header-mode-toggle{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border-color, #e5e7eb);border-radius:6px;background:var(--surface, #ffffff);color:var(--text-secondary, #6b7280);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s}.header-mode-toggle:hover{border-color:var(--primary-color, #4f46e5);color:var(--primary-color, #4f46e5)}.header-mode-toggle.hybrid{background:#4f46e514;border-color:var(--primary-color, #4f46e5);color:var(--primary-color, #4f46e5)}.header-mode-toggle svg{width:16px;height:16px;flex-shrink:0}.header-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border:none;border-radius:6px;background:transparent;color:var(--text-secondary, #6b7280);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s}.header-btn:hover:not(:disabled){background:var(--surface-secondary, #f9fafb);color:var(--text-primary, #111827)}.header-btn:disabled{opacity:.4;cursor:not-allowed}.header-btn svg{width:18px;height:18px;flex-shrink:0}.subtab-bar{display:flex;align-items:center;height:44px;padding:0 16px;background:var(--surface, #ffffff);border-bottom:1px solid var(--border-color, #e5e7eb);gap:0}.subtab-phase-indicator{display:flex;align-items:center;gap:8px;padding-right:16px;flex-shrink:0}.subtab-phase-icon{display:flex;align-items:center;justify-content:center;color:var(--primary-color, #4f46e5)}.subtab-phase-icon svg{width:18px;height:18px}.subtab-phase-name{font-size:14px;font-weight:600;color:var(--text-primary, #111827);font-family:Inter,system-ui,sans-serif}.subtab-divider{width:1px;height:24px;background:var(--border-color, #e5e7eb);margin:0 16px 0 0;flex-shrink:0}.subtab-tabs{display:flex;align-items:center;gap:4px}.subtab-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;border:none;border-radius:0;background:transparent;color:var(--text-secondary, #6b7280);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap;position:relative;font-family:Inter,system-ui,sans-serif}.subtab-btn:hover:not(:disabled){background:#4f46e51a;color:var(--primary-color, #4f46e5)}.subtab-btn.active{color:var(--primary-color, #4f46e5)}.subtab-btn.active:hover:not(:disabled){color:var(--primary-color, #4f46e5)}.subtab-btn.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--primary-color, #4f46e5);border-radius:1px 1px 0 0}.subtab-btn:disabled{opacity:.4;cursor:not-allowed}.subtab-btn svg{width:16px;height:16px;flex-shrink:0}.subtab-spacer{flex:1}.phase-subnav-wrapper{display:contents}.phase-nav-row{display:flex;align-items:center;justify-content:flex-start;height:36px;padding:0 16px;background:var(--surface, #ffffff);border-bottom:1px solid var(--border-color, #e5e7eb);overflow:visible}.phase-tabs-container{display:flex;align-items:center;gap:2px;background:var(--surface-secondary, #f3f4f6);padding:3px;border-radius:8px}.phase-nav-tab{display:flex;align-items:center;gap:6px;padding:5px 14px;border:none;border-radius:6px;background:transparent;color:var(--text-secondary, #6b7280);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap}.phase-nav-tab:hover:not(:disabled){color:var(--text-primary, #111827);background:#fff9}.phase-nav-tab.active{background:var(--surface, #ffffff);color:var(--primary-color, #4f46e5);box-shadow:0 1px 3px #0000001a}.phase-nav-tab.active:hover:not(:disabled){color:var(--primary-color, #4f46e5)}.phase-nav-tab:disabled{opacity:.4;cursor:not-allowed}.phase-nav-tab svg{width:16px;height:16px;flex-shrink:0}.subtab-nav-row{display:flex;align-items:center;justify-content:flex-start;height:32px;padding:0 12px;background:var(--surface-secondary, #f9fafb);border-bottom:1px solid var(--border-color, #e5e7eb);overflow-x:auto;overflow-y:hidden}.subtab-tabs-container{display:flex;align-items:center;gap:3px}.subtab-nav-tab{display:flex;align-items:center;gap:4px;padding:4px 10px;border:1px solid transparent;border-radius:5px;background:transparent;color:var(--text-secondary, #6b7280);font-size:11px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}.subtab-nav-tab:hover:not(:disabled){background:var(--surface, #ffffff);color:var(--text-primary, #111827)}.subtab-nav-tab.active{background:var(--surface, #ffffff);color:var(--primary-color, #4f46e5);border-color:var(--primary-color, #4f46e5);box-shadow:0 1px 2px #0000000d}.subtab-nav-tab:disabled{opacity:.4;cursor:not-allowed}.subtab-nav-tab svg{width:14px;height:14px;flex-shrink:0}.phase-subnav{display:flex;align-items:center;justify-content:flex-start;gap:0;height:40px;padding:0 16px;background:var(--surface-secondary, #f9fafb);border-bottom:1px solid var(--border-color, #e5e7eb)}.subnav-tabs{display:flex;align-items:center;gap:4px}.subnav-tab{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--text-secondary, #6b7280);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s}.subnav-tab:hover:not(:disabled){background:#4f46e51a;color:var(--primary-color, #4f46e5)}.subnav-tab.active{background:var(--surface, #ffffff);color:var(--primary-color, #4f46e5);border-color:var(--primary-color, #4f46e5);box-shadow:0 1px 2px #0000000d}.subnav-tab.active:hover:not(:disabled){color:var(--primary-color, #4f46e5)}.subnav-tab:disabled{opacity:.4;cursor:not-allowed}.subnav-tab svg{width:14px;height:14px;flex-shrink:0}.subnav-phases{display:flex;align-items:center;gap:4px;background:var(--surface, #ffffff);padding:4px;border-radius:8px;border:1px solid var(--border-color, #e5e7eb);margin-left:16px}.subnav-phase-tab{display:flex;align-items:center;gap:6px;padding:6px 12px;border:none;border-radius:6px;background:transparent;color:var(--text-secondary, #6b7280);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}.subnav-phase-tab:hover:not(:disabled){color:var(--primary-color, #4f46e5);background:#4f46e51a}.subnav-phase-tab.active{background:var(--primary-color, #4f46e5);color:#fff}.subnav-phase-tab.active:hover:not(:disabled){background:var(--primary-hover, #4338ca);color:#fff!important}.subnav-phase-tab:disabled{opacity:.4;cursor:not-allowed}.subnav-phase-tab.inactive{opacity:.5}.subnav-phase-tab.inactive:hover:not(:disabled){opacity:.8}.subnav-phase-tab svg{width:14px;height:14px;flex-shrink:0}.subnav-separator{width:1px;height:24px;background:var(--border-color, #e5e7eb);margin:0 12px;flex-shrink:0}.subnav-canvas-toolbar{display:flex;align-items:center;gap:8px;margin-left:auto;margin-right:16px}.subnav-toolbar-group{display:flex;align-items:center;gap:2px;background:var(--surface, #ffffff);padding:2px;border-radius:6px;border:1px solid var(--border-color, #e5e7eb)}.subnav-toolbar-divider{width:1px;height:20px;background:var(--border-color, #e5e7eb);margin:0 4px}.subnav-toolbar-btn{display:flex;align-items:center;gap:4px;padding:4px 8px;border:none;border-radius:4px;background:transparent;color:var(--text-secondary, #6b7280);font-size:11px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}.subnav-toolbar-btn:hover:not(:disabled){background:#4f46e51a;color:var(--primary-color, #4f46e5)}.subnav-toolbar-btn.active{background:var(--primary-color, #4f46e5);color:#fff}.subnav-toolbar-btn:disabled{opacity:.4;cursor:not-allowed}.subnav-toolbar-btn svg{width:14px;height:14px;flex-shrink:0}@media (max-width: 1200px){.header-phases{gap:2px;padding:3px}.phase-tab{padding:6px 12px}.phase-tab span{display:none}}@media (max-width: 1200px){.subnav-toolbar-btn span{display:none}.subnav-toolbar-btn{padding:4px 6px}}@media (max-width: 900px){.header-left{min-width:auto}.header-logo-text{display:none}.header-project-name,.header-center .header-project-name{max-width:120px}.header-btn span,.header-mode-toggle span,.subnav-tab span,.subnav-phase-indicator span,.subnav-canvas-toolbar,.header-button-group .header-new-project-btn span,.header-button-group .header-save-btn span{display:none}.header-button-group .header-new-project-btn,.header-button-group .header-save-btn{padding:6px 8px}}@media (prefers-color-scheme: dark){.hybrid-header{background:#1f2937;border-bottom-color:#374151}.header-logo{color:#818cf8}.header-divider{background:#374151}.header-project-name{color:#f9fafb}.header-project-name:hover{background:#374151}.header-project-input{background:#374151;border-color:#818cf8;color:#f9fafb}.header-project-uuid{background:#374151;color:#9ca3af}.header-save-btn:hover:not(:disabled){background:#374151;color:#818cf8}.header-phases{background:#374151}.phase-tab{color:#9ca3af}.phase-tab:hover{color:#f9fafb;background:#374151cc}.phase-tab.active{background:#1f2937;color:#818cf8;box-shadow:0 1px 3px #0000004d}.header-mode-toggle{background:#374151;border-color:#4b5563;color:#9ca3af}.header-mode-toggle:hover{border-color:#818cf8;color:#818cf8}.header-mode-toggle.hybrid{background:#818cf826;border-color:#818cf8;color:#818cf8}.header-btn{color:#9ca3af}.header-btn:hover:not(:disabled){background:#374151;color:#f9fafb}.phase-subnav{background:#111827;border-bottom-color:#374151}.subnav-tab{color:#9ca3af}.subnav-tab:hover:not(:disabled){background:#1f2937;color:#f9fafb}.subnav-tab.active{background:#1f2937;color:#818cf8;border-color:#818cf8}.subnav-phase-indicator{color:#6b7280}.subnav-toolbar-group{background:#1f2937;border-color:#374151}.subnav-toolbar-divider{background:#374151}.subnav-toolbar-btn{color:#9ca3af}.subnav-toolbar-btn:hover:not(:disabled){background:#374151;color:#f9fafb}.subnav-toolbar-btn.active{background:#818cf8;color:#fff}.subtab-bar{background:#1f2937;border-bottom-color:#374151}.subtab-phase-icon{color:#818cf8}.subtab-phase-name{color:#f9fafb}.subtab-divider{background:#374151}.subtab-btn{color:#9ca3af}.subtab-btn:hover:not(:disabled){color:#f9fafb}.subtab-btn.active{color:#818cf8}.subtab-btn.active:after{background:#818cf8}.header-button-group{background:#374151}.header-button-group .header-new-project-btn{background:#818cf8}.header-button-group .header-new-project-btn:hover{background:#6366f1}.header-button-group .header-save-btn{color:#9ca3af}.header-button-group .header-save-btn:hover:not(:disabled){background:#4b5563;color:#818cf8}.header-center .header-project-name{color:#f9fafb}.header-center .header-project-name:hover{background:#374151}.header-center .header-project-uuid{background:#374151;color:#9ca3af}.uuid-copy-btn{color:#9ca3af}.uuid-copy-btn:hover{background:#4b5563;color:#818cf8}}.hybrid-layout{display:grid;grid-template-rows:44px 44px 1fr 100px;grid-template-columns:64px 380px minmax(400px,1fr);grid-template-areas:"rail header   header" "rail subtabs  subtabs" "rail panel    canvas" "rail panel    timeline";height:100vh;overflow:hidden;background:var(--background, #f3f4f6)}.hybrid-layout>.phase-rail{grid-area:rail}.hybrid-layout>.hybrid-header{grid-area:header}.hybrid-layout>.subtab-bar{grid-area:subtabs}.hybrid-layout>.phase-subnav-wrapper{grid-area:subtabs;display:contents}.hybrid-layout>.phase-subnav-wrapper>.phase-nav-row,.hybrid-layout>.phase-nav-row{display:none}.hybrid-layout>.phase-subnav-wrapper>.subtab-nav-row,.hybrid-layout>.subtab-nav-row{grid-area:subtabs}.hybrid-layout>.phase-subnav{grid-area:subtabs}.hybrid-layout>.context-panel{grid-area:panel}.hybrid-canvas-area{grid-area:canvas;display:flex;flex-direction:column;min-width:0;min-height:0;height:100%;overflow:hidden;background:var(--surface-secondary, #f9fafb)}.hybrid-layout>.scene-timeline{grid-area:timeline}.hybrid-canvas-wrapper{flex:1;display:flex;flex-direction:column;min-height:0;height:100%;position:relative}.hybrid-canvas-toolbar{flex-shrink:0}.hybrid-canvas-container{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0;padding:8px;overflow:hidden;height:100%}@media (max-width: 900px){.hybrid-layout{grid-template-rows:40px 40px 1fr auto 80px;grid-template-columns:1fr;grid-template-areas:"header" "subtabs" "canvas" "panel" "timeline"}.hybrid-layout>.phase-rail{display:none}.hybrid-canvas-area{grid-area:canvas}.hybrid-layout>.context-panel{grid-area:panel;max-height:40vh;border-right:none!important;border-top:1px solid var(--border-color, #e5e7eb)}.hybrid-layout>.scene-timeline{grid-area:timeline}.subtab-bar{padding:0 12px}}.hybrid-layout.fullscreen-recording{grid-template-rows:0 0 1fr 0;grid-template-columns:0 0 1fr;grid-template-areas:"rail header   header" "rail subtabs  subtabs" "rail panel    canvas" "rail panel    timeline"}.hybrid-layout.fullscreen-recording .hybrid-header,.hybrid-layout.fullscreen-recording .phase-subnav,.hybrid-layout.fullscreen-recording .subtab-bar,.hybrid-layout.fullscreen-recording .scene-timeline,.hybrid-layout.fullscreen-recording .context-panel,.hybrid-layout.fullscreen-recording .phase-rail{display:none}.hybrid-layout.fullscreen-recording .hybrid-canvas-area{background:#000}.hybrid-canvas-wrapper.fullscreen-playback{position:fixed!important;top:0;left:0;width:100vw!important;height:100vh!important;z-index:9999;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;--fullscreen-toolbar-height: 44px}.hybrid-canvas-wrapper.fullscreen-playback .canvas-toolbar,.hybrid-canvas-wrapper.fullscreen-playback .canvas-tab-bar,.hybrid-canvas-wrapper.fullscreen-playback .browser-window-toolbar{display:none!important}.hybrid-canvas-wrapper.fullscreen-playback .browser-window{border-radius:0;box-shadow:none}.hybrid-canvas-wrapper.fullscreen-playback .browser-window-content{border-radius:0}.hybrid-canvas-wrapper.fullscreen-playback .ai-image-overlay:hover,.hybrid-canvas-wrapper.fullscreen-playback .scene-text-overlay:hover{border-color:transparent!important;box-shadow:none!important}.hybrid-canvas-wrapper.fullscreen-playback .ai-image-overlay .edit-icon,.hybrid-canvas-wrapper.fullscreen-playback .scene-text-overlay .edit-icon,.hybrid-canvas-wrapper.fullscreen-playback .ai-image-overlay-controls,.hybrid-canvas-wrapper.fullscreen-playback .scene-text-overlay-controls{display:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important}.hybrid-canvas-wrapper.fullscreen-playback .hybrid-canvas-container{flex:0 0 auto;display:flex;align-items:center;justify-content:center;max-width:100vw;height:calc(100vh - var(--fullscreen-toolbar-height, 44px));max-height:calc(100vh - var(--fullscreen-toolbar-height, 44px));width:100%;padding:0}.hybrid-canvas-wrapper.fullscreen-playback .browser-tab-container{position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:var(--fullscreen-toolbar-height, 44px)!important;width:100vw!important;height:calc(100vh - var(--fullscreen-toolbar-height, 44px))!important;max-width:none!important;max-height:none!important;display:block!important}.hybrid-canvas-wrapper.fullscreen-playback .browser-tab-container>*{position:absolute!important;top:0!important;right:0!important;bottom:0!important;left:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;aspect-ratio:unset!important}.hybrid-canvas-wrapper.fullscreen-playback .browser-window{width:100%!important;height:100%!important;border-radius:0!important;box-shadow:none!important}.hybrid-canvas-wrapper.fullscreen-playback .browser-window-content{width:100%!important;height:100%!important;border-radius:0!important}.hybrid-canvas-wrapper.fullscreen-playback .hybrid-canvas-container>.doodle-canvas-wrapper{--available-height: calc(100vh - var(--fullscreen-toolbar-height, 44px));max-width:100vw;max-height:var(--available-height);width:auto;height:auto;aspect-ratio:var(--canvas-aspect-ratio, 16 / 9)}.hybrid-canvas-wrapper.fullscreen-playback .doodle-canvas-wrapper{--available-height: calc(100vh - var(--fullscreen-toolbar-height, 44px));max-width:calc(var(--available-height) * var(--canvas-aspect-ratio, 1.777));max-height:calc(100vw / var(--canvas-aspect-ratio, 1.777));width:100%;height:100%;object-fit:contain}body:fullscreen{overflow:hidden}.hybrid-layout.fullscreen-focused{grid-template-rows:0 0 1fr 0;grid-template-columns:0 0 1fr;grid-template-areas:"rail header   header" "rail subtabs  subtabs" "rail panel    canvas" "rail panel    timeline"}.hybrid-layout.fullscreen-focused>.phase-rail,.hybrid-layout.fullscreen-focused>.hybrid-header,.hybrid-layout.fullscreen-focused>.subtab-bar,.hybrid-layout.fullscreen-focused>.context-panel,.hybrid-layout.fullscreen-focused>.scene-timeline{display:none!important}.hybrid-layout.fullscreen-focused .hybrid-canvas-area{grid-area:canvas;width:100vw;height:100vh;background:#1a1a2e}.hybrid-layout.fullscreen-focused .hybrid-canvas-wrapper{height:100%}.hybrid-layout.fullscreen-focused .canvas-toolbar,.hybrid-layout.fullscreen-focused .canvas-tab-bar{background:#1a1a2ef2;border-color:#ffffff1a;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hybrid-layout.fullscreen-focused .hybrid-canvas-container{background:#000;padding:8px}.context-panel{transition:width .2s ease-out,transform .2s ease-out}.canvas-content-container{position:relative;flex:1;display:flex;flex-direction:column;min-height:0;width:100%}.canvas-content-layer{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column}.canvas-content-layer.active{opacity:1;visibility:visible;z-index:1;pointer-events:auto}.canvas-content-layer.inactive{opacity:0;visibility:hidden;z-index:0;pointer-events:none}.canvas-content-layer.inactive.recording-keep-visible{visibility:visible}.hybrid-layout.fullscreen-context{grid-template-columns:64px 1fr 0;grid-template-areas:"rail header   canvas" "rail subtabs  canvas" "rail panel    canvas" "rail panel    timeline"}.hybrid-layout.fullscreen-context>.hybrid-canvas-wrapper,.hybrid-layout.fullscreen-context>.scene-timeline,.hybrid-layout.fullscreen-context>.hybrid-canvas-area{display:none!important}.hybrid-layout.fullscreen-context>.context-panel{grid-area:panel;width:100%;border-right:none;background:var(--surface, #fff)}.context-panel{width:100%;height:100%;flex-shrink:0;display:flex;flex-direction:column;background:var(--surface, #ffffff);border-right:1px solid var(--border-color, #e5e7eb);position:relative;transition:width .2s ease-out;overflow:hidden}.context-panel.collapsed{width:40px}.context-panel-toggle{position:absolute;top:8px;right:8px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-color, #e5e7eb);border-radius:4px;background:var(--surface, #ffffff);color:var(--text-secondary, #6b7280);cursor:pointer;z-index:10;transition:all .15s}.context-panel-toggle:hover{background:var(--surface-secondary, #f9fafb);color:var(--text-primary, #111827);border-color:var(--primary-color, #4f46e5)}.context-panel-toggle svg{transition:transform .2s ease-out}.context-panel.collapsed .context-panel-toggle{right:8px;top:50%;transform:translateY(-50%)}.context-panel-content{flex:1;display:flex;flex-direction:column;min-height:0;padding-top:36px}.context-panel.toggle-hidden .context-panel-content{padding-top:0}.context-panel-scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding:8px}.context-panel-scroll::-webkit-scrollbar{width:6px}.context-panel-scroll::-webkit-scrollbar-track{background:transparent}.context-panel-scroll::-webkit-scrollbar-thumb{background:var(--border-color, #e5e7eb);border-radius:3px}.context-panel-scroll::-webkit-scrollbar-thumb:hover{background:var(--text-secondary, #6b7280)}.context-panel-collapsed-label{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);padding:16px 0}.collapsed-phase{font-size:12px;font-weight:600;color:var(--primary-color, #4f46e5);text-transform:uppercase;letter-spacing:1px}.collapsed-subtab{font-size:11px;color:var(--text-secondary, #6b7280);text-transform:capitalize}.context-section{margin-bottom:12px}.context-section-header{display:flex;align-items:center;gap:8px;padding:8px 0;font-size:11px;font-weight:600;color:var(--text-secondary, #6b7280);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border-color, #e5e7eb);margin-bottom:8px}.context-section-header svg{width:14px;height:14px;opacity:.7}.context-section-content{padding:0}@media (prefers-color-scheme: dark){.context-panel{background:#1f2937;border-right-color:#374151}.context-panel-toggle{background:#1f2937;border-color:#374151;color:#9ca3af}.context-panel-toggle:hover{background:#374151;color:#f9fafb;border-color:#818cf8}.context-panel-scroll::-webkit-scrollbar-thumb{background:#374151}.context-panel-scroll::-webkit-scrollbar-thumb:hover{background:#4b5563}.collapsed-phase{color:#818cf8}.collapsed-subtab{color:#6b7280}.context-section-header{color:#9ca3af;border-bottom-color:#374151}}@media (max-width: 1200px){.context-panel{width:312px}}@media (max-width: 900px){.context-panel{width:100%;max-height:40vh;border-right:none;border-top:1px solid var(--border-color, #e5e7eb)}.context-panel.collapsed{width:100%;height:40px;max-height:40px}.context-panel-toggle{top:8px;right:16px}.context-panel-toggle svg{transform:rotate(90deg)}.context-panel.collapsed .context-panel-toggle svg{transform:rotate(-90deg)}.context-panel-collapsed-label{writing-mode:horizontal-tb;transform:none;flex-direction:row}}.scene-timeline{display:flex;align-items:center;height:85px;padding:6px 12px 10px;background:var(--surface, #ffffff);border-top:1px solid var(--border-color, #e5e7eb);gap:12px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}.timeline-playback{display:flex;align-items:center;gap:10px;flex-shrink:0;padding-right:16px;border-right:1px solid var(--border-color, #e5e7eb)}.timeline-play-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;border-radius:4px;background:transparent;color:var(--text-primary, #374151);cursor:pointer;transition:all .15s}.timeline-play-btn:hover:not(:disabled){background:var(--surface-secondary, #f3f4f6);color:var(--primary-color, #4f46e5)}.timeline-play-btn:disabled{opacity:.4;cursor:not-allowed}.timeline-timer{display:flex;align-items:center;gap:4px;font-size:13px;font-family:SF Mono,Menlo,Consolas,monospace;color:var(--text-secondary, #6b7280);white-space:nowrap}.timer-separator{opacity:.5}.timeline-playback-slot{display:flex;align-items:center}.timeline-scenes-container{flex:1;overflow-x:auto;overflow-y:hidden;min-width:0;scrollbar-width:thin;scrollbar-color:var(--border-color, #e5e7eb) transparent;position:relative}.timeline-scenes-container::-webkit-scrollbar{height:5px}.timeline-scenes-container::-webkit-scrollbar-track{background:transparent}.timeline-scenes-container::-webkit-scrollbar-thumb{background:var(--border-color, #e5e7eb);border-radius:3px}.timeline-scenes-container::-webkit-scrollbar-thumb:hover{background:var(--primary-color, #4f46e5)}.timeline-scenes-container:before,.timeline-scenes-container:after{content:"";position:absolute;top:0;bottom:0;width:30px;pointer-events:none;z-index:2;opacity:0;transition:opacity .2s}.timeline-scenes-container:before{left:0;background:linear-gradient(to right,var(--surface, #ffffff),transparent)}.timeline-scenes-container:after{right:0;background:linear-gradient(to left,var(--surface, #ffffff),transparent)}.timeline-scenes-container.has-scroll-left:before,.timeline-scenes-container.has-scroll-right:after{opacity:1}.timeline-scenes{display:flex;align-items:flex-start;gap:12px;padding:4px 8px;min-width:max-content}.timeline-empty{display:flex;align-items:center;justify-content:center;padding:16px 24px;color:var(--text-secondary, #6b7280);font-size:13px;font-style:italic}.scene-card{display:flex;flex-direction:column;gap:6px;flex-shrink:0}.scene-thumbnail{width:80px;height:45px;border:2px dashed transparent;border-radius:5px;background:var(--surface, #ffffff);box-shadow:0 1px 3px #00000014;overflow:hidden;cursor:pointer;transition:all .15s ease;position:relative;display:flex;align-items:center;justify-content:center}.scene-thumbnail:hover:not(.active){border-color:var(--border-color, #d1d5db);box-shadow:0 2px 6px #0000001a}.scene-thumbnail.active{border-color:var(--primary-color, #4f46e5);border-style:dashed;box-shadow:0 2px 8px #4f46e533}.scene-thumbnail.intro{background:linear-gradient(135deg,#10b9810d,#10b9811a)}.scene-thumbnail.intro.active{border-color:var(--success-color, #10b981)}.scene-thumbnail.outro{background:linear-gradient(135deg,#f59e0b0d,#f59e0b1a)}.scene-thumbnail.outro.active{border-color:var(--warning-color, #f59e0b)}.scene-preview-content{padding:4px 6px;font-size:9px;line-height:1.2;color:var(--text-secondary, #6b7280);text-align:center;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}.scene-playing-indicator{position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--primary-color, #4f46e5);animation:scene-progress 2s linear infinite}@keyframes scene-progress{0%{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}.scene-label{display:flex;justify-content:space-between;align-items:center;padding:0 2px;gap:8px}.scene-numbered-label{font-size:10px;font-weight:500;color:var(--text-secondary, #6b7280);white-space:nowrap}.scene-duration{font-size:9px;font-family:SF Mono,Menlo,monospace;color:var(--text-tertiary, #9ca3af)}.add-scene-btn{width:40px;height:45px;border:2px dashed var(--border-color, #d1d5db);border-radius:5px;background:transparent;color:var(--text-tertiary, #9ca3af);cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;flex-shrink:0}.add-scene-btn:hover:not(:disabled){border-color:var(--primary-color, #4f46e5);color:var(--primary-color, #4f46e5);background:#4f46e50d}.add-scene-btn:disabled{opacity:.4;cursor:not-allowed}@media (prefers-color-scheme: dark){.scene-timeline{background:#1f2937;border-top-color:#374151}.timeline-playback{border-right-color:#374151}.timeline-play-btn{color:#d1d5db}.timeline-play-btn:hover:not(:disabled){background:#374151;color:#818cf8}.timeline-timer{color:#9ca3af}.timeline-scenes-container::-webkit-scrollbar-thumb{background:#4b5563}.scene-thumbnail{background:#374151;box-shadow:0 1px 3px #0003}.scene-thumbnail:hover:not(.active){border-color:#4b5563}.scene-thumbnail.active{border-color:#818cf8;box-shadow:0 2px 8px #818cf84d}.scene-preview-content{color:#9ca3af}.scene-numbered-label{color:#d1d5db}.scene-duration{color:#6b7280}.add-scene-btn{border-color:#4b5563;color:#6b7280}.add-scene-btn:hover:not(:disabled){border-color:#818cf8;color:#818cf8;background:#818cf81a}.timeline-empty{color:#6b7280}}@media (max-width: 900px){.scene-timeline{height:80px;padding:4px 8px;gap:10px}.timeline-playback{padding-right:10px;gap:6px}.timeline-timer{font-size:11px}.scene-thumbnail{width:70px;height:40px}.scene-preview-content{font-size:8px;padding:4px}.scene-numbered-label{font-size:9px}.scene-duration{font-size:8px}.add-scene-btn{width:35px;height:40px}}@media (max-width: 600px){.scene-timeline{height:70px;padding:4px 6px}.timeline-playback{flex-direction:column;gap:4px;padding-right:6px}.timeline-timer{font-size:10px}.scene-thumbnail{width:60px;height:35px}.scene-label{flex-direction:column;align-items:flex-start;gap:2px}}.timeline-generation-progress{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.phase-content{display:flex;flex-direction:column;gap:12px;height:100%}.phase-divider{height:1px;background:var(--border-color, #e5e7eb);margin:8px 0}.format-phase .format-phase-header{padding:0 0 8px;border-bottom:1px solid var(--border-color, #e5e7eb);margin-bottom:8px}.format-phase .format-phase-header h3{font-size:14px;font-weight:600;color:var(--text-primary, #111827);margin:0 0 4px}.format-phase .format-phase-header p{font-size:12px;color:var(--text-secondary, #6b7280);margin:0;line-height:1.4}.preview-playback-info{padding:16px;text-align:center}.playback-status{display:flex;flex-direction:column;align-items:center;gap:12px}.status-indicator{display:inline-flex;align-items:center;padding:8px 16px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-indicator.stopped{background:var(--surface-secondary, #f9fafb);color:var(--text-secondary, #6b7280)}.status-indicator.playing{background:#10b9811a;color:var(--success-color, #10b981);animation:pulse 2s ease-in-out infinite}.status-indicator.paused{background:#f59e0b1a;color:var(--warning-color, #f59e0b)}.playback-hint{font-size:12px;color:var(--text-secondary, #6b7280);max-width:200px;line-height:1.5}.edit-mode-controls{padding:8px}.edit-section-title{font-size:12px;font-weight:600;color:var(--text-primary, #111827);margin:0 0 4px}.edit-hint{font-size:11px;color:var(--text-secondary, #6b7280);margin:0 0 12px;line-height:1.4}.edit-toggles{display:flex;flex-direction:column;gap:8px}.edit-toggle{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--surface-secondary, #f9fafb);border-radius:6px;cursor:pointer;transition:background .15s}.edit-toggle:hover{background:var(--surface, #ffffff);box-shadow:0 1px 3px #0000001a}.edit-toggle input[type=checkbox]{width:16px;height:16px;accent-color:var(--primary-color, #4f46e5);cursor:pointer}.edit-toggle input[type=checkbox]:disabled{opacity:.5;cursor:not-allowed}.toggle-label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--text-primary, #111827)}.toggle-label svg{opacity:.7}.format-section,.projects-section{padding:8px}.projects-subsection{margin-bottom:16px}.subsection-title{font-size:11px;font-weight:600;color:var(--text-secondary, #6b7280);text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px}.auth-hint{font-size:11px;color:var(--text-secondary, #6b7280);font-style:italic;margin:0 0 12px}.projects-tabs{display:flex;gap:4px;margin-bottom:12px;padding:4px;background:var(--surface-secondary, #f3f4f6);border-radius:8px}.projects-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;border:none;border-radius:6px;background:transparent;color:var(--text-secondary, #6b7280);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s ease}.projects-tab:hover:not(.disabled){background:#ffffff80;color:var(--text-primary, #111827)}.projects-tab.active{background:var(--surface, #ffffff);color:var(--primary-color, #4f46e5);box-shadow:0 1px 3px #0000001a}.projects-tab.disabled{opacity:.5;cursor:not-allowed}.projects-tab svg{flex-shrink:0;opacity:.7}.projects-tab.active svg{opacity:1}.projects-tab-content{flex:1;overflow-y:auto;min-height:0}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@media (prefers-color-scheme: dark){.phase-divider{background:#374151}.status-indicator.stopped{background:#374151;color:#9ca3af}.status-indicator.playing{background:#10b98133}.status-indicator.paused{background:#f59e0b33}.playback-hint{color:#9ca3af}.edit-section-title{color:#f9fafb}.edit-hint{color:#9ca3af}.edit-toggle{background:#374151}.edit-toggle:hover{background:#4b5563}.toggle-label{color:#f9fafb}.subsection-title{color:#9ca3af}.auth-hint{color:#6b7280}.projects-tabs{background:#374151}.projects-tab{color:#9ca3af}.projects-tab:hover:not(.disabled){background:#ffffff1a;color:#f9fafb}.projects-tab.active{background:#4b5563;color:#818cf8}}:root{--primary-color: #4f46e5;--primary-hover: #4338ca;--secondary-color: #6b7280;--success-color: #10b981;--error-color: #ef4444;--warning-color: #f59e0b;--info-color: #3b82f6;--background: #f3f4f6;--surface: #ffffff;--surface-secondary: #f9fafb;--text-primary: #111827;--text-secondary: #6b7280;--border-color: #e5e7eb;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--header-height: 56px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--background);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased}.app{height:100vh;display:flex;flex-direction:column;overflow:hidden}.app-header{height:var(--header-height);background:var(--surface);border-bottom:1px solid var(--border-color);padding:0 1rem;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;box-shadow:var(--shadow-sm)}.header-left{display:flex;align-items:center;gap:1rem}.app-header h1{display:flex;align-items:center;gap:.5rem;font-size:1.25rem;font-weight:700;color:var(--primary-color)}.app-header .subtitle{color:var(--text-secondary);font-size:.75rem}.header-divider{width:1px;height:24px;background:var(--border-color);margin:0 .5rem}.header-project-title{display:flex;align-items:center;gap:.5rem}.header-project-name{font-size:.875rem;font-weight:500;color:var(--text);cursor:pointer;padding:.25rem .5rem;border-radius:var(--radius-sm);transition:background .2s,color .2s;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-project-name:hover{background:#4f46e51a;color:var(--primary-color)}.header-project-name-input{background:var(--surface);border:2px solid var(--primary-color);border-radius:var(--radius-sm);padding:.25rem .5rem;font-size:.875rem;font-weight:500;font-family:inherit;color:var(--text);min-width:150px;max-width:200px}.header-project-name-input:focus{outline:none;box-shadow:0 0 0 3px #4f46e51a}.header-save-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.header-save-btn:hover:not(:disabled){background:var(--primary-color);border-color:var(--primary-color);color:#fff}.header-save-btn:disabled{opacity:.5;cursor:not-allowed}.project-name-display{cursor:pointer;padding:.2rem .5rem;border-radius:var(--radius-sm);transition:background .2s}.project-name-display:hover{background:#4f46e51a;text-decoration:underline}.project-name-input{background:var(--surface);border:2px solid var(--primary-color);border-radius:var(--radius-sm);padding:.3rem .6rem;font-size:1.2rem;font-weight:600;font-family:inherit;color:var(--text);min-width:250px;max-width:400px}.project-name-input:focus{outline:none;box-shadow:0 0 0 3px #4f46e51a}.header-actions{display:flex;gap:.5rem}.header-btn{display:flex;align-items:center;gap:.375rem;padding:.5rem .75rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s}.header-btn:hover:not(:disabled){background:var(--surface);border-color:var(--primary-color);color:var(--primary-color)}.header-btn:disabled{opacity:.5;cursor:not-allowed}.admin-link{text-decoration:none;background:linear-gradient(135deg,#9f7aea,#805ad5);border:none;color:#fff}.admin-link:hover{background:linear-gradient(135deg,#b794f4,#9f7aea);border-color:transparent;color:#fff}.app-main{flex:1;display:flex;gap:1rem;padding:1rem;min-height:0;overflow:hidden}.panel{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:column;overflow:hidden}.panel-left{width:320px;flex-shrink:0}.panel-center{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}.panel-right{width:300px;flex-shrink:0}.panel-section{padding:.5rem .6rem;border-bottom:1px solid var(--border-color)}.panel-section:last-child{border-bottom:none}.panel-section.flex-grow{flex:1;min-height:0;display:flex;flex-direction:column}.panel-left .panel-section{padding:.4rem .6rem}.panel-right .panel-section{padding:.35rem .6rem}.tabbed-panel{display:flex;flex-direction:column;height:100%;overflow:hidden}.tab-bar{display:flex;background:var(--surface-secondary);border-bottom:1px solid var(--border-color);flex-shrink:0}.tab-button{flex:1;display:flex;align-items:center;justify-content:center;gap:.35rem;padding:.6rem .5rem;background:transparent;border:none;border-bottom:2px solid transparent;font-size:.7rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s}.tab-button:hover{color:var(--text-primary);background:#00000005}.tab-button.active{color:var(--primary-color);border-bottom-color:var(--primary-color);background:var(--surface)}.tab-button svg{flex-shrink:0}.tab-content{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:transparent transparent}.tab-content:hover{scrollbar-color:var(--border-color) transparent}.tab-content::-webkit-scrollbar{width:4px}.tab-content::-webkit-scrollbar-track{background:transparent}.tab-content::-webkit-scrollbar-thumb{background:transparent;border-radius:2px}.tab-content:hover::-webkit-scrollbar-thumb{background:var(--border-color)}.tab-panel-content{padding:.75rem}.tab-panel-content.tab-panel-fill{height:100%;display:flex;flex-direction:column}.tab-divider{height:1px;background:var(--border-color);margin:.5rem 0}.create-tab-content{display:flex;flex-direction:column;height:100%}.sub-tab-bar{display:flex;background:var(--surface-secondary);border-bottom:1px solid var(--border-color);padding:.25rem .5rem;gap:.25rem}.sub-tab-button{display:flex;align-items:center;gap:.35rem;padding:.4rem .75rem;background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);font-size:.75rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.sub-tab-button:hover{color:var(--text-primary);background:#00000008}.sub-tab-button.active{color:var(--primary-color);background:var(--surface);border-color:var(--primary-color)}.sub-tab-icon{font-size:.9rem}.sub-tab-label{font-size:.75rem}.sub-tab-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:0;scrollbar-width:thin;scrollbar-color:transparent transparent}.sub-tab-content:hover{scrollbar-color:var(--border-color) transparent}.sub-tab-content::-webkit-scrollbar{width:4px}.sub-tab-content::-webkit-scrollbar-track{background:transparent}.sub-tab-content::-webkit-scrollbar-thumb{background:transparent;border-radius:2px}.sub-tab-content:hover::-webkit-scrollbar-thumb{background:var(--border-color)}.settings-panel{display:flex;flex-direction:column;height:100%}.settings-sub-tabs{display:flex;background:var(--background);border-radius:var(--radius-md);padding:2px;margin-bottom:.75rem}.sub-tab-button{flex:1;padding:.4rem .5rem;background:transparent;border:none;border-radius:calc(var(--radius-md) - 2px);font-size:.7rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s}.sub-tab-button:hover{color:var(--text-primary)}.sub-tab-button.active{background:var(--surface);color:var(--primary-color);box-shadow:var(--shadow-sm)}.settings-sub-content{flex:1;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;min-height:0;scrollbar-width:thin;scrollbar-color:transparent transparent}.settings-sub-content:hover{scrollbar-color:var(--border-color) transparent}.settings-sub-content::-webkit-scrollbar{width:4px}.settings-sub-content::-webkit-scrollbar-track{background:transparent}.settings-sub-content::-webkit-scrollbar-thumb{background:transparent;border-radius:2px}.settings-sub-content:hover::-webkit-scrollbar-thumb{background:var(--border-color)}.project-tab-content{display:flex;flex-direction:column;gap:16px;padding:.5rem}.projects-tab-content{display:flex;flex-direction:column;gap:.75rem;padding:.5rem;flex:1;min-height:0;overflow:hidden}.project-actions-bar{display:flex;align-items:center;gap:.25rem;padding:.25rem;background:var(--surface);border-radius:var(--radius-md);border:1px solid var(--border-color)}.project-action-btn{display:flex;align-items:center;gap:.2rem;padding:.2rem .35rem;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.6rem;font-weight:500;color:var(--text-primary);cursor:pointer;transition:all .15s ease}.project-action-btn:hover{background:var(--background);border-color:var(--primary-color);color:var(--primary-color)}.project-action-btn:disabled{opacity:.5;cursor:not-allowed}.project-action-btn:disabled:hover{background:transparent;border-color:var(--border-color);color:var(--text-primary)}.project-action-btn.primary{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.project-action-btn.primary:hover{background:var(--primary-hover);border-color:var(--primary-hover);color:#fff}.project-action-btn.primary:disabled{background:var(--primary-color);opacity:.5}.project-action-btn svg{width:10px;height:10px;flex-shrink:0}.project-action-btn.enterprise-locked{opacity:.6;cursor:not-allowed;position:relative}.project-action-btn.enterprise-locked:hover{background:transparent;border-color:var(--border-color);color:var(--text-secondary)}.project-action-btn.enterprise-locked svg:last-child{width:12px;height:12px;margin-left:2px;color:var(--warning-color, #f59e0b)}.project-actions-divider{width:1px;height:16px;background:var(--border-color);margin:0 .1rem}.projects-sub-tabs{display:flex;background:var(--background);border-radius:var(--radius-sm);padding:2px}.projects-sub-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:.35rem;padding:.35rem .5rem;background:transparent;border:none;border-radius:calc(var(--radius-sm) - 2px);font-size:.65rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.projects-sub-tab:hover{color:var(--text-primary);background:rgba(var(--primary-rgb),.05)}.projects-sub-tab.active{background:var(--surface);color:var(--primary-color);box-shadow:var(--shadow-sm)}.projects-sub-tab svg{width:12px;height:12px}.projects-content{flex:1;overflow-y:auto;min-height:200px;max-height:400px}.projects-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:2rem;color:var(--text-secondary);text-align:center}.projects-placeholder svg{width:32px;height:32px;opacity:.5}.projects-placeholder p{font-size:.8rem;font-weight:500;margin:0}.projects-placeholder span{font-size:.7rem;opacity:.7}.info-tab-content{padding:.5rem;flex:1;display:flex;flex-direction:column;min-height:0}.preferences-content{padding:.5rem}.preferences-placeholder{color:var(--text-secondary);font-size:.75rem;text-align:center;padding:1rem}.lip-sync-settings{padding:.5rem 0;border-bottom:1px solid var(--border-color);margin-bottom:.75rem}.lip-sync-settings h4{font-size:.75rem;font-weight:600;margin-bottom:.5rem;color:var(--text-primary)}.lip-sync-settings .service-status-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.lip-sync-settings .status-indicator{display:flex;align-items:center;gap:.4rem;font-size:.7rem}.lip-sync-settings .status-dot{width:8px;height:8px;border-radius:50%;background:var(--error-color)}.lip-sync-settings .status-indicator.online .status-dot{background:var(--success-color)}.lip-sync-settings .refresh-btn{padding:.25rem;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;color:var(--text-secondary)}.lip-sync-settings .refresh-btn:hover{border-color:var(--primary-color);color:var(--primary-color)}.lip-sync-settings .service-error{color:var(--error-color);font-size:.65rem;margin-bottom:.5rem}.lip-sync-settings .setting-row{margin-bottom:.5rem}.lip-sync-settings .setting-row label{display:flex;align-items:center;gap:.5rem;font-size:.75rem}.lip-sync-settings .toggle-label{position:relative;display:flex;align-items:center;gap:.5rem;cursor:pointer}.lip-sync-settings .toggle-label input[type=checkbox]{width:16px;height:16px;accent-color:var(--primary-color)}.lip-sync-settings select{width:100%;padding:.4rem .5rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem;background:var(--surface);margin-top:.25rem}.lip-sync-settings .hint-text{font-size:.65rem;color:var(--text-secondary);margin-top:.5rem;line-height:1.4}.lip-sync-settings .hint-text code{display:block;margin-top:.25rem;padding:.25rem;background:var(--background);border-radius:var(--radius-sm);font-size:.6rem;overflow-x:auto}.logo-settings{padding:.5rem 0}.logo-settings h4{font-size:.75rem;font-weight:600;margin-bottom:.5rem;color:var(--text-primary)}.logo-upload-section{margin-bottom:.75rem}.logo-upload-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.75rem;background:var(--background);border:2px dashed var(--border-color);border-radius:var(--radius-md);color:var(--text-secondary);font-size:.75rem;cursor:pointer;transition:all .2s}.logo-upload-btn:hover{border-color:var(--primary-color);color:var(--primary-color)}.logo-preview-container{position:relative;display:inline-block;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:.5rem}.logo-preview{max-width:100px;max-height:60px;display:block}.logo-remove-btn{position:absolute;top:-6px;right:-6px;width:20px;height:20px;padding:0;display:flex;align-items:center;justify-content:center;background:var(--error-color);border:none;border-radius:50%;color:#fff;cursor:pointer;transition:transform .2s}.logo-remove-btn:hover{transform:scale(1.1)}.logo-setting-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.35rem 0;font-size:.7rem}.logo-position-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px}.position-btn{padding:.25rem .4rem;background:var(--background);border:1px solid var(--border-color);font-size:.6rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s}.position-btn:first-child{border-radius:var(--radius-sm) 0 0 0}.position-btn:nth-child(2){border-radius:0 var(--radius-sm) 0 0}.position-btn:nth-child(3){border-radius:0 0 0 var(--radius-sm)}.position-btn:last-child{border-radius:0 0 var(--radius-sm) 0}.position-btn:hover{background:var(--surface)}.position-btn.active{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.logo-opacity-slider{flex:1;max-width:80px}.opacity-value,.size-value{min-width:32px;text-align:right;color:var(--text-secondary)}.logo-size-slider{flex:1;max-width:80px}.logo-position-inputs{flex-wrap:wrap}.position-input-group{display:flex;gap:.5rem;align-items:center}.position-input-group label{display:flex;align-items:center;gap:.25rem;font-size:.65rem;color:var(--text-secondary)}.position-input{width:60px;padding:.25rem;font-size:.7rem;border:1px solid var(--border-color);border-radius:4px;background:var(--bg-secondary);color:var(--text-primary)}.position-input:focus{outline:none;border-color:var(--primary-color)}.logo-center-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;font-size:.65rem;font-weight:500;color:var(--text-primary);background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s}.logo-center-btn:hover{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.logo-center-btn svg{opacity:.7}.logo-bg-color .logo-bg-controls{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}.logo-color-input{width:28px;height:22px;border:1px solid var(--border-color);border-radius:4px;padding:0;cursor:pointer;background:none}.logo-color-input::-webkit-color-swatch-wrapper{padding:2px}.logo-color-input::-webkit-color-swatch{border-radius:2px;border:none}.color-preset-btn{width:18px;height:18px;border:2px solid;border-radius:3px;cursor:pointer;transition:transform .15s;padding:0}.color-preset-btn:hover{transform:scale(1.15)}.color-preset-btn.active{box-shadow:0 0 0 2px var(--primary-color)}.logo-radius-slider{flex:1;max-width:80px}.radius-value{min-width:32px;text-align:right;color:var(--text-secondary)}.logo-center-btn:hover svg{opacity:1}.logo-settings-v2{padding:.5rem 0}.logo-settings-v2 .settings-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.logo-settings-v2 .settings-header h3{font-size:.85rem;font-weight:600;color:var(--text-primary);margin:0}.logo-options-section{margin-top:12px;padding-top:12px;border-top:1px solid var(--border-color);display:flex;flex-direction:column;gap:8px}.logo-option-row{display:flex;align-items:center;gap:8px;font-size:11px}.logo-option-row>label{color:var(--text-secondary);min-width:70px;font-size:10px}.logo-option-row .logo-position-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px}.logo-option-row .position-btn{padding:4px 8px;font-size:9px;border:1px solid var(--border-color);background:#fff;border-radius:3px;cursor:pointer;min-width:28px}.logo-option-row .position-btn:hover{border-color:var(--primary-color)}.logo-option-row .position-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.logo-center-btn-compact{display:flex;align-items:center;justify-content:center;padding:4px 6px;border:1px solid var(--border-color);background:#fff;border-radius:3px;cursor:pointer;color:var(--text-secondary)}.logo-center-btn-compact:hover{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.logo-bg-toggle-row{display:flex;align-items:center;gap:6px}.logo-overlay{transition:opacity .2s}.background-music-settings{padding:.5rem 0;margin-top:.75rem;border-top:1px solid var(--border-color)}.background-music-settings h4{font-size:.75rem;font-weight:600;margin-bottom:.5rem;color:var(--text-primary)}.music-setting-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.35rem 0;font-size:.7rem}.music-track-select{flex:1;max-width:140px;padding:.3rem .4rem;font-size:.65rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:var(--surface)}.music-upload-row{display:flex;align-items:center;gap:.5rem;padding:.35rem 0}.music-upload-btn{display:flex;align-items:center;gap:.35rem;padding:.35rem .5rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.65rem;color:var(--text-secondary);cursor:pointer;transition:all .2s}.music-upload-btn:hover:not(:disabled){border-color:var(--primary-color);color:var(--primary-color)}.music-upload-btn:disabled{opacity:.5;cursor:not-allowed}.music-remove-custom-btn{padding:.3rem;background:transparent;border:none;color:var(--error-color);cursor:pointer;display:flex;align-items:center;justify-content:center}.music-volume-slider{flex:1;max-width:80px}.volume-value{min-width:32px;text-align:right;color:var(--text-secondary);font-size:.65rem}.music-playback-controls{display:flex;align-items:center;gap:.5rem;padding:.5rem 0;margin-top:.25rem}.music-control-btn{width:28px;height:28px;padding:0;display:flex;align-items:center;justify-content:center;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all .2s}.music-control-btn:hover{background:var(--surface);border-color:var(--primary-color);color:var(--primary-color)}.music-control-btn.playing{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.music-track-name{font-size:.65rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.music-error{display:flex;align-items:center;gap:.5rem;padding:.5rem;margin-top:.5rem;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:4px;font-size:.65rem;color:#ef4444}.music-error svg{flex-shrink:0}.music-info-note{display:flex;flex-direction:column;gap:.15rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--border-color)}.music-info-note small{font-size:.6rem;color:var(--text-secondary);opacity:.8}.canvas-header{background:var(--surface);border-bottom:1px solid var(--border-color);padding:.5rem 1rem;display:flex;align-items:center;justify-content:center}.canvas-animation-name{display:flex;align-items:center;gap:.5rem;font-size:.85rem;font-weight:600;color:var(--text-primary);background:#4f46e51a;padding:.4rem .75rem;border-radius:var(--radius-md);border:1px solid rgba(79,70,229,.2)}.canvas-animation-name svg{flex-shrink:0;color:var(--primary-color)}.canvas-project-name{cursor:pointer;padding:.1rem .3rem;border-radius:var(--radius-sm);transition:background .15s ease;max-width:400px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.canvas-project-name:hover{background:#4f46e526}.canvas-project-name-input{font-size:.85rem;font-weight:600;color:var(--text-primary);background:#fff;border:1px solid var(--primary-color);border-radius:var(--radius-sm);padding:.1rem .4rem;outline:none;min-width:200px;max-width:400px}.canvas-project-name-input:focus{box-shadow:0 0 0 2px #4f46e533}.project-uuid-badge{display:inline-flex;align-items:center;padding:.15rem .4rem;margin-left:.4rem;background:#4f46e51a;border:1px solid rgba(79,70,229,.25);border-radius:var(--radius-sm);font-size:.65rem;font-weight:600;font-family:SF Mono,Monaco,Consolas,monospace;color:var(--primary-color);letter-spacing:.03em;cursor:help;transition:all .15s ease}.project-uuid-badge:hover{background:#4f46e526;border-color:#4f46e566}.save-project-btn{display:flex;align-items:center;justify-content:center;padding:6px 10px;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;color:var(--text-secondary);transition:all .15s ease;margin-left:8px}.save-project-btn:hover:not(:disabled){background:var(--accent);border-color:var(--accent);color:#fff}.save-project-btn:disabled{opacity:.4;cursor:not-allowed}.save-project-btn svg{flex-shrink:0}.canvas-wrapper{flex:1;display:flex;align-items:center;justify-content:center;padding:.5rem;background:var(--surface-secondary);min-height:0;overflow:hidden;position:relative}.canvas-wrapper:has(.canvas-toolbar){flex-direction:column;align-items:center;justify-content:flex-start;padding:0;gap:0}.canvas-wrapper:has(.browser-canvas){align-items:flex-start;padding-top:0}.canvas-wrapper:has(.browser-window){flex-direction:column;align-items:center;justify-content:flex-start;padding:0;gap:0}.canvas-wrapper>.browser-window{width:100%;height:100%;border-radius:0;border:none}.browser-tab-container{flex:1;display:flex;flex-direction:column;width:100%;min-width:0;min-height:0;position:relative;overflow:hidden}.browser-window-content-wrapper{aspect-ratio:var(--canvas-aspect-ratio, 16 / 9);width:100%;max-width:95%;max-height:calc(100% - 16px);height:auto;margin:8px auto;min-width:0;min-height:0;position:relative;overflow:hidden;border:2px solid var(--border-color);border-radius:8px;background:var(--surface, #ffffff)}.browser-tab-avatar-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:200;display:flex;flex-direction:column;pointer-events:none}.browser-tab-avatar-toolbar-spacer{height:48px;flex-shrink:0}.browser-tab-avatar-content-area{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.browser-tab-avatar-browser-toolbar-spacer{height:48px;flex-shrink:0}.browser-tab-avatar-content-inner{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;background:var(--surface-secondary, #f3f4f6);overflow:hidden}.browser-tab-avatar-inner{position:relative;aspect-ratio:var(--canvas-aspect-ratio, 16 / 9);max-width:95%;max-height:calc(100% - 16px);width:100%;margin:8px auto}.doodle-canvas-container{border:2px solid var(--border-color);aspect-ratio:var(--canvas-aspect-ratio, 16 / 9);flex:1;max-width:95%;max-height:calc(100% - 16px);margin:8px auto;min-width:0;min-height:0;position:relative;box-shadow:0 4px 20px #00000026}.doodle-canvas-container:before{content:"";position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;border:2px dashed rgba(239,68,68,.5);border-radius:10px;pointer-events:none;z-index:1000;opacity:0;transition:opacity .2s ease}.doodle-canvas-container:hover:before,.doodle-canvas-container.show-boundary:before{opacity:1}.ai-settings-content{padding:.5rem;display:flex!important;flex-direction:column!important;flex:1!important;overflow-y:auto!important;overflow-x:hidden!important}.ai-settings{width:100%!important;display:block!important;visibility:visible!important}.ai-settings h3{font-size:.875rem;font-weight:600;margin-bottom:.75rem;color:var(--text-primary)}.warning-banner,.info-banner{display:flex;align-items:flex-start;gap:.5rem;padding:.5rem;border-radius:var(--radius-md);margin-bottom:.75rem;font-size:.7rem}.warning-banner{background:#fef3c7;border:1px solid #fcd34d;color:#92400e}.info-banner{background:#dbeafe;border:1px solid #93c5fd;color:#1e40af}.warning-banner svg,.info-banner svg{flex-shrink:0;margin-top:1px}.env-hint{display:flex;align-items:center;gap:.25rem;color:var(--success-color);font-size:.7rem}.setting-group{margin-bottom:.75rem;display:block!important;visibility:visible!important}.setting-group label{display:block;font-size:.75rem;font-weight:500;color:var(--text-primary);margin-bottom:.25rem}.setting-group select,.setting-group input[type=password],.setting-group input[type=text]{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.8rem;transition:border-color .2s,box-shadow .2s}.setting-group select:focus,.setting-group input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #4f46e51a}.setting-group input[readonly]{background:var(--background);cursor:not-allowed}.setting-group .hint{display:block;font-size:.65rem;color:var(--text-secondary);margin-top:.25rem}.setting-group .hint a{color:var(--primary-color);text-decoration:none}.model-warning{display:flex;align-items:flex-start;gap:.35rem;margin-top:.35rem;padding:.35rem .5rem;background:#ffc10726;border:1px solid rgba(255,193,7,.3);border-radius:var(--radius-sm);font-size:.65rem;color:#b88a00;line-height:1.3}.model-warning svg{flex-shrink:0;margin-top:1px}.test-button{padding:.375rem .75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.75rem;cursor:pointer;transition:all .2s}.test-button:hover:not(:disabled){background:var(--background)}.test-button:disabled{opacity:.5;cursor:not-allowed}.status-message{display:flex;align-items:center;gap:.5rem;padding:.375rem .5rem;border-radius:var(--radius-md);font-size:.7rem;margin-top:.5rem}.status-message.success{background:#d1fae5;color:#065f46}.status-message.error{background:#fee2e2;color:#991b1b}.config-status{display:flex;align-items:center;gap:.5rem;padding:.5rem;border-radius:var(--radius-md);font-size:.75rem;font-weight:500}.config-status.configured{background:#d1fae5;color:#065f46}.config-status.not-configured{background:#fef3c7;color:#92400e}.prompt-input h3{font-size:.875rem;font-weight:600;margin-bottom:.75rem}.prompt-input form{display:flex;flex-direction:column;gap:.5rem}.prompt-input textarea{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.8rem;resize:vertical;min-height:80px;max-height:150px;font-family:inherit}.prompt-input textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #4f46e51a}.generation-summary{background:linear-gradient(135deg,#4f46e50a,#8b5cf60a);border:1px solid rgba(79,70,229,.15);border-radius:8px;padding:10px 12px;margin-bottom:10px}.generation-summary .summary-header{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:var(--primary-color);margin-bottom:8px;text-transform:uppercase;letter-spacing:.03em}.generation-summary .summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px}.generation-summary .summary-row{display:flex;justify-content:space-between;align-items:center;padding:2px 0}.generation-summary .summary-label{font-size:11px;color:var(--text-secondary)}.generation-summary .summary-value{font-size:11px;font-weight:500;color:var(--text-primary)}.generation-summary .summary-value.enabled{color:var(--success-color, #10b981)}.generation-summary .summary-value.disabled{color:var(--text-secondary)}.generation-summary .summary-value.uuid{font-family:SF Mono,Consolas,monospace;font-size:10px;background:#4f46e51a;padding:2px 6px;border-radius:4px;color:var(--primary-color)}.generation-summary .summary-row.highlight{background:#4f46e514;margin:0 -6px;padding:4px 6px;border-radius:4px}.generation-summary .summary-row.highlight .summary-value{font-weight:600;color:var(--primary-color)}@media (prefers-color-scheme: dark){.generation-summary{background:linear-gradient(135deg,#4f46e514,#8b5cf614);border-color:#4f46e540}.generation-summary .summary-value.uuid{background:#4f46e533}.generation-summary .summary-row.highlight{background:#4f46e526}}.generate-button{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-md);font-size:.8rem;font-weight:600;cursor:pointer;transition:background .2s}.generate-button:hover:not(:disabled){background:var(--primary-hover)}.generate-button:disabled{opacity:.5;cursor:not-allowed}.spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.example-prompts{margin-top:.5rem}.example-prompts .label{display:block;font-size:.65rem;color:var(--text-secondary);margin-bottom:.375rem}.example-prompts .examples{display:flex;flex-wrap:wrap;gap:.375rem}.example-chip{padding:.25rem .5rem;background:var(--background);border:1px solid var(--border-color);border-radius:999px;font-size:.65rem;cursor:pointer;transition:all .2s}.example-chip:hover:not(:disabled){background:var(--surface);border-color:var(--primary-color);color:var(--primary-color)}.ai-settings-summary{margin:.75rem 0;padding:.625rem;background:linear-gradient(135deg,#4f46e50d,#9333ea0d);border-radius:var(--radius-md);border:1px solid var(--border-color)}.ai-settings-summary .summary-header{display:flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem}.ai-settings-summary .summary-header svg{color:var(--primary-color)}.ai-settings-summary .ai-settings-link{margin-left:auto;background:none;border:none;font-size:.7rem;color:var(--primary-color);cursor:pointer;padding:.25rem .5rem;border-radius:var(--radius-sm);transition:background .15s}.ai-settings-summary .ai-settings-link:hover{background:#4f46e51a;text-decoration:underline}.ai-settings-summary .summary-items{display:flex;flex-wrap:wrap;gap:.75rem;font-size:.7rem;color:var(--text-secondary)}.ai-settings-summary .summary-item{display:flex;align-items:center;gap:.25rem}.ai-settings-summary .summary-item strong{color:var(--text-primary);font-weight:500}.diagram-mode-section{margin:.5rem 0;padding:.5rem;background:var(--surface-secondary);border-radius:var(--radius-md);border:1px solid var(--border-color)}.diagram-mode-header{display:flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem}.diagram-mode-header svg{color:var(--primary-color)}.diagram-mode-options{display:flex;flex-direction:column;gap:.25rem}.diagram-option{display:flex;flex-direction:row;align-items:center;gap:.5rem;padding:.5rem .75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s}.diagram-option:hover{border-color:var(--primary-color)}.diagram-option.selected{border-color:var(--primary-color);background:#4f46e50d}.diagram-option input[type=radio]{display:none}.diagram-option .option-label{font-size:.7rem;font-weight:600;color:var(--text-primary)}.diagram-option .option-desc{font-size:.6rem;color:var(--text-secondary);text-align:center}.diagram-option.selected .option-label{color:var(--primary-color)}.mermaid-input-section{margin-top:.5rem}.mermaid-input-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.25rem}.mermaid-input-header label{font-size:.7rem;font-weight:500;color:var(--text-secondary)}.mermaid-example-btn{padding:.2rem .5rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.6rem;cursor:pointer;transition:background .2s}.mermaid-example-btn:hover:not(:disabled){background:var(--primary-hover)}.mermaid-code-input{width:100%;padding:.5rem;background:#1e1e1e;color:#d4d4d4;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.7rem;font-family:Consolas,Monaco,Courier New,monospace;resize:vertical;min-height:100px}.mermaid-code-input:focus{outline:none;border-color:var(--primary-color)}.mermaid-code-input.has-error{border-color:var(--error-color)}.mermaid-error{display:flex;align-items:flex-start;gap:.25rem;margin-top:.25rem;padding:.25rem .5rem;background:#ef44441a;border-radius:var(--radius-sm);color:var(--error-color);font-size:.65rem}.mermaid-error svg{flex-shrink:0;margin-top:1px}.mermaid-help{margin-top:.25rem}.mermaid-help small{display:block;font-size:.6rem;color:var(--text-secondary)}.mermaid-help a{color:var(--primary-color);text-decoration:none;margin-left:.25rem}.mermaid-help a:hover{text-decoration:underline}.diagram-animation-toggle{display:flex;align-items:center;gap:.5rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--border-color)}.diagram-animation-toggle .toggle-label{position:relative;font-size:.7rem;color:var(--text-secondary)}.playback-controls{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--surface);border-top:1px solid var(--border-color);flex-shrink:0;min-height:52px}.control-group{display:flex;align-items:center;gap:.5rem;position:relative}.control-button{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:none;border-radius:50%;cursor:pointer;transition:all .2s}.control-button.play{background:var(--primary-color);color:#fff}.control-button.play:hover:not(:disabled){background:var(--primary-hover);transform:scale(1.05)}.control-button.pause{background:var(--warning-color);color:#fff}.control-button.pause:hover{background:#d97706}.control-button.reset{background:var(--background);color:var(--text-secondary)}.control-button.reset:hover:not(:disabled){background:var(--border-color)}.control-button:disabled{opacity:.5;cursor:not-allowed}.control-button.generating{background:linear-gradient(135deg,#f59e0b,#d97706);opacity:1;animation:generating-pulse 1.5s ease-in-out infinite}.control-button.generating .generating-spinner{display:flex;align-items:center;justify-content:center}.control-button.generating .spinner-icon{animation:generating-spin 2s linear infinite}@keyframes generating-pulse{0%,to{box-shadow:0 0 #f59e0b66;transform:scale(1)}50%{box-shadow:0 0 0 8px #f59e0b00;transform:scale(1.05)}}@keyframes generating-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.playback-controls.compact{padding:0;background:transparent;border:none;min-height:auto}.playback-controls.compact .control-group{gap:6px}.playback-controls.compact .control-button{width:32px;height:32px}.playback-controls.compact .control-button.play{background:var(--primary-color)}.control-divider{width:1px;height:24px;background:var(--border-color);margin:0 4px}.control-button.record{background:var(--background);color:#dc2626}.control-button.record:hover:not(:disabled){background:#fef2f2;color:#b91c1c}.control-button.record:disabled{color:var(--text-tertiary)}.control-button.stop-record{background:#dc2626;color:#fff}.control-button.stop-record.recording{animation:recording-pulse 1.5s ease-in-out infinite}@keyframes recording-pulse{0%,to{box-shadow:0 0 #dc262666}50%{box-shadow:0 0 0 6px #dc262600}}.recording-time{display:flex;align-items:center;gap:6px;padding:4px 8px;background:#dc26261a;border-radius:4px;font-size:12px;font-family:SF Mono,Menlo,monospace;color:#dc2626}.recording-time .rec-indicator{color:#dc2626;animation:rec-blink 1s ease-in-out infinite}@keyframes rec-blink{0%,to{opacity:1}50%{opacity:.3}}.recording-time .time-display{font-weight:500}.recording-time.tab-hidden{background:#f59e0b1a;color:#d97706}.recording-time .tab-warning{color:#f59e0b;font-size:14px}.countdown-badge{position:absolute;display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#dc2626f2;color:#fff;font-size:18px;font-weight:700;border-radius:50%;animation:countdown-pop .3s ease-out;z-index:100;top:50%;right:0;transform:translateY(-50%);box-shadow:0 2px 8px #dc262666}@keyframes countdown-pop{0%{transform:translateY(-50%) scale(.5);opacity:0}50%{transform:translateY(-50%) scale(1.2)}to{transform:translateY(-50%) scale(1);opacity:1}}.board-style-toggle{display:flex;gap:.375rem}.style-button{display:flex;align-items:center;gap:.375rem;padding:.375rem .5rem;background:var(--background);border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;font-size:.7rem;transition:all .2s}.style-button.active{border-color:var(--primary-color);background:#4f46e51a}.style-preview{width:16px;height:16px;border-radius:var(--radius-sm);border:1px solid var(--border-color)}.style-preview.white{background:#fff}.style-preview.chalkboard{background:#1a4a1a}.edit-mode-toggle{display:flex;gap:.375rem;margin-left:.5rem;padding-left:.5rem;border-left:1px solid var(--border-color)}.edit-button{display:flex;align-items:center;gap:.25rem;padding:.375rem .5rem;background:var(--background);border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;font-size:.7rem;color:var(--text-secondary);transition:all .2s}.edit-button:hover:not(:disabled){background:var(--surface);color:var(--text-primary)}.edit-button.active{border-color:var(--primary-color);background:#4f46e51a;color:var(--primary-color)}.edit-button:disabled{opacity:.4;cursor:not-allowed}.edit-button svg{flex-shrink:0}.edit-button.logo.active{border-color:#10b981;background:#10b9811a;color:#10b981}.avatar-render-status{display:flex;align-items:center;gap:.75rem;margin-left:.5rem;padding-left:.75rem;border-left:1px solid var(--border-color)}.control-button.render-avatar{display:flex;align-items:center;gap:.375rem;width:auto;height:auto;padding:.5rem .75rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;font-size:.75rem;font-weight:500;border-radius:var(--radius-md)}.control-button.render-avatar:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857);transform:translateY(-1px);box-shadow:0 2px 8px #10b9814d}.control-button.render-avatar:disabled{background:var(--background);color:var(--text-secondary);cursor:not-allowed}.avatar-status-indicator{display:flex;align-items:center;gap:.375rem}.avatar-status-indicator .spinner-small{width:14px;height:14px;border:2px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin .8s linear infinite}.avatar-status-indicator .status-icon{flex-shrink:0}.avatar-status-indicator .status-icon.ready{color:#10b981}.avatar-status-indicator .status-icon.warning{color:#f59e0b}.avatar-status-indicator .status-icon.error{color:#ef4444}.avatar-status-indicator .status-text{font-size:.7rem;white-space:nowrap}.avatar-status-indicator .status-text.rendering{color:var(--primary-color)}.avatar-status-indicator .rendering-hint{opacity:.6;font-size:.65rem}.avatar-status-indicator .status-text.ready{color:#10b981}.avatar-status-indicator .status-text.warning{color:#f59e0b}.avatar-status-indicator .status-text.error{color:#ef4444}.edit-button.logo:hover:not(:disabled){color:#10b981}.edit-button.background.active{border-color:#f59e0b;background:#f59e0b1a;color:#f59e0b}.edit-button.background:hover:not(:disabled){color:#f59e0b}.progress-bar{background:var(--surface);border-top:1px solid var(--border-color);padding:.5rem .75rem;flex-shrink:0;min-height:48px;margin-bottom:0}.progress-bar.empty{text-align:center;color:var(--text-secondary);font-size:.75rem}.progress-track{display:flex;height:28px;background:var(--background);border-radius:var(--radius-md);overflow:hidden}.scene-segment{position:relative;flex:1;border-right:1px solid var(--border-color);cursor:pointer;transition:background .2s}.scene-segment:last-child{border-right:none}.scene-segment:hover{background:#4f46e50d}.scene-segment.current{background:#4f46e51a}.scene-fill{position:absolute;top:0;left:0;height:100%;background:var(--primary-color);transition:width .1s linear}.scene-segment.completed .scene-fill{width:100%!important;background:var(--success-color)}.scene-segment .scene-number{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.65rem;font-weight:600;color:var(--text-secondary);z-index:1}.scene-header .scene-number{position:static;transform:none;font-size:.75rem;font-weight:600;color:var(--text-primary)}.scene-segment.current .scene-number{color:var(--primary-color)}.scene-segment.intro-outro{background:#22c55e0d;border-right:2px solid rgba(34,197,94,.3)}.scene-segment.intro-outro:hover{background:#22c55e1a}.scene-segment.intro-outro.current{background:#22c55e26}.scene-segment.intro-outro .scene-number{color:var(--success-color);font-size:.55rem;font-weight:700}.scene-segment.intro-outro.current .scene-number{color:var(--success-color)}.progress-info{margin-top:.5rem;font-size:.75rem;color:var(--text-secondary);display:flex;flex-direction:column;gap:.25rem}.progress-info .current-scene{font-weight:600;font-size:.7rem}.progress-info .scene-text{font-size:.85rem;color:var(--text-primary);line-height:1.4;max-height:3.5em;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.subtitle-overlay{position:absolute;bottom:80px;left:50%;transform:translate(-50%);max-width:90%;z-index:100;pointer-events:none}.subtitle-overlay .subtitle-text{background:#000000bf;color:#fff;padding:12px 24px;border-radius:8px;font-size:1.1rem;line-height:1.5;text-align:center;max-width:800px;box-shadow:0 4px 12px #0000004d;animation:subtitle-fade-in .3s ease-out}.subtitle-overlay.chalkboard .subtitle-text{background:#ffffffe6;color:#1a1a1a}@keyframes subtitle-fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.canvas-settings.compact{display:flex;flex-direction:column;gap:.4rem}.canvas-settings h4{font-size:.65rem;font-weight:600;margin-bottom:.25rem;color:var(--text-secondary)}.settings-section{margin-bottom:.4rem}.settings-section:last-child{margin-bottom:0}.canvas-settings.compact .settings-section{margin-bottom:0}.settings-section select{width:100%;padding:.25rem .35rem;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.7rem}.settings-section-title{font-size:.75rem;font-weight:600;margin:0 0 .5rem;color:var(--text-color)}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.5rem}.settings-row label{font-size:.7rem;color:var(--text-muted)}.settings-hint{font-size:.65rem;color:var(--text-muted);margin:.25rem 0 0;opacity:.8}.color-picker-wrapper{display:flex;align-items:center;gap:.5rem}.color-picker-input{width:32px;height:24px;padding:0;border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;background:transparent}.color-picker-input::-webkit-color-swatch-wrapper{padding:2px}.color-picker-input::-webkit-color-swatch{border:none;border-radius:2px}.color-value{font-size:.65rem;font-family:monospace;color:var(--text-muted);text-transform:uppercase}.board-style-selector{display:flex;gap:.35rem}.style-option{flex:1;display:flex;flex-direction:row;align-items:center;gap:.25rem;padding:.35rem .5rem;background:var(--background);border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;font-size:.65rem;transition:all .2s}.style-option:hover{background:var(--surface)}.style-option.active{border-color:var(--primary-color);background:#4f46e50d}.style-preview{width:14px;height:14px;border-radius:var(--radius-sm);border:1px solid var(--border-color)}.speed-selector{display:flex;flex-wrap:wrap;gap:.2rem}.speed-option{padding:.2rem .4rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.6rem;cursor:pointer;transition:all .2s}.speed-option:hover{background:var(--surface)}.speed-option.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.inline-settings{display:flex;gap:.3rem}.inline-settings .settings-section{flex:1;min-width:0}.inline-settings select{font-size:.65rem;padding:.2rem .25rem}.toggle-switch{position:relative;display:inline-block;width:36px;height:20px;cursor:pointer}.toggle-switch.compact{width:32px;height:18px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#ccc;border-radius:20px;transition:.3s}.toggle-slider:before{position:absolute;content:"";height:14px;width:14px;left:3px;bottom:3px;background-color:#fff;border-radius:50%;transition:.3s}.toggle-switch.compact .toggle-slider:before{height:12px;width:12px;left:3px;bottom:3px}.toggle-switch input:checked+.toggle-slider{background-color:var(--primary-color)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(16px)}.toggle-switch.compact input:checked+.toggle-slider:before{transform:translate(14px)}.toggle-switch.mini{width:26px;height:14px;display:inline-flex;vertical-align:middle}.toggle-switch.mini .toggle-slider:before{height:10px;width:10px;left:2px;bottom:2px}.toggle-switch.mini input:checked+.toggle-slider:before{transform:translate(12px)}.color-swatch.transparent-swatch{position:relative}.color-swatch.transparent-swatch:after{content:"";position:absolute;top:50%;left:50%;width:12px;height:2px;background:#ef4444;transform:translate(-50%,-50%) rotate(-45deg);border-radius:1px}.hand-settings,.subtitle-settings{display:flex;align-items:center;gap:.5rem}.hand-settings select{flex:1;min-width:0}.subtitle-settings .setting-label{font-size:.7rem;color:var(--text-secondary)}.voice-settings h4{font-size:.75rem;font-weight:600;margin-bottom:.35rem}.voice-settings-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.35rem}.provider-selector{display:grid;grid-template-columns:repeat(2,1fr);gap:.35rem;margin-bottom:.35rem}.provider-btn{display:flex;align-items:center;justify-content:center;gap:.3rem;padding:.5rem .4rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.65rem;cursor:pointer;transition:all .2s;position:relative;min-height:2.2rem}.provider-btn:hover:not(.disabled){border-color:var(--primary-color);background:var(--primary-light, #f0f7ff)}.provider-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.provider-btn.disabled{opacity:.5;cursor:not-allowed}.provider-icon{display:flex;align-items:center}.provider-name{font-weight:500}.provider-unavailable{font-size:.45rem;opacity:.7}.provider-check{position:absolute;top:-3px;right:-3px;background:#10b981;color:#fff;border-radius:50%;width:12px;height:12px;display:flex;align-items:center;justify-content:center}.provider-badges{display:flex;gap:.25rem;margin-top:.5rem;justify-content:center}.voice-badge{display:flex;align-items:center;gap:.15rem;padding:.1rem .35rem;border-radius:999px;font-size:.5rem;font-weight:600;text-transform:uppercase;background:var(--border-color);color:var(--text-secondary);transition:all .2s}.voice-badge.active{background:var(--primary-color);color:#fff}.voice-badge.free{background:#d1fae5;color:#065f46}.voice-control{margin-bottom:.35rem}.voice-control label{display:block;font-size:.6rem;color:var(--text-secondary);margin-bottom:.15rem}.voice-select-wrapper{display:flex;gap:.25rem}.voice-select-wrapper select{flex:1;padding:.25rem .35rem;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.7rem}.preview-button{display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:all .2s}.preview-button:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.voice-control input[type=range]{width:100%;height:3px;-webkit-appearance:none;background:var(--border-color);border-radius:2px}.voice-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;background:var(--primary-color);border-radius:50%;cursor:pointer}.voice-control .hint{font-size:.55rem;margin-top:.1rem}.range-labels{display:flex;justify-content:space-between;font-size:.55rem;color:var(--text-secondary)}.voice-unavailable{background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:6px;padding:.5rem;margin:.35rem 0}.voice-unavailable p{margin:0;font-size:.65rem;line-height:1.4}.voice-unavailable .error-message{color:#ef4444;font-weight:500}.voice-unavailable .hint{color:var(--text-secondary);margin-top:.25rem;font-size:.55rem}.export-controls h4{font-size:.75rem;font-weight:600;margin-bottom:.35rem}.export-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.35rem}.export-badge{display:flex;align-items:center;gap:.2rem;padding:.1rem .3rem;border-radius:999px;font-size:.5rem;font-weight:600;text-transform:uppercase;background:#e0e7ff;color:#3730a3}.export-audio-options{padding:.5rem 0;border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color);margin-bottom:.5rem}.export-option-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.25rem 0;font-size:.7rem}.export-audio-select{padding:.25rem .4rem;font-size:.65rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:var(--surface);max-width:120px}.export-audio-select:disabled{opacity:.5;cursor:not-allowed}.export-status-info{display:flex;align-items:center;gap:.5rem;padding:.5rem;margin-bottom:.5rem;background:#eff6ff;border:1px solid #bfdbfe;border-radius:var(--radius-sm);font-size:.7rem;color:#1e40af}.export-status-info svg{flex-shrink:0;color:#3b82f6}.export-screen-capture-info{display:flex;align-items:flex-start;gap:.5rem;padding:.5rem;margin-bottom:.5rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #f59e0b;border-radius:var(--radius-sm);font-size:.65rem;color:#92400e;line-height:1.4}.export-screen-capture-info svg{flex-shrink:0;color:#d97706;margin-top:1px}.export-button{display:flex;align-items:center;justify-content:center;gap:.3rem;padding:.4rem .6rem;border:none;border-radius:var(--radius-md);font-size:.7rem;font-weight:600;cursor:pointer;width:100%;transition:all .2s}.export-button.start{background:var(--surface);border:1px solid var(--border-color);color:var(--text-primary)}.export-button.start:hover:not(:disabled){background:var(--background);border-color:var(--error-color);color:var(--error-color)}.export-button.start:disabled{opacity:.5;cursor:not-allowed}.export-button.recording{background:var(--error-color);color:#fff;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.8}}.recording-indicator{width:6px;height:6px;background:#fff;border-radius:50%;animation:blink 1s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.export-hint{display:block;font-size:.55rem;color:var(--text-secondary);text-align:center;margin-top:.25rem}.export-badge.free-badge{background:#fef3c7;color:#92400e}.export-disabled-message{display:flex;flex-direction:column;align-items:center;text-align:center;padding:1rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border-radius:var(--radius-md);border:1px solid #fbbf24}.export-disabled-message .disabled-icon{color:#92400e;margin-bottom:.5rem;opacity:.7}.export-disabled-message h3{font-size:.9rem;font-weight:700;color:#92400e;margin:0 0 .25rem}.export-disabled-message p{font-size:.7rem;color:#78350f;margin:0 0 .5rem}.export-disabled-message .upgrade-hint{font-size:.65rem;font-weight:600;color:#92400e;margin-bottom:.35rem}.export-disabled-message .upgrade-features{list-style:none;padding:0;margin:0 0 .75rem;font-size:.6rem;color:#78350f}.export-disabled-message .upgrade-features li{display:flex;align-items:center;justify-content:center;gap:.25rem;padding:.15rem 0}.export-disabled-message .upgrade-features li:before{content:"✓";color:#059669;font-weight:700}.export-disabled-message .upgrade-button{display:inline-flex;align-items:center;gap:.35rem;padding:.5rem 1rem;background:linear-gradient(135deg,#059669,#047857);color:#fff;font-size:.75rem;font-weight:600;text-decoration:none;border-radius:var(--radius-md);transition:all .2s;box-shadow:0 2px 4px #0596694d}.export-disabled-message .upgrade-button:hover{background:linear-gradient(135deg,#047857,#065f46);transform:translateY(-1px);box-shadow:0 4px 8px #05966966}.export-action-section{padding:0}.export-controls-inline{background:var(--surface);border-radius:var(--radius-md);padding:1rem}.export-section-header h4{font-size:.9rem;font-weight:600;margin:0 0 1rem;color:var(--text-primary)}.export-options-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--border-color)}.export-option-field{display:flex;flex-direction:column;gap:.35rem}.export-option-field label{font-size:.7rem;font-weight:500;color:var(--text-secondary)}.export-option-field select{padding:.4rem .5rem;font-size:.75rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:var(--background);color:var(--text-primary)}.export-option-field select:disabled{opacity:.5;cursor:not-allowed}.export-option-field.toggle-field{flex-direction:row;align-items:center;justify-content:space-between}.export-actions{display:flex;flex-direction:column;gap:.75rem;margin-bottom:.75rem}.popup-blocked-warning{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#fef3c7;border:1px solid #f59e0b;border-radius:var(--radius-sm);font-size:.7rem;color:#92400e}.export-progress-bar{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:var(--background);border-radius:var(--radius-sm);font-size:.75rem}.export-status-badge{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-radius:var(--radius-sm);font-size:.75rem;font-weight:500}.export-status-badge.recording{background:#fee2e2;color:#dc2626}.rec-dot-pulse{width:8px;height:8px;background:#dc2626;border-radius:50%;animation:pulse-dot 1.5s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.export-error-message{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#fee2e2;border:1px solid #fca5a5;border-radius:var(--radius-sm);font-size:.7rem;color:#b91c1c}.export-button-group{display:flex;gap:.5rem}.export-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.6rem 1rem;border:none;border-radius:var(--radius-md);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s;flex:1}.export-btn svg{flex-shrink:0}.export-btn .rec-dot{width:6px;height:6px;background:#dc2626;border-radius:50%;animation:blink 1s ease-in-out infinite}.export-btn.fullscreen{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff}.export-btn.fullscreen:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #4f46e54d}.export-btn.standard{background:var(--surface);border:1px solid var(--border-color);color:var(--text-primary)}.export-btn.standard:hover:not(:disabled){border-color:#dc2626;color:#dc2626}.export-btn.stop{background:#dc2626;color:#fff;animation:pulse 2s ease-in-out infinite}.export-btn.exit{background:var(--surface);border:1px solid var(--border-color);color:var(--text-primary)}.export-btn:disabled{opacity:.5;cursor:not-allowed}.export-hint-text{text-align:center;font-size:.7rem;color:var(--text-secondary)}.activity-log{display:flex;flex-direction:column;height:100%;min-height:0;border-radius:6px;overflow:hidden;background:#012456;border:1px solid #1e3a5f}.terminal-titlebar{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;background:linear-gradient(180deg,#2d2d30,#1e1e1e);border-bottom:1px solid #3c3c3c;flex-shrink:0}.terminal-controls{display:flex;gap:6px}.terminal-control{width:10px;height:10px;border-radius:50%;cursor:default}.terminal-control.close{background:#ff5f57}.terminal-control.minimize{background:#febc2e}.terminal-control.maximize{background:#28c840}.terminal-title{font-family:Segoe UI,system-ui,sans-serif;font-size:11px;color:#ccc;font-weight:400}.terminal-actions{display:flex;gap:4px}.terminal-actions button{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border:none;background:transparent;color:gray;cursor:pointer;border-radius:3px;transition:all .15s ease}.terminal-actions button:hover:not(:disabled){background:#ffffff1a;color:#ccc}.terminal-actions button:disabled{opacity:.3;cursor:not-allowed}.activity-log-header{display:none}.activity-log-actions{display:flex;gap:.25rem}.activity-log-actions button{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;color:var(--text-secondary);transition:all .2s}.activity-log-actions button:hover:not(:disabled){background:var(--surface);color:var(--primary-color)}.activity-log-actions button:disabled{opacity:.3;cursor:not-allowed}.activity-log-generating{display:flex;align-items:center;gap:.4rem;padding:.2rem .5rem;background:var(--primary-color);color:#fff;border-radius:var(--radius-sm);font-size:.65rem;font-weight:500;margin-left:auto;margin-right:.5rem;max-width:200px;overflow:hidden}.activity-log-generating span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.generating-spinner{flex-shrink:0;color:currentColor}.activity-log-content{flex:1;overflow-y:auto;background:#012456;border:none;border-radius:var(--radius-md);padding:.5rem;min-height:0;scrollbar-width:thin;scrollbar-color:#444466 #1a1a2e}.activity-log-content::-webkit-scrollbar{width:6px}.activity-log-content::-webkit-scrollbar-track{background:#012456}.activity-log-content::-webkit-scrollbar-thumb{background:#2b4a7c;border-radius:3px}.activity-log-content::-webkit-scrollbar-thumb:hover{background:#3d6298}.activity-log-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#668;gap:.25rem}.activity-log-empty svg{opacity:.3}.activity-log-empty span{font-size:.7rem;font-family:Consolas,Monaco,Courier New,monospace}.log-entry{display:flex;align-items:flex-start;gap:.375rem;padding:.2rem .5rem;border-radius:0;font-size:.72rem;margin-bottom:.1rem;font-family:Cascadia Code,Consolas,Monaco,Courier New,monospace;background:transparent;border-left:none;color:#ccc}.log-prompt{color:#ff0;font-weight:600;flex-shrink:0}.log-entry:last-child{margin-bottom:0}.log-icon{flex-shrink:0;margin-top:1px;width:14px;height:14px}.log-time{flex-shrink:0;color:#668;font-size:.62rem;font-family:Consolas,Monaco,Courier New,monospace}.log-message{flex:1;word-break:break-word}.log-info{background:transparent;color:#0ff}.log-info .log-icon{color:#0ff}.log-info .log-time{color:gray}.log-info .log-prompt{color:#ff0}.log-success{background:transparent;color:#0f0}.log-success .log-icon{color:#0f0}.log-success .log-time{color:gray}.log-success .log-prompt{color:#ff0}.log-warning{background:transparent;color:#ff0}.log-warning .log-icon{color:#ff0}.log-warning .log-time{color:gray}.log-warning .log-prompt{color:#ff0}.log-error{background:transparent;color:red}.log-error .log-icon{color:red}.log-error .log-time{color:gray}.log-error .log-prompt{color:#ff0}.script-preview-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:transparent;display:flex;justify-content:flex-end;align-items:stretch;z-index:100001;animation:fadeIn .15s ease;padding:0;pointer-events:none}@keyframes scriptSlideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.script-preview-panel{pointer-events:auto;background:var(--surface);border-radius:0;box-shadow:-5px 0 25px #00000026;border-left:1px solid var(--border-color);width:28.125%;min-width:400px;max-width:none;height:100vh;max-height:100vh;display:flex;flex-direction:column;overflow:hidden;animation:scriptSlideIn .3s cubic-bezier(.16,1,.3,1)}.script-preview-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-color);background:linear-gradient(135deg,#4682b4,#315c80);color:#fff}.script-preview-header h3{font-size:1rem;font-weight:600;margin:0;color:#fff}.script-preview-actions{display:flex;align-items:center;gap:8px}.script-preview-actions button{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#fff3;border:none;border-radius:6px;font-size:.75rem;font-weight:500;color:#fff;cursor:pointer;transition:all .15s ease}.script-preview-actions button:hover:not(:disabled){background:#ffffff4d}.script-preview-actions button:disabled{opacity:.5;cursor:not-allowed}.script-preview-actions .close-btn{padding:4px;background:#fff3;border-radius:6px}.script-preview-actions .close-btn:hover{background:#ffffff4d}.script-preview-content{flex:1;overflow-y:auto;padding:1rem}.script-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:var(--text-secondary);text-align:center}.script-empty svg{opacity:.3;margin-bottom:.5rem}.script-empty p{font-weight:500;margin-bottom:.25rem}.script-empty span{font-size:.8rem}.script-scenes{display:flex;flex-direction:column;gap:.75rem}.script-scene{padding:.75rem;background:var(--surface-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:all .2s}.script-scene:hover{border-color:var(--primary-color)}.script-scene.current{border-color:var(--primary-color);background:#4f46e50d}.scene-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.scene-number{font-size:.7rem;font-weight:600;color:var(--primary-color);background:#4f46e51a;padding:.125rem .5rem;border-radius:999px}.scene-duration{font-size:.65rem;color:var(--text-secondary)}.expand-btn{margin-left:auto;padding:.25rem;background:transparent;border:none;cursor:pointer;color:var(--text-secondary);transition:transform .2s}.scene-sentence{font-size:.85rem;color:var(--text-primary);margin-bottom:.375rem}.scene-actions-summary{font-size:.7rem;color:var(--text-secondary)}.scene-actions-detail{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--border-color)}.action-item{display:flex;gap:.5rem;font-size:.7rem;padding:.25rem 0}.action-type{font-weight:500;color:var(--primary-color)}.action-reveal{color:var(--text-secondary)}.script-edit-actions{display:flex;align-items:center;gap:12px;padding:12px 20px;background:var(--surface-secondary);border-bottom:1px solid var(--border-color)}.script-edit-actions .edit-hint{flex:1;font-size:.8rem;color:var(--text-secondary);font-style:italic}.script-edit-actions .cancel-edit-btn{padding:6px 12px;border:1px solid var(--border-color);background:var(--surface);color:var(--text-secondary);border-radius:4px;font-size:.8rem;cursor:pointer;transition:all .15s}.script-edit-actions .cancel-edit-btn:hover{background:var(--hover-bg);color:var(--text-primary)}.script-edit-actions .save-edit-btn{display:flex;align-items:center;gap:6px;padding:6px 14px;background:linear-gradient(135deg,#22c55e,#16a34a);border:none;color:#fff;border-radius:4px;font-size:.8rem;font-weight:500;cursor:pointer;transition:all .15s}.script-edit-actions .save-edit-btn:hover:not(:disabled){background:linear-gradient(135deg,#16a34a,#15803d);transform:translateY(-1px)}.script-edit-actions .save-edit-btn:disabled,.script-edit-actions .cancel-edit-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.script-find-replace-bar{padding:10px 16px;background:var(--surface-secondary, #f8fafc);border-bottom:1px solid var(--border-color);display:flex;flex-direction:column;gap:8px}.find-replace-row{display:flex;align-items:center;gap:8px}.find-input-group,.replace-input-group{flex:1;display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--surface, #fff);border:1px solid var(--border-color);border-radius:6px}.find-input-group:focus-within,.replace-input-group:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 2px #4f46e51a}.find-input-group svg,.replace-input-group svg{flex-shrink:0;color:var(--text-secondary)}.find-input,.replace-input{flex:1;border:none;background:transparent;font-size:.8rem;color:var(--text-primary);outline:none;min-width:0}.find-input::placeholder,.replace-input::placeholder{color:var(--text-tertiary)}.match-count{font-size:.7rem;color:var(--text-secondary);white-space:nowrap;padding:2px 6px;background:var(--surface-hover);border-radius:4px}.find-nav-buttons{display:flex;gap:2px}.find-nav-buttons button{padding:6px;border:none;background:var(--surface-hover);border-radius:4px;cursor:pointer;color:var(--text-secondary);transition:all .15s}.find-nav-buttons button:hover:not(:disabled){background:var(--border-color);color:var(--text-primary)}.find-nav-buttons button:disabled{opacity:.4;cursor:not-allowed}.replace-all-btn{padding:6px 12px;background:var(--primary-color);color:#fff;border:none;border-radius:6px;font-size:.75rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:all .15s}.replace-all-btn:hover:not(:disabled){background:var(--primary-hover)}.replace-all-btn:disabled{opacity:.4;cursor:not-allowed}.script-stats-bar{display:flex;align-items:center;gap:8px;padding:6px 16px;background:var(--surface-hover, #f1f5f9);border-bottom:1px solid var(--border-color);font-size:.7rem;color:var(--text-secondary)}.script-stats-bar .stat{color:var(--text-primary);font-weight:500}.script-stats-bar .stat-divider{color:var(--text-tertiary)}.search-highlight{background:#ffd50080;border-radius:2px;padding:0 1px}.script-preview-actions button.active{background:#ffffff59;box-shadow:inset 0 1px 3px #0000001a}.script-scene.editing{border-color:var(--primary-color);box-shadow:0 0 0 2px #4f46e533}.edit-scene-btn{padding:4px;border:none;background:transparent;color:var(--text-secondary);border-radius:4px;cursor:pointer;transition:all .15s;margin-right:auto}.edit-scene-btn:hover{background:var(--hover-bg);color:var(--primary-color)}.scene-sentence-edit{width:100%;padding:8px;border:1px solid var(--primary-color);border-radius:4px;background:var(--surface);color:var(--text-primary);font-size:.85rem;font-family:inherit;resize:vertical;margin-bottom:.375rem}.scene-sentence-edit:focus{outline:none;box-shadow:0 0 0 2px #4f46e533}.scene-sentence.modified{color:var(--warning-color, #f59e0b);font-style:italic}.scene-sentence.modified:before{content:"*";margin-right:4px}.scene-edit-container{display:flex;flex-direction:column;gap:6px}.phoneme-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;background:var(--surface-hover, #f3f4f6);border:1px solid var(--border, #e5e7eb);border-radius:4px;font-size:.75rem;color:var(--text-secondary);cursor:pointer;align-self:flex-start;transition:all .15s ease}.phoneme-btn:hover{background:var(--primary-color-light, #eef2ff);border-color:var(--primary-color, #4f46e5);color:var(--primary-color, #4f46e5)}.phoneme-btn svg{flex-shrink:0}.phoneme-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:100002;pointer-events:auto!important}.phoneme-dialog{background:var(--surface, #fff);border-radius:8px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;width:100%;max-width:420px;overflow:hidden;pointer-events:auto!important}.phoneme-dialog input,.phoneme-dialog button,.phoneme-dialog textarea{pointer-events:auto!important}.phoneme-dialog-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--surface-hover, #f9fafb);border-bottom:1px solid var(--border, #e5e7eb)}.phoneme-dialog-header h4{margin:0;font-size:.95rem;font-weight:600;color:var(--text-primary)}.phoneme-dialog-close{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:transparent;border:none;border-radius:4px;cursor:pointer;color:var(--text-secondary);transition:all .15s ease}.phoneme-dialog-close:hover{background:var(--surface, #fff);color:var(--text-primary)}.phoneme-dialog-body{padding:16px}.phoneme-dialog-hint{margin:0 0 12px;font-size:.8rem;color:var(--text-secondary)}.phoneme-input-group{margin-bottom:12px}.phoneme-input-group label{display:block;font-size:.8rem;font-weight:500;color:var(--text-primary);margin-bottom:4px}.phoneme-input-group input{width:100%;padding:8px 10px;border:1px solid var(--border, #e5e7eb);border-radius:4px;font-size:.9rem;background:var(--surface, #fff);color:var(--text-primary);transition:border-color .15s ease}.phoneme-input-group input:focus{outline:none;border-color:var(--primary-color, #4f46e5);box-shadow:0 0 0 2px #4f46e51a}.phoneme-ipa-hint{display:block;margin-top:4px;font-size:.72rem;color:var(--text-tertiary, #9ca3af)}.phoneme-preview{margin-top:12px;padding:8px;background:var(--surface-hover, #f9fafb);border-radius:4px;font-size:.8rem}.phoneme-preview-label{color:var(--text-secondary);margin-right:6px}.phoneme-preview code{font-family:Monaco,Consolas,monospace;font-size:.75rem;color:var(--primary-color, #4f46e5);word-break:break-all}.phoneme-dialog-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;background:var(--surface-hover, #f9fafb);border-top:1px solid var(--border, #e5e7eb)}.phoneme-cancel-btn,.phoneme-insert-btn{padding:8px 16px;border-radius:4px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .15s ease}.phoneme-cancel-btn{background:transparent;border:1px solid var(--border, #e5e7eb);color:var(--text-secondary)}.phoneme-cancel-btn:hover{background:var(--surface, #fff);border-color:var(--text-secondary)}.phoneme-insert-btn{background:var(--primary-color, #4f46e5);border:none;color:#fff}.phoneme-insert-btn:hover:not(:disabled){background:var(--primary-hover, #4338ca)}.phoneme-insert-btn:disabled{opacity:.5;cursor:not-allowed}.phoneme-preview-btn{display:flex;align-items:center;gap:6px;background:var(--surface-hover, #f1f5f9);border:1px solid var(--border, #e5e7eb);color:var(--text-primary)}.phoneme-preview-btn:hover:not(:disabled){background:var(--surface, #e2e8f0);border-color:var(--primary-color, #4f46e5)}.phoneme-preview-btn:disabled{opacity:.5;cursor:not-allowed}.recording-prep-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100003;animation:fadeIn .2s ease}.recording-prep-modal{background:var(--surface, #fff);border-radius:12px;box-shadow:0 20px 40px #0003;width:90%;max-width:400px;overflow:hidden;animation:scaleIn .2s ease}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.recording-prep-header{display:flex;align-items:center;gap:12px;padding:20px 24px;background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff}.recording-prep-header h3{margin:0;font-size:1.1rem;font-weight:600}.recording-prep-icon{animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.recording-prep-body{padding:24px;text-align:center}.recording-prep-message{margin:0 0 16px;font-size:.9rem;color:var(--text-primary)}.recording-prep-progress{height:8px;background:var(--surface-secondary, #f1f5f9);border-radius:4px;overflow:hidden;margin-bottom:12px}.recording-prep-progress-bar{height:100%;background:linear-gradient(90deg,#dc2626,#ef4444);border-radius:4px;transition:width .3s ease}.recording-prep-count{margin:0;font-size:.8rem;color:var(--text-secondary);font-weight:500}.recording-prep-footer{padding:16px 24px;background:var(--surface-secondary, #f8fafc);border-top:1px solid var(--border-color);display:flex;justify-content:center}.recording-prep-cancel{padding:10px 24px;background:transparent;border:1px solid var(--border-color);border-radius:6px;font-size:.85rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.recording-prep-cancel:hover{background:var(--surface, #fff);border-color:var(--text-secondary);color:var(--text-primary)}.recording-prep-voice-info{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px}.voice-provider-badge{padding:3px 8px;background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;font-size:.7rem;font-weight:600;text-transform:uppercase;border-radius:4px;letter-spacing:.5px}.voice-name{font-size:.9rem;font-weight:600;color:var(--text-primary)}.recording-prep-text-preview{margin:8px 0 16px;padding:10px 14px;background:var(--surface-secondary, #f8fafc);border-radius:6px;font-size:.8rem;font-style:italic;color:var(--text-secondary);line-height:1.5;max-height:60px;overflow:hidden;text-overflow:ellipsis}.recording-prep-stats{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.recording-prep-duration{font-size:.8rem;font-weight:600;color:#dc2626;font-variant-numeric:tabular-nums}.header-save-btn.saving{pointer-events:none;opacity:.8}.save-spinner{display:block;width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:currentColor;border-radius:50%;animation:spin .8s linear infinite}.loading-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.loading-content{background:var(--surface);padding:1.5rem 2rem;border-radius:var(--radius-lg);text-align:center;box-shadow:var(--shadow-lg)}.loading-spinner{color:var(--primary-color);margin-bottom:.75rem}.loading-message{font-size:.9rem;font-weight:600;color:var(--text-primary)}.loading-sub-message{font-size:.75rem;color:var(--text-secondary);margin-top:.25rem}.error-toast{position:fixed;bottom:1rem;right:1rem;display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:var(--error-color);color:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:1000;font-size:.85rem;animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.error-toast button{display:flex;align-items:center;justify-content:center;background:#fff3;border:none;border-radius:var(--radius-sm);padding:.25rem;cursor:pointer;transition:background .2s}.error-toast button:hover{background:#ffffff4d}.project-manager h4{font-size:.85rem;font-weight:600;color:var(--text-primary);margin-bottom:.75rem}.project-actions{display:flex;gap:.5rem}.project-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.35rem;padding:.5rem .75rem;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--surface);color:var(--text-primary);font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s}.project-btn:hover{background:var(--surface-hover);border-color:var(--primary-color)}.project-btn svg{flex-shrink:0}.save-btn:hover{color:var(--success-color);border-color:var(--success-color)}.load-btn:hover{color:var(--primary-color);border-color:var(--primary-color)}.drawing-settings h4{font-size:.75rem;font-weight:600;color:var(--text-primary);margin-bottom:.5rem}.drawing-settings.compact .setting-row{margin-bottom:.5rem}.drawing-settings.compact .setting-row:last-child{margin-bottom:0}.drawing-settings label{display:block;font-size:.65rem;color:var(--text-secondary);margin-bottom:.2rem}.drawing-settings input[type=range]{width:100%;height:3px;background:var(--border-color);border-radius:2px;-webkit-appearance:none;cursor:pointer}.drawing-settings input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:var(--primary-color);border-radius:50%;cursor:pointer}.color-picker{display:flex;gap:.25rem;flex-wrap:wrap}.color-swatch{width:22px;height:22px;border:2px solid transparent;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s}.color-swatch:hover{transform:scale(1.1)}.color-swatch.active{border-color:var(--primary-color);box-shadow:0 0 0 1px var(--surface),0 0 0 3px var(--primary-color)}.slider-row{display:flex;gap:.75rem;margin-bottom:.25rem}.slider-col{flex:1;min-width:0}.slider-col label{font-size:.6rem;color:var(--text-secondary);margin-bottom:.15rem;display:block}.slider-col input[type=range]{width:100%;height:3px;background:var(--border-color);border-radius:2px;-webkit-appearance:none;cursor:pointer}.slider-col input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;background:var(--primary-color);border-radius:50%;cursor:pointer}.slider-col .range-labels{font-size:.5rem;margin-top:.1rem}.range-labels{display:flex;justify-content:space-between;font-size:.55rem;color:var(--text-muted);margin-top:.15rem}@media (max-width: 1200px){.panel-left{width:280px}.panel-right{width:260px}}@media (max-width: 1024px){.app-main{flex-direction:column;overflow-y:auto}.panel-left,.panel-right{width:100%}.panel-center{min-height:400px}}.creation-history{display:flex;flex-direction:column;height:100%}.history-header{display:flex;align-items:center;justify-content:space-between;padding:0 0 12px;border-bottom:1px solid var(--border-color);margin-bottom:12px}.history-header h3{font-size:14px;font-weight:600;color:var(--text-primary);margin:0}.clear-history-btn{padding:6px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease}.clear-history-btn:hover{background:#ef44441a;color:var(--error-color)}.history-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--text-secondary);padding:32px 16px}.history-empty svg{margin-bottom:12px}.history-empty p{font-size:14px;font-weight:500;margin-bottom:4px}.history-empty small{font-size:12px;opacity:.7}.history-cards-container{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.history-card{background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:.6rem .75rem;transition:all .15s ease}.history-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-sm)}.history-card-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.5rem}.history-card .card-name{flex:1;font-size:.8rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.history-card .card-name.editable{cursor:pointer;padding:.15rem .3rem;margin:-.15rem -.3rem;border-radius:var(--radius-sm);transition:background .15s ease}.history-card .card-name.editable:hover{background:#4f46e51a}.history-card .card-name-input{flex:1;font-size:.8rem;font-weight:600;color:var(--text-primary);background:var(--surface);border:2px solid var(--primary-color);border-radius:var(--radius-sm);padding:.15rem .3rem;min-width:0;font-family:inherit}.history-card .card-date{font-size:.7rem;color:var(--text-secondary);white-space:nowrap;flex-shrink:0}.history-card-footer{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.history-card .card-meta{display:flex;align-items:center;gap:.75rem;flex:1;min-width:0}.history-card .meta-item{display:flex;align-items:center;gap:.3rem;font-size:.7rem;color:var(--text-secondary);white-space:nowrap}.history-card .meta-item svg{flex-shrink:0;opacity:.7}.history-card .card-actions{display:flex;gap:.25rem;flex-shrink:0}.history-action-btn{padding:.35rem;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease;display:flex;align-items:center;justify-content:center}.history-action-btn:hover{transform:scale(1.1)}.history-action-btn.load-btn:hover{background:#4f46e51a;color:var(--primary-color)}.history-action-btn.download-btn:hover{background:#0596691a;color:#059669}.history-action-btn.delete-btn:hover{background:#ef44441a;color:var(--error-color)}.history-footer{padding:12px 0 0;border-top:1px solid var(--border-color);margin-top:12px;text-align:center}.history-footer small{font-size:11px;color:var(--text-secondary)}.database-projects{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:12px;margin-bottom:16px;flex:1;min-height:0}.db-projects-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid var(--border-color);margin-bottom:12px}.db-projects-header h3{font-size:14px;font-weight:600;color:var(--text-primary);margin:0;display:flex;align-items:center;gap:6px}.db-projects-actions{display:flex;align-items:center;gap:8px}.user-badge{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--text-secondary);background:var(--surface-secondary);padding:4px 8px;border-radius:var(--radius-sm)}.refresh-btn{padding:6px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease}.refresh-btn:hover{background:var(--surface-secondary);color:var(--primary-color)}.refresh-btn:disabled{opacity:.5;cursor:not-allowed}.refresh-btn .spinning{animation:spin 1s linear infinite}.save-to-cloud-btn{display:flex;align-items:center;gap:4px;padding:5px 10px;border:none;background:var(--primary-color);color:#fff;font-size:11px;font-weight:500;cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease}.save-to-cloud-btn:hover:not(:disabled){background:var(--primary-hover)}.save-to-cloud-btn:disabled{opacity:.5;cursor:not-allowed;background:var(--text-secondary)}.save-to-cloud-btn svg{width:14px;height:14px}.db-projects-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 16px;color:var(--text-secondary)}.db-projects-empty p{margin:8px 0 4px;font-size:13px}.db-projects-empty .hint{font-size:11px;opacity:.7;margin:0}.db-projects-loading{display:flex;align-items:center;justify-content:center;gap:8px;padding:24px;color:var(--text-secondary);font-size:13px}.db-projects-loading .spinner{width:16px;height:16px;border:2px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin .8s linear infinite}.db-projects-error{display:flex;align-items:center;gap:8px;padding:12px;background:#ef44441a;border-radius:var(--radius-sm);color:var(--error-color);font-size:12px;margin-bottom:12px}.db-projects-error button{margin-left:auto;padding:4px 8px;border:none;background:var(--error-color);color:#fff;border-radius:var(--radius-sm);cursor:pointer;font-size:11px}.db-projects-search{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--surface-secondary);border-radius:var(--radius-sm);margin-bottom:8px}.db-projects-search-input{flex:1;border:none;background:transparent;font-size:12px;color:var(--text-primary);outline:none}.db-projects-search-input::placeholder{color:var(--text-tertiary)}.search-clear-btn{display:flex;align-items:center;justify-content:center;width:18px;height:18px;border:none;background:var(--surface-hover);border-radius:50%;cursor:pointer;color:var(--text-secondary);transition:all .15s ease}.search-clear-btn:hover{background:var(--surface-tertiary);color:var(--text-primary)}.project-row-number{font-size:10px;color:var(--text-tertiary);min-width:18px;text-align:center;flex-shrink:0;font-family:SF Mono,Monaco,Consolas,monospace}.db-projects-list{display:flex;flex-direction:column;gap:8px;flex:1;min-height:0;overflow-y:auto}.db-project-item{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;background:var(--surface-secondary);border-radius:var(--radius-sm);transition:all .15s ease}.db-project-item:hover{background:var(--surface-hover)}.db-project-item .project-info{display:flex;flex-direction:column;gap:4px;overflow:hidden;flex:1;min-width:0}.db-project-item .project-name-row{display:flex;align-items:center;gap:6px;min-width:0}.db-project-item .project-name{font-size:12px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}.db-project-item .project-uuid-badge{font-size:9px;font-family:SF Mono,Monaco,Consolas,monospace;color:var(--primary-color);background:#4f46e51a;padding:2px 5px;border-radius:3px;white-space:nowrap;flex-shrink:0;font-weight:600;letter-spacing:.5px}.db-project-item .project-meta-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.db-project-item .project-date{font-size:10px;color:var(--text-secondary);white-space:nowrap}.db-project-item .project-stats{display:flex;align-items:center;gap:10px}.db-project-item .stat-item{display:flex;align-items:center;gap:3px;font-size:10px;color:var(--text-tertiary)}.db-project-item .stat-item svg{opacity:.7}.db-project-item .project-actions{display:flex;gap:4px;flex-shrink:0}.db-project-item .project-actions button{padding:6px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease}.db-project-item .load-btn:hover{background:#4f46e51a;color:var(--primary-color)}.db-project-item .delete-btn:hover{background:#ef44441a;color:var(--error-color)}.icon-library{display:flex;flex-direction:column;height:100%;max-height:600px}.icon-library-header{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border-color);margin-bottom:12px}.icon-library-header h3{font-size:16px;font-weight:600;color:var(--text-primary)}.icon-library-header .close-btn{padding:4px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm)}.icon-library-header .close-btn:hover{background:var(--surface-secondary);color:var(--text-primary)}.image-library-tabs{display:flex;flex-wrap:nowrap;gap:4px;margin-bottom:10px;padding:4px;background:var(--surface-secondary);border-radius:8px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;background:linear-gradient(to right,var(--surface-secondary) 20px,transparent 40px),linear-gradient(to left,var(--surface-secondary) 20px,transparent 40px),linear-gradient(to right,rgba(0,0,0,.1) 0%,transparent 30px),linear-gradient(to left,rgba(0,0,0,.1) 0%,transparent 30px),var(--surface-secondary);background-position:left center,right center,left center,right center,center;background-repeat:no-repeat;background-size:40px 100%,40px 100%,30px 100%,30px 100%,100% 100%;background-attachment:local,local,scroll,scroll,scroll}.image-library-tabs::-webkit-scrollbar{display:none}.image-library-tabs .tab-btn{flex:0 0 auto;padding:6px 12px;border:1px solid transparent;background:transparent;color:var(--text-secondary);font-size:.75rem;font-weight:500;border-radius:6px;cursor:pointer;transition:all .15s ease;white-space:nowrap;position:relative}.image-library-tabs .tab-btn:hover:not(.active){color:var(--text-primary);background:#7c3aed14;border-color:#7c3aed33}.image-library-tabs .tab-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color);box-shadow:0 2px 4px #4f46e54d}.icon-library-filters{display:flex;gap:8px;margin-bottom:12px}.icon-search{flex:1;padding:8px 12px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:13px;background:var(--surface)}.icon-search:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #4f46e51a}.category-select{padding:8px 12px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:13px;background:var(--surface);cursor:pointer}.icon-library-controls select{max-width:80%;overflow:hidden;text-overflow:ellipsis}.icon-library-controls{z-index:10;position:relative}.icon-library-actions{display:flex;gap:8px;margin-bottom:12px}.add-icon-btn{display:flex;align-items:center;gap:4px;padding:6px 12px;border:1px dashed var(--border-color);background:transparent;border-radius:var(--radius-md);font-size:12px;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.add-icon-btn:hover{border-color:var(--primary-color);color:var(--primary-color);background:#4f46e50d}.add-icon-btn.ai-btn:hover{border-color:var(--success-color);color:var(--success-color);background:#10b9810d}.icon-grid{flex:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px;overflow-y:auto;padding:4px}.icon-preview{display:flex;flex-direction:column;align-items:center;padding:8px;border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all .15s ease;background:var(--surface);position:relative}.icon-preview:hover{background:var(--surface-secondary);border-color:var(--border-color)}.icon-preview.selected{border-color:var(--primary-color);background:#4f46e50d}.icon-preview canvas{border-radius:var(--radius-sm);background:#fff}.icon-preview .icon-name{font-size:10px;color:var(--text-secondary);margin-top:4px;text-align:center;max-width:80%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.icon-preview .icon-actions{position:absolute;top:2px;right:2px;display:flex;gap:2px;opacity:0;transition:opacity .15s ease}.icon-preview:hover .icon-actions{opacity:1}.icon-preview .download-icon-btn,.icon-preview .delete-icon-btn{padding:2px;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center}.icon-preview .download-icon-btn{background:#4f46e51a;color:var(--primary-color)}.icon-preview .download-icon-btn:hover{background:var(--primary-color);color:#fff}.icon-preview .delete-icon-btn{background:#ef44441a;color:var(--error-color)}.icon-preview .delete-icon-btn:hover{background:var(--error-color);color:#fff}.no-icons{grid-column:1 / -1;text-align:center;padding:24px;color:var(--text-secondary);font-size:13px}.icon-library-footer{display:flex;justify-content:space-between;align-items:center;padding:12px 0 0;border-top:1px solid var(--border-color);margin-top:12px}.icon-library-footer .selected-info{display:flex;align-items:center;gap:8px;font-size:13px}.icon-library-footer .category-badge,.icon-library-footer .source-badge{padding:2px 6px;background:var(--surface-secondary);border-radius:var(--radius-sm);font-size:10px;color:var(--text-secondary)}.icon-library-footer .select-btn{padding:8px 16px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-md);font-size:13px;font-weight:500;cursor:pointer;transition:background .15s ease}.icon-library-footer .select-btn:hover{background:var(--primary-hover)}.icon-library-footer .clear-btn{padding:4px 8px;background:transparent;color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:11px;cursor:pointer;transition:all .15s ease}.icon-library-footer .clear-btn:hover{background:var(--surface-secondary);color:var(--text-primary)}.scene-target-toggle{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--surface-secondary);border-radius:var(--radius-sm);margin-bottom:8px;border:1px solid var(--border-color)}.scene-target-toggle .toggle-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:12px;color:var(--text-primary)}.scene-target-toggle .toggle-label input[type=checkbox]{position:absolute;opacity:0;width:0;height:0}.scene-target-toggle .toggle-slider{position:relative;width:32px;height:18px;background:var(--surface);border-radius:9px;transition:all .2s ease;border:1px solid var(--border-color)}.scene-target-toggle .toggle-slider:before{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;background:#fff;border-radius:50%;transition:transform .2s ease;box-shadow:0 1px 2px #0003}.scene-target-toggle .toggle-label input:checked+.toggle-slider{background:var(--accent);border-color:var(--accent)}.scene-target-toggle .toggle-label input:checked+.toggle-slider:before{transform:translate(14px)}.scene-target-toggle .toggle-text{font-weight:500}.scene-target-toggle .hint-text{font-size:10px;color:var(--text-secondary);font-style:italic}.icon-large-preview{display:flex;align-items:center;gap:16px;padding:16px;margin-top:12px;background:var(--surface-secondary);border-radius:var(--radius-md);border:1px solid var(--border-color)}.icon-large-preview .large-preview-canvas{border-radius:var(--radius-sm);background:#fff;box-shadow:var(--shadow-sm)}.icon-large-preview .preview-info{display:flex;flex-direction:column;gap:6px}.icon-large-preview .preview-info strong{font-size:14px;color:var(--text-primary)}.icon-large-preview .preview-info .category-badge,.icon-large-preview .preview-info .source-badge{padding:2px 8px;background:var(--surface);border-radius:var(--radius-sm);font-size:11px;color:var(--text-secondary);width:fit-content}.icon-large-preview .add-to-scene-btn{margin-left:auto;padding:8px 16px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-md);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap}.icon-large-preview .add-to-scene-btn:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 2px 8px #7c3aed4d}.icon-large-preview .add-to-scene-btn:active{transform:translateY(0)}.icon-preview.selected{border-color:var(--primary-color);background:#4f46e51a;box-shadow:0 0 0 2px var(--primary-color)}.icon-preview.previewing{border-color:var(--accent-color, #06b6d4);background:#06b6d41a}.icon-preview.selected.previewing{border-color:var(--primary-color);box-shadow:0 0 0 2px var(--primary-color),inset 0 0 0 2px #06b6d44d}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:var(--surface);border-radius:var(--radius-lg);padding:24px;max-width:450px;width:90%;max-height:80vh;overflow-y:auto;box-shadow:var(--shadow-lg)}.modal h4{font-size:18px;font-weight:600;margin-bottom:16px;color:var(--text-primary)}.modal .form-group{margin-bottom:16px}.modal .form-group label{display:block;font-size:13px;font-weight:500;color:var(--text-secondary);margin-bottom:6px}.modal .form-group input,.modal .form-group textarea{width:100%;padding:10px 12px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:14px;font-family:inherit}.modal .form-group input:focus,.modal .form-group textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #4f46e51a}.modal .form-group textarea{resize:vertical;font-family:monospace}.modal .form-group .format-hint{display:block;margin-top:4px;font-size:11px;color:var(--text-tertiary);font-style:italic}.modal .form-group .image-preview{margin-top:8px;padding:8px;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--surface-secondary);text-align:center}.modal .form-group .image-preview img{border-radius:var(--radius-sm)}.modal .error-message{padding:10px 12px;background:#ef44441a;color:var(--error-color);border-radius:var(--radius-md);font-size:13px;margin-bottom:16px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.modal-actions .cancel-btn{padding:10px 16px;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:14px;color:var(--text-secondary);cursor:pointer}.modal-actions .cancel-btn:hover:not(:disabled){background:var(--surface-secondary)}.modal-actions .primary-btn{padding:10px 16px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-md);font-size:14px;font-weight:500;cursor:pointer}.modal-actions .primary-btn:hover:not(:disabled){background:var(--primary-hover)}.settings-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1100;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.settings-modal-container{background:var(--surface);border-radius:var(--radius-lg);width:90%;max-width:700px;max-height:85vh;display:flex;flex-direction:column;box-shadow:0 25px 50px -12px #00000040;animation:settingsModalSlideIn .2s ease-out}@keyframes settingsModalSlideIn{0%{opacity:0;transform:scale(.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.settings-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-color);flex-shrink:0}.settings-modal-header h2{font-size:18px;font-weight:600;color:var(--text-primary);margin:0}.settings-modal-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.settings-modal-close:hover{background:var(--surface-secondary);color:var(--text-primary)}.settings-modal-content{flex:1;overflow-y:auto;padding:0}.settings-modal-content .settings-panel{border:none;box-shadow:none}@media (prefers-color-scheme: dark){.settings-modal-overlay{background:#000000bf}.settings-modal-container{background:#1f2937;box-shadow:0 25px 50px -12px #00000080}.settings-modal-header{border-bottom-color:#374151}.settings-modal-header h2{color:#f9fafb}.settings-modal-close{color:#9ca3af}.settings-modal-close:hover{background:#374151;color:#f9fafb}}.settings-slide-panel{position:fixed;top:0;right:0;width:380px;height:100vh;background:var(--surface);border-left:1px solid var(--border-color);box-shadow:-4px 0 20px #00000026;z-index:1000;transform:translate(100%);transition:transform .3s ease;display:flex;flex-direction:column;overflow:hidden}.settings-slide-panel.open{transform:translate(0)}.settings-slide-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-color);flex-shrink:0;background:var(--surface)}.settings-slide-header h2{font-size:18px;font-weight:600;color:var(--text-primary);margin:0}.settings-slide-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.settings-slide-close:hover{background:var(--surface-secondary);color:var(--text-primary)}.settings-slide-content{flex:1;overflow-y:auto;overflow-x:hidden}.settings-slide-content .settings-panel{border:none;box-shadow:none;height:100%}@media (prefers-color-scheme: dark){.settings-slide-panel{background:#1f2937;border-left-color:#374151;box-shadow:-4px 0 20px #0006}.settings-slide-header{background:#1f2937;border-bottom-color:#374151}.settings-slide-header h2{color:#f9fafb}.settings-slide-close{color:#9ca3af}.settings-slide-close:hover{background:#374151;color:#f9fafb}}@media (max-width: 768px){.settings-slide-panel{width:100%;max-width:340px}}.project-name-row{display:flex;align-items:center;gap:6px}.project-uuid-badge{font-size:9px;font-family:SF Mono,Consolas,monospace;color:var(--text-secondary);background:var(--surface-secondary);padding:2px 5px;border-radius:3px;cursor:help;opacity:.8;flex-shrink:0}.project-uuid-badge:hover{opacity:1}@media (prefers-color-scheme: dark){.project-uuid-badge{background:#374151;color:#9ca3af}}.project-uuid-group{display:flex;align-items:center;gap:2px}.uuid-copy-btn-small{display:flex;align-items:center;justify-content:center;width:16px;height:16px;padding:0;background:transparent;border:none;border-radius:3px;color:var(--text-secondary, #6b7280);cursor:pointer;opacity:.5;transition:all .15s ease}.uuid-copy-btn-small:hover{opacity:1;background:#4f46e51a;color:var(--primary-color, #4f46e5)}.uuid-copy-btn-small.copied{color:var(--success-color, #10b981);opacity:1}@media (prefers-color-scheme: dark){.uuid-copy-btn-small{color:#9ca3af}.uuid-copy-btn-small:hover{background:#4b5563;color:#818cf8}}.slide-illustrations-section{background:linear-gradient(135deg,#4f46e50a,#8b5cf60a);border:1px solid rgba(79,70,229,.12);border-radius:10px;padding:14px;margin-top:12px}.slide-illustrations-section .section-header{margin-bottom:12px}.slide-illustrations-section .section-header h4{font-size:13px;font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:6px;margin:0 0 4px}.slide-illustrations-section .section-description{font-size:11px;color:var(--text-secondary);margin:0;line-height:1.4}.illustration-model-selection{margin-top:12px;padding-top:12px;border-top:1px solid rgba(79,70,229,.1)}.illustration-model-selection>label{display:block;font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px}.illustration-model-selection>select{width:100%;padding:8px 10px;font-size:12px;border-radius:6px;border:1px solid var(--border-color);background:var(--surface);color:var(--text-primary)}.illustration-setting{display:flex;flex-direction:column;gap:4px}.illustration-setting label{font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.3px}.illustration-setting select{width:100%;padding:6px 8px;font-size:12px;border-radius:6px;border:1px solid var(--border-color);background:var(--surface);color:var(--text-primary)}.pricing-hint{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--text-secondary);margin-top:8px;padding:6px 8px;background:#4f46e50f;border-radius:4px}.pricing-hint svg{flex-shrink:0;color:var(--primary-color)}@media (prefers-color-scheme: dark){.slide-illustrations-section{background:linear-gradient(135deg,#818cf814,#a78bfa14);border-color:#818cf833}.illustration-model-selection{border-top-color:#818cf826}.illustration-model-selection>select,.illustration-setting select{background:#374151;border-color:#4b5563;color:#f9fafb}.pricing-hint{background:#818cf81a}}.slide-illustrations-section .toggle-setting{margin-bottom:8px}.slide-illustrations-section .toggle-label{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.slide-illustrations-section .toggle-label input[type=checkbox]{position:absolute;opacity:0;width:0;height:0}.slide-illustrations-section .toggle-slider{position:relative;display:inline-block;width:36px;height:20px;background-color:#ccc;border-radius:20px;transition:background-color .2s;flex-shrink:0}.slide-illustrations-section .toggle-slider:before{content:"";position:absolute;width:16px;height:16px;left:2px;top:2px;background-color:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 1px 3px #0003}.slide-illustrations-section .toggle-label input:checked+.toggle-slider{background-color:var(--primary-color, #4f46e5)}.slide-illustrations-section .toggle-label input:checked+.toggle-slider:before{transform:translate(16px)}.slide-illustrations-section .toggle-text{font-size:13px;font-weight:500;color:var(--text-primary)}.slide-illustrations-section .toggle-setting .hint{display:block;margin-top:6px;margin-left:46px;font-size:11px;color:var(--text-secondary);line-height:1.4}.modal-actions button:disabled{opacity:.6;cursor:not-allowed}.ai-svg-generator-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.ai-svg-generator-modal{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:900px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.ai-svg-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-color);background:var(--surface-secondary)}.ai-svg-title{display:flex;align-items:center;gap:10px}.ai-svg-title svg{color:var(--primary-color)}.ai-svg-title h2{font-size:18px;font-weight:600;margin:0}.ai-svg-header .close-btn{background:none;border:none;padding:6px;cursor:pointer;border-radius:var(--radius-sm);color:var(--text-secondary);transition:all .2s}.ai-svg-header .close-btn:hover{background:var(--border-color);color:var(--text-primary)}.ai-svg-phases{display:flex;align-items:center;justify-content:center;padding:16px 20px;background:var(--surface-secondary);border-bottom:1px solid var(--border-color);gap:8px}.phase{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;background:var(--border-color);color:var(--text-secondary);font-size:13px;transition:all .2s}.phase.active{background:var(--primary-color);color:#fff}.phase.completed{background:var(--success-color);color:#fff}.phase-number{width:20px;height:20px;display:flex;align-items:center;justify-content:center;background:#fff3;border-radius:50%;font-size:11px;font-weight:600}.phase-connector{width:30px;height:2px;background:var(--border-color)}.ai-svg-content{flex:1;overflow-y:auto;padding:20px}.ai-svg-input-phase{max-width:600px;margin:0 auto}.input-section{margin-bottom:20px}.input-section label{display:block;font-weight:600;margin-bottom:6px;color:var(--text-primary)}.input-section .input-hint{font-size:13px;color:var(--text-secondary);margin-bottom:10px}.input-section textarea{width:100%;padding:12px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:14px;resize:vertical;min-height:120px;font-family:inherit}.input-section textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #4f46e51a}.count-selector{display:flex;align-items:center;gap:8px}.count-btn{padding:8px 16px;border:1px solid var(--border-color);background:var(--surface);border-radius:var(--radius-md);cursor:pointer;font-size:14px;transition:all .2s}.count-btn:hover{border-color:var(--primary-color)}.count-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.count-input{width:60px;padding:8px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:14px;text-align:center}.style-selector{display:flex;gap:12px}.style-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px;border:2px solid var(--border-color);background:var(--surface);border-radius:var(--radius-md);cursor:pointer;transition:all .2s}.style-btn:hover{border-color:var(--primary-color);background:var(--primary-light, rgba(79, 70, 229, .05))}.style-btn.active{border-color:var(--primary-color);background:var(--primary-light, rgba(79, 70, 229, .1))}.style-btn svg{color:var(--text-secondary)}.style-btn.active svg{color:var(--primary-color)}.style-btn span{font-weight:600;font-size:14px;color:var(--text-primary)}.style-btn small{font-size:11px;color:var(--text-secondary);text-align:center}.analyze-btn{width:100%;padding:14px 20px!important;font-size:16px!important;display:flex;align-items:center;justify-content:center;gap:10px}.ai-svg-instructions-phase{display:flex;flex-direction:column;gap:16px}.instructions-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}.instructions-header p{color:var(--text-secondary);font-size:14px}.instructions-actions{display:flex;gap:8px}.select-all-btn,.add-btn{padding:6px 12px;border:1px solid var(--border-color);background:var(--surface);border-radius:var(--radius-md);cursor:pointer;font-size:13px;display:flex;align-items:center;gap:6px;transition:all .2s}.select-all-btn:hover,.add-btn:hover{border-color:var(--primary-color);color:var(--primary-color)}.instructions-list{display:flex;flex-direction:column;gap:8px;max-height:350px;overflow-y:auto;padding:4px}.instruction-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--surface-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);transition:all .2s}.instruction-item.selected{border-color:var(--primary-color);background:#4f46e50d}.instruction-checkbox input{width:18px;height:18px;cursor:pointer}.instruction-number{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:var(--border-color);border-radius:50%;font-size:12px;font-weight:600;color:var(--text-secondary)}.instruction-input{flex:1;padding:8px 10px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:14px;min-width:200px}.instruction-input:focus{outline:none;border-color:var(--primary-color)}.instruction-item .category-select{padding:8px 10px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:13px;background:var(--surface);min-width:100px}.instruction-item .remove-btn{padding:6px;border:none;background:none;cursor:pointer;color:var(--text-secondary);border-radius:var(--radius-sm);transition:all .2s}.instruction-item .remove-btn:hover{color:var(--error-color);background:#ef44441a}.phase-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:16px;border-top:1px solid var(--border-color);margin-top:10px}.secondary-btn{padding:10px 20px;border:1px solid var(--border-color);background:var(--surface);border-radius:var(--radius-md);cursor:pointer;font-size:14px;color:var(--text-primary);transition:all .2s}.secondary-btn:hover:not(:disabled){border-color:var(--text-secondary)}.primary-btn{padding:10px 20px;border:none;background:var(--primary-color);color:#fff;border-radius:var(--radius-md);cursor:pointer;font-size:14px;font-weight:500;display:flex;align-items:center;gap:8px;transition:all .2s}.primary-btn:hover:not(:disabled){background:var(--primary-hover)}.primary-btn:disabled,.secondary-btn:disabled{opacity:.6;cursor:not-allowed}.ai-svg-results-phase{display:flex;flex-direction:column;gap:16px}.results-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}.results-header p{color:var(--text-secondary);font-size:14px}.svg-results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;max-height:450px;overflow-y:auto;padding:4px}.svg-result-card{background:var(--surface);border:2px solid var(--border-color);border-radius:var(--radius-md);padding:12px;display:flex;flex-direction:column;gap:10px;transition:all .2s}.svg-result-card.selected{border-color:var(--primary-color);box-shadow:0 0 0 3px #4f46e51a}.svg-result-card.success{background:#10b98108}.svg-result-card.error{background:#ef444408;border-color:var(--error-color)}.card-header{display:flex;align-items:center;gap:8px}.card-header input[type=checkbox]{width:16px;height:16px;cursor:pointer}.card-number{font-size:12px;font-weight:600;color:var(--text-secondary)}.status-badge{margin-left:auto;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:500}.status-badge.pending{background:var(--border-color);color:var(--text-secondary)}.status-badge.generating{background:var(--warning-color);color:#fff}.status-badge.success{background:var(--success-color);color:#fff}.status-badge.error{background:var(--error-color);color:#fff}.card-preview{width:100%;aspect-ratio:1;background:#f8f8f8;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.card-preview canvas{display:block}.card-preview .download-btn{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:var(--radius-sm);background:#fff;border:1px solid var(--border-color);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:all .2s;z-index:10;box-shadow:0 1px 3px #0000001a;opacity:0}.svg-result-card:hover .download-btn{opacity:1}.card-preview .download-btn:hover{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.generating-indicator,.error-indicator,.pending-indicator{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px;text-align:center}.error-indicator span{font-size:11px;color:var(--error-color);max-width:80%;word-break:break-word}.spinner{width:20px;height:20px;border:2px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin .8s linear infinite}.spinner.large{width:40px;height:40px;border-width:3px}.card-description{font-size:12px;color:var(--text-primary);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:34px}.card-category{font-size:11px;color:var(--text-secondary);background:var(--surface-secondary);padding:2px 8px;border-radius:10px;align-self:flex-start}.regenerate-btn{width:100%;padding:8px;border:1px solid var(--border-color);background:var(--surface);border-radius:var(--radius-sm);cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;gap:6px;color:var(--text-secondary);transition:all .2s}.save-btn{background:var(--success-color)!important}.save-btn:hover:not(:disabled){background:#059669!important}.ai-svg-content .error-message{background:#ef44441a;color:var(--error-color);padding:10px 14px;border-radius:var(--radius-md);font-size:13px;margin-top:10px}.background-settings{display:flex;flex-direction:column;gap:12px;padding:8px 0}.background-settings .settings-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:8px;border-bottom:1px solid var(--border-color)}.background-settings .settings-header h3{font-size:14px;font-weight:600;color:var(--text-primary);margin:0}.bg-apply-mode{display:flex;flex-direction:column;gap:6px}.bg-apply-mode .mode-label{font-size:12px;color:var(--text-secondary);font-weight:500}.bg-apply-mode .mode-options{display:flex;gap:6px}.bg-apply-mode .mode-btn{flex:1;padding:8px 12px;border:1px solid var(--border-color);background:var(--surface);border-radius:var(--radius-md);font-size:12px;color:var(--text-secondary);cursor:pointer;transition:all .2s}.bg-apply-mode .mode-btn:hover{border-color:var(--primary-color);color:var(--text-primary)}.bg-apply-mode .mode-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.bg-scene-selector{display:flex;flex-direction:column;gap:4px}.bg-scene-selector label{font-size:12px;color:var(--text-secondary)}.bg-scene-selector select{padding:8px 12px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:12px;background:var(--surface);color:var(--text-primary);cursor:pointer}.bg-scene-selector select:focus{outline:none;border-color:var(--primary-color)}.bg-upload-section{margin:8px 0}.bg-upload-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px;border:2px dashed var(--border-color);background:var(--surface-secondary);border-radius:var(--radius-md);color:var(--text-secondary);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s}.bg-upload-btn:hover{border-color:var(--primary-color);color:var(--primary-color);background:#4f46e50d}.bg-upload-btn svg{flex-shrink:0}.bg-layers-list{display:flex;flex-direction:column;gap:10px;max-height:400px;overflow-y:auto;overflow-x:hidden}.no-layers{text-align:center;padding:20px;color:var(--text-secondary);font-size:12px;background:var(--surface-secondary);border-radius:var(--radius-md);border:1px dashed var(--border-color)}.bg-layer-item{display:flex;gap:6px;padding:6px;background:var(--surface-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);transition:border-color .2s;overflow:hidden}.bg-layer-item:hover{border-color:var(--primary-color)}.bg-layer-item .layer-preview{width:40px;height:40px;flex-shrink:0;border-radius:var(--radius-sm);overflow:hidden;background:#fff;border:1px solid var(--border-color)}.bg-layer-item .layer-preview img{width:100%;height:100%;object-fit:cover}.bg-layer-item .layer-controls{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;overflow:hidden}.bg-layer-item .layer-name{font-size:12px;font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-control-row{display:flex;align-items:center;gap:4px;font-size:10px}.layer-control-row label{color:var(--text-secondary);min-width:40px;font-size:9px}.layer-control-row input[type=range]{flex:1;height:3px;max-width:80px;background:var(--border-color);border-radius:2px;-webkit-appearance:none;cursor:pointer}.layer-control-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;background:var(--primary-color);border-radius:50%;cursor:pointer}.layer-control-row .control-value{min-width:25px;text-align:right;color:var(--text-secondary);font-size:9px}.layer-control-row select{flex:1;padding:4px 8px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:11px;background:var(--surface);cursor:pointer}.layer-control-row .fit-mode-select{max-width:100px}.layer-control-row.control-disabled{opacity:.6}.layer-control-row.control-disabled input,.layer-control-row.control-disabled select{cursor:not-allowed;background-color:#f5f5f5}.layer-control-row.control-disabled .slider{background:#e0e0e0}.layer-control-row .control-hint{font-size:9px;color:#999;margin-left:4px;font-weight:500;font-style:italic}.bg-layer-item .layer-actions{display:flex;flex-direction:column;gap:4px}.layer-action-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid var(--border-color);background:var(--surface);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all .2s}.layer-action-btn:hover:not(:disabled){border-color:var(--primary-color);color:var(--primary-color)}.layer-action-btn:disabled{opacity:.3;cursor:not-allowed}.layer-action-btn.danger:hover:not(:disabled){border-color:var(--error-color);color:var(--error-color);background:#ef44440d}.bg-clear-btn{width:100%;padding:10px;border:1px solid var(--error-color);background:#ef44440d;color:var(--error-color);border-radius:var(--radius-md);font-size:12px;font-weight:500;cursor:pointer;transition:all .2s;margin-top:8px}.bg-clear-btn:hover{background:var(--error-color);color:#fff}.avatar-settings{display:flex;flex-direction:column;gap:1rem;padding:.5rem}.avatar-mode-toggle.compact{background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:.6rem}.avatar-mode-toggle.compact .mode-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.avatar-mode-toggle.compact .mode-header h4{font-size:.75rem;font-weight:600;margin:0;color:var(--text)}.avatar-mode-toggle.compact .inline-status{display:flex;align-items:center;gap:.4rem}.status-dot-compact{width:10px;height:10px;border-radius:50%;background:#ef4444;box-shadow:0 0 0 2px #ef444433;transition:all .3s}.status-dot-compact.online{background:#22c55e;box-shadow:0 0 0 2px #22c55e33,0 0 8px #22c55e80;animation:pulse-green 2s infinite}@keyframes pulse-green{0%,to{box-shadow:0 0 0 2px #22c55e33,0 0 8px #22c55e80}50%{box-shadow:0 0 0 4px #22c55e4d,0 0 12px #22c55eb3}}.refresh-status-btn-compact{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border:none;background:transparent;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;color:var(--text-secondary)}.refresh-status-btn-compact:hover{background:var(--background);color:var(--primary-color)}.avatar-mode-toggle.compact .mode-buttons{display:flex;gap:.4rem}.avatar-mode-toggle.compact .mode-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.5rem .4rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s}.avatar-mode-toggle.compact .mode-btn:hover{border-color:var(--primary-color);background:#4f46e50d}.avatar-mode-toggle.compact .mode-btn.active{border-color:var(--primary-color);background:#4f46e51a;color:var(--primary-color)}.avatar-mode-toggle.compact .mode-label{font-size:.7rem;font-weight:500;white-space:nowrap}.status-error-compact{font-size:.65rem;color:var(--error-color);margin-top:.4rem;padding:.3rem .5rem;background:#ef44441a;border-radius:var(--radius-sm)}.avatar-service-status{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md)}.status-indicator{display:flex;align-items:center;gap:.5rem;flex:1}.status-dot{width:8px;height:8px;border-radius:50%;background:#ef4444}.status-indicator.online .status-dot{background:#22c55e;box-shadow:0 0 8px #22c55e80}.status-text{font-size:.75rem;font-weight:500}.status-error{font-size:.65rem;color:var(--error-color);margin-top:.25rem}.refresh-status-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid var(--border-color);background:var(--surface);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s}.refresh-status-btn:hover{border-color:var(--primary-color);color:var(--primary-color)}.avatar-toggle{padding:.5rem 0}.toggle-label{position:relative;display:flex;align-items:center;gap:.5rem;cursor:pointer}.toggle-label input[type=checkbox]{width:16px;height:16px;cursor:pointer}.toggle-text{font-size:.85rem;font-weight:500}.toggle-hint{font-size:.7rem;color:var(--text-secondary);margin-top:.25rem}.avatar-selection h4,.avatar-upload h4,.avatar-head-motion h4{font-size:.8rem;font-weight:600;margin:0 0 .5rem;color:var(--text-primary)}.avatar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.loading-avatars{padding:1rem;text-align:center;color:var(--text-secondary);font-size:.75rem}.avatar-card{position:relative;border:2px solid var(--border-color);border-radius:var(--radius-md);padding:.25rem;cursor:pointer;transition:all .2s;background:var(--surface)}.avatar-card:hover{border-color:var(--primary-color)}.avatar-card.selected{border-color:var(--primary-color);background:var(--primary-light)}.avatar-card .avatar-image{position:relative;aspect-ratio:1;overflow:hidden;border-radius:var(--radius-sm)}.avatar-card .avatar-image img{width:100%;height:100%;object-fit:cover}.selected-badge{position:absolute;top:4px;right:4px;width:20px;height:20px;background:var(--primary-color);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center}.avatar-card .avatar-info{padding:.25rem;text-align:center}.avatar-card .avatar-name{font-size:.65rem;font-weight:500;display:block}.builtin-badge{font-size:.55rem;color:var(--text-secondary);background:var(--bg-secondary);padding:1px 4px;border-radius:4px}.remove-avatar-btn{position:absolute;top:-6px;right:-6px;width:18px;height:18px;background:var(--error-color);color:#fff;border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .2s}.avatar-card:hover .remove-avatar-btn{opacity:1}.avatar-upload{padding:.75rem;background:var(--bg-secondary);border-radius:var(--radius-md)}.upload-form{display:flex;gap:.5rem;flex-wrap:wrap}.upload-name-input{flex:1;min-width:100px;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem}.upload-gender-select{padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem;background:var(--surface)}.upload-btn{padding:.5rem 1rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.75rem;font-weight:500;cursor:pointer;transition:background .2s}.upload-btn:hover:not(:disabled){background:var(--primary-dark)}.upload-btn:disabled{opacity:.5;cursor:not-allowed}.upload-hint{font-size:.65rem;color:var(--text-secondary);margin-top:.5rem}.rive-avatar-upload{padding:.75rem;background:var(--bg-secondary);border-radius:var(--radius-md)}.upload-error{padding:.5rem;margin-top:.5rem;background:rgba(var(--error-rgb, 220, 53, 69),.1);border:1px solid var(--error-color, #dc3545);border-radius:var(--radius-sm);color:var(--error-color, #dc3545);font-size:.7rem}.rive-upload-tips{margin-top:1rem;padding:.75rem;background:var(--surface);border-radius:var(--radius-sm);border:1px solid var(--border-color)}.rive-upload-tips h5{font-size:.7rem;font-weight:600;margin:0 0 .5rem;color:var(--text-primary)}.rive-upload-tips ul{margin:0;padding-left:1.25rem;font-size:.65rem;color:var(--text-secondary);line-height:1.6}.rive-upload-tips li{margin-bottom:.25rem}.rive-community-link{display:inline-block;margin-top:.75rem;font-size:.7rem;color:var(--primary-color);text-decoration:none}.rive-community-link:hover{text-decoration:underline}.rive-settings{margin-top:1rem;padding-top:.75rem;border-top:1px solid var(--border-color)}.rive-settings h4{font-size:.75rem;font-weight:600;margin:0 0 .5rem;color:var(--text-primary)}.rive-setting-row{margin-bottom:.5rem}.rive-setting-row .toggle-label{display:flex;align-items:center;gap:.5rem;font-size:.7rem;color:var(--text-secondary);cursor:pointer;position:relative}.rive-setting-row .toggle-label input[type=checkbox]{width:14px;height:14px;cursor:pointer}.custom-badge{font-size:.55rem;padding:.1rem .25rem;background:var(--success-color, #28a745);color:#fff;border-radius:2px;font-weight:500}.rive-badge{font-size:.55rem;padding:.1rem .25rem;background:#6366f1;color:#fff;border-radius:2px;font-weight:500}.rive-card .avatar-info{display:flex;flex-wrap:wrap;gap:.25rem;align-items:center}.rive-placeholder-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--bg-secondary);color:var(--text-tertiary)}.avatar-head-motion{padding-top:.5rem}.head-motion-select{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem;background:var(--surface)}.head-motion-select:disabled{opacity:.5;cursor:not-allowed}.motion-description{font-size:.65rem;color:var(--text-secondary);margin-top:.25rem}.prerender-progress{padding:.75rem;background:var(--primary-light);border-radius:var(--radius-md);border:1px solid var(--primary-color)}.progress-label{font-size:.75rem;font-weight:500;margin-bottom:.5rem}.progress-bar{height:8px;background:var(--bg-secondary);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:var(--primary-color);transition:width .3s}.progress-percent{font-size:.7rem;text-align:right;margin-top:.25rem;color:var(--primary-color);font-weight:600}.avatar-subtabs{display:flex;gap:4px;padding:4px;background:var(--surface-secondary);border-radius:var(--radius-md);margin-bottom:.75rem}.subtab-btn{flex:1;padding:6px 10px;background:transparent;border:none;border-radius:var(--radius-sm);font-size:.7rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s}.subtab-btn:hover{background:var(--surface);color:var(--text-primary)}.subtab-btn.active{background:var(--primary-color);color:#fff}.avatar-subtab-content{min-height:150px}.avatar-ai-generate{padding:.5rem;display:flex;flex-direction:column;gap:.75rem}.ai-generate-hint{font-size:.7rem;color:var(--text-secondary);margin:0}.ai-form-row{display:flex;flex-direction:column;gap:4px}.ai-form-row label{font-size:.7rem;font-weight:500;color:var(--text-secondary)}.style-toggle{display:flex;gap:4px}.style-btn{flex:1;padding:6px 10px;border:1px solid var(--border-color);background:var(--surface);border-radius:var(--radius-sm);font-size:.7rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .2s}.style-btn:hover{border-color:var(--primary-color);color:var(--text-primary)}.style-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.ai-gender-select{padding:6px 8px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem;background:var(--surface)}.ai-description-input{width:100%;padding:8px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem;font-family:inherit;resize:vertical}.ai-description-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #4f46e51a}.ai-generate-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 16px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-md);font-size:.8rem;font-weight:500;cursor:pointer;transition:all .2s}.ai-generate-btn:hover:not(:disabled){background:var(--primary-hover)}.ai-generate-btn:disabled{opacity:.7;cursor:not-allowed}.ai-generate-btn .spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.ai-error{padding:8px 10px;background:#ef44441a;color:var(--error-color);border-radius:var(--radius-sm);font-size:.7rem}.ai-preview{display:flex;flex-direction:column;gap:8px;padding:8px;background:var(--surface-secondary);border-radius:var(--radius-md);border:1px solid var(--border-color)}.ai-preview .preview-image{aspect-ratio:1;max-height:200px;border-radius:var(--radius-sm);overflow:hidden;background:#fff;display:flex;align-items:center;justify-content:center}.ai-preview .preview-image img{max-width:80%;max-height:100%;object-fit:contain}.preview-actions{display:flex;flex-direction:column;gap:6px}.ai-name-input{width:100%;padding:6px 8px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem}.preview-buttons{display:flex;gap:6px}.regenerate-btn{flex:1;padding:6px 10px;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.7rem;color:var(--text-secondary);cursor:pointer;transition:all .2s}.regenerate-btn:hover:not(:disabled){border-color:var(--primary-color);color:var(--primary-color)}.regenerate-btn:disabled{opacity:.5;cursor:not-allowed}.save-avatar-btn{flex:1;padding:6px 10px;background:var(--success-color);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.7rem;font-weight:500;cursor:pointer;transition:all .2s}.save-avatar-btn:hover:not(:disabled){background:#059669}.save-avatar-btn:disabled{opacity:.5;cursor:not-allowed}.reference-photo-section{margin-top:4px}.reference-photo-preview{position:relative;display:inline-block;width:80px;height:80px;border-radius:var(--radius-md);overflow:hidden;border:2px solid var(--primary-color)}.reference-photo-preview img{width:100%;height:100%;object-fit:cover}.clear-photo-btn{position:absolute;top:2px;right:2px;width:22px;height:22px;border-radius:50%;background:#ef4444e6;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.clear-photo-btn:hover{background:#dc2626;transform:scale(1.1)}.reference-photo-upload{display:flex;flex-direction:column;gap:4px}.upload-photo-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--surface-secondary);border:2px dashed var(--border-color);border-radius:var(--radius-md);color:var(--text-secondary);font-size:.75rem;cursor:pointer;transition:all .2s}.upload-photo-btn:hover{border-color:var(--primary-color);color:var(--primary-color);background:#6366f10d}.upload-photo-btn svg{flex-shrink:0}.photo-hint{font-size:.65rem;color:var(--text-tertiary);font-style:italic}.slider-input-group{display:flex;align-items:center;gap:5px;flex:1}.slider-input-group .slider{flex:1;min-width:0}.slider-input-group .value-input{width:50px;padding:3px 5px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.7rem;text-align:center;background:var(--surface-primary);color:var(--text-primary)}.slider-input-group .value-input:focus{outline:none;border-color:var(--primary-color)}.slider-input-group .value-input:disabled{opacity:.5;cursor:not-allowed}.slider-input-group .unit{font-size:.7rem;color:var(--text-tertiary);min-width:20px}.control-row.with-input{display:flex;align-items:center;gap:5px;margin-bottom:.4rem}.control-row.with-input label{min-width:55px;font-size:.7rem;color:var(--text-secondary)}.avatar-transform-controls{padding:.25rem 0}.avatar-transform-controls h4{font-size:.8rem;font-weight:600;margin:0 0 .5rem;color:var(--text-primary)}.reset-transform-btn{width:100%;padding:6px 10px;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.7rem;color:var(--text-secondary);cursor:pointer;transition:all .2s;margin-top:.5rem}.reset-transform-btn:hover:not(:disabled){border-color:var(--primary-color);color:var(--primary-color)}.avatar-overlay{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;pointer-events:none}.avatar-strip{background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:8px;width:100%;height:100%;box-sizing:border-box}.avatar-strip-inner{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;max-height:95%}.avatar-display{width:100%;height:auto;max-height:90%;border-radius:0;overflow:visible;background:transparent;box-shadow:none;display:flex;align-items:flex-end;justify-content:center}.avatar-display.speaking{filter:drop-shadow(0 0 8px rgba(59,130,246,.4))}.avatar-display.rive-mode{width:100%;height:100%;max-height:100%}.avatar-display.fullbody{aspect-ratio:auto;max-height:90%;background:transparent;display:flex;align-items:flex-end;justify-content:center}.avatar-display.fullbody .avatar-image,.avatar-display.fullbody .avatar-video{object-fit:contain;max-width:80%;max-height:100%;height:auto}.avatar-video{width:100%;height:100%;object-fit:cover}.avatar-static{width:100%;height:100%;position:relative}.avatar-static .avatar-image{width:100%;height:100%;object-fit:cover}.avatar-static.pulsing{animation:avatar-pulse 2s ease-in-out infinite}@keyframes avatar-pulse{0%,to{opacity:1}50%{opacity:.85}}.avatar-pulse-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at center,rgba(59,130,246,.2) 0%,transparent 70%);animation:pulse-glow 2s ease-in-out infinite}@keyframes pulse-glow{0%,to{opacity:.3}50%{opacity:.7}}.avatar-name-tag{display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 16px;background:#ffffff1a;border-radius:20px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.avatar-name-tag .avatar-name{color:#fff;font-size:14px;font-weight:500}.speaking-indicator{display:flex;align-items:center;gap:3px}.speaking-indicator .dot{width:4px;height:4px;background:#22c55e;border-radius:50%;animation:speaking-dot 1.4s ease-in-out infinite}.speaking-indicator .dot:nth-child(2){animation-delay:.2s}.speaking-indicator .dot:nth-child(3){animation-delay:.4s}@keyframes speaking-dot{0%,60%,to{transform:scale(1);opacity:.5}30%{transform:scale(1.3);opacity:1}}.avatar-strip-preview{width:100%;aspect-ratio:3/4;max-height:200px;background:linear-gradient(to bottom,#1a1a2e,#16213e);border-radius:var(--radius-md);display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}.avatar-strip-preview.disabled{background:var(--bg-secondary)}.avatar-strip-preview .preview-placeholder{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--text-secondary)}.avatar-strip-preview .preview-placeholder span{font-size:.7rem}.avatar-strip-preview .preview-image{width:60%;aspect-ratio:1;object-fit:cover;border-radius:var(--radius-md)}.avatar-strip-preview .preview-name{color:#fff;font-size:.75rem;margin-top:.5rem}.avatar-transform-controls{margin-top:1rem;padding:.75rem;background:var(--surface-secondary);border-radius:var(--radius-md)}.avatar-transform-controls h4{margin:0 0 .75rem;font-size:.85rem;color:var(--text-primary)}.avatar-transform-controls .control-row{display:flex;align-items:center;gap:.4rem;margin-bottom:.4rem}.avatar-transform-controls .control-row label{width:50px;font-size:.7rem;color:var(--text-secondary);flex-shrink:0}.avatar-transform-controls .control-row input[type=range]{flex:1;height:4px;background:var(--border-color);border-radius:2px;cursor:pointer}.avatar-transform-controls .control-row input[type=range]::-webkit-slider-thumb{width:14px;height:14px;background:var(--primary-color);border-radius:50%;cursor:pointer;-webkit-appearance:none}.avatar-transform-controls .control-value{width:50px;text-align:right;font-size:.7rem;color:var(--text-secondary);flex-shrink:0}.reset-transform-btn{width:100%;margin-top:.5rem;padding:.4rem .75rem;font-size:.75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.reset-transform-btn:hover:not(:disabled){background:var(--surface-secondary);color:var(--text-primary)}.reset-transform-btn:disabled{opacity:.5;cursor:not-allowed}.ai-image-thumbnails{margin-top:1rem;padding:.75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md)}.ai-image-thumbnails .thumbnails-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.ai-image-thumbnails h4{font-size:.8rem;font-weight:600;margin:0;color:var(--text-primary)}.ai-image-thumbnails .view-all-btn{font-size:.7rem;padding:.25rem .5rem;background:var(--surface-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.ai-image-thumbnails .view-all-btn:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.thumbnail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.thumbnail-item{aspect-ratio:1;border:2px solid var(--border-color);border-radius:var(--radius-sm);overflow:hidden;cursor:pointer;transition:all .2s ease;background:#fff}.thumbnail-item:hover{border-color:var(--primary-color);transform:scale(1.05);box-shadow:0 2px 8px #00000026}.thumbnail-item img{width:100%;height:100%;object-fit:cover;display:block}.image-lightbox{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:10000;cursor:pointer;animation:fadeIn .2s ease}.lightbox-content{position:relative;max-width:90vw;max-height:90vh;cursor:default;animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.lightbox-content img{max-width:80%;max-height:90vh;display:block;border-radius:var(--radius-md);box-shadow:0 4px 20px #00000080}.lightbox-close{position:absolute;top:-40px;right:0;background:#ffffffe6;border:none;border-radius:50%;width:32px;height:32px;font-size:24px;line-height:1;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;color:var(--text-primary)}.lightbox-close:hover{background:#fff;transform:scale(1.1)}.lightbox-info{position:absolute;bottom:-40px;left:0;right:0;text-align:center;color:#fff}.lightbox-info .image-name{font-size:.875rem;margin:0;text-shadow:0 2px 4px rgba(0,0,0,.5)}.script-editor-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--surface);z-index:9999;display:flex;flex-direction:column}.script-editor-container{width:100%;height:100%;display:flex;flex-direction:column}.script-editor-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;border-bottom:1px solid var(--border-color);background:var(--surface-secondary)}.script-editor-header h2{font-size:1.1rem;font-weight:600;margin:0;color:var(--text-primary)}.script-editor-header .close-btn{background:none;border:none;font-size:2rem;line-height:1;cursor:pointer;color:var(--text-secondary);transition:color .2s ease;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center}.script-editor-header .close-btn:hover{color:var(--text-primary)}.script-editor-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;border-bottom:1px solid var(--border-color);background:var(--surface)}.toolbar-left{display:flex;align-items:center;gap:1rem}.toolbar-left .search-input{padding:.4rem .75rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.875rem;width:300px;background:var(--surface-secondary)}.toolbar-left .match-count{font-size:.8rem;color:var(--text-secondary)}.toolbar-right{display:flex;gap:.5rem}.toolbar-btn{padding:.4rem .75rem;font-size:.875rem;background:var(--surface-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;transition:all .2s ease}.toolbar-btn:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.script-editor-error{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#fee;border-bottom:1px solid #fcc;color:#c33;font-size:.875rem}.script-editor-main{flex:1;display:flex;overflow:hidden;background:var(--surface-secondary)}.editor-gutter{width:60px;background:var(--surface);border-right:1px solid var(--border-color);overflow-y:auto;padding:.5rem 0;-webkit-user-select:none;user-select:none}.line-number{text-align:right;padding:0 .75rem;font-family:Courier New,monospace;font-size:.875rem;line-height:1.5;color:var(--text-secondary);height:21px}.editor-textarea{flex:1;padding:.5rem 1rem;font-family:Courier New,monospace;font-size:.875rem;line-height:1.5;border:none;outline:none;resize:none;background:var(--surface-secondary);color:var(--text-primary);overflow-y:auto;-moz-tab-size:2;tab-size:2}.script-editor-footer{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;border-top:1px solid var(--border-color);background:var(--surface)}.footer-stats{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--text-secondary)}.footer-actions{display:flex;gap:.75rem}.cancel-btn,.save-btn{padding:.5rem 1.25rem;font-size:.875rem;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease}.cancel-btn{background:var(--surface-secondary);border:1px solid var(--border-color);color:var(--text-primary)}.cancel-btn:hover{background:var(--surface)}.save-btn{background:var(--primary-color);border:1px solid var(--primary-color);color:#fff;font-weight:500}.save-btn:hover{background:#5b21b6;border-color:#5b21b6}.generation-settings-section{margin-bottom:1rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:.75rem}.generation-settings-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem;font-weight:500;font-size:.875rem;color:var(--text)}.generation-settings-header svg{flex-shrink:0}.generation-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.generation-setting-item{display:flex;flex-direction:column;gap:.4rem}.generation-setting-item label{font-size:.75rem;font-weight:500;color:var(--text)}.input-with-hint{display:flex;flex-direction:column;gap:.25rem}.input-with-hint small{font-size:.65rem;color:var(--text-secondary)}.number-input{width:100%;padding:.5rem .75rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.875rem;font-family:inherit;color:var(--text);transition:all .2s}.number-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #667eea1a}.number-input:disabled{opacity:.6;cursor:not-allowed}.duration-input-group{display:flex;align-items:center;gap:.5rem}.input-suffix{font-size:.75rem;color:var(--text-secondary);white-space:nowrap}.generation-settings-compact{margin-bottom:.75rem;padding:.5rem .75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md)}.compact-settings-header{margin-bottom:.35rem;font-size:.7rem;font-weight:600;color:var(--text-primary)}.compact-settings-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.5rem}.compact-setting-item{display:flex;flex-direction:column;gap:.15rem}.compact-setting-item label{font-size:.65rem;font-weight:500;color:var(--text);white-space:nowrap}.compact-number-input{width:100%;padding:.3rem .4rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.7rem;font-family:inherit;color:var(--text);transition:all .2s}.compact-number-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #667eea1a}.compact-number-input:disabled{opacity:.6;cursor:not-allowed}.background-generator{display:flex;flex-direction:column;gap:1.25rem;padding:1rem}.background-generator-header h4{margin:0 0 .25rem;font-size:1rem;font-weight:600;color:var(--text)}.generator-description{margin:0;font-size:.75rem;color:var(--text-secondary);line-height:1.4}.section-label{display:block;font-size:.75rem;font-weight:600;color:var(--text);margin-bottom:.5rem}.category-selection{display:flex;flex-direction:column}.category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.5rem}.category-card{display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:.75rem;background:var(--surface);border:1.5px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:all .2s;text-align:center}.category-card:hover:not(:disabled){border-color:var(--primary-color);background:var(--background)}.category-card.selected{border-color:var(--primary-color);background:#667eea14}.category-card:disabled{opacity:.6;cursor:not-allowed}.category-card svg{flex-shrink:0;color:var(--text-secondary)}.category-card.selected svg{color:var(--primary-color)}.category-name{font-size:.75rem;font-weight:600;color:var(--text)}.category-desc{font-size:.65rem;color:var(--text-secondary);line-height:1.3}.style-selection{display:flex;flex-direction:column}.style-list{display:flex;flex-direction:column;gap:.4rem;max-height:240px;overflow-y:auto;padding:.25rem}.style-item{display:flex;align-items:center;justify-content:space-between;padding:.6rem .75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;text-align:left}.style-item:hover:not(:disabled){border-color:var(--primary-color);background:var(--background)}.style-item.selected{border-color:var(--primary-color);background:#667eea14}.style-item:disabled{opacity:.6;cursor:not-allowed}.style-info{display:flex;flex-direction:column;gap:.15rem;flex:1}.style-name{font-size:.75rem;font-weight:600;color:var(--text)}.style-description{font-size:.65rem;color:var(--text-secondary);line-height:1.3}.style-item svg{flex-shrink:0;color:var(--primary-color)}.custom-modifiers{display:flex;flex-direction:column;gap:.35rem}.modifier-input{width:100%;padding:.5rem .75rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem;font-family:inherit;color:var(--text);transition:all .2s}.modifier-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #667eea1a}.modifier-input:disabled{opacity:.6;cursor:not-allowed}.input-hint{font-size:.65rem;color:var(--text-secondary);line-height:1.3}.generate-bg-button{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-md);font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s}.generate-bg-button:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.generate-bg-button:active:not(:disabled){transform:translateY(0)}.generate-bg-button:disabled{opacity:.6;cursor:not-allowed}.generation-error{display:flex;align-items:center;gap:.5rem;padding:.6rem .75rem;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:var(--radius-sm);font-size:.75rem;color:#dc2626}.generation-error svg{flex-shrink:0}.prompt-preview{display:flex;flex-direction:column;gap:.35rem}.prompt-text{padding:.6rem .75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.65rem;color:var(--text-secondary);line-height:1.5;max-height:80px;overflow-y:auto}.recent-backgrounds{display:flex;flex-direction:column;gap:.5rem}.background-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.5rem}.background-preview{position:relative;aspect-ratio:16 / 9;border-radius:var(--radius-sm);overflow:hidden;cursor:pointer;border:2px solid var(--border-color);transition:all .2s}.background-preview:hover{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.background-preview img{width:100%;height:100%;object-fit:cover}.preview-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.7),transparent);display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:.25rem;padding:.5rem;opacity:0;transition:opacity .2s}.background-preview:hover .preview-overlay{opacity:1}.preview-name{font-size:.65rem;font-weight:600;color:#fff;text-align:center}.use-button{padding:.25rem .75rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.65rem;font-weight:600;cursor:pointer;transition:all .2s}.use-button:hover{background:var(--primary-hover)}.layer-controls-section{margin-top:1.5rem;padding:1rem;background:var(--surface);border:1px solid var(--border);border-radius:8px}.layer-controls-header{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;color:var(--text-primary);font-weight:500}.layer-controls-grid{display:grid;gap:1rem}.layer-control-item{display:flex;flex-direction:column;gap:.5rem}.control-label{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:var(--text-secondary)}.control-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.spinner-control{display:flex;align-items:center;gap:.5rem;position:relative}.spinner-input{flex:1;padding:.5rem 2.5rem .5rem .75rem;border:1px solid var(--border);border-radius:6px;background:var(--bg-primary);color:var(--text-primary);font-size:.875rem;font-family:Segoe UI,system-ui,sans-serif;transition:all .2s ease}.spinner-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #3b82f61a}.spinner-input:disabled{opacity:.5;cursor:not-allowed}.spinner-buttons{display:flex;flex-direction:column;gap:0;position:absolute;right:3rem;top:50%;transform:translateY(-50%)}.spinner-btn{display:flex;align-items:center;justify-content:center;width:24px;height:14px;padding:0;border:none;background:var(--surface);color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.spinner-btn:first-child{border-top-right-radius:4px;border-bottom:.5px solid var(--border)}.spinner-btn:last-child{border-bottom-right-radius:4px}.spinner-btn:hover:not(:disabled){background:var(--hover);color:var(--primary)}.spinner-btn:active:not(:disabled){background:var(--active)}.spinner-btn:disabled{opacity:.3;cursor:not-allowed}.spinner-suffix{font-size:.875rem;color:var(--text-secondary);font-weight:500;min-width:2rem;text-align:left}@media (min-width: 768px){.layer-controls-grid{grid-template-columns:auto 1fr 1fr;align-items:center}.layer-control-item:first-child{grid-column:span 3}}.number-input.duration-input{min-width:100px;width:100px}.intro-outro-settings.compact{display:flex;flex-direction:column;height:100%;overflow-y:auto;overflow-x:hidden;padding:0}.slide-selector{display:flex;gap:.4rem;padding:.5rem;background:var(--surface);border-bottom:1px solid var(--border-color)}.slide-pill{flex:1;display:flex;align-items:center;justify-content:center;gap:.3rem;padding:.35rem .5rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.7rem;font-weight:500;color:var(--text);cursor:pointer;transition:all .2s}.slide-pill:hover{border-color:var(--primary-color);background:var(--surface)}.slide-pill.active{border-color:var(--primary-color);background:var(--primary-color);color:#fff}.slide-pill svg{flex-shrink:0}.intro-outro-controls{flex:1;min-height:0;padding:.5rem;background:var(--background);display:flex;flex-direction:column;gap:.5rem;overflow-y:auto}.intro-outro-controls .settings-section{padding:0;background:transparent;border:none;margin-bottom:0;gap:.3rem}.inline-controls{display:flex;gap:.75rem;align-items:center;flex-wrap:nowrap}.control-group{display:flex;align-items:center;gap:.3rem;position:relative}.control-label{font-size:.65rem;color:var(--text);font-weight:500;white-space:nowrap}.slider-input-group.compact{display:flex;align-items:center;gap:.25rem;flex:1;max-width:180px}.slider-input-group.compact .slider{flex:1;min-width:60px;max-width:100px;height:3px}.slider-input-group.compact .value-input{width:42px;padding:.2rem .3rem;font-size:.65rem}.slider-input-group.compact .unit{font-size:.6rem;color:var(--text-secondary)}.form-grid{display:grid;grid-template-columns:1fr;gap:.5rem}.form-field{display:flex;flex-direction:column;gap:.25rem}.form-field label{font-size:.65rem;font-weight:500;color:var(--text-secondary)}.form-field.full-width{grid-column:1 / -1}.text-input.compact{width:100%;padding:.4rem .5rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-family:inherit;font-size:.7rem;background:var(--surface);color:var(--text)}.text-input.compact:focus{outline:none;border-color:var(--primary-color)}.textarea-input.compact{width:100%;padding:.4rem .5rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-family:inherit;font-size:.7rem;resize:vertical;background:var(--surface);color:var(--text);line-height:1.3}.textarea-input.compact:focus{outline:none;border-color:var(--primary-color)}.image-uploads-row{display:flex;gap:.5rem}.upload-group{flex:1;display:flex;flex-direction:column;gap:.25rem}.upload-group label{font-size:.65rem;font-weight:500;color:var(--text-secondary);display:flex;align-items:center;gap:.3rem}.upload-group .count{font-size:.6rem;color:var(--text-muted);font-weight:400}.upload-actions{display:flex;gap:.3rem}.file-input{display:none}.file-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.3rem;padding:.35rem .5rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.65rem;font-weight:500;cursor:pointer;transition:all .2s}.file-btn:hover{background:var(--primary-hover);transform:translateY(-1px)}.file-btn svg{flex-shrink:0;width:12px;height:12px}.remove-btn{padding:.35rem;background:var(--error-color);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.remove-btn:hover{background:#c53030;transform:translateY(-1px)}.intro-outro-preview{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:.5rem;background:var(--surface-secondary, #f9fafb);border-top:1px solid var(--border-color);max-height:180px;min-height:120px}.preview-container{position:relative;width:100%;height:100%;max-width:280px;max-height:160px;border-radius:var(--radius-sm);overflow:hidden;box-shadow:0 2px 8px #0000001a}.preview-image{width:100%;height:100%;object-fit:cover}.preview-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.7),transparent 50%);display:flex;align-items:flex-end;padding:.75rem}.preview-content{width:100%}.preview-title{font-size:.9rem;font-weight:600;color:#fff;margin:0 0 .25rem;text-shadow:0 1px 4px rgba(0,0,0,.5)}.preview-text{font-size:.7rem;color:#ffffffe6;margin:0;text-shadow:0 1px 2px rgba(0,0,0,.5);line-height:1.3}.preview-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;text-align:center;color:var(--text-secondary)}.preview-empty p{font-size:.875rem;margin:0;color:var(--text)}.preview-empty small{font-size:.75rem;color:var(--text-muted)}.disabled-message{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;text-align:center;padding:2rem}.disabled-message span{font-size:.875rem;color:var(--text-secondary)}.section-header{font-size:.65rem;font-weight:600;color:var(--text);margin:0 0 .35rem;padding-bottom:.25rem;border-bottom:1px solid var(--border-color)}.position-controls{display:flex;flex-direction:column;gap:.25rem}.control-row{display:flex;flex-direction:row;align-items:center;gap:.4rem}.control-row label{font-size:.6rem;font-weight:500;color:var(--text);margin-bottom:0;min-width:50px;flex-shrink:0}.reset-btn.compact{padding:.3rem .6rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.65rem;color:var(--text);cursor:pointer;transition:all .2s;margin-top:.15rem}.reset-btn.compact:hover{background:var(--background);border-color:var(--primary-color);color:var(--primary-color)}.spinbox-input.compact{width:50px;padding:.3rem .4rem;text-align:center;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-family:inherit;font-size:.7rem;background:var(--surface);color:var(--text)}.spinbox-input.compact:focus{outline:none;border-color:var(--primary-color)}.duration-inline{display:flex;align-items:center;gap:.3rem}.section-header-with-actions{display:flex;align-items:center;justify-content:space-between;margin-bottom:.2rem;margin-top:.2rem}.section-header-with-actions .section-header{font-size:.65rem;margin:0;font-weight:600}.reset-icon-btn{padding:.3rem;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.reset-icon-btn svg{width:14px;height:14px}.reset-icon-btn:hover{border-color:var(--primary-color);color:var(--primary-color);background:#4f46e50d}.file-btn .btn-text-white{color:#fff;font-weight:500}.intro-outro-settings-content{padding:1rem}.settings-divider{height:1px;background:var(--border);margin:1.5rem 0}.image-preview{width:100%;max-width:400px;height:auto;margin-top:.5rem;border-radius:var(--radius-sm);border:1px solid var(--border)}.ai-images-section-divider{margin:1rem 0;height:1px;background:var(--border-color)}.current-animation-images{display:flex;flex-direction:column;gap:.75rem;padding:.75rem 0}.images-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.images-header h4{font-size:.8rem;font-weight:600;margin:0;color:var(--text)}.add-image-dropdown{position:relative}.add-image-btn{display:flex;align-items:center;gap:.4rem;padding:.35rem .6rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.7rem;font-weight:500;cursor:pointer;transition:all .2s}.add-image-btn:hover{background:var(--primary-color-hover);transform:translateY(-1px)}.add-image-btn svg{flex-shrink:0}.add-options-menu{position:absolute;top:calc(100% + .25rem);right:0;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;min-width:180px;overflow:hidden;z-index:1000}.add-options-menu button{display:flex;align-items:center;gap:.5rem;padding:.6rem .75rem;background:transparent;border:none;font-size:.75rem;font-weight:500;color:var(--text);cursor:pointer;transition:background .2s;text-align:left}.add-options-menu button:hover{background:var(--background)}.add-options-menu button svg{flex-shrink:0;color:var(--primary-color)}.images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}.image-card{background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);overflow:hidden;transition:all .2s}.image-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md)}.scene-label{background:var(--background);padding:.3rem .5rem;font-size:.65rem;font-weight:600;color:var(--text-secondary);text-align:center;border-bottom:1px solid var(--border-color)}.image-thumbnail{width:100%;height:100px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--background)}.image-thumbnail img{width:100%;height:100%;object-fit:cover}.image-info{padding:.4rem .5rem;border-bottom:1px solid var(--border-color)}.image-prompt{font-size:.65rem;color:var(--text);margin:0;line-height:1.3}.image-actions{display:flex;gap:.25rem;padding:.35rem;background:var(--background)}.action-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.3rem;padding:.35rem .4rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.65rem;font-weight:500;cursor:pointer;transition:all .2s}.action-btn svg{flex-shrink:0}.action-btn.replace-btn{color:var(--primary-color)}.action-btn.replace-btn:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.action-btn.delete-btn{color:#dc2626}.action-btn.delete-btn:hover{background:#dc2626;color:#fff;border-color:#dc2626}.no-images-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem;text-align:center;color:var(--text-secondary)}.no-images-state svg{margin-bottom:.75rem}.no-images-state p{margin:0 0 .25rem;font-size:.8rem;font-weight:500;color:var(--text)}.no-images-state small{font-size:.7rem;color:var(--text-secondary)}.image-thumbnail.clickable{position:relative;cursor:pointer;transition:all .2s}.image-thumbnail.clickable:hover{transform:scale(1.02)}.thumbnail-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.image-thumbnail.clickable:hover .thumbnail-overlay{opacity:1}.action-btn.preview-btn{color:var(--primary-color)}.action-btn.preview-btn:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.action-btn.download-btn{color:#059669}.action-btn.download-btn:hover{background:#059669;color:#fff;border-color:#059669}.action-btn.regenerate-btn{color:#d97706}.action-btn.regenerate-btn:hover{background:#d97706;color:#fff;border-color:#d97706}.image-preview-modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:2rem;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000d9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1}.modal-content{position:relative;z-index:2;background:#fff;border-radius:12px;box-shadow:0 25px 50px -12px #00000040;max-width:90vw;max-height:90vh;min-width:400px;display:flex;flex-direction:column;overflow:hidden;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-close-btn{position:absolute;top:1rem;right:1rem;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#00000080;border:none;border-radius:50%;color:#fff;cursor:pointer;transition:all .2s;z-index:10}.modal-close-btn:hover{background:#000c;transform:scale(1.1)}.modal-image-container{display:flex;align-items:center;justify-content:center;padding:3rem 2rem 1rem;background:#f3f4f6;min-height:300px;overflow:auto}.modal-image-container img{display:block;max-width:80vw;max-height:70vh;min-width:200px;min-height:150px;width:auto;height:auto;object-fit:contain;border-radius:8px;border:1px solid #e5e7eb}.modal-image-info{padding:1rem 1.5rem;background:var(--surface);border-top:1px solid var(--border-color)}.modal-image-info h4{font-size:.75rem;font-weight:600;color:var(--text-secondary);margin:0 0 .5rem;text-transform:uppercase;letter-spacing:.05em}.modal-image-info p{font-size:.85rem;color:var(--text);margin:0;line-height:1.5}.recent-ai-images-section{margin-top:1rem}.recent-ai-images-section h4{font-size:.75rem;font-weight:600;margin-bottom:.5rem;color:var(--text-primary)}.intro-outro-quick-toggle{margin-bottom:.75rem;padding:.75rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md)}.quick-toggle-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;font-size:.75rem;font-weight:600;color:var(--text-primary)}.quick-toggle-header .link-button{background:none;border:none;color:var(--primary-color);font-size:.7rem;cursor:pointer;padding:0}.quick-toggle-header .link-button:hover{text-decoration:underline}.quick-toggle-controls{display:flex;flex-direction:column;gap:.5rem}.toggle-label{position:relative;display:flex;align-items:center;gap:.5rem;font-size:.75rem;cursor:pointer}.toggle-label input[type=checkbox]{cursor:pointer}.toggle-preview{font-size:.7rem;color:var(--text-secondary);font-style:italic}.background-generator-compact{display:flex;flex-direction:column;height:100%;overflow:hidden}.bg-controls-compact{flex-shrink:0;padding:.75rem;background:var(--surface);border-bottom:1px solid var(--border-color);display:flex;flex-direction:column;gap:.5rem}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.category-btn{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem .4rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius);font-size:.65rem;font-weight:500;color:var(--text);cursor:pointer;transition:all .15s}.category-btn svg{opacity:.7}.category-btn:hover:not(:disabled){border-color:var(--primary-color);background:var(--surface)}.category-btn:hover:not(:disabled) svg{opacity:1}.category-btn.selected{border-color:var(--primary-color);background:var(--primary-color);color:#fff}.category-btn.selected svg{opacity:1}.category-btn:disabled{opacity:.5;cursor:not-allowed}.category-pills{display:flex;gap:.4rem;flex-wrap:wrap}.category-pill{padding:.35rem .65rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.7rem;font-weight:500;color:var(--text);cursor:pointer;transition:all .15s;white-space:nowrap}.category-pill:hover:not(:disabled){border-color:var(--primary-color);background:var(--surface)}.category-pill.selected{border-color:var(--primary-color);background:var(--primary-color);color:#fff}.category-pill:disabled{opacity:.5;cursor:not-allowed}.style-generate-row{display:flex;gap:.5rem}.style-select-compact{flex:1;padding:.5rem .75rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.75rem;color:var(--text);cursor:pointer;transition:all .2s}.style-select-compact:hover:not(:disabled){border-color:var(--primary-color)}.style-select-compact:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #667eea1a}.style-select-compact:disabled{opacity:.5;cursor:not-allowed}.generate-btn-compact{display:flex;align-items:center;gap:.4rem;padding:.5rem 1rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}.generate-btn-compact:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 2px 8px #667eea4d}.generate-btn-compact:disabled{opacity:.6;cursor:not-allowed;transform:none}.generate-btn-compact svg{flex-shrink:0}.modifier-input-compact{width:100%;padding:.45rem .65rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:.7rem;color:var(--text);transition:all .2s}.modifier-input-compact::placeholder{color:var(--text-secondary);opacity:.6}.modifier-input-compact:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #667eea1a}.modifier-input-compact:disabled{opacity:.5;cursor:not-allowed}.custom-instructions-section{display:flex;flex-direction:column;gap:.35rem}.instructions-label{display:flex;align-items:center;gap:.5rem;font-size:.75rem;font-weight:600;color:var(--text)}.label-hint{font-size:.65rem;font-weight:400;color:var(--text-secondary);opacity:.8}.custom-instructions-textarea{width:100%;padding:.65rem .75rem;background:var(--background);border:2px solid var(--border-color);border-radius:var(--radius);font-size:.8rem;font-family:inherit;color:var(--text);resize:vertical;min-height:80px;transition:all .2s;line-height:1.4}.custom-instructions-textarea::placeholder{color:var(--text-secondary);opacity:.6}.custom-instructions-textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea26}.custom-instructions-textarea:disabled{opacity:.5;cursor:not-allowed}.reference-image-section{display:flex;flex-direction:column;gap:.35rem}.reference-upload-area{position:relative;width:100%;min-height:80px;background:var(--background);border:2px dashed var(--border-color);border-radius:var(--radius);overflow:hidden;transition:all .2s}.reference-upload-area:hover{border-color:var(--primary-color)}.upload-trigger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;padding:1rem;cursor:pointer;color:var(--text-secondary);font-size:.75rem;height:100%;min-height:80px;transition:all .2s}.upload-trigger:hover{color:var(--primary-color)}.reference-preview{position:relative;width:100%;height:100px}.reference-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:flex-start;justify-content:space-between;padding:.5rem;background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,transparent 50%)}.analyzing-text{display:flex;align-items:center;gap:.4rem;padding:.3rem .6rem;background:#0009;border-radius:var(--radius-sm);color:#fff;font-size:.7rem}.analysis-badge{display:flex;align-items:center;gap:.25rem;padding:.3rem .6rem;background:#22c55ee6;border-radius:var(--radius-sm);color:#fff;font-size:.7rem}.clear-reference-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;background:#0009;border:none;border-radius:50%;color:#fff;cursor:pointer;transition:all .2s}.clear-reference-btn:hover{background:#dc2626e6}.analysis-summary{padding:.5rem .65rem;background:#667eea1a;border:1px solid rgba(102,126,234,.2);border-radius:var(--radius-sm);font-size:.7rem;color:var(--text-secondary);line-height:1.4}.analysis-summary small{display:block;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.generation-error-compact{display:flex;align-items:center;gap:.4rem;padding:.5rem .65rem;background:#dc26261a;border:1px solid rgba(220,38,38,.3);border-radius:var(--radius-sm);color:#dc2626;font-size:.7rem}.generation-error-compact svg{flex-shrink:0}.bg-gallery-section{flex:1;overflow-y:auto;padding:.75rem;background:var(--background)}.gallery-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:300px;text-align:center;color:var(--text-secondary)}.gallery-empty-state p{margin:.75rem 0 .25rem;font-size:.875rem;font-weight:500;color:var(--text)}.gallery-empty-state small{font-size:.7rem;color:var(--text-secondary)}.bg-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem}.bg-gallery-item{position:relative;aspect-ratio:16 / 9;border-radius:var(--radius-md);overflow:hidden;background:var(--surface);border:2px solid var(--border-color);transition:all .2s;cursor:pointer}.bg-gallery-item:hover{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.bg-gallery-item img{width:100%;height:100%;object-fit:cover;display:block}.bg-item-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.85),transparent 50%);display:flex;flex-direction:column;justify-content:flex-end;padding:.75rem;opacity:0;transition:opacity .2s}.bg-gallery-item:hover .bg-item-overlay{opacity:1}.bg-item-info{margin-bottom:.5rem}.bg-item-name{font-size:.75rem;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.bg-item-actions{display:flex;gap:.5rem}.bg-action-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.35rem;padding:.4rem .65rem;background:#fffffff2;border:none;border-radius:var(--radius-sm);font-size:.7rem;font-weight:600;color:var(--text);cursor:pointer;transition:all .15s}.bg-action-btn:hover{background:#fff;transform:translateY(-1px);box-shadow:0 2px 6px #0003}.bg-action-btn:active{transform:translateY(0)}.bg-action-btn svg{flex-shrink:0}.bg-action-btn:first-child{background:var(--primary-color);color:#fff}.bg-action-btn:first-child:hover{background:var(--primary-hover)}.format-selector{display:flex;flex-direction:column;gap:1rem}.format-section{display:flex;flex-direction:column;gap:.5rem}.format-label{font-size:.75rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.aspect-ratio-buttons{display:flex;gap:.5rem}.aspect-ratio-button{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem;background:var(--background);border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all .2s;color:var(--text-secondary)}.aspect-ratio-button:hover:not(:disabled){background:var(--surface);color:var(--text-primary)}.aspect-ratio-button.active{border-color:var(--primary-color);background:#4f46e51a;color:var(--primary-color)}.aspect-ratio-button:disabled{opacity:.4;cursor:not-allowed}.aspect-ratio-preview{display:block}.ratio-label{font-size:.65rem;font-weight:500}.platform-buttons{display:flex;flex-direction:column;gap:.375rem}.platform-button{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:var(--background);border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all .2s;color:var(--text-secondary);text-align:left}.platform-button:hover:not(:disabled){background:var(--surface);color:var(--text-primary)}.platform-button.active{border-color:var(--primary-color);background:#4f46e51a;color:var(--primary-color)}.platform-button:disabled{opacity:.4;cursor:not-allowed}.platform-button svg{flex-shrink:0}.platform-name{flex:1;font-size:.8rem;font-weight:500}.platform-resolution{font-size:.7rem;color:var(--text-muted)}.format-info{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:var(--surface);border-radius:var(--radius-md);font-size:.75rem}.format-info-label{color:var(--text-secondary)}.format-info-value{color:var(--text-primary);font-weight:500}.workflow-panel{display:flex;flex-direction:column;height:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) transparent}.workflow-panel::-webkit-scrollbar{width:6px}.workflow-panel::-webkit-scrollbar-track{background:transparent}.workflow-panel::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px}.workflow-section{border-bottom:1px solid var(--border-color)}.workflow-section:last-child{border-bottom:none}.workflow-section.disabled{opacity:.5;pointer-events:none}.workflow-section-header{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:var(--surface);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .15s ease}.workflow-section-header:hover{background:var(--surface-hover)}.workflow-section-header:focus{outline:2px solid var(--primary-color);outline-offset:-2px}.workflow-section-icon{display:flex;align-items:center;justify-content:center;color:var(--text-secondary);flex-shrink:0}.workflow-section.expanded .workflow-section-icon{color:var(--primary-color)}.workflow-section-title{flex:1;font-size:.85rem;font-weight:600;color:var(--text-primary)}.workflow-section-badge{padding:.15rem .4rem;background:var(--primary-color);color:#fff;font-size:.65rem;font-weight:600;border-radius:var(--radius-sm);text-transform:uppercase}.workflow-section-badge:empty{display:none}.workflow-section-chevron{color:var(--text-muted);transition:transform .2s ease;flex-shrink:0}.workflow-section-chevron.rotated{transform:rotate(180deg)}.workflow-section-content{overflow:hidden;transition:max-height .25s ease,opacity .2s ease;background:var(--background)}.workflow-section-content.visible{max-height:2000px;opacity:1;padding:.75rem 1rem}.workflow-section-content.hidden{max-height:0;opacity:0;padding:0 1rem}.workflow-placeholder{display:flex;align-items:center;justify-content:center;padding:1.5rem;color:var(--text-muted);font-size:.8rem;text-align:center;background:var(--surface);border-radius:var(--radius-md);border:1px dashed var(--border-color)}.panel-left.workflow-mode{width:360px}@media (max-width: 1200px){.panel-left.workflow-mode{width:320px}}@media (max-width: 1024px){.panel-left.workflow-mode{width:100%}}.output-panel{display:flex;flex-direction:column;gap:1rem;padding:.75rem;height:100%;overflow-y:auto}.output-section{display:flex;flex-direction:column;gap:.75rem}.output-section-title{font-size:.8rem;font-weight:600;color:var(--text-secondary);margin:0;text-transform:uppercase;letter-spacing:.05em}.export-section{padding-top:.5rem;border-top:1px solid var(--border-color)}.export-button{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.75rem 1rem;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-md);font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s}.export-button:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-1px)}.export-button:disabled,.export-button.disabled{background:var(--surface);color:var(--text-muted);cursor:not-allowed;transform:none}.export-button.exporting{background:var(--info-color);cursor:wait}.export-spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.export-hint{font-size:.75rem;color:var(--text-muted);text-align:center;margin:.5rem 0 0}.export-progress{padding:.5rem 0}.export-progress-bar{height:4px;background:var(--surface);border-radius:2px;overflow:hidden}.export-progress-fill{height:100%;background:var(--primary-color);transition:width .3s ease}.advanced-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.5rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all .2s}.advanced-toggle:hover{background:var(--surface-hover);color:var(--text-primary)}.toggle-chevron{transition:transform .2s}.toggle-chevron.open{transform:rotate(180deg)}.advanced-options{padding:.75rem;background:var(--surface);border:1px solid var(--border-color);border-top:none;border-radius:0 0 var(--radius-md) var(--radius-md)}.advanced-placeholder{font-size:.75rem;color:var(--text-muted);text-align:center;margin:0}.workflow-music-controls{display:flex;flex-direction:column;gap:.75rem}.workflow-toggle{display:flex;align-items:center;justify-content:space-between;padding:.5rem;background:var(--surface);border-radius:var(--radius-md);cursor:pointer}.workflow-toggle span{font-size:.85rem;color:var(--text-primary)}.workflow-toggle input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary-color);cursor:pointer}.workflow-music-options{display:flex;flex-direction:column;gap:.5rem;padding:.5rem;background:var(--surface);border-radius:var(--radius-md)}.workflow-music-options select{width:100%;padding:.5rem;background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.8rem}.workflow-music-options input[type=range]{width:100%;accent-color:var(--primary-color)}.ui-mode-toggle{display:flex;align-items:center;gap:.25rem;padding:.25rem .5rem;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:.7rem;color:var(--text-secondary);cursor:pointer;transition:all .2s}.ui-mode-toggle:hover{background:var(--surface-hover);color:var(--text-primary)}.ui-mode-toggle.active{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.ui-mode-toggle svg{width:14px;height:14px}.app.fullscreen-recording .app-header,.app.fullscreen-recording .panel-left,.app.fullscreen-recording .panel-right{display:none!important}.app.fullscreen-recording .app-main{padding:0;width:100vw;height:100vh}.app.fullscreen-recording .panel-center{width:100vw;height:100vh;max-width:none;flex:none;background:#000}.app.fullscreen-recording .canvas-wrapper{background:#000;width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative}.app.fullscreen-recording .canvas-tab-bar,.app.fullscreen-recording .playback-controls,.app.fullscreen-recording .canvas-progress-bar,.app.fullscreen-recording .subtitle-overlay,.app.fullscreen-recording .animation-name-display,.app.fullscreen-recording .canvas-zoom-controls,.app.fullscreen-recording .scene-position-display{display:none!important}.app.fullscreen-recording .doodle-canvas-wrapper{position:relative;max-width:100%;max-height:100%;width:auto;height:auto;aspect-ratio:var(--canvas-aspect-ratio, 16 / 9);display:flex;align-items:center;justify-content:center}.app.fullscreen-recording .doodle-canvas-container{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.app.fullscreen-recording .browser-canvas{max-width:100%;max-height:100%;width:100%;height:100%}.app.fullscreen-recording .browser-toolbar,.app.fullscreen-recording .browser-info-banner,.app.fullscreen-recording .browser-notes{display:none!important}.app.fullscreen-recording .browser-iframe-container{width:100%;height:100%;border-radius:0}.app.fullscreen-recording .ai-image-overlay,.app.fullscreen-recording .avatar-overlay,.app.fullscreen-recording .intro-outro-text-overlay,.app.fullscreen-recording .scene-text-overlay{display:block}.fullscreen-record-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 16px;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff;border:2px solid #3b82f6;border-radius:var(--radius-md);font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;margin-bottom:12px}.fullscreen-record-btn:hover:not(:disabled){background:linear-gradient(135deg,#16213e,#1a1a2e);border-color:#60a5fa;transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.fullscreen-record-btn:disabled{opacity:.5;cursor:not-allowed}.fullscreen-record-btn svg{width:20px;height:20px}.fullscreen-record-btn .rec-dot{width:10px;height:10px;background:#ef4444;border-radius:50%;animation:pulse-dot 1.5s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.9)}}.popup-blocked-warning{display:flex;align-items:flex-start;gap:8px;padding:12px;background:#fbbf241a;border:1px solid rgba(251,191,36,.3);border-radius:var(--radius-md);margin-bottom:12px}.popup-blocked-warning svg{flex-shrink:0;width:18px;height:18px;color:#fbbf24}.popup-blocked-warning .warning-text{flex:1}.popup-blocked-warning .warning-title{font-size:.85rem;font-weight:600;color:#fbbf24;margin-bottom:4px}.popup-blocked-warning .warning-desc{font-size:.75rem;color:var(--text-secondary);line-height:1.4}.popup-blocked-warning .allow-popup-btn{padding:6px 12px;background:#fbbf24;color:#1a1a2e;border:none;border-radius:var(--radius-sm);font-size:.75rem;font-weight:600;cursor:pointer;transition:background .2s;margin-top:8px}.popup-blocked-warning .allow-popup-btn:hover{background:#f59e0b}.fullscreen-exit-hint{position:fixed;bottom:20px;right:20px;padding:8px 16px;background:#000000b3;color:#fff;border-radius:20px;font-size:12px;z-index:10000;pointer-events:none;opacity:0;animation:fadeInOut 3s ease-in-out forwards}@keyframes fadeInOut{0%{opacity:0}10%{opacity:1}80%{opacity:1}to{opacity:0}}.browser-tab-recording-boundary{position:absolute;top:48px;left:0;right:0;bottom:0;pointer-events:none;z-index:999;border:2px dashed rgba(239,68,68,.5);border-radius:4px;box-shadow:inset 0 0 0 2px #ffffff4d,0 0 0 9999px #00000026}.browser-tab-recording-boundary:before,.browser-tab-recording-boundary:after{content:"";position:absolute;background:#ef444499}.browser-tab-recording-boundary:before{top:0;left:0;width:20px;height:2px;box-shadow:0 0 #ef444499,0 18px #ef444499}.browser-tab-recording-boundary:after{top:0;left:0;width:2px;height:20px;box-shadow:0 0 #ef444499,18px 0 #ef444499}.browser-tab-recording-label{position:absolute;top:8px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;padding:4px 12px;background:#ef4444e6;color:#fff;font-size:11px;font-weight:500;border-radius:12px;white-space:nowrap;box-shadow:0 2px 8px #0003;z-index:1000}.browser-tab-recording-label .recording-dot{width:6px;height:6px;background:#fff;border-radius:50%;animation:recording-pulse 1.5s ease-in-out infinite}@keyframes recording-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.recording .browser-tab-recording-boundary{display:none}.browser-tab-container:hover .browser-tab-recording-boundary{border-color:#ef4444b3}.browser-tab-recording-boundary .corner-markers{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.browser-tab-recording-boundary .corner-markers:before{content:"";position:absolute;top:0;right:0;width:20px;height:20px;border-top:2px solid rgba(239,68,68,.6);border-right:2px solid rgba(239,68,68,.6)}.browser-tab-recording-boundary .corner-markers:after{content:"";position:absolute;bottom:0;left:0;width:20px;height:20px;border-bottom:2px solid rgba(239,68,68,.6);border-left:2px solid rgba(239,68,68,.6)}.browser-tab-recording-boundary .corner-markers{box-shadow:inset -20px -2px 0 -18px #ef444499,inset -2px -20px 0 -18px #ef444499}.ai-tools-phase{padding:16px}.ai-tools-phase .section-header{margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border-color)}.ai-tools-phase .section-header h3{font-size:16px;font-weight:600;color:var(--text-primary);margin:0 0 4px;display:flex;align-items:center;gap:8px}.ai-tools-phase .section-header h3:before{content:"";display:inline-block;width:4px;height:16px;background:linear-gradient(135deg,#8b5cf6,#6366f1);border-radius:2px}.ai-tools-phase .section-header p{font-size:12px;color:var(--text-secondary);margin:0;line-height:1.4}.ai-backgrounds-section,.ai-avatar-section{background:var(--surface)}.ai-tools-welcome{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.ai-tools-welcome h3{font-size:18px;font-weight:600;color:var(--text-primary);margin:0 0 8px}.ai-tools-welcome p{font-size:13px;color:var(--text-secondary);margin:0;max-width:300px}.ai-avatar-generator{display:flex;flex-direction:column;gap:16px}.ai-generator-info{display:flex;gap:12px;padding:14px;background:linear-gradient(135deg,#8b5cf614,#4f46e514);border:1px solid rgba(139,92,246,.2);border-radius:10px}.ai-generator-info .info-icon{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#8b5cf6,#6366f1);border-radius:8px;color:#fff}.ai-generator-info .info-content h4{font-size:13px;font-weight:600;color:var(--text-primary);margin:0 0 4px}.ai-generator-info .info-content p{font-size:11px;color:var(--text-secondary);margin:0;line-height:1.4}.ai-generator-info .info-note{margin-top:6px;padding-top:6px;border-top:1px solid rgba(139,92,246,.15);font-style:italic;color:#8b5cf6}.ai-generator-field{display:flex;flex-direction:column;gap:6px}.ai-generator-field>label{font-size:11px;font-weight:600;color:var(--text-primary);text-transform:uppercase;letter-spacing:.3px}.ai-generator-field .optional{font-weight:400;text-transform:none;color:var(--text-secondary)}.ai-generator-field textarea{padding:10px 12px;font-size:12px;border:1px solid var(--border-color);border-radius:8px;resize:vertical;min-height:80px;font-family:inherit}.ai-generator-field textarea:focus{outline:none;border-color:#8b5cf6;box-shadow:0 0 0 3px #8b5cf626}.ai-generator-field select{padding:8px 12px;font-size:12px;border:1px solid var(--border-color);border-radius:8px;background:#fff;cursor:pointer}.ai-generator-field .field-hint{font-size:10px;color:var(--text-secondary);margin:0}.reference-upload-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border:2px dashed var(--border-color);border-radius:10px;background:var(--surface-secondary);color:var(--text-secondary);font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease}.reference-upload-btn:hover{border-color:#8b5cf6;background:#8b5cf60d;color:#8b5cf6}.reference-upload-btn input{display:none}.reference-preview{position:relative;width:120px;height:120px;border-radius:10px;overflow:hidden;border:2px solid var(--border-color)}.reference-preview img{width:100%;height:100%;object-fit:cover}.clear-reference-btn{position:absolute;top:4px;right:4px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:#0009;border:none;border-radius:50%;color:#fff;cursor:pointer;transition:background .2s ease}.clear-reference-btn:hover{background:#ef4444cc}.ai-generator-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ai-generator-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;background:linear-gradient(135deg,#8b5cf6,#6366f1);border:none;border-radius:10px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.ai-generator-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #8b5cf659}.ai-generator-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.ai-generator-error{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#dc2626;font-size:12px}.ai-generator-success{display:flex;align-items:flex-start;gap:8px;padding:10px 12px;background:#22c55e1a;border:1px solid rgba(34,197,94,.3);border-radius:8px;color:#16a34a;font-size:12px;line-height:1.4}.ai-generator-success svg{flex-shrink:0;margin-top:2px}.context-panel-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:8px}.phase-content{flex:1;display:flex;flex-direction:column;min-height:0;overflow-y:auto;overflow-x:hidden;padding-bottom:20px}.background-generator-container,.ai-backgrounds-section,.ai-backgrounds-section .background-generator{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;padding-bottom:16px}.diagram-mode-section,.mermaid-settings-section{display:flex;flex-direction:column;gap:.75rem;overflow-y:auto;overflow-x:hidden;padding:.75rem;max-height:calc(100vh - 300px)}.ai-tools-phase{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;padding-bottom:20px}.ai-avatar-generator{display:flex;flex-direction:column;gap:1rem;padding-bottom:20px}.style-options-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.phase-content::-webkit-scrollbar,.diagram-mode-section::-webkit-scrollbar,.mermaid-settings-section::-webkit-scrollbar{width:6px}.phase-content::-webkit-scrollbar-track,.diagram-mode-section::-webkit-scrollbar-track,.mermaid-settings-section::-webkit-scrollbar-track{background:transparent}.phase-content::-webkit-scrollbar-thumb,.diagram-mode-section::-webkit-scrollbar-thumb,.mermaid-settings-section::-webkit-scrollbar-thumb{background:var(--border-color, #e5e7eb);border-radius:3px}.phase-content::-webkit-scrollbar-thumb:hover,.diagram-mode-section::-webkit-scrollbar-thumb:hover,.mermaid-settings-section::-webkit-scrollbar-thumb:hover{background:var(--text-secondary, #6b7280)}.mobile-menu-toggle{display:none;width:40px;height:40px;padding:8px;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;transition:all .2s ease;flex-shrink:0}.mobile-menu-toggle:hover{background:var(--surface-secondary);border-color:var(--primary-color)}.mobile-menu-toggle svg{width:100%;height:100%}.mobile-menu-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.mobile-menu-overlay.active{opacity:1;visibility:visible}@media (max-width: 768px){.mobile-menu-toggle{display:flex;align-items:center;justify-content:center}.mobile-menu-overlay{display:block}.app-header{padding:0 .75rem}.header-left h1{font-size:1rem}.header-left h1 svg{width:20px;height:20px}.header-project-name{max-width:100px;font-size:.75rem}.header-actions{gap:.25rem}.header-btn{padding:.35rem .5rem;font-size:.7rem}.header-btn span{display:none}.header-btn svg{width:16px;height:16px}.panel-left{position:fixed;top:var(--header-height);left:0;bottom:0;width:280px;max-width:85vw;z-index:1001;transform:translate(-100%);transition:transform .3s ease;border-radius:0;box-shadow:2px 0 10px #0003;overflow-y:auto}.panel-left.mobile-open{transform:translate(0)}.app-main{padding:.5rem}.panel-center{min-height:calc(100vh - var(--header-height) - 1rem)}.panel-right{display:none}}.voice-indicator{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;background:#ffffffe6;border:1px solid #e0e0e0;border-radius:4px;font-size:11px;color:#555;-webkit-user-select:none;user-select:none;transition:all .2s ease}.voice-indicator.playing{background:#e3f2fdf2;border-color:#42a5f5;color:#1565c0}.voice-indicator.playing .voice-icon{animation:voice-pulse 1s ease-in-out infinite}@keyframes voice-pulse{0%,to{opacity:1}50%{opacity:.5}}.voice-indicator .voice-icon{flex-shrink:0}.voice-indicator .voice-name{font-weight:500}.voice-indicator .voice-provider{font-size:10px;color:#888;margin-left:2px}.voice-indicator.playing .voice-provider{color:#64b5f6}.admin-layout{display:flex;height:100vh;background:#0f1419;overflow:hidden}.admin-sidebar{width:260px;background:#1a1f26;border-right:1px solid #2d3748;display:flex;flex-direction:column;transition:width .3s ease}.admin-layout.collapsed .admin-sidebar{width:70px}.sidebar-header{padding:20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.sidebar-title{display:flex;align-items:center;gap:10px;font-size:1.1rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden}.sidebar-logo{color:#8b5cf6}.sidebar-toggle{background:none;border:none;color:#718096;cursor:pointer;font-size:1.2rem;padding:4px 8px;border-radius:4px}.sidebar-toggle:hover{background:#2d3748;color:#fff}.sidebar-nav{flex:1;padding:12px;overflow-y:auto}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:8px;color:#a0aec0;text-decoration:none;margin-bottom:4px;transition:all .2s;cursor:pointer;background:none;border:none;width:100%;text-align:left;font-size:.95rem}.nav-item:hover{background:#2d3748;color:#fff}.nav-item.active{background:#e68a2e;color:#fff}.nav-icon{width:18px;height:18px;flex-shrink:0}.nav-label{white-space:nowrap}.admin-layout.collapsed .nav-label{display:none}.sidebar-footer{padding:12px;border-top:1px solid #2d3748}.back-button,.logout-button{color:#718096}.logout-button:hover{background:#e53e3e20;color:#fc8181}.admin-main{flex:1;padding:24px;overflow:hidden;background-color:#0f1419;display:flex;flex-direction:column}.admin-page{max-width:1400px;margin:0 auto;height:100%;display:flex;flex-direction:column;overflow:hidden}.page-header{margin-bottom:32px}.page-header h1{font-size:2rem;font-weight:600;color:#fff;margin:0 0 8px}.page-subtitle{color:#718096;font-size:1rem;margin:0}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-bottom:32px}.stat-card{background:#1a1f26;border:1px solid #2d3748;border-radius:12px;padding:24px;display:flex;gap:16px}.stat-card.wide{grid-column:span 2}.stat-icon{font-size:2.5rem}.stat-content h3{color:#718096;font-size:.875rem;font-weight:500;margin:0 0 8px;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:2rem;font-weight:700;color:#fff;margin-bottom:4px}.stat-detail{color:#718096;font-size:.875rem}.status-indicators{display:flex;gap:24px}.status-item{display:flex;align-items:center;gap:8px;color:#a0aec0}.status-dot{width:10px;height:10px;border-radius:50%;background:#718096}.status-item.healthy .status-dot{background:#48bb78}.status-item.warning .status-dot{background:#ecc94b}.quick-actions{background:#1a1f26;border:1px solid #2d3748;border-radius:12px;padding:24px}.quick-actions h2{color:#fff;font-size:1.25rem;margin:0 0 16px}.action-buttons{display:flex;gap:12px;flex-wrap:wrap}.action-buttons button{padding:12px 20px;border-radius:8px;background:#2d3748;border:none;color:#fff;font-size:.95rem;cursor:pointer;transition:all .2s}.action-buttons button:hover{background:#e68a2e}.table-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:16px}.search-input{padding:10px 16px;border-radius:8px;border:1px solid #2d3748;background:#1a1f26;color:#fff;font-size:.95rem;width:300px}.search-input:focus{outline:none;border-color:#e68a2e}.user-count{color:#718096;font-size:.875rem}.table-container{background:#1a1f26;border:1px solid #2d3748;border-radius:12px}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:16px;text-align:left;border-bottom:1px solid #2d3748}.data-table th{background:#1a1f26;color:#718096;font-weight:500;font-size:.875rem;text-transform:uppercase;letter-spacing:.5px}.data-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .2s,color .2s}.data-table th.sortable:hover{background:#252d38;color:#a0aec0}.data-table th .sort-icon{margin-left:4px;font-size:.7rem;opacity:.6;display:inline-block;min-width:12px}.data-table th.sortable:hover .sort-icon{opacity:1}.data-table td{color:#e2e8f0}.data-table tbody tr:hover{background:#2d374820}.data-table.compact th,.data-table.compact td{padding:8px 12px;vertical-align:middle;white-space:nowrap}.data-table.compact th{padding:10px 12px;font-size:.75rem}.data-table.compact td{font-size:.8rem}.data-table.compact .user-cell{flex-direction:row;gap:8px;align-items:center}.data-table.compact .user-cell .user-name{font-size:.8rem}.data-table.compact .user-cell .user-email{font-size:.7rem;opacity:.7}.table-container{max-height:calc(100vh - 280px);overflow-y:auto;overflow-x:auto}.table-container .data-table thead{position:sticky;top:0;z-index:10;background:#1a1f26}.table-container .data-table thead th{box-shadow:0 1px #2d3748}.table-container::-webkit-scrollbar{width:8px}.table-container::-webkit-scrollbar-track{background:#0f1419;border-radius:4px}.table-container::-webkit-scrollbar-thumb{background:#4a5568;border-radius:4px}.table-container::-webkit-scrollbar-thumb:hover{background:#718096}.admin-detail-panel{width:400px;background:#1a1f26;border:1px solid #2d3748;border-radius:12px;position:fixed;right:24px;top:80px;bottom:24px;transform:translate(calc(100% + 48px));transition:transform .3s ease;z-index:100;overflow:hidden;display:flex;flex-direction:column}.admin-detail-panel.open{transform:translate(0)}.admin-detail-panel .detail-header{padding:16px 20px;border-bottom:1px solid #2d3748;display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.admin-detail-panel .detail-header h3{color:#fff;margin:0;font-size:1rem}.admin-detail-panel .detail-content{padding:20px;overflow-y:auto;flex:1}.admin-detail-panel .close-detail-btn{background:none;border:none;color:#718096;cursor:pointer;font-size:1.25rem;padding:4px 8px;border-radius:4px}.admin-detail-panel .close-detail-btn:hover{background:#2d3748;color:#fff}.admin-page{padding:24px}.user-cell{display:flex;flex-direction:column;gap:4px}.user-name{font-weight:500;color:#fff}.user-email{color:#718096;font-size:.875rem}.badge{padding:4px 8px;border-radius:4px;font-size:.75rem;font-weight:500;text-transform:uppercase}.badge.admin{background:#9f7aea20;color:#b794f4}.badge.user{background:#4299e120;color:#63b3ed}.badge.active{background:#48bb7820;color:#68d391}.badge.inactive{background:#f5656520;color:#fc8181}.badge.subscription{background:#ed8936;color:#fff}.badge.subscription.free{background:#718096}.badge.subscription.pro{background:#e68a2e}.badge.subscription.premium{background:#9f7aea}.action-buttons{display:flex;gap:8px}.btn-small{padding:6px 10px;border-radius:4px;border:none;background:#2d3748;color:#fff;cursor:pointer;transition:all .2s;font-size:.875rem}.btn-small:hover{background:#e68a2e}.btn-small.btn-danger:hover{background:#e53e3e}.btn-small.btn-success:hover{background:#48bb78}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.dialog-content{background:#1a1f26;border:1px solid #2d3748;border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #2d3748}.dialog-header h2{color:#fff;margin:0;font-size:1.25rem}.close-btn{background:none;border:none;color:#718096;font-size:1.5rem;cursor:pointer;padding:0;line-height:1}.close-btn:hover{color:#fff}.dialog-content form{padding:24px}.form-group{margin-bottom:20px}.form-group label{display:block;color:#a0aec0;font-size:.875rem;margin-bottom:8px}.form-group input,.form-group select{width:100%;padding:10px 12px;border-radius:6px;border:1px solid #2d3748;background:#0f1419;color:#fff;font-size:.95rem}.form-group input:focus,.form-group select:focus{outline:none;border-color:#e68a2e}.form-group input:disabled{opacity:.6;cursor:not-allowed}.form-group.checkbox label{display:flex;align-items:center;gap:8px;cursor:pointer}.form-group.checkbox input{width:auto}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;padding-top:16px;border-top:1px solid #2d3748;margin-top:8px}.btn-primary,.btn-secondary{padding:10px 20px;border-radius:6px;font-size:.95rem;cursor:pointer;transition:all .2s}.btn-primary{background:#e68a2e;border:none;color:#fff}.btn-primary:hover{background:#cc7a28}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:none;border:1px solid #2d3748;color:#a0aec0}.btn-secondary:hover{border-color:#718096;color:#fff}.loading-spinner{display:flex;align-items:center;justify-content:center;min-height:300px;color:#718096;font-size:1.1rem}.error-message{background:#e53e3e20;border:1px solid #e53e3e40;border-radius:8px;padding:20px;color:#fc8181;text-align:center}.error-message h3{margin:0 0 8px;color:#fc8181}.error-message p{margin:0 0 16px}.error-message button{padding:8px 16px;border-radius:6px;background:#e53e3e;border:none;color:#fff;cursor:pointer}.credit-monitoring .page-description{color:#a0aec0;font-size:.95rem;margin-top:8px}.credit-monitoring .summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}.credit-monitoring .summary-card{background:#1a1f26;border:1px solid #2d3748;border-radius:12px;padding:20px;display:flex;align-items:center;gap:16px}.credit-monitoring .card-icon{font-size:2rem}.credit-monitoring .card-value{font-size:1.75rem;font-weight:700;color:#e68a2e}.credit-monitoring .card-label{font-size:.85rem;color:#a0aec0;margin-top:4px}.credit-monitoring .error-banner{background:#e53e3e26;border:1px solid rgba(229,62,62,.3);border-radius:8px;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;color:#fc8181}.credit-monitoring .error-banner button{background:#e53e3e;color:#fff;border:none;padding:6px 12px;border-radius:6px;cursor:pointer}.credit-monitoring .master-detail-layout{display:grid;grid-template-columns:350px 1fr;gap:24px;min-height:500px}.credit-monitoring .master-panel{background:#1a1f26;border:1px solid #2d3748;border-radius:12px;overflow:hidden;display:flex;flex-direction:column}.credit-monitoring .panel-header{padding:16px 20px;border-bottom:1px solid #2d3748}.credit-monitoring .panel-header h2{color:#fff;margin:0 0 12px;font-size:1.1rem}.credit-monitoring .panel-controls .search-input{width:100%}.credit-monitoring .sort-controls{display:flex;padding:12px 20px;gap:8px;border-bottom:1px solid #2d3748;background:#2d37484d}.credit-monitoring .sort-select{flex:1;padding:8px 12px;border-radius:6px;border:1px solid #2d3748;background:#0f1419;color:#fff;font-size:.875rem}.credit-monitoring .sort-order-btn{width:36px;height:36px;border-radius:6px;border:1px solid #2d3748;background:#0f1419;color:#fff;cursor:pointer;font-size:1.1rem}.credit-monitoring .sort-order-btn:hover{background:#2d3748}.credit-monitoring .user-list{flex:1;overflow-y:auto;max-height:450px}.credit-monitoring .user-item{padding:14px 20px;border-bottom:1px solid #2d3748;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:all .2s}.credit-monitoring .user-item:hover{background:#2d374880}.credit-monitoring .user-item.selected{background:#e68a2e26;border-left:3px solid #E68A2E}.credit-monitoring .user-info .user-name{color:#fff;font-weight:500;font-size:.95rem}.credit-monitoring .user-info .user-email{color:#718096;font-size:.8rem;margin-top:2px}.credit-monitoring .user-stats{text-align:right}.credit-monitoring .credit-balance{font-weight:600;font-size:.95rem}.credit-monitoring .credit-balance.has-credits{color:#48bb78}.credit-monitoring .credit-balance.no-credits{color:#718096}.credit-monitoring .credit-used{color:#718096;font-size:.75rem;margin-top:2px}.credit-monitoring .empty-state{padding:40px 20px;text-align:center;color:#718096}.credit-monitoring .detail-panel{background:#1a1f26;border:1px solid #2d3748;border-radius:12px;overflow:hidden}.credit-monitoring .empty-detail{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:400px;color:#718096}.credit-monitoring .empty-icon{font-size:4rem;margin-bottom:16px;opacity:.5}.credit-monitoring .empty-text{font-size:1rem}.credit-monitoring .detail-header{padding:20px 24px;border-bottom:1px solid #2d3748;display:flex;justify-content:space-between;align-items:center;background:#2d37484d}.credit-monitoring .user-detail-info h2{color:#fff;margin:0;font-size:1.25rem}.credit-monitoring .user-detail-info .user-email{color:#718096;font-size:.875rem;margin-top:4px}.credit-monitoring .grant-btn{background:#e68a2e;color:#fff;border:none;padding:10px 16px;border-radius:8px;cursor:pointer;font-weight:500;transition:all .2s}.credit-monitoring .grant-btn:hover{background:#cc7a28}.credit-monitoring .credit-overview{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:20px 24px;background:#2d374833}.credit-monitoring .credit-stat{text-align:center;padding:12px;background:#0003;border-radius:8px}.credit-monitoring .stat-label{color:#a0aec0;font-size:.75rem;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.credit-monitoring .stat-value{font-size:1.5rem;font-weight:700;color:#fff}.credit-monitoring .stat-value.positive{color:#48bb78}.credit-monitoring .stat-value.zero{color:#718096}.credit-monitoring .detail-tabs{display:flex;padding:0 24px;border-bottom:1px solid #2d3748;background:#2d37481a}.credit-monitoring .tab-btn{padding:14px 20px;background:none;border:none;color:#a0aec0;cursor:pointer;font-size:.9rem;border-bottom:2px solid transparent;transition:all .2s}.credit-monitoring .tab-btn:hover{color:#fff}.credit-monitoring .tab-btn.active{color:#e68a2e;border-bottom-color:#e68a2e}.credit-monitoring .tab-content{padding:20px 24px;min-height:200px;max-height:300px;overflow-y:auto}.credit-monitoring .loading-state,.credit-monitoring .empty-tab{padding:40px;text-align:center;color:#718096}.credit-monitoring .credits-cell{font-weight:600;color:#48bb78}.credit-monitoring .credits-cell.negative{color:#f56565}.credit-monitoring .status-badge{padding:4px 8px;border-radius:4px;font-size:.7rem;font-weight:600;text-transform:uppercase}.credit-monitoring .status-badge.completed{background:#48bb7833;color:#48bb78}.credit-monitoring .status-badge.pending{background:#ecc94b33;color:#ecc94b}.credit-monitoring .status-badge.failed{background:#f5656533;color:#f56565}.credit-monitoring .activity-info{padding:16px 24px;border-top:1px solid #2d3748;display:flex;gap:32px;background:#2d374833}.credit-monitoring .activity-item{display:flex;gap:8px;font-size:.85rem}.credit-monitoring .activity-label{color:#718096}.credit-monitoring .activity-value{color:#e2e8f0}.credit-monitoring .modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.credit-monitoring .modal-content{background:#1a1f26;border:1px solid #2d3748;border-radius:12px;width:100%;max-width:450px}.credit-monitoring .modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #2d3748}.credit-monitoring .modal-header h3{color:#fff;margin:0;font-size:1.1rem}.credit-monitoring .modal-body{padding:24px}.credit-monitoring .modal-info{color:#a0aec0;margin-bottom:20px}.credit-monitoring .modal-info strong{color:#fff}.credit-monitoring .form-input{width:100%;padding:10px 12px;border-radius:6px;border:1px solid #2d3748;background:#0f1419;color:#fff;font-size:1rem}.credit-monitoring .form-input:focus{outline:none;border-color:#e68a2e}.credit-monitoring .quick-amounts{display:flex;gap:8px;margin-top:12px;margin-bottom:20px}.credit-monitoring .quick-amount-btn{flex:1;padding:8px;border-radius:6px;border:1px solid #2d3748;background:#0f1419;color:#a0aec0;cursor:pointer;transition:all .2s}.credit-monitoring .quick-amount-btn:hover{background:#2d3748;color:#fff}.credit-monitoring .quick-amount-btn.selected{background:#e68a2e;border-color:#e68a2e;color:#fff}.credit-monitoring .form-textarea{width:100%;padding:10px 12px;border-radius:6px;border:1px solid #2d3748;background:#0f1419;color:#fff;font-size:.9rem;resize:vertical}.credit-monitoring .form-textarea:focus{outline:none;border-color:#e68a2e}.credit-monitoring .modal-footer{padding:16px 24px;border-top:1px solid #2d3748;display:flex;justify-content:flex-end;gap:12px}.credit-monitoring .btn{padding:10px 20px;border-radius:6px;font-size:.95rem;cursor:pointer;transition:all .2s}.credit-monitoring .btn-secondary{background:none;border:1px solid #2d3748;color:#a0aec0}.credit-monitoring .btn-secondary:hover{border-color:#718096;color:#fff}.credit-monitoring .btn-primary{background:#e68a2e;border:none;color:#fff}.credit-monitoring .btn-primary:hover{background:#cc7a28}.credit-monitoring .btn-primary:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 900px){.credit-monitoring .master-detail-layout{grid-template-columns:1fr}.credit-monitoring .credit-overview{grid-template-columns:repeat(2,1fr)}}@media (max-width: 1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}.stat-card.wide{grid-column:span 1}}@media (max-width: 768px){.admin-layout{flex-direction:column}.admin-sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid #2d3748}.sidebar-nav{display:flex;flex-wrap:wrap;gap:4px;padding:8px}.nav-item{padding:8px 12px}.stats-grid,.form-row{grid-template-columns:1fr}.table-container{overflow-x:auto}}.token-monitoring{color:#e2e8f0;padding-bottom:40px;min-height:100vh;overflow-y:auto}.token-monitoring .master-detail-layout{min-height:calc(100vh - 320px)}.token-monitoring .user-list-panel{background:#1a1f26;border:1px solid #2d3748;border-radius:12px;padding:16px;display:flex;flex-direction:column}.token-monitoring .user-list{max-height:calc(100vh - 400px);overflow-y:auto}.token-monitoring .user-list-item{color:#e2e8f0}.token-monitoring .user-list-item .user-name,.token-monitoring .user-list-item>div>div>div:first-child{color:#fff;font-weight:600}.token-monitoring .user-list-item .user-email,.token-monitoring .user-list-item>div>div>div:nth-child(2){color:#a0aec0}.token-monitoring .user-list::-webkit-scrollbar,.token-monitoring .detail-panel::-webkit-scrollbar{width:8px}.token-monitoring .user-list::-webkit-scrollbar-track,.token-monitoring .detail-panel::-webkit-scrollbar-track{background:#0f1419;border-radius:4px}.token-monitoring .user-list::-webkit-scrollbar-thumb,.token-monitoring .detail-panel::-webkit-scrollbar-thumb{background:#4a5568;border-radius:4px}.token-monitoring .user-list::-webkit-scrollbar-thumb:hover,.token-monitoring .detail-panel::-webkit-scrollbar-thumb:hover{background:#718096}.token-monitoring .detail-panel>div:last-child{overflow-y:auto}.token-monitoring .detail-panel h2,.token-monitoring .detail-panel h3,.token-monitoring .detail-panel h4,.token-monitoring .detail-panel span,.token-monitoring .detail-panel div{color:#e2e8f0}.token-monitoring .detail-panel .usage-tab h3,.token-monitoring .detail-panel .plan-tab h3,.token-monitoring .detail-panel .features-tab h3,.token-monitoring .detail-panel .credits-tab h3{color:#fff}.admin-page.full-width{max-width:100%;padding:24px;height:100%;overflow:hidden}.table-container.full-width{max-width:100%}.full-width-table{width:100%;table-layout:auto}.row-number{width:50px;text-align:center;color:#718096;font-size:.75rem;font-weight:500}th.row-number{background:#1a1f26}.user-cell-inline{display:flex;align-items:center;gap:8px;white-space:nowrap}.user-cell-inline .user-name{font-weight:500;color:#fff;font-size:.85rem}.user-cell-inline .user-email{color:#718096;font-size:.75rem}.location-cell,.device-cell{font-size:.8rem;color:#a0aec0;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.login-count{text-align:center;font-weight:500;color:#e68a2e}.data-table tbody tr.selected{background:#e68a2e26;border-left:3px solid #E68A2E}.panel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:50}.admin-detail-panel{width:450px;box-shadow:-4px 0 20px #0000004d}.detail-section{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid #2d3748}.detail-section:last-child{border-bottom:none;margin-bottom:0}.detail-section h4{color:#e68a2e;font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin:0 0 16px}.info-grid{display:flex;flex-direction:column;gap:12px}.info-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.info-label{color:#718096;font-size:.85rem;flex-shrink:0}.info-value{color:#e2e8f0;font-size:.85rem;text-align:right}.info-value.mono{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.8rem;color:#a0aec0}.edit-form .form-group{margin-bottom:16px}.edit-form .form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:16px}.login-history-list{display:flex;flex-direction:column;gap:12px}.history-entry{background:#0003;border-radius:8px;padding:12px;border-left:3px solid #718096}.history-entry.success{border-left-color:#48bb78}.history-entry.failed{border-left-color:#f56565}.history-main{display:flex;align-items:center;gap:8px;margin-bottom:6px}.history-status{font-weight:700;font-size:.9rem}.history-status.success{color:#48bb78}.history-status.failed{color:#f56565}.history-date{color:#a0aec0;font-size:.8rem}.history-details{display:flex;gap:12px;font-size:.8rem;margin-bottom:4px}.history-ip{color:#718096;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.history-location{color:#a0aec0}.history-device{color:#718096;font-size:.75rem}.history-error{color:#f56565;font-size:.75rem;margin-top:4px;font-style:italic}.detail-section .loading-state,.detail-section .empty-state{padding:20px;text-align:center;color:#718096;font-size:.85rem}.mono{font-family:Monaco,Menlo,Ubuntu Mono,monospace}.projects-admin{display:flex;height:100%;width:100%;position:relative;overflow:hidden}.projects-admin-content{flex:1;display:flex;flex-direction:column;padding:20px;overflow:hidden;height:100%;min-height:0;transition:margin-right .3s ease}.projects-admin.panel-open .projects-admin-content{margin-right:400px}.admin-header{margin-bottom:20px}.admin-header h1{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-size:24px;font-weight:600;color:var(--admin-text, #fff)}.admin-header h1 svg{opacity:.8}.admin-subtitle{margin:0;font-size:14px;color:var(--admin-text-secondary, #888)}.projects-search-bar{display:flex;gap:16px;margin-bottom:20px;flex-wrap:wrap}.search-group{display:flex;align-items:center;gap:8px;background:var(--admin-bg-secondary, #1e1e2e);border:1px solid var(--admin-border, #333);border-radius:6px;padding:8px 12px;flex:1;min-width:200px}.search-group svg{color:var(--admin-text-secondary, #888);flex-shrink:0}.search-input{flex:1;background:transparent;border:none;color:var(--admin-text, #fff);font-size:14px;outline:none}.search-input::placeholder{color:var(--admin-text-secondary, #666)}.uuid-search{max-width:500px}.uuid-input{min-width:280px}.uuid-search-btn{background:var(--admin-primary, #4f8cff);color:#fff;border:none;border-radius:4px;padding:6px 12px;font-size:13px;cursor:pointer;white-space:nowrap;transition:background .2s}.uuid-search-btn:hover:not(:disabled){background:var(--admin-primary-hover, #3a7aee)}.uuid-search-btn:disabled{opacity:.5;cursor:not-allowed}.user-filter{min-width:180px;max-width:280px}.user-filter-select{flex:1;background:transparent;border:none;color:var(--admin-text, #fff);font-size:13px;outline:none;cursor:pointer}.user-filter-select option{background:var(--admin-bg-secondary, #1e1e2e);color:var(--admin-text, #fff)}.bulk-actions-bar{display:flex;justify-content:space-between;align-items:center;background:var(--admin-bg-tertiary, #252535);border:1px solid var(--admin-border, #333);border-radius:6px;padding:10px 16px;margin-bottom:16px}.selected-count{font-size:13px;color:var(--admin-text, #fff);font-weight:500}.bulk-buttons{display:flex;gap:10px}.bulk-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border:none;border-radius:4px;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s}.bulk-btn.lock{background:#ffaa0026;color:#fa0;border:1px solid rgba(255,170,0,.3)}.bulk-btn.lock:hover:not(:disabled){background:#ffaa0040}.bulk-btn.delete{background:#ff505026;color:#f66;border:1px solid rgba(255,80,80,.3)}.bulk-btn.delete:hover:not(:disabled){background:#ff505040}.bulk-btn:disabled{opacity:.5;cursor:not-allowed}.admin-success{display:flex;justify-content:space-between;align-items:center;background:#50c87826;border:1px solid rgba(80,200,120,.3);color:#50c878;padding:10px 16px;border-radius:6px;margin-bottom:16px;font-size:13px}.admin-success button{background:transparent;border:none;color:#50c878;font-size:18px;cursor:pointer;padding:0 4px}.admin-table-container{flex:1;overflow-y:auto;overflow-x:auto;min-height:0;background:var(--admin-bg-secondary, #1a1a2e);border-radius:8px;border:1px solid var(--admin-border, #333);position:relative}.admin-table{width:100%;border-collapse:collapse;font-size:13px}.admin-table thead{position:sticky;top:0;z-index:10}.admin-table th{background:var(--admin-bg-tertiary, #252535);color:var(--admin-text, #fff);font-weight:600;text-align:left;padding:12px 10px;border-bottom:1px solid var(--admin-border, #333);white-space:nowrap}.admin-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.admin-table th.sortable:hover{background:var(--admin-bg-hover, #2a2a3a)}.admin-table td{padding:10px;border-bottom:1px solid var(--admin-border, #333);color:var(--admin-text, #ddd)}.admin-table tbody tr{cursor:pointer;transition:background .15s}.admin-table tbody tr:hover{background:#4f8cff1a}.admin-table tbody tr.selected{background:#4f8cff33}.admin-loading,.admin-empty{display:flex;align-items:center;justify-content:center;padding:60px 20px;color:var(--admin-text-secondary, #888);font-size:14px}.admin-error{display:flex;justify-content:space-between;align-items:center;background:#ff646426;border:1px solid rgba(255,100,100,.3);color:#f88;padding:10px 16px;border-radius:6px;margin-bottom:16px;font-size:13px}.admin-error button{background:transparent;border:none;color:#f88;font-size:18px;cursor:pointer;padding:0 4px}.col-checkbox{width:40px;text-align:center;cursor:pointer}.col-checkbox svg{color:var(--admin-text-secondary, #666);transition:color .15s}.col-checkbox:hover svg{color:var(--admin-primary, #4f8cff)}.checkbox-icon.checked{color:var(--admin-primary, #4f8cff)}.col-row{width:40px;text-align:center;color:var(--admin-text-secondary, #666)}.col-status{width:80px}.status-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:4px;font-size:10px;font-weight:500;text-transform:uppercase}.status-badge.active{background:#50c87826;color:#50c878}.status-badge.locked{background:#ffaa0026;color:#fa0}.admin-table tbody tr.locked{background:#ffaa000d}.admin-table tbody tr.locked:hover{background:#ffaa001a}.col-id{width:60px}.col-uuid{width:180px}.col-name{min-width:150px;max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.col-type{width:100px}.col-user{min-width:150px;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.col-created{width:160px}.uuid-badge{display:inline-block;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:monospace;font-size:11px;background:var(--admin-bg-tertiary, #252535);padding:2px 6px;border-radius:3px;color:var(--admin-text-secondary, #aaa)}.type-badge{display:inline-block;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:500;text-transform:uppercase}.type-badge.whiteboard{background:#4f8cff26;color:#4f8cff}.type-badge.voicedub{background:#ff8c4f26;color:#ff8c4f}.type-badge.narrator{background:#8cff4f26;color:#8cff4f}.project-details-panel{position:fixed;top:0;right:-400px;width:400px;height:100vh;background:var(--admin-bg-secondary, #1a1a2e);border-left:1px solid var(--admin-border, #333);display:flex;flex-direction:column;transition:right .3s ease;z-index:100}.project-details-panel.open{right:0}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--admin-border, #333);background:var(--admin-bg-tertiary, #252535)}.panel-header h2{margin:0;font-size:16px;font-weight:600;color:var(--admin-text, #fff)}.close-btn{background:transparent;border:none;color:var(--admin-text-secondary, #888);cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:color .2s,background .2s}.close-btn:hover{color:var(--admin-text, #fff);background:#ffffff1a}.panel-content{flex:1;overflow-y:auto;padding:16px 20px}.panel-actions{display:flex;gap:10px;margin-bottom:20px}.action-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.action-btn.primary{background:var(--admin-primary, #4f8cff);color:#fff}.action-btn.primary:hover{background:var(--admin-primary-hover, #3a7aee);transform:translateY(-1px)}.action-btn svg:last-child{opacity:.7;margin-left:4px}.action-btn.lock{background:#ffaa0026;color:#fa0;border:1px solid rgba(255,170,0,.3)}.action-btn.lock:hover:not(:disabled){background:#ffaa0040}.action-btn.unlock{background:#50c87826;color:#50c878;border:1px solid rgba(80,200,120,.3)}.action-btn.unlock:hover:not(:disabled){background:#50c87840}.action-btn.delete{background:#ff505026;color:#f66;border:1px solid rgba(255,80,80,.3)}.action-btn.delete:hover:not(:disabled){background:#ff505040}.action-btn:disabled{opacity:.5;cursor:not-allowed}.lock-status-banner{display:flex;align-items:flex-start;gap:12px;background:#ffaa001a;border:1px solid rgba(255,170,0,.3);border-radius:6px;padding:12px 16px;margin-bottom:20px;color:#fa0}.lock-status-banner svg{flex-shrink:0;margin-top:2px}.lock-status-banner strong{display:block;margin-bottom:4px}.lock-status-banner p{margin:0 0 4px;font-size:13px;opacity:.9}.lock-status-banner small{font-size:11px;opacity:.7}.panel-loading,.panel-empty{display:flex;align-items:center;justify-content:center;height:200px;color:var(--admin-text-secondary, #888)}.detail-section{margin-bottom:24px}.detail-section h3{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--admin-text-secondary, #888);margin:0 0 12px;text-transform:uppercase;letter-spacing:.5px}.detail-section h3 svg{opacity:.7}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.detail-item{display:flex;flex-direction:column;gap:4px}.detail-item label{font-size:11px;color:var(--admin-text-secondary, #666);text-transform:uppercase;letter-spacing:.5px}.detail-item span{font-size:14px;color:var(--admin-text, #fff)}.uuid-value{font-family:monospace;font-size:12px;word-break:break-all}.prompt-box{background:var(--admin-bg-tertiary, #252535);border:1px solid var(--admin-border, #333);border-radius:6px;padding:12px;font-size:13px;color:var(--admin-text, #ddd);line-height:1.5;max-height:150px;overflow-y:auto}.scripts-info{display:flex;flex-direction:column;gap:8px}.script-item{background:var(--admin-bg-tertiary, #252535);border:1px solid var(--admin-border, #333);border-radius:4px;padding:8px 12px;font-size:13px;color:var(--admin-text-secondary, #aaa)}.admin-pagination{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-top:1px solid var(--admin-border, #333);margin-top:16px}.pagination-info{font-size:13px;color:var(--admin-text-secondary, #888)}.pagination-controls{display:flex;align-items:center;gap:8px}.pagination-btn{background:var(--admin-bg-secondary, #252535);border:1px solid var(--admin-border, #333);color:var(--admin-text, #fff);border-radius:4px;padding:6px 10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.pagination-btn:hover:not(:disabled){background:var(--admin-bg-tertiary, #2a2a3a)}.pagination-btn:disabled{opacity:.4;cursor:not-allowed}.pagination-page{font-size:13px;color:var(--admin-text, #fff);padding:0 12px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:var(--admin-bg-secondary, #1a1a2e);border:1px solid var(--admin-border, #333);border-radius:8px;padding:24px;width:100%;max-width:420px;max-height:80vh;overflow-y:auto}.modal-content h3{display:flex;align-items:center;gap:10px;margin:0 0 16px;font-size:18px;font-weight:600;color:var(--admin-text, #fff)}.modal-content p{margin:0 0 8px;font-size:14px;color:var(--admin-text, #ddd)}.modal-content .modal-subtitle{font-size:12px;color:var(--admin-text-secondary, #888);margin-bottom:16px}.modal-content .delete-warning{color:#f66}.modal-input{margin-bottom:20px}.modal-input label{display:block;font-size:12px;color:var(--admin-text-secondary, #888);margin-bottom:8px}.modal-input textarea{width:100%;background:var(--admin-bg-tertiary, #252535);border:1px solid var(--admin-border, #333);border-radius:6px;padding:10px 12px;font-size:13px;color:var(--admin-text, #fff);resize:vertical;font-family:inherit}.modal-input textarea::placeholder{color:var(--admin-text-secondary, #666)}.modal-input textarea:focus{outline:none;border-color:var(--admin-primary, #4f8cff)}.modal-actions{display:flex;gap:10px;justify-content:flex-end}.modal-btn{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.modal-btn.cancel{background:var(--admin-bg-tertiary, #252535);color:var(--admin-text, #fff);border:1px solid var(--admin-border, #333)}.modal-btn.cancel:hover:not(:disabled){background:var(--admin-bg-hover, #2a2a3a)}.modal-btn.confirm.lock{background:#fa0;color:#000}.modal-btn.confirm.lock:hover:not(:disabled){background:#fb3}.modal-btn.confirm.delete{background:#f55;color:#fff}.modal-btn.confirm.delete:hover:not(:disabled){background:#f77}.modal-btn:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 900px){.projects-admin.panel-open .projects-admin-content{margin-right:0}.project-details-panel{width:100%;right:-100%}.projects-search-bar{flex-direction:column}.uuid-search,.user-filter{max-width:none}}:root{--dc-bg-primary: #1a1b26;--dc-bg-secondary: #1f2937;--dc-bg-surface: #24283b;--dc-bg-elevated: #2a2e3f;--dc-bg-hover: #2f3347;--dc-bg-active: #343a52;--dc-border: #3b4261;--dc-border-subtle: #2d3250;--dc-text-primary: #e2e8f0;--dc-text-secondary: #94a3b8;--dc-text-muted: #64748b;--dc-text-dim: #475569;--dc-accent: #60a5fa;--dc-accent-hover: #93c5fd;--dc-accent-dim: #3b82f6;--dc-accent-bg: rgba(96, 165, 250, .1);--dc-success: #34d399;--dc-success-dim: #059669;--dc-success-bg: rgba(52, 211, 153, .1);--dc-error: #f87171;--dc-error-dim: #dc2626;--dc-error-bg: rgba(248, 113, 113, .08);--dc-warning: #fbbf24;--dc-warning-bg: rgba(251, 191, 36, .08);--dc-purple: #a78bfa;--dc-purple-bg: rgba(167, 139, 250, .1);--dc-orange: #fb923c;--dc-font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", "Consolas", monospace;--dc-font-sans: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", sans-serif;--dc-radius-sm: 4px;--dc-radius-md: 6px;--dc-radius-lg: 8px;--dc-radius-xl: 12px;--dc-shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--dc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--dc-shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--dc-transition: .15s ease}.dc-root{display:flex;height:100vh;width:100vw;position:fixed;top:0;left:0;background-color:var(--dc-bg-primary);color:var(--dc-text-primary);font-family:var(--dc-font-sans);overflow:hidden;z-index:1}.dc-root>*{background-color:var(--dc-bg-primary)}.dc-sidebar{width:56px;display:flex;flex-direction:column;background-color:var(--dc-bg-secondary);border-right:1px solid var(--dc-border-subtle);padding:8px 0;gap:2px;align-items:center;flex-shrink:0}.dc-sidebar-tab{width:42px;height:42px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:none;background:transparent;color:var(--dc-text-muted);cursor:pointer;border-radius:var(--dc-radius-md);transition:all var(--dc-transition);position:relative}.dc-sidebar-tab:hover{color:var(--dc-text-secondary);background-color:var(--dc-bg-hover)}.dc-sidebar-tab.active{color:var(--dc-accent);background-color:var(--dc-accent-bg)}.dc-sidebar-tab.active:before{content:"";position:absolute;left:-4px;top:50%;transform:translateY(-50%);width:3px;height:20px;background-color:var(--dc-accent);border-radius:0 2px 2px 0}.dc-sidebar-tab-label{font-size:.58rem;font-weight:500;letter-spacing:.02em;white-space:nowrap}.dc-sidebar-spacer{flex:1}.dc-sidebar-nav-btn{width:42px;height:34px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border:none;background:transparent;color:var(--dc-text-dim);cursor:pointer;border-radius:var(--dc-radius-sm);transition:all var(--dc-transition);font-size:.5rem;font-weight:500}.dc-sidebar-nav-btn:hover{color:var(--dc-text-secondary);background-color:var(--dc-bg-hover)}.dc-sidebar-status{width:8px;height:8px;border-radius:50%;background-color:var(--dc-success);margin:6px 0 8px;box-shadow:0 0 6px #34d39966}.dc-main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;background-color:var(--dc-bg-primary)}.dc-header{display:flex;align-items:center;padding:7px 16px;background-color:var(--dc-bg-secondary);border-bottom:1px solid var(--dc-border-subtle);gap:12px;flex-shrink:0}.dc-header-title{font-size:.86rem;font-weight:600;color:var(--dc-text-primary);display:flex;align-items:center;gap:8px}.dc-header-badge{font-size:.63rem;padding:2px 8px;border-radius:10px;background-color:var(--dc-success-bg);color:var(--dc-success);font-weight:500}.dc-header-info{margin-left:auto;font-size:.7rem;color:var(--dc-text-muted)}.dc-keygate{display:flex;align-items:center;justify-content:center;height:100%;width:100%;background-color:var(--dc-bg-primary)}.dc-keygate-card{padding:36px;background-color:var(--dc-bg-surface);border-radius:var(--dc-radius-xl);border:1px solid var(--dc-border);box-shadow:var(--dc-shadow-lg);width:360px;text-align:center}.dc-keygate-icon{width:52px;height:52px;border-radius:50%;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--dc-accent-dim) 0%,var(--dc-accent) 100%);box-shadow:0 4px 16px #60a5fa4d}.dc-keygate-title{font-size:1.2rem;font-weight:700;color:var(--dc-text-primary);margin-bottom:4px}.dc-keygate-subtitle{font-size:.8rem;color:var(--dc-text-muted);margin-bottom:20px}.dc-keygate-input{width:100%;padding:10px 14px;font-size:.88rem;font-family:var(--dc-font-mono);background-color:var(--dc-bg-primary);border:1px solid var(--dc-border);border-radius:var(--dc-radius-md);color:var(--dc-text-primary);outline:none;margin-bottom:10px;box-sizing:border-box;transition:border-color var(--dc-transition)}.dc-keygate-input:focus{border-color:var(--dc-accent);box-shadow:0 0 0 2px #60a5fa26}.dc-keygate-input.error{border-color:var(--dc-error)}.dc-keygate-error{font-size:.76rem;color:var(--dc-error);margin-bottom:8px}.dc-keygate-btn{width:100%;padding:10px;font-size:.86rem;font-weight:600;background:linear-gradient(135deg,var(--dc-accent-dim) 0%,var(--dc-accent) 100%);color:#fff;border:none;border-radius:var(--dc-radius-md);cursor:pointer;transition:all var(--dc-transition)}.dc-keygate-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #60a5fa4d}.dc-keygate-btn:disabled{opacity:.5;cursor:not-allowed}.dc-sql-layout{display:flex;height:100%;background-color:var(--dc-bg-primary)}.dc-sql-left{flex:3;display:flex;flex-direction:column;min-width:0;background-color:var(--dc-bg-primary)}.dc-sql-right{width:28%;min-width:260px;max-width:400px;border-left:1px solid var(--dc-border-subtle);background-color:var(--dc-bg-primary)}.dc-editor-wrapper{display:flex;flex-direction:column;height:100%}.dc-editor-toolbar{display:flex;justify-content:space-between;align-items:center;padding:6px 12px;background-color:var(--dc-bg-surface);border-bottom:1px solid var(--dc-border-subtle)}.dc-editor-toolbar-left{display:flex;align-items:center;gap:8px;font-size:.76rem;color:var(--dc-text-muted)}.dc-editor-toolbar-right{display:flex;align-items:center;gap:10px}.dc-editor-time{font-size:.7rem;color:var(--dc-success);font-family:var(--dc-font-mono)}.dc-editor-hint{font-size:.68rem;color:var(--dc-text-dim)}.dc-editor-execute-btn{padding:5px 14px;font-size:.73rem;font-weight:600;background-color:var(--dc-accent-dim);color:#fff;border:none;border-radius:var(--dc-radius-sm);cursor:pointer;transition:all var(--dc-transition);display:flex;align-items:center;gap:4px}.dc-editor-execute-btn:hover:not(:disabled){background-color:var(--dc-accent)}.dc-editor-execute-btn:disabled{opacity:.4;cursor:not-allowed}.dc-editor-textarea{flex:1;resize:none;border:none;outline:none;padding:12px 14px;font-family:var(--dc-font-mono);font-size:.86rem;line-height:1.6;background-color:var(--dc-bg-primary);color:var(--dc-text-primary);-moz-tab-size:2;tab-size:2}.dc-editor-textarea::placeholder{color:var(--dc-text-dim)}.dc-editor-error{padding:6px 12px;background-color:var(--dc-error-bg);border-top:1px solid rgba(248,113,113,.2);font-size:.73rem;font-family:var(--dc-font-mono);color:var(--dc-error);max-height:80px;overflow:auto;white-space:pre-wrap}.dc-error-action-bar{padding:4px 12px;background-color:var(--dc-bg-surface);border-bottom:1px solid var(--dc-border-subtle);display:flex;justify-content:flex-end}.dc-error-ai-btn{padding:4px 10px;font-size:.68rem;font-weight:500;border:1px solid var(--dc-warning);border-radius:var(--dc-radius-sm);background-color:var(--dc-warning-bg);color:var(--dc-warning);cursor:pointer;transition:all var(--dc-transition)}.dc-error-ai-btn:hover{background-color:#fbbf2426}.dc-grid-wrapper{display:flex;flex-direction:column;height:100%;background-color:var(--dc-bg-primary)}.dc-grid-toolbar{display:flex;justify-content:space-between;align-items:center;padding:5px 12px;background-color:var(--dc-bg-surface);border-bottom:1px solid var(--dc-border-subtle);font-size:.7rem}.dc-grid-row-count{color:var(--dc-text-muted)}.dc-grid-actions{display:flex;gap:8px;align-items:center}.dc-grid-btn{display:flex;align-items:center;gap:3px;padding:4px 9px;font-size:.68rem;border:1px solid var(--dc-border);border-radius:var(--dc-radius-sm);background-color:var(--dc-bg-elevated);color:var(--dc-text-secondary);cursor:pointer;transition:all var(--dc-transition)}.dc-grid-btn:hover{background-color:var(--dc-bg-hover);border-color:var(--dc-text-muted)}.dc-grid-btn:disabled{opacity:.4;cursor:not-allowed}.dc-grid-page-info{font-size:.68rem;color:var(--dc-text-muted);font-family:var(--dc-font-mono)}.dc-grid-search-bar{display:flex;align-items:center;padding:5px 12px;gap:8px;background-color:var(--dc-bg-elevated);border-bottom:1px solid var(--dc-border-subtle)}.dc-grid-search-input{flex:1;padding:5px 10px 5px 28px;font-size:.76rem;border:1px solid var(--dc-border);border-radius:var(--dc-radius-sm);background-color:var(--dc-bg-primary);color:var(--dc-text-primary);outline:none;max-width:300px;transition:border-color var(--dc-transition)}.dc-grid-search-input:focus{border-color:var(--dc-accent)}.dc-grid-search-input::placeholder{color:var(--dc-text-dim)}.dc-grid-search-wrapper{position:relative;flex:1;max-width:300px}.dc-grid-search-icon{position:absolute;left:8px;top:50%;transform:translateY(-50%);color:var(--dc-text-dim)}.dc-grid-search-count{font-size:.66rem;color:var(--dc-text-muted);font-family:var(--dc-font-mono);white-space:nowrap}.dc-export-wrapper{position:relative}.dc-export-menu{position:absolute;top:100%;right:0;margin-top:4px;background-color:var(--dc-bg-surface);border:1px solid var(--dc-border);border-radius:var(--dc-radius-md);box-shadow:var(--dc-shadow-md);z-index:100;min-width:160px;overflow:hidden}.dc-export-menu-item{display:flex;align-items:center;gap:8px;width:100%;padding:7px 12px;font-size:.73rem;border:none;background:transparent;color:var(--dc-text-secondary);cursor:pointer;text-align:left;transition:all var(--dc-transition)}.dc-export-menu-item:hover{background-color:var(--dc-bg-hover);color:var(--dc-text-primary)}.dc-export-menu-divider{height:1px;background-color:var(--dc-border-subtle);margin:2px 0}.dc-grid-table{width:100%;border-collapse:collapse}.dc-grid-table thead{position:sticky;top:0;z-index:1}.dc-grid-table th{padding:6px 10px;font-size:.73rem;font-weight:600;color:var(--dc-text-secondary);text-align:left;background-color:var(--dc-bg-surface);border-bottom:1px solid var(--dc-border);white-space:nowrap;-webkit-user-select:none;user-select:none;cursor:pointer;transition:color var(--dc-transition)}.dc-grid-table th:hover{color:var(--dc-text-primary)}.dc-grid-table th .sort-icon{opacity:.6;margin-left:2px}.dc-grid-table td{padding:5px 10px;font-size:.73rem;color:var(--dc-text-secondary);border-bottom:1px solid var(--dc-border-subtle);max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--dc-font-mono)}.dc-grid-table tbody tr{transition:background-color var(--dc-transition)}.dc-grid-table tbody tr:hover{background-color:var(--dc-bg-hover)}.dc-grid-table tbody tr:nth-child(2n){background-color:#24283b66}.dc-grid-table td.null-value{color:var(--dc-text-dim);font-style:italic}.dc-grid-table td.bool-true{color:var(--dc-success)}.dc-grid-table td.bool-false{color:var(--dc-error);opacity:.6}.dc-grid-empty{padding:40px 20px;text-align:center;color:var(--dc-text-dim);font-size:.83rem}.dc-grid-loading{padding:30px;text-align:center;color:var(--dc-accent);font-size:.8rem}.dc-chat-wrapper{display:flex;flex-direction:column;height:100%;background-color:var(--dc-bg-primary)}.dc-chat-header{padding:8px 12px;display:flex;align-items:center;gap:10px;background-color:var(--dc-bg-surface);border-bottom:1px solid var(--dc-border-subtle)}.dc-chat-avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--dc-accent-dim) 0%,var(--dc-purple) 100%)}.dc-chat-title{font-size:.83rem;font-weight:600;color:var(--dc-text-primary);line-height:1.2}.dc-chat-subtitle{font-size:.66rem;color:var(--dc-text-muted)}.dc-chat-messages{flex:1;overflow:auto;padding:10px;display:flex;flex-direction:column;gap:10px}.dc-chat-empty{padding:24px;text-align:center}.dc-chat-empty-icon{margin-bottom:8px;opacity:.3}.dc-chat-empty-title{font-size:.8rem;color:var(--dc-text-secondary);font-weight:500;margin-bottom:4px}.dc-chat-empty-subtitle{font-size:.7rem;color:var(--dc-text-dim)}.dc-chat-msg{display:flex;gap:8px;align-items:flex-start}.dc-chat-msg.user{flex-direction:row-reverse}.dc-chat-msg-avatar{width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;margin-top:2px}.dc-chat-msg.user .dc-chat-msg-avatar{background-color:var(--dc-accent-dim)}.dc-chat-msg.assistant .dc-chat-msg-avatar{background-color:var(--dc-bg-elevated);border:1px solid var(--dc-border)}.dc-chat-msg-body{max-width:85%;display:flex;flex-direction:column;gap:4px}.dc-chat-bubble{padding:8px 11px;border-radius:var(--dc-radius-lg);word-break:break-word}.dc-chat-msg.user .dc-chat-bubble{background-color:var(--dc-accent-dim);color:#fff;border-top-right-radius:2px}.dc-chat-msg.assistant .dc-chat-bubble{background-color:var(--dc-bg-surface);color:var(--dc-text-primary);border:1px solid var(--dc-border-subtle);border-top-left-radius:2px}.dc-chat-bubble p{font-size:.8rem;line-height:1.55;margin:2px 0}.dc-chat-bubble code{font-family:var(--dc-font-mono);font-size:.74rem;background-color:var(--dc-bg-primary);padding:1px 5px;border-radius:3px;color:var(--dc-accent)}.dc-chat-bubble pre{margin:6px 0;padding:8px 10px;background-color:var(--dc-bg-primary);border-radius:var(--dc-radius-md);border:1px solid var(--dc-border-subtle);font-family:var(--dc-font-mono);font-size:.74rem;color:var(--dc-text-primary);white-space:pre-wrap;overflow-x:auto;line-height:1.5}.dc-chat-bubble h1,.dc-chat-bubble h2,.dc-chat-bubble h3{color:var(--dc-text-primary);margin:4px 0 2px}.dc-chat-bubble h1{font-size:.93rem}.dc-chat-bubble h2{font-size:.86rem}.dc-chat-bubble h3{font-size:.82rem}.dc-chat-bubble ul,.dc-chat-bubble ol{padding-left:16px;margin:3px 0}.dc-chat-bubble li{font-size:.8rem;line-height:1.5;margin-bottom:2px}.dc-chat-bubble table{border-collapse:collapse;width:100%;margin:4px 0;font-size:.73rem}.dc-chat-bubble th{border:1px solid var(--dc-border);padding:4px 7px;text-align:left;background-color:var(--dc-bg-elevated);font-weight:600}.dc-chat-bubble td{border:1px solid var(--dc-border-subtle);padding:4px 7px}.dc-chat-bubble strong{font-weight:600;color:var(--dc-accent-hover)}.dc-chat-actions{display:flex;gap:4px;align-items:center;margin-left:4px}.dc-chat-action-btn{padding:3px 5px;border:none;background:transparent;cursor:pointer;color:var(--dc-text-dim);border-radius:var(--dc-radius-sm);transition:all var(--dc-transition);display:flex;align-items:center}.dc-chat-action-btn:hover{color:var(--dc-text-secondary);background-color:var(--dc-bg-hover)}.dc-chat-apply-btn{display:flex;align-items:center;gap:3px;padding:4px 9px;font-size:.68rem;font-weight:600;background-color:var(--dc-success-dim);color:#fff;border:none;border-radius:var(--dc-radius-sm);cursor:pointer;transition:all var(--dc-transition)}.dc-chat-apply-btn:hover{background-color:var(--dc-success)}.dc-chat-typing{display:flex;gap:8px;align-items:flex-start}.dc-chat-typing-dots{padding:10px 12px;border-radius:var(--dc-radius-lg);background-color:var(--dc-bg-surface);border:1px solid var(--dc-border-subtle);border-top-left-radius:2px;display:flex;gap:4px;align-items:center}.dc-chat-typing-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background-color:var(--dc-accent);animation:dc-bounce 1.4s ease-in-out infinite}.dc-chat-typing-dot:nth-child(2){animation-delay:.16s}.dc-chat-typing-dot:nth-child(3){animation-delay:.32s}@keyframes dc-bounce{0%,80%,to{transform:translateY(0);opacity:.4}40%{transform:translateY(-4px);opacity:1}}.dc-chat-input-area{padding:10px;border-top:1px solid var(--dc-border-subtle);display:flex;gap:6px;align-items:flex-end;background-color:var(--dc-bg-surface)}.dc-chat-textarea{flex:1;resize:none;border:1px solid var(--dc-border);border-radius:var(--dc-radius-lg);padding:8px 12px;font-size:.8rem;font-family:var(--dc-font-sans);outline:none;background-color:var(--dc-bg-primary);color:var(--dc-text-primary);line-height:1.45;min-height:60px;max-height:140px;transition:border-color var(--dc-transition)}.dc-chat-textarea:focus{border-color:var(--dc-accent)}.dc-chat-textarea::placeholder{color:var(--dc-text-dim)}.dc-chat-mic-btn{padding:7px;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--dc-transition)}.dc-chat-mic-btn.idle{background:transparent;color:var(--dc-text-dim)}.dc-chat-mic-btn.idle:hover{color:var(--dc-text-secondary)}.dc-chat-mic-btn.recording{background-color:var(--dc-error-dim);color:#fff;animation:dc-pulse 1.5s ease-in-out infinite}@keyframes dc-pulse{0%,to{box-shadow:0 0 #dc262666}50%{box-shadow:0 0 0 6px #dc262600}}.dc-chat-send-btn{padding:7px;border:none;border-radius:var(--dc-radius-md);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--dc-transition)}.dc-chat-send-btn.active{background-color:var(--dc-accent-dim);color:#fff}.dc-chat-send-btn.active:hover{background-color:var(--dc-accent)}.dc-chat-send-btn.inactive{background-color:var(--dc-bg-elevated);color:var(--dc-text-dim);cursor:default}.dc-users-wrapper{display:flex;flex-direction:column;height:100%;background-color:var(--dc-bg-primary)}.dc-users-filters{padding:8px 14px;background-color:var(--dc-bg-surface);border-bottom:1px solid var(--dc-border-subtle);display:flex;gap:8px;align-items:center;flex-wrap:wrap}.dc-users-search{display:flex;align-items:center;gap:6px;position:relative}.dc-users-search-icon{position:absolute;left:8px;color:var(--dc-text-dim)}.dc-users-search input{padding:6px 10px 6px 28px;font-size:.78rem;border:1px solid var(--dc-border);border-radius:var(--dc-radius-sm);background-color:var(--dc-bg-primary);color:var(--dc-text-primary);width:200px;outline:none;transition:border-color var(--dc-transition)}.dc-users-search input:focus{border-color:var(--dc-accent)}.dc-users-search input::placeholder{color:var(--dc-text-dim)}.dc-filter-select{padding:6px 10px;font-size:.73rem;border:1px solid var(--dc-border);border-radius:var(--dc-radius-sm);background-color:var(--dc-bg-primary);color:var(--dc-text-secondary);cursor:pointer;outline:none}.dc-filter-select option{background-color:var(--dc-bg-surface)}.dc-load-btn{display:flex;align-items:center;gap:5px;padding:6px 14px;font-size:.76rem;font-weight:600;background-color:var(--dc-accent-dim);color:#fff;border:none;border-radius:var(--dc-radius-sm);cursor:pointer;transition:all var(--dc-transition)}.dc-load-btn:hover:not(:disabled){background-color:var(--dc-accent)}.dc-load-btn:disabled{opacity:.5;cursor:not-allowed}.dc-users-count{font-size:.7rem;color:var(--dc-text-muted);margin-left:auto;font-family:var(--dc-font-mono)}.dc-users-stats{padding:6px 14px;background-color:var(--dc-bg-elevated);border-bottom:1px solid var(--dc-border-subtle);display:flex;gap:20px;font-size:.73rem;color:var(--dc-text-secondary)}.dc-users-stats strong{color:var(--dc-accent);font-weight:600}.dc-users-empty{padding:40px 20px;text-align:center;color:var(--dc-text-dim);font-size:.83rem}.dc-history-layout{display:flex;height:100%;background-color:var(--dc-bg-primary)}.dc-history-list{flex:3;display:flex;flex-direction:column;border-right:1px solid var(--dc-border-subtle);overflow:hidden;background-color:var(--dc-bg-primary)}.dc-history-detail{flex:2;display:flex;flex-direction:column;overflow:hidden;background-color:var(--dc-bg-primary)}.dc-history-toolbar{display:flex;gap:6px;align-items:center;padding:8px 10px;background-color:var(--dc-bg-surface);border-bottom:1px solid var(--dc-border-subtle);flex-wrap:wrap}.dc-history-search{position:relative;flex:1;min-width:100px}.dc-history-search-icon{position:absolute;left:8px;top:50%;transform:translateY(-50%);color:var(--dc-text-dim)}.dc-history-search input{width:100%;padding:5px 10px 5px 26px;font-size:.7rem;border:1px solid var(--dc-border);border-radius:var(--dc-radius-sm);background-color:var(--dc-bg-primary);color:var(--dc-text-primary);outline:none;box-sizing:border-box}.dc-history-search input:focus{border-color:var(--dc-accent)}.dc-history-search input::placeholder{color:var(--dc-text-dim)}.dc-history-filter{padding:5px 8px;font-size:.66rem;border-radius:var(--dc-radius-sm);border:1px solid var(--dc-border);background-color:var(--dc-bg-primary);color:var(--dc-text-secondary);cursor:pointer;outline:none}.dc-history-filter option{background-color:var(--dc-bg-surface)}.dc-history-icon-btn{border:none;background:transparent;cursor:pointer;padding:4px;display:flex;color:var(--dc-text-dim);border-radius:var(--dc-radius-sm);transition:all var(--dc-transition)}.dc-history-icon-btn:hover{color:var(--dc-text-secondary);background-color:var(--dc-bg-hover)}.dc-history-icon-btn:disabled{opacity:.3;cursor:not-allowed}.dc-history-count{padding:4px 10px;font-size:.63rem;color:var(--dc-text-dim);border-bottom:1px solid var(--dc-border-subtle);background-color:var(--dc-bg-primary)}.dc-history-items{flex:1;overflow:auto}.dc-history-item{padding:8px 10px;cursor:pointer;border-bottom:1px solid var(--dc-border-subtle);transition:background-color var(--dc-transition)}.dc-history-item:hover{background-color:var(--dc-bg-hover)}.dc-history-item.selected{background-color:var(--dc-accent-bg);border-left:2px solid var(--dc-accent)}.dc-history-item-row1{display:flex;align-items:center;gap:5px}.dc-history-type-badge{padding:2px 6px;border-radius:3px;font-size:.58rem;font-weight:700;color:#fff;letter-spacing:.02em}.dc-history-meta{font-size:.6rem;color:var(--dc-text-dim);font-family:var(--dc-font-mono)}.dc-history-time{font-size:.58rem;color:var(--dc-text-dim);margin-left:auto}.dc-history-item-sql{font-size:.68rem;font-family:var(--dc-font-mono);color:var(--dc-text-secondary);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dc-history-item-explanation{font-size:.63rem;color:var(--dc-text-dim);margin-top:2px;font-style:italic}.dc-history-detail-header{padding:10px 14px;border-bottom:1px solid var(--dc-border-subtle);background-color:var(--dc-bg-surface)}.dc-history-detail-badges{display:flex;align-items:center;gap:6px;margin-bottom:4px}.dc-history-status-badge{padding:2px 7px;border-radius:3px;font-size:.63rem;font-weight:500}.dc-history-status-badge.success{background-color:var(--dc-success-bg);color:var(--dc-success)}.dc-history-status-badge.error{background-color:var(--dc-error-bg);color:var(--dc-error)}.dc-history-detail-meta{display:flex;gap:12px;font-size:.63rem;color:var(--dc-text-muted)}.dc-history-detail-content{flex:1;overflow:auto;padding:12px}.dc-history-section-title{font-size:.7rem;font-weight:600;color:var(--dc-text-secondary);margin-bottom:6px;display:flex;align-items:center;justify-content:space-between}.dc-history-sql-block{padding:10px 12px;border-radius:var(--dc-radius-md);font-size:.76rem;font-family:var(--dc-font-mono);background-color:var(--dc-bg-primary);color:var(--dc-text-primary);border:1px solid var(--dc-border-subtle);white-space:pre-wrap;word-break:break-all;line-height:1.6;max-height:40%;overflow:auto}.dc-history-explanation-block{padding:10px 12px;border-radius:var(--dc-radius-md);font-size:.73rem;background-color:var(--dc-bg-elevated);color:var(--dc-text-secondary);border:1px solid var(--dc-border-subtle);line-height:1.5;margin-top:14px}.dc-history-error-block{padding:10px 12px;border-radius:var(--dc-radius-md);font-size:.7rem;background-color:var(--dc-error-bg);color:var(--dc-error);border:1px solid rgba(248,113,113,.15);font-family:var(--dc-font-mono);white-space:pre-wrap;line-height:1.4;margin-top:14px}.dc-history-detail-actions{display:flex;gap:4px}.dc-history-action-btn{padding:4px 9px;font-size:.63rem;border-radius:var(--dc-radius-sm);cursor:pointer;display:flex;align-items:center;gap:3px;transition:all var(--dc-transition)}.dc-history-run-btn{border:1px solid var(--dc-accent);background:transparent;color:var(--dc-accent)}.dc-history-run-btn:hover{background-color:var(--dc-accent-bg)}.dc-history-load-btn{border:1px solid var(--dc-border);background:transparent;color:var(--dc-text-secondary)}.dc-history-load-btn:hover{background-color:var(--dc-bg-hover)}.dc-history-empty{display:flex;align-items:center;justify-content:center;height:100%}.dc-history-empty-text{text-align:center;color:var(--dc-text-dim)}.dc-history-empty-text .title{font-size:.83rem;margin-bottom:4px}.dc-history-empty-text .subtitle{font-size:.7rem}.dc-root ::-webkit-scrollbar{width:6px;height:6px}.dc-root ::-webkit-scrollbar-track{background:transparent}.dc-root ::-webkit-scrollbar-thumb{background-color:var(--dc-border);border-radius:3px}.dc-root ::-webkit-scrollbar-thumb:hover{background-color:var(--dc-text-dim)}:root{--account-bg-deep: #1a1f23;--account-bg-dark: #2C3539;--account-bg-medium: #36454F;--account-bg-card: #2a3238;--account-teal: #008080;--account-teal-light: #20B2AA;--account-teal-glow: rgba(0, 128, 128, .4);--account-aqua: #7FFFD4;--account-cadet: #5F9EA0;--account-gray: #4A5859;--account-gray-light: #6b7a7c;--account-text-primary: #ffffff;--account-text-secondary: #a8b5b8;--account-text-muted: #6b7a7c;--account-border: rgba(127, 255, 212, .1);--account-border-hover: rgba(127, 255, 212, .25);--account-gradient-teal: linear-gradient(135deg, #008080 0%, #20B2AA 100%);--account-gradient-card: linear-gradient(145deg, #2a3238 0%, #232a2e 100%);--account-gradient-glow: radial-gradient(ellipse at top, rgba(0, 128, 128, .15) 0%, transparent 60%);--account-shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--account-shadow-md: 0 4px 20px rgba(0, 0, 0, .4);--account-shadow-lg: 0 8px 40px rgba(0, 0, 0, .5);--account-shadow-teal: 0 4px 20px rgba(0, 128, 128, .3);--account-font-display: "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;--account-font-body: "Source Sans 3", -apple-system, BlinkMacSystemFont, sans-serif;--account-transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--account-transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--account-transition-slow: .4s cubic-bezier(.4, 0, .2, 1)}.account-layout{display:flex;min-height:100vh;background:var(--account-bg-deep);position:relative;z-index:1;overflow:hidden;font-family:var(--account-font-body)}.account-layout:before{content:"";position:fixed;top:0;left:0;right:0;height:50vh;background:var(--account-gradient-glow);pointer-events:none;z-index:0}.account-sidebar{width:280px;background:var(--account-gradient-card);border-right:1px solid var(--account-border);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:100;overflow-y:auto;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.account-sidebar .sidebar-header{padding:1.25rem;border-bottom:1px solid var(--account-border)}.account-sidebar .back-to-app{display:flex;align-items:center;gap:.625rem;padding:.75rem 1rem;background:#0080801a;border:1px solid var(--account-border);border-radius:10px;cursor:pointer;font-size:.875rem;font-family:var(--account-font-body);font-weight:500;color:var(--account-text-secondary);transition:all var(--account-transition-normal);width:100%}.account-sidebar .back-to-app:hover{background:#00808033;border-color:var(--account-border-hover);color:var(--account-aqua);transform:translate(-2px)}.account-sidebar .back-to-app svg{transition:transform var(--account-transition-fast)}.account-sidebar .back-to-app:hover svg{transform:translate(-3px)}.account-sidebar .user-card{display:flex;align-items:center;gap:.875rem;padding:1.5rem 1.25rem;border-bottom:1px solid var(--account-border);background:linear-gradient(180deg,rgba(0,128,128,.05) 0%,transparent 100%)}.account-sidebar .user-avatar{width:52px;height:52px;border-radius:14px;background:var(--account-gradient-teal);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:1.25rem;font-family:var(--account-font-display);overflow:hidden;box-shadow:var(--account-shadow-teal);position:relative}.account-sidebar .user-avatar:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,rgba(255,255,255,.2) 0%,transparent 50%);pointer-events:none}.account-sidebar .user-avatar img{width:100%;height:100%;object-fit:cover}.account-sidebar .user-info{flex:1;min-width:0}.account-sidebar .user-name{font-weight:600;font-family:var(--account-font-display);color:var(--account-text-primary);font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.125rem}.account-sidebar .user-email{font-size:.75rem;color:var(--account-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.account-nav{flex:1;padding:1.25rem 0;overflow-y:auto}.account-nav .nav-section{margin-bottom:1.75rem}.account-nav .nav-section-title{padding:0 1.25rem;margin-bottom:.75rem;font-size:.6875rem;font-weight:600;font-family:var(--account-font-display);text-transform:uppercase;letter-spacing:.1em;color:var(--account-text-muted)}.account-nav .nav-item{display:flex;align-items:center;gap:.75rem;padding:.875rem 1.25rem;margin:0 .75rem;color:var(--account-text-secondary);text-decoration:none;transition:all var(--account-transition-normal);border-radius:10px;border-left:3px solid transparent;position:relative}.account-nav .nav-item:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:0;background:var(--account-teal-light);border-radius:0 2px 2px 0;transition:height var(--account-transition-normal)}.account-nav .nav-item:hover{background:#0080801a;color:var(--account-text-primary)}.account-nav .nav-item:hover:before{height:50%}.account-nav .nav-item.active{background:#00808026;color:var(--account-aqua)}.account-nav .nav-item.active:before{height:60%;background:var(--account-aqua);box-shadow:0 0 10px var(--account-teal-glow)}.account-nav .nav-icon{width:18px;height:18px;flex-shrink:0;opacity:.8;transition:opacity var(--account-transition-fast)}.account-nav .nav-item:hover .nav-icon,.account-nav .nav-item.active .nav-icon{opacity:1}.account-nav .nav-label{font-size:.9rem;font-weight:500;font-family:var(--account-font-body)}.account-main{flex:1;padding:2.5rem 3rem;overflow-y:auto;min-height:100vh;position:relative;z-index:1}.account-page{max-width:1000px;margin:0 auto;animation:fadeInUp .5s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.account-page .page-header{margin-bottom:2.5rem}.account-page .page-header h1{font-size:2rem;font-weight:700;font-family:var(--account-font-display);color:var(--account-text-primary);margin:0 0 .5rem;letter-spacing:-.02em}.account-page .page-description{color:var(--account-text-muted);font-size:1rem;margin:0;line-height:1.5}.account-card{background:var(--account-gradient-card);border:1px solid var(--account-border);border-radius:16px;padding:1.75rem;margin-bottom:1.5rem;box-shadow:var(--account-shadow-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all var(--account-transition-normal);position:relative;overflow:hidden}.account-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(127,255,212,.3),transparent)}.account-card:hover{border-color:var(--account-border-hover);box-shadow:var(--account-shadow-lg)}.account-card .card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}.account-card .card-title{font-size:1.125rem;font-weight:600;font-family:var(--account-font-display);color:var(--account-text-primary);margin:0}.account-card .card-subtitle{font-size:.8125rem;color:var(--account-text-muted);margin:.375rem 0 0}.usage-meters{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem}.usage-meter{background:#0080800d;border:1px solid var(--account-border);border-radius:12px;padding:1.25rem;transition:all var(--account-transition-normal)}.usage-meter:hover{background:#00808014;border-color:var(--account-border-hover)}.usage-meter .meter-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.usage-meter .meter-label{font-weight:500;font-family:var(--account-font-display);color:var(--account-text-primary);display:flex;align-items:center;gap:.5rem;font-size:.9375rem}.usage-meter .meter-label svg{color:var(--account-teal-light)}.usage-meter .meter-value{font-size:.875rem;color:var(--account-text-secondary);font-family:var(--account-font-body)}.usage-meter .meter-bar{height:10px;background:#0000004d;border-radius:5px;overflow:hidden;position:relative}.usage-meter .meter-bar:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent)}.usage-meter .meter-fill{height:100%;border-radius:5px;transition:width .6s cubic-bezier(.4,0,.2,1);position:relative}.usage-meter .meter-fill:after{content:"";position:absolute;right:0;top:0;bottom:0;width:20px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3));border-radius:0 5px 5px 0}.usage-meter .meter-fill.low{background:linear-gradient(90deg,teal,#20b2aa);box-shadow:0 0 15px #20b2aa66}.usage-meter .meter-fill.medium{background:linear-gradient(90deg,#f59e0b,#fbbf24);box-shadow:0 0 15px #f59e0b66}.usage-meter .meter-fill.high{background:linear-gradient(90deg,#ef4444,#f87171);box-shadow:0 0 15px #ef444466}.usage-meter .meter-fill.unlimited{background:linear-gradient(90deg,teal,#7fffd4);box-shadow:0 0 20px #00808080;width:100%!important}.usage-meter .meter-note{font-size:.75rem;color:var(--account-text-muted);margin-top:.625rem}.usage-meter .meter-note.warning{color:#fbbf24;font-weight:500;padding:.625rem;background:#f59e0b26;border:1px solid rgba(245,158,11,.3);border-radius:6px}.plan-badge{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .875rem;border-radius:20px;font-size:.8125rem;font-weight:600;font-family:var(--account-font-display);text-transform:uppercase;letter-spacing:.03em}.plan-badge.free{background:#4a58594d;color:var(--account-text-secondary);border:1px solid var(--account-border)}.plan-badge.pro{background:linear-gradient(135deg,#0080804d,#20b2aa33);color:var(--account-teal-light);border:1px solid rgba(32,178,170,.3)}.plan-badge.premium{background:linear-gradient(135deg,#7fffd433,#5f9ea033);color:var(--account-aqua);border:1px solid rgba(127,255,212,.3);box-shadow:0 0 15px #7fffd433}.plan-badge.enterprise{background:linear-gradient(135deg,#7fffd44d,#0080804d);color:#7fffd4;border:1px solid rgba(127,255,212,.4);box-shadow:0 0 20px #7fffd44d}.plan-badge.custom{background:linear-gradient(135deg,#2c3539,#36454f);color:var(--account-aqua);border:1px solid var(--account-aqua)}.credit-balance-card{display:flex;align-items:center;justify-content:space-between;padding:2rem;background:var(--account-gradient-teal);border-radius:16px;color:#fff;margin-bottom:1.5rem;box-shadow:var(--account-shadow-teal),var(--account-shadow-lg);position:relative;overflow:hidden}.credit-balance-card:before{content:"";position:absolute;top:-50%;right:-20%;width:60%;height:200%;background:radial-gradient(ellipse,rgba(127,255,212,.2) 0%,transparent 60%);pointer-events:none}.credit-balance-card:after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent)}.credit-balance-card .balance-info{display:flex;flex-direction:column;position:relative;z-index:1}.credit-balance-card .balance-label{font-size:.875rem;font-family:var(--account-font-display);text-transform:uppercase;letter-spacing:.1em;opacity:.9}.credit-balance-card .balance-value{font-size:3rem;font-weight:700;font-family:var(--account-font-display);letter-spacing:-.02em;text-shadow:0 2px 10px rgba(0,0,0,.2)}.credit-balance-card .balance-unit{font-size:1rem;font-weight:500;opacity:.8;margin-left:.375rem}.credit-packs{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}.credit-pack{background:var(--account-bg-card);border:2px solid var(--account-border);border-radius:14px;padding:1.5rem;text-align:center;cursor:pointer;transition:all var(--account-transition-normal);position:relative;overflow:hidden}.credit-pack:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--account-gradient-teal);opacity:0;transition:opacity var(--account-transition-normal)}.credit-pack:hover{border-color:var(--account-teal);transform:translateY(-4px);box-shadow:var(--account-shadow-teal)}.credit-pack:hover:before{opacity:1}.credit-pack.selected{border-color:var(--account-aqua);background:#0080801a;box-shadow:0 0 25px #0080804d}.credit-pack.selected:before{opacity:1;background:linear-gradient(90deg,teal,#7fffd4)}.credit-pack.popular:after{content:"Best Value";position:absolute;top:-1px;right:20px;background:var(--account-gradient-teal);color:#fff;font-size:.6875rem;font-weight:600;font-family:var(--account-font-display);text-transform:uppercase;letter-spacing:.05em;padding:.375rem .75rem;border-radius:0 0 8px 8px}.credit-pack .pack-name{font-weight:600;font-family:var(--account-font-display);color:var(--account-text-primary);margin-bottom:.75rem}.credit-pack .pack-credits{font-size:2.25rem;font-weight:700;font-family:var(--account-font-display);color:var(--account-aqua);margin-bottom:.25rem;letter-spacing:-.02em}.credit-pack .pack-credits span{font-size:.875rem;font-weight:400;color:var(--account-text-muted)}.credit-pack .pack-price{font-size:1.25rem;font-weight:600;font-family:var(--account-font-display);color:var(--account-text-primary);margin-bottom:.25rem}.credit-pack .pack-rate{font-size:.75rem;color:var(--account-text-muted)}.btn{padding:.75rem 1.5rem;border-radius:10px;font-size:.9rem;font-weight:600;font-family:var(--account-font-display);cursor:pointer;transition:all var(--account-transition-normal);border:none;position:relative;overflow:hidden}.btn-primary{background:var(--account-gradient-teal);color:#fff;box-shadow:var(--account-shadow-teal)}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 25px #00808080}.btn-primary:hover:before{left:100%}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-secondary{background:#4a58594d;color:var(--account-text-primary);border:1px solid var(--account-border)}.btn-secondary:hover{background:#4a585980;border-color:var(--account-border-hover)}.btn-outline{background:transparent;border:1px solid var(--account-border);color:var(--account-text-secondary)}.btn-outline:hover{background:#0080801a;border-color:var(--account-teal);color:var(--account-aqua)}.billing-table{width:100%;border-collapse:separate;border-spacing:0}.billing-table th,.billing-table td{padding:1rem 1.25rem;text-align:left;border-bottom:1px solid var(--account-border)}.billing-table th{font-weight:600;font-family:var(--account-font-display);color:var(--account-text-muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;background:#0003}.billing-table th:first-child{border-radius:8px 0 0}.billing-table th:last-child{border-radius:0 8px 0 0}.billing-table td{color:var(--account-text-primary);font-size:.9375rem}.billing-table tbody tr{transition:background var(--account-transition-fast)}.billing-table tbody tr:hover{background:#0080800d}.billing-table .status-badge{display:inline-block;padding:.375rem .75rem;border-radius:6px;font-size:.75rem;font-weight:600;font-family:var(--account-font-display);text-transform:uppercase;letter-spacing:.03em}.billing-table .status-badge.paid{background:#20b2aa33;color:var(--account-teal-light);border:1px solid rgba(32,178,170,.3)}.billing-table .status-badge.pending{background:#f59e0b33;color:#fbbf24;border:1px solid rgba(245,158,11,.3)}.billing-table .status-badge.failed{background:#ef444433;color:#f87171;border:1px solid rgba(239,68,68,.3)}.plan-features{list-style:none;padding:0;margin:1rem 0}.plan-features li{display:flex;align-items:center;gap:.625rem;padding:.625rem 0;color:var(--account-text-secondary);font-size:.9375rem;border-bottom:1px solid var(--account-border)}.plan-features li:last-child{border-bottom:none}.plan-features li:before{content:"✓";color:var(--account-aqua);font-weight:700;font-size:.875rem}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;font-family:var(--account-font-display);color:var(--account-text-primary);margin-bottom:.625rem;font-size:.9375rem}.form-input{width:100%;padding:.875rem 1rem;background:#0003;border:1px solid var(--account-border);border-radius:10px;font-size:1rem;font-family:var(--account-font-body);color:var(--account-text-primary);transition:all var(--account-transition-fast)}.form-input:focus{outline:none;border-color:var(--account-teal);box-shadow:0 0 0 3px var(--account-teal-glow)}.form-input.disabled{background:#0000004d;color:var(--account-text-muted);cursor:not-allowed}.form-hint{font-size:.75rem;color:var(--account-text-muted);margin:.375rem 0 0}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}.form-message{padding:.875rem 1.25rem;border-radius:10px;margin-bottom:1.25rem;font-size:.9375rem}.form-message.success{background:#20b2aa26;color:var(--account-teal-light);border:1px solid rgba(32,178,170,.3)}.form-message.error{background:#ef444426;color:#f87171;border:1px solid rgba(239,68,68,.3)}.form-actions{display:flex;gap:.875rem}.loading-state,.error-state,.empty-state{text-align:center;padding:3rem;color:var(--account-text-muted)}.loading-state:before{content:"";display:inline-block;width:24px;height:24px;border:2px solid var(--account-border);border-top-color:var(--account-teal);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}.empty-state .empty-icon{margin-bottom:1rem;opacity:.4}@media (max-width: 1024px){.account-main{padding:2rem}}@media (max-width: 768px){.account-layout{flex-direction:column}.account-sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid var(--account-border)}.account-sidebar .user-card{display:none}.account-nav{display:flex;padding:.5rem .75rem;overflow-x:auto;gap:.25rem}.account-nav::-webkit-scrollbar{display:none}.account-nav .nav-section{display:flex;gap:.25rem;margin-bottom:0}.account-nav .nav-section-title{display:none}.account-nav .nav-item{margin:0;padding:.625rem 1rem;white-space:nowrap;border-radius:8px;border-left:none}.account-nav .nav-item:before{display:none}.account-nav .nav-item.active{background:var(--account-gradient-teal);color:#fff}.account-main{padding:1.5rem 1rem;min-height:auto}.account-page .page-header h1{font-size:1.5rem}.form-row{grid-template-columns:1fr}.credit-balance-card{flex-direction:column;text-align:center;gap:1.5rem}.credit-packs{grid-template-columns:repeat(2,1fr)}}@media (max-width: 480px){.credit-packs,.usage-meters{grid-template-columns:1fr}}.account-sidebar::-webkit-scrollbar,.account-main::-webkit-scrollbar{width:6px}.account-sidebar::-webkit-scrollbar-track,.account-main::-webkit-scrollbar-track{background:transparent}.account-sidebar::-webkit-scrollbar-thumb,.account-main::-webkit-scrollbar-thumb{background:var(--account-gray);border-radius:3px}.account-sidebar::-webkit-scrollbar-thumb:hover,.account-main::-webkit-scrollbar-thumb:hover{background:var(--account-gray-light)}