/* Article design from approved mock v4. U is one line of article body. */
.article-mock { --u:34px; --ink:#333; --rule:#dedede; color:var(--ink); }
.article-mock * { box-sizing:border-box; }
.article-mock .article-wrap { width:100%; max-width:1040px; margin:0 auto; padding:0 16px; }
.article-mock .article-layout { display:grid; grid-template-columns:minmax(0,640px) minmax(0,288px); gap:80px; align-items:start; }
.article-mock .article-breadcrumb { display:flex; gap:10px; align-items:center; padding:28px 0 40px; font-size:12px; line-height:1.6; color:#767676; }
.article-breadcrumb a { flex-shrink:0; color:inherit; text-decoration:none; }
.article-breadcrumb span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.article-mock .article-kickers { display:flex; gap:8px; margin-bottom:16px; }
.article-mock .article-kicker { padding:5px 10px; background:#333; color:#fff; font-size:11px; font-weight:500; line-height:1.5; letter-spacing:.02em; }
.article-mock .article-kicker.secondary { color:#555; background:transparent; }
.article-mock .article-title { font-size:32px; line-height:1.5; font-weight:700; letter-spacing:.02em; font-feature-settings:"palt"; margin:0 0 24px; }
.article-mock .article-byline { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:32px; }
.article-mock .article-byline-person { display:flex; align-items:center; gap:10px; min-width:0; }
.article-byline-person img { width:32px; height:32px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.article-mock .article-byline-name { font-size:11px; line-height:1.6; font-weight:500; }
.article-mock time { display:block; font-family:Montserrat,"Noto Sans JP",sans-serif; font-size:11px; line-height:1.7; color:#767676; letter-spacing:.02em; }
.article-mock .article-cover { display:block; width:100%; height:auto; margin-bottom:var(--u); }
.article-mock .article-lead { padding:var(--u); background:#f5f3f2; font-size:17px; line-height:2; letter-spacing:.02em; margin-bottom:calc(var(--u)*1.5); }
.article-lead p { margin:0; }
.article-mock .article-profile { margin-bottom:calc(var(--u)*2); padding-bottom:0; border:0; }
.article-mock .article-profile-label,.article-mock .article-section-label { display:block; font-family:Montserrat,"Noto Sans JP",sans-serif; font-size:10px; font-weight:600; letter-spacing:.1em; color:#767676; margin:0 0 16px; }
.article-profile-top { display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.article-profile-top img { width:80px; height:80px; border-radius:50%; object-fit:cover; }
.article-mock .article-profile-name { margin:0 0 6px; font-size:21px; line-height:1.5; font-weight:600; }
.article-mock .honorific { font-size:.72em; margin-left:.12em; }
.article-mock .article-profile-role { font-size:12px; line-height:1.8; }
.article-mock .article-profile-description { font-size:14px; line-height:1.8; letter-spacing:.02em; }
.article-profile-description p { margin:0 0 14px; }
.article-profile-description p:last-child { margin-bottom:0; }
.article-profile-description > p:last-of-type { margin-bottom:0; }
.article-mock .article-profile-description .prof-rich-text, .article-mock .article-profile-description .prof-rich-text p { font-size:14px; line-height:1.8; }
.article-mock .article-rich-text-block { color:#333; font-family:"Noto Sans JP",sans-serif; font-size:17px; font-weight:400; line-height:2; letter-spacing:.02em; font-feature-settings:normal; overflow-wrap:anywhere; }
.article-mock .article-rich-text-block::before,.article-mock .article-rich-text-block::after { display:none; }
.article-mock .article-rich-text-block>* { margin:0; }
.article-mock .article-rich-text-block p { margin:0 0 var(--u); font-size:inherit; line-height:inherit; }
.article-mock .article-rich-text-block p:empty { display:none; }
.article-mock .article-rich-text-block h2 { margin:calc(var(--u)*2) 0 calc(var(--u)*.5); padding-top:0; border:0; font-size:24px; line-height:1.5; font-weight:700; letter-spacing:.02em; font-feature-settings:"palt"; scroll-margin-top:32px; }
.article-mock .article-rich-text-block h3 { margin:calc(var(--u)*1.5) 0 calc(var(--u)*.5); font-size:19px; line-height:1.6; font-weight:700; letter-spacing:.02em; font-feature-settings:"palt"; }
.article-mock .article-rich-text-block figure { margin:calc(var(--u)*1.5) 0; width:auto!important; max-width:100%; }
.article-mock .article-rich-text-block img { max-width:100%; height:auto; display:block; }
.article-mock .article-rich-text-block figure img { width:100%; }
.article-mock .article-rich-text-block figcaption { font-size:13px; line-height:1.8; text-align:center; color:#767676; margin-top:12px; }
.article-mock .article-rich-text-block blockquote { margin:var(--u) 0; border:0; padding:0 0 0 var(--u); color:#555; font-size:inherit; line-height:inherit; }
.article-mock .article-rich-text-block ul,.article-mock .article-rich-text-block ol { margin:var(--u) 0; padding-left:1.5em; }
.article-mock .article-rich-text-block li { margin-bottom:calc(var(--u)*.25); }
.article-mock .article-rich-text-block a { color:inherit; text-decoration:underline; text-decoration-color:#767676; text-underline-offset:3px; }
.article-mock .article-rich-text-block .article-question { border:0; padding-left:0; font-weight:700; margin-top:calc(var(--u)*1.5); margin-bottom:var(--u); }
.article-mock .article-rich-text-block strong { font-weight:700; }
.article-mock .article-rich-text-block hr { display:none; border:0; }
.article-mock .article-rich-text-block table { width:100%; font-size:14px; }
.article-mock .article-rich-text-block td,.article-mock .article-rich-text-block th { border:0; padding:12px; }
.article-mock .article-share { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.article-share a,.article-share button { border:0; display:flex; justify-content:center; align-items:center; width:28px; height:32px; padding:2px; background:transparent; color:#333; cursor:pointer; text-decoration:none; }
.article-share svg { width:24px; height:24px; fill:currentColor; }
.article-share a:hover,.article-share button:hover { color:#000; }
.article-share :focus-visible { outline:1px solid #333; outline-offset:3px; }
.article-share .share-native { display:none; }
.article-share-status { position:absolute; font-size:11px; line-height:1.5; color:#555; transform:translateY(30px); }
.article-mock .article-end-share { margin:calc(var(--u)*2) 0 var(--u); padding:var(--u) 0; border-top:1px solid var(--rule); border-bottom:0; }
.article-mock .article-end-share h2 { margin:0 0 16px; font-size:14px; line-height:1.6; }
.article-end-share .article-share { gap:16px; }
.article-end-share .article-share a,.article-end-share .article-share button { width:40px; height:40px; }
.article-mock .article-author { padding:var(--u) 0; display:grid; grid-template-columns:64px minmax(0,1fr); gap:20px; }
.article-author>img { width:64px; height:64px; border-radius:50%; object-fit:cover; }
.article-mock .article-author h2 { margin:0 0 10px; font-size:14px; line-height:1.7; font-weight:600; }
.article-mock .article-author p { font-size:12px; line-height:1.9; margin:0; color:#555; }
.article-mock .article-author .article-section-label { margin-bottom:8px; }
.article-mock .article-toc-desktop { margin-bottom:0; }
.article-mock .article-sidebar { position:sticky; top:32px; padding-top:4px; max-height:calc(100vh - 64px); display:flex; flex-direction:column; }
.article-mock .article-sidebar-title { margin:0 0 20px; font-size:14px; font-weight:600; line-height:1.6; }
.article-mock .article-toc-desktop { min-height:80px; flex:0 1 auto; display:flex; flex-direction:column; }
.article-mock .article-toc-list { list-style:none; margin:0; padding:0; overflow:auto; min-height:0; }
.article-toc-list li { margin:0; }
.article-toc-list a { display:block; padding:8px 0 8px 16px; font-size:12px; line-height:1.7; color:#767676; border-left:1px solid var(--rule); text-decoration:none; }
.article-toc-list a.is-current { border-left:2px solid #333; padding-left:15px; font-weight:600; color:#333; }
.article-mock .article-recent { margin-top:calc(var(--u)*2); padding-top:0; border:0; flex-shrink:0; }
.article-mock .article-mini-card { display:grid; grid-template-columns:88px minmax(0,1fr); gap:12px; margin-bottom:20px; color:#333; text-decoration:none; }
.article-mini-card>img { width:88px; height:auto; aspect-ratio:16/9; object-fit:contain; }
.article-mock .article-mini-title { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-size:12px; font-weight:600; line-height:1.7; margin:0 0 6px; }
.article-mini-name { font-size:11px; line-height:1.6; }
.article-mini-role { color:#767676; font-size:10px; line-height:1.6; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.article-mini-card:hover .article-mini-title { text-decoration:underline; }
.article-mock .article-toc-mobile,.article-mock .article-recent-mobile { display:none; }
.article-mock .article-series { margin-top:calc(var(--u)*2); padding-top:0; border:0; }
.article-mock .article-series h2,.article-mock .article-related h2 { font-size:22px; line-height:1.5; margin:0 0 24px; }
.article-series .article-mini-card { grid-template-columns:160px minmax(0,1fr); gap:20px; margin-bottom:24px; }
.article-series .article-mini-card>img { width:160px; }
.article-series .article-mini-title { font-size:15px; }
.article-mock .article-all-interviews { display:inline-block; color:#333; font-size:12px; text-decoration:underline; text-underline-offset:6px; border:0; padding-bottom:6px; }
.article-mock .article-related { max-width:1272px; padding:0 16px; margin:80px auto; }
.article-mock .article-related-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; }
.article-mock .article-related-card { color:#333; text-decoration:none; }
.article-related-card img { width:100%; aspect-ratio:16/9; object-fit:contain; margin-bottom:16px; }
.article-related-card .article-card-category { color:#767676; font-size:10px; line-height:1.6; margin:0 0 8px; }
.article-mock .article-related-card .article-related-title { font-size:15px; line-height:1.7; font-weight:600; margin:0 0 12px; }
.article-related-card:hover .article-related-title { text-decoration:underline; }
.article-mock .cta-section-wrapper { margin-top:var(--u); }
@media(max-width:1099px) {
 .article-mock { --u:30.4px; }
 .article-mock .article-wrap { max-width:672px; }
 .article-mock .article-layout { display:block; }
 .article-mock .article-sidebar { display:none; }
 .article-mock .article-breadcrumb { padding-top:20px; padding-bottom:28px; gap:8px; font-size:11px; }
 .article-mock .article-title { font-size:22px; margin-bottom:20px; }
 .article-mock .article-byline { align-items:flex-start; margin-bottom:24px; gap:8px; }
 .article-mock .article-byline-name { font-size:10px; }
 .article-byline-person img { width:28px; height:28px; }
 .article-mock .article-byline time { font-size:10px; }
 .article-mock .article-lead,.article-mock .article-rich-text-block { font-size:16px; line-height:1.9; }
 .article-mock .article-lead { padding:var(--u); }
 .article-mock .article-profile-name { font-size:19px; }
 .article-profile-top img { width:64px; height:64px; }
 .article-mock .article-rich-text-block h2 { font-size:21px; }
 .article-mock .article-rich-text-block h3 { font-size:18px; }
 .article-mock .article-toc-mobile { display:block; margin-bottom:calc(var(--u)*1.5); padding:var(--u); border:0; background:#f5f3f2; }
 .article-toc-mobile summary { display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-size:13px; font-weight:600; list-style:none; }
 .article-toc-mobile summary::-webkit-details-marker { display:none; }
 .article-toc-mobile summary::after { content:'＋'; font-size:18px; font-weight:400; }
 .article-toc-mobile[open] summary::after { content:'−'; }
 .article-toc-mobile[open] .article-toc-list { padding-top:16px; }
 .article-mock .article-toc-mobile .article-toc-list a { font-size:13px; border:0; padding-left:0; }
 .article-mock .article-recent-mobile { display:block; margin-top:calc(var(--u)*2); }
 .article-mock .article-recent-mobile .article-mini-card { grid-template-columns:112px minmax(0,1fr); gap:16px; }
 .article-recent-mobile .article-mini-card>img { width:112px; }
 .article-mock .article-recent-mobile .article-mini-title { font-size:13px; }
 .article-mock .article-recent-mobile .article-sidebar-title { font-size:20px; margin-bottom:24px; }
 .article-mock .article-related { max-width:672px; margin:60px auto; }
 .article-mock .article-related-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px 16px; }
 .article-mock .article-related-card .article-related-title { font-size:13px; }
 .article-related-card img { margin-bottom:12px; }
 .article-mock .article-author { grid-template-columns:48px minmax(0,1fr); gap:16px; }
 .article-author>img { width:48px; height:48px; }
 .article-mock .article-series h2,.article-mock .article-related h2 { font-size:20px; }
 .article-series .article-mini-card { grid-template-columns:112px minmax(0,1fr); gap:16px; }
 .article-series .article-mini-card>img { width:112px; }
 .article-series .article-mini-title { font-size:13px; }
 .native-share .article-share .share-social { display:none; }
 .native-share .article-share .share-native { display:flex; }
 .article-share { gap:2px; }
 .article-share a,.article-share button { width:24px; height:28px; }
 .article-byline .article-share svg { width:20px; height:20px; }
}
.article-mock .article-rich-text-block iframe { max-width:100%; }

/* v3: prose flows without rules; metadata cards stay inside the reading column. */
.article-mock .article-layout { padding-top:48px; }
.article-mock .article-breadcrumb { padding:0; margin:calc(var(--u)*2) 0 0; }
.article-mock .article-afterword { --note-u:30px; background:transparent; padding:0; margin:calc(var(--u)*2) 0; color:#555; font-size:15px; line-height:2; }
.article-mock .article-afterword p { font-size:15px; line-height:2; margin-bottom:var(--note-u); }
.article-mock .article-afterword h2 { margin-top:0; padding-top:0; color:#333; }
.article-mock .article-afterword>:last-child { margin-bottom:0; }
.article-mock .article-embed-card { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr); gap:48px; align-items:center; padding:0; margin:calc(var(--u)*1.5) 0; background:transparent; border:0; text-decoration:none; color:#333; }
.article-mock .article-embed-card>img { width:100%; aspect-ratio:16/9; object-fit:cover; }
.article-embed-meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin-bottom:8px; }
.article-embed-meta>span { font-size:10px; color:#767676; line-height:1.5; }
.article-mock .article-embed-meta time { font-size:10px; }
.article-mock .article-rich-text-block .article-embed-title { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-size:14px; font-weight:600; line-height:1.7; margin:0; }
.article-mock .article-embed-card:hover .article-embed-title { text-decoration:underline; }
.article-mock .article-external-links { display:grid; gap:var(--u); margin:var(--u) 0; }
.article-mock .article-external-card { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr); align-items:center; gap:48px; background:transparent; padding:0; border:0; color:#333; text-decoration:none; }
.article-mock .article-external-card>img { width:100%; aspect-ratio:16/9; object-fit:cover; }
.article-external-site { display:block; margin-bottom:8px; font-size:10px; line-height:1.5; color:#767676; }
.article-mock .article-rich-text-block .article-external-title { margin:0 0 8px; font-size:14px; font-weight:600; line-height:1.7; }
.article-mock .article-rich-text-block .article-external-description { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; overflow:hidden; margin:0 0 12px; font-size:12px; line-height:1.8; color:#555; }
.article-external-domain { display:block; font-size:11px; line-height:1.6; color:#767676; }
.article-mock .article-external-fallback { display:grid; }
.article-external-card:hover .article-external-title,.article-external-card:hover .article-external-domain { text-decoration:underline; }
@media(max-width:1099px) {
 .article-mock .article-layout { padding-top:32px; }
 .article-mock .article-breadcrumb { padding:0; }
 .article-mock .article-embed-card { grid-template-columns:minmax(0,1fr); gap:24px; padding:0; }
 .article-mock .article-embed-card>img { width:100%; }
 .article-mock .article-rich-text-block .article-embed-title { font-size:12px; }
 .article-mock .article-external-card { grid-template-columns:minmax(0,1fr); padding:0; gap:24px; }
 .article-mock .article-external-card>img { width:100%; }
 .article-mock .article-afterword { --note-u:28.5px; line-height:1.9; }
 .article-mock .article-afterword p { line-height:1.9; }
 .article-mock .article-rich-text-block .article-external-title { font-size:13px; }
 .article-mock .article-external-fallback { display:grid; }
}
.article-mock .article-rich-text-block .article-embed-card,.article-mock .article-rich-text-block .article-external-card { text-decoration:none; }
.article-mock .article-profile-label { line-height:1.6; }

/* v4: the fallback surface is an image substitute, not a card background. */
.article-mock .article-external-placeholder { width:100%; aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; padding:16px; background:#f5f3f2; color:#555; font-family:Montserrat,"Noto Sans JP",sans-serif; font-size:20px; font-weight:500; overflow-wrap:anywhere; }
.article-mock .article-afterword p:last-child { margin-bottom:0; }

.article-mock>.article-recent-mobile { margin-bottom:60px; }
/* Core table styles can add a separate thead rule; article prose uses spacing instead. */
.article-mock .article-rich-text-block table,
.article-mock .article-rich-text-block thead,
.article-mock .article-rich-text-block tbody,
.article-mock .article-rich-text-block tfoot,
.article-mock .article-rich-text-block tr { border:0; }
