@charset "UTF-8";
:root{--ink:#2d3339;--muted:#74706b;--paper:#fcfaf6;--line:#e8e1d7;--red:#b13c3b;--green:#287568;--accent:#e7773d}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:75px}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;font-size:15px;line-height:1.75;letter-spacing:.015em;font-feature-settings:"palt" 0;line-break:strict;word-break:normal;overflow-wrap:anywhere;-webkit-text-size-adjust:100%;text-size-adjust:100%}a{color:inherit}p{margin:0 0 13px}h1,h2,h3{line-height:1.42;letter-spacing:-.025em;overflow-wrap:normal;word-break:normal}strong{font-weight:750}.negative{color:var(--red)}.positive{color:var(--green)}.site-header{background:rgba(252,250,246,.97);border-bottom:1px solid var(--line)}.header-inner{max-width:720px;margin:auto;min-height:61px;padding:9px 18px;display:flex;justify-content:space-between;align-items:center;gap:12px}.brand{font-size:14px;font-weight:800;text-decoration:none;line-height:1.4}.brand span{display:block;color:var(--muted);font-size:9px;font-weight:400;margin-top:3px}.header-link{font-size:12px;white-space:nowrap;text-decoration:none;color:#6b6257}.header-link span{margin-left:4px}main{max-width:720px;margin:auto;background:var(--paper)}.hero-content{padding:26px 18px 21px}.eyebrow,.section-kicker{font-size:10px;font-weight:750;letter-spacing:.12em;color:#8e765c}.dot{padding:0 4px}h1{font-size:clamp(24px,6.5vw,30px);font-weight:800;margin:11px 0 16px}h1 em{font-style:normal;display:block}.hero-lead{font-size:15px;line-height:1.78;margin:0}.hero-photo{height:clamp(175px,52vw,285px);background:linear-gradient(135deg,#c4b7a6,#776d66);position:relative}.photo-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;gap:3px;text-shadow:0 1px 4px #3338}.photo-placeholder span{font-size:11px;letter-spacing:.25em}.photo-placeholder small{font-size:11px}.content,.chapter,.closing,.affiliate{padding-left:18px;padding-right:18px}.intro{padding-top:25px;padding-bottom:16px}.intro p,.story-copy p,.closing p,.affiliate p{line-height:1.78}.insight{background:#f4ecdf;border-left:3px solid #c99b68;border-radius:3px;padding:14px 15px;margin:21px 0;font-size:14px;line-height:1.75}.toc{background:#f5f0e8;padding:27px 18px 29px;margin:19px 0 6px}.toc h2{font-size:20px;margin:5px 0 15px}.toc ol{padding:0;margin:0;list-style:none;border-top:1px solid #e2d9cc}.toc li{border-bottom:1px solid #e2d9cc}.toc a{display:flex;align-items:center;gap:11px;padding:12px 2px;text-decoration:none;font-size:13px;line-height:1.5}.toc a>span{font-family:Georgia,serif;color:#aa8b6b;font-size:15px}.toc a b{margin-left:auto;color:#9d8974;font-weight:400}.chapter{padding-top:45px;padding-bottom:4px}.chapter-label{font-family:Georgia,serif;font-size:12px;letter-spacing:.12em;color:#a08062;font-weight:bold}.chapter h2{font-size:22px;margin:8px 0 14px}.chapter-hook{font-size:16px;font-weight:750;line-height:1.65;margin:0 0 24px;padding:0 0 15px;border-bottom:1px solid var(--line)}.story-copy p{margin-bottom:15px}.next{display:flex;align-items:center;gap:8px;color:#8e6b50;text-decoration:none;font-size:12px;font-weight:700;margin:26px 0 0;padding:12px 0;border-top:1px solid var(--line)}.next span:first-child{color:#555;font-weight:400}.ad-slot{height:112px;background:#f1f5f5;border:1px dashed #cbd5d5;margin:37px 18px 4px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;color:#7b8a8e}.ad-slot span{font-size:10px;letter-spacing:.14em}.ad-slot small{font-size:11px}.closing{margin-top:45px;padding-top:34px;padding-bottom:28px;background:#f5efe5}.closing h2{font-size:22px;margin:8px 0 24px}.closing-emphasis{font-size:19px;font-weight:800;color:#73533a;margin:25px 0!important}.affiliate{padding-top:38px;padding-bottom:44px}.pr-label{display:inline-block;background:#eae4dc;color:#65594e;font-size:10px;padding:4px 9px;border-radius:3px;margin-bottom:20px}.affiliate h2{font-size:21px;margin:7px 0 17px}.offer{border:1px solid #e5d9c9;border-radius:9px;background:#fffdf9;padding:19px 15px;margin:24px 0 15px}.offer-label{font-size:10px;color:#91765d}.offer h3{font-size:18px;margin:5px 0 10px}.offer p{font-size:13px}.cta-disabled{display:block;background:#e7773d;color:#fff;text-align:center;font-size:14px;font-weight:750;padding:14px 8px;border-radius:6px;margin:17px 0 9px;opacity:.67;cursor:not-allowed}.offer small,.disclaimer{display:block;color:#756f68;font-size:11px;line-height:1.65}.footer{background:#eee9e1;border-top:1px solid #e1d9cf}.footer-inner{max-width:720px;margin:auto;padding:30px 18px}.footer strong{font-size:14px}.footer p{font-size:11px;color:#726c65;margin:3px 0 18px}.footer-links{display:flex;flex-wrap:wrap;gap:11px 18px;font-size:11px;margin-bottom:24px}.footer small{font-size:10px;color:#8b8277}a:focus-visible{outline:2px solid #9c6845;outline-offset:3px}@media(min-width:768px){body{background:#f0ede8}main{box-shadow:0 8px 32px #3d2d1910}.hero-content,.content,.chapter,.closing,.affiliate{padding-left:38px;padding-right:38px}.toc{padding-left:38px;padding-right:38px}.hero-photo{height:310px}.ad-slot{margin-left:38px;margin-right:38px}.header-inner,.footer-inner{padding-left:38px;padding-right:38px}}@media(max-width:350px){.hero-content,.content,.chapter,.closing,.affiliate{padding-left:16px;padding-right:16px}.chapter h2{font-size:20px}.hero-lead{font-size:14px}.toc{padding-left:16px;padding-right:16px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* V2: reader-first rhythm and nonintrusive advertising */
.reading-meta{font-size:11px;color:#77716b;margin:7px 0 0;line-height:1.5;font-variant-numeric:tabular-nums}
.hero-content{padding-top:20px;padding-bottom:19px}
.hero-content h1{margin-top:11px;margin-bottom:15px}
.hero-lead-centered{text-align:center;font-size:15px;line-height:1.85;letter-spacing:0;margin:0 auto;max-width:390px;font-weight:500;text-wrap:pretty}
.hero-lead-centered strong{font-weight:800}
.chapter{padding-top:37px}
.chapter-hook{margin-bottom:18px}
.ad-slot{height:96px;margin-top:27px;margin-bottom:0;background:#f4f5f3;border:1px dashed #d8dedb;color:#78817e}
.ad-slot-mid + .chapter{padding-top:36px}
.ad-slot-end{margin-top:30px;margin-bottom:32px}
.ad-slot-end + .affiliate{border-top:1px solid var(--line);padding-top:31px}
@media(max-width:350px){.hero-lead-centered{font-size:14px}}

/* V3: non-sticky header, accessible chapter menu, tighter mobile reading */
.site-header{position:static;z-index:auto}
.toc-toggle{appearance:none;border:0;background:transparent;color:#625b54;font:inherit;font-size:12px;font-weight:700;padding:10px 4px;min-height:44px;cursor:pointer;white-space:nowrap}
.toc-toggle span{margin-left:5px;font-size:15px}
.toc-toggle:focus-visible{outline:2px solid #9c6845;outline-offset:2px}
.header-toc{max-width:720px;margin:0 auto;background:#f5f0e8;border-bottom:1px solid #e2d9cc;padding:9px 18px 14px}
.header-toc[hidden]{display:none!important}
.header-toc ol{list-style:none;margin:0;padding:0}
.header-toc li+li{border-top:1px solid #e2d9cc}
.header-toc a{display:block;text-decoration:none;font-size:13px;line-height:1.5;padding:12px 3px}
.header-toc a:active,.header-toc a:hover{color:#9c6845}
.footer-links{margin-bottom:18px}
@media(min-width:768px){.header-toc{padding-left:38px;padding-right:38px}}

/* V4: approved candid family photo */
.hero-photo{margin:0;height:auto;aspect-ratio: 5 / 4;overflow:hidden;background:#e6ded2}
.hero-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 43%}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:768px){.hero-photo{aspect-ratio: 16 / 9}.hero-photo img{object-position:center 43%}}

/* V5: editorial readability and stronger, restrained emphasis */
html{scroll-padding-top:12px}
body{overflow-wrap:break-word;line-break:strict}
.story-copy p{line-height:1.86;margin-bottom:15px}
.story-copy strong{font-weight:750}
.chapter-hook{font-size:16px;line-height:1.7;text-wrap:pretty}
.chapter h2{text-wrap:pretty}
.chapter-insight{background:#f5efe5;border-left:3px solid #b59a7a;padding:13px 15px;margin:20px 0 12px;border-radius:2px}
.insight-label{display:block;color:#856b51;font-size:11px;font-weight:750;letter-spacing:.02em;margin-bottom:5px}
.chapter-insight p{margin:0;font-size:14px;line-height:1.75;font-weight:650}
.ad-slot[data-preview="true"]{height:72px;margin-top:23px;margin-bottom:4px;background:#f8f8f6;border-color:#e1e3e0}
.ad-slot[data-preview="true"] small{font-size:10px}
.ad-slot-end[data-preview="true"]{margin-top:23px;margin-bottom:20px}
@media(min-width:768px){.story-copy p{line-height:1.9}}

/* V6 — final typography specification: mobile-first, compact but legible */
:root{
 --reading-size:15px;
 --reading-line:1.82;
 --reading-space:13px;
 --article-side:18px;
}
body{
 font-size:var(--reading-size);
 line-height:var(--reading-line);
 letter-spacing:0;
 overflow-wrap:break-word;
 word-break:normal;
 line-break:strict;
 text-rendering:optimizeLegibility;
}
h1,h2,h3{
 line-break:strict;
 overflow-wrap:break-word;
 word-break:normal;
 text-wrap:pretty;
}
.hero-content{padding:19px var(--article-side) 19px}
.hero-content h1{font-size:clamp(23px,6.15vw,28px);line-height:1.42;letter-spacing:-.035em;margin:11px 0 14px}
.eyebrow,.section-kicker{letter-spacing:.08em}
.reading-meta{font-size:11px;line-height:1.55}
.hero-lead-centered{font-size:15px;line-height:1.75;max-width:390px}
.intro{padding-top:23px;padding-bottom:12px}
.intro p,.closing p,.affiliate p,.story-copy p{font-size:15px;line-height:var(--reading-line);margin-bottom:var(--reading-space)}
.story-copy p{margin-bottom:var(--reading-space)}
.chapter{padding-top:37px;padding-bottom:2px}
.chapter h2{font-size:clamp(20px,5.35vw,22px);line-height:1.45;letter-spacing:-.03em;margin:8px 0 13px}
.chapter-hook{font-size:16px;line-height:1.73;letter-spacing:0;margin-bottom:17px;padding-bottom:14px}
.chapter-hook strong{font-weight:800}
.focus-number{font-weight:800;color:#34363a;font-variant-numeric:tabular-nums}
.focus-negative{font-weight:800;color:var(--red)}
.focus-positive{font-weight:800;color:var(--green)}
.story-copy strong,.intro strong{font-weight:750}
.chapter-insight{margin:19px 0 13px;padding:12px 14px}
.chapter-insight p{font-size:14px;line-height:1.72;margin:0}
.toc{margin-top:16px;padding-top:24px;padding-bottom:24px}
.toc h2{font-size:19px}
.toc a{padding:11px 2px;font-size:13px}
.closing h2{font-size:clamp(20px,5.4vw,23px);line-height:1.5}
.affiliate h2{font-size:clamp(19px,5.25vw,22px);line-height:1.52}
.ad-slot[data-preview="true"]{height:66px;margin-top:22px;margin-bottom:3px}
.ad-slot[data-preview="true"] span{font-size:9px}
.ad-slot[data-preview="true"] small{font-size:10px}
@media(max-width:350px){
 :root{--article-side:16px}
 .hero-content h1{font-size:23px}
 .hero-lead-centered{font-size:14px}
 .chapter-hook{font-size:15px}
 .chapter h2{font-size:20px}
}
@media(min-width:768px){
 .hero-content{padding-left:38px;padding-right:38px}
 .chapter h2{font-size:23px}
 .story-copy p{line-height:1.86}
}

/* V7: animated overlay TOC; never pushes the article down */
.site-header{position:relative;z-index:40;isolation:isolate}
.header-inner{position:relative;z-index:2}
.toc-toggle{border-radius:6px;transition:background-color .2s ease,color .2s ease}
@media(hover:hover){.toc-toggle:hover{background:#eee8df;color:#7b563d}}
.toc-toggle[aria-expanded="true"]{color:#8c6245}
.header-toc{position:absolute;top:100%;left:50%;width:min(100%,720px);max-width:720px;z-index:50;max-height:min(70vh,620px);overflow-y:auto;overscroll-behavior:contain;margin:0;box-shadow:0 16px 36px #352b2426;border:1px solid #e2d9cc;border-top:0;border-radius:0 0 12px 12px;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,-9px);transition:opacity .22s ease,transform .22s ease,visibility .22s}
.header-toc[hidden]{display:block!important}
.header-toc.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.header-toc a{transition:background-color .18s ease,color .18s ease,padding-left .18s ease}
@media(hover:hover){.header-toc a:hover{background:#eee6dc;padding-left:10px}}
.toc-backdrop{position:fixed;inset:0;z-index:30;background:#1d1b192e;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,visibility .22s}
.toc-backdrop.is-open{opacity:1;visibility:visible;pointer-events:auto}
@media(prefers-reduced-motion:reduce){.header-toc,.toc-backdrop,.toc-toggle,.header-toc a{transition:none!important}}

/* V8: single editorial infographic in STORY 06 */
.story-infographic{margin:20px 0 22px;padding:0;background:#fffdf9;border:1px solid #e9e1d7;border-radius:8px;overflow:hidden}
.story-infographic img{display:block;width:100%;height:auto;aspect-ratio:1648/928;object-fit:contain}
.story-infographic figcaption{padding:8px 12px 12px;color:#746b62;font-size:11px;line-height:1.65;border-top:1px solid #f0e9e0}
@media(min-width:768px){.story-infographic{margin:24px 0 26px}}

.cta-link{opacity:1;cursor:pointer;text-decoration:none}.cta-link:hover,.cta-link:focus-visible{filter:brightness(.95)}
.cta-link{padding:17px 12px;font-size:16px;box-shadow:0 3px 0 #c45f27;border-radius:8px;margin:14px 0 14px}
.inline-pr{color:var(--accent);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.inline-pr-tag{font-size:11px;color:#756f68;margin-left:4px}
.offer{padding:17px 15px;margin:18px 0 12px;border-color:#e7c9a8}
.affiliate .pr-label{background:none;padding:0;border-radius:0;font-size:11px;color:#756f68;margin-bottom:12px}
.affiliate .disclaimer{font-size:11px;margin-top:0}
.pr-box{margin:34px 18px 0;padding:18px 16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pr-box p{font-size:14px;line-height:1.75;margin:0 0 10px}
.pr-box .pr-mark,.pr-box .pr-note{font-size:11px;color:#756f68}
.pr-box .pr-link{font-size:16px;font-weight:700;margin:6px 0 8px}
.pr-box .pr-link a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;display:inline-block;padding:6px 0}
.pr-box img{position:absolute;width:1px;height:1px}
@media(min-width:700px){.pr-box{margin-left:38px;margin-right:38px}}
