/* ARENA by Rank — Effects and visual properties */
:root {
  /* Border radius — slightly rounded, never overly soft */
  --radius-none: 0;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  
  /* Shadows — minimal use, high contrast */
  --shadow-none: none;
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.2);
  --shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.3);
  
  /* Transitions — smooth but snappy */
  --transition-fast: 100ms ease-in-out; /* @kind other */
  --transition-base: 200ms ease-in-out; /* @kind other */
  --transition-slow: 300ms ease-in-out; /* @kind other */
  
  /* Opacity — for hover/disabled states */
  --opacity-disabled: 0.5; /* @kind other */
  --opacity-hover: 0.8; /* @kind other */
  --opacity-active: 0.9; /* @kind other */
}