:root {
  --ink: #111318;
  --ink-light: #52555f;
  --ink-faint: #6b7280;
  --bg: #ffffff;
  --bg-soft: #f4f5f7;
  --bg-card: #ffffff;
  --border: #e4e6eb;
  --accent: #2563eb;
  --accent-rgb: 37, 99, 235;
  --accent-hover: #1d4ed8;
  --accent-light: #eff6ff;
  --accent-pale: #f8faff;
  --accent-lighter: #f0f4ff;
  --accent-text: #1e40af;
  --success: #16a34a;
  --sans: 'Space Grotesk', 'Noto Sans JP', 'Inter', sans-serif;
  --body: 'Noto Sans JP', 'Inter', sans-serif;
  --mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
  --radius: 12px;
  --radius-sm: 8px;
  --shadow: 0 1px 3px rgba(0,0,0,0.08), 0 4px 16px rgba(0,0,0,0.04);
  --shadow-hover: 0 4px 12px rgba(0,0,0,0.12), 0 8px 32px rgba(0,0,0,0.06);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  font-family: var(--body);
  background: var(--bg);
  color: var(--ink);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}