/* 公開記事のSNS共有。色に加えてアイコンとサービス名で操作を識別する。 */
.article-share { margin-block: 1.25rem; max-width: 100%; font-size: .875rem; color: inherit; }
.article-share__label { display: block; margin-bottom: .5rem; color: var(--ink-soft); font-size: .75rem; 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 var(--line); border-radius: var(--radius-sm); font: inherit; font-weight: 700; line-height: 1.4; text-decoration: none; cursor: pointer; background: var(--paper); color: var(--ink-soft); }
.article-share__button--x svg { color: #171717; }
.article-share__button--facebook svg { color: #185abd; }
.article-share__button--instagram svg { color: #983168; }
.article-share__button svg { flex: none; }
.article-share .article-share__button:hover { color: var(--brand); border-color: var(--brand); background: var(--surface-soft); }
.article-share :is(a, button, textarea):focus-visible { outline: 3px solid var(--focus); 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: var(--radius-sm); }
.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: var(--radius-sm); 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; }