* { box-sizing: border-box; letter-spacing: 0; }
html { color: #17201e; background: #f4f2ec; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { margin: 0; line-height: 1.65; }
a { color: #14584f; text-underline-offset: 3px; }
a:hover { color: #0d3f39; }
a:focus-visible { outline: 2px solid #1f756b; outline-offset: 3px; }
.site-header, .site-footer { background: #faf9f5; border-color: #d8d4c9; }
.site-header { border-bottom: 1px solid #d8d4c9; }
.site-footer { border-top: 1px solid #d8d4c9; color: #66716e; font-size: .8rem; }
.shell { width: min(100% - 2rem, 72rem); margin-inline: auto; }
.header-inner, .footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 4rem; }
.brand { display: flex; align-items: center; gap: .75rem; color: #17201e; font-weight: 800; text-decoration: none; }
.brand-mark { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border-radius: 8px; background: #123f3a; color: white; font-size: .75rem; }
.nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .9rem; font-size: .875rem; font-weight: 700; }
.article { width: min(100% - 2rem, 48rem); margin: 0 auto; padding: 2rem 0 4rem; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1.5rem; color: #66716e; font-size: .8rem; }
.eyebrow { margin: 0 0 .4rem; color: #1f756b; font-size: .8rem; font-weight: 800; text-transform: uppercase; }
h1 { margin: 0; color: #111614; font-size: clamp(2rem, 6vw, 2.7rem); line-height: 1.15; }
h2 { margin: 2.25rem 0 .6rem; color: #17201e; font-size: 1.35rem; line-height: 1.3; }
h3 { margin: 1.5rem 0 .4rem; font-size: 1.05rem; }
p, li { color: #4f5b58; }
.lead { margin: 1rem 0 1.75rem; font-size: 1.1rem; }
ol, ul { padding-left: 1.4rem; }
li + li { margin-top: .55rem; }
.notice { margin: 1.5rem 0; padding: 1rem 1.1rem; border-left: 4px solid #1f756b; background: #eaf6f3; }
.notice p { margin: 0; color: #264e48; }
pre { max-width: 100%; overflow-x: auto; padding: 1rem; border: 1px solid #d3cfc4; border-radius: 8px; background: #17201e; color: #f8faf9; line-height: 1.55; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
:not(pre) > code { padding: .1rem .3rem; border-radius: 4px; background: #e9ece9; color: #28332f; }
.error-list { display: grid; gap: .8rem; padding: 0; list-style: none; }
.error-list li { padding: 1rem; border: 1px solid #d3cfc4; border-radius: 8px; background: white; }
.actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid #d8d4c9; }
.button { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .65rem 1rem; border: 1px solid #123f3a; border-radius: 8px; font-weight: 800; text-decoration: none; }
.button-primary { background: #123f3a; color: white; }
.button-primary:hover { background: #1f756b; color: white; }
.button-secondary { background: transparent; color: #123f3a; }
@media (max-width: 640px) { .header-inner, .footer-inner { align-items: flex-start; flex-direction: column; padding: .8rem 0; } .nav { justify-content: flex-start; } .article { padding-top: 1.5rem; } }