@charset "UTF-8";
/* =============================================================================
   ナチュラル テーマ配色  ─ theme_movie.css（共通土台）の後に読み込む
   - 土台CSSは配色を持たず、構造側は --tm-theme / --tm-hero-bg 等のテーマ変数のみ参照。
   - このファイルは「アクセント色」と「ヒーロー背景」を確定するだけ。
   - HTML側：<div class="theme_movie theme_movie--detail theme_movie--natural"> と
     本CSSの <link> を追加する。
   - --tm-text-theme / --tm-bg-theme / --tm-border-theme は土台側で var(--tm-theme) に
     紐付け済みのため、ここで --tm-theme を上書きすれば見出し・ボタン・枠・ENが一括で変わる。
   ============================================================================= */
.theme_movie--natural {
  --tm-theme:      #78B992;   /* アクセント（見出し／ボタン／枠線／EN見出し） */
  --tm-hero-bg:    #F8FFF8;   /* ヒーローMV背景（ナチュラル） */
  --tm-theme-dark: color-mix(in srgb, var(--tm-theme) 82%, #000);  /* hover等の濃色 */
  --tm-theme-tint: color-mix(in srgb, var(--tm-theme) 14%, #fff);  /* 淡色背景 */
}