/* Design tokens. One place; nothing else in the CSS hard-codes a colour. */
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/ibm-plex-sans-latin-400-normal.77bc02670657.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/ibm-plex-sans-latin-500-normal.f7016cd446d2.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/ibm-plex-sans-latin-600-normal.196e3cbc5fee.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/ibm-plex-mono-latin-400-normal.79936b18df9f.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal; font-weight: 500; font-display: swap;
  src: url("../fonts/ibm-plex-mono-latin-500-normal.b1c8a895f5fd.woff2") format("woff2");
}

:root {
  --ink:        #16202B;   /* primary text, headers */
  --ink-soft:   #5C6B7A;   /* labels, help text, fee rows */
  --rule:       #D8DEDA;   /* hairlines, input borders */
  --panel:      #EDF1EE;   /* result tape background, page sections */
  --surface:    #FFFFFF;
  --paper:      #FAFBFA;
  --keep:       #0B6E4F;   /* the headline number. Only this is loud. */
  --alert:      #9C3B2E;   /* validation errors and negative profit ONLY */

  --accent: var(--keep);   /* overridden per category below */

  --step--1: 0.875rem;  --step-0: 1rem;    --step-1: 1.25rem;
  --step-2:  1.625rem;  --step-3: 2.125rem; --step-4: 3rem;

  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem;
  --space-4: 1rem;   --space-6: 1.5rem; --space-8: 2rem; --space-12: 3rem;

  --radius: 6px;           /* one radius on inputs and cards; 0 on the tape */
  --tape-lift: 0 -1px 0 var(--rule);

  --font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  color-scheme: light dark;
}

body[data-category="reselling"] { --accent: #0B6E4F; }
body[data-category="mortgage"]  { --accent: #2A4A6B; }
body[data-category="everyday"]  { --accent: #8A5A2B; }
body[data-category="health"]    { --accent: #2A6B66; }

@media (prefers-color-scheme: dark) {
  :root {
    --ink:      #E6EBEE;
    --ink-soft: #A3AFBA;
    --rule:     #2E3A45;
    --panel:    #1B252F;
    --surface:  #121A22;
    --paper:    #121A22;
    --keep:     #3FA37D;
    --alert:    #E08272;
  }
  body[data-category="reselling"] { --accent: #3FA37D; }
  body[data-category="mortgage"]  { --accent: #7FA6D0; }
  body[data-category="everyday"]  { --accent: #D19A5E; }
  body[data-category="health"]    { --accent: #5FB8B1; }
}