.page-container{max-width:var(--content-max-width);margin:0 auto;padding:var(--space-8);min-height:100%}.page-container--wide{max-width:var(--content-max-width-wide)}.page-container--admin{max-width:var(--content-max-width-admin);padding:var(--space-8)}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-8);padding-bottom:var(--space-4);border-bottom:2px solid var(--color-border)}.page-header h1{margin:0;font-size:var(--text-2xl);font-weight:var(--font-semibold);color:var(--color-text);letter-spacing:-.02em}.page-header-title{display:flex;align-items:center;gap:var(--space-3)}.page-header-actions{display:flex;align-items:center;gap:var(--space-2)}.page-header--sticky{position:sticky;top:0;z-index:10;background:var(--color-background);padding-top:var(--space-4);padding-bottom:var(--space-4);margin-bottom:0;border-bottom:2px solid var(--color-border)}.card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--space-6);margin-bottom:var(--space-6);border:1px solid var(--color-border)}.card h2{font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text);margin:0 0 var(--space-4)}.filters-panel{background:var(--color-surface);padding:var(--space-6);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-4);margin-bottom:var(--space-6)}.filter-group{display:flex;flex-direction:column}.filter-group label{font-weight:var(--font-semibold);font-size:var(--text-sm);margin-bottom:var(--space-2);color:var(--color-text-secondary)}.filter-group input,.filter-group select{width:100%;padding:var(--space-3) var(--space-3);border:2px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-base);font-family:inherit;transition:border-color var(--transition-base)}.filter-group input:focus,.filter-group select:focus{outline:none;border-color:var(--color-primary)}.filter-actions{display:flex;gap:var(--space-2);align-items:flex-end}.btn{padding:var(--space-3) var(--space-4);border:none;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:var(--font-semibold);font-family:inherit;cursor:pointer;transition:all var(--transition-base);white-space:nowrap}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);box-shadow:var(--shadow-md)}.btn-secondary{background:var(--color-neutral-100);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-neutral-200)}.btn-danger{background:var(--color-error-bg);color:var(--color-error)}.btn-danger:hover:not(:disabled){background:#fecaca}.btn-sm{padding:var(--space-2) var(--space-3);font-size:var(--text-sm)}.btn-icon{background:transparent;border:none;cursor:pointer;padding:var(--space-2);font-size:1.125rem;border-radius:var(--radius-md);transition:transform var(--transition-fast),background var(--transition-base)}.btn-icon:hover{background:var(--color-neutral-100)}.btn-icon.danger:hover{background:var(--color-error-bg)}.btn-refresh{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--color-neutral-100);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);font-weight:var(--font-medium);font-family:inherit;color:var(--color-text-secondary);transition:all var(--transition-base)}.btn-refresh:hover{background:var(--color-neutral-200);color:var(--color-primary)}.list-items{display:flex;flex-direction:column;gap:var(--space-2)}.list-item{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-5);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:box-shadow var(--transition-base)}.list-item:hover{box-shadow:var(--shadow-sm)}.list-item-icon{display:flex;align-items:center;justify-content:center;width:38px;height:38px;background:var(--color-primary-light);border-radius:var(--radius-md);flex-shrink:0}.list-item-body{flex:1;min-width:0}.list-item-title{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:var(--space-1)}.list-item-meta{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--color-text-muted)}.list-item-actions{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}.btn-action{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);border:none;border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-xs);font-weight:var(--font-semibold);font-family:inherit;transition:all var(--transition-base);white-space:nowrap}.btn-action.primary{background:var(--color-primary-light);color:var(--color-primary)}.btn-action.primary:hover{background:var(--color-primary);color:#fff}.btn-action.danger{background:var(--color-error-bg);color:var(--color-error)}.btn-action.danger:hover{background:var(--color-error);color:#fff}.table-container{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);overflow-x:auto;margin-bottom:var(--space-6)}.table-container table{width:100%;border-collapse:collapse;font-size:var(--text-base)}.table-container thead{background:var(--color-neutral-50);border-bottom:2px solid var(--color-border)}.table-container thead th{position:sticky;top:0;z-index:1;background:var(--color-neutral-50);box-shadow:0 1px 0 var(--color-border)}.table-container th{padding:var(--space-4);text-align:left;font-weight:var(--font-semibold);color:var(--color-text-secondary);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em}.table-container td{padding:var(--space-4);border-bottom:1px solid var(--color-border);color:var(--color-text)}.table-container tbody tr:hover{background:var(--color-neutral-50)}.admin-table{width:100%;border-collapse:collapse}.admin-table thead{background:var(--color-neutral-50);border-bottom:2px solid var(--color-border)}.admin-table th{padding:var(--space-4);text-align:left;font-weight:var(--font-semibold);color:var(--color-text-secondary);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.admin-table td{padding:var(--space-4);border-bottom:1px solid var(--color-border)}.admin-table tr:hover{background:var(--color-neutral-50)}.badge,.status-pill{display:inline-flex;align-items:center;padding:2px var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-semibold)}.badge-active,.status-completed{background:var(--color-success-bg);color:var(--color-success)}.badge-warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge-danger,.badge-suspended,.status-failed,.badge-inactive{background:var(--color-error-bg);color:var(--color-error)}.status-queued{background:var(--color-info-bg);color:var(--color-info)}.status-processing{background:var(--color-warning-bg);color:var(--color-warning)}.status-cancelled{background:var(--color-neutral-200);color:var(--color-neutral-600)}.badge--success{background:var(--color-success-bg);color:var(--color-success)}.badge--error{background:var(--color-error-bg);color:var(--color-error)}.badge--warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge--info{background:var(--color-info-bg);color:var(--color-info)}.badge--neutral{background:var(--color-neutral-200);color:var(--color-text-muted)}.badge--primary{background:var(--color-primary-light);color:var(--color-primary)}.pagination{display:flex;justify-content:center;align-items:center;gap:var(--space-4);padding:var(--space-4);margin-top:var(--space-4)}.page-info{font-weight:var(--font-semibold);color:var(--color-text-secondary);font-size:var(--text-sm)}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:var(--color-surface);border-radius:var(--radius-xl);padding:var(--space-8);max-width:420px;width:90%;box-shadow:var(--shadow-modal);border:1px solid var(--color-border)}.modal--md{max-width:540px}.modal--lg{max-width:640px}.modal--wide{max-width:820px}.modal h3{margin:0 0 var(--space-3);font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--color-text)}.modal p{color:var(--color-text-secondary);margin:0 0 var(--space-6);font-size:var(--text-base)}.modal-actions{display:flex;gap:var(--space-3);justify-content:flex-end;margin-top:var(--space-6)}.form-group{margin-bottom:var(--space-6)}.form-group label{display:block;margin-bottom:var(--space-2);font-weight:var(--font-semibold);font-size:var(--text-sm);color:var(--color-text)}.form-control{width:100%;padding:var(--space-3) var(--space-4);border:2px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-base);font-family:inherit;transition:border-color var(--transition-base);box-sizing:border-box}.form-control:focus{outline:none;border-color:var(--color-primary)}.form-control:disabled{background:var(--color-neutral-100);cursor:not-allowed}.form-control.error{border-color:var(--color-error)}.alert{padding:var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);margin-bottom:var(--space-4)}.alert-error{background:var(--color-error-bg);color:var(--color-error);border:1px solid #fecaca}.alert-success{background:var(--color-success-bg);color:var(--color-success);border:1px solid #a7f3d0}.alert-warning{background:var(--color-warning-bg);color:var(--color-warning);border:1px solid #fde68a}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-12) var(--space-8);text-align:center;color:var(--color-text-muted);gap:var(--space-2)}.empty-state p{margin:0;font-size:var(--text-md);font-weight:var(--font-medium);color:var(--color-text-secondary)}.empty-state small{font-size:var(--text-sm);color:var(--color-text-muted)}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-12) var(--space-8);text-align:center;gap:var(--space-2)}.loading-state p{margin:0;font-size:var(--text-md);font-weight:var(--font-medium);color:var(--color-text-secondary)}.error-message{color:var(--color-error);font-size:var(--text-sm);margin-top:var(--space-2)}a:not(.btn):not(.nav-item):not(.empty-cta){text-underline-offset:.2em}a:not(.btn):not(.nav-item):not(.empty-cta):hover{text-decoration:underline}.progress{height:8px;background:var(--color-neutral-200);border-radius:var(--radius-full);overflow:hidden}.progress-fill{height:100%;border-radius:var(--radius-full);transition:width var(--transition-base);background:var(--color-primary)}.progress-fill--success{background:var(--color-success)}.progress-fill--warning{background:var(--color-warning)}.progress-fill--error{background:var(--color-error)}.btn-search{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-medium);font-family:inherit;cursor:pointer;transition:background var(--transition-base);white-space:nowrap}.btn-search:hover{background:var(--color-primary-hover)}.btn-clear{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2);background:none;color:var(--color-text-muted);border:none;border-radius:var(--radius-md);font-family:inherit;cursor:pointer;transition:all var(--transition-base)}.btn-clear:hover{background:var(--color-error-bg);color:var(--color-error)}:root{--color-primary: #5568d3;--color-primary-hover: #4358c4;--color-primary-light: rgba(85, 104, 211, .12);--color-primary-dark: #1a1d3a;--color-accent: #7c3aed;--color-accent-light: rgba(124, 58, 237, .12);--color-neutral-50: #f8fafc;--color-neutral-100: #f1f5f9;--color-neutral-200: #e2e8f0;--color-neutral-300: #cbd5e1;--color-neutral-400: #94a3b8;--color-neutral-500: #64748b;--color-neutral-600: #475569;--color-neutral-700: #334155;--color-neutral-800: #1e293b;--color-neutral-900: #0f172a;--color-surface: #ffffff;--color-surface-elevated: #ffffff;--color-background: #f5f7fa;--color-background-alt: #f1f5f9;--color-text: #1e293b;--color-text-secondary: #475569;--color-text-muted: #64748b;--color-text-disabled: #94a3b8;--color-border: #e2e8f0;--color-border-strong: #cbd5e1;--color-success: #059669;--color-success-bg: #d1fae5;--color-warning: #d97706;--color-warning-bg: #fef3c7;--color-error: #dc2626;--color-error-bg: #fee2e2;--color-info: #0284c7;--color-info-bg: #e0f2fe;--space-0: 0;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--font-sans: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, monospace;--text-xs: .75rem;--text-sm: .8125rem;--text-base: .9375rem;--text-md: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--leading-tight: 1.25;--leading-normal: 1.5;--leading-relaxed: 1.625;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .07), 0 2px 4px -2px rgba(0, 0, 0, .05);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .08), 0 4px 6px -4px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .08), 0 8px 10px -6px rgba(0, 0, 0, .04);--shadow-modal: 0 25px 50px -12px rgba(0, 0, 0, .2);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--sidebar-width: 280px;--sidebar-width-collapsed: 72px;--content-max-width: 1200px;--content-max-width-wide: 1400px;--content-max-width-admin: 1600px;--header-height: 60px}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{height:100%}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--color-text);background-color:var(--color-background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100%}button,input,select,textarea{font-family:inherit}
