/* =========================
   Modern CSS Reset (JP)
   - ベースは一般的な modern-normalize/Andy Bell/Josh Comeau の良い所取り
   - 余白0 / 枠計算 / タイポ / 画像 / フォーム / メディア / アクセシビリティ
   ========================= */

/* 1) すべての要素を border-box に */

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* 2) 既定の余白をリセット */

* {
  margin: 0;
  padding: 0;
}

/* 3) 高さ100%のベース */

html,
body {
  height: 100%;
}

/* 4) 文字系の初期化 */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  line-height: 1.5;
  tab-size: 2;
  scroll-behavior: smooth;
  /* 好みで off にしてOK */
}

body {
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Meiryo',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  color: #111;
  background: #fff;
}

/* 5) 画像・SVG・動画・キャンバスなどはコンテナ幅にフィット */

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  max-width: 100%;
}

/* 6) 画像の高さ自動、ぼやけ防止 */

img {
  height: auto;
}

/* 7) 見出しは継承させつつ太字を維持（必要に応じて上書き） */

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: inherit;
  font-size: inherit;
}

/* 8) リストのマーカーをデフォルト非表示（必要時 .list で上書き） */

ul[role='list'],
ol[role='list'],
ul,
ol {
  list-style: none;
}

/* 9) a要素のデフォルト装飾を整える */

a {
  color: inherit;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* 10) ボタンやフォームはフォントとサイズを継承 */

input,
button,
textarea,
select {
  font: inherit;
  color: inherit;
  background: transparent;
  border: 1px solid transparent;
}

button,
label {
  cursor: pointer;
}

button:disabled,
input:disabled {
  cursor: not-allowed;
}

/* 11) テキストエリアのリサイズは縦のみ（お好みで） */

textarea {
  resize: vertical;
}

/* 12) フォームの自動補完色の強制着色を抑える（WebKit） */

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px inset #fff;
  -webkit-text-fill-color: inherit;
}

/* 13) テーブルはボーダーの重なりを整理 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* 14) 小要素のデフォルト太字を解除（用途により） */

strong,
b {
  font-weight: 700;
}

/* 15) サマリー/ディテールの開閉の初期化 */

details {
  display: block;
}

summary {
  cursor: pointer;
  list-style: none;
}

/* 16) モーション軽減設定の尊重 */

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* 17) ルートに安全なデフォルトフォーカスリング */

:focus-visible {
  outline: 2px solid #6aa8ff;
  outline-offset: 2px;
}

/* 18) ルートのコンテナクエリを有効化（将来拡張） */

:root {
  container-type: inline-size;
}

/* --- 必要ならユーティリティ --- */

/* 可読な段落間余白（リセットではなく推奨） */

/* p + p { margin-top: 1em; } */

/* コンテナ中央寄せのベース */

/* .container { width: min(1200px, 92%); margin-inline: auto; } */