:root {

  --ink: #1c1f22;
  --ink-soft: #43494e;
  --muted: #575c61;
  --line: #d7dbde;
  --line-soft: #e6e9ea;

  --paper: #ececed;
  --surface: #ffffff;
  --board: #e0e3e4;
  --night: #1c1f22;
  --night-2: #121416;

  --accent: #e0631f;
  --accent-strong: #80350f;
  --accent-soft: #f0a874;
  --accent-tint: rgba(224, 99, 31, 0.13);

  --ok: #2f7a52;
  --danger: #b3261e;

  --shadow-sm: 0 2px 10px rgba(28, 31, 34, 0.08);
  --shadow: 0 16px 40px rgba(28, 31, 34, 0.12);
  --shadow-lg: 0 28px 64px rgba(28, 31, 34, 0.18);

  --radius-sm: 0.3rem;
  --radius: 0.5rem;
  --radius-lg: 0.9rem;

  --font-head: "Noto Serif JP Sub", "Hiragino Mincho ProN", serif;
  --font-body: "Noto Sans JP Sub", "Hiragino Sans", "Yu Gothic", sans-serif;
  --font-mono: "SFMono-Regular", Consolas, monospace;

  --max: 1160px;
  --gutter: 1.25rem;
  --topbar-h: 4.5rem;

  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
}
@media (max-width: 960px) {
  :root { --gutter: 1.15rem; --topbar-h: 3.9rem; }
}
@media (max-width: 480px) {
  :root { --gutter: 1rem; }
}