:root{--bg-primary: #1F1F1F;--bg-secondary: #2A2A2A;--bg-input: #333333;--bg-hover: rgba(255, 255, 255, .04);--text-primary: #e8e8f0;--text-secondary: #9090a0;--text-muted: #606068;--accent: #B2C4F6;--accent-hover: #9ab0ee;--accent-text: #1a1a2e;--border: rgba(255, 255, 255, .08);--status-queued: #666;--status-picked: #9c27b0;--status-rendering: #ff9800;--status-uploading: #2196f3;--status-completed: #4caf50;--status-failed: #f44336;--radius-pill: 20px;--radius-card: 16px;--radius-input: 10px;--radius-sm: 6px;font-family:DM Sans,sans-serif;line-height:1.5;color:var(--text-primary);background-color:var(--bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg-primary)}#root{min-height:100vh}input,select,textarea,button{font-family:inherit;font-size:inherit}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover)}.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg-primary)}.login-form{display:flex;flex-direction:column;gap:1.1rem;width:100%;max-width:360px;padding:2.5rem 2rem}.login-logo{width:72px;height:72px;object-fit:contain;align-self:center;margin-bottom:.5rem}.login-field{display:flex;flex-direction:column;gap:.35rem}.login-label{font-size:.8rem;font-weight:500;color:var(--text-secondary);letter-spacing:.02em}.login-form input{padding:.7rem .85rem;border:1px solid var(--border);border-radius:var(--radius-input);background:var(--bg-input);color:var(--text-primary);font-size:.9rem;outline:none;transition:border-color .2s}.login-form input:focus{border-color:var(--accent)}.login-form input::placeholder{color:var(--text-muted)}.login-form button{padding:.7rem;border:none;border-radius:var(--radius-pill);background:var(--accent);color:var(--accent-text);font-weight:600;font-size:.9rem;cursor:pointer;transition:background .2s;margin-top:.25rem}.login-form button:hover:not(:disabled){background:var(--accent-hover)}.login-form button:disabled{opacity:.5;cursor:not-allowed}.login-error{margin:0;padding:.5rem .75rem;border-radius:var(--radius-sm);background:#f443361a;color:var(--status-failed);font-size:.8rem;text-align:center}.file-upload{display:flex;flex-direction:column;gap:.5rem}.file-upload-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;padding:1.25rem;border:1px solid var(--border);border-radius:var(--radius-input);background:var(--bg-input);cursor:pointer;transition:border-color .2s,background .2s}.file-upload-dropzone:hover,.file-upload-dropzone.dragging{border-color:var(--accent);background:#b8c4ff0a}.file-upload-dropzone-label{font-size:.8rem;color:var(--text-muted)}.file-upload-dropzone-btn{padding:.3rem .75rem;border:1px solid var(--accent);border-radius:var(--radius-pill);background:transparent;color:var(--accent);font-size:.75rem;font-weight:600;cursor:pointer;transition:background .15s}.file-upload-dropzone-btn:hover{background:#b8c4ff14}.file-upload-progress{display:flex;flex-direction:column;gap:.35rem}.file-upload-progress-label{font-size:.75rem;color:var(--text-muted)}.file-upload-progress-track{height:6px;border-radius:3px;background:var(--bg-input);overflow:hidden}.file-upload-progress-fill{height:100%;background:var(--accent);border-radius:3px;transition:width .2s}.file-upload-preview{display:flex;align-items:center;gap:.75rem;padding:.5rem;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-input)}.file-upload-preview img,.file-upload-preview video{width:80px;height:56px;object-fit:cover;border-radius:var(--radius-sm);background:var(--bg-primary)}.file-upload-preview-name{flex:1;font-size:.8rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-upload-remove{padding:.25rem .5rem;border:1px solid var(--border);border-radius:var(--radius-pill);background:transparent;color:var(--text-muted);font-size:.7rem;cursor:pointer;transition:all .15s}.file-upload-remove:hover{color:var(--status-failed);border-color:var(--status-failed)}.file-upload-error{font-size:.75rem;color:var(--status-failed)}.templates-loading{color:var(--text-muted);padding:2rem;text-align:center}.empty-state{padding:3rem;text-align:center;color:var(--text-muted);background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-card)}.template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.25rem}.template-card{display:flex;flex-direction:column;transition:transform .15s}.template-card:hover{transform:translateY(-2px)}.card-name-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.card-name{font-size:.9rem;font-weight:600;color:var(--accent)}.card-thumb{position:relative;aspect-ratio:4 / 5;background:var(--bg-secondary);border-radius:var(--radius-card);overflow:hidden}.card-thumb img,.card-thumb video{width:100%;height:100%;object-fit:cover}.thumb-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:700;color:var(--text-muted);text-transform:uppercase}.render-btn{width:100%;padding:.55rem;border:none;border-radius:var(--radius-pill);background:var(--accent);color:var(--accent-text);font-weight:600;font-size:.85rem;cursor:pointer;opacity:0;transition:opacity .15s;margin-top:.5rem}.template-card:hover .render-btn{opacity:1}.render-btn:hover{background:var(--accent-hover)}.card-meta{display:flex;justify-content:space-between;padding:.5rem .15rem 0;font-size:.75rem;color:var(--text-muted)}.modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100}.render-modal{position:relative;display:flex;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-card);width:100%;max-width:900px;height:560px;max-height:85vh;overflow:hidden}.render-modal .modal-close{position:absolute;top:12px;right:14px;border:none;background:none;color:var(--text-muted);font-size:1.5rem;cursor:pointer;padding:0;line-height:1;z-index:2}.render-modal .modal-close:hover{color:var(--text-primary)}.render-modal-left{flex:1;padding:1.75rem;overflow-y:auto;display:flex;flex-direction:column;gap:1rem}.render-modal-title{margin:0;font-size:1.1rem;font-weight:600;color:var(--accent)}.render-modal-right{width:360px;flex-shrink:0;display:flex;flex-direction:column;border-left:1px solid var(--border);background:var(--bg-primary)}.render-preview{flex:1;display:flex;align-items:center;justify-content:center;padding:1.5rem}.render-preview img,.render-preview video{max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--radius-input)}.preview-placeholder{color:var(--text-muted);font-size:.9rem}.render-meta-row{display:flex;gap:1rem;padding:.75rem 1.5rem;border-top:1px solid var(--border);font-size:.75rem;color:var(--text-muted);justify-content:flex-end}.render-form{display:flex;flex-direction:column;gap:.75rem}.no-inputs{margin:0;color:var(--text-muted);font-size:.85rem}.form-field{display:flex;flex-direction:column;gap:.25rem}.field-label{font-size:.8rem;font-weight:500;color:var(--text-secondary)}.form-field input[type=text]{padding:.55rem .75rem;border:1px solid var(--border);border-radius:var(--radius-input);background:var(--bg-input);color:var(--text-primary);font-size:.85rem;outline:none;transition:border-color .2s}.form-field input[type=text]:focus{border-color:var(--accent)}.form-field input[type=text]::placeholder{color:var(--text-muted)}.form-field input[type=color]{width:48px;height:32px;padding:2px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-input);cursor:pointer}.form-error{margin:0;padding:.5rem .75rem;border-radius:var(--radius-sm);background:#f443361a;color:var(--status-failed);font-size:.8rem}.submit-btn{padding:.6rem 1.25rem;border:none;border-radius:var(--radius-pill);background:var(--accent);color:var(--accent-text);font-weight:600;font-size:.85rem;cursor:pointer;transition:background .15s;margin-top:.25rem}.submit-btn:hover:not(:disabled){background:var(--accent-hover)}.submit-btn:disabled{opacity:.5;cursor:not-allowed}.modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-card);width:100%;max-width:480px;max-height:80vh;overflow-y:auto}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}.modal-header h3{margin:0;font-size:1rem}.modal-header .modal-close{border:none;background:none;color:var(--text-muted);font-size:1.5rem;cursor:pointer;padding:0;line-height:1}.modal-header .modal-close:hover{color:var(--text-primary)}.modal-body{padding:1.25rem;display:flex;flex-direction:column;gap:.75rem}.category-tabs{display:flex;gap:.3rem;margin-bottom:1rem;flex-wrap:wrap;align-items:center}.category-tab{padding:.35rem .8rem;border:1px solid var(--border);border-radius:var(--radius-pill);background:transparent;color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all .15s}.category-tab:hover{color:var(--text-primary);border-color:#8c8cb44d}.category-tab.active{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.category-manage-btn{padding:.35rem .8rem;border:1px dashed var(--border);border-radius:var(--radius-pill);background:transparent;color:var(--text-muted);font-size:.8rem;cursor:pointer;transition:all .15s}.category-manage-btn:hover{color:var(--text-secondary);border-color:#8c8cb44d}.edit-toggle{margin-left:auto;padding:.35rem .8rem;border:1px solid var(--border);border-radius:var(--radius-pill);background:transparent;color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all .15s}.edit-toggle:hover{color:var(--text-primary);border-color:#8c8cb44d}.edit-toggle.active{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.template-card.hidden{opacity:.45}.hidden-badge{display:inline-block;padding:.1rem .4rem;border-radius:var(--radius-pill);background:#f4433626;color:var(--status-failed);font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em}.card-edit-controls{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;padding:.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-input)}.visibility-toggle{padding:.3rem .6rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:.75rem;cursor:pointer;transition:all .15s;width:100%}.visibility-toggle.on{border-color:var(--status-completed);color:var(--status-completed)}.visibility-toggle.off{border-color:var(--status-failed);color:var(--status-failed)}.visibility-toggle:hover{opacity:.8}.delete-template-btn{padding:.3rem .6rem;border:1px solid var(--status-failed);border-radius:var(--radius-sm);background:transparent;color:var(--status-failed);font-size:.75rem;cursor:pointer;transition:all .15s;width:100%}.delete-template-btn:hover{background:var(--status-failed);color:#fff}.category-select{width:100%;padding:.35rem .5rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-input);color:var(--text-primary);font-size:.8rem;outline:none}.category-select:focus{border-color:var(--accent)}.tags-editor{display:flex;flex-wrap:wrap;gap:.25rem;align-items:center}.tag-chip{display:inline-flex;align-items:center;gap:.2rem;padding:.1rem .4rem;border-radius:var(--radius-sm);border:1px solid var(--border);color:var(--text-secondary);font-size:.7rem}.tag-remove{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:0;font-size:.85rem;line-height:1}.tag-remove:hover{color:var(--status-failed)}.tag-input{padding:.15rem .4rem;border:1px dashed var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text-primary);font-size:.7rem;width:80px;outline:none}.tag-input:focus{border-color:var(--accent);border-style:solid}.category-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}.category-item{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:var(--bg-input);border-radius:var(--radius-sm)}.category-item-name{flex:1;font-size:.85rem;color:var(--text-primary)}.category-item-actions{display:flex;gap:.25rem}.cat-action-btn{padding:.2rem .5rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text-muted);font-size:.7rem;cursor:pointer;transition:all .15s}.cat-action-btn:hover{color:var(--text-primary);border-color:#8c8cb44d}.cat-action-btn.danger:hover{color:var(--status-failed);border-color:var(--status-failed)}.category-add-row{display:flex;gap:.5rem;margin-top:.75rem}.category-add-input{flex:1;padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius-input);background:var(--bg-input);color:var(--text-primary);font-size:.85rem;outline:none}.category-add-input:focus{border-color:var(--accent)}.category-add-btn{padding:.5rem 1rem;border:none;border-radius:var(--radius-pill);background:var(--accent);color:var(--accent-text);font-weight:600;font-size:.8rem;cursor:pointer;transition:background .15s}.category-add-btn:hover{background:var(--accent-hover)}.category-error{margin:.5rem 0 0;padding:.5rem .75rem;border-radius:var(--radius-sm);background:#f443361a;color:var(--status-failed);font-size:.8rem}.rename-input{flex:1;padding:.3rem .5rem;border:1px solid var(--accent);border-radius:var(--radius-sm);background:var(--bg-secondary);color:var(--text-primary);font-size:.85rem;outline:none}.jobs-loading{color:var(--text-muted);padding:2rem;text-align:center}.jobs-subtabs{display:flex;gap:.25rem;margin-bottom:1.25rem;background:#ffffff0a;border-radius:var(--radius-pill);padding:3px;width:fit-content}.jobs-subtab{padding:.35rem .9rem;border:none;border-radius:var(--radius-pill);background:transparent;color:var(--text-secondary);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .15s}.jobs-subtab:hover{color:var(--text-primary)}.jobs-subtab.active{color:var(--accent-text);background:var(--accent)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.25rem}.gallery-card{display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:transform .15s}.gallery-card:hover{transform:translateY(-2px)}.gallery-thumb{aspect-ratio:4 / 5;background:var(--bg-secondary);border-radius:var(--radius-card);overflow:hidden}.gallery-thumb img,.gallery-thumb video{width:100%;height:100%;object-fit:cover}.gallery-info{display:flex;justify-content:space-between;align-items:center;padding:.5rem .15rem 0}.gallery-name{font-size:.85rem;font-weight:500;color:var(--accent)}.gallery-time{font-size:.75rem;color:var(--text-muted)}.jobs-table-wrap{overflow-x:auto}.jobs-table{width:100%;border-collapse:collapse;font-size:.85rem}.jobs-table th{text-align:left;padding:.6rem .75rem;border-bottom:1px solid var(--border);color:var(--text-muted);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}.jobs-table td{padding:.6rem .75rem;border-bottom:1px solid var(--border);vertical-align:middle}.jobs-table tr:hover td{background:var(--bg-hover)}.status-pill{display:inline-block;padding:.15rem .55rem;border-radius:var(--radius-pill);font-size:.7rem;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}.template-name{font-weight:500}.user-cell{color:var(--text-secondary);white-space:nowrap}.time-cell{color:var(--text-muted);white-space:nowrap}.progress-bar{position:relative;width:100%;min-width:100px;height:20px;background:var(--bg-input);border-radius:var(--radius-sm);overflow:hidden}.progress-fill{height:100%;transition:width .3s ease;border-radius:var(--radius-sm)}.progress-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.output-link{font-size:.8rem;font-weight:600}.error-text{color:var(--status-failed);font-size:.75rem;cursor:help}.dash{color:var(--text-muted)}.rerender-btn{padding:.25rem .6rem;border:1px solid var(--border);border-radius:var(--radius-pill);background:transparent;color:var(--text-secondary);font-size:.7rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s}.rerender-btn:hover{color:var(--accent);border-color:var(--accent)}.users-loading{color:var(--text-muted);padding:2rem;text-align:center}.users-view .view-header{display:flex;align-items:center;gap:.5rem;margin-bottom:1.25rem}.add-user-btn{margin-left:auto;padding:.4rem .9rem;border:none;border-radius:var(--radius-sm);background:var(--accent);color:#fff;font-weight:600;font-size:.8rem;cursor:pointer;transition:background .15s}.add-user-btn:hover{background:var(--accent-hover)}.users-table-wrap{overflow-x:auto}.users-table{width:100%;border-collapse:collapse;font-size:.85rem}.users-table th{text-align:left;padding:.6rem .75rem;border-bottom:2px solid var(--border);color:var(--text-muted);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}.users-table td{padding:.6rem .75rem;border-bottom:1px solid var(--border);vertical-align:middle}.users-table tr:hover td{background:var(--bg-hover)}.user-name{font-weight:500}.user-username{color:var(--text-secondary);font-family:monospace;font-size:.8rem}.user-email{color:var(--text-secondary)}.role-label{display:inline-block;padding:.15rem .5rem;border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-secondary);font-size:.75rem;font-weight:600;text-transform:capitalize;cursor:pointer;transition:background .15s}.role-label:hover{background:var(--bg-hover);color:var(--text-primary)}.role-select{padding:.3rem .5rem;border:1px solid var(--accent);border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-primary);font-size:.8rem;outline:none;cursor:pointer;text-transform:capitalize}.role-select option{text-transform:capitalize}.actions-cell{white-space:nowrap;display:flex;gap:.35rem}.action-btn{padding:.25rem .55rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:.7rem;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}.action-btn:hover{color:var(--text-primary);border-color:var(--text-muted)}.action-btn.danger{color:var(--status-failed);border-color:#f443364d}.action-btn.danger:hover{background:#f443361a;border-color:var(--status-failed)}.users-view .modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100}.users-view .modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);width:100%;max-width:480px;max-height:80vh;overflow-y:auto}.users-view .modal-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}.users-view .modal-header h3{margin:0;font-size:1rem}.users-view .modal-close{border:none;background:none;color:var(--text-muted);font-size:1.5rem;cursor:pointer;padding:0;line-height:1}.users-view .modal-close:hover{color:var(--text-primary)}.confirm-dialog{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);width:100%;max-width:380px}.confirm-dialog .modal-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}.confirm-dialog .modal-header h3{margin:0;font-size:1rem}.confirm-dialog .modal-close{border:none;background:none;color:var(--text-muted);font-size:1.5rem;cursor:pointer;padding:0;line-height:1}.confirm-dialog .modal-close:hover{color:var(--text-primary)}.confirm-body{padding:1.25rem}.confirm-body p{margin:0 0 1rem;font-size:.9rem;color:var(--text-secondary);line-height:1.5}.confirm-body strong{color:var(--text-primary)}.add-user-form{padding:1.25rem;display:flex;flex-direction:column;gap:.75rem}.add-user-form .form-field{display:flex;flex-direction:column;gap:.25rem}.add-user-form .field-label{font-size:.8rem;font-weight:600;color:var(--text-secondary)}.add-user-form input[type=text],.add-user-form input[type=email]{padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-primary);font-size:.85rem;outline:none;transition:border-color .2s}.add-user-form input[type=text]:focus,.add-user-form input[type=email]:focus{border-color:var(--accent)}.add-user-form .role-select{width:100%}.password-toggle{display:flex;flex-direction:column;gap:.4rem}.password-toggle .field-label{font-size:.8rem;font-weight:600;color:var(--text-secondary)}.toggle-option{display:flex;align-items:center;gap:.4rem;font-size:.85rem;color:var(--text-secondary);cursor:pointer}.toggle-option input[type=radio]{accent-color:var(--accent)}.auto-hint{font-size:.8rem;color:var(--text-muted);font-style:italic}.manual-password{padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-primary);font-size:.85rem;outline:none;transition:border-color .2s}.manual-password:focus{border-color:var(--accent)}.users-view .form-actions{display:flex;gap:.5rem;justify-content:flex-end;margin-top:.5rem}.users-view .cancel-btn{padding:.5rem 1rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:.85rem;cursor:pointer;transition:all .15s}.users-view .cancel-btn:hover{color:var(--text-primary);border-color:var(--text-muted)}.users-view .submit-btn{padding:.5rem 1rem;border:none;border-radius:var(--radius-sm);background:var(--accent);color:#fff;font-weight:600;font-size:.85rem;cursor:pointer;transition:background .15s}.users-view .submit-btn:hover:not(:disabled){background:var(--accent-hover)}.users-view .submit-btn:disabled{opacity:.5;cursor:not-allowed}.danger-btn{background:var(--status-failed)!important}.danger-btn:hover:not(:disabled){background:#d32f2f!important}.users-view .form-error{margin:0;padding:.5rem .75rem;border-radius:var(--radius-sm);background:#f443361a;color:var(--status-failed);font-size:.8rem}.password-modal-body{padding:1.25rem}.password-display{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:.75rem}.password-display code{flex:1;font-family:monospace;font-size:.95rem;color:var(--text-primary);word-break:break-all;letter-spacing:.03em}.copy-btn{padding:.3rem .65rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--accent);font-size:.75rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s}.copy-btn:hover{background:var(--bg-hover);border-color:var(--accent)}.password-warning{margin:0 0 .75rem;font-size:.8rem;color:var(--status-failed);font-weight:500}.shell{min-height:100vh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;padding:0 1.5rem;height:56px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}.topbar-left{display:flex;align-items:center;gap:1.5rem}.topbar-logo{width:28px;height:28px;object-fit:contain}.tabs{display:flex;gap:.25rem;background:#ffffff0a;border-radius:var(--radius-pill);padding:3px}.tab{padding:.35rem .9rem;border:none;border-radius:var(--radius-pill);background:transparent;color:var(--text-secondary);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .15s}.tab:hover{color:var(--text-primary)}.tab.active{color:var(--text-primary);background:#ffffff1a}.topbar-right{display:flex;align-items:center;gap:1rem}.client-name{font-size:.8rem;color:var(--text-muted);font-weight:500}.user-label{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--text-secondary)}.role-badge{display:inline-block;padding:.15rem .5rem;border-radius:var(--radius-pill);border:1px solid var(--border);font-size:.65rem;color:var(--text-secondary);text-transform:uppercase;font-weight:600;letter-spacing:.03em}.logout-btn{padding:.35rem .75rem;border:1px solid var(--border);border-radius:var(--radius-pill);background:transparent;color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all .15s}.logout-btn:hover{color:var(--text-primary);border-color:#8c8cb44d}.content{flex:1;padding:1.5rem;max-width:1400px;width:100%;margin:0 auto}