/* =============================================================================
   とここと手帳 — Design Tokens
   Base: 三沢小公式HP（misawa-tokokoto.com / STUDIO製）の世界観
   - 白とうすいグレーの地、#333333 の細枠カード、ほぼ直角の角
   - 字間ひろめのゴシック、黒い角ボタン、銀杏イエローのアクセント
   ========================================================================== */

/* ---- 見出し・ロゴ用の手書き風フォント（自ホスト）---------------------------
   りいクッキー R（作者: あおいりい / 商用web可・クレジット不要）。公式HPの見出しと同じ字面。
   ★ フルセット(約1.5MB・8,207字)をそのまま置いている。サブセットにしないこと。
     手帳は「校長のひとこと」や各スポット名を /admin/edit/ から KV 経由で"ビルドせずに"
     書き換えられる（functions/api/overrides.js）。どの字が出るか事前に分からないので、
     サブセットにすると現場が字を足した瞬間、その字だけ Noto Sans JP に落ちて字面が割れる。
   ★ 一部の字しか入っていない配布物（無料版・旧サブセット）に差し替えないこと。
     正本は misawa-observation/public/assets/fonts/RiiCookieR.woff2（同じ 8,207 字）。 */
@font-face {
  font-family: "Rii Cookie";
  /* ?v= はフォントを差し替えたとき必ず上げる（_headers で /assets/* は max-age=86400） */
  src: url("/assets/fonts/RiiCookieR.woff2?v=20260822a") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;   /* 読み込み中は Noto Sans JP で表示 → 差し替え（本文を待たせない） */
}

:root {
  /* Ink & paper */
  --ink:          #333333;   /* 公式HPの基本色。真っ黒(#000/#1a1a1a)は使わない */
  --ink-soft:     #3c3c3a;
  --paper:        #ffffff;
  --bg-app:       #f1f0ec;   /* 公式HPのうすグレー地 */
  --bg-subtle:    #f7f6f3;
  --bg-neutral:   #efeeea;

  /* Ginkgo（公式ロゴの銀杏イエロー） */
  --ginkgo:       #f0b71f;
  --ginkgo-deep:  #c6920e;
  --ginkgo-soft:  #fbedc4;
  --ginkgo-wash:  #fdf6e0;

  /* Semantic */
  --text-primary:   var(--ink);
  --text-secondary: #55544f;
  --text-tertiary:  #8b897f;
  --text-disabled:  #b4b2a8;
  --text-link:      var(--ink);
  --text-ondark:    #f6f4ee;

  --border-strong:  var(--ink);          /* カードの黒細枠 */
  --border-default: #d9d7d0;
  --border-subtle:  #e7e5de;

  --good:    #2c7a3f;
  --good-bg: #eaf4ec;
  --warn:    #b06000;
  --warn-bg: var(--ginkgo-wash);
  --risk:    #c0392b;
  --risk-bg: #faeceb;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  /* Radius — 公式HPは直角寄り */
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-full: 999px;

  /* Shadow — 基本なし。hover時だけわずかに */
  --shadow-hover: 0 6px 16px rgba(26,26,26,.10);

  /* Typography
     公式HP（misawa-tokokoto.com / info.）準拠。正本は misawa-observation の tokens.css。
       本文     = Noto Sans JP（Google Fonts）
       見出し・ロゴ = Rii Cookie（りいクッキー R / 自ホスト。上の @font-face）
     公式HPで Zen Kaku Gothic New を使っているのは「大型ボタンの文字」だけで、
     見出しには使っていない。手帳には大型ボタンが無いので読み込んでいない。 */
  --font-body: "Noto Sans JP", system-ui, -apple-system, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --font-logo: "Rii Cookie", var(--font-body);
  --ls-wide: .08em;
  --ls-mid:  .04em;

  --fs-h1: 22px;
  --fs-h2: 18px;
  --fs-h3: 16px;
  --fs-body-lg: 16px;
  --fs-body: 15px;
  --fs-sm: 13px;
  --fs-caption: 12px;
  --fs-micro: 11px;

  --lh-body: 1.9;
  --lh-heading: 1.5;

  /* Layout */
  --container: 720px;
  --z-header: 100;
  --ease: cubic-bezier(.4,0,.2,1);
  --dur: .16s;
}

.num { font-variant-numeric: tabular-nums; }

/* =============================================================================
   AIミニ校長 で足したぶん
   - 手帳のトークンはそのまま使う（色・字面・角の丸みを変えない）
   - ここで足すのは「講座」という手帳に無い概念のための最小限だけ
   ========================================================================== */
:root {
  /* 講座の色分け。彩度は抑え、見出しの帯とアイコンにだけ使う（塗りつぶさない） */
  --lv-free:  #2c7a3f;   /* 0→1（無料） */
  --lv-1:     #557fb6;   /* 材料 */
  --lv-2:     #b97b18;   /* 自動化 */
  --lv-3:     #8063a7;   /* 守る */
  --lv-4:     #b05f4c;   /* 安全 */

  --slide-max: 760px;    /* スライド1枚の横幅。読み切れる長さで止める */
}