/* EurekaLogic — Radii, Borders, Elevation, Motion */

:root {
  /* Corner radii — restrained, slightly technical */
  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-pill: 999px;
  --radius-hex:  0; /* hexagonal clip handled via clip-path util */

  /* Border widths */
  --border-hair: 1px;
  --border-thin: 1.5px;
  --border-thick: 2px;

  /* Elevation — cool, deep shadows on dark; luminous accent glows.
     Dark UIs read depth by glow + hairline more than by drop shadow. */
  --shadow-xs: 0 1px 2px rgba(3, 8, 12, 0.5);
  --shadow-sm: 0 2px 8px rgba(3, 8, 12, 0.45);
  --shadow-md: 0 8px 24px rgba(3, 8, 12, 0.5);
  --shadow-lg: 0 20px 48px rgba(3, 8, 12, 0.55);
  --shadow-xl: 0 32px 80px rgba(3, 8, 12, 0.6);

  /* Signal glows — the luminous teal signature */
  --glow-signal: 0 0 0 1px color-mix(in oklab, var(--teal-500) 40%, transparent), 0 0 24px color-mix(in oklab, var(--teal-500) 30%, transparent);
  --glow-signal-soft: 0 0 32px color-mix(in oklab, var(--teal-500) 22%, transparent);
  --glow-gold: 0 0 28px color-mix(in oklab, var(--gold-400) 28%, transparent);

  /* Inner hairline (top-lit surface edge) */
  --edge-top: inset 0 1px 0 color-mix(in oklab, var(--white) 6%, transparent);

  /* Motion — precise, calm, no bounce. Systems-thinking = intentional. */
  --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 */
  --ease-orbit:  cubic-bezier(0.45, 0, 0.15, 1); /* @kind other */
  --dur-fast:    120ms; /* @kind other */
  --dur-base:    200ms; /* @kind other */
  --dur-slow:    340ms; /* @kind other */
  --dur-orbit:   640ms; /* @kind other */
}