:root{color-scheme:light;--ink:#181818;--muted:#808080;--line:#dedede}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{max-width:1040px;margin:0 auto;padding:76px 56px 32px;background:#fff;color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65}header{padding-bottom:56px}h1{font-size:clamp(54px,9vw,100px);line-height:1;letter-spacing:-.075em;font-weight:600;margin:0 0 32px}nav{display:flex;gap:28px;font-size:13px}nav a{color:#666}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:5px}a:focus-visible{outline:2px solid var(--ink);outline-offset:6px}main{counter-reset:sections}section{counter-increment:sections;border-top:1px solid var(--line);padding:38px 0 48px;display:grid;grid-template-columns:42px 220px 1fr;align-items:baseline;scroll-margin-top:20px}section:before{content:"0" counter(sections);font-family:monospace;font-size:11px;color:#999}h2{font-size:19px;line-height:1.4;font-weight:500;letter-spacing:-.5px;margin:0}.contact-links{list-style:none;padding:0;margin:0}.contact-links li+li{margin-top:10px}.contact-links a{font-size:15px}.contact-links li:first-child{margin-bottom:22px}.contact-links li:first-child a{font-size:19px;letter-spacing:-.5px}.contact-links span{display:inline-block;margin-left:6px;color:#888;font-size:13px}.empty{margin:0;color:var(--muted);font-size:14px}footer{border-top:1px solid var(--line);padding-top:25px;color:#999;font-size:11px}.skip{position:absolute;top:-80px;padding:8px;background:white;z-index:2}.skip:focus{top:10px}@media(max-width:650px){body{padding:48px 26px 24px}header{padding-bottom:38px}h1{font-size:clamp(48px,12vw,74px);margin-bottom:26px}nav{gap:23px;font-size:12px}section{grid-template-columns:30px 1fr;padding:28px 0 34px;row-gap:22px}section>ul,section>p{grid-column:2}h2{font-size:19px}.contact-links li:first-child a{font-size:18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.intro-label{font:11px monospace;text-transform:uppercase;letter-spacing:1.3px;color:#777;margin:0 0 22px}.intro{max-width:560px;font-size:18px;line-height:1.65;color:#666;margin:0 0 30px}.section-description{margin:0 0 25px;color:#666;font-size:15px;max-width:440px}@media(max-width:650px){.section-body{grid-column:2}.intro{font-size:16px}.intro-label{font-size:10px}}
body{padding-top:0}.site-header{height:100px;padding:0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.wordmark{font-size:33px;font-weight:700;letter-spacing:-2.5px;line-height:1}.wordmark span{color:#65795b}.wordmark:hover{text-decoration:none}.site-header nav{gap:28px}.introduction{padding:42px 0 35px}h1{font-size:clamp(38px,5vw,54px);letter-spacing:-.055em;margin:0 0 20px}.intro-label{margin-bottom:17px}.intro{font-size:17px;max-width:590px;margin-bottom:26px}.code-art{display:flex;align-items:center;justify-content:center;gap:22px;background:#f1f3ed;border:1px solid #e4e7df;border-radius:4px;min-height:112px;padding:18px 22px;font-family:monospace;font-size:12px;line-height:1.8}.bracket{font-size:62px;line-height:1;color:#a6b29a}.code-comment{font-size:10px;color:#7b8573}.code-key{color:#696242}.code-string{color:#526e43}@media(max-width:650px){body{padding-top:0}.site-header{height:82px}.site-header nav{gap:17px;font-size:11px}.wordmark{font-size:29px}.introduction{padding-top:32px}h1{font-size:40px}.intro{font-size:16px}.code-art{gap:12px;padding:15px 10px;font-size:11px}.code-comment{font-size:9px}.bracket{font-size:46px}}
.site-header{height:auto;align-items:flex-start;gap:28px;padding:34px 0 36px;border-bottom:0}.introduction{padding:0;min-width:0;flex:1}.site-header nav{flex-shrink:0;padding-top:6px;gap:22px}.intro-label{font-size:10px;margin:0 0 17px}.code-art{display:inline-flex;justify-content:flex-start;min-height:0;padding:9px 12px;margin:0 0 19px;gap:0;font-size:11px;max-width:100%;background:#f4f5f1}.code-art code{white-space:normal}h1{font-size:clamp(32px,4vw,44px);margin-bottom:18px;line-height:1.12}.intro{font-size:17px;max-width:590px;margin-bottom:0}.code-key{color:#526e43}@media(max-width:800px){.site-header{flex-direction:column;gap:24px;padding-top:28px}.site-header nav{padding-top:0;gap:24px}.intro-label{font-size:9px}h1{font-size:clamp(30px,6vw,40px)}.intro{font-size:16px}.code-art{font-size:10px;padding:8px 10px}}
.site-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 24px}.introduction{display:contents}.intro-label{grid-column:1;grid-row:1;align-self:center;margin:0}.site-header nav{grid-column:2;grid-row:1;padding:0}.code-art{grid-column:1 / -1;grid-row:2;display:flex;width:100%;max-width:none;min-height:100px;justify-content:center;gap:24px;margin:24px 0 26px;padding:17px 24px;background:#e9edde;border:1px solid #d9dfcc;border-radius:5px;font-size:12px;line-height:1.9}.code-art .bracket{font-size:58px;color:#a0af8c;line-height:1}.code-art .code-comment{font-size:10px;color:#6c7b5f}.code-art .code-key{color:#746039}.code-art .code-string{color:#4d6b38}h1{grid-column:1 / -1;grid-row:3}.intro{grid-column:1 / -1;grid-row:4}section h2{font-weight:600;font-size:21px;color:#405638;letter-spacing:-.5px}section h2:after{content:"";display:block;width:28px;height:3px;background:#aab991;margin-top:12px;border-radius:2px}section:before{color:#7b8c6b}@media(max-width:650px){.site-header{grid-template-columns:1fr;gap:0}.intro-label{grid-column:1;grid-row:1}.site-header nav{grid-column:1;grid-row:2;margin-top:17px}.code-art{grid-column:1;grid-row:3;gap:10px;padding:13px 10px;font-size:10px;min-height:90px;margin:23px 0}.code-art .bracket{font-size:42px}.code-art .code-comment{font-size:9px}h1{grid-row:4}.intro{grid-row:5}section h2{font-size:20px}}
.code-art{min-height:0;padding:11px 18px;line-height:1.6;gap:0}.code-art code{white-space:nowrap}@media(max-width:650px){.code-art{min-height:0;padding:10px 8px;font-size:10px}}
.intro-divider{grid-column:1 / -1;grid-row:2;width:100%;height:2px;border:0;background:#aab991;margin:24px 0 26px}@media(max-width:650px){.intro-divider{grid-row:3;margin:23px 0}}
.project-entry{border-top:1px solid #dce2d5;padding-top:20px;margin-top:26px}.project-entry h3{font-size:23px;font-weight:600;letter-spacing:-.6px;margin:0 0 9px;color:#26342e}.project-note{font-size:14px;color:#808080;margin:0}
section{grid-template-columns:42px 220px minmax(0,1fr);align-items:start}.section-heading{padding-right:28px}.section-heading h2{margin-bottom:17px}.section-heading .section-description{font-size:13px;line-height:1.7;margin:0}.section-body{min-width:0}.project-entry{margin-top:0;padding-top:0;border-top:0}@media(max-width:650px){section{grid-template-columns:30px minmax(0,1fr)}.section-heading{grid-column:2;padding-right:0}.section-heading .section-description{max-width:440px}.section-body{grid-column:2}}