/* 挿絵（figure要素の画像）を画面幅の40%で中央表示 */
.md-content figure {
  margin: 2em auto;
  text-align: center;
}

.md-content figure img {
  width: 40vw;
  max-width: 500px;     /* 大画面でも巨大にならない上限 */
  min-width: 200px;     /* 極端に小さくならない下限 */
  height: auto;
}

/* モバイル（600px以下）では少し大きめに */
@media (max-width: 600px) {
  .md-content figure img {
    width: 70vw;
    max-width: none;
  }
}

/* 講師ポートレート用（円形・中サイズ） */
.md-content img.portrait {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  object-fit: cover;
  margin: 1em 0;
  display: block;
}

/* ダークモード時、挿絵（figure内のSVG/GIF）を反転して見やすく
   黒い線画 → くすんだ白（本文の文字色に近いトーン）になり目に優しい
   .portrait（実写）はfigure内に無いので影響しない
   - invert(1): 黒↔白を反転
   - brightness(0.7): 真っ白を 70% に落として文字色のトーンに近づける
   - hue-rotate(180deg): 色相補正（モノクロには無影響、念のため） */
[data-md-color-scheme="slate"] .md-content figure img {
  filter: invert(1) brightness(0.7) hue-rotate(180deg);
}