/* ESS design tokens — canonical source: _memory/feedback_ess_design_system_integration.md
   Pure-black canvas, single teal accent, gold used sparingly. Do not add colors. */

:root {
  /* Canvas + surfaces */
  --ess-black: #000;
  --ess-ink-900: #0a0a0a;
  --ess-ink-800: #141414;
  --ess-ink-700: #1f1f1f;
  --ess-ink-300: #8a8a8a;
  --ess-ink-200: #bdbdbd;

  /* Accent (single-accent brand) */
  --ess-teal-500: #5aaeb0;
  --ess-teal-400: #7cc4c4;
  --ess-teal-300: #a6d8d7;
  --ess-gold-500: #d4a64a;

  /* Type */
  --font-display: 'Montserrat', sans-serif;   /* 900, UPPERCASE, -0.02em */
  --font-body: 'Lato', sans-serif;
  --font-ui: 'Poppins', sans-serif;

  /* Spacing */
  --space-9: 96px;   /* between major sections */
  --space-6: 48px;   /* within sections */
  --gutter: 24px;
  --content-max: 1200px;

  /* Shadows + glow */
  --shadow-sharp: 0 4px 0 0 rgba(0, 0, 0, 0.9);
  --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.5);
  --glow-teal: 0 0 24px rgba(90, 174, 176, 0.55);

  /* Gradients */
  --grad-stage: linear-gradient(180deg, #000 0%, #0a1314 60%, #0a2b2d 100%);
  --grad-spot: radial-gradient(ellipse at 50% 0%, rgba(90, 174, 176, 0.18) 0%, rgba(0, 0, 0, 0) 60%);

  /* Motion */
  --ease-punch: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 140ms;
  --dur-mid: 260ms;
  --dur-slow: 480ms;
}
