/* ============================================================
   DESIGN TOKENS — ek hi jagah jahan colour/spacing/type tay hote hain
   ------------------------------------------------------------
   Terminal ka poora look in variables se aata hai. Koi component apna
   hard-coded hex nahi rakhta — warna teen mahine baad theme badalna
   naamumkin ho jaata hai.

   BULL/BEAR ke rang JAAN-BOOJH KAR teal/red hain, green/red nahi:
     * teal-vs-red red-green colour blindness mein bhi alag dikhte hain,
     * aur yeh professional terminal ka rang hai, traffic-light ka nahi.
   Rang KABHI akela signal nahi hota — har jagah uske saath ek arrow/label
   aur ek filled bar bhi hoti hai (teen channel, ek hi baat).
   ============================================================ */

:root {
  /* ---- surfaces: dark navy -> charcoal ---- */
  --bg:            #080B12;
  --bg-elevated:   #0D1119;
  --surface:       #121724;
  --surface-2:     #171D2C;
  --surface-3:     #1C2333;
  --surface-hover: #1E2637;

  /* ---- borders: subtle, never loud ---- */
  --border:        #1E2534;
  --border-strong: #2B3346;
  --border-focus:  #3D5A80;

  /* ---- text ---- */
  --text:          #E4E9F2;
  --text-2:        #A8B2C4;
  --text-dim:      #737F94;
  --text-faint:    #4E5769;

  /* ---- direction: the product's core semantic ---- */
  --bull:          #2BB3A3;
  --bull-bright:   #35D6C2;
  --bull-dim:      #174F49;
  --bull-wash:     rgba(43, 179, 163, 0.10);

  --bear:          #F0554E;
  --bear-bright:   #FF6B64;
  --bear-dim:      #5C221F;
  --bear-wash:     rgba(240, 85, 78, 0.10);

  --flat:          #7A8599;
  --flat-wash:     rgba(122, 133, 153, 0.10);

  /* ---- state: TEST / STALE / UNAVAILABLE ---- */
  --warn:          #E0A93B;
  --warn-wash:     rgba(224, 169, 59, 0.11);
  --warn-border:   rgba(224, 169, 59, 0.34);

  --danger:        #E0574F;
  --danger-wash:   rgba(224, 87, 79, 0.11);
  --danger-border: rgba(224, 87, 79, 0.36);

  --live:          #2BB3A3;
  --live-wash:     rgba(43, 179, 163, 0.12);

  --accent:        #5B8FD6;

  /* ---- typography ---- */
  --font-ui: "Inter", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", "Cascadia Mono", "Consolas",
               "Roboto Mono", ui-monospace, monospace;

  --fs-micro: 10px;
  --fs-xs:    11px;
  --fs-sm:    12px;
  --fs-base:  13px;
  --fs-md:    15px;
  --fs-lg:    18px;
  --fs-xl:    24px;
  --fs-2xl:   32px;

  --lh-tight: 1.2;
  --lh-base:  1.45;

  --track-caps: 0.08em;   /* uppercase labels ko saans lene ki jagah */

  /* ---- spacing (4px grid) ---- */
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 20px;
  --s6: 24px;
  --s8: 32px;

  /* ---- shape ---- */
  --r-sm: 3px;
  --r:    5px;
  --r-lg: 8px;

  /* ---- chrome ---- */
  --topbar-h: 46px;
  --rail-w:   68px;

  --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 4px 16px rgba(0, 0, 0, 0.22);
}