/* ============================================================
   Fire Breathing Blowfish — Color System
   Pulled from the team kit: fiery orange jerseys, deep navy trim,
   dragon red (wings / paddle / flame), and the Hokusai great-wave
   ocean blues. Loud, warm, competitive.
   ============================================================ */

:root {
  /* ---- Brand core: FIRE ---------------------------------- */
  --fbbf-orange:        #F7871E;  /* primary jersey orange     */
  --fbbf-orange-bright: #FF9E2C;  /* flame highlight           */
  --fbbf-orange-deep:   #EC6408;  /* scorched / pressed        */
  --fbbf-flame-yellow:  #FDB913;  /* hottest flame core        */

  /* ---- Brand core: DRAGON -------------------------------- */
  --fbbf-red:           #E11B2E;  /* wings, paddle blade       */
  --fbbf-red-deep:      #B7121F;  /* shadowed red              */

  /* ---- Brand core: OCEAN + NIGHT ------------------------- */
  --fbbf-navy:          #14213D;  /* jersey trim, ink base     */
  --fbbf-navy-2:        #1E2F52;  /* raised navy surface       */
  --fbbf-indigo:        #1C2E63;  /* deep wave trough          */
  --fbbf-wave-blue:     #2E62A8;  /* mid wave                  */
  --fbbf-wave-light:    #A9C6E6;  /* wave foam shadow          */
  --fbbf-fish:          #6C93B4;  /* blowfish body slate       */

  /* ---- Neutrals ------------------------------------------ */
  --fbbf-white:         #FFFFFF;
  --fbbf-cream:         #FDF4E6;  /* warm off-white paper      */
  --fbbf-sand:          #F3E7D3;  /* muted warm surface        */
  --fbbf-ink:           #12182B;  /* near-black text on light  */
  --fbbf-gray:          #5B6270;  /* secondary text            */
  --fbbf-gray-light:    #C9CCD4;  /* borders on light          */
  --fbbf-foam:          #EAF1F8;  /* faint cool tint surface   */

  /* ============================================================
     SEMANTIC ALIASES — reference these in product code
     ============================================================ */

  /* Text */
  --text-strong:    var(--fbbf-ink);
  --text-body:      #2A3142;
  --text-muted:     var(--fbbf-gray);
  --text-on-dark:   var(--fbbf-white);
  --text-on-fire:   var(--fbbf-navy);   /* navy reads best on orange */
  --text-brand:     var(--fbbf-orange-deep);

  /* Surfaces */
  --surface-page:     var(--fbbf-cream);
  --surface-card:     var(--fbbf-white);
  --surface-sunk:     var(--fbbf-foam);
  --surface-dark:     var(--fbbf-navy);
  --surface-dark-2:   var(--fbbf-navy-2);
  --surface-fire:     var(--fbbf-orange);

  /* Actions */
  --action-primary:        var(--fbbf-orange);
  --action-primary-hover:  var(--fbbf-orange-deep);
  --action-danger:         var(--fbbf-red);
  --action-danger-hover:   var(--fbbf-red-deep);
  --action-on-primary:     var(--fbbf-navy);

  /* Lines & focus */
  --border-subtle:  var(--fbbf-gray-light);
  --border-strong:  var(--fbbf-navy);
  --focus-ring:     var(--fbbf-orange-bright);

  /* Status */
  --status-go:      #2FA36B;   /* race "go" green            */
  --status-warn:    var(--fbbf-flame-yellow);
  --status-stop:    var(--fbbf-red);
  --status-info:    var(--fbbf-wave-blue);
}