/* Rigmala design tokens — deep emerald theme. Sourced from the Claude Design system export. */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root {
  /* base */
  --ink-950: #081311; --ink-900: #0c1b17; --ink-800: #122620; --ink-700: #163028; --ink-600: #1e4036;
  --paper-0: #ffffff; --paper-50: #f7fcf9; --paper-100: #eef7f2; --paper-200: #dcede4;
  --mint-400: #5ce4b8; --mint-500: #2fd4a0; --mint-600: #1fbd8c;
  --emerald-500: #0e9f76; --emerald-600: #0b8a66; --emerald-700: #087254;
  --sage-300: #c8ddd3; --sage-400: #9fbfb2; --sage-500: #5f8a7c;
  --red-500: #e0244a; --red-400: #ff4d6d; --amber-500: #d9930f; --amber-400: #f5b93c; --cobalt-500: #3b63f3; --cobalt-400: #5c80ff;

  /* semantic — dark theme (default) */
  --surface-page: var(--ink-950); --surface-card: var(--ink-900); --surface-raised: var(--ink-800); --surface-inverse: var(--paper-100);
  --border-subtle: var(--ink-700); --border-strong: var(--ink-600);
  --text-body: var(--paper-100); --text-secondary: var(--sage-400); --text-muted: var(--sage-500); --text-inverse: var(--ink-950); --text-on-accent: var(--ink-950);
  --accent: var(--mint-500); --accent-hover: var(--mint-400); --accent-press: var(--mint-600); --accent-subtle: rgba(47, 212, 160, 0.12);
  --link: var(--mint-500); --link-hover: var(--mint-400);
  --success: var(--mint-500); --warning: var(--amber-400); --danger: var(--red-400); --info: var(--cobalt-400);
  --focus-ring: rgba(47, 212, 160, 0.45);

  /* typography */
  --font-display: 'Space Grotesk', sans-serif; --font-body: 'Space Grotesk', sans-serif; --font-mono: 'Space Mono', monospace;
  --tracking-wordmark: -0.03em; --tracking-display: -0.02em; --tracking-label: 0.12em;
  --text-xs: 12px; --text-sm: 13px; --text-base: 15px; --text-lg: 17px; --text-xl: 20px; --text-2xl: 26px; --text-3xl: 34px; --text-4xl: 46px; --text-5xl: 64px;
  --leading-tight: 1.15; --leading-snug: 1.35; --leading-normal: 1.55; --leading-loose: 1.7;
  --weight-regular: 400; --weight-medium: 500; --weight-semibold: 600; --weight-bold: 700;

  /* spacing / radius */
  --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;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px; --radius-pill: 999px; --radius-mark: 44px;

  /* effects */
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.25); --shadow-raised: 0 8px 24px rgba(0, 0, 0, 0.35); --shadow-modal: 0 20px 60px rgba(0, 0, 0, 0.5);
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dur-fast: 120ms; --dur-base: 180ms;
}