/* End of article, 2026-11-05: share row, previous/next, reactions, comments (includes/sf-article-end.php, comments.php).
   Navy #192f65, gold #f8c623, ink #1d2230, rule #e6e8ee. Square edges, no pills. Body text follows HQ sizes. */
.sfae-label { margin: 0 0 12px; font-size: 16px; font-weight: 700; line-height: 1.4; color: #1d2230; letter-spacing: .02em; }

/* share */
.share-single { float: none !important; width: auto !important; }
.sfae-share { margin: 28px 0 0; padding: 20px 0 0; border-top: 1px solid #e6e8ee; }
.sfae-share-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.sfae-share-list li { margin: 0; padding: 0; list-style: none; }
.sfae-sbtn { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; box-sizing: border-box;
	font: inherit; font-size: 15px; line-height: 1; color: #192f65; background: #fff; border: 1px solid #c9d0dc; border-radius: 0;
	text-decoration: none !important; cursor: pointer; }
.sfae-sbtn:hover { color: #fff; background: #192f65; border-color: #192f65; }
.sfae-sbtn:focus-visible { outline: 3px solid #f8c623; outline-offset: 2px; }
.sfae-sbtn svg { flex: none; }
.sfae-copied { min-height: 1.4em; margin: 6px 0 0; font-size: 14px; color: #192f65; }

/* previous / next */
.sfae-pn { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 18px 0 0; border-top: 1px solid #e6e8ee; border-bottom: 1px solid #e6e8ee; }
.sfae-pn a { display: block; padding: 16px 0; color: #1d2230; text-decoration: none; }
.sfae-pn-prev { padding-right: 20px !important; }
.sfae-pn-next { padding-left: 20px !important; border-left: 1px solid #e6e8ee; text-align: right; }
.sfae-pn-empty + .sfae-pn-next { border-left: 0; }
.sfae-pn-l { display: block; margin: 0 0 6px; font-size: 14px; font-weight: 700; color: #192f65; }
.sfae-pn-t { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 17px; font-weight: 500; line-height: 1.55; }
.sfae-pn a:hover .sfae-pn-t { color: #192f65; text-decoration: underline; text-underline-offset: 4px; }
.sfae-pn a:focus-visible { outline: 3px solid #f8c623; outline-offset: -3px; }

/* reactions */
.sfae-react { margin: 28px 0 8px; }
.sfae-react-list { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.sfae-react-list li { margin: 0; padding: 0; list-style: none; }
.sfae-rbtn { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 100%; padding: 12px 4px 10px; box-sizing: border-box;
	font: inherit; color: #1d2230; background: #fff; border: 1px solid #d5dae3; border-radius: 0; cursor: pointer; }
.sfae-rbtn:hover:not(:disabled) { border-color: #192f65; background: #f6f8fc; }
.sfae-rbtn:focus-visible { outline: 3px solid #f8c623; outline-offset: 2px; }
.sfae-rbtn:disabled { cursor: default; }
.sfae-rbtn.is-on { border: 2px solid #192f65; padding: 11px 3px 9px; background: #fff8dc; }
.sfae-emo { font-size: 28px; line-height: 1.1; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; }
.sfae-rl { font-size: 15px; font-weight: 700; line-height: 1.3; }
.sfae-rn { font-size: 14px; line-height: 1.2; color: #5c6372; font-variant-numeric: tabular-nums; }
.sfae-react-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; margin: 12px 0 0; font-size: 15px; color: #5c6372; }
.sfae-total { color: #192f65; }
.sfae-tocomments { color: #192f65 !important; font-weight: 700; text-decoration: none; }
.sfae-tocomments:hover { text-decoration: underline; text-underline-offset: 3px; }

/* comments */
.commentary .block_title { display: none; }
.sfae-cmt { margin: 36px 0 12px; padding: 14px 0 0; border-top: 3px solid #192f65; }
.sfae-cmt-h { display: flex; align-items: baseline; gap: 10px; margin: 0 0 16px; padding: 0;
	font-family: "Noto Serif TC", "Songti TC", "PMingLiU", serif; font-size: 24px; font-weight: 700; line-height: 1.3; color: #192f65; }
.sfae-cmt-n { font-family: inherit; font-size: 16px; font-weight: 700; color: #fff; background: #192f65; padding: 1px 8px; line-height: 1.5; }
.sfae-cmt .comment-respond { margin: 0; padding: 18px 20px 20px; background: #f6f8fc; border: 1px solid #e6e8ee; }
.sfae-cmt .comment-reply-title { margin: 0 0 6px; }
.sfae-cmt-note, .sfae-cmt-who { margin: 0 0 14px; font-size: 15px; line-height: 1.6; color: #4b5260; }
.sfae-cmt-who span { margin: 0 8px; color: #9aa1ad; }
.sfae-cmt-who a { color: #192f65; }
.sfae-cmt-form p { margin: 0; }
.sfae-cmt-field { margin: 0 0 12px !important; }
.sfae-cmt-field label { display: block; margin: 0 0 6px; font-size: 15px; font-weight: 700; color: #1d2230; }
.sfae-cmt-form textarea#blog_audience, .sfae-cmt-form input#author {
	display: block; width: 100% !important; max-width: none; box-sizing: border-box; margin: 0; padding: 10px 12px;
	font: inherit; font-size: 17px; line-height: 1.6; color: #1d2230; background: #fff; border: 1px solid #b9c1cf; border-radius: 0; box-shadow: none; }
.sfae-cmt-form textarea#blog_audience { min-height: 130px; resize: vertical; }
.sfae-cmt-form input#author { max-width: 320px; height: 44px; }
.sfae-cmt-form textarea#blog_audience:focus, .sfae-cmt-form input#author:focus { outline: 3px solid #f8c623; outline-offset: 0; border-color: #192f65; }
.sfae-cmt-meta { display: flex; justify-content: space-between; gap: 12px; margin: -4px 0 14px !important; font-size: 14px; line-height: 1.5; color: #5c6372; }
.sfae-cmt-count { flex: none; font-variant-numeric: tabular-nums; }
.sfae-cmt-count.is-over { color: #b4232a; font-weight: 700; }
.sfae-cmt-actions { display: flex; justify-content: flex-end; margin: 4px 0 0 !important; }
.sfae-cmt-submit { height: 44px; padding: 0 26px; font: inherit; font-size: 16px; font-weight: 700; color: #fff; background: #192f65;
	border: 0; border-radius: 0; cursor: pointer; float: none !important; }
.sfae-cmt-submit:hover { background: #10224d; }
.sfae-cmt-submit:focus-visible { outline: 3px solid #f8c623; outline-offset: 2px; }
.sfae-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

/* back link (replaces the yellow 返回上一頁 button) */
.sfae-back { margin: 20px 0 8px; font-size: 15px; }
.sfae-back a { color: #192f65; text-decoration: none; }
.sfae-back a:hover { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 800px) {
	.sfae-react-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.sfae-pn { grid-template-columns: 1fr; }
	.sfae-pn-prev { padding-right: 0 !important; }
	.sfae-pn-next { padding-left: 0 !important; border-left: 0; border-top: 1px solid #e6e8ee; text-align: left; }
	.sfae-sbtn span { display: none; }
	.sfae-sbtn { width: 44px; height: 44px; padding: 0; justify-content: center; }
	.sfae-cmt .comment-respond { padding: 16px 14px; }
	.sfae-cmt-h { font-size: 22px; }
	.sfae-cmt-meta { flex-direction: column; gap: 2px; }
	.sfae-cmt-submit { width: 100%; }
}
.sfae-opt { font-weight: 400; color: #5c6372; }
/* the theme's old comment-form rules (#commentArea .submit etc.) win on specificity; restate the button and spacing */
#commentArea .sfae-cmt-form .sfae-cmt-submit, #commentArea #submit.sfae-cmt-submit { height: 44px !important; padding: 0 26px !important; font-size: 16px !important; font-weight: 700 !important;
	line-height: 44px !important; color: #fff !important; background: #192f65 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#commentArea .sfae-cmt-form .sfae-cmt-submit:hover { background: #10224d !important; }
.sfae-cmt-note + .sfae-cmt-field, .sfae-cmt-form .sfae-hp + .sfae-cmt-field { margin-top: 4px !important; }
.sfae-cmt-note { margin-bottom: 18px !important; }
@media (max-width: 800px) { #commentArea .sfae-cmt-form .sfae-cmt-submit { width: 100% !important; } }