/* Effect tokens — glow, shadow, and surface transparency.
   Glow color is always derived from the element's accent color (no independent glow color tokens).
   Intensity scales with interaction state: default < focus < hover < active. */

:root,
[data-theme="cyberpunk"] {
  /* === Glow blur scale (restrained, premium feel: 2-4px default range) === */
  --hh-glow-blur-xs: 2px;
  --hh-glow-blur-sm: 3px;
  --hh-glow-blur-md: 6px;
  --hh-glow-blur-lg: 10px;
  --hh-glow-blur-xl: 16px;

  /* === Glow spread scale === */
  --hh-glow-spread-none: 0px;
  --hh-glow-spread-sm: 1px;
  --hh-glow-spread-md: 2px;

  /* === Interaction-state glow intensities (opacity multipliers) === */
  /* Order: default (dimmest) < focus < hover < active (brightest) */
  --hh-glow-intensity-default: 0.3;
  --hh-glow-intensity-focus: 0.45;
  --hh-glow-intensity-hover: 0.65;
  --hh-glow-intensity-active: 0.9;

  /* === Surface transparency tiers === */
  --hh-surface-opaque: 1;
  --hh-surface-translucent: 0.75;
  --hh-surface-glass: 0.35;
  --hh-surface-ghost: 0.15;

  /* === Transition durations === */
  --hh-transition-fast: 100ms;
  --hh-transition-normal: 150ms;
  --hh-transition-slow: 300ms;

  /* === Border radii (angular cyberpunk — no rounding) === */
  --hh-radius-sm: 0;
  --hh-radius-md: 0;
  --hh-radius-lg: 0;

  /* === Corner notch sizes (45-degree clip-path cuts) === */
  --hh-notch-sm: 4px;
  --hh-notch-md: 8px;
  --hh-notch-lg: 12px;

  /* === Spacing scale === */
  --hh-space-1: 0.25rem;
  --hh-space-2: 0.5rem;
  --hh-space-3: 0.75rem;
  --hh-space-4: 1rem;
  --hh-space-6: 1.5rem;
  --hh-space-8: 2rem;
  --hh-space-12: 3rem;
  --hh-space-16: 4rem;
}