/* 文章下方「分享」與「留言」區塊（搭配 /assets/engage.js） */
.engage { margin-top: 56px; }
.engage h2 { font-size: 19px; margin: 0 0 12px; padding-top: 16px; border-top: 1px solid #e6e6e6; }
.engage-share { margin-bottom: 48px; }
.engage-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.engage-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border-radius: 8px; border: 1px solid #d6d6d6; background: #ffffff; color: #232323; font: inherit; font-size: 14px; line-height: 1; text-decoration: none; cursor: pointer; }
.engage-btn:hover { background: #f5f5f5; }
.engage-btn:focus-visible, .engage-form input:focus-visible, .engage-form textarea:focus-visible { outline: 2px solid #232323; outline-offset: 2px; }
.engage-primary { background: #232323; border-color: #232323; color: #ffffff; }
.engage-primary:hover { background: #000000; }
.engage-btn:disabled { opacity: .55; cursor: default; }
.engage-list { list-style: none; margin: 0 0 24px; padding: 0; }
.engage-item { padding: 16px 0; border-bottom: 1px solid #efefef; }
.engage-item.is-owner { background: #f7f5f0; padding: 16px 14px; border-radius: 8px; border-bottom: 0; margin: 8px 0; }
.engage-item.is-new { animation: engage-in .6s ease; }
@keyframes engage-in { from { background: #fff7d6; } to { background: transparent; } }
.engage-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 14px; }
.engage-head time { font-size: 12px; color: #6b6b6b; }
.engage-badge { font-size: 11px; background: #232323; color: #ffffff; border-radius: 4px; padding: 1px 6px; }
.engage-text { margin: 6px 0 0; font-size: 15px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.engage-empty { font-size: 14px; color: #6b6b6b; margin: 0 0 24px; }
.engage-form { display: flex; flex-direction: column; gap: 14px; }
.engage-field { display: flex; flex-direction: column; gap: 6px; }
.engage-field label { font-size: 13px; font-weight: 600; display: flex; justify-content: space-between; }
.engage-count { font-weight: 400; color: #6b6b6b; font-variant-numeric: tabular-nums; }
.engage-form input, .engage-form textarea { font: inherit; font-size: 16px; color: #232323; background: #ffffff; border: 1px solid #cfcfcf; border-radius: 8px; padding: 10px 12px; width: 100%; }
.engage-form textarea { resize: vertical; min-height: 110px; line-height: 1.6; }
.engage-form .engage-btn { align-self: flex-start; }
.engage-note { font-size: 12px; color: #6b6b6b; margin: 0; line-height: 1.6; }
.engage-msg { font-size: 14px; margin: 0; min-height: 1.4em; }
.engage-msg.is-ok { color: #1f6b3a; }
.engage-msg.is-err { color: #a12a1b; }
.engage-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
[hidden] { display: none !important; }
