:root{--color-primary: #0075F2;--color-navy: #070A61;--color-accent: #FDB322;--color-green: #0a8e4a;--color-bg: #f3f9ff;--color-surface: #ffffff;--color-border: #e2e8f0;--color-text: #070A61;--color-muted: #64748b;--color-online: #22c55e;--color-away: #FDB322;--color-danger: #ef4444;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 28px;--radius-full: 999px;--shadow-sm: 0 1px 2px rgba(7, 10, 97, .04);--shadow-md: 0 2px 8px rgba(7, 10, 97, .06), 0 1px 2px rgba(7, 10, 97, .04);--shadow-lg: 0 4px 16px rgba(7, 10, 97, .08), 0 2px 4px rgba(7, 10, 97, .04);--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 40px;--font-body: "Inter", system-ui, -apple-system, sans-serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--sidebar-w: 260px;--header-h: 64px;--transition: .18s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);line-height:1.5;-webkit-font-smoothing:antialiased;height:100vh;overflow:hidden}a{color:inherit;text-decoration:none}.app-shell{display:grid;grid-template-columns:var(--sidebar-w) 1fr;grid-template-rows:var(--header-h) 1fr;height:100vh}.app-shell app-header{grid-column:1/-1}.app-shell app-sidebar{grid-row:2;overflow-y:auto}.app-shell main{grid-row:2;overflow:hidden}.muted{color:var(--color-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 18px;border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:var(--transition);background:var(--color-surface);color:var(--color-text)}.btn:hover{background:var(--color-bg)}.btn--primary{background:var(--color-primary);border-color:var(--color-primary);color:#fff;font-weight:600;border-radius:var(--radius-full);box-shadow:0 2px 8px #0075f240}.btn--primary:hover{background:#0066d6;box-shadow:0 4px 12px #0075f24d}.btn--icon{padding:8px;border:none;background:transparent;color:var(--color-muted);border-radius:var(--radius-md)}.btn--icon:hover{background:#e2e8f0;color:var(--color-navy)}.btn--ghost{border:none;background:transparent;color:var(--color-muted)}.btn--ghost:hover{color:var(--color-navy);background:#e2e8f0}input,textarea{width:100%;padding:10px 16px;border:1px solid var(--color-border);border-radius:var(--radius-lg);font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-text);background:var(--color-surface);transition:var(--transition)}input::placeholder,textarea::placeholder{color:#94a3b8}input:focus,textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #0075f21a}.avatar{width:40px;height:40px;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--color-primary),var(--color-navy));color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);font-weight:600;flex-shrink:0}.avatar--sm{width:32px;height:32px;font-size:var(--text-xs)}.avatar--lg{width:56px;height:56px;font-size:var(--text-xl)}.status-dot{width:10px;height:10px;border-radius:var(--radius-full);border:2px solid var(--color-surface)}.status-dot--online{background:var(--color-online)}.status-dot--away{background:var(--color-away)}.status-dot--offline{background:#cbd5e1}.badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:var(--radius-full);font-size:.65rem;font-weight:700;line-height:1}.badge--primary{background:var(--color-primary);color:#fff}.badge--accent{background:var(--color-accent);color:var(--color-navy)}.badge--danger{background:var(--color-danger);color:#fff}.card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border)}.skeleton{background:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9,#e2e8f0 75%);background-size:200% 100%;animation:skeleton-load 1.4s infinite;border-radius:var(--radius-sm)}@keyframes skeleton-load{0%{background-position:200% 0}to{background-position:-200% 0}}