/* ── SNS シェアバー（macros/share.html + static/js/share.js）──
   全ページ共通。base.html でグローバル読み込み。アイコンは SVG スプライト（画像ファイルなし）。 */
.share-section { margin: 2rem auto; }
.share-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; max-width: 560px; margin: 1rem auto 0; }
.share-label { font-size: .8rem; font-weight: 700; color: var(--mute); margin-right: .1rem; }
.share-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; padding: 0; border: none; border-radius: 50%;
  cursor: pointer; text-decoration: none; color: #fff; background: var(--g);
  box-shadow: 0 2px 7px rgba(16,36,43,.16);
  transition: transform .13s ease, box-shadow .13s ease, filter .13s ease;
}
.share-btn .icon { width: 20px; height: 20px; }
.share-btn:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 6px 14px rgba(16,36,43,.26); filter: brightness(1.08); }
.share-btn:active { transform: translateY(0); }
.share-btn.is-x, .share-btn.is-threads { background: #000; }
.share-btn.is-line { background: #06c755; }
.share-btn.is-fb { background: #1877f2; }
.share-btn.is-native { background: var(--y-deep); }
.share-btn.is-copy { background: var(--mute); }
.share-btn.is-copy.is-done::after {
  content: "コピーしました"; position: absolute; bottom: calc(100% + 7px); left: 50%; transform: translateX(-50%);
  background: var(--ink); color: #fff; font-size: .68rem; font-weight: 700;
  padding: .22rem .55rem; border-radius: 7px; white-space: nowrap; pointer-events: none;
}
