/* ============================================================
   yu-take.com — Site-level token aliases
   正本 = design-system/colors_and_type.css（Claude Design同期）。
   このファイルはサイト固有のエイリアス層で、すべて正本のプリミティブから導出する。
   ※ 正本(colors_and_type.css)を先に読み込んだ上で本ファイルを読み込むこと。
   ============================================================ */

/* 数字表示用フォント: D-DIN（Datto, SIL OFL 1.1・自ホスト）。
   url() は本CSSファイル基準で解決されるため、どの階層のHTMLから読まれても
   fonts/ を正しく指す（file:// でも動作）。取得失敗時は --font-num の
   フォールバック（JetBrains Mono）に自然退行する。 */
@font-face {
  font-family: 'D-DIN';
  src: url('./fonts/D-DIN.woff2') format('woff2');
  font-weight: 400 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'D-DIN';
  src: url('./fonts/D-DIN-Bold.woff2') format('woff2');
  font-weight: 600 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* 数字用フォント（大きな数値表示に使用。取得失敗時は mono にフォールバック）
     ※ services の連番(.svc-num)は意図的に --font-mono のまま据え置く */
  --font-num: 'D-DIN', var(--font-mono);

  /* ブランド系（index.html のクラスが参照） */
  --brand:           var(--primary);
  --brand-mid:       var(--secondary);
  --brand-glow:      rgba(154, 243, 171, 0.18);
  --brand-glow-soft: rgba(154, 243, 171, 0.08);

  /* テキスト系 */
  --text:            var(--fg);
  --text-muted:      var(--fg-muted);
  --text-dark:       var(--p-800);

  /* ガラスモーフィズム（ダークテーマのコンポーネント層） */
  --glass-bg:        var(--bg-elevated);
  --glass-bg-hover:  rgba(154, 243, 171, 0.07);
  --glass-border:    var(--border);
  --glass-border-w:  rgba(255, 255, 255, 0.10);

  /* 角丸（サイト独自スケール。正本の radius スケールとは別系統） */
  --radius-s:  12px;
  --radius-m:  20px;
  --radius-l:  28px;
  --radius-xl: 36px;

  /* シャドウ（ブランドグロー） */
  --shadow-brand: 0 8px 40px rgba(154, 243, 171, 0.18);
}