/* 設計値。色・余白・文字はここだけで決め、他のファイルは var() で参照する。 */
:root {
  --se-paper: #f6f2ea;
  --se-surface: #fffdf9;
  --se-tile: #ebe4d8;
  --se-ink: #231f1c;
  --se-ink-sub: #6b625a;
  --se-line: #d8d0c3;
  --se-control: #8c8277; /* 入力欄・選択肢の枠(背景に対し 3:1 以上) */
  --se-accent: #5a4032;
  --se-success: #52634f;
  --se-danger: #9b3b2e;

  --se-font-jp: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --se-font-en: "Inter", "Noto Sans JP", sans-serif;

  --se-text: 15px;
  --se-text-sm: 13px;
  --se-text-xs: 11px;
  --se-leading: 1.9;
  --se-tracking: 0.04em;
  --se-tracking-wide: 0.14em;

  --se-space-1: 4px;
  --se-space-2: 8px;
  --se-space-3: 12px;
  --se-space-4: 16px;
  --se-space-5: 24px;
  --se-space-6: 32px;
  --se-space-7: 48px;
  --se-space-8: 64px;
  --se-space-9: 96px;
  --se-space-10: 128px;

  --se-container: 1200px;
  --se-gutter: 24px;
  --se-header-h: 72px;

  --se-rule: 1px solid var(--se-line);
  --se-rule-strong: 1px solid var(--se-ink);
  --se-focus: 2px solid var(--se-accent);
  --se-pop-shadow: 0 8px 24px rgba(35, 31, 28, 0.08);
}

@media (max-width: 899px) {
  :root {
    --se-gutter: 16px;
    --se-header-h: 60px;
  }
}
