/* gammonfrog — design tokens + base */
@font-face {
  font-family: 'Space Grotesk';
  src: url('../fonts/space-grotesk.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('../fonts/jetbrains-mono.woff2') format('woff2');
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Color tokens — light (default) */
  --paper:        #f4f3ee;
  --paper-2:      #ebe9e2;
  --paper-3:      #dedbd0;
  --ink:          #111111;
  --ink-2:        #2b2a27;
  --ink-3:        #6a6862;
  --ink-4:        #9a9890;
  --rule:         #1a1a1a;
  --rule-soft:    #cfccc1;
  --accent:       #E2323F;
  --accent-ink:   #ffffff;
  --warn:         #c63a1a;

  /* Type */
  --sans:  'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --mono:  'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  /* Layout */
  --gutter: 16px;
  --max:    760px;
  --topbar-h: 52px;
}

[data-theme="dark"] {
  --paper:     #0d0d0c;
  --paper-2:   #18181a;
  --paper-3:   #25252a;
  --ink:       #f1f0eb;
  --ink-2:     #d6d4cd;
  --ink-3:     #908e87;
  --ink-4:     #5e5c57;
  --rule:      #f1f0eb;
  --rule-soft: #2a2a2c;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: var(--paper); color: var(--ink); }
body {
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: 'ss01', 'ss02';
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }