/* Local copy of the Varv shell. When varv.no exposes /shared.css as a static
   file, swap this <link> for that URL so visual changes propagate without a
   playground redeploy. Markup lives in shared/header.html + shared/footer.html. */
:root {
  --paper: #FBFBF8; --ink: #1C2126; --muted: #6B7075; --hair: #DCDCD4;
  --accent: #0F62B0;
  --sans: 'CircularXX', 'Helvetica Neue', Arial, sans-serif;
  --serif: 'Lyon Text', Georgia, 'Times New Roman', serif;
}
html, body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); }
.wrap { max-width: 720px; margin: 0 auto; padding: 0 24px; }
.site-header { border-bottom: 1px solid var(--hair); padding: 18px 0; }
.site-header .wrap { display: flex; align-items: baseline; gap: 24px; }
.site-title { font-family: var(--serif); font-size: 19px; text-decoration: none; color: var(--ink); }
.nav { display: flex; gap: 16px; margin-left: auto; }
.nav a { font-size: 13px; text-decoration: none; color: var(--muted); }
.nav a:hover, .nav a[aria-current] { color: var(--ink); }
.site-footer { border-top: 1px solid var(--hair); margin-top: 56px; padding: 20px 0 40px; }
.site-footer .wrap { display: flex; gap: 16px; font-size: 12px; color: var(--muted); }
.site-footer a { color: var(--muted); margin-left: auto; }
main { padding-top: 40px; }
h1 { font-family: var(--serif); font-weight: 400; font-size: 30px; margin: 0 0 6px; }
.lede { color: var(--muted); font-size: 13px; line-height: 1.6; }
.section-label { font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); font-weight: 600; margin: 40px 0 0; }
.entry-list { list-style: none; padding: 0; margin: 12px 0 0; border-top: 1px solid var(--hair); }
.entry { border-bottom: 1px solid var(--hair); padding: 16px 0; }
.entry h3 { margin: 0; font-size: 16px; font-weight: 500; }
.entry h3 a { text-decoration: none; color: var(--ink); }
.entry h3 a:hover { color: var(--accent); }
.entry .meta { font-size: 11.5px; color: var(--muted); margin: 3px 0 5px; }
.entry p { margin: 0; font-size: 13px; color: var(--muted); line-height: 1.55; }
.entry.archived { opacity: .6; }
/* experiment pages render their own full-width UI below the shell */
.experiment-body { max-width: 1040px; margin: 0 auto; }