:root{--bg:#faf6f2;--ink:#38312f;--rose:#b0566e;--deep:#8e3e52;--gold:#d9c19a;--line:#e6d8d0;--muted:#655854}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans CJK JP","Hiragino Kaku Gothic ProN",sans-serif;font-size:16px;line-height:1.8;letter-spacing:.02em}
a{color:var(--deep);text-underline-offset:.2em;overflow-wrap:anywhere}a:hover{color:#652638}:focus-visible{outline:3px solid var(--deep);outline-offset:4px}
.wrap{width:min(100% - 40px,860px);margin-inline:auto}.brandbar{padding:18px 0;background:#fff;border-bottom:1px solid var(--line)}.brandbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{font-size:24px;font-weight:700;text-decoration:none}.brandbar span{color:var(--muted);font-size:16px}
.skip-link{position:absolute;top:-100px;left:18px;background:#fff;padding:12px;z-index:10}.skip-link:focus{top:12px}
.hero{padding:32px 0}.crumb{margin:0 0 16px;color:var(--muted);font-size:16px}.draft-label{display:inline-block;margin:0 0 14px;padding:4px 12px;background:#f4e7e9;border-radius:4px;font-size:16px;color:var(--deep)}
h1,h2{font-family:"Noto Serif CJK JP","Hiragino Mincho ProN",serif;font-weight:700;text-wrap:pretty}h1{font-size:clamp(27px,4vw,40px);line-height:1.55;margin:0 0 18px}h2{font-size:clamp(23px,3vw,29px);line-height:1.65;margin:0 0 22px;scroll-margin-top:24px}h3{font-size:18px;line-height:1.8;margin:0 0 8px;color:var(--deep)}p{margin:0 0 18px}.article-meta{color:var(--muted);font-size:16px}.lead{font-size:18px;line-height:1.85}
.cta{margin:26px 0;padding:24px;border:1px solid var(--line);border-radius:16px;background:#fff}.cta p{margin-bottom:12px}.cta p strong{font-size:18px}.button{display:inline-flex;min-height:56px;align-items:center;justify-content:center;padding:12px 24px;background:var(--deep);color:#fff;border-radius:30px;font-weight:700;text-decoration:none}.button:hover{color:#fff;background:#652638}.cta .cta-sub{margin:8px 0 0}.cta-sub a{display:inline-flex;align-items:center;min-height:44px}
.toc{margin-top:28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}summary{cursor:pointer;min-height:48px;padding:12px 4px;font-size:16px;font-weight:700;color:var(--deep)}.toc ol{padding-left:26px;margin:0 0 14px}.toc a{display:inline-block;min-height:44px;padding:8px 0;line-height:1.8}
.section{padding:34px 0;border-top:1px solid var(--line)}.section h2::before{content:"";display:block;width:36px;height:3px;background:var(--gold);margin-bottom:14px}.visual{margin:22px 0 0;padding:22px;background:#fff;border:1px solid var(--line);border-radius:14px;break-inside:avoid}figcaption{font-size:17px;font-weight:700;color:var(--deep);margin-bottom:16px;line-height:1.8}
.visual-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:0}.visual-items li{padding:16px;background:var(--bg);border-top:3px solid var(--rose);font-size:16px;line-height:1.8;overflow-wrap:anywhere}.visual-items strong,.visual-items span{display:block}.visual-items strong{margin-bottom:6px;color:var(--deep)}.visual-items.steps{counter-reset:step}.steps li{counter-increment:step}.steps strong::before{content:counter(step,decimal-leading-zero)" ";color:var(--muted)}.visual-items.check{grid-template-columns:repeat(2,minmax(0,1fr))}.check strong::before{content:"□ ";font-weight:400}.visual-items.compare{grid-template-columns:repeat(2,minmax(0,1fr))}
table{border-collapse:collapse;width:100%;table-layout:fixed;font-size:16px;line-height:1.8}th,td{padding:13px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);overflow-wrap:anywhere}th{font-weight:700}thead th{background:#f7e9ed;color:var(--deep)}th:first-child{width:39%}tbody tr:last-child>*{border-bottom:0}.table-frame{border:1px solid var(--line);border-radius:6px;overflow:hidden}blockquote{margin:0;padding:18px;border-left:3px solid var(--rose);background:var(--bg);font-size:17px;line-height:1.9}.example-note{margin:12px 0 0;font-size:16px;color:var(--muted)}
.faq-item{padding:20px 0;border-top:1px solid var(--line)}.faq-item p{margin:0}.references{padding:34px 0;border-top:1px solid var(--line)}.references h2{font-size:22px;margin:24px 0 16px}.references h2:first-child{margin-top:0}.related{list-style:none;margin:0;padding:0}.related li{border-bottom:1px solid var(--line)}.related a{display:inline-flex;align-items:center;min-height:48px;padding:10px 0}.footer{padding:28px 0;border-top:1px solid var(--line);background:#fff}.footer p{font-weight:700}.footer nav{display:flex;gap:20px;flex-wrap:wrap}.footer nav a{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:600px){.wrap{width:calc(100% - 36px)}.brandbar{padding:12px 0}.brandbar span{display:none}.hero{padding:24px 0}.draft-label{margin-bottom:12px}h1{font-size:27px}.lead{font-size:17px}.cta{padding:20px 18px;margin:20px 0}.button{width:100%;padding:12px 14px}.section{padding:28px 0}.visual{padding:18px 14px}.visual-items,.visual-items.check,.visual-items.compare{grid-template-columns:1fr}.visual-items li{padding:12px 14px}th,td{padding:12px 9px}.footer nav{display:block}.footer nav a{display:flex}blockquote{font-size:16px;padding:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}@media print{.brandbar,.toc,.skip-link,.draft-label{display:none}.wrap{width:100%}.section{padding:20px 0}.cta{box-shadow:none}.button{background:#fff;color:var(--ink);border:1px solid var(--ink)}}