:root { --color-bg:#fff; --color-surface:#fafafa; --color-surface-soft:#f6f6f6; --color-text:#111; --color-text-secondary:#4f4f4f; --color-text-muted:#777; --color-border:#e6e6e6; --color-border-strong:#dcdcdc; --color-brand:#4d13c2; --color-brand-hover:#3e0fa0; --color-brand-soft:#a78bfa; --color-inverse:#fff; --container-max:1504px; --gutter:24px; --gutter-tablet:22px; --gutter-mobile:16px; --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px; --font-sans:Inter,"Helvetica Neue",Helvetica,Arial,sans-serif; --text-xs:11px; --text-sm:13px; --text-base:15px; --radius-sm:4px; --radius-md:8px; --transition-fast:140ms; --transition-base:200ms; --ease-out:cubic-bezier(.22,1,.36,1); --z-sticky:20; }