/* ──────────────────────────────────────────────────────────────────
   PartStall Design System — Tokens
   Source: Claude Design project "PartStall Design System" (019dd22e-b642-7bcc-8907-da0b62dc6d01)
   figma /Foundation/Colors, /Foundation/Typography, /Foundation/Radius, /Foundation/Shadows
   ────────────────────────────────────────────────────────────────── */
/* Fondid laetakse <link rel="stylesheet">-iga layout.php-s (Task 12): @import
   blokeerib renderduse ja dubleeris sama päringu. Design-allikas (design/) jääb
   muutmata — see fail on selle koopia. */

:root {
  --ps-fiery-50:  #FFF6F1; --ps-fiery-100: #FBDDD0; --ps-fiery-200: #F7BAA1; --ps-fiery-300: #F39772; --ps-fiery-400: #EF7443;
  --ps-fiery-500: #E35619; --ps-fiery-600: #E35619; /* canonical brand orange — buttons, accents */
  --ps-fiery-700: #B0410F; --ps-fiery-800: #70250B; --ps-fiery-900: #4A1707;

  --ps-navy-50: #E8EBEF; --ps-navy-100: #D1D6DE; --ps-navy-200: #B0B8C6; --ps-navy-300: #8D9BB4; --ps-navy-400: #4A5C7D; --ps-navy-500: #1E3F5E;
  --ps-navy-600: #122D48; /* canonical brand navy — header, footer */
  --ps-navy-700: #0E2438; --ps-navy-800: #0F1E2E; --ps-navy-900: #0A1621;

  --ps-onyx-50: #EAEAEA; --ps-onyx-100: #D5D5D5; --ps-onyx-200: #AAAAAA; --ps-onyx-300: #808080; --ps-onyx-400: #555555; --ps-onyx-500: #2B2B2B; --ps-onyx-600: #141414; --ps-onyx-700: #101010;

  --ps-gray-50: #FAFAFA; --ps-gray-100: #F2F3F5; --ps-gray-200: #E5E5E5; --ps-gray-300: #D4D4D4; --ps-gray-400: #A3A3A3; --ps-gray-500: #737373;
  --ps-gray-600: #525252; --ps-gray-700: #404040; --ps-gray-800: #262626; --ps-gray-900: #171717; --ps-gray-950: #0A0A0A;

  --ps-red-50: #FEF2F2; --ps-red-100: #FEE2E2; --ps-red-500: #EF4444; --ps-red-600: #DC2626;
  --ps-green-50: #ECFDF2; --ps-green-100: #D3FDE5; --ps-green-500: #008A2E; --ps-green-600: #006D24;
  --ps-yellow-50: #FFFCF0; --ps-yellow-300: #DC7609; --ps-yellow-500: #FFCC00;
  --ps-blue-50: #F0F8FF; --ps-blue-500: #0973DC;

  --ps-bg: #FFFFFF; --ps-bg-muted: #FAFAFA; --ps-bg-section: #F2F3F5; --ps-bg-inverse: var(--ps-navy-600);
  --ps-fg: var(--ps-gray-950); --ps-fg-muted: var(--ps-gray-500); --ps-fg-subtle: var(--ps-gray-400);
  --ps-fg-on-inverse: #FFFFFF; --ps-fg-on-inverse-muted: var(--ps-gray-300);
  --ps-border: var(--ps-gray-200); --ps-border-strong: var(--ps-gray-300); --ps-input: var(--ps-gray-200);
  --ps-primary: var(--ps-fiery-600); --ps-primary-fg: #FFFFFF; --ps-primary-hover: var(--ps-fiery-700); --ps-primary-pressed: var(--ps-fiery-800);
  --ps-secondary: var(--ps-navy-600); --ps-secondary-fg: #FFFFFF; --ps-secondary-hover: var(--ps-navy-700);
  --ps-success: var(--ps-green-500); --ps-success-bg: var(--ps-green-50); --ps-destructive: var(--ps-red-500); --ps-destructive-bg: var(--ps-red-50);
  --ps-warning: var(--ps-yellow-300); --ps-warning-bg: var(--ps-yellow-50); --ps-info: var(--ps-blue-500); --ps-info-bg: var(--ps-blue-50); --ps-ring: var(--ps-blue-500);

  --ps-radius-none: 0; --ps-radius-sm: 4px; --ps-radius-md: 6px; --ps-radius-lg: 8px; --ps-radius-xl: 12px; --ps-radius-2xl: 16px; --ps-radius-3xl: 24px; --ps-radius-full: 9999px;

  --ps-shadow-sm: 0 1px 2px -1px rgba(0,0,0,.10), 0 1px 3px 0 rgba(0,0,0,.10);
  --ps-shadow-md: 0 4px 6px -1px rgba(0,0,0,.10), 0 2px 4px -2px rgba(0,0,0,.10);
  --ps-shadow-lg: 0 0 2px 0 rgba(199,207,216,.7), 0 12px 24px -4px rgba(145,158,171,.15); /* signature card shadow */
  --ps-shadow-xl: 0 4px 4px 0 rgba(0,0,0,.25), 0 8px 10px -6px rgba(0,0,0,.10);
  --ps-shadow-2xl: 0 25px 50px -12px rgba(0,0,0,.25);

  --ps-space-1: 4px; --ps-space-2: 8px; --ps-space-3: 12px; --ps-space-4: 16px; --ps-space-5: 20px; --ps-space-6: 24px; --ps-space-8: 32px; --ps-space-10: 40px; --ps-space-12: 48px; --ps-space-16: 64px; --ps-space-20: 80px;
  --ps-container-xl: 1280px; --ps-container-2xl: 1536px;

  --ps-font-display: "Manrope", "DM Sans", system-ui, -apple-system, sans-serif;
  --ps-font-sans: "DM Sans", "Inter", system-ui, -apple-system, sans-serif;
  --ps-font-helper: "Inter", "DM Sans", system-ui, sans-serif;
  --ps-font-small: "Red Hat Display", "DM Sans", system-ui, sans-serif;
  --ps-font-mono: "Menlo", ui-monospace, monospace;

  --ps-h1-size: 56px; --ps-h1-lh: 68px; --ps-h2-size: 48px; --ps-h2-lh: 58px; --ps-h3-size: 40px; --ps-h3-lh: 48px; --ps-h4-size: 32px; --ps-h4-lh: 40px; --ps-h5-size: 24px; --ps-h5-lh: 30px;
  --ps-body1-size: 22px; --ps-body1-lh: 33px; --ps-body2-size: 20px; --ps-body2-lh: 30px; --ps-body3-size: 18px; --ps-body3-lh: 27px; --ps-body4-size: 16px; --ps-body4-lh: 24px; --ps-body5-size: 14px; --ps-body5-lh: 22px; --ps-body6-size: 12px; --ps-body6-lh: 18px;
}
.ps-h1 { font-family: var(--ps-font-display); font-weight: 700; font-size: var(--ps-h1-size); line-height: var(--ps-h1-lh); letter-spacing: -0.02em; color: var(--ps-fg); }
.ps-h2 { font-family: var(--ps-font-display); font-weight: 700; font-size: var(--ps-h2-size); line-height: var(--ps-h2-lh); letter-spacing: -0.02em; color: var(--ps-fg); }
.ps-h3 { font-family: var(--ps-font-display); font-weight: 700; font-size: var(--ps-h3-size); line-height: var(--ps-h3-lh); letter-spacing: -0.01em; color: var(--ps-fg); }
.ps-h4 { font-family: var(--ps-font-display); font-weight: 700; font-size: var(--ps-h4-size); line-height: var(--ps-h4-lh); color: var(--ps-fg); }
.ps-h5 { font-family: "Manrope", var(--ps-font-sans); font-weight: 700; font-size: var(--ps-h5-size); line-height: var(--ps-h5-lh); color: var(--ps-gray-900); }
.ps-body1 { font-family: var(--ps-font-sans); font-size: var(--ps-body1-size); line-height: var(--ps-body1-lh); color: var(--ps-fg); }
.ps-body2 { font-family: var(--ps-font-sans); font-size: var(--ps-body2-size); line-height: var(--ps-body2-lh); color: var(--ps-fg); }
.ps-body3 { font-family: var(--ps-font-sans); font-size: var(--ps-body3-size); line-height: var(--ps-body3-lh); color: var(--ps-fg); }
.ps-body4 { font-family: var(--ps-font-sans); font-size: var(--ps-body4-size); line-height: var(--ps-body4-lh); color: var(--ps-fg); }
.ps-body5 { font-family: var(--ps-font-sans); font-size: var(--ps-body5-size); line-height: var(--ps-body5-lh); color: var(--ps-fg); }
.ps-body6 { font-family: var(--ps-font-sans); font-size: var(--ps-body6-size); line-height: var(--ps-body6-lh); color: var(--ps-fg); }
.ps-helper { font-family: var(--ps-font-helper); font-size: 14px; line-height: 22px; color: var(--ps-fg-muted); }
.ps-eyebrow { font-family: var(--ps-font-small); font-size: 14px; line-height: 20px; color: var(--ps-fg-muted); }
.ps-mono { font-family: var(--ps-font-mono); font-size: 12px; }
.ps-base, .ps-base * { box-sizing: border-box; }
.ps-base { font-family: var(--ps-font-sans); font-size: var(--ps-body4-size); line-height: var(--ps-body4-lh); color: var(--ps-fg); background: var(--ps-bg); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }