/* FATMETAL — Design Tokens
   Drop in once; reference var(--token) everywhere. 1rem = 16px. */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap');

:root {
  /* Brand */
  --brand-700:#5E2B5C; --brand-600:#74407A; --brand-500:#8B5A8C;
  --brand-300:#C9A8CA; --brand-200:#E0CCE0; --brand-100:#F0E6F0;

  /* Neutrals / ink */
  --ink-900:#16192C; --ink-700:#3A3F55; --ink-500:#5A6178;
  --ink-400:#9AA0B4; --ink-300:#C7CBD9;

  /* Surfaces & borders */
  --surface-base:#F7F8FA; --surface-card:#FFFFFF; --surface-hover:#F2F3F7;
  --border-default:#E6E8F0; --border-accent:#C9A8CA;

  /* Feedback */
  --success:#2E9E6B; --warning:#D9A441; --danger:#D14B4B; --info:#4B7FD1;

  /* Spacing (8px grid) */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px;

  /* Radius */
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px; --radius-xl:20px; --radius-pill:999px;

  /* Shadows */
  --shadow-xs:0 1px 2px rgba(22,25,44,.04);
  --shadow-sm:0 2px 8px rgba(22,25,44,.06);
  --shadow-md:0 6px 20px rgba(22,25,44,.08);
  --shadow-lg:0 16px 40px rgba(22,25,44,.12);
  --shadow-focus:0 0 0 3px rgba(139,90,140,.35);

  /* Type */
  --font:'Montserrat',system-ui,sans-serif;
  --transition:400ms ease-in-out;
}

@media (prefers-reduced-motion:reduce){*{transition:none!important;}}