.project-media[data-astro-cid-j6u6ogab] {
  position: relative;
  margin: 0;
  width: 100%;
  aspect-ratio: var(--media-ratio);
  overflow: hidden;
  border-radius: var(--project-media-radius);
  background: var(--project-media-background);
}

img[data-astro-cid-j6u6ogab], video[data-astro-cid-j6u6ogab] {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: var(--media-ratio);
  object-fit: contain;
}

.media-fallback[data-astro-cid-j6u6ogab] {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: var(--project-control-inset);
  display: grid;
  place-content: center;
  gap: var(--project-small-gap);
  text-align: center;
  font-size: var(--project-metadata-size);
  background: var(--project-media-background);
  color: var(--home-foreground);
}

.media-fallback[data-astro-cid-j6u6ogab][hidden], .video-play[data-astro-cid-j6u6ogab][hidden] {
  display: none;
}

a[data-astro-cid-j6u6ogab] {
  color: inherit;
}

.video-play[data-astro-cid-j6u6ogab] {
  position: absolute;
  bottom: var(--project-control-inset);
  left: var(--project-control-inset);
  border: var(--home-border-width) solid var(--home-glass-border);
  border-radius: var(--home-radius);
  padding: var(--project-small-gap) var(--project-control-inset);
  background: var(--project-play-background);
  color: var(--home-foreground);
  font: inherit;
  font-size: var(--home-header-size);
  cursor: pointer;
}

.video-play[data-astro-cid-j6u6ogab]:focus-visible, a[data-astro-cid-j6u6ogab]:focus-visible {
  outline: var(--home-focus-width) solid var(--home-foreground);
  outline-offset: var(--home-focus-offset);
}
.project-detail[data-astro-cid-bmrowvrh] {
  --title-size: var(--project-title-fallback-size);
  --title-lines: 1;
  --project-media-top: calc(var(--project-title-top) + (var(--title-lines) - 1) * var(--project-fit-title-leading) * var(--title-size) + var(--project-title-baseline) * var(--title-size) + var(--project-title-baseline-gap));
  position: relative;
  height: 100%;
  background: var(--home-background);
  color: var(--work-color);
}

.project-scene[data-astro-cid-bmrowvrh] {
  position: relative;
  height: 100%;
}

.project-title[data-astro-cid-bmrowvrh] {
  position: fixed;
  z-index: 1;
  top: var(--project-title-top);
  left: 50%;
  transform: translateX(-50%);
  width: min(var(--project-title-width), var(--project-column-width));
  margin: 0;
  font-size: var(--project-title-fallback-size);
  font-weight: var(--home-weight);
  letter-spacing: var(--home-tracking);
  line-height: var(--project-fit-title-leading);
  text-align: center;
  pointer-events: none;
}

.project-title[data-astro-cid-bmrowvrh] span[data-astro-cid-bmrowvrh] {
  display: block;
  white-space: nowrap;
}

.project-scroll[data-astro-cid-bmrowvrh] {
  position: relative;
  z-index: 2;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-width: none;
  outline: none;
}

.project-scroll[data-astro-cid-bmrowvrh]::-webkit-scrollbar, .project-info-scroll[data-astro-cid-bmrowvrh]::-webkit-scrollbar {
  display: none;
}

.project-flow[data-astro-cid-bmrowvrh] {
  display: flex;
  flex-direction: column;
  gap: var(--project-media-gap);
  width: var(--project-column-width);
  margin-inline: auto;
  padding-block: var(--project-media-top) var(--project-media-bottom);
}

.project-controls[data-astro-cid-bmrowvrh] {
  position: fixed;
  z-index: 5;
  bottom: max(var(--project-controls-bottom), env(safe-area-inset-bottom));
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: var(--project-controls-gap);
}

.glass-control[data-astro-cid-bmrowvrh] {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: var(--home-header-height);
  border: var(--home-border-width) solid var(--home-glass-border);
  border-radius: var(--home-radius);
  background: var(--home-glass-tint);
  box-shadow: var(--home-glass-shadow);
  backdrop-filter: blur(var(--home-glass-blur));
  -webkit-backdrop-filter: blur(var(--home-glass-blur));
  padding-inline: var(--project-control-inset);
  color: var(--home-foreground);
  font: inherit;
  font-size: var(--home-header-size);
  font-weight: var(--home-weight);
  line-height: 1;
  letter-spacing: var(--home-tracking);
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
}

.neighbor[data-astro-cid-bmrowvrh] {
  width: var(--project-neighbor-width);
}

.info-control[data-astro-cid-bmrowvrh], .info-close[data-astro-cid-bmrowvrh] {
  width: var(--project-info-control-width);
}

.glass-control[data-astro-cid-bmrowvrh]:focus-visible, .project-scroll[data-astro-cid-bmrowvrh]:focus-visible, .project-info-scroll[data-astro-cid-bmrowvrh]:focus-visible {
  outline: var(--home-focus-width) solid var(--home-foreground);
  outline-offset: calc(-1 * var(--home-focus-width));
}

.glass-control[data-astro-cid-bmrowvrh]:hover {
  background: var(--project-control-hover);
}

.project-info[data-astro-cid-bmrowvrh] {
  position: fixed;
  z-index: 20;
  inset: 0;
  background: var(--home-background);
  color: var(--home-foreground);
}

.project-info-scroll[data-astro-cid-bmrowvrh] {
  height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
  outline: none;
}

.project-info-content[data-astro-cid-bmrowvrh] {
  --divider-height: var(--project-divider-height);
  --divider-before: var(--project-divider-before);
  --divider-after: var(--project-divider-after);
  --divider-max-amplitude: var(--project-divider-amplitude);
  box-sizing: border-box;
  width: min(var(--project-info-width), calc(100% - var(--project-info-mobile-gutter) * 2));
  margin-inline: auto;
  padding-block: var(--project-info-top) var(--project-info-bottom);
}

.project-writeup[data-astro-cid-bmrowvrh] {
  font-size: var(--project-info-size);
  line-height: var(--project-info-leading);
  letter-spacing: var(--project-info-tracking);
  font-weight: var(--project-metadata-weight);
}

.project-writeup[data-astro-cid-bmrowvrh] p {
  margin: 0 0 var(--project-info-paragraph-gap);
}

.project-writeup[data-astro-cid-bmrowvrh] p:last-child {
  margin-bottom: 0;
}

.project-writeup[data-astro-cid-bmrowvrh] a {
  color: inherit;
  text-decoration-thickness: var(--home-underline-width);
}

.project-metadata[data-astro-cid-bmrowvrh] {
  display: grid;
  grid-template-columns: var(--project-metadata-columns);
  column-gap: var(--project-metadata-gap);
  margin: 0;
  font-size: var(--project-metadata-size);
  line-height: var(--project-metadata-leading);
  font-weight: var(--project-metadata-weight);
  letter-spacing: var(--home-tracking);
}

.project-metadata[data-astro-cid-bmrowvrh] > div[data-astro-cid-bmrowvrh] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--project-metadata-heading-gap);
}

dt[data-astro-cid-bmrowvrh] {
  font-size: var(--project-metadata-heading-size);
  line-height: var(--project-metadata-heading-leading);
  text-decoration: underline;
  text-underline-offset: var(--project-metadata-underline-offset);
}

dd[data-astro-cid-bmrowvrh] {
  margin: 0;
}

dd[data-astro-cid-bmrowvrh] span[data-astro-cid-bmrowvrh] {
  display: block;
}

.info-bottom-fade[data-astro-cid-bmrowvrh] {
  position: fixed;
  z-index: 1;
  bottom: 0;
  inset-inline: 0;
  height: var(--project-info-fade-height);
  background: linear-gradient(to bottom, var(--project-fade-transparent), var(--home-background));
  backdrop-filter: blur(var(--project-info-blur));
  -webkit-backdrop-filter: blur(var(--project-info-blur));
  mask-image: linear-gradient(to bottom, transparent, black var(--project-info-mask-stop));
  pointer-events: none;
}

.info-close[data-astro-cid-bmrowvrh] {
  position: fixed;
  z-index: 2;
  left: 50%;
  bottom: max(var(--project-controls-bottom), env(safe-area-inset-bottom));
  transform: translateX(-50%);
}

.visually-hidden[data-astro-cid-bmrowvrh] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (width <= 767px) {
  .project-detail[data-astro-cid-bmrowvrh] {
    --project-column-width: min(var(--project-mobile-column-width), calc(100vw - var(--project-mobile-gutter) * 2));
    --project-title-top: var(--project-mobile-title-top);
    --project-media-gap: var(--project-mobile-media-gap);
    --project-title-baseline-gap: var(--project-mobile-title-baseline-gap);
    --project-title-width: var(--project-mobile-title-width);
    --project-title-fallback-size: var(--project-mobile-title-size);
    --project-info-top: var(--project-mobile-info-top);
    --project-metadata-columns: repeat(2, minmax(0, 1fr));
    --project-metadata-gap: var(--project-mobile-metadata-gap);
    --project-info-size: var(--project-mobile-info-size);
    --project-info-tracking: var(--home-tracking);
    --project-info-leading: var(--project-mobile-info-leading);
    --project-info-paragraph-gap: var(--project-mobile-info-paragraph-gap);
    --project-metadata-size: var(--project-mobile-metadata-size);
    --project-metadata-heading-leading: var(--project-mobile-metadata-heading-leading);
    --project-metadata-heading-gap: var(--project-mobile-metadata-heading-gap);
    --project-divider-before: var(--project-mobile-divider-before);
    --project-divider-after: var(--project-mobile-divider-after);
  }

  .project-info-content[data-astro-cid-bmrowvrh] {
    width: min(var(--project-info-mobile-width), calc(100% - var(--project-info-mobile-gutter) * 2));
  }
}

@media (width <= 350px) {
  .project-controls[data-astro-cid-bmrowvrh] {
    gap: var(--project-small-gap);
  }
}
