/* =========================
   MEDIA PAGE HERO
========================= */

.media-hero {
  position: relative;
  overflow: hidden;

  background:
    linear-gradient(rgba(5, 5, 5, 0.5), rgba(5, 5, 5, 0.92)),
    url("../../images/ronin-hero.jpg") center center / cover no-repeat;
}

.media-hero::before {
  content: "";

  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      rgba(255,255,255,0.018) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,0.014) 1px,
      transparent 1px
    );

  background-size: 42px 42px;

  opacity: 0.28;

  pointer-events: none;
}

.media-hero::after {
  content: "";

  position: absolute;
  inset: 0;

  background:
    radial-gradient(
      circle at top,
      rgba(180,0,20,0.2),
      transparent 58%
    ),
    linear-gradient(
      180deg,
      transparent 58%,
      rgba(0,0,0,0.78)
    );

  pointer-events: none;
}

/* =========================
   MEDIA PAGE SHELL
========================= */

.media-page-shell {
  position: relative;
  overflow: hidden;
}

.media-page-shell::before {
  content: "";

  position: fixed;
  inset: 0;

  background:
    linear-gradient(
      rgba(255,255,255,0.014) 1px,
      transparent 1px
    );

  background-size: 100% 4px;

  opacity: 0.18;

  pointer-events: none;

  z-index: 0;
}

.media-page-shell > * {
  position: relative;
  z-index: 1;
}

/* =========================
   INTRO
========================= */

.media-intro-wrap {
  max-width: 1200px;

  margin: 0 auto;

  padding: 80px 24px 20px;
}

.media-intro-card {
  position: relative;

  overflow: hidden;
}

.media-intro-card::after {
  content: "";

  position: absolute;
  top: 0;
  right: 0;

  width: 180px;
  height: 100%;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(180,0,20,0.08)
    );

  pointer-events: none;
}

.media-intro-card h2 {
  margin-bottom: 16px;
}

/* =========================
   SHARED SECTIONS
========================= */

.media-section {
  max-width: 1280px;

  margin: 0 auto;

  padding: 28px 24px 80px;
}

.media-section-header {
  display: flex;
  justify-content: space-between;
  align-items: end;

  gap: 20px;

  margin-bottom: 24px;
}

.media-section-header h2 {
  margin: 0;

  font-family: "Orbitron", sans-serif;

  font-size: clamp(1.5rem, 3vw, 2.2rem);

  text-transform: uppercase;

  letter-spacing: 1.5px;

  color: var(--silver-bright);
}

/* =========================
   MEDIA STATS BAR
========================= */

.media-stats-bar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);

  border: 1px solid rgba(180,0,20,0.28);

  background:
    linear-gradient(
      135deg,
      rgba(18,18,22,0.96),
      rgba(8,8,10,0.96)
    );

  box-shadow:
    0 0 32px rgba(0,0,0,0.45),
    inset 0 0 34px rgba(120,0,15,0.06);

  overflow: hidden;
}

.media-stat {
  padding: 24px 18px;

  text-align: center;

  color: rgba(255,255,255,0.68);

  font-size: 0.72rem;
  font-weight: 700;

  letter-spacing: 1.4px;

  text-transform: uppercase;

  border-right: 1px solid rgba(255,255,255,0.06);
}

.media-stat:last-child {
  border-right: none;
}

.media-stat span {
  display: block;

  margin-bottom: 8px;

  font-family: "Orbitron", sans-serif;

  color: #ff4058;

  font-size: clamp(1.5rem, 3vw, 2.3rem);

  letter-spacing: 2px;
}

/* =========================
   FEATURED MEDIA
========================= */

.featured-media-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;

  gap: 24px;
}

.media-command-grid {
  grid-template-columns: 1.35fr 0.8fr;

  align-items: stretch;
}

.media-feature-card {
  position: relative;

  overflow: hidden;

  background:
    linear-gradient(
      180deg,
      rgba(18,18,18,0.98),
      rgba(8,8,8,0.98)
    );

  border: 1px solid var(--border-dark);

  box-shadow:
    var(--shadow-dark),
    inset 0 0 28px rgba(255,255,255,0.018);

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.media-feature-card:hover {
  transform: translateY(-4px);

  border-color: rgba(255,70,95,0.45);

  box-shadow:
    0 0 32px rgba(0,0,0,0.6),
    0 0 34px rgba(120,0,15,0.2);
}

.media-feature-card::before {
  content: "";

  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      rgba(255,255,255,0.015) 1px,
      transparent 1px
    );

  background-size: 100% 3px;

  opacity: 0.22;

  pointer-events: none;

  z-index: 2;
}

.media-feature-card::after {
  content: "";

  position: absolute;
  inset: 10px;

  border: 1px solid rgba(255,255,255,0.045);

  clip-path: polygon(
    0 14px,
    14px 0,
    calc(100% - 14px) 0,
    100% 14px,
    100% calc(100% - 14px),
    calc(100% - 14px) 100%,
    14px 100%,
    0 calc(100% - 14px)
  );

  pointer-events: none;

  z-index: 3;
}

.media-feature-primary {
  grid-row: span 2;
}

.media-feature-primary .video-frame {
  aspect-ratio: 16 / 10;
}

.media-frame,
.video-frame,
.streamer-frame {
  position: relative;

  width: 100%;

  aspect-ratio: 16 / 9;

  background: #080808;

  overflow: hidden;
}

.media-frame img,
.gallery-card img {
  width: 100%;
  height: 100%;

  object-fit: cover;

  display: block;

  filter: saturate(0.95) contrast(1.04);

  transition:
    transform 0.35s ease,
    filter 0.35s ease;
}

.video-frame iframe,
.streamer-frame iframe {
  width: 100%;
  height: 100%;

  border: 0;

  display: block;
}

.media-copy {
  padding: 22px 22px 24px;
}

.media-copy h3 {
  margin: 0 0 12px;

  font-family: "Orbitron", sans-serif;

  font-size: 1rem;

  letter-spacing: 1px;

  text-transform: uppercase;

  color: var(--silver-bright);
}

.media-copy p {
  margin: 0;

  color: var(--text-muted);

  line-height: 1.8;
}

.media-pill {
  display: inline-block;

  margin-bottom: 10px;

  padding: 5px 9px;

  border: 1px solid rgba(180,0,20,0.45);

  background: rgba(120,0,15,0.16);

  color: #ff4058;

  font-size: 0.68rem;
  font-weight: 700;

  letter-spacing: 1.4px;

  text-transform: uppercase;
}

/* =========================
   STREAMERS
========================= */

.streamer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));

  gap: 24px;
}

.streamer-card {
  position: relative;

  overflow: hidden;

  border: 1px solid rgba(180,0,20,0.28);

  background:
    linear-gradient(
      180deg,
      rgba(16,16,18,0.98),
      rgba(6,6,8,0.98)
    );

  box-shadow:
    0 0 28px rgba(0,0,0,0.45),
    inset 0 0 30px rgba(255,255,255,0.015);

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.streamer-card:hover {
  transform: translateY(-4px);

  border-color: rgba(255,70,95,0.45);

  box-shadow:
    0 0 34px rgba(0,0,0,0.6),
    0 0 30px rgba(120,0,15,0.22);
}

.streamer-card::after {
  content: "";

  position: absolute;
  inset: 10px;

  border: 1px solid rgba(255,255,255,0.04);

  pointer-events: none;
}

.streamer-live-bar {
  display: flex;
  align-items: center;

  gap: 10px;

  padding: 12px 18px;

  border-bottom: 1px solid rgba(180,0,20,0.25);

  background:
    linear-gradient(
      90deg,
      rgba(120,0,15,0.2),
      rgba(10,10,10,0.98)
    );

  font-size: 0.72rem;
  font-weight: 700;

  letter-spacing: 2px;

  text-transform: uppercase;

  color: #ff4058;
}

.live-dot {
  width: 8px;
  height: 8px;

  border-radius: 50%;

  background: #ff4058;

  box-shadow:
    0 0 12px rgba(255,64,88,0.85);

  animation: livePulse 1.8s infinite;
}

@keyframes livePulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }

  50% {
    transform: scale(1.35);
    opacity: 0.6;
  }

  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.streamer-info {
  padding: 22px;
}

.streamer-top-row {
  display: flex;
  justify-content: space-between;
  align-items: center;

  gap: 12px;
}

.streamer-top-row h3 {
  margin: 0;

  font-family: "Orbitron", sans-serif;

  font-size: 1rem;

  text-transform: uppercase;

  letter-spacing: 1px;

  color: var(--silver-bright);
}

.streamer-status {
  padding: 5px 8px;

  border: 1px solid rgba(76,255,136,0.35);

  background: rgba(0,120,40,0.14);

  color: #4cff88;

  font-size: 0.68rem;
  font-weight: 700;

  letter-spacing: 1px;

  text-transform: uppercase;
}

.streamer-role {
  margin: 8px 0 0;

  color: rgba(255,255,255,0.58);

  font-size: 0.82rem;

  letter-spacing: 1px;

  text-transform: uppercase;
}

.streamer-tags {
  display: flex;
  flex-wrap: wrap;

  gap: 8px;

  margin: 14px 0;
}

.streamer-tags span {
  padding: 5px 8px;

  border: 1px solid rgba(180,0,20,0.32);

  background: rgba(255,255,255,0.03);

  color: rgba(255,255,255,0.76);

  font-size: 0.68rem;

  letter-spacing: 1px;

  text-transform: uppercase;
}

.streamer-description {
  margin-bottom: 18px;

  color: rgba(255,255,255,0.72);

  line-height: 1.7;
}

/* =========================
   GALLERY
========================= */

.media-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 22px;
}

.gallery-card {
  position: relative;

  overflow: hidden;

  min-height: 260px;

  border: 1px solid var(--border-dark);

  box-shadow:
    var(--shadow-dark),
    inset 0 0 22px rgba(255,255,255,0.015);

  background: #080808;

  cursor: pointer;

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.gallery-card:hover {
  transform: translateY(-4px);

  border-color: rgba(255,70,95,0.45);

  box-shadow:
    0 0 30px rgba(0,0,0,0.6),
    0 0 28px rgba(120,0,15,0.2);
}

.gallery-card:hover img {
  transform: scale(1.05);

  filter: saturate(1.08) contrast(1.06);
}

.gallery-overlay {
  position: absolute;
  inset: auto 0 0 0;

  padding: 18px 18px 16px;

  background:
    linear-gradient(
      to top,
      rgba(0,0,0,0.88),
      rgba(0,0,0,0.12)
    );

  transform: translateY(10px);

  transition: transform 0.3s ease;
}

.gallery-card:hover .gallery-overlay {
  transform: translateY(0);
}

.gallery-overlay span {
  display: block;

  margin-bottom: 6px;

  color: #ff4058;

  font-size: 0.62rem;
  font-weight: 700;

  letter-spacing: 1.3px;

  text-transform: uppercase;

  opacity: 0.85;
}

.gallery-overlay h3 {
  margin: 0;

  font-family: "Orbitron", sans-serif;

  font-size: 0.95rem;

  letter-spacing: 1px;

  text-transform: uppercase;

  color: var(--silver-bright);
}

/* =========================
   GALLERY MODAL
========================= */

.gallery-modal {
  position: fixed;
  inset: 0;

  display: none;
  align-items: center;
  justify-content: center;

  padding: 32px;

  background: rgba(0,0,0,0.9);

  backdrop-filter: blur(10px);

  z-index: 99999;
}

.gallery-modal.active {
  display: flex;
}

.gallery-modal img {
  max-width: min(1100px, 92vw);
  max-height: 78vh;

  object-fit: contain;

  border: 1px solid rgba(180,0,20,0.45);

  box-shadow:
    0 0 45px rgba(0,0,0,0.8),
    0 0 80px rgba(120,0,15,0.22);
}

.gallery-modal-close {
  position: absolute;
  top: 24px;
  right: 28px;

  width: 42px;
  height: 42px;

  border: 1px solid rgba(255,70,95,0.55);

  background: rgba(120,0,15,0.22);

  color: #ff4058;

  font-size: 1.6rem;
  line-height: 1;

  cursor: pointer;
}

.gallery-modal-caption {
  position: absolute;
  bottom: 28px;

  color: rgba(255,255,255,0.82);

  font-family: "Orbitron", sans-serif;

  letter-spacing: 1px;

  text-transform: uppercase;
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width: 1100px) {
  .vote-thumb-card {
    flex: 0 0 240px;
  }
}

@media (max-width: 700px) {
  .vote-thumb-card {
    flex: 0 0 82vw;
  }

  .gallery-modal img {
    max-width: 95vw;
    max-height: 72vh;
  }

  .gallery-modal-caption {
    left: 18px;
    right: 18px;

    text-align: center;

    font-size: 0.8rem;
  }
}

@media (max-width: 760px) {
  .media-stats-bar {
    grid-template-columns: 1fr;
  }

  .media-stat {
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.06);
  }

  .media-stat:last-child {
    border-bottom: none;
  }

  .streamer-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .media-gallery-grid {
    grid-template-columns: 1fr;
  }

  .media-section {
    padding-inline: 18px;
  }

  .media-intro-wrap {
    padding-inline: 18px;
  }
}

/* =========================
   ALBUMS
========================= */

.album-section {
  padding-bottom: 90px;
}

.album-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 24px;
}
.album-card {
  position: relative;

  display: block;

  min-height: 300px;

  overflow: hidden;

  border: 1px solid rgba(180,0,20,0.28);

  background: #080808;

  text-decoration: none;

  box-shadow:
    0 0 28px rgba(0,0,0,0.45),
    inset 0 0 26px rgba(255,255,255,0.015);

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.album-card:hover {
  transform: translateY(-5px);

  border-color: rgba(255,70,95,0.5);

  box-shadow:
    0 0 34px rgba(0,0,0,0.65),
    0 0 34px rgba(120,0,15,0.24);
}

.album-cover {
  position: absolute;
  inset: 0;
}

.album-cover img {
  width: 100%;
  height: 100%;

  object-fit: cover;

  display: block;

  filter:
    saturate(0.92)
    contrast(1.05)
    brightness(0.82);

  transition:
    transform 0.35s ease,
    filter 0.35s ease;
}

.album-card:hover .album-cover img {
  transform: scale(1.07);

  filter:
    saturate(1.08)
    contrast(1.08)
    brightness(0.95);
}

.album-card::before {
  content: "";

  position: absolute;
  inset: 0;

  z-index: 2;

  background:
    linear-gradient(
      rgba(255,255,255,0.014) 1px,
      transparent 1px
    );

  background-size: 100% 4px;

  opacity: 0.22;

  pointer-events: none;
}

.album-card::after {
  content: "";

  position: absolute;
  inset: 10px;

  z-index: 3;

  border: 1px solid rgba(255,255,255,0.045);

  pointer-events: none;
}

.album-overlay {
  position: absolute;
  inset: auto 0 0 0;

  z-index: 4;

  padding: 24px;

  background:
    linear-gradient(
      to top,
      rgba(0,0,0,0.95),
      rgba(0,0,0,0.62),
      transparent
    );
}

.album-overlay span {
  display: inline-block;

  margin-bottom: 9px;

  padding: 5px 8px;

  border: 1px solid rgba(180,0,20,0.42);

  background: rgba(120,0,15,0.18);

  color: #ff4058;

  font-size: 0.62rem;
  font-weight: 700;

  letter-spacing: 1.4px;

  text-transform: uppercase;
}

.album-overlay h3 {
  margin: 0 0 9px;

  font-family: "Orbitron", sans-serif;

  color: var(--silver-bright);

  font-size: 1rem;

  letter-spacing: 1px;

  text-transform: uppercase;
}

.album-overlay p {
  margin: 0;

  max-width: 90%;

  color: rgba(255,255,255,0.72);

  font-size: 0.86rem;

  line-height: 1.55;
}

@media (max-width: 1100px) {
  .album-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .album-grid {
    grid-template-columns: 1fr;
  }

  .album-card {
    min-height: 270px;
  }
}

.album-card {
  isolation: isolate;
}

.album-cover img {
  will-change: transform;
}

/* =========================
   IMAGE COMPETITION
========================= */

.competition-grid {
  display: grid;
  grid-template-columns: 1.4fr 0.8fr;
  gap: 24px;
  align-items: stretch;
}

.winner-showcase {
  position: relative;
  overflow: hidden;

  min-height: 420px;

  border: 1px solid rgba(180,0,20,0.35);

  background: #080808;

  box-shadow:
    0 0 34px rgba(0,0,0,0.55),
    0 0 42px rgba(120,0,15,0.18);
}

.winner-showcase img {
  width: 100%;
  height: 100%;
  min-height: 420px;

  object-fit: cover;

  display: block;

  filter: saturate(1.02) contrast(1.08);
}

.winner-showcase::after {
  content: "";

  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,0.88),
      rgba(0,0,0,0.35),
      rgba(0,0,0,0.08)
    );

  pointer-events: none;
}

.winner-content {
  position: absolute;
  left: 28px;
  bottom: 28px;
  z-index: 2;

  max-width: 520px;
}

.winner-content h3 {
  margin: 0 0 12px;

  font-family: "Orbitron", sans-serif;

  color: var(--silver-bright);

  font-size: clamp(1.6rem, 3vw, 2.6rem);

  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.winner-content p {
  margin: 0 0 18px;

  color: rgba(255,255,255,0.76);

  line-height: 1.7;
}

.winner-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.winner-meta span {
  padding: 7px 10px;

  border: 1px solid rgba(255,255,255,0.12);

  background: rgba(255,255,255,0.045);

  color: rgba(255,255,255,0.78);

  font-size: 0.7rem;
  font-weight: 700;

  letter-spacing: 1px;
  text-transform: uppercase;
}

.competition-card {
  padding: 26px;

  border: 1px solid rgba(180,0,20,0.28);

  background:
    linear-gradient(
      180deg,
      rgba(18,18,22,0.98),
      rgba(7,7,9,0.98)
    );

  box-shadow:
    0 0 30px rgba(0,0,0,0.45),
    inset 0 0 28px rgba(255,255,255,0.015);
}

.competition-card h3 {
  margin: 0 0 14px;

  font-family: "Orbitron", sans-serif;

  color: var(--silver-bright);

  letter-spacing: 1px;
  text-transform: uppercase;
}

.competition-card p {
  color: rgba(255,255,255,0.72);
  line-height: 1.7;
}

.competition-rules {
  display: flex;
  flex-direction: column;
  gap: 10px;

  margin: 22px 0;
}

.competition-rules span {
  padding: 10px 12px;

  border-left: 3px solid rgba(255,64,88,0.75);

  background: rgba(255,255,255,0.04);

  color: rgba(255,255,255,0.76);

  font-size: 0.78rem;

  letter-spacing: 1px;
  text-transform: uppercase;
}

/* =========================
   RESPONSIVE ALBUMS
========================= */

@media (max-width: 1100px) {
  .album-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .competition-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .album-grid {
    grid-template-columns: 1fr;
  }

  .winner-content {
    left: 20px;
    right: 20px;
    bottom: 22px;
  }

  .winner-showcase,
  .winner-showcase img {
    min-height: 500px;
  }
}

.competition-modal {
  position: fixed;
  inset: 0;

  display: none;
  align-items: center;
  justify-content: center;

  padding: 24px;

  background: rgba(0,0,0,0.88);
  backdrop-filter: blur(10px);

  z-index: 99999;
}

.competition-modal.active {
  display: flex;
}

.competition-modal-card {
  position: relative;

  width: min(560px, 100%);

  padding: 30px;

  border: 1px solid rgba(180,0,20,0.4);

  background:
    linear-gradient(
      180deg,
      rgba(18,18,22,0.98),
      rgba(7,7,9,0.98)
    );

  box-shadow:
    0 0 45px rgba(0,0,0,0.75),
    0 0 60px rgba(120,0,15,0.24);
}

.competition-modal-card h2 {
  margin: 12px 0;

  font-family: "Orbitron", sans-serif;

  color: var(--silver-bright);

  text-transform: uppercase;
  letter-spacing: 1px;
}

.competition-modal-card p {
  color: rgba(255,255,255,0.72);
  line-height: 1.6;
}

.competition-modal-close {
  position: absolute;
  top: 18px;
  right: 18px;

  width: 38px;
  height: 38px;

  border: 1px solid rgba(255,70,95,0.55);

  background: rgba(120,0,15,0.22);

  color: #ff4058;

  font-size: 1.4rem;

  cursor: pointer;
}

.competition-submit-form {
  display: grid;
  gap: 16px;

  margin-top: 22px;
}

.competition-submit-form label {
  display: grid;
  gap: 8px;

  color: rgba(255,255,255,0.74);

  font-size: 0.76rem;
  font-weight: 700;

  letter-spacing: 1px;
  text-transform: uppercase;
}

.competition-submit-form input,
.competition-submit-form select {
  width: 100%;

  padding: 12px 13px;

  border: 1px solid rgba(255,255,255,0.12);

  background: rgba(0,0,0,0.35);

  color: white;

  outline: none;
}

.competition-submit-form input:focus,
.competition-submit-form select:focus {
  border-color: rgba(255,70,95,0.55);
}

.competition-message {
  margin: 0;

  font-size: 0.82rem;
  font-weight: 700;

  letter-spacing: 0.8px;
}

.competition-message.error {
  color: #ff4058;
}

.competition-message.success {
  color: #4cff88;
}

.voting-grid {
  display: flex;
  gap: 18px;
  overflow-x: auto;

  padding: 8px 4px 18px;

  scroll-snap-type: x mandatory;
}

.vote-thumb-card {
  flex: 0 0 260px;
  scroll-snap-align: start;

  overflow: hidden;

  border: 1px solid rgba(180,0,20,0.28);

  background:
    linear-gradient(
      180deg,
      rgba(18,18,22,0.98),
      rgba(7,7,9,0.98)
    );

  box-shadow: 0 0 24px rgba(0,0,0,0.45);
}

.vote-thumb-image {
  width: 100%;
  aspect-ratio: 1 / 1;

  padding: 0;
  border: 0;

  background: #050505;

  cursor: pointer;

  overflow: hidden;
}

.vote-thumb-image img {
  width: 100%;
  height: 100%;

  object-fit: cover;
  display: block;

  transition:
    transform 0.25s ease,
    filter 0.25s ease;
}

.vote-thumb-image:hover img {
  transform: scale(1.06);
  filter: saturate(1.08) contrast(1.06);
}

.vote-thumb-info {
  padding: 14px;
}

.vote-thumb-info span {
  display: block;

  margin-bottom: 7px;

  color: #ff4058;

  font-size: 0.62rem;
  font-weight: 700;

  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.vote-thumb-info h3 {
  margin: 0 0 8px;

  font-family: "Orbitron", sans-serif;

  color: var(--silver-bright);

  font-size: 0.82rem;

  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.vote-thumb-info p {
  margin: 0 0 12px;

  color: rgba(255,255,255,0.68);

  font-size: 0.76rem;

  letter-spacing: 0.7px;
  text-transform: uppercase;
}

.vote-thumb-info strong {
  color: #ff4058;
}

.vote-thumb-info .btn {
  width: 100%;
  justify-content: center;
}

.voting-grid::-webkit-scrollbar {
  height: 10px;
}

.voting-grid::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.05);
}

.voting-grid::-webkit-scrollbar-thumb {
  background: rgba(180,0,20,0.55);
}

.voting-grid::-webkit-scrollbar-thumb:hover {
  background: rgba(255,64,88,0.75);
}

.empty-vote-card {
  width: 100%;

  padding: 28px;

  border: 1px solid rgba(180,0,20,0.28);

  background: rgba(255,255,255,0.035);

  color: rgba(255,255,255,0.72);

  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.vote-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}


.vote-thumb-card {
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.vote-thumb-card:hover {
  transform: translateY(-4px);

  border-color: rgba(255,70,95,0.45);

  box-shadow:
    0 0 30px rgba(0,0,0,0.6),
    0 0 28px rgba(120,0,15,0.2);
}

.gallery-modal {
  animation: fadeModal 0.22s ease;
}

.gallery-modal img {
  animation: modalImageIn 0.24s ease;
}

@keyframes fadeModal {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes modalImageIn {
  from {
    transform: scale(0.96);
    opacity: 0;
  }

  to {
    transform: scale(1);
    opacity: 1;
  }
}

.admin-vote-panel[hidden] {
  display: none;
}

.admin-vote-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.admin-vote-card {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 16px;

  padding: 14px;

  border: 1px solid rgba(180,0,20,0.28);
  background: rgba(255,255,255,0.035);
}

.admin-vote-card img {
  width: 120px;
  height: 90px;
  object-fit: cover;
}

.admin-vote-card h3 {
  margin: 0 0 6px;
  font-family: "Orbitron", sans-serif;
  color: var(--silver-bright);
  text-transform: uppercase;
}

.admin-vote-card p {
  margin: 0 0 4px;
  color: rgba(255,255,255,0.7);
}

.admin-vote-card strong,
.admin-vote-card span {
  color: #ff4058;
  font-weight: 700;
}

@media (max-width: 800px) {
  .admin-vote-grid {
    grid-template-columns: 1fr;
  }
}

.admin-vote-panel {
  margin-top: 60px;

  border-top: 1px solid rgba(180,0,20,0.22);

  padding-top: 50px;
}

/* =========================
   BROADCAST NETWORK
========================= */

.broadcast-layout {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    340px;

  gap: 24px;

  align-items: start;
}

.broadcast-feature-card {
  overflow: hidden;

  border: 1px solid rgba(180,0,20,0.32);

  background:
    linear-gradient(
      180deg,
      rgba(18,18,22,0.98),
      rgba(7,7,9,0.98)
    );

  box-shadow:
    0 0 34px rgba(0,0,0,0.5),
    inset 0 0 30px rgba(255,255,255,0.015);
}

.broadcast-frame {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #050505;
}

.broadcast-frame iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.broadcast-info {
  padding: 24px;
}

.broadcast-info h3 {
  margin: 0 0 12px;

  font-family: "Orbitron", sans-serif;

  color: var(--silver-bright);

  font-size: clamp(1.2rem, 2vw, 1.8rem);

  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.broadcast-info p {
  margin: 0 0 16px;

  color: rgba(255,255,255,0.72);

  line-height: 1.7;
}

.broadcast-sidebar {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.broadcast-mini-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;

  padding: 18px;

  border: 1px solid rgba(180,0,20,0.24);

  background:
    linear-gradient(
      135deg,
      rgba(18,18,22,0.96),
      rgba(8,8,10,0.96)
    );

  box-shadow:
    0 0 24px rgba(0,0,0,0.35);
}

.broadcast-mini-card h3 {
  margin: 8px 0 6px;

  font-family: "Orbitron", sans-serif;

  color: var(--silver-bright);

  font-size: 0.9rem;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.broadcast-mini-card p {
  margin: 0;

  color: rgba(255,255,255,0.58);

  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}

.broadcast-mini-card a {
  color: #ff4058;

  font-size: 0.72rem;
  font-weight: 700;

  text-transform: uppercase;
  letter-spacing: 1px;

  text-decoration: none;
}

.broadcast-status {
  display: inline-block;

  padding: 4px 7px;

  font-size: 0.62rem;
  font-weight: 700;

  letter-spacing: 1px;
  text-transform: uppercase;
}

.broadcast-status.online {
  border: 1px solid rgba(76,255,136,0.35);
  background: rgba(0,120,40,0.14);
  color: #4cff88;
}

.broadcast-status.offline {
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.58);
}

@media (max-width: 1000px) {
  .broadcast-layout {
    grid-template-columns: 1fr;
  }
}

.album-count {
  display: inline-block;
  margin-top: 10px;

  color: rgba(255,255,255,0.55);

  font-size: 0.68rem;
  font-weight: 700;

  letter-spacing: 1px;
  text-transform: uppercase;
}

/* =========================
   ALBUM VIEWER MODAL
========================= */

.album-viewer-modal {
  position: fixed;
  inset: 0;

  display: none;
  align-items: center;
  justify-content: center;

  padding: 28px;

  background: rgba(0,0,0,0.9);
  backdrop-filter: blur(10px);

  z-index: 99999;
}

.album-viewer-modal.active {
  display: flex;
}

.album-viewer-card {
  position: relative;

  width: min(1180px, 96vw);
  max-height: 88vh;

  overflow: hidden;

  padding: 28px;

  border: 1px solid rgba(180,0,20,0.38);

  background:
    linear-gradient(
      180deg,
      rgba(18,18,22,0.98),
      rgba(7,7,9,0.98)
    );

  box-shadow:
    0 0 45px rgba(0,0,0,0.8),
    0 0 70px rgba(120,0,15,0.24);
}

.album-viewer-close {
  position: absolute;
  top: 18px;
  right: 18px;

  width: 40px;
  height: 40px;

  border: 1px solid rgba(255,70,95,0.55);

  background: rgba(120,0,15,0.22);

  color: #ff4058;

  font-size: 1.5rem;
  line-height: 1;

  cursor: pointer;
}

.album-viewer-header {
  display: flex;
  justify-content: space-between;
  align-items: end;

  gap: 20px;

  margin-bottom: 22px;
  padding-right: 52px;
}

.album-viewer-header h2 {
  margin: 0;

  font-family: "Orbitron", sans-serif;

  color: var(--silver-bright);

  text-transform: uppercase;
  letter-spacing: 1.5px;
}

.album-viewer-count {
  color: #ff4058;

  font-size: 0.72rem;
  font-weight: 700;

  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.album-viewer-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: 14px;

  max-height: 58vh;

  overflow-y: auto;

  padding-right: 6px;
}

.album-viewer-item {
  position: relative;

  overflow: hidden;

  aspect-ratio: 1 / 1;

  border: 1px solid rgba(180,0,20,0.22);

  background: #050505;

  cursor: pointer;
}

.album-viewer-item img {
  width: 100%;
  height: 100%;

  object-fit: cover;
  display: block;

  transition:
    transform 0.25s ease,
    filter 0.25s ease;
}

.album-viewer-item:hover img {
  transform: scale(1.06);
  filter: saturate(1.08) contrast(1.08);
}

.contest-winner-archive-item::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 58%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.86), transparent);
  pointer-events: none;
}

.contest-winner-archive-meta {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  z-index: 2;
  display: grid;
  gap: 3px;
  padding: 8px 10px;
  border-left: 3px solid rgba(255, 64, 88, 0.85);
  background: rgba(0, 0, 0, 0.58);
  color: #ffffff;
  font-family: "Orbitron", sans-serif;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-align: left;
  text-transform: uppercase;
}

.contest-winner-archive-meta small {
  color: rgba(255, 255, 255, 0.68);
  font-family: "Inter", sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
}

.album-viewer-empty {
  grid-column: 1 / -1;

  padding: 34px;

  border: 1px solid rgba(180,0,20,0.25);

  background: rgba(255,255,255,0.035);

  color: rgba(255,255,255,0.72);

  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.album-viewer-pagination {
  display: flex;
  justify-content: center;
  align-items: center;

  gap: 16px;

  margin-top: 22px;
}

.album-viewer-pagination span {
  color: rgba(255,255,255,0.72);

  font-size: 0.75rem;
  font-weight: 700;

  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.album-viewer-pagination .btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

@media (max-width: 1000px) {
  .album-viewer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .album-viewer-card {
    padding: 22px;
  }

  .album-viewer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .album-viewer-header {
    align-items: start;
    flex-direction: column;
  }
}

.admin-album-upload-panel[hidden] {
  display: none;
}

.admin-album-upload-panel {
  border-top: 1px solid rgba(180,0,20,0.22);
  padding-top: 50px;
}

.admin-album-upload-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;

  padding: 24px;

  border: 1px solid rgba(180,0,20,0.28);

  background:
    linear-gradient(
      180deg,
      rgba(18,18,22,0.98),
      rgba(7,7,9,0.98)
    );

  box-shadow:
    0 0 30px rgba(0,0,0,0.45),
    inset 0 0 28px rgba(255,255,255,0.015);
}

.admin-album-upload-form label {
  display: grid;
  gap: 8px;

  color: rgba(255,255,255,0.74);

  font-size: 0.76rem;
  font-weight: 700;

  letter-spacing: 1px;
  text-transform: uppercase;
}

.admin-album-upload-form input,
.admin-album-upload-form select {
  width: 100%;

  padding: 12px 13px;

  border: 1px solid rgba(255,255,255,0.12);

  background: rgba(0,0,0,0.35);

  color: white;

  outline: none;
}

.admin-album-upload-form input:focus,
.admin-album-upload-form select:focus {
  border-color: rgba(255,70,95,0.55);
}

.admin-album-upload-form button,
.admin-album-upload-form #albumUploadMessage {
  grid-column: 1 / -1;
}

@media (max-width: 760px) {
  .admin-album-upload-form {
    grid-template-columns: 1fr;
  }
}

.album-viewer-modal {
  z-index: 99990;
}

.gallery-modal {
  z-index: 100000;
}

.album-card:hover .album-overlay {
  transform: translateY(-4px);
}

.album-overlay {
  transition: transform 0.25s ease;
}

.album-cover {
  background:
    linear-gradient(
      135deg,
      rgba(18,18,22,0.98),
      rgba(7,7,9,0.98)
    );
}

.album-card[data-album-category="Contest Winners"] {
  border-color: rgba(255,215,0,0.35);
}

.album-card[data-album-category="Contest Winners"]:hover {
  border-color: rgba(255,215,0,0.75);

  box-shadow:
    0 0 34px rgba(255,215,0,0.15),
    0 0 44px rgba(255,215,0,0.08);
}

.broadcast-mini-card {
  width: 100%;

  border: 1px solid rgba(180,0,20,0.24);

  cursor: pointer;

  text-align: left;

  color: inherit;

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

.broadcast-mini-card:hover,
.broadcast-mini-card.active {
  transform: translateY(-3px);

  border-color: rgba(255,70,95,0.5);

  box-shadow:
    0 0 30px rgba(0,0,0,0.55),
    0 0 26px rgba(120,0,15,0.2);
}

.broadcast-card-action {
  color: #ff4058;

  font-size: 0.72rem;
  font-weight: 700;

  text-transform: uppercase;
  letter-spacing: 1px;
}

.live-dot.offline {
  background: rgba(255,255,255,0.35);

  box-shadow: none;

  animation: none;
}

.broadcast-feature-card {
  min-width: 0;
}

.broadcast-sidebar {
  min-width: 320px;
}


/* =========================
   BROADCAST NETWORK FIX
========================= */

.broadcast-section .broadcast-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 360px !important;
  gap: 24px !important;
  align-items: start !important;
}

.broadcast-section .broadcast-feature-card {
  min-width: 0 !important;
  width: 100% !important;
}

.broadcast-section .broadcast-sidebar {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;

  min-width: 0 !important;
  width: 100% !important;

  visibility: visible !important;
  opacity: 1 !important;
}

.broadcast-section .broadcast-mini-card {
  display: flex !important;
  width: 100% !important;
}

@media (max-width: 1000px) {
  .broadcast-section .broadcast-layout {
    grid-template-columns: 1fr !important;
  }
}

.broadcast-mini-card.is-live {
  border-color: rgba(76,255,136,0.45);

  box-shadow:
    0 0 26px rgba(0,0,0,0.55),
    0 0 26px rgba(76,255,136,0.12);
}

.broadcast-viewers {
  display: inline-block;

  margin-top: 6px;

  color: rgba(76,255,136,0.85);

  font-size: 0.66rem;
  font-weight: 700;

  letter-spacing: 1px;
  text-transform: uppercase;
}

.competition-rules strong {
  color: #ffffff;
  font-weight: 800;
}

/* =========================
   MEDIA REDESIGN OVERRIDES
========================= */

.media-command-center {
  max-width: 1320px;
  margin: 0 auto;
  padding: 86px 24px 26px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.48fr);
  gap: 26px;
}

.media-command-copy,
.media-command-stats,
.admin-command-panel {
  border: 1px solid rgba(255,70,95,0.26);
  background:
    radial-gradient(circle at top right, rgba(180,0,20,0.16), transparent 34%),
    linear-gradient(135deg, rgba(17,17,22,0.96), rgba(6,6,9,0.99));
  box-shadow:
    0 0 40px rgba(0,0,0,0.46),
    inset 0 1px 0 rgba(255,255,255,0.04);
}

.media-command-copy {
  position: relative;
  overflow: hidden;
  padding: 42px;
}

.media-command-copy::after {
  content: "";
  position: absolute;
  right: -80px;
  bottom: -90px;
  width: 240px;
  height: 240px;
  border: 1px solid rgba(255,70,95,0.22);
  transform: rotate(45deg);
  background: rgba(120,0,15,0.08);
}

.media-command-copy h2 {
  max-width: 840px;
  margin: 10px 0 18px;
  color: #fff;
  font-family: "Orbitron", sans-serif;
  font-size: clamp(2.05rem, 5vw, 4.25rem);
  line-height: 0.96;
  text-transform: uppercase;
  letter-spacing: 1.4px;
}

.media-command-copy p,
.media-section-subtext {
  margin: 0;
  color: rgba(255,255,255,0.7);
  line-height: 1.75;
}

.media-command-copy p {
  max-width: 760px;
}

.media-command-stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  padding: 16px;
  background:
    linear-gradient(135deg, rgba(120,0,15,0.34), rgba(8,8,11,0.98));
}

.media-command-stats a {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 94px;
  padding: 18px;
  border: 1px solid rgba(255,255,255,0.08);
  background:
    radial-gradient(circle at 85% 18%, rgba(255,70,95,0.14), transparent 34%),
    rgba(0,0,0,0.22);
  text-decoration: none;
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease;
}

.media-command-stats a::before,
.media-command-stats a::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.media-command-stats a::before {
  z-index: 0;
  background-image: var(--media-card-bg);
  background-size: cover;
  background-position: center;
  opacity: 0;
  filter: saturate(0.95) contrast(1.08);
  transform: scale(1.05);
  transition:
    opacity 0.22s ease,
    transform 0.22s ease;
}

.media-command-stats a::after {
  z-index: 1;
  background:
    linear-gradient(110deg, rgba(4,4,7,0.88), rgba(22,0,5,0.68) 58%, rgba(4,4,7,0.5)),
    linear-gradient(180deg, rgba(255,70,95,0.14), transparent 46%);
}

.media-command-stats a.has-media-bg::before {
  opacity: 0.36;
}

.media-command-stats a:hover {
  transform: translateX(5px);
  border-color: rgba(255,70,95,0.55);
  background: rgba(120,0,15,0.22);
}

.media-command-stats a.has-media-bg:hover::before {
  opacity: 0.5;
  transform: scale(1.1);
}

.media-command-stats span {
  position: relative;
  z-index: 2;
  display: block;
  margin-bottom: 8px;
  color: rgba(255,255,255,0.56);
  font-size: 0.7rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1.2px;
}

.media-command-stats strong {
  position: relative;
  z-index: 2;
  color: #fff;
  font-family: "Orbitron", sans-serif;
  font-size: 1.42rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.media-section {
  padding-top: 34px;
  padding-bottom: 58px;
}

.media-section-header {
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.media-section-subtext {
  max-width: 420px;
  text-align: right;
  font-size: 0.9rem;
}

.featured-section,
.contest-section,
.voting-section,
.broadcast-section,
.album-section,
.admin-command-panel {
  border: 1px solid rgba(255,70,95,0.16);
  background:
    linear-gradient(135deg, rgba(17,17,22,0.44), rgba(6,6,9,0.76));
}

.admin-command-panel {
  position: relative;
  margin-top: 20px;
  padding-top: 34px;
}

.admin-command-panel::before {
  content: "ADMIN";
  position: absolute;
  top: 18px;
  right: 24px;
  color: rgba(255,70,95,0.18);
  font-family: "Orbitron", sans-serif;
  font-size: 2.3rem;
  font-weight: 900;
  letter-spacing: 3px;
  pointer-events: none;
}

.admin-command-panel[hidden] {
  display: none !important;
}

.media-feature-card,
.winner-showcase,
.competition-card,
.broadcast-feature-card,
.album-card,
.admin-album-upload-form {
  border-color: rgba(255,70,95,0.28);
}

.media-feature-card,
.competition-card,
.broadcast-feature-card,
.admin-album-upload-form {
  background:
    linear-gradient(145deg, rgba(19,19,24,0.96), rgba(7,7,10,0.99));
}

.media-command-grid {
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.85fr);
}

.album-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.competition-modal-close,
.gallery-modal-close,
.album-viewer-close {
  display: grid;
  place-items: center;
}

@media (max-width: 1050px) {
  .media-command-center,
  .media-command-grid,
  .featured-media-grid,
  .competition-grid,
  .broadcast-section .broadcast-layout {
    grid-template-columns: 1fr !important;
  }

  .media-section-subtext {
    text-align: left;
  }
}

/* Album archive showcase revamp */
.album-viewer-card {
  width: min(1380px, 96vw);
  border-color: rgba(255, 70, 95, 0.38);
  background:
    radial-gradient(circle at 14% 0%, rgba(255, 70, 95, 0.12), transparent 34%),
    linear-gradient(145deg, rgba(13, 15, 21, 0.98), rgba(3, 4, 7, 0.98));
}

.album-viewer-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.075);
  padding-bottom: 18px;
}

.album-viewer-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-flow: dense;
  gap: 16px;
  max-height: 62vh;
  padding: 2px 8px 2px 0;
}

.album-viewer-item {
  display: block;
  min-height: 220px;
  aspect-ratio: auto;
  border: 1px solid rgba(255, 70, 95, 0.25);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent),
    #050608;
  box-shadow:
    0 14px 34px rgba(0, 0, 0, 0.34),
    inset 0 0 22px rgba(255, 70, 95, 0.035);
}

.album-viewer-item:nth-child(3n + 2) {
  grid-column: span 2;
}

.album-viewer-item:nth-child(4n + 3) {
  grid-row: span 2;
}

.album-viewer-featured-item {
  grid-column: span 3;
  grid-row: span 2;
  min-height: 460px;
}

.album-viewer-item img {
  position: absolute;
  inset: 0;
}

.album-viewer-item-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(to top, rgba(0, 0, 0, 0.84), transparent 62%),
    linear-gradient(135deg, rgba(255, 70, 95, 0.12), transparent 42%);
  opacity: 0.86;
  pointer-events: none;
}

.album-viewer-item-copy {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  z-index: 3;
  display: grid;
  gap: 5px;
  text-align: left;
}

.album-viewer-item-copy strong {
  color: #ffffff;
  font-family: "Orbitron", sans-serif;
  font-size: clamp(0.9rem, 1.25vw, 1.2rem);
  letter-spacing: 0.06em;
  line-height: 1.15;
  text-transform: uppercase;
}

.album-viewer-item-copy small {
  width: fit-content;
  padding: 4px 7px;
  border: 1px solid rgba(255, 70, 95, 0.4);
  background: rgba(0, 0, 0, 0.54);
  color: rgba(255, 210, 216, 0.9);
  font-family: "Orbitron", sans-serif;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.album-viewer-item-copy em {
  display: -webkit-box;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.82rem;
  font-style: normal;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.album-viewer-item:hover {
  border-color: rgba(255, 70, 95, 0.68);
  box-shadow:
    0 18px 46px rgba(0, 0, 0, 0.46),
    0 0 26px rgba(255, 70, 95, 0.16);
}

.contest-winner-archive-meta {
  top: 12px;
  bottom: auto;
  left: 12px;
  right: auto;
  max-width: calc(100% - 24px);
}

.contest-winner-archive-item .album-viewer-item-copy {
  bottom: 18px;
}

@media (max-width: 1050px) {
  .album-viewer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .album-viewer-featured-item {
    grid-column: span 3;
  }
}

@media (max-width: 700px) {
  .album-viewer-grid {
    grid-template-columns: 1fr;
  }

  .album-viewer-item,
  .album-viewer-featured-item,
  .album-viewer-item:nth-child(3n + 2),
  .album-viewer-item:nth-child(4n + 3) {
    grid-column: auto;
    grid-row: auto;
    min-height: 300px;
  }
}

@media (max-width: 720px) {
  .media-command-center {
    padding: 64px 18px 22px;
  }

  .media-command-copy {
    padding: 26px;
  }

  .media-section {
    padding-left: 18px;
    padding-right: 18px;
  }

  .media-section-header {
    display: block;
  }

  .media-section-subtext {
    margin-top: 10px;
  }
}