/* 共通リセット（実サイトのスタイルは astroworks.css / astronote.css に記述）。
   両サイトで必ず同じものだけを置く。配色・書体・レイアウト思想は意図的に共通化しない（design_handoff README.md 1章） */

/* --- 横スクロール封じ（両サイト必須。SPEC 5章「既知の設計上の注意」） --- */
html {
  overflow-x: clip;
}

body.aw-body,
body.an-body {
  margin: 0;
  overflow-x: clip;
  font-feature-settings: 'palt' 1;
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* --- 親SWELLのラッパー由来の余白を消す --- */
body.aw-body #content,
body.an-body #content,
body.aw-body #main,
body.an-body #main {
  margin: 0;
  padding: 0;
  max-width: none;
}

/* 要素リセット（.aw / .an 配下のみ）。すべて :where() で詳細度(0,0,1)以下に抑える。
   .aw p{margin:0} のように書くと(0,1,1)になり単一クラスのコンポーネント指定(0,1,0)に勝って margin やボタン文字色が消えるため、必ず :where() で書くこと */
:where(.aw, .an),
:where(.aw, .an) * {
  box-sizing: border-box;
}

:where(.aw, .an) a {
  text-decoration: none;
  color: inherit;
}

:where(.aw, .an) img {
  max-width: 100%;
  height: auto;
  display: block;
}

:where(.aw, .an) :where(h1, h2, h3, h4, h5, p, ul, ol, figure, dl, dd) {
  margin: 0;
}

:where(.aw, .an) :where(ul, ol) {
  list-style: none;
  padding: 0;
}

:where(.aw, .an) button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

:where(.aw, .an) :where(input, textarea, select) {
  font: inherit;
  color: inherit;
}

/* --- 日本語タイポグラフィの基本（README 3章 共通の実装ルール 1） --- */
.aw, .an {
  word-break: normal;
  overflow-wrap: anywhere;
}

:where(.aw, .an) :where(h1, h2, h3) {
  text-wrap: balance;
}

:where(.aw, .an) p {
  text-wrap: pretty;
}

/* --- フォーカスリング（キーボード操作の可視化。README 3章 5） --- */
.aw a:focus-visible,
.aw button:focus-visible,
.aw input:focus-visible,
.an a:focus-visible,
.an button:focus-visible,
.an input:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* 親SWELLに svg:not([fill]){fill:currentcolor}(詳細度0,1,1) があり、子テーマの fill:none(0,1,0) では勝てず装飾SVGが塗り潰される。
   <svg fill="none"> を付けるか、子要素(polygon等)にも直接 fill:none を指定すること */

/* --- スクリーンリーダー専用テキスト --- */
.astro-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* prefers-reduced-motion:reduce で全アニメーション停止（README 3章7 / IMPLEMENTATION_GUIDE 6章の必須要件。JS側もmatchMediaでrAFループを止めること） */
@media (prefers-reduced-motion: reduce) {
  .aw *,
  .an *,
  .aw *::before,
  .an *::before,
  .aw *::after,
  .an *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}