/* 公開記事のSNS共有。色に加えてアイコンとサービス名で操作を識別する。 */
.article-share { margin-block: 1.25rem; max-width: 100%; font-size: .875rem; color: inherit; }
.article-share__label { display: block; margin-bottom: .5rem; font-weight: 700; }
.article-share__buttons { display: flex; flex-wrap: wrap; gap: .5rem; }
.article-share .article-share__button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 44px; padding: .55rem .8rem; border: 1px solid currentColor; border-radius: .65rem; font: inherit; font-weight: 700; line-height: 1.4; text-decoration: none; cursor: pointer; background: transparent; color: inherit; }
.article-share .article-share__button--x { color: #fff; background: #171717; border-color: #171717; }
.article-share .article-share__button--facebook { color: #fff; background: #185abd; border-color: #185abd; }
.article-share .article-share__button--instagram { color: #fff; background: #983168; border-color: #983168; }
.article-share__button svg { flex: none; }
.article-share .article-share__button:hover { filter: brightness(1.15); }
.article-share :is(a, button, textarea):focus-visible { outline: 3px solid #1262a8; outline-offset: 3px; box-shadow: 0 0 0 6px #fff; }
.article-share__button:disabled { cursor: wait; opacity: .7; }
.article-share__copy { margin-top: .75rem; padding: .85rem; border: 1px solid currentColor; border-radius: .65rem; }
.article-share__copy[hidden] { display: none; }
.article-share__copy p { margin: 0 0 .5rem; }
.article-share__copy-label { display: block; font-weight: 700; }
.article-share__copy textarea { display: block; box-sizing: border-box; width: 100%; max-width: 100%; margin-block: .4rem .6rem; padding: .65rem; font: inherit; line-height: 1.5; color: inherit; background: transparent; border: 1px solid currentColor; border-radius: .35rem; resize: vertical; }
.article-share__copy a { color: inherit; text-decoration: underline; }
.article-share__status { margin: .6rem 0 0; overflow-wrap: anywhere; }
.article-share__status:empty { display: none; }
@media (max-width: 360px) { .article-share .article-share__button { padding-inline: .6rem; } }
@media print { .article-share { display: none !important; } }

.article-share__button--rss { background: #a63d00; color: #fff; }