/* BlackRoad OS Brand Tokens - synced with brand.blackroad.io */
:root {
  /* Neon Spectrum */
  --br-sunrise: #FF9D00;
  --br-warm-orange: #FF6B00;
  --br-hot-pink: #FF0066;
  --br-electric-magenta: #FF006B;
  --br-deep-magenta: #D600AA;
  --br-vivid-purple: #7700FF;
  --br-cyber-blue: #0066FF;

  /* Neutrals (darker - almost black) */
  --br-black: #000000;
  --br-deep-black: #050505;
  --br-charcoal: #0D0D0D;
  --br-slate: #141414;
  --br-white: #FFFFFF;

  /* Gradients */
  --br-gradient-brand: linear-gradient(180deg, #FF9D00 0%, #FF6B00 50%, #FF0066 100%);
  --br-gradient-os: linear-gradient(180deg, #FF0066 0%, #D600AA 33%, #7700FF 66%, #0066FF 100%);

  /* Semantic Colors */
  --br-action: var(--br-sunrise);
  --br-creativity: var(--br-hot-pink);
  --br-intelligence: var(--br-vivid-purple);
  --br-trust: var(--br-cyber-blue);
  --br-focus: var(--br-electric-magenta);
  --br-depth: var(--br-deep-magenta);

  /* Surfaces */
  --br-surface-base: var(--br-black);
  --br-surface-elevated: var(--br-deep-black);
  --br-surface-card: var(--br-charcoal);
  --br-text-primary: var(--br-white);
  --br-text-secondary: rgba(255, 255, 255, 0.7);
  --br-text-muted: rgba(255, 255, 255, 0.5);

  /* Glow Shadows */
  --br-glow-orange: 0 0 30px rgba(255, 157, 0, 0.4);
  --br-glow-pink: 0 0 30px rgba(255, 0, 102, 0.4);
  --br-glow-purple: 0 0 30px rgba(119, 0, 255, 0.4);
  --br-glow-blue: 0 0 30px rgba(0, 102, 255, 0.4);

  /* Legacy mappings for existing code */
  --br-brand-ink: var(--br-black);
  --br-brand-surface: var(--br-surface-base);
  --br-brand-accent: var(--br-vivid-purple);
  --br-brand-glow: var(--br-cyber-blue);
  --br-brand-foreground: var(--br-text-primary);
  --br-brand-muted: var(--br-text-secondary);
}