:root {
  --ink: #06080f;
  --panel-wash: rgba(139, 92, 246, .09);
  --violet: #8b5cf6;
  --blue: #4a7dff;
  --gradient: linear-gradient(100deg, #8b5cf6, #4a7dff);
  --lilac: #a78bfa;
  --signal: #4ade80;

  --text-heading: #e8eaf2;
  --text-body: #9aa5bd;
  --text-label: #7c8aa5;
  --text-timestamp: #4b5670;
  --text-log: #8fa0bd;

  --rule: rgba(255, 255, 255, .08);
  --field-border: rgba(255, 255, 255, .14);
  --field-fill: rgba(255, 255, 255, .04);

  --font-display: 'Oswald', 'Arial Narrow', sans-serif;
  --font-body: 'Barlow', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  --size-display: clamp(46px, 7.05vw, 82px);
  --size-body: 17px;
  --size-kicker: 12px;
  --size-micro: 10px;
  --size-log: 12.5px;

  --page-padding: 48px;
  --column-gutter: 48px;
  --control-height: 52px;
}

@media (max-width: 1100px) {
  :root {
    --page-padding: 40px;
    --column-gutter: 32px;
  }
}

@media (max-width: 560px) {
  :root {
    --page-padding: 32px;
  }
}