/* generated by design-os | theme: compunamics-dark | contract: 1 | design-os@1e4e39d | 2026-07-07 | DO NOT HAND-EDIT -- edit themes/compunamics-dark/theme.css and run dos update */

:root {
  --bg: #08090C;
  --surface: #0E1119;
  --surface-2: #141925;
  --fg: #EEF1F6;
  --muted: #98A2B3;
  --border: #232A38;
  --accent: #6366F1;
  --accent-hover: #818CF8;
  --accent-fg: #ffffff;
  --font-body: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --container: 1200px;
  --muted-2: #6B7585;
  --border-subtle: #1A202C;
  --tint: color-mix(in srgb, var(--accent) 16%, transparent);
  --accent-2: #E0A23A;
  --t-display: clamp(2.75rem, 6vw, 5.25rem);
  --t-h1: clamp(2rem, 4.5vw, 3.5rem);
  --t-h2: clamp(1.5rem, 2.4vw, 2rem);
  --t-h3: 1.25rem;
  --t-body: 1.0625rem;
  --t-small: 0.9375rem;
  --t-mono: 0.8125rem;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --space-11: 192px;
  --container-prose: 720px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 180ms;
  --dur: 400ms;
  --dur-slow: 800ms;
  --shadow-card: 0 1px 0 rgba(255,255,255,0.03) inset, 0 16px 40px rgba(0,0,0,0.45);
  --shadow-pop: 0 0 0 2px #4F46E5, 0 20px 48px rgba(79, 70, 229, 0.18);
  --x-bg-grad-1: #0C0F15;
  --x-lime: #6366F1;
  --x-lime-soft: rgba(99, 102, 241, 0.16);
  --x-lime-glow: rgba(79, 70, 229, 0.40);
  --x-cyan: #2563EB;
  --x-cyan-soft: rgba(37, 99, 235, 0.16);
  --x-cyan-glow: rgba(37, 99, 235, 0.45);
  --x-magenta: #3B82F6;
  --x-grad-brand: linear-gradient(120deg, #2563EB 0%, #4F46E5 60%, #6366F1 100%);
  --x-grad-brand-2: linear-gradient(135deg, #2563EB, #4F46E5);
  --x-glow-indigo: rgba(79, 70, 229, 0.18);
  --x-glow-blob: rgba(37, 99, 235, 0.06);
  --x-glass: rgba(14, 17, 25, 0.60);
  --x-glass-border: rgba(255, 255, 255, 0.08);
  --x-gold-soft: rgba(224, 162, 58, 0.14);
  --x-gold-border: rgba(224, 162, 58, 0.40);
  --x-radius-xl: 18px;
  --x-radius-2xl: 24px;
  --x-radius-3xl: 32px;
  --x-shadow-glow: 0 0 0 1px rgba(79, 70, 229, 0.30), 0 8px 32px rgba(79, 70, 229, 0.18);
  --x-shadow-2xl: 0 24px 64px rgba(0,0,0,0.55);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur: 0ms;
    --dur-slow: 0ms;
  }
}