:root {
  /* Colors — Keychron Retro */
  --bg: #1a1714;
  --key-body: #3d3a36;
  --key-top: #4a4540;
  --key-legend: #d4cfc8;
  --accent-orange: #e8712a;
  --accent-teal: #2aa198;

  /* Key sizing — fluid
     Title row (17 keys) is the constraint.
     17 × key-sm + 16 × gap must fit viewport. */
  --key-size: clamp(20px, 5.5vw, 64px);
  --key-size-sm: clamp(16px, 5vw, 52px);
  --key-gap: clamp(2px, 0.5vw, 8px);
  --key-radius: clamp(3px, 0.5vw, 8px);
  --key-depth: 10px;
  --key-press-depth: 7px;
  --key-travel: 3px;
  --key-inset: clamp(2px, 0.4vw, 4px);
  --key-wall: #2a2825;
  --key-wall-front: #332f2b;

  /* Font */
  --font-family: 'JetBrains Mono', monospace;
  --legend-size: clamp(8px, 2vw, 22px);
  --legend-size-sm: clamp(6px, 1.6vw, 18px);

  /* Timing */
  --press-duration: 80ms;
  --release-duration: 200ms;
  --release-easing: cubic-bezier(0.34, 1.56, 0.64, 1);
  --entry-delay-step: 40ms;

  /* Shadows */
  --shadow-color: rgba(0, 0, 0, 0.5);
  --shadow-drop: rgba(0, 0, 0, 0.35);
  --glow-opacity: 0;
}