:root{--color-primary-50:#f5f3ff;--color-primary-100:#ede9fe;--color-primary-200:#ddd6fe;--color-primary-300:#c4b5fd;--color-primary-400:#a78bfa;--color-primary-500:#8b5cf6;--color-primary-600:#7c3aed;--color-primary-700:#6d28d9;--color-primary-800:#5b21b6;--color-primary-900:#4c1d95;--color-gray-50:#f8f9fa;--color-gray-100:#f1f3f5;--color-gray-200:#e9ecef;--color-gray-300:#dee2e6;--color-gray-400:#ced4da;--color-gray-500:#adb5bd;--color-gray-600:#868e96;--color-gray-700:#495057;--color-gray-800:#343a40;--color-gray-900:#212529;--color-success:#37b24d;--color-success-light:#d3f9d8;--color-warning:#f59f00;--color-warning-light:#fff3bf;--color-error:#f03e3e;--color-error-light:#ffe3e3;--color-info:#1c7ed6;--color-info-light:#d0ebff;--bg-body:#f5f7fa;--bg-surface:#fff;--bg-sidebar:#0f0a1a;--bg-header:#fff;--text-primary:var(--color-gray-900);--text-secondary:var(--color-gray-600);--text-muted:var(--color-gray-500);--text-on-dark:#f1f3f5;--text-on-primary:#fff;--border-color:var(--color-gray-200);--border-radius:8px;--border-radius-sm:4px;--border-radius-md:8px;--border-radius-lg:12px;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -2px #0000000d;--shadow-lg:0 10px 15px -3px #00000014, 0 4px 6px -4px #0000000d;--sidebar-width:250px;--header-height:60px;--font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--transition-fast:.15s ease;--transition-base:.2s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;font-size:16px}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--text-primary);background-color:var(--bg-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6}#root{min-height:100vh}a{color:var(--color-primary-600);text-decoration:none}a:hover{color:var(--color-primary-700);text-decoration:underline}img{max-width:100%;display:block}ul,ol{list-style:none}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}h1,h2,h3,h4,h5,h6{color:var(--text-primary);font-weight:600;line-height:1.3}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}h3{font-size:var(--font-size-xl)}h4{font-size:var(--font-size-lg)}.text-muted{color:var(--text-muted);font-size:var(--font-size-sm);line-height:1.7}.dashboard-layout{min-height:100vh;display:flex}.dashboard-main{margin-left:var(--sidebar-width);flex-direction:column;flex:1;min-height:100vh;display:flex}.dashboard-content{flex:1;padding:24px 32px;overflow-y:auto}.sidebar{width:var(--sidebar-width);background:var(--bg-sidebar);z-index:100;transition:transform var(--transition-base);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-overlay{display:none}.sidebar-brand{border-bottom:1px solid #ffffff14;padding:20px 24px}.sidebar-logo{font-size:var(--font-size-xl);color:#fff;letter-spacing:-.5px;font-weight:700}.sidebar-nav{flex:1;padding:12px 0;overflow-y:auto}.sidebar-link{color:var(--text-on-dark);font-size:var(--font-size-sm);transition:background var(--transition-fast), color var(--transition-fast);opacity:.7;border-left:3px solid #0000;align-items:center;gap:12px;padding:10px 24px;font-weight:400;text-decoration:none;display:flex}.sidebar-link:hover{opacity:1;color:#fff;background:#ffffff0f;text-decoration:none}.sidebar-link-active{border-left-color:var(--color-primary-400);opacity:1;color:#fff;background:#ffffff1a;font-weight:500}.sidebar-icon{font-size:var(--font-size-lg);text-align:center;flex-shrink:0;width:22px}.sidebar-label{white-space:nowrap}.header{height:var(--header-height);background:var(--bg-header);border-bottom:1px solid var(--border-color);flex-shrink:0;justify-content:space-between;align-items:center;padding:0 32px;display:flex}.header-left{align-items:center;gap:16px;display:flex}.header-menu-btn{cursor:pointer;font-size:var(--font-size-xl);color:var(--text-secondary);background:0 0;border:none;padding:4px;display:none}.header-account{font-size:var(--font-size-sm);color:var(--text-primary);font-weight:600}.header-right{align-items:center;gap:16px;display:flex}.header-user{align-items:center;gap:8px;display:flex}.header-avatar{background:var(--color-primary-500);width:32px;height:32px;color:var(--text-on-primary);font-size:var(--font-size-sm);border-radius:50%;justify-content:center;align-items:center;font-weight:600;display:flex}.header-username{font-size:var(--font-size-sm);color:var(--text-secondary)}.auth-page{background:var(--bg-body);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.auth-card{width:100%;max-width:420px}.auth-header{text-align:center;margin-bottom:32px}.auth-logo{font-size:var(--font-size-2xl);color:var(--color-primary-600);margin-bottom:8px;font-weight:700}.auth-subtitle{color:var(--text-secondary);font-size:var(--font-size-sm)}.auth-form{flex-direction:column;gap:16px;display:flex}.auth-submit{width:100%;margin-top:8px}.auth-footer{text-align:center;font-size:var(--font-size-sm);color:var(--text-secondary);margin-top:24px}.auth-link{color:var(--color-primary-600);font-weight:500}.auth-loading{justify-content:center;align-items:center;min-height:100vh;display:flex}.page{flex-direction:column;gap:24px;display:flex}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.page-title{font-size:var(--font-size-2xl);margin-bottom:4px;font-weight:700}.page-description{color:var(--text-secondary);font-size:var(--font-size-sm);max-width:600px}.page-grid{gap:20px;display:grid}.page-grid-2{grid-template-columns:repeat(2,1fr)}.page-grid-3{grid-template-columns:repeat(3,1fr)}.page-grid-4{grid-template-columns:repeat(4,1fr)}.card{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--border-radius);box-shadow:var(--shadow-sm);padding:24px}.card-title{font-size:var(--font-size-base);margin-bottom:8px;font-weight:600}.stat-card{flex-direction:column;gap:8px;display:flex}.stat-label{font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:500}.stat-value{font-size:var(--font-size-2xl);color:var(--color-primary-600);font-weight:700}.btn{font-family:var(--font-family);border-radius:var(--border-radius-sm);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;font-weight:500;line-height:1;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-sm{font-size:var(--font-size-xs);height:30px;padding:6px 12px}.btn-md{font-size:var(--font-size-sm);height:38px;padding:8px 16px}.btn-lg{font-size:var(--font-size-base);height:44px;padding:10px 24px}.btn-primary{background:var(--color-primary-600);color:var(--text-on-primary)}.btn-primary:hover:not(:disabled){background:var(--color-primary-700)}.btn-secondary{background:var(--color-gray-100);color:var(--text-primary);border-color:var(--border-color)}.btn-secondary:hover:not(:disabled){background:var(--color-gray-200)}.btn-outline{color:var(--text-primary);border-color:var(--border-color);background:0 0}.btn-outline:hover:not(:disabled){background:var(--color-gray-50);border-color:var(--color-gray-400)}.btn-danger{background:var(--color-error);color:var(--text-on-primary)}.btn-danger:hover:not(:disabled){background:#e03131}.form-group{flex-direction:column;gap:6px;display:flex}.form-label{font-size:var(--font-size-sm);color:var(--text-primary);font-weight:500}.form-input{font-family:var(--font-family);font-size:var(--font-size-sm);border:1px solid var(--border-color);border-radius:var(--border-radius-sm);background:var(--bg-surface);height:40px;color:var(--text-primary);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;width:100%;padding:8px 12px}.form-input::placeholder{color:var(--text-muted)}.form-input:focus{border-color:var(--color-primary-400);box-shadow:0 0 0 3px var(--color-primary-100)}.form-group-error .form-input{border-color:var(--color-error)}.form-group-error .form-input:focus{box-shadow:0 0 0 3px var(--color-error-light)}.form-error{font-size:var(--font-size-xs);color:var(--color-error)}.alert{border-radius:var(--border-radius-sm);font-size:var(--font-size-sm);margin-bottom:8px;padding:12px 16px}.alert-error{background:var(--color-error-light);color:var(--color-error);border:1px solid #ffc9c9}.alert-success{background:var(--color-success-light);color:var(--color-success);border:1px solid #b2f2bb}.table-wrapper{overflow-x:auto}.table{border-collapse:collapse;width:100%;font-size:var(--font-size-sm)}.table th{text-align:left;color:var(--text-secondary);font-weight:600;font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--border-color);background:var(--color-gray-50);padding:10px 16px}.table td{border-bottom:1px solid var(--border-color);color:var(--text-primary);vertical-align:middle;padding:12px 16px}.table tbody tr:hover{background:var(--color-gray-50)}.table-empty{text-align:center;color:var(--text-muted);padding:32px 16px!important}.badge{font-size:var(--font-size-xs);white-space:nowrap;border-radius:100px;align-items:center;padding:2px 10px;font-weight:500;line-height:1.6;display:inline-flex}.badge-default{background:var(--color-gray-100);color:var(--color-gray-700)}.badge-success{background:var(--color-success-light);color:var(--color-success)}.badge-warning{background:var(--color-warning-light);color:#b37300}.badge-danger{background:var(--color-error-light);color:var(--color-error)}.badge-info{background:var(--color-info-light);color:var(--color-info)}.spinner{border-style:solid;border-color:var(--color-gray-200);border-top-color:var(--color-primary-600);border-radius:50%;animation:.6s linear infinite spin;display:inline-block}.spinner-sm{border-width:2px;width:16px;height:16px}.spinner-md{border-width:3px;width:28px;height:28px}.spinner-lg{border-width:4px;width:40px;height:40px}@keyframes spin{to{transform:rotate(360deg)}}.modal-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal{background:var(--bg-surface);border-radius:var(--border-radius-lg);width:100%;max-width:520px;max-height:90vh;box-shadow:var(--shadow-lg);overflow-y:auto}.modal-header{justify-content:space-between;align-items:center;padding:20px 24px 0;display:flex}.modal-title{font-size:var(--font-size-lg);font-weight:600}.modal-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0;font-size:24px;line-height:1}.modal-close:hover{color:var(--text-primary)}.modal-body{padding:20px 24px 24px}.empty-state{text-align:center;background:var(--color-gray-50);border-radius:var(--border-radius-md);border:1px dashed var(--color-gray-200);flex-direction:column;justify-content:center;align-items:center;padding:3rem 2rem;display:flex}.empty-state-icon{opacity:.5;margin-bottom:1rem;font-size:2.5rem}.empty-state-title{color:var(--color-text-primary);margin-bottom:.5rem;font-size:1.125rem;font-weight:600}.empty-state-desc{color:var(--color-text-secondary);max-width:360px;margin-bottom:1.5rem;font-size:.875rem}@media (width<=1024px){.page-grid-4{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.sidebar{transform:translate(-100%)}.sidebar-open{transform:translate(0)}.sidebar-overlay{z-index:99;background:#0006;display:block;position:fixed;inset:0}.dashboard-main{margin-left:0}.header-menu-btn{display:flex}.dashboard-content{padding:16px}.header{padding:0 16px}.page-header{flex-direction:column}.page-grid-2,.page-grid-3,.page-grid-4{grid-template-columns:1fr}.auth-card{padding:20px}.header-username{display:none}}@media (width<=480px){.header-account{display:none}}