@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;1,6..72,400&family=JetBrains+Mono:wght@400&display=swap');

:root {
  --canvas:         #FBFBFA;
  --surface:        #FFFFFF;
  --surface-subtle: #F7F6F3;
  --border:         #EAEAEA;
  --text-primary:   #111111;
  --text-secondary: #787774;
  --text-muted:     #C2BFBB;
  --font-sans:      'Helvetica Neue', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-serif:     'Newsreader', Georgia, 'Times New Roman', serif;
  --font-mono:      'JetBrains Mono', 'SF Mono', Consolas, 'Courier New', monospace;
  --radius-sm:      4px;
  --radius-md:      8px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: var(--font-sans);
  background: var(--canvas);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: #111111;
  color: #FFFFFF;
}