/* Aram: amber, the colour its operator HUD already uses. Layout lives in
   /product.css. */

.aram {
  --accent: #ffb100;
  --accent-rgb: 255 177 0;
  --accent-2: #ff7a3d;
  --accent-3: #ef4444;
  --accent-ink: #120c00;
  --accent-hover: #ffc640;
  --dev: #ffb100;
}

.no-webgl body.aram {
  background:
    radial-gradient(45% 40% at 70% 30%, rgba(255, 177, 0, 0.16), transparent),
    radial-gradient(40% 40% at 25% 75%, rgba(46, 91, 255, 0.14), transparent),
    var(--ink);
}

/* 03 · Mission states */
.states { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.states span {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: rgba(11, 15, 23, 0.5);
  color: var(--muted);
}
.states .warn { color: var(--accent); border-color: rgb(var(--accent-rgb) / 0.4); }
.states .stop { color: var(--alert); border-color: rgba(239, 68, 68, 0.5); }