@font-face { font-family: 'Geist'; font-style: normal; font-weight: 600; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist@latest/latin-600-normal.woff2") format('woff2'); }
@font-face { font-family: 'Geist'; font-style: normal; font-weight: 700; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist@latest/latin-700-normal.woff2") format('woff2'); }
@font-face { font-family: 'Geist'; font-style: normal; font-weight: 800; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/geist@latest/latin-800-normal.woff2") format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/inter@latest/latin-400-normal.woff2") format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/inter@latest/latin-500-normal.woff2") format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/inter@latest/latin-600-normal.woff2") format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/inter@latest/latin-700-normal.woff2") format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/inter@latest/latin-800-normal.woff2") format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 400; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/newsreader@latest/latin-400-italic.woff2") format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 500; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/newsreader@latest/latin-500-italic.woff2") format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: italic; font-weight: 600; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/newsreader@latest/latin-600-italic.woff2") format('woff2'); }
@font-face { font-family: 'Newsreader'; font-style: normal; font-weight: 400; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/newsreader@latest/latin-400-normal.woff2") format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-400-normal.woff2") format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-500-normal.woff2") format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 600; font-display: swap; src: url("https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-600-normal.woff2") format('woff2'); }

:root {
	--black: #0A0A0A;
	--white: #FAFAFA;
	--mist: #E9E9E9;
	--yellow: #F4D03F;
	--blue: #5B8DEF;
	--yellow-hover: #EBC42A;
	--blue-hover: #4B7DDE;
	--blue-soft: rgba(91, 141, 239, 0.14);
	--yellow-soft: rgba(244, 208, 63, 0.16);
	--ink-90: rgba(10, 10, 10, 0.90);
	--ink-70: rgba(10, 10, 10, 0.70);
	--ink-55: rgba(10, 10, 10, 0.55);
	--ink-40: rgba(10, 10, 10, 0.40);
	--ink-22: rgba(10, 10, 10, 0.22);
	--ink-12: rgba(10, 10, 10, 0.12);
	--ink-06: rgba(10, 10, 10, 0.06);
	--paper-90: rgba(250, 250, 250, 0.90);
	--paper-70: rgba(250, 250, 250, 0.70);
	--paper-55: rgba(250, 250, 250, 0.55);
	--paper-40: rgba(250, 250, 250, 0.40);
	--paper-22: rgba(250, 250, 250, 0.22);
	--paper-12: rgba(250, 250, 250, 0.12);
	--paper-08: rgba(250, 250, 250, 0.08);
	--surface-page: var(--mist);
	--surface-card: var(--white);
	--surface-sunk: #DEDEDE;
	--surface-invert: var(--black);
	--text-strong: var(--black);
	--text-body: var(--ink-90);
	--text-muted: var(--ink-55);
	--text-faint: var(--ink-40);
	--text-invert: var(--white);
	--border: var(--ink-12);
	--border-strong: var(--ink-22);
	--border-contrast: var(--black);
	--accent: var(--yellow);
	--accent-on: var(--black);
	--link: var(--blue);
	--link-hover: var(--blue-hover);
	--grid-line: var(--paper-08);
	--focus-ring: var(--blue);
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;
	--space-8: 64px;
	--space-9: 80px;
	--space-10: 96px;
	--radius-xs: 6px;
	--radius-sm: 10px;
	--radius-md: 14px;
	--radius-lg: 18px;
	--radius-xl: 24px;
	--radius-pill: 999px;
	--shadow-sm: 0 2px 4px rgba(10,10,11,0.04);
	--shadow-md: 0 14px 28px -14px rgba(10,10,11,0.18), 0 2px 4px rgba(10,10,11,0.04);
	--shadow-lg: 0 24px 48px -24px rgba(10,10,11,0.18);
	--shadow-dark: 0 24px 48px -16px rgba(0,0,0,0.6);
	--glow-yellow: 0 0 0 4px rgba(244,208,63,0.22);
	--glow-blue: 0 0 0 4px rgba(91,141,239,0.22);
	--shell-max: 1280px;
	--shell-pad: clamp(20px, 4vw, 48px);
	--reading-max: 760px;
	--ease: cubic-bezier(0.2, 0.8, 0.2, 1);
	--dur-fast: 160ms;
	--dur: 200ms;
	--dur-slow: 320ms;
	--grid-cell: 36px;
	--font-display: 'Geist', system-ui, -apple-system, sans-serif;
	--font-body: 'Inter', system-ui, -apple-system, sans-serif;
	--font-serif: 'Newsreader', 'Source Serif 4', Georgia, serif;
	--font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
	color-scheme: light;
}

[data-theme="dark"] {
	--surface-page: var(--black);
	--surface-card: #141414;
	--surface-sunk: #0F0F0F;
	--surface-invert: var(--white);
	--text-strong: var(--white);
	--text-body: var(--paper-90);
	--text-muted: var(--paper-55);
	--text-faint: var(--paper-40);
	--text-invert: var(--black);
	--border: var(--paper-12);
	--border-strong: var(--paper-22);
	--border-contrast: var(--white);
	--grid-line: var(--paper-08);
	color-scheme: dark;
}
