/* OSHIMISE PREMIUM デザイントークン（2026-08-15 19:31 JST）
   ベース = 推し店（mock/css/tokens.css）。ニュートラル・ブランド・形状・タイポを
   「黒基調＋ゴールド／東京カレンダー寄り」のラグジュアリー基調へ全面差し替えしたもの。

   ★★ ダーク値は【D1】【D2】の2ブロックにある。片方だけ直すと
      「OS追随のときだけ色が違う」事故になる。必ず両方を同時に更新すること。

   ★ 役割の別（推し店から継承）
      --accent       … 白文字が載る塗り面（白との比 4.50 ＝ AA）
      --accent-text  … 文字・アイコン・リンク（地との比 4.5 以上）
      --accent-brand … 非テキスト専用のブランド識別色（罫線・装飾のみ。文字に使わない）
      --surface2     … --surface より1段明るい／暗い面

   ★ 実測コントラスト（scratchpad/contrast.py・全てAA 4.5以上）
      ライト: --accent #7A5B15 対 白 6.30 ／ --accent-text #6E5313 対 --bg 6.40・対 --surface 6.86
              --label #14120F 対 --bg 16.58 ／ --accent-soft #FAF6EC に #6E5313 = 6.69
      ダーク: --accent-text #D8B658 対 --surface 9.42・対 --bg 10.07
              --label #F5F2EC 対 --surface 16.47 ／ --accent-soft #221D12 に #D8B658 = 8.58
      --accent-brand #C9A227 は対 --bg 2.14（ライト）＝ AA未達。**非テキスト用途のみ**。 */
:root {
    color-scheme: light;

    /* ブランド（ゴールド） */
    --accent: #7A5B15;
    --accent-text: #6E5313;
    --on-accent: #FFFFFF;
    --accent-brand: #C9A227;
    --accent-soft: #FAF6EC;

    /* ニュートラル（ライト＝生成りのアイボリー。純白を使わず紙の質感に寄せる） */
    --bg: #F4F1EA;
    --surface: #FBF9F5;
    --surface2: #F3EFE6;
    --label: #14120F;
    --secondary-label: rgba(28, 24, 18, 0.62);
    /* --label-soft … 説明文用。--secondary-label より本文色に寄せた中間の濃さ */
    --label-soft: rgba(20, 18, 15, 0.86);
    --tertiary-label: rgba(28, 24, 18, 0.34);
    --separator: rgba(28, 24, 18, 0.16);
    --fill: rgba(122, 91, 21, 0.10);

    /* セマンティック（--live はロゴのピンクではなく深いボルドー＝非テキスト用途） */
    --live: #A8323F;
    --success: #2E7D5B;
    --warning: #B5811F;
    --danger: #A8323F;
    --danger-fill: #8E2733;

    /* 広告（両テーマでAA担保） */
    --ad-label: rgba(28, 24, 18, 0.72);
    --ad-label-border: rgba(28, 24, 18, 0.45);
    --ad-canvas: #FBF9F5;
    --on-ad-canvas: #14120F;

    /* 重ね表示 */
    --scrim: rgba(11, 11, 12, 0.55);
    --shadow-sheet: 0 -8px 48px rgba(11, 11, 12, 0.28);

    /* 形状・余白（角丸をほぼ捨てて直線基調にする＝高級誌の版面に寄せる） */
    --radius-card: 2px;
    --radius-thumb: 2px;
    --radius-sheet: 2px;
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-6: 24px;
    --space-8: 32px;

    /* タイポグラフィ
       --font-body   … 本文（Noto Sans JP の細め）
       --font-serif  … 見出し・店名・リード（Shippori Mincho B1 ＝ 高級感の要）
       --font-latin  … 価格・評価・英字ラベル（Noto Serif JP） */
    --font-body: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Sans", sans-serif;
    --font-serif: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
    /* ★2026-08-17 14:3x JST ユーザー指摘「数字が見にくい」→ Cormorant Garamond から変更。
       Cormorant は x-height が低く線が細いため、黒地の小さい数字が沈んでいた。
       Noto Serif JP は線幅が均一で数字がはっきり読め、日本語と同じ設計なので混在しても大きさが揃う。
       ★実装は Web フォントをセルフホストする（fonts-premium.css）。Noto Serif JP は
         **latin / latin-ext サブセットのみ**を持ち、日本語グリフは次点の Shippori Mincho B1 が描く
         ＝Cormorant Garamond のときと同じ構成（mock-premium/css/tokens.css:79 と同値）。 */
    --font-latin: "Noto Serif JP", "Shippori Mincho B1", "Hiragino Mincho ProN", serif;

    /* プレミアム固有（premium.css が参照） */
    --hairline: rgba(122, 91, 21, 0.28);
    --hairline-strong: rgba(122, 91, 21, 0.55);
    --gold-gradient: linear-gradient(100deg, #9A7A2C 0%, #C9A227 42%, #EBD9A0 58%, #C9A227 78%, #8A6A24 100%);
    --tracking-wide: 0.12em;
    --tracking-title: 0.04em;
}

/* 【D1】OSダーク かつ ユーザーが明示ライトを選んでいない（JS無効環境の保険） */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;
        --accent: #7A5B15;
        --accent-text: #D8B658;
        --on-accent: #FFFFFF;
        --accent-brand: #C9A227;
        --accent-soft: #221D12;
        --bg: #0B0B0C;
        --surface: #141416;
        --surface2: #1C1C1F;
        --label: #F5F2EC;
        --secondary-label: rgba(240, 236, 228, 0.60);
        --label-soft: rgba(245, 242, 236, 0.86);
        --tertiary-label: rgba(240, 236, 228, 0.34);
        --separator: rgba(201, 162, 39, 0.20);
        --fill: rgba(201, 162, 39, 0.12);
        --live: #C4485A;
        --success: #4FA37C;
        --warning: #D8B658;
        --danger: #C4485A;
        --danger-fill: #8E2733;
        --ad-label: rgba(240, 236, 228, 0.72);
        --ad-label-border: rgba(240, 236, 228, 0.45);
        --ad-canvas: #141416;
        --on-ad-canvas: #F5F2EC;
        --scrim: rgba(0, 0, 0, 0.72);
        --shadow-sheet: 0 -8px 48px rgba(0, 0, 0, 0.75);
        --hairline: rgba(201, 162, 39, 0.26);
        --hairline-strong: rgba(201, 162, 39, 0.60);
    }
}

/* 【D2】手動ダーク ★【D1】より後に書く（詳細度が同じ (0,2,0) なので後勝ち） */
:root[data-theme="dark"] {
    color-scheme: dark;
    --accent: #7A5B15;
    --accent-text: #D8B658;
    --on-accent: #FFFFFF;
    --accent-brand: #C9A227;
    --accent-soft: #221D12;
    --bg: #0B0B0C;
    --surface: #141416;
    --surface2: #1C1C1F;
    --label: #F5F2EC;
    --secondary-label: rgba(240, 236, 228, 0.60);
    --label-soft: rgba(245, 242, 236, 0.86);
    --tertiary-label: rgba(240, 236, 228, 0.34);
    --separator: rgba(201, 162, 39, 0.20);
    --fill: rgba(201, 162, 39, 0.12);
    --live: #C4485A;
    --success: #4FA37C;
    --warning: #D8B658;
    --danger: #C4485A;
    --danger-fill: #8E2733;
    --ad-label: rgba(240, 236, 228, 0.72);
    --ad-label-border: rgba(240, 236, 228, 0.45);
    --ad-canvas: #141416;
    --on-ad-canvas: #F5F2EC;
    --scrim: rgba(0, 0, 0, 0.72);
    --shadow-sheet: 0 -8px 48px rgba(0, 0, 0, 0.75);
    --hairline: rgba(201, 162, 39, 0.26);
    --hairline-strong: rgba(201, 162, 39, 0.60);
}
