/* =========================================================================
   tokens.css  ―  本画面(online_assessment_top)用トークン＝「基準トークンの対応層」
   画面: オンライン査定TOP（買取相場シミュレーションTOP）
   --------------------------------------------------------------------------
   ★本文の色/サイズは pc.css/sp.css に Figma 実測値を直書き（本ファイルではない）。
   ★共有chrome（../_shared/chrome-*.css）が var(--scl-container) 等を参照するため
     トークン名は共有契約の --scl-* を使用（値は本画面用）。
   ★本文の画面固有クラスは scl-hero / scl-simform 等（他画面と別名）。
   ★読み込み順: ../_shared/skeleton-base.css → tokens.css → ../_shared/chrome-{pc,sp}.css → pc.css/sp.css
   ※本文スタイル(pc.css/sp.css)は Figma 実測値を直書きしており、色/サイズの調整は各CSSを直接編集する。
     本ファイルのトークンは主に共有chrome(--scl-container 等)＋ベースが参照する契約層。
   ========================================================================= */
:root {

  /* ---- 罫線・入力枠（実測） ------------------------------------------- */
  --scl-color-border:        #ebebeb;   /* 実測: select枠 #ebebeb */

  /* ---- テキスト（実測） ----------------------------------------------- */
  --scl-color-text:          #333333;   /* 本文・ラベル（実測 #333） */
  --scl-color-text-sub:      #666666;   /* 補助（実測: 人気の相場文字 #666） */

  /* ---- アクセント（赤 #dc0000：必須文字・ロゴ・CTA・タブ下線）---- */
  --scl-color-required:      #dc0000;   /* 実測: 必須 #dc0000 */
  --scl-color-accent:        #dc0000;   /* 共有chrome（ロゴ/下線）で参照 */

  /* ---- フッター（実測） ---------------------------------------------- */
  --scl-color-foot-bar:      #6b7178;
  --scl-color-foot-band:     #f2f2f2;
  --scl-color-foot-copy:     #2d2d2d;   /* 実測: コピーライト暗バー #2d2d2d */

  /* ---- フォント ------------------------------------------------------ */
  /* デザイン周知(久高さん 2026-07-17)によりメインフォントは Hiragino Kaku Gothic Std で統一（事前査定ページと同じ）。
     Figma の指定は Noto Sans JP だが、周知が優先。フォールバックは coming-soon.html の既存スタックに準拠。 */
  --scl-font-base: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;

  /* フォントサイズ（PC。元画像2x前提で実寸換算＝design px ÷ 2 の概算） */
  --scl-fs-lg:     17px;
  --scl-fs-md:     15px;
  --scl-fs-xs:     12px;
  --scl-fs-2xs:    11px;
  --scl-lh-base:   1.7;

  /* ---- 余白 ---------------------------------------------------------- */
  --scl-space-1: 4px;  --scl-space-2: 8px;  --scl-space-3: 12px; --scl-space-4: 16px;
  --scl-space-5: 24px; --scl-space-6: 32px; --scl-space-7: 48px; --scl-space-8: 64px;

  /* ---- レイアウト ---------------------------------------------------- */
  --scl-container:      1168px;  /* PC コンテンツ最大幅（padding 0 24px 込みで実効1120px＝Figma content幅） */
}