/* Small static-only additions. The main site's published stylesheet stays unchanged. */
.vip-note { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.9; }
.vip-note a, .icp-link { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.copyright { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
.icp-link:focus-visible, .vip-note a:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }
@media (max-width: 1050px) {
  .site-header { flex-wrap: wrap; gap: 12px; padding-top: 16px; padding-bottom: 12px; }
  .site-header nav { display: flex; order: 3; width: 100%; gap: 20px; padding: 6px 0; overflow-x: auto; white-space: nowrap; }
  .site-header nav a { flex: 0 0 auto; }
  .site-header .header-cta { display: inline-flex; margin-left: auto; }
}
@media (max-width: 680px) {
  /* Only clip the decorative outer ring, which otherwise adds horizontal page scrolling. */
  .architecture-section { overflow: clip; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; }
}