/* ============================================
   DESIGN TOKENS — skele.t0l dark olive
   ============================================ */

:root {
  /* --- Base palette --- */
  --bg:           #0d110a;
  --bg-mid:       #161e10;
  --bg-light:     #1f2a16;
  --bg-subtle:    rgba(255, 255, 255, 0.02);

  --text:         #e8ede3;
  --text-mid:     #b8c4ac;
  --text-muted:   #94a688;
  --text-faint:   rgba(148, 166, 136, 0.4);
  --text-dark:    #1a2212;

  /* --- Element colors (pastel) --- */
  --air:          #c4b5f5;
  --fire:         #f0a0c8;
  --earth:        #7edcaa;
  --water:        #88bbf0;
  --terminal:     #4AF626;

  /* --- Element glows --- */
  --glow-air:     rgba(196, 181, 245, 0.35);
  --glow-fire:    rgba(240, 160, 200, 0.35);
  --glow-earth:   rgba(126, 220, 170, 0.35);
  --glow-water:   rgba(136, 187, 240, 0.35);

  /* --- Glass --- */
  --glass:        rgba(30, 40, 20, 0.35);
  --glass-border: rgba(126, 220, 170, 0.08);
  --glass-hover:  rgba(35, 48, 25, 0.45);
  --glass-inset:  inset 0 1px 0 rgba(255, 255, 255, 0.04);

  /* --- Typography --- */
  --font-display: 'Quicksand', sans-serif;
  --font-body:    'Nunito', 'Quicksand', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  /* --- Sizing scale --- */
  --space-3xs:  clamp(0.25rem, 0.2rem + 0.25vw, 0.375rem);
  --space-2xs:  clamp(0.5rem, 0.45rem + 0.25vw, 0.625rem);
  --space-xs:   clamp(0.75rem, 0.65rem + 0.5vw, 1rem);
  --space-s:    clamp(1rem, 0.85rem + 0.75vw, 1.5rem);
  --space-m:    clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem);
  --space-l:    clamp(2rem, 1.6rem + 2vw, 3.5rem);
  --space-xl:   clamp(3rem, 2.4rem + 3vw, 5rem);
  --space-2xl:  clamp(4rem, 3.2rem + 4vw, 7rem);

  /* --- Type scale --- */
  --step--2:    clamp(0.69rem, 0.63rem + 0.3vw, 0.83rem);
  --step--1:    clamp(0.83rem, 0.75rem + 0.4vw, 1rem);
  --step-0:     clamp(1rem, 0.9rem + 0.5vw, 1.2rem);
  --step-1:     clamp(1.2rem, 1.05rem + 0.75vw, 1.5rem);
  --step-2:     clamp(1.44rem, 1.2rem + 1.2vw, 1.875rem);
  --step-3:     clamp(1.728rem, 1.4rem + 1.64vw, 2.34rem);
  --step-4:     clamp(2.074rem, 1.6rem + 2.37vw, 2.93rem);
  --step-5:     clamp(2.488rem, 1.8rem + 3.44vw, 3.66rem);

  /* --- Layout --- */
  --measure:    65ch;
  --gutter:     var(--space-m);
  --border-radius-s: 8px;
  --border-radius-m: 14px;
  --border-radius-l: 20px;
  --border-radius-pill: 50px;

  /* --- Transitions --- */
  --transition-fast:   150ms ease;
  --transition-base:   300ms ease;
  --transition-slow:   500ms ease;
}
