:root {
  color-scheme: light;
  --app-brand: #2865a0;
  --app-brand-hover: #1e527f;
  --app-brand-soft: #eaf2fa;
  --app-sidebar: #172c43;
  --app-sidebar-hover: #27435f;
  --app-bg: #f3f6fa;
  --app-surface: #fff;
  --app-surface-subtle: #f8fafc;
  --app-text: #1e293b;
  --app-text-muted: #64748b;
  --app-border: #dbe3ec;
  --app-success: #28725a;
  --app-warning: #92651d;
  --app-danger: #b7434b;
  --app-info: #367197;
  --app-radius-sm: .5rem;
  --app-radius: .875rem;
  --app-radius-lg: 1.25rem;
  --app-shadow: 0 6px 24px rgba(23,44,67,.07);
  --app-shadow-overlay: 0 20px 50px rgba(14,31,49,.22);
  --app-space-1: .25rem;
  --app-space-2: .5rem;
  --app-space-3: .75rem;
  --app-space-4: 1rem;
  --app-space-5: 1.5rem;
  --app-space-6: 2rem;
  --app-space-7: 3rem;
  --app-sidebar-width: 15.5rem;
  --app-navbar-height: 3.75rem;
  --app-page-max-width: 90rem;
  --app-focus-ring: 0 0 0 3px rgba(40,101,160,.28);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--app-bg);
  color: var(--app-text);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.5;
}
img, svg, canvas { max-width: 100%; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 2px solid var(--app-brand); outline-offset: 2px; }
::selection { background: var(--app-brand-soft); }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}