/* Shared site chrome — the header band and footer used by chat.html and every static page. */
.site-header{ display:flex; align-items:center; justify-content:space-between; padding:20px 28px 16px; background:var(--paper); border-bottom:1px solid var(--ink); box-shadow:0 2px 0 var(--accent); position:sticky; top:0; z-index:20; flex-shrink:0; }
.site-header .wordmark{ font-family:'Fraunces',serif; font-weight:600; font-size:26px; letter-spacing:.02em; text-decoration:none; color:var(--ink); }
.site-header .wordmark em{ font-style:italic; font-weight:300; color:var(--accent); }
.site-header nav{ display:flex; flex-wrap:wrap; justify-content:flex-end; column-gap:18px; row-gap:8px; }
.site-header nav{ align-items:center; }
.site-header nav a{ font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:var(--ink); text-decoration:none; white-space:nowrap; padding:5px 12px; line-height:normal; border:1px solid var(--ink); border-radius:999px; }
.site-header nav a:hover{ background:var(--ink); color:var(--paper); }
.site-header nav .theme-toggle{ width:30px; height:30px; border:1px solid var(--ink); color:var(--ink); }
.site-header nav .theme-toggle:hover, .site-header nav .theme-toggle:focus-visible{ background:var(--ink); color:var(--paper); }
.site-header nav .theme-toggle svg{ width:16px; height:16px; }
@media (max-width:600px){
  .site-header{ flex-wrap:wrap; row-gap:10px; padding:18px 20px 14px; }
  .site-header nav{ width:100%; justify-content:flex-start; }
}

.site-footer{ background:var(--line); border-top:2px solid var(--accent); padding:36px 28px 28px; margin-top:48px; }
.site-footer .footer-cols{ max-width:880px; margin:0 auto; display:grid; grid-template-columns:repeat(4, auto); justify-content:space-between; gap:28px 24px; }
.site-footer .footer-col h3{ font-size:10px; text-transform:uppercase; letter-spacing:.12em; color:var(--faint); font-weight:500; margin-bottom:12px; }
.site-footer .footer-col ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:9px; }
.site-footer .footer-col li{ margin:0; line-height:1.4; }
.site-footer .footer-col a{ font-size:13px; line-height:1.4; color:var(--ink); text-decoration:none; }
.site-footer .footer-col a:hover{ color:var(--accent); text-decoration:underline; }
.site-footer .footer-bottom{ max-width:880px; margin:28px auto 0; padding-top:18px; border-top:1px solid color-mix(in srgb, var(--ink) 25%, transparent); text-align:center; font-size:11px; line-height:1.7; color:var(--faint); }
@media (max-width:720px){
  .site-footer{ padding:28px 20px 24px; }
  .site-footer .footer-cols{ grid-template-columns:1fr 1fr; gap:26px 20px; }
}

.site-footer .footer-copy{ display:block; margin-bottom:6px; font-family:'Fraunces',serif; font-weight:600; font-size:15px; letter-spacing:.04em; color:var(--ink); }
.site-footer .footer-copy em{ font-style:italic; font-weight:300; color:var(--accent); }
