/* ============================================================
   generalist Inc. — Design Tokens v0.1
   本命コンセプト「Quiet Intelligence」ベース
   構造: Primitive（生の値）→ Semantic（意味）の2層。
   エージェントへの指示: コードでは必ず Semantic 層を参照すること。
   Primitive を直接使うと、ブランド変更時に追従できなくなる。
   ============================================================ */

:root {
  /* ---------- Primitive: Color ---------- */
  /* Ink（ダーク面の基礎。青みを含む黒 = 純黒より柔らかく、シアンと調和する） */
  --gi-ink-950: #0B0E14;  /* 最深部。ページ背景 */
  --gi-ink-900: #11151D;  /* elevation 1 */
  --gi-ink-800: #171C26;  /* elevation 2: カード・入力 */
  --gi-ink-700: #1E2430;  /* elevation 3: ホバー・浮き */
  --gi-ink-500: #3A4354;  /* 無効状態・微細な境界 */

  /* Cloud（ライト面の基礎。わずかに青灰。真っ白の眩しさを避ける） */
  --gi-cloud-50:  #F7F8FA; /* ライト面のページ背景 */
  --gi-cloud-0:   #FFFFFF; /* ライト面のカード */
  --gi-cloud-200: #E4E7EC; /* ライト面の微細な区切り */

  /* Text */
  --gi-text-strong-dark: #E8ECF2;  /* ダーク面の主文字（純白ではない） */
  --gi-text-muted-dark:  #9AA3B2;  /* ダーク面の補助文字 */
  --gi-text-faint-dark:  #6B7484;  /* ダーク面のプレースホルダ */
  --gi-text-strong-light: #171C26;
  --gi-text-muted-light:  #57606E;

  /* Signal（アクセント = シアン。唯一の彩度。機能のある場所限定） */
  --gi-signal-400: #22D3EE; /* ダーク面用アクセント */
  --gi-signal-300: #67E8F9; /* ダーク面ホバー */
  --gi-signal-700: #0E7490; /* ライト面用アクセント（コントラスト確保のため暗く） */
  --gi-signal-800: #155E75; /* ライト面ホバー */
  --gi-signal-on:  #06252B; /* シアン塗り面の上に載せる文字色 */

  /* Status（状態色。彩度は抑えめに統一） */
  --gi-success: #34D399;
  --gi-warning: #FBBF24;
  --gi-danger:  #F87171;
  --gi-success-light: #047857;
  --gi-warning-light: #B45309;
  --gi-danger-light:  #B91C1C;

  /* ---------- Primitive: Typography ---------- */
  --gi-font-sans: 'Inter', 'Noto Sans JP', -apple-system, sans-serif;
  --gi-font-mono: 'IBM Plex Mono', 'SF Mono', monospace; /* 数値・ラベル・kicker用 */

  --gi-text-xs: 12px;   --gi-leading-xs: 1.6;
  --gi-text-sm: 14px;   --gi-leading-sm: 1.8;
  --gi-text-base: 16px; --gi-leading-base: 1.9;  /* 日本語本文は行間広め */
  --gi-text-lg: 20px;   --gi-leading-lg: 1.7;
  --gi-text-xl: 28px;   --gi-leading-xl: 1.5;
  --gi-text-2xl: 40px;  --gi-leading-2xl: 1.35;  /* 見出し。日本語は英語より行間が要る */

  --gi-tracking-kicker: 0.14em; /* モノスペースの小ラベル用 */

  /* ---------- Primitive: Space & Shape ---------- */
  /* 8pxグリッド。余白は「足りないより多すぎるほうが正しい」 */
  --gi-space-1: 8px;  --gi-space-2: 16px; --gi-space-3: 24px;
  --gi-space-4: 32px; --gi-space-6: 48px; --gi-space-8: 64px;
  --gi-space-12: 96px;

  --gi-radius-sm: 8px;   /* ボタン・チップ */
  --gi-radius-md: 12px;  /* カード・入力 */
  --gi-radius-lg: 16px;  /* セクション・モーダル */
  --gi-radius-full: 99px;

  --gi-shadow-float: 0 8px 32px rgba(0,0,0,.40); /* ダーク面: 影は「深さ」でなく「浮き」 */
  --gi-shadow-float-light: 0 4px 24px rgba(23,28,38,.08);

  --gi-motion-fast: 150ms ease-out;
  --gi-motion-base: 250ms ease-out;
}

/* ============================================================
   Semantic 層 — エージェントはここだけ参照する
   ============================================================ */

/* ---- ダークコンテキスト（プロダクトUI・コンソール・技術系LP） ---- */
[data-theme="dark"], .gi-dark {
  --bg-page:        var(--gi-ink-950);
  --bg-raised:      var(--gi-ink-900);
  --bg-card:        var(--gi-ink-800);
  --bg-hover:       var(--gi-ink-700);
  --text-strong:    var(--gi-text-strong-dark);
  --text-muted:     var(--gi-text-muted-dark);
  --text-faint:     var(--gi-text-faint-dark);
  --accent:         var(--gi-signal-400);
  --accent-hover:   var(--gi-signal-300);
  --accent-text-on: var(--gi-signal-on);
  --border-subtle:  transparent;            /* 罫線は原則使わない */
  --shadow:         var(--gi-shadow-float);
  --status-success: var(--gi-success);
  --status-warning: var(--gi-warning);
  --status-danger:  var(--gi-danger);
}

/* ---- ライトコンテキスト（HP下層・資料・ホワイトペーパー・メール） ---- */
[data-theme="light"], .gi-light {
  --bg-page:        var(--gi-cloud-50);
  --bg-raised:      var(--gi-cloud-0);
  --bg-card:        var(--gi-cloud-0);
  --bg-hover:       var(--gi-cloud-200);
  --text-strong:    var(--gi-text-strong-light);
  --text-muted:     var(--gi-text-muted-light);
  --text-faint:     #98A1B0;
  --accent:         var(--gi-signal-700);   /* ライト面ではシアンを暗く翻訳（WCAG AA確保） */
  --accent-hover:   var(--gi-signal-800);
  --accent-text-on: #FFFFFF;
  --border-subtle:  var(--gi-cloud-200);    /* ライト面のみ極薄の区切り線を許可 */
  --shadow:         var(--gi-shadow-float-light);
  --status-success: var(--gi-success-light);
  --status-warning: var(--gi-warning-light);
  --status-danger:  var(--gi-danger-light);
}
