:root {
  --dk-bg: #f5efe6;
  --dk-bg-alt: #ebe2d4;
  --dk-surface: #fffaf2;
  --dk-surface-strong: #ffffff;
  --dk-surface-soft: rgba(255, 250, 242, 0.74);
  --dk-ink: #162018;
  --dk-ink-soft: #425144;
  --dk-primary: #1f3a25;
  --dk-primary-soft: #4d6849;
  --dk-secondary: #8b9964;
  --dk-accent: #b48356;
  --dk-line: rgba(22, 32, 24, 0.12);
  --dk-line-strong: rgba(22, 32, 24, 0.18);
  --dk-shadow-sm: 0 4px 14px rgba(22, 32, 24, 0.08);
  --dk-shadow-md: 0 18px 40px rgba(22, 32, 24, 0.11);
  --dk-shadow-lg: 0 32px 72px rgba(22, 32, 24, 0.14);
  --dk-radius-sm: 10px;
  --dk-radius-md: 18px;
  --dk-radius-lg: 28px;
  --dk-radius-xl: 40px;
  --dk-radius-pill: 999px;
  --dk-container: var(--theme-container-width, min(1240px, calc(100vw - 2rem)));
  --dk-content: min(760px, calc(100vw - 2rem));
  --dk-narrow: min(640px, calc(100vw - 2rem));
  --dk-space-1: 0.25rem;
  --dk-space-2: 0.5rem;
  --dk-space-3: 0.75rem;
  --dk-space-4: 1rem;
  --dk-space-5: 1.25rem;
  --dk-space-6: 1.5rem;
  --dk-space-8: 2rem;
  --dk-space-10: 2.5rem;
  --dk-space-12: 3rem;
  --dk-space-16: 4rem;
  --dk-space-20: 5rem;
  --dk-space-24: 6rem;
  --dk-section-pad: clamp(3rem, 6vw, 6rem);
  --dk-section-pad-tight: clamp(2rem, 4vw, 3.5rem);
  --dk-font-body: "Avenir Next", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --dk-font-heading: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --dk-transition: 180ms ease;
}

body {
  background:
    radial-gradient(circle at top left, rgba(139, 153, 100, 0.16), transparent 28%),
    radial-gradient(circle at top right, rgba(180, 131, 86, 0.12), transparent 24%),
    linear-gradient(180deg, var(--dk-bg) 0%, #f7f2ea 100%);
  color: var(--dk-ink);
  font-family: var(--dk-font-body);
  text-rendering: optimizeLegibility;
}

body:not(.block-editor-page)::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.35), transparent 40%),
    repeating-linear-gradient(
      135deg,
      rgba(22, 32, 24, 0.015) 0,
      rgba(22, 32, 24, 0.015) 1px,
      transparent 1px,
      transparent 14px
    );
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), transparent 92%);
  z-index: -1;
}

::selection {
  background: var(--dk-primary);
  color: var(--dk-surface-strong);
}
