/* Australis Skyfall — spacing, radii, shadows, motion (v3 "calm depth") */

:root {
  /* Spacing (4px base) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;

  /* Semantic spacing — airy content, compact chrome */
  --pad-chrome: var(--space-2);   /* app chrome: rails, toolbars, list rows */
  --pad-content: var(--space-8);  /* work surfaces: page bodies, card interiors breathe */
  --gap-pane: var(--space-4);     /* gutter between panes/cards on the canvas */
  --measure: 68ch;                /* long-form reading width */

  /* Radii — moderate, calm */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 10px;  /* buttons, inputs, menu items */
  --radius-lg: 14px;  /* cards, panes, popovers */
  --radius-xl: 16px;  /* dialogs, drawers, command palette */
  --radius-full: 999px;

  /* Depth — crisp 1px hairline + layered soft shadow underneath.
     Every elevated surface pairs border: 1px solid var(--border-subtle)
     with one of these. Shadows are cool-tinted and two-layer:
     a tight contact shadow + a wide ambient falloff. */
  --shadow-xs: 0 1px 2px oklch(0.13 0.02 265 / 0.22);
  --shadow-sm: 0 1px 2px oklch(0.13 0.02 265 / 0.2), 0 2px 8px -2px oklch(0.13 0.02 265 / 0.24);
  --shadow-md: 0 2px 4px oklch(0.13 0.02 265 / 0.22), 0 10px 28px -6px oklch(0.13 0.02 265 / 0.36);
  --shadow-lg: 0 4px 8px oklch(0.13 0.02 265 / 0.26), 0 28px 64px -12px oklch(0.13 0.02 265 / 0.5);
  --shadow-drawer: 0 8px 16px oklch(0.13 0.02 265 / 0.28), 0 32px 80px -8px oklch(0.13 0.02 265 / 0.55);

  /* Glows — hero moments ONLY: empty states, featured cards, command palette */
  --glow-accent: 0 0 72px -16px color-mix(in oklab, var(--blue-base) 42%, transparent);
  --glow-secondary: 0 0 72px -16px color-mix(in oklab, var(--cyan-base) 38%, transparent);
  --glow-ai: 0 0 72px -16px color-mix(in oklab, var(--violet-base) 40%, transparent);

  /* Active rail — left accent bar on active nav / selected items */
  --rail-active: inset 2px 0 0 0 var(--accent);

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

  /* Motion — calm, no bounce */
  --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 */
  --duration-fast: 120ms; /* @kind other */
  --duration-base: 180ms; /* @kind other */
  --duration-slow: 300ms; /* @kind other */
  --duration-drawer: 260ms; /* @kind other */
}

[data-theme="light"] {
  --shadow-xs: 0 1px 2px oklch(0.3 0.02 255 / 0.07);
  --shadow-sm: 0 1px 2px oklch(0.3 0.02 255 / 0.06), 0 2px 8px -2px oklch(0.3 0.02 255 / 0.08);
  --shadow-md: 0 2px 4px oklch(0.3 0.02 255 / 0.06), 0 10px 28px -6px oklch(0.3 0.02 255 / 0.12);
  --shadow-lg: 0 4px 8px oklch(0.3 0.02 255 / 0.07), 0 28px 64px -12px oklch(0.3 0.02 255 / 0.18);
  --shadow-drawer: 0 8px 16px oklch(0.3 0.02 255 / 0.08), 0 32px 80px -8px oklch(0.3 0.02 255 / 0.22);
  --glow-accent: 0 0 72px -16px color-mix(in oklab, var(--blue-deep) 26%, transparent);
  --glow-secondary: 0 0 72px -16px color-mix(in oklab, var(--cyan-deep) 24%, transparent);
  --glow-ai: 0 0 72px -16px color-mix(in oklab, var(--violet-deep) 25%, transparent);
}