/* Base element visuals tied to tokens (lightweight) */
@layer base {
  html, body { background: var(--color-bg); color: var(--color-ink); }
  a { color: var(--link); text-decoration: none }
  a:hover { color: var(--link-hover); text-decoration: underline }
  hr { border: 0; border-top: var(--hairline); margin: var(--space-4) 0 }
  .wrap { max-width: 1200px; margin-inline: auto; padding-inline: var(--space-3) }
  
  @media (prefers-reduced-motion: no-preference) {
  
    @view-transition {
    	navigation: auto;
  	}
  
	html {
		scroll-behavior: smooth;
	}
}

}