:root {
  --color-bg: #f5f6f8;
  --color-surface: #ffffff;
  --color-surface-alt: #fafbfc;
  --color-border: #e4e7ec;
  --color-text: #101828;
  --color-text-muted: #667085;
  --color-text-faint: #98a2b3;
  --color-primary: #4f46e5;
  --color-primary-hover: #4338ca;
  --color-primary-soft: #eef2ff;
  --color-success: #12b76a;
  --color-success-soft: #ecfdf3;
  --color-warning: #f79009;
  --color-warning-soft: #fffaeb;
  --color-danger: #f04438;
  --color-danger-soft: #fef3f2;
  --color-info: #0ea5e9;
  --color-info-soft: #f0f9ff;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
  --shadow-md: 0 4px 12px rgba(16, 24, 40, 0.08);
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  font-family: var(--font-sans);
  background: var(--color-bg);
  color: var(--color-text);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { margin: 0 0 4px; font-weight: 600; letter-spacing: -0.01em; }
h1 { font-size: 22px; }
h2 { font-size: 17px; }
h3 { font-size: 15px; }
p { margin: 0 0 8px; }
a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

.text-muted { color: var(--color-text-muted); }
.text-faint { color: var(--color-text-faint); }
.text-sm { font-size: 12.5px; }