/* Quiet category colors: direction remains visible as text, color is supplementary. */
.card {
  border-left: 4px solid var(--direction-accent, var(--border));
  background: var(--direction-bg, var(--surface));
}

.direction-image {
  --direction-bg: #f9eef4;
  --direction-accent: #b77798;
}

.direction-video {
  --direction-bg: #faefe8;
  --direction-accent: #b77b5d;
}

.direction-3d-reconstruction {
  --direction-bg: #f1eef9;
  --direction-accent: #8271b3;
}

.direction-vision-vlm {
  --direction-bg: #eaf2fa;
  --direction-accent: #5f88b2;
}

.direction-audio-speech-music {
  --direction-bg: #f8eeee;
  --direction-accent: #b56f76;
}

.direction-llm-agents {
  --direction-bg: #eef0fa;
  --direction-accent: #6979b5;
}

.direction-training-finetuning {
  --direction-bg: #f8f3e5;
  --direction-accent: #ad8b43;
}

.direction-production-vfx {
  --direction-bg: #edf5ed;
  --direction-accent: #6f9a70;
}

.direction-infrastructure-deployment {
  --direction-bg: #edf2f4;
  --direction-accent: #668994;
}

.direction-interfaces-workflows {
  --direction-bg: #e9f5f3;
  --direction-accent: #57978d;
}

.direction-datasets-evaluation {
  --direction-bg: #f1f5e8;
  --direction-accent: #82985b;
}

.direction-learning-reference {
  --direction-bg: #f7f1e8;
  --direction-accent: #a4875a;
}

.direction-other,
.direction-unassigned {
  --direction-bg: #f1f1ee;
  --direction-accent: #88887d;
}

@media (prefers-color-scheme: dark) {
  .direction-image {
    --direction-bg: #261f23;
    --direction-accent: #a9748e;
  }

  .direction-video {
    --direction-bg: #28211d;
    --direction-accent: #aa765d;
  }

  .direction-3d-reconstruction {
    --direction-bg: #22202a;
    --direction-accent: #8274a9;
  }

  .direction-vision-vlm {
    --direction-bg: #1c242b;
    --direction-accent: #6385a5;
  }

  .direction-audio-speech-music {
    --direction-bg: #281f20;
    --direction-accent: #a96f75;
  }

  .direction-llm-agents {
    --direction-bg: #20222c;
    --direction-accent: #707db0;
  }

  .direction-training-finetuning {
    --direction-bg: #28251c;
    --direction-accent: #a08850;
  }

  .direction-production-vfx {
    --direction-bg: #1e261f;
    --direction-accent: #709270;
  }

  .direction-infrastructure-deployment {
    --direction-bg: #1e2528;
    --direction-accent: #698790;
  }

  .direction-interfaces-workflows {
    --direction-bg: #1b2725;
    --direction-accent: #609087;
  }

  .direction-datasets-evaluation {
    --direction-bg: #23271d;
    --direction-accent: #82935f;
  }

  .direction-learning-reference {
    --direction-bg: #28231d;
    --direction-accent: #9c845f;
  }

  .direction-other,
  .direction-unassigned {
    --direction-bg: #222320;
    --direction-accent: #808078;
  }
}