:root {
  --ink: #0c0a08;
  --ink-2: #151110;
  --surface: #1f1914;
  --surface-2: #282013;
  --cream: #F3EEE2;
  --cream-dim: #C9C0AD;
  --muted: #8E8470;
  --coral: #D9774E;
  --coral-2: #C15F3C;
  --line: rgba(243, 238, 226, 0.07);
  --line-2: rgba(243, 238, 226, 0.13);
  --glow: rgba(217, 119, 78, 0.22);
  --maxw: 118rem;
  --pad: clamp(2rem, 5vw, 7rem);
  --f: "IBM Plex Sans Arabic", system-ui, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, monospace;
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-premium: cubic-bezier(0.16, 1, 0.3, 1);

  /* aliases for subpages */
  --bg: var(--ink);
  --text: var(--cream);
  --text-soft: var(--cream-dim);
  --accent: var(--coral);
  --border: var(--line-2);
  --card: var(--ink-2);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --motion: 0s;
  }
}

@media (max-width: 900px) {
  :root {
    --pad: clamp(1.8rem, 4.5vw, 3rem);
  }
}

@media (max-width: 640px) {
  :root {
    --pad: 1.6rem;
  }
}