:root{color-scheme:light;--paper:#f2f0ec;--surface:#fcfbf8;--ink:#26231f;--muted:#625e57;--line:#cbc6bb;--lime:#bae748;--deep:#334a09}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 Arial,Helvetica,sans-serif}
a{color:inherit}
a:focus-visible{outline:3px solid var(--deep);outline-offset:4px}
.guide-skip{position:absolute;left:12px;top:-60px;z-index:10;padding:8px 12px;background:var(--lime)}
.guide-skip:focus{top:12px}
.guide-site-header{display:flex;align-items:center;gap:clamp(16px,3vw,48px);padding:16px max(24px,calc((100vw - 1180px)/2));background:var(--ink);color:var(--surface)}
.guide-brand{font-size:21px;letter-spacing:-.04em;text-decoration:none;white-space:nowrap}
.guide-brand:first-letter{color:var(--lime)}
.guide-site-header nav{display:flex;gap:clamp(12px,2vw,26px);margin-left:auto}
.guide-site-header nav a,.guide-site-footer a{text-decoration:none}
.guide-site-header nav a:hover,.guide-site-footer a:hover{text-decoration:underline;text-underline-offset:4px}
.guide-header-action{padding:8px 14px;border-radius:9px;background:var(--lime);color:var(--ink);font-weight:700;text-decoration:none;white-space:nowrap}
main{max-width:1180px;min-height:72vh;margin:0 auto;padding:clamp(30px,6vw,72px) 24px clamp(70px,9vw,130px)}
.guide-article{max-width:850px;margin:auto}
.guide-crumb{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}
.guide-crumb a{text-underline-offset:3px}
.guide-hero{margin:clamp(48px,8vw,95px) 0 34px}
.guide-kicker{display:inline-block;margin-bottom:16px;color:var(--deep);font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
h1,h2,p{margin-top:0}
h1{max-width:16ch;margin-bottom:22px;font-size:clamp(42px,6.4vw,76px);line-height:1.06;letter-spacing:-.055em}
.guide-hero>p,.guide-index>p{max-width:68ch;color:var(--muted);font-size:clamp(18px,2vw,22px);line-height:1.55}
.guide-takeaway{display:grid;grid-template-columns:150px 1fr;gap:20px;max-width:760px;margin:0 0 72px;padding:23px 25px;border:1px solid #a9bd69;border-radius:18px;background:#ecf5cf;line-height:1.55}
.guide-takeaway strong{color:var(--deep)}
.guide-body{max-width:720px}
.guide-body section{padding:32px 0;border-top:1px solid var(--line)}
.guide-body h2,.guide-related h2{font-size:clamp(24px,3vw,34px);line-height:1.18;letter-spacing:-.035em}
.guide-body p,.guide-body li{max-width:70ch;color:#47433e}
.guide-body p{margin-bottom:17px}
.guide-body ul{margin:0;padding-left:22px}
.guide-body li+li{margin-top:8px}
.guide-related{display:grid;gap:12px;margin-top:48px;padding-top:36px;border-top:1px solid var(--line)}
.guide-related a{display:block;padding:14px 0;border-bottom:1px solid var(--line);font-weight:700;text-decoration:none}
.guide-related a:hover,.guide-index-list a:hover{color:var(--deep)}
.guide-index{max-width:850px;margin:clamp(30px,5vw,70px) auto 0}
.guide-index h1{max-width:14ch}
.guide-index-list{margin-top:60px;border-top:1px solid var(--line)}
.guide-index-list a{display:grid;grid-template-columns:48px 1fr 24px;align-items:center;gap:16px;padding:22px 4px;border-bottom:1px solid var(--line);font-size:clamp(18px,2.5vw,26px);text-decoration:none}
.guide-index-list a span:first-child{color:var(--muted);font-size:13px;font-weight:700}
.guide-site-footer{display:flex;align-items:flex-start;justify-content:space-between;gap:30px;padding:36px max(24px,calc((100vw - 1180px)/2));border-top:1px solid var(--line)}
.guide-site-footer p{max-width:48ch;color:var(--muted)}
.guide-site-footer nav{display:flex;gap:20px;flex-wrap:wrap}
@media(max-width:700px){.guide-site-header{flex-wrap:wrap}.guide-site-header nav{order:3;width:100%;margin-left:0;justify-content:space-between}.guide-header-action{margin-left:auto}.guide-takeaway{grid-template-columns:1fr;gap:6px}.guide-site-footer{display:block}.guide-site-footer nav{margin-top:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}