/**
 * Viewer foundation and ordered theme entrypoint.
 * Load safe semantic defaults and public aliases before the selected palette.
 * Public route styles stay separately linked in their original cascade order.
 */

@import url("./viewer-fonts.css");
@import url("./themes/theme-base.css");
@import url("./themes/public-tokens.css");
@import url("./themes/minimal.css");
@import url("./themes/scientific-clay.css");
@import url("./themes/nebula.css");

:root { font-family: var(--font-sans); font-size: 16px; line-height: 1.55; }

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg-shell);
  color: var(--fg-body);
  font-family: var(--font-sans);
}

a { color: var(--accent-text); text-decoration: none; }
a:hover, a:focus-visible { color: var(--accent-hover); text-decoration: underline; }

:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 2px; }

.visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute; top: -100px; left: 0;
  padding: 0.5rem 1rem;
  background: var(--accent); color: var(--on-accent);
  z-index: 100;
}
.skip-link:focus { top: 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    animation-iteration-count: 1 !important;
    transition: none !important;
  }
}