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

:root {
  --paper: #f2ede4;
  --paper-dark: #e8e1d5;
  --paper-mid: #ded6c8;
  --ink: #1a1612;
  --ink-mid: #3d3630;
  --ink-light: #6b6258;
  --ink-faint: #9b9188;
  --ink-ghost: #c5bfb6;
  --green: #4a7c3f;
  --green-light: #ddefd8;
  --green-mid: #8bbf82;
  --red: #c0392b;
  --red-light: #f5dbd9;
  --amber: #b8730a;
  --amber-light: #f5e9d5;
  --blue: #2c5f8a;
  --blue-light: #d5e5f0;
  --rule: #b8b0a4;
  --rule-light: #d5cfc7;
  --mono: 'DM Mono', monospace;
  --display: 'Manrope', sans-serif;
  --ease: cubic-bezier(.4,0,.2,1);

  /* mapped aliases */
  --bg: var(--paper);
  --surface: var(--paper);
  --surface-2: var(--paper-dark);
  --surface-3: var(--paper-mid);
  --border: var(--rule-light);
  --border-bright: var(--rule);
  --text: var(--ink);
  --text-muted: var(--ink-light);
  --text-dim: var(--ink-faint);
  --accent: var(--blue);
  --accent-2: var(--green);
}

html { scroll-behavior: smooth; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--display);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}

/* Subtle paper texture */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 0;
  opacity: 1;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.7); }
}

@keyframes scrollPulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 1; }
}