:root {
  --brand: #176b4f;
  --brand-dark: #10533d;
  --brand-soft: #dff1e9;
  --loop: #4a3fc0;
  --loop-soft: #ecebfb;
  --spark: #dcff64;
  --spark-ink: #131728;
  --ink: #17211d;
  --muted: #5b6660;
  --bg: #f6f3ea;
  --surface: #fff;
  --line: #d9d4c9;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-pill: 999px;
  --sh-1: 0 4px 14px rgba(23, 33, 29, .08);
  --sh-2: 0 18px 50px rgba(23, 33, 29, .12);
  --font: "BIZ UDPGothic", "Hiragino Sans", system-ui, sans-serif;
  --fs-cap: 12px;
  --fs-body: 16px;
  --fs-h3: 20px;
  --fs-h2: 28px;
  --fs-h1: 40px;
  --tap: 44px;
}

*, *::before, *::after { box-sizing: border-box; }
button, select, summary { min-height: var(--tap); }
input:not([type="checkbox"]):not([type="radio"]), textarea { min-height: var(--tap); }
:focus-visible { outline: 3px solid var(--loop); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}