/* ============================================================
   Trade Challenge — Color tokens
   A dark, high-energy "space arena" palette. Deep navy-black
   canvas lit by electric blue, with cyan / violet / gold / green
   accents for ranks, prizes, and live signals.
   ============================================================ */

:root {
  /* ---- Canvas / surfaces ------------------------------------ */
  --tc-bg:            #04060f;  /* page background, deep space   */
  --tc-bg-2:          #070b1c;  /* raised background band        */
  --tc-panel-solid:   #0b1224;  /* opaque panel (selects, menus) */
  --tc-panel:         rgba(13, 20, 42, 0.82);  /* glass panel    */

  /* ---- Primary brand blue ----------------------------------- */
  --tc-blue:          #2563ff;  /* core brand blue               */
  --tc-blue-deep:     #1437c4;  /* gradient end / pressed        */
  --tc-cyan:          #3aa0ff;  /* links, accents, focus         */
  --tc-cyan-bright:   #5fc8ff;  /* hover / highlight cyan        */

  /* ---- Secondary accents ------------------------------------ */
  --tc-violet:        #7b46ff;  /* community / rare tier         */
  --tc-violet-bright: #a274ff;  /* violet accent on dark         */
  --tc-gold:          #f5b740;  /* prizes, coins, featured       */
  --tc-gold-bright:   #ffd86b;  /* gold highlight / numerals     */
  --tc-green:         #27d98a;  /* gains, ROI, live, success     */
  --tc-red:           #ff5b6e;  /* losses, hot, alerts           */

  /* ---- Text ------------------------------------------------- */
  --tc-text:          #eaf2ff;  /* primary text, near-white blue */
  --tc-muted:         #8ea3cc;  /* secondary / supporting text   */
  --tc-dim:           #5d6f99;  /* tertiary / captions / labels  */

  /* ---- Borders / hairlines ---------------------------------- */
  --tc-border:        rgba(80, 140, 255, 0.18);  /* default edge */
  --tc-border-bright: rgba(90, 170, 255, 0.45);  /* hover/focus  */
  --tc-hairline:      rgba(90, 130, 210, 0.14);  /* inner divide */

  /* ---- Signature gradients ---------------------------------- */
  --tc-grad-primary:  linear-gradient(135deg, #2f7bff, #1f57e6);          /* @kind color */
  --tc-grad-logo:     linear-gradient(135deg, #1b5cff, #0b2a9e);          /* @kind color */
  --tc-grad-gold:     linear-gradient(180deg, #ffe9a8, #f0a82e);          /* @kind color */
  --tc-grad-title:    linear-gradient(180deg, #eaf3ff 35%, #5fa6ff 120%); /* @kind color */
  --tc-grad-violet:   linear-gradient(135deg, #7b3bff, #5a23d8);          /* @kind color */
  --tc-grad-panel:    linear-gradient(160deg, rgba(15, 23, 50, 0.80), rgba(9, 14, 34, 0.70)); /* @kind color */

  /* ---- Accent tints (translucent fills for chips/icons) ----- */
  --tc-blue-soft:     rgba(58, 160, 255, 0.14);
  --tc-green-soft:    rgba(39, 217, 138, 0.13);
  --tc-violet-soft:   rgba(160, 107, 255, 0.16);
  --tc-gold-soft:     rgba(255, 206, 107, 0.14);

  /* ---- Semantic aliases ------------------------------------- */
  --tc-surface:        var(--tc-panel);
  --tc-surface-solid:  var(--tc-panel-solid);
  --tc-accent:         var(--tc-cyan);
  --tc-link:           var(--tc-cyan);
  --tc-link-hover:     var(--tc-cyan-bright);
  --tc-positive:       var(--tc-green);
  --tc-negative:       var(--tc-red);
  --tc-text-on-accent: #ffffff;
}