/* MIO unified public archive bridge v1.6.0 */
.media-archive-switcher {
  width: min(1240px, calc(100% - 40px));
  margin: clamp(1rem, 2.5vw, 2rem) auto;
  padding: .8rem;
  display: grid;
  grid-template-columns: minmax(230px, .72fr) minmax(520px, 1.28fr);
  align-items: stretch;
  gap: .75rem;
  border: 1px solid rgba(140, 101, 36, .18);
  border-radius: 1.35rem;
  background:
    radial-gradient(circle at 8% 20%, rgba(216, 180, 102, .14), transparent 28%),
    rgba(255, 252, 245, .97);
  box-shadow: 0 20px 55px rgba(48, 7, 14, .1);
}

.media-archive-identity {
  min-width: 0;
  padding: 1rem 1.15rem;
  display: flex;
  align-items: center;
  gap: .85rem;
  border-radius: .95rem;
  color: #31060d;
  background: linear-gradient(135deg, rgba(250, 239, 213, .82), rgba(255, 253, 247, .95));
}

.media-archive-identity > svg {
  width: 2.3rem;
  height: 2.3rem;
  flex: 0 0 auto;
  padding: .58rem;
  color: #f7e4b0;
  border-radius: .75rem;
  background: linear-gradient(145deg, #4a0815, #74172c);
  box-shadow: 0 9px 22px rgba(76, 8, 22, .2);
}

.media-archive-identity > span {
  min-width: 0;
  display: grid;
  gap: .2rem;
}

.media-archive-identity b {
  font: 700 1.06rem/1.1 "Playfair Display", Georgia, serif;
}

.media-archive-identity small {
  color: #725f59;
  font-size: .72rem;
  line-height: 1.45;
}

.media-archive-routes {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .55rem;
}

.media-archive-routes a {
  min-width: 0;
  min-height: 5.25rem;
  padding: .85rem .9rem;
  display: grid;
  grid-template-columns: 2.4rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .7rem;
  border: 1px solid rgba(91, 53, 47, .09);
  border-radius: 1rem;
  color: #503d39;
  background: rgba(255, 255, 255, .84);
  text-decoration: none;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.media-archive-routes a:hover {
  transform: translateY(-2px);
  border-color: rgba(164, 115, 47, .32);
  box-shadow: 0 12px 26px rgba(72, 18, 26, .09);
}

.media-archive-routes a > svg {
  width: 2.4rem;
  height: 2.4rem;
  padding: .65rem;
  border-radius: .75rem;
  color: #6d1324;
  background: #f5ead6;
}

.media-archive-routes a > span {
  min-width: 0;
  display: grid;
  gap: .12rem;
}

.media-archive-routes a small {
  overflow: hidden;
  color: #8b7771;
  font-size: .63rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-archive-routes a b {
  color: #3f1017;
  font-size: .83rem;
}

.media-archive-routes a em {
  padding: .42rem .58rem;
  border-radius: 999px;
  color: #785d56;
  background: #f7f0e4;
  font-size: .6rem;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.media-archive-routes a[aria-current="page"] {
  color: #fffaf0;
  border-color: rgba(241, 213, 147, .2);
  background:
    radial-gradient(circle at 90% 8%, rgba(224, 183, 91, .22), transparent 35%),
    linear-gradient(135deg, #460913, #77182e);
  box-shadow: 0 12px 28px rgba(76, 8, 22, .2);
}

.media-archive-routes a[aria-current="page"] > svg {
  color: #431019;
  background: linear-gradient(145deg, #fff7e5, #e4c77f);
}

.media-archive-routes a[aria-current="page"] small {
  color: rgba(255, 255, 255, .64);
}

.media-archive-routes a[aria-current="page"] b {
  color: #fffdf7;
}

.media-archive-routes a[aria-current="page"] em {
  color: #f8e4b0;
  background: rgba(255, 255, 255, .1);
}

.gallery-meta small,
.media-results-meta small {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}

.gallery-meta small svg,
.media-results-meta small svg {
  width: .85rem;
  height: .85rem;
}

.media-card.is-new::after,
.public-media-card.is-new::after {
  content: "Newly published";
  position: absolute;
  z-index: 5;
  top: 1rem;
  left: 1rem;
  padding: .45rem .62rem;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px;
  color: #3c0a13;
  background: linear-gradient(135deg, #fff8e7, #e6c77a);
  box-shadow: 0 8px 20px rgba(27, 2, 6, .16);
  font-size: .56rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.public-media-card.is-new {
  position: relative;
}

.public-media-card.is-new::after {
  top: 3.55rem;
  left: .85rem;
}

.media-legacy-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .65rem;
  flex-wrap: wrap;
}

.media-legacy-actions .media-button.glass {
  border: 1px solid rgba(255, 255, 255, .2);
  color: #fff;
  background: rgba(255, 255, 255, .08);
}

@media (max-width: 960px) {
  .media-archive-switcher {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .media-archive-switcher {
    width: min(100% - 20px, 1240px);
    padding: .55rem;
    border-radius: 1rem;
  }

  .media-archive-identity {
    padding: .8rem;
  }

  .media-archive-identity > svg {
    width: 2rem;
    height: 2rem;
  }

  .media-archive-routes {
    grid-template-columns: 1fr;
  }

  .media-archive-routes a {
    min-height: 4.5rem;
    grid-template-columns: 2.15rem minmax(0, 1fr) auto;
    padding: .68rem .72rem;
  }

  .media-archive-routes a > svg {
    width: 2.15rem;
    height: 2.15rem;
  }

  .media-archive-routes a small {
    font-size: .6rem;
  }

  .media-legacy-actions,
  .media-legacy-actions .media-button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .media-archive-routes a {
    transition: none;
  }
}