:root{--paper:#ececea;--ink:#1d1e1c;--mute:#7d7f79;--max:1080px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Courier Prime","Courier New",Courier,monospace;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
header{position:sticky;top:0;z-index:5;background:var(--paper);display:flex;justify-content:space-between;align-items:baseline;padding:22px clamp(20px,5vw,56px)}
.name{font-weight:700;text-decoration:none}
nav a{text-decoration:none;margin-left:28px;color:var(--mute)}
nav a[aria-current],nav a:hover{color:var(--ink)}
main{max-width:var(--max);margin:0 auto;padding:0 clamp(20px,5vw,56px) 120px}
section{padding-top:clamp(56px,9vw,110px)}
h2{font-size:clamp(19px,1.8vw,22px);font-weight:700;margin:0 0 26px}
.reel{column-gap:clamp(14px,2vw,22px)}
.reel.cols-2{columns:2}
.reel.cols-3{columns:3}
.frame{position:relative;width:100%;aspect-ratio:16/9;background:#dcdcd8;break-inside:avoid;margin-bottom:clamp(14px,2vw,22px)}
.frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.about{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(32px,7vw,110px);padding:clamp(56px,10vw,120px) 0 clamp(16px,3vw,32px);align-items:start}
.about p{margin:0}
.facts{display:grid;grid-template-columns:max-content 1fr;gap:8px 28px;margin:0 0 36px}
.facts dt{color:var(--mute)}
.facts dd{margin:0}
.facts a{text-decoration:none}
.facts a:hover{text-decoration:underline}
.bio{max-width:52ch}
.right{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.head{color:var(--mute);margin-bottom:8px!important}
.contact{min-height:calc(100vh - 220px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 0}
.contact h1{font-size:clamp(19px,1.8vw,22px);font-weight:700;margin:0 0 40px}
.contact .facts{gap:14px 28px;margin:0}
footer{max-width:var(--max);margin:0 auto;padding:40px clamp(20px,5vw,56px) 60px;color:var(--mute);display:flex;justify-content:space-between;gap:8px}
footer a{text-decoration:none}
footer.center{justify-content:center}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media (max-width:900px){.reel.cols-3{columns:2}}
@media (max-width:760px){.about{grid-template-columns:1fr}}
@media (max-width:560px){nav a{margin-left:18px}.reel.cols-2,.reel.cols-3{columns:1}footer{flex-direction:column}}