/* ============================================================
   Formosa Film Fund — Color Tokens
   White & gold on black. Gold is metallic/champagne, never neon.
   Black is warm-near-pure, like a darkened cinema.
   ============================================================ */

:root {
  /* ---- Ink / black scale (warm near-black, cinema dark) ---- */
  --black-pure: #000000;   /* true black — full-bleed canvas        */
  --ink-900:    #0A0A0B;   /* primary background                    */
  --ink-850:    #111114;   /* raised background / page sections     */
  --ink-800:    #16161A;   /* card surface                          */
  --ink-700:    #1F1F24;   /* elevated card / hover surface         */
  --ink-600:    #2A2A30;   /* hairline-strong / input border        */
  --ink-500:    #3A3A42;   /* disabled fill                         */
  --ink-400:    #565660;   /* muted divider on light                */

  /* ---- Gold scale (champagne → metallic → bronze) ---- */
  --gold-50:   #FBF4D6;   /* faint champagne tint / foil highlight */
  --gold-100:  #F4E884;   /* brightest highlight                   */
  --gold-200:  #E8D27A;   /* light gold                            */
  --gold-300:  #DDBA56;   /* warm gold                             */
  --gold-400:  #D4AF37;   /* PRIMARY gold — classic metallic       */
  --gold-500:  #C39A2C;   /* gold pressed / deeper                 */
  --gold-600:  #A67C2E;   /* antique gold (logo mid)               */
  --gold-700:  #8A6A24;   /* bronze                                */
  --gold-800:  #6E5618;   /* dark bronze / gold border on dark     */

  /* ---- Neutral / paper (for rare light surfaces) ---- */
  --paper:     #F6F3EA;   /* warm off-white                        */
  --white:     #FFFFFF;
  --white-90:  rgba(255,255,255,0.90);
  --white-70:  rgba(255,255,255,0.70);
  --white-55:  rgba(255,255,255,0.55);
  --white-38:  rgba(255,255,255,0.38);
  --white-14:  rgba(255,255,255,0.14);
  --white-08:  rgba(255,255,255,0.08);

  /* ---- Gold alphas (keylines, glows, tints) ---- */
  --gold-a32:  rgba(212,175,55,0.32);
  --gold-a20:  rgba(212,175,55,0.20);
  --gold-a12:  rgba(212,175,55,0.12);
  --gold-a06:  rgba(212,175,55,0.06);

  /* ---- Semantic / status ---- */
  --positive:  #4FB477;   /* gains / XIRR up   */
  --caution:   #D9A23B;   /* slated / pending  */
  --negative:  #C95B4B;   /* risk / loss       */
  --info:      #6FA8C7;

  /* ---- The metallic gold "foil" gradient ----
     Use on keylines, rules, and (sparingly) display text via
     background-clip:text. Mimics the deck's brushed-gold texture. */
  --foil-gold: linear-gradient(
    104deg,
    #A67C2E 0%,
    #F4E884 22%,
    #C9A14A 44%,
    #FBF4D6 56%,
    #B8860B 78%,
    #E3CD68 100%
  ); /* @kind color */
  --foil-gold-soft: linear-gradient(
    180deg, #E8D27A 0%, #D4AF37 50%, #A67C2E 100%
  ); /* @kind color */

  /* ============================================================
     SEMANTIC ALIASES — reference these in components
     ============================================================ */

  /* Surfaces */
  --bg-canvas:      var(--ink-900);
  --bg-full-bleed:  var(--black-pure);
  --surface-card:   var(--ink-800);
  --surface-raised: var(--ink-700);
  --surface-sunken: var(--ink-850);

  /* Text */
  --text-primary:   var(--white);
  --text-body:      var(--white-70);
  --text-muted:     var(--white-55);
  --text-faint:     var(--white-38);
  --text-gold:      var(--gold-400);
  --text-on-gold:   var(--ink-900);

  /* Lines & borders */
  --border-hairline: var(--white-08);
  --border-soft:     var(--white-14);
  --border-gold:     var(--gold-a32);
  --border-gold-strong: var(--gold-600);

  /* Interactive */
  --accent:         var(--gold-400);
  --accent-hover:   var(--gold-300);
  --accent-press:   var(--gold-500);
  --focus-ring:     var(--gold-a32);
}