/* ふぁまふぁい デザイントークン（design-system/DESIGN.md が正）
   配色はタグ用マスターパレットの派生ルール（色相を借り、明度を段階で動かす）。主色相 130（若葉）／副色相 60（土・実り）。
   ライトテーマのみ。カラー・フォントサイズは必ずここの変数経由で使う。 */
:root {
  --hue-p: 130;   /* 主: みどり（若葉・畑） */
  --hue-s: 60;    /* 副: ちゃいろ（土・実り・木箱） */
  --hue-a: 30;    /* 差し色: 果実（トマト・柿） */

  /* 面・線・文字（主色相） */
  --bg:         oklch(0.97 0.012 var(--hue-p));
  --bg-card:    oklch(0.99 0.006 var(--hue-p));
  --bg-input:   oklch(0.985 0.008 var(--hue-p));
  --bg-sub:     oklch(0.93 0.025 var(--hue-p));
  --border:     oklch(0.86 0.03 var(--hue-p));
  --text:       oklch(0.30 0.035 var(--hue-p));
  --text-muted: oklch(0.48 0.03 var(--hue-p));
  --text-dim:   oklch(0.62 0.025 var(--hue-p));
  --btn-text:   oklch(0.99 0.006 var(--hue-p));

  /* アクセント 3 段（強／タグ／淡） */
  --c-p:       oklch(0.55 0.10 var(--hue-p));
  --c-p-dark:  oklch(0.42 0.09 var(--hue-p));
  --c-p-tag:   oklch(0.80 0.07 var(--hue-p));
  --c-p-light: oklch(0.92 0.035 var(--hue-p));
  --c-s:       oklch(0.55 0.10 var(--hue-s));
  --c-s-tag:   oklch(0.80 0.07 var(--hue-s));
  --c-s-light: oklch(0.92 0.035 var(--hue-s));
  --c-a:       oklch(0.62 0.12 var(--hue-a));
  --c-a-tag:   oklch(0.80 0.07 var(--hue-a));
  --c-a-light: oklch(0.92 0.035 var(--hue-a));

  /* 意味色（good=150 / warn=60 / bad=20・同トーン） */
  --color-success: oklch(0.55 0.10 150);
  --color-warn:    oklch(0.55 0.10 60);
  --color-danger:  oklch(0.55 0.12 20);
  --color-error:   oklch(0.62 0.12 20);

  /* タグ用マスターパレット（識別色専用・12 色） */
  --c-tag-0:#E5ABBC; --c-tag-30:#E7ADA3; --c-tag-60:#E0B491; --c-tag-90:#CFBC8A; --c-tag-120:#B8C592; --c-tag-150:#9ECBA6;
  --c-tag-180:#8BCDBF; --c-tag-210:#87CBD7; --c-tag-240:#95C4E7; --c-tag-270:#ACBCEC; --c-tag-300:#C4B4E5; --c-tag-330:#D8AED3;

  /* 書体 */
  --font-display: 'Zen Maru Gothic', 'Noto Sans JP', sans-serif;  /* 見出し・数字の見せ場（丸ゴ＝ややかわいい系） */
  --font-ui: 'Noto Sans JP', 'Segoe UI', sans-serif;
  --font-mono: 'Cascadia Code', 'Fira Code', Consolas, monospace;

  /* レイヤー・アニメーション */
  --z-header: 100; --z-menu: 300; --z-sheet: 500; --z-popup: 9000;
  --dur-float: 0.3s; --ease-float: cubic-bezier(0.22, 1, 0.36, 1);
}
html { font-size: 16px; }
