@charset "UTF-8";
/* ==========================================================================
   index-type.css — トップページの書体
   --------------------------------------------------------------------------
   和文 : Noto Serif JP（書き出しの既定のまま。題字は weight 200）
   欧文 : Sackers Gothic（英数字だけ）

   ★Sackers Gothic は Monotype の商用フォントで、Google Fonts には無い。
    ウェブフォントとして同梱できないため、ここでは font-family の指定だけを
    置き、実体は閲覧側にあるものを使う。

      1. Adobe Fonts（Creative Cloud）で有効化されていれば、それが出る
      2. 端末に入っていれば、それが出る
      3. どちらも無ければ Copperplate に落ちる
         — macOS / iOS に標準で入っている同系（エングレーバーズ・ゴシック）。
           iPhone がこのサイトの基準なので、実質ここが受け皿になる

    正規のウェブフォントを買って自前配信するなら、この 1 か所に
    @font-face を足すだけで済む。

   和文と欧文の切り替えは font-family の並び順で行う。
   欧文フォントに漢字が無いので、和文は自動的に次の Noto Serif JP に落ちる。
   unicode-range も JavaScript も要らない。
   ========================================================================== */

:root{
  --gago-latin:
    'Sackers Gothic Std', 'Sackers Gothic', 'SackersGothicStd-Light',
    Copperplate, 'Copperplate Gothic Light', 'Copperplate Gothic',
    'Engravers Gothic BT', ui-sans-serif, sans-serif;
}

/* --- 全体：欧文を先に、和文を後ろに --- */
body{
  font-family:
    'Sackers Gothic Std', 'Sackers Gothic', 'SackersGothicStd-Light',
    Copperplate, 'Copperplate Gothic Light', 'Copperplate Gothic',
    'Engravers Gothic BT',
    'Noto Serif JP', 'Yu Mincho', 'YuMincho', 'Hiragino Mincho ProN', serif !important;
}

/* --- 小さいラベル（書き出しは JetBrains Mono を直に指定している） ---
   MATERIALS / PRONUNCIATION / GAGO / SCROLL / 章番号 など。
   もともと text-transform:uppercase なので、大文字だけの
   Sackers Gothic とそのまま噛み合う。

   ただし拼音の枠（biàn / xiàng / tè）は除く。あそこは小文字と
   声調記号が意味を持つ。総大文字の書体に置き換えると読めなくなるので、
   等幅のまま残す。除外は overflow-x:auto を持つのがその枠だけ、という
   書き出し側の特徴を使っている。

   ★綴りを 2 通り書いているのは、拼音の枠が data-reveal を持つため。
    スクロール連動のスクリプトが el.style.opacity などを書くと、
    インライン style 全体が再文字列化されて `overflow-x:auto` が
    `overflow-x: auto`（空白入り）になる。片方だけだと実行後に外れる。
    data-reveal を持つ要素を [style*=…] で引っ掛けるときは常にこの点に注意 */
[style*="JetBrains Mono"]:not([style*="overflow-x:auto"]):not([style*="overflow-x: auto"]){
  font-family:var(--gago-latin) !important;
}

/* --- 明朝を直に指定している数字（教材の集計 4章 / 43節 / 87語 など） ---
   漢字はこの指定でも Noto Serif JP に落ちるので、数字だけが替わる */
[style*="font-family:'Noto Serif JP'"]{
  font-family:
    'Sackers Gothic Std', 'Sackers Gothic', 'SackersGothicStd-Light',
    Copperplate, 'Copperplate Gothic Light', 'Copperplate Gothic',
    'Engravers Gothic BT',
    'Noto Serif JP', 'Hiragino Mincho ProN', serif !important;
}
