:root {
  --ink: #18352a;
  --ink-soft: #527064;
  --ink-faint: #769084;
  --paper: #fffdf8;
  --paper-deep: #f5f0e5;
  --leaf: #267449;
  --leaf-dark: #165a35;
  --leaf-soft: #dff0df;
  --sky-soft: #e4f1f5;
  --line: #d8e4d4;
  --line-strong: #b6ceb7;
  --danger: #b14d40;
  --danger-soft: #fff0ed;
  --shadow: 0 20px 60px rgba(29, 73, 46, 0.1);
  --display: "Iowan Old Style", "Apple SD Gothic Neo", "Noto Serif KR", Georgia, serif;
  --body: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Segoe UI", system-ui, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, monospace;
}

* {
  box-sizing: border-box;
}

html {
  background: var(--paper-deep);
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 8% 0%, rgba(224, 241, 221, 0.95), transparent 32rem),
    linear-gradient(180deg, #f9fcf4 0%, var(--paper-deep) 100%);
  color: var(--ink);
  font-family: var(--body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.is-modal-open {
  overflow: hidden;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1,
h2,
h3 {
  font-family: var(--display);
  letter-spacing: -0.025em;
  text-wrap: balance;
}

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

button,
select {
  cursor: pointer;
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(38, 116, 73, 0.3);
  outline-offset: 3px;
}

a {
  color: inherit;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.muted-copy {
  color: var(--ink-soft);
}

.mono {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
}

.gi-pulse {
  animation: gi-pulse 2.4s ease-in-out infinite;
}

@keyframes gi-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(38, 116, 73, 0.34), 0 10px 24px rgba(38, 116, 73, 0.18);
  }

  50% {
    box-shadow: 0 0 0 9px rgba(38, 116, 73, 0), 0 13px 28px rgba(38, 116, 73, 0.28);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}