/* pataspot — Amazon-grade marketplace tokens (single source of truth) */
:root {
  /* Surfaces */
  --c-navy: #131921;
  --c-navy-2: #232F3E;
  --c-page: #F7F8FA;
  --c-surface: #FFFFFF;
  --c-border: #E5E7EB;
  --c-border-strong: #D0D5DD;

  /* Interaction blue */
  --c-primary: #146EB4;
  --c-primary-hover: #0F5A96;
  --c-primary-active: #104C7E;
  --c-primary-tint: rgba(20, 110, 180, 0.08);
  --c-blue-pale: #EAF3FA;
  --c-blue-hover-bg: #F0F7FC;
  --c-placeholder-bg: #006FAC; /* Amplified Access solid blue for empty media */
  --c-magenta: #C2185B; /* category / type accents on listing cards */

  /* Links */
  --c-link: #007185;
  --c-link-hover: #146EB4;
  --c-link-on-dark: #8CC8F0;

  /* Text */
  --c-text: #263238;
  --c-text-2: #667085;
  --c-text-muted: #98A2B3;
  --c-text-on-dark: #FFFFFF;
  --c-text-on-dark-2: #D0D5DD;

  /* Single green exception — back-to-top only */
  --c-back-to-top: #14532D;
  --c-back-to-top-hover: #166534;

  /* Status */
  --c-success: #067D62;
  --c-warning: #B12704;

  /* Shape */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* Elevation */
  --shadow-1: 0 1px 2px rgba(16, 24, 40, 0.06);
  --shadow-2: 0 4px 12px rgba(16, 24, 40, 0.08);

  /* Motion */
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --dur-fast: 150ms;
  --dur: 200ms;

  /* Type */
  --font-sans: "Poppins", Arial, sans-serif;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 14px;
  --fs-md: 16px;
  --fs-lg: 18px;
  --fs-xl: 21px;
  --fs-2xl: 24px;
  --fs-3xl: 28px;
  --lh-tight: 1.25;
  --lh-base: 1.5;

  /* Spacing (4px grid) */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-8: 32px;
  --s-10: 40px;

  /* Bridge → existing component tokens (Styles/input.css @theme) */
  --color-ink: var(--c-text);
  --color-ink-70: var(--c-text-2);
  --color-ink-50: var(--c-text-muted);
  --color-paper: var(--c-surface);
  --color-paper-2: var(--c-page);
  --color-rail: var(--c-border);
  --color-rail-2: var(--c-border-strong);
  --color-action: var(--c-primary);
  --color-action-h: var(--c-primary-hover);
  --color-bronze: var(--c-link);
  --color-bronze-h: var(--c-link-hover);
  --color-smile: var(--c-primary);
  --color-deep: var(--c-navy);
  --color-signal: var(--c-warning);
  --color-moss: var(--c-success);
  --color-ash: var(--c-text-2);
  --color-mast: var(--c-navy);
  --color-sub: var(--c-navy-2);
  --color-sub-hover: #37475A;
  --color-pale: var(--c-blue-pale);
  --color-muted: var(--c-blue-pale);
  --color-shadow: rgba(16, 24, 40, 0.06);
  --color-shadow-md: rgba(16, 24, 40, 0.08);
  --color-shadow-lg: rgba(16, 24, 40, 0.12);
  --color-focus: rgba(20, 110, 180, 0.45);
  --font-sans: "Poppins", Arial, sans-serif;
  --radius-btn: var(--radius-md);
  --radius-xs: var(--radius-sm);
  --radius-card: var(--radius-lg);
}
