/* Design tokens measured from reference screenshots (dark theme).
   Only the lead agent edits this file. Screen builders put new values in their own
   screen CSS and report them as token suggestions. */
:root {
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Newsreader', Georgia, 'Times New Roman', serif;
  --ls-display: -0.02em;

  /* Surfaces */
  --bg: #171717;            /* app / auth form background */
  --bg-deep: #0f0f0f;       /* web auth left panel, deepest layer */
  --surface-1: #1c1c1c;
  --surface-2: #232323;
  --surface-3: #2a2a2a;
  --border: #292929;        /* input border (idle) */
  --border-2: #3b3b3b;
  --divider: #262626;
  --line: rgba(255, 255, 255, .10);    /* outlined phone cards */
  --line-2: rgba(255, 255, 255, .11);  /* search pill, round icon buttons, tab divider */
  --sep: rgba(255, 255, 255, .08);     /* section separators */
  --tag-bg: #292929;
  --chip: #282828;                     /* scalper chips and chart panels */
  --pill-in-panel: #383838;
  --scrim: rgba(0, 0, 0, .55);
  --sheet-bg: #1f1f1f;                 /* real phone: one step above the #171717 page */
  --card-fill: #1f1f1f;
  --card-border: #3a3a3a;
  --rule: #333333;
  --tile: #272727;
  --tile-border: #414141;

  /* Text */
  --text: #ffffff;
  --text-2: #a3a3a3;        /* secondary copy, legal text */
  --text-3: #7c7c7c;
  --text-4: #626262;
  --placeholder: #727272;
  --text-label: #9a9a9a;    /* small grey labels (dates, captions) */

  /* Brand */
  --brand: #a50f66;         /* focus ring on inputs */
  --brand-tint: #281620;    /* 3px focus ring outside the input border: box-shadow 0 0 0 3px var(--brand-tint) */
  --promo-bg: #0f0108;      /* web auth left panel */
  --brand-bright: #e0218a;  /* bright magenta accents (Kyro, links) — verify */
  --cta: #c2187a;           /* marketing CTA pill — verify */

  /* Buttons */
  --btn-disabled-bg: #626262;
  --btn-disabled-fg: #141414;
  --btn-primary-bg: #ffffff;
  --btn-primary-fg: #0f0f0f;
  --btn-outline: #ffffff;

  /* Market colours (measured from the app references) */
  --up: #5adca0;            /* positive change text */
  --down: #e8807a;          /* negative change text */
  --candle-up: #0b9a80;
  --candle-down: #f13645;
  --tag-down: #c4342e;      /* red last-price tag on charts */
  --pink: #dd6eb6;          /* "Expiry Today" and similar accents */
  --panel: #282828;         /* chart panel fill (scalper) */
  --axis-line: #404040;
  --axis-label: #a2a2a2;
  --step-done: #6fdc8c;     /* status timelines */
  --step-current: #d4952f;
  --step-pending: #6b6b6b;
  --progress-track: #3f3f3f;   /* measured on the real phone (sRGB) */
  --progress-fill: #0e854d;
  --progress-knob: #0e854d;
  --up-bg: #12301f;
  --down-bg: #3a1518;
  --warn: #e3a33b;

  /* Web terminal (desktop) — measured by the web-scalper builder */
  --web-bg: #09090b;
  --web-top: #171216;
  --web-panel: #181517;
  --web-panel-3: #292629;
  --web-edge: #232023;
  --web-line: #211e20;
  --web-up-text: #3fa2ad;
  --web-down-text: #d6607b;
  --web-buy: #2096a5;
  --web-sell: #c73e5a;
  --web-bolt: #f6b928;

  /* Shape */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-card: 10px;          /* phone cards */
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 24px;
  --r-pill: 999px;

  /* Layout */
  --app-max: 480px;          /* phone layout max width on big screens */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
