:root {
  /* Core background */
  --bg-main: #05090b;
  --bg-panel: #071014;
  --bg-panel-strong: #0b151a;
  --bg-panel-soft: rgba(9, 18, 22, 0.88);

  /* Borders and metal lines */
  --border-dark: #1c2a2f;
  --border-muted: #2d3a3f;
  --border-bright: #7a5830;
  --border-gold: #b87918;

  /* Primary UI colours */
  --gold: #f0a51a;
  --gold-soft: #c98216;
  --gold-dim: #7b5217;

  /* Text */
  --text-main: #d7d1c6;
  --text-muted: #9c9a94;
  --text-dim: #666a6b;
  --text-heading: #f0c16a;

  /* Status */
  --success: #7bb342;
  --danger: #e44125;
  --warning: #f0a51a;
  --info: #2ab6d6;
  --blue: #4f9cff;
  --purple: #a45be8;
  --purple-rgb: 164, 91, 232;
  --red: #f04b2f;
  --green: #8bc34a;
  --cyan: #26c6da;

  /* Active control state */
  --active-purple-text: #fbf7ff;
  --active-purple-inner: rgba(48, 18, 84, 0.94);
  --active-purple-fill: linear-gradient(180deg, rgba(101, 48, 156, 0.72), rgba(45, 18, 82, 0.96));
  --active-purple-fill-hover: linear-gradient(180deg, rgba(126, 62, 184, 0.8), rgba(56, 24, 98, 0.98));
  --active-purple-fill-pressed: linear-gradient(180deg, rgba(80, 34, 132, 0.82), rgba(35, 13, 68, 0.98));
  --active-purple-border: linear-gradient(180deg, rgba(235, 210, 255, 0.96), rgba(var(--purple-rgb), 0.98));
  --active-purple-border-soft: linear-gradient(180deg, rgba(218, 181, 250, 0.78), rgba(118, 62, 180, 0.94));
  --active-purple-glow: rgba(126, 62, 184, 0.34);

  /* Transparent overlays */
  --glass: rgba(255, 255, 255, 0.03);
  --shadow-deep: rgba(0, 0, 0, 0.75);
}