*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{line-height:1.15;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{min-height:100vh;text-rendering:optimizeSpeed}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}ul,ol{list-style:none}button{border:none;background:none;cursor:pointer}:root{--color-bg: #fafafa;--color-bg-elevated: #ffffff;--color-bg-hover: #f5f5f5;--color-bg-active: #eeeeee;--color-text: #1a1a1a;--color-text-muted: #6b7280;--color-text-inverse: #ffffff;--color-border: #e5e7eb;--color-border-strong: #d1d5db;--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-primary-light: #dbeafe;--color-primary-dark: #1e40af;--color-success: #22c55e;--color-success-bg: #dcfce7;--color-warning: #f59e0b;--color-warning-bg: #fef3c7;--color-error: #ef4444;--color-error-bg: #fee2e2;--color-info: #06b6d4;--color-info-bg: #cffefe;--chart-line-1: #3b82f6;--chart-line-2: #22c55e;--chart-line-3: #f59e0b;--chart-line-4: #8b5cf6;--chart-line-5: #ec4899;--chart-fill-1: color-mix(in srgb, var(--chart-line-1) 20%, transparent);--chart-fill-2: color-mix(in srgb, var(--chart-line-2) 20%, transparent);--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;--font-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--font-light: 300;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--leading-tight: 1.25;--leading-normal: 1.5;--leading-relaxed: 1.75;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .07), 0 2px 4px -2px rgb(0 0 0 / .05);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .08), 0 4px 6px -4px rgb(0 0 0 / .05);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .08), 0 8px 10px -6px rgb(0 0 0 / .05);--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .35s ease;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal: 1040;--z-popover: 1050;--z-tooltip: 1060;--header-height: 56px;--sidebar-width: 240px;--container-max: 1400px}@media(prefers-color-scheme:dark){:root{--color-bg: #0f0f0f;--color-bg-elevated: #1a1a1a;--color-bg-hover: #262626;--color-bg-active: #333333;--color-text: #f5f5f5;--color-text-muted: #9ca3af;--color-border: #333333;--color-border-strong: #404040;--color-primary: #60a5fa;--color-primary-hover: #3b82f6;--color-primary-light: rgba(96, 165, 250, .15);--color-primary-dark: #93c5fd;--color-success-bg: rgba(34, 197, 94, .15);--color-warning-bg: rgba(245, 158, 11, .15);--color-error-bg: rgba(239, 68, 68, .15);--color-info-bg: rgba(6, 182, 212, .15)}}[data-theme=dark]{--color-bg: #0f0f0f;--color-bg-elevated: #1a1a1a;--color-bg-hover: #262626;--color-bg-active: #333333;--color-text: #f5f5f5;--color-text-muted: #9ca3af;--color-border: #333333;--color-border-strong: #404040;--color-primary: #60a5fa;--color-primary-hover: #3b82f6;--color-primary-light: rgba(96, 165, 250, .15);--color-primary-dark: #93c5fd;--color-success-bg: rgba(34, 197, 94, .15);--color-warning-bg: rgba(245, 158, 11, .15);--color-error-bg: rgba(239, 68, 68, .15);--color-info-bg: rgba(6, 182, 212, .15)}[data-theme=light]{--color-bg: #fafafa;--color-bg-elevated: #ffffff;--color-bg-hover: #f5f5f5;--color-bg-active: #eeeeee;--color-text: #1a1a1a;--color-text-muted: #6b7280;--color-text-inverse: #ffffff;--color-border: #e5e7eb;--color-border-strong: #d1d5db;--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-primary-light: #dbeafe;--color-primary-dark: #1e40af;--color-success-bg: #dcfce7;--color-warning-bg: #fef3c7;--color-error-bg: #fee2e2;--color-info-bg: #cffefe}html{font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--color-text);background-color:var(--color-bg)}h1,h2,h3,h4,h5,h6{font-weight:var(--font-semibold);line-height:var(--leading-tight);color:var(--color-text)}h1{font-size:var(--text-3xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}h4{font-size:var(--text-lg)}h5{font-size:var(--text-base)}h6{font-size:var(--text-sm)}p{margin-bottom:var(--space-md)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-hover)}strong,b{font-weight:var(--font-semibold)}em,i{font-style:italic}code{font-family:var(--font-mono);font-size:.9em;padding:.125rem .375rem;background:var(--color-bg-active);border-radius:var(--radius-sm)}.text-muted{color:var(--color-text-muted)}.text-monospace{font-family:var(--font-mono)}.text-uppercase{text-transform:uppercase;letter-spacing:.05em}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}.text-sm{font-size:var(--text-sm)}.text-xs{font-size:var(--text-xs)}.text-lg{font-size:var(--text-lg)}.text-xl{font-size:var(--text-xl)}.font-medium{font-weight:var(--font-medium)}.font-semibold{font-weight:var(--font-semibold)}.font-bold{font-weight:var(--font-bold)}.header{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;justify-content:space-between;height:var(--header-height);padding:0 var(--space-lg);background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border)}.header__logo{display:flex;align-items:center;gap:var(--space-sm);font-weight:var(--font-bold);font-size:var(--text-lg);color:var(--color-text)}.header__logo-icon{width:28px;height:28px;color:var(--color-primary)}.header__actions{display:flex;align-items:center;gap:var(--space-sm)}.header__btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-muted);transition:all var(--transition-fast)}.header__btn:hover{background:var(--color-bg-hover);color:var(--color-text)}.header__btn svg{width:20px;height:20px}.header__btn--active{color:var(--color-primary);background:var(--color-primary-light)}.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--space-lg)}.main{padding:var(--space-lg) 0;min-height:calc(100vh - var(--header-height))}.grid{display:grid;gap:var(--space-lg)}.grid--cols-1{grid-template-columns:repeat(1,1fr)}.grid--cols-2{grid-template-columns:repeat(2,1fr)}.grid--cols-3{grid-template-columns:repeat(3,1fr)}.grid--cols-4{grid-template-columns:repeat(4,1fr)}.grid--cols-6{grid-template-columns:repeat(6,1fr)}@media(max-width:1024px){.grid--cols-4{grid-template-columns:repeat(2,1fr)}.grid--cols-6{grid-template-columns:repeat(3,1fr)}}@media(max-width:640px){.grid--cols-2,.grid--cols-3,.grid--cols-4,.grid--cols-6{grid-template-columns:1fr}}.flex{display:flex}.flex--col{flex-direction:column}.flex--wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.p-xl{padding:var(--space-xl)}.card{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden}.card__header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border)}.card__title{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text)}.card__actions{display:flex;gap:var(--space-sm)}.card__body{padding:var(--space-lg)}.card--no-padding .card__body{padding:0}.card__footer{padding:var(--space-md) var(--space-lg);border-top:1px solid var(--color-border);background:var(--color-bg-hover)}.metric{display:flex;flex-direction:column;gap:var(--space-xs)}.metric__label{font-size:var(--text-sm);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.metric__value{font-size:var(--text-3xl);font-weight:var(--font-bold);color:var(--color-text);line-height:1}.metric__change{display:inline-flex;align-items:center;gap:var(--space-xs);font-size:var(--text-sm);font-weight:var(--font-medium)}.metric__change--positive{color:var(--color-success)}.metric__change--negative{color:var(--color-error)}.metric__change--neutral{color:var(--color-text-muted)}.metric__icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-lg);background:var(--color-primary-light);color:var(--color-primary)}.metric__icon svg{width:20px;height:20px}.metric--row{flex-direction:row;align-items:center;justify-content:space-between}.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}.table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}.table thead{position:sticky;top:0;background:var(--color-bg-elevated);z-index:10}.table th{padding:var(--space-md) var(--space-lg);text-align:left;font-weight:var(--font-semibold);color:var(--color-text-muted);text-transform:uppercase;font-size:var(--text-xs);letter-spacing:.05em;border-bottom:2px solid var(--color-border);white-space:nowrap}.table th[data-sortable]{cursor:pointer;user-select:none;transition:color var(--transition-fast)}.table th[data-sortable]:hover{color:var(--color-text)}.table th[data-sortable] .sort-icon{display:inline-flex;margin-left:var(--space-xs);opacity:.5}.table th[data-sortable][data-sorted=asc] .sort-icon,.table th[data-sortable][data-sorted=desc] .sort-icon{opacity:1;color:var(--color-primary)}.table td{padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border);color:var(--color-text)}.table tbody tr{transition:background var(--transition-fast)}.table tbody tr:hover{background:var(--color-bg-hover)}.table tbody tr:last-child td{border-bottom:none}.table__cell--truncate{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.table__cell--numeric{text-align:right;font-family:var(--font-mono)}.table__cell--center{text-align:center}.table__empty{padding:var(--space-2xl);text-align:center;color:var(--color-text-muted)}.table__progress{width:100%;height:6px;background:var(--color-bg-active);border-radius:var(--radius-full);overflow:hidden}.table__progress-bar{height:100%;background:var(--color-primary);border-radius:var(--radius-full);transition:width var(--transition-normal)}.chart{position:relative;width:100%;height:100%;min-height:200px}.chart__container{position:relative;width:100%;height:100%}.chart__svg{display:block;width:100%;height:100%;overflow:visible}.chart__line{fill:none;stroke:var(--chart-line-1);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.chart__area{fill:var(--chart-fill-1);stroke:none}.chart__dot{fill:var(--color-bg-elevated);stroke:var(--chart-line-1);stroke-width:2;r:4;transition:r var(--transition-fast)}.chart__dot:hover{r:6}.chart__bar{fill:var(--chart-line-1);transition:fill var(--transition-fast),y var(--transition-normal),height var(--transition-normal)}.chart__bar:hover{fill:var(--chart-line-2)}.chart__axis{stroke:var(--color-border);stroke-width:1}.chart__grid{stroke:var(--color-border);stroke-width:1;stroke-dasharray:4 4;opacity:.5}.chart__label{fill:var(--color-text-muted);font-size:11px;font-family:var(--font-sans)}.chart__label--x{text-anchor:middle}.chart__label--y{text-anchor:end;dominant-baseline:middle}.chart__tooltip{position:absolute;padding:var(--space-sm) var(--space-md);background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);font-size:var(--text-xs);pointer-events:none;opacity:0;transition:opacity var(--transition-fast);z-index:var(--z-tooltip);white-space:nowrap}.chart__tooltip--visible{opacity:1}.chart__tooltip-label{color:var(--color-text-muted);margin-bottom:var(--space-xs)}.chart__tooltip-value{font-weight:var(--font-semibold);color:var(--color-text)}.chart__legend{display:flex;flex-wrap:wrap;gap:var(--space-md);padding:var(--space-md) 0;justify-content:center}.chart__legend-item{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--text-sm);color:var(--color-text-muted)}.chart__legend-color{width:12px;height:12px;border-radius:var(--radius-sm)}.chart--loading{display:flex;align-items:center;justify-content:center;min-height:200px}.chart__spinner{width:32px;height:32px;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.sparkline{display:inline-block;vertical-align:middle}.sparkline--up{color:var(--color-success)}.sparkline--down{color:var(--color-error)}.sparkline--neutral{color:var(--color-text-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);font-weight:var(--font-medium);border-radius:var(--radius-md);border:1px solid transparent;cursor:pointer;transition:all var(--transition-fast);text-decoration:none;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn svg{width:16px;height:16px}.btn--primary{background:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary)}.btn--primary:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn--secondary{background:var(--color-bg-elevated);color:var(--color-text);border-color:var(--color-border)}.btn--secondary:hover:not(:disabled){background:var(--color-bg-hover);border-color:var(--color-border-strong)}.btn--ghost{background:transparent;color:var(--color-text);border-color:transparent}.btn--ghost:hover:not(:disabled){background:var(--color-bg-hover)}.btn--icon{padding:var(--space-sm);aspect-ratio:1}.btn--sm{padding:var(--space-xs) var(--space-sm);font-size:var(--text-xs)}.btn--lg{padding:var(--space-md) var(--space-lg);font-size:var(--text-base)}.badge{display:inline-flex;align-items:center;padding:var(--space-xs) var(--space-sm);font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-full);white-space:nowrap}.badge--default{background:var(--color-bg-hover);color:var(--color-text-muted)}.badge--primary{background:var(--color-primary-light);color:var(--color-primary)}.badge--success{background:var(--color-success-bg);color:var(--color-success)}.badge--warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge--error{background:var(--color-error-bg);color:var(--color-error)}.badge--info{background:var(--color-info-bg);color:var(--color-info)}.badge__dot{width:6px;height:6px;border-radius:50%;margin-right:var(--space-xs)}.badge__dot--success{background:var(--color-success)}.badge__dot--warning{background:var(--color-warning)}.badge__dot--error{background:var(--color-error)}.date-picker{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-sm)}.date-picker__presets{display:flex;gap:var(--space-xs)}.date-picker__preset{padding:var(--space-xs) var(--space-sm);font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-bg-elevated);color:var(--color-text-muted);cursor:pointer;transition:all var(--transition-fast)}.date-picker__preset:hover{background:var(--color-bg-hover);color:var(--color-text)}.date-picker__preset--active{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}.date-picker__inputs{display:flex;align-items:center;gap:var(--space-sm)}.date-picker__input{padding:var(--space-xs) var(--space-sm);font-size:var(--text-sm);font-family:var(--font-sans);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-elevated);color:var(--color-text);min-width:120px}.date-picker__input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.date-picker__separator{color:var(--color-text-muted)}@media(max-width:640px){.date-picker{flex-direction:column;align-items:stretch}.date-picker__presets{flex-wrap:wrap}.date-picker__inputs{width:100%}.date-picker__input{flex:1}}.d-none{display:none!important}.d-block{display:block!important}.d-flex{display:flex!important}.d-inline-flex{display:inline-flex!important}.d-grid{display:grid!important}@media(max-width:640px){.d-none-sm{display:none!important}.d-block-sm{display:block!important}.d-flex-sm{display:flex!important}}@media(min-width:641px)and (max-width:1024px){.d-none-md{display:none!important}.d-block-md{display:block!important}.d-flex-md{display:flex!important}}@media(min-width:1025px){.d-none-lg{display:none!important}.d-block-lg{display:block!important}.d-flex-lg{display:flex!important}}.w-full{width:100%}.h-full{height:100%}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.relative{position:relative}.absolute{position:absolute}.pointer{cursor:pointer}.select-none{user-select:none}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.spinner{width:20px;height:20px;border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}.spinner--sm{width:16px;height:16px;border-width:1.5px}.spinner--lg{width:32px;height:32px}@keyframes spin{to{transform:rotate(360deg)}}.alert{padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md);border:1px solid;display:flex;align-items:center;gap:var(--space-sm)}.alert--info{background:var(--color-info-bg);border-color:var(--color-info);color:var(--color-info)}.alert--success{background:var(--color-success-bg);border-color:var(--color-success);color:var(--color-success)}.alert--warning{background:var(--color-warning-bg);border-color:var(--color-warning);color:var(--color-warning)}.alert--error{background:var(--color-error-bg);border-color:var(--color-error);color:var(--color-error)}.divider{height:1px;background:var(--color-border);border:none;margin:var(--space-lg) 0}.divider--vertical{width:1px;height:auto;margin:0 var(--space-md)}
