/* Handled Design System — Effects Tokens */

:root {
  /* ── Border Radius ── */
  --radius-sm:   6px;
  --radius-md:   8px;
  --radius-lg:   10px;
  --radius-xl:   14px;   /* icon containers, logo mark */
  --radius-pill: 20px;   /* tags, badges */
  --radius-full: 9999px;

  /* ── Shadows ── */
  --shadow-xs:   0 1px 2px rgba(28,26,23,0.06);
  --shadow-sm:   0 1px 3px rgba(28,26,23,0.08), 0 1px 2px rgba(28,26,23,0.04);
  --shadow-card: 0 2px 6px rgba(28,26,23,0.07), 0 1px 2px rgba(28,26,23,0.04);
  --shadow-md:   0 4px 12px rgba(28,26,23,0.10), 0 2px 6px rgba(28,26,23,0.06);
  --shadow-lg:   0 8px 24px rgba(28,26,23,0.12), 0 4px 12px rgba(28,26,23,0.07);
  --shadow-xl:   0 16px 40px rgba(28,26,23,0.14), 0 6px 16px rgba(28,26,23,0.08);

  /* ── Transitions ── */
  --transition-fast: 100ms ease; /* @kind other */
  --transition-base: 160ms ease; /* @kind other */
  --transition-slow: 260ms ease; /* @kind other */

  /* ── Borders ── */
  --border-width:       1px;
  --border-width-thick: 1.5px;
  --border-card:        1px solid var(--color-border);
  --border-accent:      1.5px solid var(--color-accent);

  /* ── Accent stripe — top of metric cards ── */
  --accent-stripe:      3px solid var(--color-accent);

  /* ── Blur ── */
  --blur-sm:  blur(8px);  /* @kind other */
  --blur-md:  blur(16px); /* @kind other */
}