/* Shared by every page. Each page keeps its own styles inline, as they were designed. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/assets/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* A block that shows only while its value is true (dc-lite.js). */
dc-if { display: contents; }
dc-if[hidden] { display: none; }

button:disabled { cursor: default; opacity: 0.7; }

/* Back to top: a round button at the bottom right of the long pages. It fades in once the page has
   scrolled about 600px (where the browser can tie an animation to scrolling; elsewhere it always shows). */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

.to-top {
  position: fixed;
  right: max(20px, env(safe-area-inset-right, 0px));
  bottom: max(20px, env(safe-area-inset-bottom, 0px));
  z-index: 30;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #2563eb;
  color: #ffffff;
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.18);
  text-decoration: none;
}

.to-top:hover {
  background: #1d4ed8;
  color: #ffffff;
  text-decoration: none;
}

@supports (animation-timeline: scroll()) {
  .to-top {
    animation: to-top-in linear both;
    animation-timeline: scroll(root);
    animation-range: 0 600px;
  }
}

@keyframes to-top-in {
  0%, 60% { opacity: 0; visibility: hidden; transform: translateY(12px); }
  100% { opacity: 1; visibility: visible; transform: none; }
}
