@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@500;700&family=Space+Grotesk:wght@700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --paper: #F5F5F4;
  --ink: #0A0A0B;
  --surface: #FFFFFF;
  --surface-2: #F0F0EF;
  --muted: #79797E;
  --border: rgba(10, 10, 11, .09);
  --border-strong: rgba(10, 10, 11, .16);
  --chrome-a: #D6D6DA;
  --chrome-b: #FFFFFF;
  --chrome-c: #8E8E93;
  --radius: 14px;

  --font-display: 'Zen Kaku Gothic New', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
}

[data-theme="dark"] {
  --paper: #0A0A0B;
  --ink: #F5F5F4;
  --surface: #1C1C1F;
  --surface-2: #141416;
  --muted: #8A8A8E;
  --border: rgba(255, 255, 255, .08);
  --border-strong: rgba(255, 255, 255, .16);
  --chrome-a: #3A3A3E;
  --chrome-b: #E8E8EA;
  --chrome-c: #6E6E73;
}