.login-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2)}.login-card{background-color:var(--color-background);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:var(--spacing-2xl);width:100%;max-width:400px;text-align:center}.login-card__logo h1{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--spacing-xs)}.login-card__logo p{font-size:var(--font-size-base);color:var(--color-text-secondary);margin-bottom:var(--spacing-2xl)}.login-card__button{width:100%;height:48px;background-color:#fee500;color:#000;font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);border-radius:var(--radius-md);transition:all var(--transition-fast)}.login-card__button:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.login-card__button:active{transform:translateY(0)}.login-card__note{margin-top:var(--spacing-lg);font-size:var(--font-size-sm);color:var(--color-text-tertiary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);font-weight:var(--font-weight-semibold);border-radius:var(--radius-md);transition:all var(--transition-fast);white-space:nowrap}.btn:active{transform:scale(.98)}.btn--sm{height:28px;padding:0 var(--spacing-sm);font-size:var(--font-size-sm)}.btn--md{height:36px;padding:0 var(--spacing-md);font-size:var(--font-size-base)}.btn--lg{height:44px;padding:0 var(--spacing-lg);font-size:var(--font-size-md)}.btn--primary{background-color:var(--color-primary);color:#fff}.btn--primary:hover:not(:disabled){background-color:var(--color-primary-hover)}.btn--primary:active:not(:disabled){background-color:var(--color-primary-active)}.btn--secondary{background-color:var(--color-background-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn--secondary:hover:not(:disabled){background-color:var(--color-background-tertiary);border-color:var(--color-border-hover)}.btn--ghost{background-color:transparent;color:var(--color-text-secondary)}.btn--ghost:hover:not(:disabled){background-color:var(--color-background-secondary);color:var(--color-text-primary)}.btn--destructive{background-color:var(--color-error);color:#fff}.btn--destructive:hover:not(:disabled){opacity:.9}.unauthorized-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background-color:var(--color-background-secondary)}.unauthorized-card{background-color:var(--color-background);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--spacing-2xl);width:100%;max-width:500px;text-align:center}.unauthorized-card__title{font-size:72px;font-weight:var(--font-weight-bold);color:var(--color-error);margin-bottom:var(--spacing-sm)}.unauthorized-card__subtitle{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-md)}.unauthorized-card__message{font-size:var(--font-size-base);color:var(--color-text-secondary);line-height:1.6;margin-bottom:var(--spacing-xl)}.unauthorized-card__actions{display:flex;gap:var(--spacing-md);justify-content:center}.stat-card{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);transition:all var(--transition-fast)}.stat-card:hover{box-shadow:var(--shadow-md);border-color:var(--color-border-hover)}.stat-card__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-sm)}.stat-card__title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px}.stat-card__trend{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);padding:2px var(--spacing-xs);border-radius:var(--radius-sm)}.stat-card__trend--positive{color:var(--color-success);background-color:#34c7591a}.stat-card__trend--negative{color:var(--color-error);background-color:#ff3b301a}.stat-card__value{font-size:var(--font-size-3xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-xs)}.stat-card__subtitle{font-size:var(--font-size-sm);color:var(--color-text-tertiary)}.dashboard-page{max-width:1400px}.dashboard-page__title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-xl) 0}.dashboard-page__section{margin-bottom:var(--spacing-2xl)}.dashboard-page__section-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-md) 0}.dashboard-page__stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--spacing-md)}.dashboard-page__health-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md)}.health-card{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);transition:all var(--transition-fast)}.health-card:hover{box-shadow:var(--shadow-md);border-color:var(--color-border-hover)}.health-card__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-sm)}.health-card__service{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.health-card__status{display:inline-flex;align-items:center;gap:4px;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);padding:2px var(--spacing-xs);border-radius:var(--radius-sm)}.health-card__status--healthy{color:var(--color-success);background-color:#34c7591a}.health-card__status--unhealthy{color:var(--color-error);background-color:#ff3b301a}.health-card__indicator{width:6px;height:6px;border-radius:50%}.health-card__indicator--healthy{background-color:var(--color-success)}.health-card__indicator--unhealthy{background-color:var(--color-error)}.dashboard-page__loading,.dashboard-page__error{display:flex;align-items:center;justify-content:center;min-height:400px;font-size:var(--font-size-base);color:var(--color-text-secondary)}.dashboard-page__error{flex-direction:column;gap:var(--spacing-md);color:var(--color-error)}.table-container{width:100%;overflow-x:auto;border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-background)}.table{width:100%;border-collapse:collapse}.table__head{background-color:var(--color-background-secondary);border-bottom:1px solid var(--color-border)}.table__header{padding:var(--spacing-md) var(--spacing-lg);text-align:left;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px}.table__body .table__row{border-bottom:1px solid var(--color-border);transition:background-color var(--transition-fast)}.table__body .table__row:last-child{border-bottom:none}.table__row--clickable{cursor:pointer}.table__row--clickable:hover{background-color:var(--color-background-secondary)}.table__cell{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base);color:var(--color-text-primary)}.table__empty{padding:var(--spacing-2xl);text-align:center;color:var(--color-text-tertiary);font-size:var(--font-size-base)}.users-page{max-width:1400px}.users-page__title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--spacing-xl) 0}.users-page__filters{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-lg);flex-wrap:wrap}.users-page__search{flex:1;min-width:240px;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);color:var(--color-text-primary);background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.users-page__search:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #0071e31a}.users-page__select{min-width:160px;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);color:var(--color-text-primary);background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast);cursor:pointer}.users-page__select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #0071e31a}.users-page__pagination{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);margin-top:var(--spacing-xl)}.users-page__pagination-button{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.users-page__pagination-button:hover:not(:disabled){color:var(--color-primary);border-color:var(--color-primary)}.users-page__pagination-button:disabled{opacity:.5;cursor:not-allowed}.users-page__pagination-button--active{color:var(--color-background);background-color:var(--color-primary);border-color:var(--color-primary)}.users-page__pagination-info{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0 var(--spacing-md)}.badge{display:inline-flex;align-items:center;padding:2px var(--spacing-xs);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);border-radius:var(--radius-sm)}.badge--admin{color:#bf3000;background-color:#bf30001a}.badge--agent{color:#0071e3;background-color:#0071e31a}.badge--user{color:var(--color-text-secondary);background-color:var(--color-background-hover)}.badge--system{color:#8e44ad;background-color:#8e44ad1a}.badge--enabled{color:var(--color-success);background-color:#34c7591a}.badge--disabled{color:var(--color-text-tertiary);background-color:var(--color-background-hover)}.users-page__loading,.users-page__error{display:flex;align-items:center;justify-content:center;min-height:400px;font-size:var(--font-size-base);color:var(--color-text-secondary)}.users-page__error{flex-direction:column;gap:var(--spacing-md);color:var(--color-error)}.users-page__empty{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-secondary)}.app{display:flex;flex-direction:column;height:100vh;background-color:var(--color-background-secondary)}.app__header{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 var(--spacing-lg);background-color:var(--color-background);border-bottom:1px solid var(--color-border)}.app__header-left{display:flex;align-items:center}.app__logo{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.app__header-right{display:flex;align-items:center;gap:var(--spacing-md)}.app__user-name{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:var(--font-weight-medium)}.app__body{display:flex;flex:1;overflow:hidden}.app__sidebar{width:240px;background-color:var(--color-background);border-right:1px solid var(--color-border);padding:var(--spacing-lg) 0;overflow-y:auto}.app__nav{display:flex;flex-direction:column;gap:2px}.app__nav-item{display:flex;align-items:center;width:100%;padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);background:transparent;border:none;text-align:left;cursor:pointer;transition:all var(--transition-fast)}.app__nav-item:hover{background-color:var(--color-background-hover);color:var(--color-text-primary)}.app__nav-item--active{color:var(--color-primary);background-color:#0071e31a;font-weight:var(--font-weight-semibold)}.app__main{flex:1;padding:var(--spacing-xl);overflow-y:auto}:root{--color-background: #ffffff;--color-background-secondary: #f5f5f7;--color-background-tertiary: #e8e8ed;--color-text-primary: #1d1d1f;--color-text-secondary: #6e6e73;--color-text-tertiary: #86868b;--color-border: #d2d2d7;--color-border-hover: #86868b;--color-primary: #0071e3;--color-primary-hover: #0077ed;--color-primary-active: #006edb;--color-success: #34c759;--color-warning: #ff9500;--color-error: #ff3b30;--color-info: #5ac8fa;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-lg: 0 12px 24px rgba(0, 0, 0, .12);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-full: 9999px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 48px;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-size-xs: 10px;--font-size-sm: 11px;--font-size-base: 12px;--font-size-md: 13px;--font-size-lg: 15px;--font-size-xl: 17px;--font-size-2xl: 21px;--font-size-3xl: 28px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--z-dropdown: 1000;--z-sticky: 1020;--z-modal-backdrop: 1030;--z-modal: 1040;--z-tooltip: 1050}@media(prefers-color-scheme:dark){:root{--color-background: #000000;--color-background-secondary: #1c1c1e;--color-background-tertiary: #2c2c2e;--color-text-primary: #f5f5f7;--color-text-secondary: #98989d;--color-text-tertiary: #6e6e73;--color-border: #38383a;--color-border-hover: #545456;--color-primary: #0a84ff;--color-primary-hover: #409cff;--color-primary-active: #0077ed}}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text-primary);background-color:var(--color-background);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-semibold);line-height:1.2;color:var(--color-text-primary)}h1{font-size:var(--font-size-3xl);margin-bottom:var(--spacing-lg)}h2{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-md)}h3{font-size:var(--font-size-xl);margin-bottom:var(--spacing-sm)}p{margin-bottom:var(--spacing-md)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-hover)}button{font-family:var(--font-family);cursor:pointer;border:none;background:none}button:disabled{cursor:not-allowed;opacity:.5}input,textarea,select{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text-primary)}input:focus,textarea:focus,select:focus{outline:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}