main.blog-detail-page { width: min(100% - 32px, 820px); }
.blog-detail-page h1 { overflow-wrap: anywhere; font-size: clamp(24px, 4vw, 34px); }
.blog-byline { font-size: 12px; color: #697b70; }
.blog-body { display: block; overflow-wrap: anywhere; line-height: 1.9; }
.blog-body > h2 { margin: 32px 0 14px; padding-bottom: 9px; border-bottom: 2px solid #d9eadd; font-size: 23px; white-space: pre-wrap; line-height: 1.6; }
.blog-body > p { margin: 16px 0; white-space: pre-wrap; }
.blog-body a { color: #20734e; text-decoration: underline; text-underline-offset: 3px; }
.blog-body > figure { display: block; clear: both; width: 100%; margin: 24px 0; }
.blog-body img { display: block; width: auto; max-width: 100%; height: auto; margin: auto; border-radius: 8px; }
.blog-body figcaption { margin-top: 8px; color: #697b70; font-size: 12px; text-align: center; white-space: pre-wrap; }
.blog-likes { margin: 16px 0 24px; }
.blog-likes form { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.blog-like-button { display: inline-flex; gap: 8px; align-items: center; min-height: 44px; padding: 8px 18px; border: 1px solid #b6cbbc; border-radius: 24px; background: white; color: #20734e; font: inherit; cursor: pointer; }
.blog-like-button[aria-pressed="true"] { color: #ac365b; background: #fff0f5; border-color: #e5a8bc; }
.blog-like-button:disabled { opacity: .6; cursor: wait; }
.blog-likes p { margin: 8px 0 0; font-size: 14px; }
.blog-likes p:empty { display: none; }
.blog-card { display: flex; flex-direction: column; }
.blog-card > .coupon-card-link { flex: 1; height: auto; }
.blog-card > .blog-likes { margin: 0; padding: 0 3px 6px; }
.blog-card .blog-like-button { min-height: 28px; gap: 4px; padding: 2px 8px; font-size: 12px; line-height: 1.4; }
.blog-card .blog-likes p, .blog-card .blog-likes > a { font-size: 12px; overflow-wrap: anywhere; }