:root {
  --paper: #ece8dd;
  --paper-deep: #e3dccb;
  --ink: #1a1814;
  --ink-soft: #4a463e;
  --ink-faint: #8a8579;
  --accent: oklch(0.55 0.13 30);
  --blue-ink: oklch(0.52 0.13 248);
  --serif-jp: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --serif-en: "EB Garamond", "Cormorant Garamond", Georgia, serif;
  --hand: "Caveat", "Noto Serif JP", cursive;
  --mono: "JetBrains Mono", ui-monospace, monospace;
  --rule: color-mix(in oklab, var(--ink) 15%, transparent);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #1d1c18;
    --paper-deep: #14130f;
    --ink: #e8e3d4;
    --ink-soft: #b6b1a1;
    --ink-faint: #6a6558;
    --accent: oklch(0.7 0.13 30);
  }
}

:root[data-theme="dark"] {
  --paper: #1d1c18;
  --paper-deep: #14130f;
  --ink: #e8e3d4;
  --ink-soft: #b6b1a1;
  --ink-faint: #6a6558;
  --accent: oklch(0.7 0.13 30);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--serif-en), var(--serif-jp);
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

@keyframes halBreathe {
  0% { transform: scale(1) translateY(0px); }
  50% { transform: scale(1.012) translateY(-2px); }
  100% { transform: scale(0.99) translateY(1px); }
}

@keyframes halBlob {
  0% { transform: translate(-50%, -50%) scale(1) rotate(0deg); }
  100% { transform: translate(-52%, -48%) scale(1.15) rotate(20deg); }
}

@keyframes halFloatIn {
  from { opacity: 0; transform: translate(-50%, -50%) translateY(6px); }
  to { opacity: 1; transform: translate(-50%, -50%) translateY(0); }
}

@keyframes halFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}