/* Site-wide visual refresh layered over the preserved Cocoon markup.
   Markup, URLs, heading ids and ad containers are untouched; only presentation changes. */
:root{
 --sg-ink:#1d1b22;--sg-sub:#55505e;--sg-muted:#6d6777;--sg-line:#e6e3ea;
 --sg-page:#f2f1f5;--sg-panel:#fff;--sg-night:#050506;--sg-night-2:#15151c;--sg-night-line:#26262f;
 --sg-accent:#b3173d;--sg-accent-ink:#8f1231;--sg-accent-soft:#fbeef1;
 --sg-radius:16px;--sg-radius-s:10px;
 --sg-font:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Noto Sans CJK JP","Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
}
body.body{background:var(--sg-page);color:var(--sg-ink);font-family:var(--sg-font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.body a{color:inherit}
body.body ::selection{background:#f3c9d4}
body.body a:focus-visible,body.body button:focus-visible,body.body input:focus-visible{outline:3px solid var(--sg-accent);outline-offset:3px}

/* Header: compact dark bar, logo cropped to its lettering, menu beside it on wide screens. */
body.body .header-container{background:var(--sg-night);border-bottom:1px solid var(--sg-night-line);box-shadow:none}
body.body .header-container-in{display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:1256px;margin:0 auto;padding:0 24px;box-sizing:border-box}
body.body .header{background:none;min-height:0;height:auto;flex:0 0 auto}
body.body .header-in{display:block;width:auto;min-height:0;height:auto;padding:0;margin:0}
body.body .logo-header{display:block;margin:0;padding:12px 0;text-align:left}
body.body .logo-header .site-name{display:block;margin:0;padding:0;line-height:0;vertical-align:top}
body.body .logo-header .site-name-text{--logo-h:50px;display:block;width:calc(var(--logo-h)*3.95);height:var(--logo-h);overflow:hidden;line-height:0}
body.body .logo-header img.site-logo-image{display:block;width:calc(var(--logo-h)*4.92)!important;height:auto!important;max-width:none;margin:calc(var(--logo-h)*-.377) 0 0 calc(var(--logo-h)*-.623);filter:contrast(1.25);mix-blend-mode:screen}
body.body .navi{background:none;flex:1 1 auto;min-width:0}
body.body #navi .navi-in{width:auto;max-width:none;margin:0;padding:0}
body.body #navi .navi-in>ul.menu-mobile{display:none}
body.body #navi .navi-in>ul.menu-pc{display:flex;justify-content:flex-end;flex-wrap:nowrap;gap:4px;height:auto;margin:0;padding:0}
body.body #navi .navi-in>ul>li{float:none;width:auto;height:auto;min-width:0;list-style:none;border:0;line-height:1}
body.body #navi .navi-in>ul>li>a{width:auto;display:flex;align-items:center;height:40px;padding:0 16px;border-radius:999px;color:#e9e7ee;font-size:15px;font-weight:600;letter-spacing:.04em;text-decoration:none;background:transparent;transition:background-color .15s,color .15s}
body.body #navi .navi-in>ul>li>a:hover,body.body #navi .navi-in>ul>li.current-menu-item>a,body.body #navi .navi-in>ul>li.current-post-ancestor>a,body.body #navi .navi-in>ul>li.current-menu-parent>a{background:rgba(255,255,255,.1);color:#fff}
body.body #navi .navi-in .caption-wrap{display:block;line-height:1.2}
body.body #navi .navi-in .item-label{white-space:nowrap}
@media screen and (max-width:1023px){
 body.body .header-container-in{flex-direction:column;align-items:stretch;gap:0;padding:0}
 body.body .logo-header{padding:10px 16px 6px;text-align:center}
 body.body .logo-header .site-name{display:inline-block}
 body.body .logo-header .site-name-text{--logo-h:42px}
 body.body #navi .navi-in>ul.menu-pc{display:none}
 body.body #navi .navi-in>ul.menu-mobile{display:flex;flex-wrap:nowrap;height:auto;margin:0;justify-content:center;gap:2px;padding:2px 8px 8px;overflow-x:auto;scrollbar-width:none}
 body.body #navi .navi-in>ul::-webkit-scrollbar{display:none}
 body.body #navi .navi-in>ul>li{flex:0 0 auto}
 body.body #navi .navi-in>ul>li>a{height:36px;padding:0 14px;font-size:14px}
}

/* Page frame: soft background, borderless rounded panels. */
body.body .content{margin-top:24px}
body.body .main,body.body .sidebar{background:var(--sg-panel);border:0;border-radius:var(--sg-radius);box-shadow:0 1px 2px rgba(20,16,30,.04),0 8px 24px rgba(20,16,30,.05)}
body.body .main{padding:32px 36px}
body.body .sidebar{padding:24px 20px}
/* Listing cards sit directly on the page background: no white frame between header and cards. */
body.body main.news-listing-page{background:transparent;box-shadow:none;padding:22px}
body.body .content-top,body.body .content-bottom{background:none}
/* The banner ad rows above/below the content keep their slot, but take no space
   until AdSense actually fills them (ads are off today, which left a blank gap). */
body.body :is(.content-top,.content-bottom):not(:has(ins[data-ad-status="filled"])):not(:has(:not(.content-top-in,.content-bottom-in,.widget,.textwidget,ins.adsbygoogle))),
body.body :is(.content-top,.content-bottom):not(:has(ins[data-ad-status="filled"])) .widget:not(:has(:not(.textwidget,ins.adsbygoogle))){margin:0}
@media screen and (max-width:1023px){
 body.body .content{margin-top:12px}
 body.body .main{margin:0 10px;padding:22px 16px;border-radius:14px}
 /* Listing keeps the approved 177px card column at 390px: 6+6 frame on each side, 12px gap. */
 body.body main.news-listing-page{margin:0 6px;padding:0 6px 12px}
 body.body .sidebar{margin:12px 10px 0;border-radius:14px}
}

/* Archive & search headings. */
body.body .archive-title{font-size:24px;font-weight:800;line-height:1.5;letter-spacing:.02em;margin:0 0 20px;padding:0;border:0}
body.body .archive-title .fa{color:var(--sg-accent);margin-right:6px}

/* Article header. */
body.body .article .entry-title{padding:0;font-size:28px;font-weight:800;line-height:1.55;letter-spacing:.01em;margin:6px 0 18px;color:var(--sg-ink)}
body.body .article-header .eye-catch{border-radius:var(--sg-radius-s);overflow:hidden}
body.body .article-header .eye-catch img{display:block;width:100%}
body.body .eye-catch .cat-label,body.body .cat-label{border:0;border-radius:999px;background:rgba(14,14,20,.72);color:#fff;font-size:12px;padding:3px 10px;top:10px;left:10px}
body.body .pr-label{display:inline-block;margin:0 0 6px;padding:3px 10px;border:0;border-radius:6px;background:#f1eff4;color:var(--sg-muted);font-size:12px;line-height:1.6}
body.body .date-tags{color:var(--sg-muted);font-size:13px}

/* Article body typography. In-article headings keep the original light-gray Cocoon style (owner choice 2026-10-11). */
body.body .entry-content{font-size:17px;line-height:1.95;letter-spacing:.02em;color:#26232c}
body.body .entry-content a{color:var(--sg-accent-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
body.body .entry-content a:hover{color:var(--sg-accent)}
body.body .entry-content a.a-wrap,body.body .entry-content .widget-entry-cards a,body.body .entry-content a.blogcard-wrap{color:inherit;text-decoration:none}
body.body .article blockquote{margin:1.6em 0;padding:16px 20px;border:0;border-left:4px solid #d9d4e0;border-radius:0 var(--sg-radius-s) var(--sg-radius-s) 0;background:#f6f5f8;color:var(--sg-sub)}
body.body .article blockquote::before,body.body .article blockquote::after{display:none}
body.body .entry-content img{border-radius:6px}
body.body .entry-content figcaption{color:var(--sg-muted);font-size:13px}
body.body .article table{border-collapse:collapse;border-radius:var(--sg-radius-s);font-size:15px}
body.body .article th,body.body .article td{border:1px solid var(--sg-line);padding:10px 12px}
body.body .article thead th,body.body .article tr:first-child th{background:#f4f2f7}
body.body .article .speech-balloon{border-radius:14px}

/* In-article "人気記事" and table of contents. */
body.body .popular-list-box,body.body .toc,body.body #toc_container{border:0;border-radius:var(--sg-radius-s);background:#f7f6f9;padding:16px 18px}
body.body .toc-title,body.body #toc_container .toc_title{font-weight:700;color:var(--sg-ink)}

/* Sidebar widgets. */
body.body .sidebar h3,body.body .widget-sidebar-title{margin:0 0 14px;padding:0 0 10px;border:0;border-bottom:2px solid var(--sg-ink);background:none;color:var(--sg-ink);font-size:17px;font-weight:800;letter-spacing:.04em}
body.body .sidebar h3::before,body.body .sidebar h3::after{display:none}
body.body .widget-entry-cards .a-wrap,body.body .widget-entry-cards .widget-entry-card-link{margin:0;padding:10px 6px;border:0;border-radius:var(--sg-radius-s);box-shadow:none;background:none;transition:background-color .15s}
body.body .widget-entry-cards .a-wrap:hover{background:#f5f3f8;transform:none;box-shadow:none}
body.body .widget-entry-cards .widget-entry-card,body.body .widget-entry-cards .e-card{border:0;box-shadow:none;background:none}
body.body .widget-entry-card-thumb img,body.body .popular-entry-card-thumb img{border-radius:8px}
body.body .widget-entry-card-title,body.body .popular-entry-card-title{font-size:14px;font-weight:600;line-height:1.6;color:var(--sg-ink)}
body.body .author-box{border:0;border-radius:var(--sg-radius-s);background:#f7f6f9}

/* Ad slots keep their containers; only the label is quieter. */
body.body .ad-label{color:var(--sg-muted);font-size:11px;letter-spacing:.12em}

/* Related articles, prev/next, breadcrumb. */
body.body .related-entry-heading,body.body .comment-title,body.body .comment-reply-title{margin:2em 0 14px;padding:0 0 10px;border:0;border-bottom:2px solid var(--sg-ink);background:none;color:var(--sg-ink);font-size:20px;font-weight:800}
body.body .related-entry-heading::before,body.body .related-entry-heading::after,body.body .comment-title::before,body.body .comment-title::after{display:none}
body.body .related-list .a-wrap,body.body .pager-post-navi a{border:0;border-radius:var(--sg-radius-s);box-shadow:none;background:none;transition:background-color .15s}
body.body .related-list .a-wrap:hover,body.body .pager-post-navi a:hover{background:#f5f3f8;transform:none;box-shadow:none}
body.body .related-entry-card,body.body .pager-post-navi .card-thumb{border:0;box-shadow:none}
body.body .related-entry-card-thumb img,body.body .pager-post-navi img{border-radius:8px}
body.body .related-entry-card-title{font-size:16px;font-weight:700;line-height:1.6}
body.body .related-entry-card-snippet{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;color:var(--sg-muted);font-size:13px;line-height:1.7}
body.body .related-list .a-wrap{margin-bottom:6px;padding:10px}
body.body .pager-post-navi{border-top:1px solid var(--sg-line);padding-top:12px}
body.body .breadcrumb{color:var(--sg-muted);font-size:13px}
body.body .breadcrumb a{color:var(--sg-sub)}
body.body .entry-categories-tags a,body.body .cat-link,body.body .tag-link{display:inline-block;border:0;border-radius:999px;background:#f1eff4;color:var(--sg-sub);font-size:13px;padding:4px 12px;text-decoration:none}
body.body .entry-categories-tags a:hover{background:var(--sg-accent-soft);color:var(--sg-accent-ink)}

/* Comments & forms. */
body.body .comment-body{border:0;border-bottom:1px solid var(--sg-line);padding:14px 0}
body.body .comment-form input[type=text],body.body .comment-form textarea,body.body .search-form input,body.body .wpcf7 input:not([type=submit]),body.body .wpcf7 textarea{border:1px solid #d6d2dc;border-radius:10px;background:#fff;padding:10px 12px}
body.body .comment-form input[type=submit],body.body .comment-form button,body.body .search-form button,body.body .wpcf7 input[type=submit]{border:0;border-radius:999px;background:var(--sg-night-2);color:#fff;font-weight:700;padding:10px 24px;cursor:pointer}
body.body .comment-form input[type=submit]:hover,body.body .comment-form button:hover,body.body .search-form button:hover{background:var(--sg-accent)}

/* Pagination. */
body.body .pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
body.body .pagination .page-numbers{margin:0;box-sizing:border-box;border:0;border-radius:999px;background:#f1eff4;color:var(--sg-ink);min-width:42px;height:42px;line-height:42px;padding:0 6px;font-weight:600}
body.body .pagination .page-numbers.current,body.body .pagination .page-numbers[aria-current]{background:var(--sg-night-2);color:#fff}
body.body .pagination .page-numbers:hover{background:var(--sg-accent-soft);color:var(--sg-accent-ink)}
body.body .pagination-next-link{border:0;border-radius:999px;background:var(--sg-night-2);color:#fff;font-weight:700;letter-spacing:.06em;text-decoration:none}
body.body .pagination-next-link:hover{background:var(--sg-accent);color:#fff}

/* Listing pages load the lightbox script without its stylesheet; keep its closed overlay hidden. */
#baguetteBox-overlay{display:none}

/* Footer: same dark band as the header. */
body.body .footer{margin-top:40px;background:var(--sg-night);color:#a9a5b1;border-top:1px solid var(--sg-night-line)}
body.body .footer-in{padding:28px 20px 24px}
body.body .footer-bottom{margin-top:0}
body.body .footer a{color:#dedbe4}
body.body .footer a:hover{color:#fff}
body.body .footer-bottom-logo .logo-footer img{max-height:48px;width:auto;filter:contrast(1.25);mix-blend-mode:screen}
body.body .navi-footer-in>.menu-footer li{border:0}
body.body .navi-footer-in>.menu-footer li a{font-size:13px;padding:4px 10px}
body.body .copyright{color:#86828f;font-size:12px}

/* Mobile footer buttons: frosted dark bar with a clear tap state. */
body.body .mobile-menu-buttons{background:rgba(11,11,16,.92);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-top:1px solid var(--sg-night-line);box-shadow:none;height:auto;padding-bottom:env(safe-area-inset-bottom)}
body.body .mobile-menu-buttons .menu-button{background:none;color:#e9e7ee}
body.body .mobile-menu-buttons .menu-button>a{background:none}
body.body .mobile-menu-buttons .menu-button>a,body.body .mobile-menu-buttons .menu-button .menu-icon,body.body .mobile-menu-buttons .menu-button .menu-caption{color:#e9e7ee}
body.body .mobile-menu-buttons .menu-button:active{background:rgba(255,255,255,.08)}
body.body .mobile-menu-buttons .menu-caption{font-size:10px;opacity:.85}
body.body .go-to-top-button{border:0;border-radius:999px;background:var(--sg-night-2);color:#fff;box-shadow:0 4px 14px rgba(0,0,0,.2)}

@media screen and (max-width:600px){
 body.body .article .entry-title{font-size:22px;line-height:1.55;margin:4px 0 14px}
 body.body .entry-content{font-size:16px;line-height:1.9}
 body.body .archive-title{font-size:20px}
 body.body .pagination .page-numbers{min-width:36px;height:36px;line-height:36px}
}
@media (prefers-reduced-motion:reduce){body.body *{transition:none!important}}
/* Native disclosure controls preserve the Cocoon panels and tap appearance. */
body.body button.site-menu-control{font:inherit;color:inherit;background:transparent;border:0;cursor:pointer;padding:0}
body.body :is(a,button,input,textarea,select):focus-visible{outline:3px solid var(--sg-accent);outline-offset:3px}
body.body .unavailable-reference{padding:12px 16px;border-left:3px solid #91869f;background:#f7f6f9;color:#514b5a;font-size:14px}
body.body .affiliate-link-inactive{cursor:default;text-decoration:none}
body.body .affiliate-link-inactive.btn{background:#595959;box-shadow:none;pointer-events:none}
@media(prefers-reduced-motion:reduce){body.body *,body.body *::before,body.body *::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}