/* Shared, left-aligned layout for the personal pages. */
* { box-sizing: border-box; margin: 0; padding: 0; }
:root { --bg: #fff; --fg: #343c3c; --dim: #737b7b; --border: #e8ebeb; --hover: #657653; }
[data-theme="dark"] { --bg: #161616; --fg: #e0e0e0; --dim: #969d9d; --border: #303535; --hover: #b5c3a5; }
body { min-height: 100vh; background: var(--bg); color: var(--fg); font-family: var(--font-sans); font-size: 13px; line-height: 1.5; letter-spacing: -.011em; -webkit-text-size-adjust: 100%; }
a { color: inherit; text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--hover); }
.site-header { margin: 0; border: 0; max-width: 850px; padding: 24px 24px 16px; }
.site-nav { font-size: 13px; line-height: 1.5; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
.site-nav a { color: var(--dim); text-decoration: none; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--fg); }
.theme-toggle { margin-left: auto; width: 24px; min-height: 24px; display: grid; place-items: center; border: 0; background: none; color: var(--dim); font: inherit; cursor: pointer; }
.theme-toggle:hover { color: var(--fg); }
.page { width: 100%; max-width: 688px; padding: 16px 24px 96px; }
@media (min-width: 769px) {
  .page.page--inset { padding-left: 64px; }
}
h1 { font-size: 13px; line-height: 1.5; font-weight: 500; margin-bottom: 32px; }
h2 { font-size: 12px; line-height: 1.5; font-weight: 400; color: var(--dim); margin: 40px 0 12px; }
h1 + h2 { margin-top: 0; }
ul { list-style: none; }
@media (max-width: 480px) {
  .site-header { padding: 20px 20px 12px; }
  .site-nav { column-gap: 16px; }
  .page { padding: 16px 20px 64px; }
}