export const designSpecs = {
  nav: {
    background: "#050816",
    backgroundElevated: "#080B1F",
    border: "#1C2340",
    text: "#E5E9FF",
    textMuted: "#9AA4D0",
    accentPrimary: "#5B5FFF",
    accentSecondary: "#BE79FF",
    accentDanger: "#FF4F7B",
    hoverBackground: "#101735",
    activeIndicator: "#5B5FFF",
    divider: "rgba(255,255,255,0.06)",
  },
  logo: {
    wordmark: {
      fontFamily: "Inter, system-ui, sans-serif",
      fontWeight: 700,
      fontSize: "1.5rem",
      letterSpacing: "0.05em",
    },
    emblem: {
      size: "32px",
      strokeWidth: "2px",
      rotation: "3deg",
    },
  },
  animations: {
    duration: {
      fast: "120ms",
      normal: "160ms",
      slow: "300ms",
    },
    easing: {
      easeOut: "cubic-bezier(0.4, 0, 0.2, 1)",
    },
  },
} as const;