/* スクリーンショットは枠を付けて本文と区別する */
.md-typeset img { border: 1px solid #d0d4dc; border-radius: 4px; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.md-typeset img.narrow { max-width: 360px; }
/* 案内のカード（index） */
.guide-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.guide-cards a { display: block; padding: 1rem 1.2rem; border: 1px solid #d0d4dc; border-radius: 6px; text-decoration: none; color: inherit; }
.guide-cards a:hover { border-color: #3f51b5; }
.guide-cards a strong { display: block; font-size: 1.1rem; margin-bottom: .3rem; }
.guide-cards > p { display: contents; }
/* 節見出し（h2）は帯にする。長いページで節の切れ目が本文に埋もれるので、
   テーマの主色（indigo）の帯と白い文字で区切りを立てる。色は Material の
   変数から取り、昼夜どちらの配色でも同じ見え方にする。 */
.md-typeset h2 {
  background: var(--md-primary-fg-color);
  color: var(--md-primary-bg-color);
  padding: .45em .8em;
  border-radius: 4px;
  margin-top: 2.2em;
}
.md-typeset h2 code { color: inherit; background: rgba(255,255,255,.18); }
.md-typeset h2 .headerlink { color: var(--md-primary-bg-color); opacity: .7; }
