:root {
  /* Typography */
  --prx-font-sans: "SF Pro Display", "SF Pro Text", "Inter", "Segoe UI", Roboto, Arial, sans-serif;
  --prx-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;

  --prx-font-size-xs: 12px;
  --prx-font-size-sm: 13px;
  --prx-font-size-md: 15px;
  --prx-font-size-lg: 17px;
  --prx-font-size-xl: 20px;
  --prx-font-size-2xl: 28px;
  --prx-font-size-3xl: 42px;

  --prx-line-tight: 1.15;
  --prx-line-snug: 1.25;
  --prx-line-normal: 1.5;

  /* Spacing scale */
  --prx-space-0: 0;
  --prx-space-1: 4px;
  --prx-space-2: 8px;
  --prx-space-3: 12px;
  --prx-space-4: 16px;
  --prx-space-5: 24px;
  --prx-space-6: 32px;
  --prx-space-7: 40px;
  --prx-space-8: 48px;
  --prx-space-9: 64px;
  --prx-space-10: 80px;

  /* Radii */
  --prx-radius-sm: 8px;
  --prx-radius-md: 12px;
  --prx-radius-lg: 16px;
  --prx-radius-xl: 20px;
  --prx-radius-pill: 999px;

  /* Color system */
  --prx-bg: #f4f6f7;
  --prx-panel: #ffffff;
  --prx-panel-muted: #eef2f3;
  --prx-border: rgba(15, 23, 42, 0.1);
  --prx-border-strong: rgba(15, 23, 42, 0.16);

  --prx-text: #0f172a;
  --prx-text-muted: rgba(15, 23, 42, 0.68);
  --prx-text-faint: rgba(15, 23, 42, 0.5);

  --prx-accent: #0f8b87;
  --prx-accent-strong: #0b6f6c;
  --prx-accent-soft: rgba(15, 139, 135, 0.14);

  --prx-success-bg: rgba(22, 163, 74, 0.12);
  --prx-success-text: #166534;
  --prx-warning-bg: rgba(217, 119, 6, 0.14);
  --prx-warning-text: #92400e;
  --prx-danger-bg: rgba(220, 38, 38, 0.12);
  --prx-danger-text: #991b1b;

  /* Elevation */
  --prx-shadow-1: 0 4px 14px rgba(15, 23, 42, 0.06);
  --prx-shadow-2: 0 10px 28px rgba(15, 23, 42, 0.1);

  /* Layout */
  --prx-shell-max: 1440px;
  --prx-content-max: 1180px;
  --prx-reading-max: 760px;
  --prx-sidebar-width: 260px;
  --prx-topbar-height: 52px;
  --prx-gutter-desktop: 24px;
  --prx-gutter-mobile: 16px;

  /* Control sizing */
  --prx-btn-sm-height: 34px;
  --prx-btn-md-height: 42px;
  --prx-btn-lg-height: 48px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}