@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap");

:root {
  --tool-bg: #0a0a0a;
  --tool-panel: #161616;
  --tool-border: #2a2a2c;
  --tool-text: #ffffff;
  --tool-muted: #a1a1a6;
  --tool-primary: #ff6b00;
  --tool-heading: "Space Grotesk", "Inter", sans-serif;
  --tool-body: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body {
  font-family: var(--tool-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
.tool-heading {
  font-family: var(--tool-heading);
  letter-spacing: -0.02em;
}

.tool-topbar {
  letter-spacing: 0.06em;
}

.tool-brand-lockup {
  font-family: var(--tool-heading);
  letter-spacing: -0.03em;
}

.tool-brand-accent {
  color: var(--tool-primary);
}