:root {
  --catalogue-ink: #102331;
  --catalogue-paper: #f4f6f3;
  --catalogue-teal: #2b9d95;
  --catalogue-teal-dark: #146d68;
  --catalogue-coral: #b85a42;
}
body.catalogue-overlay-active { background: var(--catalogue-paper); }
.catalogue-topbar { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 22px; color: #dbe8e4; background: var(--catalogue-ink); font: 12px/1.2 "Avenir Next", "Helvetica Neue", ui-sans-serif, system-ui, sans-serif; position: relative; z-index: 1000; box-shadow: 0 1px 0 rgba(255,255,255,.08); }
.catalogue-topbar a { color: inherit; text-decoration: none; }
.catalogue-topbar a:hover { color: #8cdbd2; }
.catalogue-topbar-brand { display: inline-flex; align-items: center; gap: 9px; color: #fff !important; font-weight: 800; letter-spacing: .01em; }
.catalogue-topbar-brand::before { content: ""; width: 8px; height: 8px; display: inline-block; border-radius: 50%; background: var(--catalogue-teal); box-shadow: 0 0 0 4px rgba(43,157,149,.18); }
.catalogue-topbar-links { display: flex; align-items: center; gap: 20px; color: #a9c0bc; }
.catalogue-topbar-links a:last-child { padding-left: 20px; border-left: 1px solid rgba(219,232,228,.2); }
/* Keep the host application's content readable while softening its default canvas. */
body.catalogue-overlay-active #root,
body.catalogue-overlay-active .molgenis-app,
body.catalogue-overlay-active .MuiAppBar-root + main { background: var(--catalogue-paper); }
body.catalogue-overlay-active a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
body.catalogue-overlay-active button[type="submit"],
body.catalogue-overlay-active .MuiButton-containedPrimary,
body.catalogue-overlay-active .btn-primary { background-color: var(--catalogue-teal-dark); border-color: var(--catalogue-teal-dark); }
body.catalogue-overlay-active button[type="submit"]:hover,
body.catalogue-overlay-active .MuiButton-containedPrimary:hover,
body.catalogue-overlay-active .btn-primary:hover { background-color: var(--catalogue-teal); border-color: var(--catalogue-teal); }
body.catalogue-overlay-active a:not(.catalogue-topbar-brand):not(.catalogue-topbar-links a) { color: var(--catalogue-teal-dark); }
body.catalogue-overlay-active :focus-visible { outline: 3px solid var(--catalogue-teal); outline-offset: 3px; }
@media (max-width: 600px) { .catalogue-topbar { padding: 0 14px; }.catalogue-topbar-links { gap: 10px; }.catalogue-topbar-links a:last-child { padding-left: 10px; }.catalogue-topbar-links a:first-child { display: none; } }