:root{--color-primary: #4F46E5;--color-primary-dark: #3730A3;--color-accent: #06B6D4;--color-success: #10B981;--color-warning: #F59E0B;--color-danger: #EF4444;--color-surface: #F8FAFC;--color-card: #FFFFFF;--color-border: #E2E8F0;--color-text: #0F172A;--color-muted: #64748B;--color-sidebar-bg: #1E1B4B;--color-sidebar-hover:#2D2A6E;--color-sidebar-active:#4F46E5;--text-xs: 11px;--text-sm: 13px;--text-base: 15px;--text-lg: 18px;--text-xl: 22px;--text-2xl: 28px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(0,0,0,.08);--shadow-md: 0 4px 12px rgba(0,0,0,.08);--shadow-lg: 0 8px 24px rgba(0,0,0,.1);--sidebar-width: 240px;--header-height: 64px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,sans-serif;font-size:var(--text-base);color:var(--color-text);background:var(--color-surface);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer}input,textarea,select{font-family:inherit}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;border:none;cursor:pointer;transition:background .15s,opacity .15s;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-dark)}.btn-secondary{background:transparent;color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-surface)}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover:not(:disabled){background:#dc2626}.btn-sm{padding:5px 10px;font-size:var(--text-xs)}.btn-lg{padding:12px 24px;font-size:var(--text-base)}.card{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:20px;box-shadow:var(--shadow-sm)}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;line-height:1.6}.badge-free{background:#f1f5f9;color:var(--color-muted)}.badge-basic{background:#eff6ff;color:#2563eb}.badge-pro{background:#f5f3ff;color:var(--color-primary)}.badge-success{background:#ecfdf5;color:var(--color-success)}.badge-warning{background:#fffbeb;color:var(--color-warning)}.badge-danger{background:#fef2f2;color:var(--color-danger)}.badge-accent{background:#ecfeff;color:var(--color-accent)}.input{width:100%;padding:8px 12px;border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-text);background:var(--color-card);transition:border-color .15s,box-shadow .15s;outline:none}.input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #4f46e51f}.input::placeholder{color:var(--color-muted)}.progress-bar{height:6px;background:var(--color-border);border-radius:var(--radius-full);overflow:hidden}.progress-fill{height:100%;border-radius:var(--radius-full);background:var(--color-primary);transition:width .3s ease}.progress-fill.warning{background:var(--color-warning)}.progress-fill.danger{background:var(--color-danger)}.progress-fill.success{background:var(--color-success)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-muted)}