/* Hallmark · genre: modern-minimal · theme: custom "Helix Mono" · design-system: design.md · designed-as-app
 * paper #ffffff · ink #000000 · accent #00ffff cyan(黒地のみ) · Archivo + Noto Sans JP
 * axes: light / grotesk-sans / neutral(+cyan on black)
 * pre-emit critique: P5 H4 E4 S5 R5 V3
 *
 * ヘリックス社内システム共通トークン。正は For_ClaudeCode/helix-design-system/tokens.css。
 * 各アプリにはコピーして配置する(sync.sh)。ここを直したら sync.sh を実行して ?v= を上げる。
 */
:root {
  /* ---- 紙とインク(helixcreative.jp の design-spec 由来) ---- */
  --hx-paper:        #ffffff;          /* #ffffff */
  --hx-paper-2:      #f7f7f7;         /* #f7f7f7 背景グレー */
  --hx-ink:          #000000;            /* #000000 見出し・ロゴ */
  --hx-ink-2:        #17181a;     /* #17181a 本文・ダーク面 */
  --hx-muted:        #707070;           /* #707070 サブテキスト */
  --hx-faint:        #999999;           /* #999999 キャプション */
  --hx-placeholder:  #a5a5a5;           /* #a5a5a5 */
  --hx-rule:         #e3e3e3;           /* #e3e3e3 区切り */
  --hx-rule-strong:  #c7c7c7;           /* #c7c7c7 罫線 */
  --hx-accent:       #00ffff;   /* #00ffff 黒地の上でだけ使う(現在地・強調) */
  --hx-focus:        #000000;            /* フォーカスリング(白地) */

  /* ---- 状態色(機能色。面積は小さく) ---- */
  --hx-ok:      #1a7f4b;  --hx-ok-bg:   #e9f6ee;
  --hx-warn:    #b45309;   --hx-warn-bg: #fdf3e0;
  --hx-bad:     #b42318;   --hx-bad-bg:  #fbe9e7;

  --hx-ok-line: #bfe3cd; --hx-warn-line: #ecd2a8; --hx-bad-line: #f2c2bd;   /* バッジの枠線(状態色の薄め) */

  /* ---- 書体 ---- */
  --hx-font-display: "Archivo", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif;
  --hx-font-body:    "Archivo", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --hx-font-mono:    ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* ---- サイズ(4pt) ---- */
  --hx-text-xs: 11px;  --hx-text-sm: 12.5px; --hx-text-md: 13.5px; --hx-text-lg: 15px;
  --hx-text-xl: 20px;  --hx-text-2xl: 26px;  --hx-text-3xl: 34px;
  --hx-space-1: 4px;  --hx-space-2: 8px;  --hx-space-3: 12px; --hx-space-4: 16px;
  --hx-space-5: 20px; --hx-space-6: 24px; --hx-space-8: 32px; --hx-space-12: 48px;
  --hx-radius: 3px;   --hx-radius-card: 4px;
  --hx-bar-h: 56px;

  /* ---- 動き ---- */
  --hx-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --hx-dur: 160ms;

  /* ---- 旧変数名の互換(各アプリの inline style が参照している名前。値は新トークンに寄せる) ---- */
  --ink: var(--hx-ink-2);      --sub: var(--hx-muted);     --line: var(--hx-rule);  --bg: var(--hx-paper-2);
  --brand: var(--hx-ink);      --brand-weak: var(--hx-paper-2);
  --ok: var(--hx-ok);  --warn: var(--hx-warn);  --bad: var(--hx-bad);
  --okbg: var(--hx-ok-bg); --warnbg: var(--hx-warn-bg); --badbg: var(--hx-bad-bg);
  --card: var(--hx-paper);  --muted: var(--hx-muted);  --accent: var(--hx-ink);  --side: var(--hx-ink);
}
