/* Sticky chrome — fixed top header + bottom footer, present on every page. */

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  height: 52px;
  padding: 0 22px;
  background: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.brand {
  font-family: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, monospace;
  font-size: 11px;
  line-height: 1;
  text-decoration: none;
  color: black;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
}
.brand .lc { opacity: 0.8; font-weight: 400; }

.github-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: black;
  text-decoration: none;
  transition: opacity 0.15s;
}
.github-link:hover { opacity: 0.55; }
.github-link svg { display: block; }

.site-footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
  height: 44px;
  padding: 0 22px;
  background: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #888;
}
.site-footer .info { color: #555; }
.site-footer .info a {
  color: inherit;
  text-decoration: none;
  transition: color 0.15s;
}
.site-footer .info a:hover { color: black; }
.site-footer .info .sep { color: #bbb; margin: 0 6px; }
.site-footer nav { display: flex; gap: 18px; }
.site-footer nav a {
  color: #888;
  text-decoration: none;
  transition: color 0.15s;
}
.site-footer nav a:hover { color: black; }

@media (max-width: 680px) {
  .site-footer { font-size: 9px; padding: 0 14px; gap: 10px; }
  .site-footer nav { gap: 12px; }
}
@media (max-width: 420px) {
  .site-header { padding: 0 14px; }
  .github-link span { display: none; }
}