:root {
  --ui-bg: #f3f5f2;
  --ui-paper: #f4f1ea;
  --ui-surface: #fffdf8;
  --ui-ink: #18241f;
  --ui-muted: #68716c;
  --ui-line: #d9d7cf;
  --ui-accent: #1f513c;
  --ui-accent-soft: #dfe9e1;
  --ui-highlight: #ef6c3f;
  --ui-danger: #a3382d;
  --ui-radius-sm: 10px;
  --ui-radius-md: 16px;
  --ui-radius-lg: 22px;
  --ui-shadow: 0 18px 55px rgb(30 42 35 / 8%);
  --ui-shadow-soft: 0 12px 38px rgb(13 38 29 / 8%);
  --ui-font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ui-serif: Georgia, "Times New Roman", serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

/* Author layout rules must never override the platform visibility contract. */
[hidden] {
  display: none !important;
}

body {
  min-width: 320px;
  margin: 0;
  color: var(--ui-ink);
  background: var(--ui-bg);
  font-family: var(--ui-font);
  -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

:focus-visible {
  outline: 3px solid rgb(31 81 60 / 24%);
  outline-offset: 2px;
}

.feature-boundary {
  max-width: 48rem;
  margin: 4rem auto;
  padding: 2rem;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius-md);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow);
}

.feature-boundary h1 {
  margin: 0 0 0.75rem;
  font-family: var(--ui-serif);
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 500;
  letter-spacing: -0.04em;
}

.feature-boundary-error {
  border-color: color-mix(in srgb, var(--ui-danger) 35%, var(--ui-line));
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}