:root { color-scheme: dark; --bg:#1a1e22; --panel:#242a30; --fg:#e8ece8; --muted:#b7bdb7; --accent:#d4e0d0; --line:#566057; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--fg); font:1.05rem/1.65 "Source Sans 3",system-ui,sans-serif; }
a { color:var(--accent); text-underline-offset:0.2em; }
a:hover { color:#f0e6a8; }
:focus-visible { outline:2px solid #f0e6a8; outline-offset:4px; }
.shell { max-width:1100px; margin:auto; padding-inline:1.5rem; }
.topnav { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:1rem; padding-block:1.5rem; border-bottom:1px solid var(--line); }
.topnav a { min-height:44px; display:inline-flex; align-items:center; }
.topnav div { display:flex; flex-wrap:wrap; gap:1.2rem; }
.skip { position:absolute; left:-9999px; }
.skip:focus { position:fixed; z-index:5; left:1rem; top:1rem; padding:0.75rem; background:var(--panel); }
header { padding-block:3.5rem 2rem; }
h1,h2,h3 { font-family:"Atkinson Hyperlegible",system-ui,sans-serif; line-height:1.15; }
h1 { font-size:clamp(2.4rem,6vw,4.25rem); letter-spacing:-0.035em; margin:0 0 1rem; }
h2 { font-size:clamp(1.65rem,3vw,2.4rem); margin:0; }
h3 { font-size:1.35rem; margin:0 0 0.75rem; }
p { margin:0 0 1rem; }
.lede { max-width:62ch; color:var(--muted); font-size:1.15rem; }
.jump { display:flex; flex-wrap:wrap; gap:0.7rem; padding:0 0 1rem; }
.jump a { display:inline-flex; align-items:center; min-height:44px; padding:0.4rem 0.8rem; border:1px solid var(--line); border-radius:0.35rem; text-decoration:none; }
.employer { padding-block:2.5rem; border-top:1px solid var(--line); scroll-margin-top:1.5rem; }
.employer-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:0.75rem; }
.dates,.role { color:var(--muted); }
.dates { font-variant-numeric:tabular-nums; }
.role { margin-top:0.6rem; }
.context { max-width:75ch; }
.projects { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-top:1.5rem; }
.project { padding:1.4rem; background:var(--panel); border:1px solid var(--line); border-radius:0.45rem; }
.project p { color:var(--muted); }
.links { margin:1rem 0 0; padding-left:1.1rem; }
.links li { padding-block:0.3rem; }
.links a { overflow-wrap:anywhere; }
.later { margin-top:1.25rem; padding-top:1rem; border-top:1px solid var(--line); font-size:0.95rem; }
.footnote { color:var(--muted); font-size:0.95rem; margin-top:1.4rem; }
.site-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; padding-bottom:3rem; }
.site-card { display:block; text-decoration:none; border:1px solid var(--line); background:var(--panel); border-radius:0.45rem; overflow:hidden; }
.site-card img { display:block; width:100%; height:auto; aspect-ratio:1200/630; object-fit:contain; }
.site-copy { display:block; padding:1.2rem; }
.site-copy strong { display:block; font:700 1.4rem/1.2 "Atkinson Hyperlegible",system-ui,sans-serif; margin-bottom:0.4rem; }
.site-copy span { display:block; color:var(--muted); }
.site-copy small { display:block; margin-top:0.8rem; color:var(--accent); font:0.85rem/1.4 ui-monospace,monospace; }
footer { border-top:1px solid var(--line); padding-block:1.5rem 2rem; color:var(--muted); }
@media(max-width:600px) { .shell{padding-inline:1rem;} header{padding-block:2rem 1.5rem;} .projects,.site-grid{grid-template-columns:1fr;} .project{padding:1.1rem;} }
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto;} }
@media(forced-colors:active) { .project,.site-card,.jump a{border:1px solid CanvasText;} }