:root { color-scheme: light dark; --paper:#f6f4ee; --ink:#263d30; --muted:#526259; --line:#cad4c8; --link:#315d3c; }
* { box-sizing:border-box; } body { margin:0; background:var(--paper); color:var(--ink); font:18px/1.7 system-ui,sans-serif; }
main { width:min(100% - 40px,760px); margin:32px auto 64px; } header { display:flex; align-items:center; gap:14px; margin-bottom:32px; }
header img { width:64px; height:64px; } header a { font:700 28px Georgia,serif; text-decoration:none; } h1,h2 { font-family:Georgia,serif; line-height:1.25; } h1 { font-size:38px; } h2 { margin-top:38px; font-size:25px; }
a { color:var(--link); overflow-wrap:anywhere; text-underline-offset:4px; } a:focus-visible { outline:3px solid var(--link); outline-offset:5px; } .muted { color:var(--muted); } .contact { padding:20px; border:1px solid var(--line); border-radius:20px; } footer { margin-top:40px; padding-top:20px; border-top:1px solid var(--line); display:flex; gap:24px; flex-wrap:wrap; } li { margin-block:10px; }
@media (prefers-color-scheme:dark) { :root { --paper:#17251e; --ink:#f3f2e9; --muted:#b4c2b6; --line:#4a5f50; --link:#bad6b4; } }
@media (max-width:420px) { h1 { font-size:31px; } body { font-size:17px; } }