/* Approved article detail design, shared by editorial detail pages and isolated from CMS editing/search. */
.public-article-refresh .home-header { border-bottom: 1px solid var(--line); }
.public-article-refresh .public-article-page { padding: 14px 0 60px !important; }
.public-article-refresh .public-breadcrumb { margin-bottom: 22px; color: var(--muted); font-size: 11px; }
.public-article-refresh .public-breadcrumb a { color: var(--red); }
.public-article-refresh .public-article-layout { grid-template-columns: minmax(0,740px) minmax(240px,1fr); gap: 48px; }
.public-article-refresh .public-article-main { padding: 0; border: 0; border-radius: 0; box-shadow: none; }
.public-article-refresh .public-article-head { padding: 0; border: 0; }
.public-article-refresh .public-category-label { padding: 3px 13px; color: #a73830; background: #ffe9e4; font-size: 12px; }
.public-article-refresh .public-article-head h1 { margin: 12px 0 16px; font-size: clamp(23px,3vw,34px); line-height: 1.55; letter-spacing: -.025em; overflow-wrap: anywhere; }
.public-article-refresh .public-article-meta { display: flex; align-items: center; gap: 4px 14px; color: #74767b; font-size: 11px; line-height: 1.7; }
.public-article-refresh .article-byline { display: inline-flex; align-items: center; gap: 7px; color: var(--ink); font-weight: 700; }
.public-article-refresh .article-byline img { width: 32px; height: 32px; object-fit: contain; }
.public-article-refresh .public-article-meta > a { flex-basis: 100%; color: #697382; text-decoration: underline; text-underline-offset: 3px; }
.public-article-refresh .public-article-image { margin: 20px 0 16px; border-radius: 12px; overflow: hidden; background: #fff8ef; }
.public-article-refresh .public-article-image img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; object-fit: contain; }
.public-article-refresh .public-article-summary { margin: 0 0 24px; padding: 0 0 0 13px; border-left: 3px solid #e8d6aa; color: #56606d; font-size: 14px; line-height: 1.9; }
.public-article-refresh .public-toc-mobile { margin: 20px 0 0; padding: 15px 16px; border: 1px solid #eddfc9; border-radius: 12px; background: #fff9e9; scroll-margin-top: 16px; }
.public-article-refresh .public-toc-mobile summary { min-height: 24px; color: var(--ink); font-size: 14px; }
.public-article-refresh .public-toc-mobile a { padding-block: 12px; color: var(--ink); font-size: 13px; }
.public-article-refresh .public-toc-mobile .level-3 a { font-size: 12px; }
.public-article-refresh .article-v2-body { padding-top: 16px; color: #283141; font-family: 'Yu Gothic',Meiryo,system-ui,sans-serif; font-size: 16px; line-height: 2; overflow-wrap: anywhere; }
.public-article-refresh .article-v2-body > p:first-child { margin-top: 0; }
.public-article-refresh .article-v2-body p { margin-block: 1.5em; }
.public-article-refresh .article-v2-body h2 { margin: 2.4em 0 1em; padding: 15px 15px 15px 17px; border: 0; border-left: 4px solid #d65047; border-radius: 0 9px 9px 0; color: var(--ink); background: #fff3ef; font-size: 21px; line-height: 1.7; scroll-margin-top: 20px; }
.public-article-refresh .article-v2-body h3 { margin-top: 2em; padding-bottom: 10px; border-bottom: 2px solid #f4d785; color: var(--ink); font-size: 18px; line-height: 1.7; scroll-margin-top: 20px; }
.public-article-refresh .article-v2-body a { color: #aa332d; text-decoration: underline; text-underline-offset: 4px; }
.public-article-refresh .article-v2-body img { max-width: 100%; height: auto; margin: 24px auto; border-radius: 10px; }

.public-article-refresh .article-v2-body table { display: block; max-width: 100%; width: 100%; margin: 24px 0; overflow-x: auto; font-size: 13px; line-height: 1.7; border-collapse: collapse; }
.public-article-refresh .article-v2-body th { color: var(--ink); background: #fff5dc; }
.public-article-refresh .article-v2-body :is(th,td) { padding: 12px; border-color: #e2e5e8; white-space: nowrap; }
.public-article-refresh .article-back-link { display: flex; justify-content: center; align-items: center; min-height: 48px; margin-top: 40px; border: 1px solid #e8d0cb; border-radius: 24px; color: var(--red); font-size: 14px; font-weight: 700; }
.public-article-refresh .public-article-sidebar { position: sticky; top: 24px; display: grid; gap: 16px; }
.public-article-refresh .public-side-card { padding: 22px; border: 1px solid #eee8e1; border-radius: 14px; background: #fffaf1; box-shadow: none; }
.public-article-refresh .public-side-card > span { color: #a8553a; font-size: 10px; }
.public-article-refresh .public-side-card h2 { margin: 5px 0 14px; color: var(--ink); font-size: 17px; }
.public-article-refresh .public-toc li { border-color: #e9e1d5; }
.public-article-refresh .public-toc a { display: block; padding-block: 10px; color: #454e5e; line-height: 1.8; }
.public-article-refresh .article-author-art { display: block; width: 64px; height: 64px; margin: 10px auto; object-fit: contain; mix-blend-mode: multiply; }
.public-article-refresh .public-author-card strong { display: block; color: var(--ink); text-align: center; }
.public-article-refresh .public-author-card p { color: #66707d; text-align: center; line-height: 1.9; }
.public-article-refresh .public-side-links a { color: #485160; border-color: #e9e1d5; }
@media(max-width:980px) {
  .public-article-refresh .public-article-layout { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .public-article-refresh .public-article-shell { width: min(720px,calc(100% - 32px)); }
  .public-article-refresh .public-article-sidebar { position: static; display: block; }
  .public-article-refresh .public-toc { display: none; }
  .public-article-refresh .public-toc-mobile { display: block; }
  .public-article-refresh .public-author-card { margin-top: 20px; }
}
@media(max-width:500px) {
  .public-article-refresh .public-article-page { padding-top: 10px !important; }
  .public-article-refresh .public-breadcrumb { margin-bottom: 18px; }
  .public-article-refresh .public-article-head h1 { margin: 10px 0 12px; font-size: 23px; line-height: 1.6; }
  .public-article-refresh .public-article-meta { gap: 4px 10px; }
  .public-article-refresh .public-article-image { margin-top: 16px; }
  .public-article-refresh .public-article-summary { font-size: 13px; line-height: 1.9; margin-bottom: 20px; }
  .public-article-refresh .article-v2-body h2 { font-size: 20px; }
}
.public-page-refresh .public-article-shell { width: min(880px, calc(100% - 32px)); }
