:root {
  --ocs-bg: #141E25;
  --ocs-bg-elevated: #101A20;
  --ocs-bg-deep: #0B1216;
  --ocs-text: #EAE2D6;
  --ocs-text-muted: #8CA3AD;
  --ocs-copper: #C67B4A;
  --ocs-copper-light: #D8A164;
  --ocs-copper-dark: #9F5437;
  --ocs-slate: #25424B;
  --ocs-border: #26343A;
  /* stati: solo per icone, bordi e indicatori, non come colore del testo */
  --ocs-success: #2E6F73;
  --ocs-error: #C25B47;
  --ocs-radius-sm: 8px;
  --ocs-radius-md: 14px;
  --ocs-radius-lg: 22px;
  --ocs-content-max: 1200px;
  --ocs-ease: cubic-bezier(.2,.8,.2,1);
  --ocs-gradient-copper: linear-gradient(135deg,#D8A164 0%,#C67B4A 48%,#9F5437 100%);
  --ocs-gradient-dark: linear-gradient(145deg,#141E25 0%,#101A20 65%,#0B1216 100%);
}

body {
  background: var(--ocs-bg);
  color: var(--ocs-text);
  font-family: Inter, system-ui, sans-serif;
}

h1, h2, h3 {
  font-family: 'Space Grotesk', Inter, system-ui, sans-serif;
}

:focus-visible {
  outline: 2px solid var(--ocs-copper-light);
  outline-offset: 3px;
}