/* UNSEEN — Effects: radii, borders, shadows, motion.
   Aesthetic: sharp and editorial. Small radii, hairline borders, no soft
   drop-shadows on dark — depth comes from borders + an orange glow on accent. */

:root {
  /* ---- Radii ---- */
  --radius-none:  0;
  --radius-xs:    2px;
  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-lg:    14px;
  --radius-pill:  999px;
  --radius-circle:50%;

  /* ---- Borders ---- */
  --border-hairline: 1px solid var(--border);
  --border-card:     1px solid var(--line);
  --border-accent-w: 1px solid var(--orange-500);
  --border-width:    1px;

  /* ---- Shadows (dark-UI: mostly elevation via outline + glow) ---- */
  --shadow-none:    none;
  --shadow-sm:      0 1px 2px rgba(0,0,0,0.6);
  --shadow-md:      0 8px 24px rgba(0,0,0,0.55);
  --shadow-lg:      0 24px 60px rgba(0,0,0,0.65);
  --shadow-glow:    0 0 0 1px var(--orange-500), 0 8px 30px var(--orange-glow);
  --shadow-glow-sm: 0 6px 22px var(--orange-glow);

  /* ---- Focus ---- */
  --ring:        0 0 0 2px var(--bg-base), 0 0 0 4px var(--focus-ring);

  /* ---- Motion ---- */
  --ease-out:     cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast:     120ms; /* @kind other */
  --dur-base:     200ms; /* @kind other */
  --dur-slow:     420ms; /* @kind other */

  /* ---- Effects ---- */
  --grain-opacity: 0.028; /* @kind other */  /* softened for editorial calm */
  --blur-panel:    saturate(120%) blur(14px); /* @kind other */
}