*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow-x:hidden;background-color:#f0f4f8;font-family:Roboto,Helvetica Neue,Arial,sans-serif;color:#333}:root{--color-white: #ffffff;--color-light-gray: #f0f4f8;--color-light-gray-2: #f5f7fa;--color-medium-gray: #e0e0e0;--color-gray: #ddd;--color-dark-gray: #999;--color-text: #333333;--color-text-light: #666;--color-border: #eee;--color-primary: #1565c0;--color-primary-light: #1e88e5;--color-primary-lighter: #42a5f5;--color-primary-dark: #0d47a1;--color-primary-darker: #0a3a7a;--gradient-primary: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%);--gradient-primary-light: linear-gradient(135deg, #1e88e5 0%, #1565c0 100%);--gradient-primary-accent: linear-gradient(135deg, #42a5f5 0%, #1e88e5 100%);--color-accent: #64b5f6;--color-accent-light: #90caf9;--color-accent-bg: #e3f2fd;--color-accent-bg-light: #bbdefb;--color-success: #2e7d32;--color-success-bg: #e8f5e9;--color-success-border: #a5d6a7;--color-success-light: #e8f5e9;--color-success-light-border: #a5d6a7;--color-error: #c62828;--color-error-bg: #ffebee;--color-error-border: #ef9a9a;--color-danger: #c62828;--color-danger-bg: #ffebee;--color-danger-border: #ef9a9a;--color-info: #1565c0;--color-info-bg: #e3f2fd;--color-info-border: #90caf9;--color-warning: #f57c00;--color-warning-bg: #fff3e0;--color-warning-border: #ffcc80;--shadow-sm: 0 2px 8px rgba(21, 101, 192, .08);--shadow-md: 0 4px 12px rgba(21, 101, 192, .15);--shadow-lg: 0 6px 20px rgba(21, 101, 192, .2);--z-notification: 999;--z-modal: 1000;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 20px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--font-family: Roboto, "Helvetica Neue", Arial, sans-serif}.error-message,.success-message{position:fixed;top:80px;right:20px;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-sm);border-left:4px solid;font-size:14px;animation:slideDown .3s ease;z-index:var(--z-notification);max-width:400px;box-shadow:var(--shadow-md);margin-top:60px}.error-message{background-color:var(--color-error-bg);border-left-color:var(--color-error-border);color:var(--color-error)}.success-message{background-color:var(--color-success-bg);border-left-color:var(--color-success-border);color:var(--color-success)}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.loading{display:flex;justify-content:center;align-items:center;padding:40px 20px;color:var(--color-text-light);text-align:center}.loading p{margin:0;font-size:16px}.empty-state,.no-entries{display:flex;justify-content:center;align-items:center;padding:40px 20px;color:var(--color-text-light);text-align:center}.empty-state p,.no-entries p{margin:0;font-size:16px}.btn{padding:var(--spacing-sm) var(--spacing-md);border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;font-weight:500;transition:all .2s ease;white-space:nowrap;display:inline-flex;align-items:center;gap:var(--spacing-xs);font-family:var(--font-family)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-new,.btn-save,.btn-submit{background:var(--gradient-primary);color:var(--color-white);padding:10px 16px}.btn-new:hover:not(:disabled),.btn-save:hover:not(:disabled),.btn-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #1565c066}.btn-submit:hover:not(:disabled){background:linear-gradient(135deg,var(--color-primary-dark) 0%,var(--color-primary-darker) 100%)}.btn-complete{background-color:var(--color-success-light);color:#2e7d32;border:1px solid var(--color-success-light-border)}.btn-complete:hover:not(:disabled){background-color:#c8e6c9}.btn-edit{background-color:var(--color-info-bg);color:var(--color-info);border:1px solid var(--color-info-border)}.btn-edit:hover:not(:disabled){background-color:#bbdefb}.btn-delete,.btn-danger{background-color:var(--color-danger-bg);color:var(--color-danger);border:1px solid var(--color-danger-border)}.btn-delete:hover:not(:disabled),.btn-danger:hover:not(:disabled){background-color:#ffcdd2}.btn-cancel,.btn-action{background-color:var(--color-white);color:var(--color-text);border:1px solid var(--color-gray);padding:10px 16px;font-size:14px}.btn-action{padding:10px 16px}.btn-cancel:hover:not(:disabled),.btn-action:hover:not(:disabled){background-color:var(--color-light-gray);border-color:var(--color-dark-gray)}.btn-action.btn-danger{color:var(--color-danger);border-color:var(--color-danger-border)}.btn-action.btn-danger:hover:not(:disabled){background-color:var(--color-danger-bg);border-color:var(--color-danger)}.btn-refresh{background:var(--gradient-primary);color:var(--color-white);padding:10px 16px}.tab-navigation{display:flex;gap:0;margin-bottom:25px;border-bottom:2px solid var(--color-medium-gray)}.tab-button{padding:12px 24px;border:none;background:none;cursor:pointer;font-size:16px;font-weight:600;color:var(--color-text-light);border-bottom:3px solid transparent;transition:all .3s ease;position:relative;top:2px}.tab-button:hover{color:var(--color-text);background-color:var(--color-light-gray-2)}.tab-button.active{color:var(--color-primary);border-bottom-color:var(--color-primary);background-color:var(--color-accent-bg)}.btn-refresh:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #1565c066}.form-control,input[type=text],input[type=password],input[type=email],textarea,select{width:100%;padding:var(--spacing-md) var(--spacing-lg);border:1px solid var(--color-gray);border-radius:var(--radius-sm);font-size:14px;font-family:var(--font-family);transition:border-color .2s ease;box-sizing:border-box}.form-control:focus,input[type=text]:focus,input[type=password]:focus,input[type=email]:focus,textarea:focus,select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #1565c01a}.form-group{margin-bottom:var(--spacing-lg)}.form-group label{display:block;margin-bottom:var(--spacing-sm);font-weight:500;color:var(--color-text)}.checkbox-group{display:flex;align-items:center;gap:var(--spacing-sm);cursor:pointer;font-size:14px;color:var(--color-text-light)}.checkbox-group input[type=checkbox]{width:auto;margin:0;cursor:pointer}input[type=checkbox]{cursor:pointer}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:var(--z-modal)}.modal-content{background:var(--color-white);border-radius:var(--radius-md);max-width:600px;width:90%;max-height:90vh;display:flex;flex-direction:column;box-shadow:var(--shadow-md)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border);flex-shrink:0}.modal-header h2{margin:0;font-size:18px;color:var(--color-text);flex:1}.modal-body{flex:1;overflow-y:auto;padding:var(--spacing-lg)}.modal-footer{padding:var(--spacing-lg);border-top:1px solid var(--color-border);display:flex;gap:var(--spacing-md);justify-content:flex-end;flex-shrink:0}.container{max-width:1200px;margin:0 auto;padding:var(--spacing-xl)}.card{background:var(--color-white);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--spacing-lg)}.text-center{text-align:center}.text-right{text-align:right}.text-muted{color:var(--color-text-light)}.mt-0{margin-top:0}.mt-1{margin-top:var(--spacing-xs)}.mt-2{margin-top:var(--spacing-sm)}.mt-3{margin-top:var(--spacing-md)}.mt-4{margin-top:var(--spacing-lg)}.mb-0{margin-bottom:0}.mb-1{margin-bottom:var(--spacing-xs)}.mb-2{margin-bottom:var(--spacing-sm)}.mb-3{margin-bottom:var(--spacing-md)}.mb-4{margin-bottom:var(--spacing-lg)}.p-0{padding:0}.p-1{padding:var(--spacing-xs)}.p-2{padding:var(--spacing-sm)}.p-3{padding:var(--spacing-md)}.p-4{padding:var(--spacing-lg)}.flex{display:flex}.flex-center{display:flex;justify-content:center;align-items:center}.flex-between{display:flex;justify-content:space-between;align-items:center}.gap-1{gap:var(--spacing-xs)}.gap-2{gap:var(--spacing-sm)}.gap-3{gap:var(--spacing-md)}.gap-4{gap:var(--spacing-lg)}.refresh-section{display:flex;align-items:center;gap:10px}.cache-timestamp{font-size:12px;color:#888;font-style:italic;white-space:nowrap}.toolbar{background:var(--color-white);border-bottom:1px solid var(--color-border);padding:var(--spacing-md) var(--spacing-lg);box-shadow:var(--shadow-sm);flex-shrink:0}.toolbar-content{max-width:1400px;margin:0 auto;display:flex;gap:var(--spacing-md);align-items:center}.toolbar-title{margin:0;font-size:24px;font-weight:600;color:var(--color-text)}.toolbar-actions{display:flex;gap:var(--spacing-md);align-items:center}.data-table{width:100%;border-collapse:collapse;background-color:var(--color-white);border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm)}.data-table thead{background-color:var(--color-light-gray);border-bottom:2px solid var(--color-medium-gray)}.data-table th{padding:var(--spacing-md) var(--spacing-lg);text-align:left;font-weight:600;color:var(--color-text);font-size:13px;white-space:nowrap}.data-table td{padding:var(--spacing-md) var(--spacing-lg);border-bottom:1px solid var(--color-border);font-size:14px;color:var(--color-text)}.data-table tbody tr{transition:background-color .2s ease}.data-table tbody tr:hover{background-color:var(--color-light-gray-2)}.data-table tbody tr:last-child td{border-bottom:none}.btn-icon{background:none;border:none;padding:var(--spacing-xs) var(--spacing-sm);cursor:pointer;font-size:16px;transition:all .2s;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;color:var(--color-text-light)}.btn-icon:hover{background-color:var(--color-light-gray);color:var(--color-text)}.btn-close{background:none;border:none;font-size:24px;cursor:pointer;color:var(--color-text-light);padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .2s;border-radius:var(--radius-sm)}.btn-close:hover{color:var(--color-text);background-color:var(--color-light-gray)}.search-input{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-gray);border-radius:var(--radius-sm);font-size:14px;font-family:var(--font-family);transition:border-color .2s}.search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #1565c01a}.loading-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#ffffffb3;z-index:var(--z-modal);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.loading-content{background:var(--color-white);padding:var(--spacing-lg) var(--spacing-xl);border-radius:var(--radius-md);box-shadow:var(--shadow-md);font-weight:600;color:var(--color-text)}.detail-row{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-md);font-size:14px}.detail-row.column{flex-direction:column}.detail-label{font-weight:600;color:var(--color-text-light);min-width:100px}.detail-value{color:var(--color-text);flex:1}body.dark-mode{background-color:#1a1a2e;color:#e0e0e0;--color-white: #242438;--color-light-gray: #1a1a2e;--color-light-gray-2: #2a2a44;--color-medium-gray: #3a3a54;--color-gray: #4a4a64;--color-dark-gray: #8888a0;--color-text: #e0e0e0;--color-text-light: #b0b0c0;--color-border: #3a3a54;--color-primary: #64b5f6;--color-primary-light: #90caf9;--color-primary-lighter: #bbdefb;--color-primary-dark: #42a5f5;--color-primary-darker: #1e88e5;--gradient-primary: linear-gradient(135deg, #0d47a1 0%, #0a3a7a 100%);--gradient-primary-light: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%);--gradient-primary-accent: linear-gradient(135deg, #1e88e5 0%, #1565c0 100%);--color-accent: #90caf9;--color-accent-light: #bbdefb;--color-accent-bg: #2a2a44;--color-accent-bg-light: #3a3a54;--color-success: #66bb6a;--color-success-bg: #1b3a1b;--color-success-border: #388e3c;--color-success-light: #1b3a1b;--color-success-light-border: #388e3c;--color-error: #ef5350;--color-error-bg: #3a1a1a;--color-error-border: #d32f2f;--color-danger: #ef5350;--color-danger-bg: #3a1a1a;--color-danger-border: #d32f2f;--color-info: #64b5f6;--color-info-bg: #1a2a3a;--color-info-border: #1976d2;--color-warning: #ffb74d;--color-warning-bg: #3a2a1a;--color-warning-border: #f57c00;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 6px 20px rgba(0, 0, 0, .5)}body.dark-mode .form-control,body.dark-mode input[type=text],body.dark-mode input[type=password],body.dark-mode input[type=email],body.dark-mode textarea,body.dark-mode select{background-color:#2a2a44;border-color:#3a3a54;color:#e0e0e0}body.dark-mode .form-control:focus,body.dark-mode input[type=text]:focus,body.dark-mode input[type=password]:focus,body.dark-mode input[type=email]:focus,body.dark-mode textarea:focus,body.dark-mode select:focus{border-color:#64b5f6;box-shadow:0 0 0 3px #64b5f633}body.dark-mode .form-group label{color:#e0e0e0}body.dark-mode .btn-cancel,body.dark-mode .btn-action{background-color:#2a2a44;color:#e0e0e0;border-color:#4a4a64}body.dark-mode .btn-cancel:hover:not(:disabled),body.dark-mode .btn-action:hover:not(:disabled){background-color:#3a3a54;border-color:#5a5a74}body.dark-mode .card{background:#242438;box-shadow:var(--shadow-sm)}body.dark-mode .modal-content{background:#242438;border:1px solid #3a3a54}body.dark-mode .modal-header{border-bottom-color:#3a3a54}body.dark-mode .modal-header h2{color:#90caf9}body.dark-mode .modal-footer{border-top-color:#3a3a54}body.dark-mode .tab-navigation{border-bottom-color:#3a3a54}body.dark-mode .tab-button{color:#b0b0c0}body.dark-mode .tab-button:hover{color:#e0e0e0;background-color:#2a2a44}body.dark-mode .tab-button.active{color:#90caf9;border-bottom-color:#64b5f6;background-color:#2a2a44}body.dark-mode .error-message{background-color:var(--color-error-bg);border-left-color:var(--color-error-border);color:var(--color-error)}body.dark-mode .success-message{background-color:var(--color-success-bg);border-left-color:var(--color-success-border);color:var(--color-success)}body.dark-mode .cache-timestamp{color:#8888a0}body.dark-mode a{color:#64b5f6}body.dark-mode a:hover{color:#90caf9}body.dark-mode .toolbar{background:#242438;border-bottom-color:#3a3a54;box-shadow:0 2px 4px #0000004d}body.dark-mode .toolbar-title{color:#90caf9}body.dark-mode .data-table{background-color:#242438;box-shadow:0 2px 8px #0000004d}body.dark-mode .data-table thead{background-color:#2a2a44;border-bottom-color:#3a3a54}body.dark-mode .data-table th{color:#e0e0e0}body.dark-mode .data-table td{border-bottom-color:#3a3a54;color:#e0e0e0}body.dark-mode .data-table tbody tr:hover{background-color:#2a2a44}body.dark-mode .btn-icon{color:#8888a0}body.dark-mode .btn-icon:hover{background-color:#3a3a54;color:#e0e0e0}body.dark-mode .btn-close{color:#8888a0}body.dark-mode .btn-close:hover{color:#e0e0e0;background-color:#3a3a54}body.dark-mode .search-input{background-color:#2a2a44;border-color:#3a3a54;color:#e0e0e0}body.dark-mode .search-input::placeholder{color:#8888a0}body.dark-mode .search-input:focus{border-color:#64b5f6;box-shadow:0 0 0 3px #64b5f633}body.dark-mode .loading-overlay{background:#1a1a2eb3}body.dark-mode .loading-content{background:#242438;color:#e0e0e0;box-shadow:0 4px 12px #0006}body.dark-mode .detail-label{color:#8888a0}body.dark-mode .detail-value{color:#e0e0e0}