/* Our own additions on top of Super's vendored stylesheets.
   Kept separate so the vendored files stay pristine and are trivial to delete
   in the phase-2 clean rewrite. */

.notion-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  background: rgba(0, 0, 0, 0.9);
  cursor: zoom-out;
  animation: notion-lightbox-in 120ms ease-out;
}

.notion-lightbox img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

@keyframes notion-lightbox-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .notion-lightbox { animation: none; }
}

/* theme.css (Super's custom-CSS export) hides the whole actions group, which takes
   the "apply here!" CTA with it. Restore super.css's own layout. */
.super-navbar__actions {
  display: grid;
}

/* Super's balanced grid gives the links a fixed 2fr, which clips the last link
   ("Blog") below ~1040px. In that band, give them whatever logo and CTA leave. */
@media (max-width: 1040px) {
  .super-navbar.balanced .super-navbar__content {
    grid-template-columns: auto 1fr auto;
  }
}

/* Small screens: no hamburger. With five links there is room to show them all:
   logo and CTA share the top row, links wrap centred beneath (two rows on most
   phones). super.css hides the link list below 860px and pins the bar to a fixed
   height; undo both. The bar stops being sticky here so it scrolls away rather
   than permanently taking ~110px of a phone screen. */
@media (max-width: 860px) {
  .super-navbar {
    height: auto;
    position: static !important; /* beats the inline position:sticky */
  }
  .super-navbar.balanced .super-navbar__content {
    grid-template-columns: 1fr auto;
    grid-template-areas: "logo cta" "links links";
    padding: 8px 8px 4px;
  }
  .super-navbar.balanced .super-navbar__logo {
    grid-area: logo;
    margin: 0;
  }
  .super-navbar__content div:has(.super-navbar__item-list) {
    grid-area: links;
    max-height: none;
  }
  .super-navbar.balanced .super-navbar__actions {
    grid-area: cta;
    padding: 0;
  }
  .super-navbar__item-list {
    display: flex;
    justify-content: center;
    height: auto;
  }
  .super-navbar__item-list li {
    height: auto;
  }
  .super-navbar__item {
    width: auto;
    padding: 6px 8px;
  }
}