:root { --ink: #20231f; --muted: #6c7069; --paper: #fbfaf7; --line: #deded8; --accent: #60751d; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "DM Sans", Arial, sans-serif; }
.page { max-width: 1120px; margin: auto; padding: 0 42px; }
a { color: inherit; text-decoration: none; }
header { height: 92px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); }
.name { font: 500 22px "Playfair Display", serif; }
nav { display: flex; gap: 24px; font: 11px "DM Mono", monospace; text-transform: uppercase; }
nav a:hover, .more:hover, .paper-link:hover { color: var(--accent); }
.intro { padding: 84px 0; display: grid; grid-template-columns: 250px 1fr; gap: 90px; align-items: center; }
.intro h1 { max-width: 500px; margin: 0; font: 500 clamp(28px, 3vw, 38px) / 1.12 "Playfair Display", serif; letter-spacing: -.03em; }
.lede { max-width: 590px; margin: 24px 0 0; font-size: 18px; line-height: 1.55; }
.background { max-width: 590px; margin: 12px 0 0; color: var(--muted); font-size: 15px; line-height: 1.55; }
.portrait { display: block; width: 250px; max-width: 100%; height: auto; filter: grayscale(12%); }
section { padding: 68px 0; border-bottom: 1px solid var(--line); }
section.intro { border-bottom: 0; }
.label { margin: 0 0 22px; color: var(--muted); font: 11px "DM Mono", monospace; letter-spacing: .05em; text-transform: uppercase; }
.publications { border-top: 1px solid var(--line); }
.publications article { display: grid; grid-template-columns: 90px 1fr; gap: 20px; padding: 22px 0; border-bottom: 1px solid var(--line); }
time { font: 11px "DM Mono", monospace; color: var(--muted); }
h2 { margin: 0; font: 500 23px / 1.18 "Playfair Display", serif; letter-spacing: -.02em; }
.publications p { margin: 7px 0 0; color: var(--muted); font-size: 14px; line-height: 1.45; }
.publications .authors { color: var(--ink); max-width: 820px; }
.publication-meta { display: flex; align-items: baseline; gap: 16px; }
.paper-link { font: 11px "DM Mono", monospace; text-transform: uppercase; white-space: nowrap; }
.more { display: inline-block; margin-top: 28px; font: 11px "DM Mono", monospace; text-transform: uppercase; }
.notes p:not(.label) { max-width: 540px; margin: 0; font: 500 24px / 1.3 "Playfair Display", serif; }
footer { padding: 42px 0 28px; }
footer p { margin: 0; font: 12px "DM Mono", monospace; color: var(--muted); }
.copyright { margin-top: 34px; font-size: 11px; line-height: 1; text-transform: uppercase; }
@media (max-width: 700px) { .page { padding: 0 22px; } header { height: 70px; } nav { gap: 12px; font-size: 9px; } .intro { padding: 65px 0; grid-template-columns: 1fr; gap: 38px; } .intro h1 { font-size: 30px; } .lede { font-size: 17px; } .portrait { width: 180px; grid-row: 1; } section { padding: 58px 0; } .publications article { grid-template-columns: 44px 1fr; gap: 10px; } h2 { font-size: 21px; } .notes p:not(.label) { font-size: 22px; } }