/* =========================
   FASHION LIBRARY
========================= */

.fashion-page .visually-hidden {
  width: 1px;
  height: 1px;
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.fashion-page .fashion-hero {
  min-height: 230px;
  padding: clamp(18px, 3vw, 34px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  align-items: center;
  gap: 28px;
  border: 1px solid #6c7e8a;
  background:
    repeating-linear-gradient(0deg, rgba(70, 76, 80, 0.045) 0 1px, transparent 1px 6px),
    linear-gradient(135deg, #f0f2f3 0%, #d8e2e6 100%);
  box-shadow:
    inset 1px 1px 0 #fff,
    0 3px 0 rgba(74, 82, 87, 0.24);
}

.fashion-page .fashion-hero h1 {
  margin: 14px 0 3px;
  color: #2b3d47;
  font: 600 clamp(58px, 10vw, 132px)/0.86 "Arial Narrow", "Segoe UI", sans-serif;
  letter-spacing: -0.075em;
}

.fashion-page .fashion-file-label {
  margin: 14px 0 0;
  color: #657076;
  font: 700 8px/1.3 "Courier New", monospace;
  letter-spacing: 0.10em;
}

.fashion-page .fashion-hero-copy > p:last-child {
  max-width: 650px;
  margin: 5px 0 0;
  color: #40515b;
  font-size: 13px;
  line-height: 1.8;
}

.fashion-page .fashion-status {
  margin: 0;
  border: 1px solid #74838c;
  background: #d6dadc;
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.92);
}

.fashion-page .fashion-status div {
  min-height: 47px;
  padding: 0 10px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  border-bottom: 1px solid #9ba7ad;
}

.fashion-page .fashion-status div:last-child {
  border-bottom: 0;
}

.fashion-page .fashion-status dt {
  color: #65727a;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.fashion-page .fashion-status dd {
  margin: 0;
  color: #4d7f96;
  font-family: "Courier New", monospace;
  font-size: 13px;
  font-weight: 700;
}

.fashion-page .library-toolbar {
  min-height: 30px;
  margin-top: 18px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #77858d;
  color: #53616a;
  background: linear-gradient(90deg, #c4dee8, #d8d0e2 64%, #e5e7e8);
  box-shadow: inset 4px 0 0 #5fa6c0;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.10em;
}

.fashion-page .article-grid {
  margin-top: 8px;
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) repeat(2, minmax(180px, 0.6fr));
  gap: 10px;
}

.fashion-page .article-card {
  min-width: 0;
  border: 1px solid #78858d;
  background: #e4e7e8;
  box-shadow:
    inset 1px 1px 0 #fff,
    3px 4px 0 rgba(70, 74, 81, 0.18);
}

.fashion-page .article-card a {
  min-height: 100%;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(250px, 1.1fr);
  color: inherit;
  text-decoration: none;
}

.fashion-page .article-card a:hover {
  opacity: 1;
}

.fashion-page .article-cover {
  min-height: 310px;
  position: relative;
  overflow: hidden;
  border-right: 1px solid #74838c;
  background: #cfd6da;
}

.fashion-page .article-cover img {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  display: block;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.72) contrast(1.01);
}

.fashion-page .article-cover span {
  padding: 4px 7px;
  position: absolute;
  right: 7px;
  bottom: 7px;
  border: 1px solid rgba(255, 255, 255, 0.70);
  color: #fff;
  background: rgba(191, 103, 126, 0.88);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.10em;
}

.fashion-page .article-card-copy {
  padding: clamp(16px, 2.6vw, 28px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.fashion-page .category {
  width: max-content;
  margin: 0 0 14px;
  padding: 4px 7px;
  border: 1px solid #6b8c9c;
  color: #2f4b59;
  background: linear-gradient(180deg, #edf8fb, #bcdde9);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.10em;
}

.fashion-page .article-card h2 {
  margin: 0;
  font-size: clamp(21px, 2.5vw, 34px);
  line-height: 1.35;
  letter-spacing: -0.04em;
}

.fashion-page .description {
  margin: 13px 0 20px;
  color: #53616a;
  font-size: 12px;
  line-height: 1.8;
}

.fashion-page .article-card-copy .ui-action {
  width: 100%;
  margin-top: auto;
}

.fashion-page .article-card.is-soon {
  min-height: 310px;
  padding: 17px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #68737a;
  background:
    repeating-linear-gradient(90deg, rgba(122, 135, 143, 0.08) 0 1px, transparent 1px 9px),
    linear-gradient(135deg, #e5ebed, #ddd4e3);
  box-shadow: inset 4px 0 0 #a38bb5;
}

.fashion-page .soon-number {
  color: #98a3aa;
  font-family: "Courier New", monospace;
  font-size: 52px;
  font-weight: 700;
}

.fashion-page .article-card.is-soon h2 {
  font-size: 18px;
  letter-spacing: 0.04em;
}

@media (max-width: 950px) {
  .fashion-page .fashion-hero {
    grid-template-columns: 1fr;
  }

  .fashion-page .fashion-status {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .fashion-page .fashion-status div {
    grid-template-columns: 1fr;
    justify-items: center;
    border-right: 1px solid #9ba7ad;
    border-bottom: 0;
  }

  .fashion-page .article-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .fashion-page .article-card.is-featured {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .fashion-page .fashion-hero {
    min-height: 0;
    padding: 15px;
  }

  .fashion-page .article-grid,
  .fashion-page .article-card a {
    grid-template-columns: 1fr;
  }

  .fashion-page .article-cover {
    min-height: 360px;
    border-right: 0;
    border-bottom: 1px solid #74838c;
  }

  .fashion-page .article-card.is-soon {
    min-height: 180px;
  }
}


/* =========================
   FLAT LIBRARY PALETTE
   Color blocks replace gradients in the article library.
========================= */

.fashion-page .library-toolbar {
  border-color: #76868e;
  color: #43545d;
  background: #c5d8df;
  box-shadow: inset 4px 0 0 #639db4;
}

.fashion-page .article-card.is-featured,
.fashion-page .article-card.is-featured .article-card-copy {
  background: #e3e7e8;
}

.fashion-page .article-card.is-featured {
  border-color: #74828a;
  box-shadow:
    inset 1px 1px 0 #fff,
    3px 4px 0 rgba(70, 74, 81, 0.16);
}

.fashion-page .category {
  border-color: #6f8f9d;
  color: #2f4c59;
  background: #c9e0e8;
}

.fashion-page .article-card-copy .ui-action {
  border-color: #73828a;
  color: #334650;
  background: #d4e3e8;
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, 0.82),
    0 2px 0 rgba(70, 80, 86, 0.30);
}

.fashion-page .article-card.is-soon {
  border-color: #817b89;
  background: #e1dce6;
  box-shadow: inset 4px 0 0 #9b87ab;
}


/* =========================
   FICTIONAL ARTICLE PLAYER
========================= */

.fashion-player-page .library-toolbar,
.fashion-player-page .article-grid {
  display: none;
}

.fashion-page .fashion-watch {
  margin-top: 18px;
  padding: 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 10px;
  border: 1px solid #4f5960;
  background: #cbd1d5;
  box-shadow:
    inset 1px 1px 0 #fff,
    inset -1px -1px 0 #929ca2,
    0 4px 0 rgba(52, 59, 64, 0.24);
}

.fashion-page .fashion-player {
  min-width: 0;
  border: 1px solid #252b2f;
  color: #eef3f5;
  background: #111416;
  box-shadow: 0 2px 5px rgba(21, 25, 28, 0.38);
}

.fashion-page .fashion-screen {
  aspect-ratio: 16 / 9;
  position: relative;
  overflow: hidden;
  display: block;
  border-bottom: 1px solid #050607;
  color: #fff;
  background: #070809;
  text-decoration: none;
}

.fashion-page .fashion-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.42), transparent 28% 66%, rgba(0, 0, 0, 0.70)),
    linear-gradient(90deg, rgba(6, 7, 8, 0.20), transparent 55%);
  pointer-events: none;
}

.fashion-page .fashion-screen img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(0.82) contrast(1.04);
  transition: filter 150ms ease, transform 300ms ease;
}

.fashion-page .fashion-screen:hover {
  opacity: 1;
}

.fashion-page .fashion-screen:hover img {
  filter: saturate(1) contrast(1.02);
  transform: scale(1.015);
}

.fashion-page .fashion-screen-badge,
.fashion-page .fashion-screen-caption {
  position: absolute;
  z-index: 2;
  font-family: "Courier New", monospace;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.10em;
}

.fashion-page .fashion-screen-badge {
  top: 12px;
  left: 12px;
  padding: 5px 7px;
  border: 1px solid rgba(255, 255, 255, 0.50);
  background: rgba(8, 10, 11, 0.74);
}

.fashion-page .fashion-screen-caption {
  right: 13px;
  bottom: 12px;
  color: #f7f9fa;
}

.fashion-page .fashion-big-play {
  width: 72px;
  height: 72px;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  border: 1px solid #6f7b81;
  border-radius: 50%;
  color: #1e3039;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(183, 209, 220, 0.90));
  box-shadow:
    inset 0 1px 0 #fff,
    0 3px 8px rgba(0, 0, 0, 0.46);
  font-size: 25px;
  transform: translate(-50%, -50%);
  transition: transform 140ms ease;
}

.fashion-page .fashion-screen:hover .fashion-big-play {
  transform: translate(-50%, -50%) scale(1.08);
}

.fashion-page .fashion-player-controls {
  min-height: 39px;
  padding: 5px 8px;
  display: grid;
  grid-template-columns: 30px minmax(90px, 1fr) auto auto;
  align-items: center;
  gap: 9px;
  border-top: 1px solid #7f8b91;
  border-bottom: 1px solid #090b0c;
  background: linear-gradient(180deg, #dce5e9 0%, #9baab1 48%, #6f7e85 52%, #b3c0c6 100%);
}

.fashion-page .fashion-control-play {
  width: 28px;
  height: 25px;
  display: grid;
  place-items: center;
  border: 1px solid #4e6672;
  border-radius: 3px;
  color: #fff;
  background: linear-gradient(180deg, #5bb7df, #177ca9 49%, #0d5f87 52%, #2998c6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
  text-decoration: none;
}

.fashion-page .fashion-control-play:hover {
  opacity: 1;
  filter: brightness(1.08);
}

.fashion-page .fashion-word-track {
  height: 8px;
  overflow: hidden;
  border: 1px solid #505b60;
  border-radius: 999px;
  background: #f3f5f6;
  box-shadow: inset 0 2px 3px rgba(35, 43, 47, 0.34);
}

.fashion-page .fashion-word-track span {
  width: 7%;
  height: 100%;
  display: block;
  border-right: 1px solid #2f667c;
  background: #4aaad0;
}

.fashion-page .fashion-player-controls strong,
.fashion-page .fashion-format {
  color: #18252b;
  font-family: "Courier New", monospace;
  font-size: 9px;
  letter-spacing: 0.06em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.72);
}

.fashion-page .fashion-format {
  padding: 3px 5px;
  border: 1px solid #68767d;
  background: #dfe5e8;
}

.fashion-page .fashion-video-info {
  padding: clamp(17px, 2.6vw, 28px);
}

.fashion-page .fashion-channel-name {
  margin: 0 0 7px;
  color: #6dbbdc;
  font: 700 9px/1.3 "Courier New", monospace;
  letter-spacing: 0.12em;
}

.fashion-page .fashion-video-info h2 {
  max-width: 760px;
  margin: 0;
  color: #fff;
  font-size: clamp(23px, 3vw, 38px);
  line-height: 1.3;
  letter-spacing: -0.04em;
}

.fashion-page .fashion-video-info > p:not(.fashion-channel-name) {
  max-width: 760px;
  margin: 12px 0 17px;
  color: #aeb8bd;
  font-size: 12px;
  line-height: 1.8;
}

.fashion-page .fashion-article-stats {
  margin: 0 0 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.fashion-page .fashion-article-stats div {
  min-width: 142px;
  padding: 7px 9px;
  border: 1px solid #394146;
  background: #1a1f22;
}

.fashion-page .fashion-article-stats dt {
  margin-bottom: 3px;
  color: #77858c;
  font: 700 8px/1 "Courier New", monospace;
}

.fashion-page .fashion-article-stats dd {
  margin: 0;
  color: #d8e1e5;
  font: 700 10px/1.2 "Courier New", monospace;
}

.fashion-page .fashion-read-button {
  width: min(320px, 100%);
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid #648697;
  border-radius: 5px;
  color: #10232c;
  background: linear-gradient(180deg, #f5fbfd 0%, #b9dfe9 47%, #74afc4 52%, #b8dce6 100%);
  box-shadow:
    inset 0 1px 0 #fff,
    0 2px 0 #080a0b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-decoration: none;
}

.fashion-page .fashion-read-button:hover {
  opacity: 1;
  filter: brightness(1.08);
}

.fashion-page .fashion-playlist {
  min-width: 0;
  align-self: start;
  border: 1px solid #5c6870;
  background: #e8edef;
  box-shadow: inset 1px 1px 0 #fff;
}

.fashion-page .fashion-playlist > header {
  min-height: 39px;
  padding: 0 11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #77858d;
  color: #21333c;
  background: linear-gradient(180deg, #f6fbfd, #bfd9e3 48%, #86adbd 52%, #d4e7ed);
  font: 700 10px/1 "Courier New", monospace;
  letter-spacing: 0.10em;
}

.fashion-page .fashion-playlist-item {
  min-height: 82px;
  padding: 8px;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid #a8b2b7;
  color: #25363e;
  background: #eef2f4;
  text-decoration: none;
}

.fashion-page .fashion-playlist-item:last-child {
  border-bottom: 0;
}

.fashion-page .fashion-playlist-item.is-playing {
  background: #cfe6ef;
  box-shadow: inset 4px 0 0 #278eb9;
}

.fashion-page .fashion-playlist-item img {
  width: 92px;
  height: 58px;
  display: block;
  object-fit: cover;
}

.fashion-page .fashion-playlist-item > span:last-child {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.fashion-page .fashion-playlist-item small,
.fashion-page .fashion-playlist-item em {
  font: 700 7px/1.2 "Courier New", monospace;
  letter-spacing: 0.06em;
}

.fashion-page .fashion-playlist-item small {
  color: #2687ad;
}

.fashion-page .fashion-playlist-item b {
  overflow: hidden;
  font-size: 11px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fashion-page .fashion-playlist-item em {
  color: #748187;
  font-style: normal;
}

.fashion-page .fashion-playlist-item.is-soon {
  grid-template-columns: 42px minmax(0, 1fr);
  color: #7b858a;
  background: #dfe4e6;
}

.fashion-page .fashion-playlist-number {
  color: #8c989e;
  font: 700 22px/1 "Courier New", monospace;
  text-align: center;
}

@media (max-width: 900px) {
  .fashion-page .fashion-watch {
    grid-template-columns: 1fr;
  }

  .fashion-page .fashion-playlist {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .fashion-page .fashion-playlist > header {
    grid-column: 1 / -1;
  }

  .fashion-page .fashion-playlist-item {
    min-height: 110px;
    grid-template-columns: 1fr;
    align-content: start;
  }

  .fashion-page .fashion-playlist-item img {
    width: 100%;
    height: 78px;
  }
}

@media (max-width: 620px) {
  .fashion-page .fashion-watch {
    padding: 5px;
  }

  .fashion-page .fashion-player-controls {
    grid-template-columns: 30px minmax(70px, 1fr) auto;
  }

  .fashion-page .fashion-format {
    display: none;
  }

  .fashion-page .fashion-player-controls strong {
    font-size: 8px;
  }

  .fashion-page .fashion-big-play {
    width: 54px;
    height: 54px;
    font-size: 19px;
  }

  .fashion-page .fashion-playlist {
    grid-template-columns: 1fr;
  }
}


/* =========================
   DARK STREAMING PAGE + READABLE HEADING
========================= */

body.subpage.fashion-page {
  background-color: #08090a;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(255, 44, 123, 0.24) 0 1px, transparent 1.3px),
    linear-gradient(145deg, #151719 0%, #08090a 48%, #160a0f 100%);
  background-size: 20px 20px, 100% 100%;
}

.fashion-page .content-window {
  border-color: #34383b;
  background: #0a0c0d;
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, 0.11),
    0 5px 18px rgba(0, 0, 0, 0.50);
}

.fashion-page .content-window-body {
  background: #0a0c0d;
}

.fashion-page .fashion-latest-heading {
  min-height: 72px;
  padding-top: 8px;
  padding-bottom: 8px;
  background: #0b0c0d;
}

@media (max-width: 620px) {
  .fashion-page .fashion-latest-heading h2::after {
    display: none;
  }
}


/* Restore the original Windows shell; keep only the article rail dark. */
body.subpage.fashion-page {
  background-color: #b9b3aa;
  background-image:
    radial-gradient(circle, rgba(53, 43, 38, 0.70) 0 1px, transparent 1.6px),
    linear-gradient(135deg, rgba(225, 239, 246, 0.72), rgba(221, 211, 229, 0.64));
  background-size: 11px 11px, 100% 100%;
}

/* Netflix-like compact row label. */
.fashion-page .fashion-latest-heading {
  min-height: 0;
  padding: 13px 14px 4px;
  display: block;
  border-bottom: 0;
  background: #0d0f10;
}

.fashion-page .fashion-latest-heading h2 {
  margin: 0;
  color: #fff !important;
  font-family: Arial, "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
}

.fashion-page .fashion-latest-rail {
  padding-top: 7px;
}


/* =========================
   FINAL LIGHT ARTICLE LIBRARY
   Keep the streaming layout, but match the silver Vista reader.
========================= */

.fashion-page .fashion-latest {
  border-top-color: #b7c1c6;
  color: #25343c;
  background: #e7ebed;
}

.fashion-page .fashion-latest-heading {
  min-height: 0;
  padding: 12px 14px 5px;
  border-bottom: 0;
  background: transparent;
}

.fashion-page .fashion-latest-heading h2 {
  color: #24323a !important;
  text-shadow: 0 1px 0 #fff !important;
}

/* Last in the cascade: keep the hero photo and featured thumbnail visible. */
body.subpage.fashion-page.fashion-player-page .fashion-hero {
  background-image:
    linear-gradient(90deg, rgba(15, 18, 20, 0.76) 0%, rgba(22, 25, 27, 0.50) 39%, rgba(25, 27, 29, 0.06) 73%, rgba(18, 21, 23, 0.17) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.01) 48%, rgba(12, 16, 18, 0.45) 100%),
    url("../images/free-skater-venice.webp") !important;
}

.fashion-page .fashion-stream-card.is-live .fashion-stream-cover img {
  position: relative;
  z-index: 0;
  opacity: 1 !important;
  filter: saturate(1) brightness(1.06) contrast(1.02) !important;
}

.fashion-page .fashion-stream-card.is-live .fashion-stream-cover::after {
  z-index: 1;
  background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, 0.48) 100%) !important;
}

.fashion-page .fashion-stream-card.is-live .fashion-card-mark,
.fashion-page .fashion-stream-card.is-live .fashion-stream-cover > strong {
  z-index: 2;
}


/* =========================
   FASHION CHANNEL STRIP + LIGHT ARTICLE LIBRARY
========================= */

body.subpage.fashion-page.fashion-player-page .fashion-hero {
  background-image:
    linear-gradient(90deg, rgba(17, 20, 23, 0.82) 0%, rgba(25, 28, 31, 0.62) 39%, rgba(30, 31, 32, 0.10) 73%, rgba(21, 24, 26, 0.24) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.01) 46%, rgba(17, 20, 22, 0.55) 100%),
    url("../images/free-skater-venice.webp");
}

.fashion-page .fashion-channel-strip {
  min-height: 42px;
  margin: -1px 0 0;
  padding: 0 10px;
  position: relative;
  z-index: 6;
  display: grid;
  grid-template-columns: 0.58fr 1.25fr 1.08fr 1.18fr 1.12fr;
  align-items: stretch;
  border-top: 1px solid #ff9aac;
  border-right: 1px solid #761122;
  border-bottom: 5px solid #690d1e;
  border-left: 1px solid #761122;
  border-radius: 3px 3px 2px 2px;
  color: #fff;
  background:
    linear-gradient(180deg, #ff5471 0%, #e9163b 44%, #bf0c2b 48%, #dc1438 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.58),
    inset 0 -1px 0 rgba(81, 3, 22, 0.72),
    0 3px 0 rgba(59, 65, 68, 0.30);
  transform: translateY(-1px);
}

.fashion-page .fashion-channel-strip::before {
  content: "";
  height: 5px;
  position: absolute;
  top: 3px;
  right: 10px;
  left: 10px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  filter: blur(2px);
  pointer-events: none;
}

.fashion-page .fashion-channel-strip strong,
.fashion-page .fashion-channel-strip span {
  min-width: 0;
  padding: 0 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: 1px solid rgba(104, 0, 20, 0.55);
  font-family: Impact, "Arial Black", sans-serif;
  font-size: clamp(9px, 1.05vw, 13px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.045em;
  white-space: nowrap;
  text-shadow: 0 2px 0 #781026;
  transform: skewX(-2deg);
}

.fashion-page .fashion-channel-strip strong {
  margin: 0 -1px 0 -10px;
  border-left: 0;
  color: #ffdae3;
  background: rgba(91, 0, 20, 0.35);
  font-size: clamp(12px, 1.3vw, 17px);
}

.fashion-page .fashion-latest {
  padding-bottom: 18px;
  border-top: 0;
  background:
    repeating-linear-gradient(90deg, transparent 0 21px, rgba(55, 67, 73, 0.055) 21px 22px),
    #c7cdd0;
}

.fashion-page .fashion-latest-heading {
  margin: 0 12px;
  padding: 12px 3px 6px;
  border-bottom: 1px solid #7b858a;
}

.fashion-page .fashion-latest-heading h2 {
  font-size: 18px !important;
  letter-spacing: 0.035em !important;
}

.fashion-page .fashion-latest-rail {
  padding: 9px 13px 12px;
  gap: 13px;
}

.fashion-page .fashion-stream-card {
  border-color: #707a7f;
  background: #f0f2f2;
  box-shadow:
    inset 1px 1px 0 #fff,
    3px 4px 0 rgba(74, 80, 84, 0.24);
}

.fashion-page .fashion-stream-card.is-live {
  border-top: 4px solid #c72e6c;
  background: #f7f4f5;
}

.fashion-page .fashion-stream-card.is-soon {
  border-top: 4px solid #8b969b;
  background: #e2e6e7;
}

.fashion-page .fashion-stream-card-body {
  background: #f3f4f4;
}

.fashion-page .fashion-stream-card.is-live .fashion-stream-card-body {
  background: #fff8fa;
}

.fashion-page .fashion-stream-card.is-soon .fashion-stream-card-body {
  background: #e6eaeb;
}

.fashion-page .fashion-unavailable-thumb {
  background:
    repeating-linear-gradient(90deg, transparent 0 19px, rgba(70, 82, 88, 0.10) 19px 20px),
    repeating-linear-gradient(0deg, transparent 0 19px, rgba(70, 82, 88, 0.08) 19px 20px),
    #d2d8da;
}

@media (max-width: 760px) {
  .fashion-page .fashion-channel-strip {
    min-height: 38px;
    padding: 0;
    grid-template-columns: repeat(5, minmax(105px, 1fr));
    overflow-x: auto;
    scrollbar-width: thin;
  }

  .fashion-page .fashion-channel-strip strong,
  .fashion-page .fashion-channel-strip span {
    padding: 0 8px;
    font-size: 9px;
  }

  .fashion-page .fashion-channel-strip strong {
    margin-left: 0;
    font-size: 12px;
  }
}


/* The feature keeps its streaming mood without becoming a separate black box. */
body.subpage.fashion-page.fashion-player-page .fashion-hero {
  min-height: 380px;
  border-color: #596268;
  background-color: #30383d;
  background-image:
    linear-gradient(90deg, rgba(30, 36, 40, 0.88) 0%, rgba(38, 42, 46, 0.76) 38%, rgba(42, 45, 48, 0.24) 72%, rgba(32, 37, 40, 0.42) 100%),
    linear-gradient(180deg, rgba(99, 128, 141, 0.06) 43%, rgba(28, 34, 37, 0.68) 100%),
    url("../images/free-skater-venice.webp");
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, 0.44),
    inset 0 -12px 22px rgba(25, 31, 34, 0.24),
    0 5px 0 rgba(68, 78, 84, 0.30);
}

@media (max-width: 760px) {
  body.subpage.fashion-page.fashion-player-page .fashion-hero {
    min-height: 360px;
  }
}


/* Light streaming library: Vista silver instead of black cards. */
.fashion-page .fashion-latest {
  border-top-color: #bac3c8;
  color: #25343c;
  background: #e7ebed;
}

.fashion-page .fashion-latest-heading {
  background: transparent;
}

.fashion-page .fashion-latest-heading h2 {
  color: #24323a !important;
}

.fashion-page .fashion-latest-rail {
  scrollbar-color: #7a8a92 #d7dee1;
}

.fashion-page .fashion-stream-card {
  border-color: #6f7b81;
  color: #24323a;
  background: #eef2f4;
  box-shadow:
    inset 1px 1px 0 #fff,
    4px 5px 0 rgba(73, 83, 89, 0.20);
}

.fashion-page .fashion-stream-card:hover {
  box-shadow:
    inset 1px 1px 0 #fff,
    5px 8px 0 rgba(73, 83, 89, 0.18);
}

.fashion-page .fashion-card-controls > a,
.fashion-page .fashion-card-controls > button {
  border-color: #708087;
  color: #33454e;
  background: #f8fafb;
}

.fashion-page .fashion-unavailable-thumb span {
  border-color: #839198;
  color: #738087;
  background: rgba(255, 255, 255, 0.35);
}

.fashion-page .fashion-unavailable-thumb b {
  color: #596970;
}

.fashion-page .fashion-stream-card.is-soon .fashion-stream-cover strong,
.fashion-page .fashion-stream-card.is-soon .fashion-card-mark {
  color: #5e6b71;
  text-shadow: 0 1px 0 #fff;
}


/* =========================
   STREAMING POLISH + WORKING ACTIONS
========================= */

.fashion-page .fashion-hero-play {
  background: #fff200;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 3px 0 rgba(0, 0, 0, 0.62);
}

.fashion-page .fashion-hero-play:hover {
  background: #fff86b;
}

.fashion-page .fashion-hero-add.is-active,
.fashion-page .fashion-hero-rate.is-active {
  border-color: #ff4f9b !important;
  color: #fff;
  background: #ff267f;
}

.fashion-page .fashion-latest {
  margin-top: 0;
  border-top: 5px solid #090a0b;
  color: #fff;
  background: #0d0f10;
}

.fashion-page .fashion-latest-heading {
  min-height: 82px;
  position: relative;
  align-items: center;
  border-bottom: 1px solid #292c2e;
  background: #111314;
}

.fashion-page .fashion-latest-heading::before {
  content: "";
  width: 6px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 2px;
  background: #ff267f;
  box-shadow: 2px 0 0 #7d0b39;
}

.fashion-page .fashion-latest-heading h2 {
  margin-right: auto;
  color: #f5f5f5;
  font-family: Arial, "Yu Gothic", sans-serif;
  font-size: clamp(31px, 4.4vw, 51px);
  font-weight: 900;
  letter-spacing: -0.07em;
  text-shadow: 0 2px 0 #000;
}

.fashion-page .fashion-latest-heading span {
  color: #ff4f9b;
}

.fashion-page .fashion-latest-rail {
  padding-top: 16px;
  padding-bottom: 20px;
  scrollbar-color: #565b5e #181a1b;
}

.fashion-page .fashion-stream-card {
  border-color: #35393b;
  box-shadow: 4px 5px 0 rgba(0, 0, 0, 0.52);
}

.fashion-page .fashion-stream-card:hover {
  box-shadow: 5px 9px 0 rgba(0, 0, 0, 0.44);
}

.fashion-page .fashion-stream-card h3 a {
  color: inherit;
  text-decoration: none;
}

.fashion-page .fashion-stream-card h3 a:hover {
  color: #ff72ae;
  opacity: 1;
}

.fashion-page .fashion-card-controls > a,
.fashion-page .fashion-card-controls > button {
  width: 23px;
  height: 23px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid #8e969a;
  border-radius: 50%;
  color: #f5f5f5;
  background: transparent;
  box-shadow: none;
  font: 700 13px/1 Arial, sans-serif;
  text-decoration: none;
}

.fashion-page .fashion-card-controls > a:hover,
.fashion-page .fashion-card-controls > button:hover {
  border-color: #fff;
  opacity: 1;
  background: rgba(255, 255, 255, 0.14);
}

.fashion-page .fashion-card-controls .js-article-toggle.is-active {
  border-color: #ff4f9b;
  color: #fff;
  background: #ff267f;
}

.fashion-page .fashion-card-controls > button:disabled {
  border-color: #555b5e;
  color: #73797c;
  background: transparent;
  opacity: 0.52;
  cursor: not-allowed;
}

.fashion-page .fashion-unavailable-thumb {
  width: 100%;
  height: 100%;
  padding: 24px 15px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: #80878b;
  background:
    repeating-linear-gradient(90deg, transparent 0 19px, rgba(255, 255, 255, 0.045) 19px 20px),
    repeating-linear-gradient(0deg, transparent 0 19px, rgba(255, 255, 255, 0.035) 19px 20px),
    #222628;
  text-align: center;
}

.fashion-page .fashion-unavailable-thumb span {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  border: 1px solid #697176;
  border-radius: 4px;
  color: #9aa1a5;
  font: 400 24px/1 Arial, sans-serif;
}

.fashion-page .fashion-unavailable-thumb b {
  color: #aeb4b7;
  font-size: 10px;
  font-weight: 600;
}

.fashion-page .fashion-unavailable-thumb small {
  color: #6e7579;
  font: 700 7px/1 "Courier New", monospace;
  letter-spacing: 0.12em;
}

.fashion-page .fashion-stream-card.is-soon {
  opacity: 1;
}

.fashion-page .fashion-stream-card.is-soon .fashion-stream-cover strong {
  color: #d7dce0;
  font-size: 38px;
  text-shadow: 0 2px 0 #111;
}

.fashion-action-toast {
  max-width: calc(100vw - 30px);
  padding: 11px 16px;
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 9999;
  border: 1px solid #7c8589;
  border-radius: 4px;
  color: #fff;
  background: #16191b;
  box-shadow: 0 5px 18px rgba(0, 0, 0, 0.42);
  font-size: 12px;
  font-weight: 700;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.fashion-action-toast::before {
  content: "OH MY ZINE";
  margin-right: 9px;
  color: #ff4f9b;
  font: 800 8px/1 "Courier New", monospace;
  letter-spacing: 0.10em;
}

.fashion-action-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 620px) {
  .fashion-page .fashion-latest-heading {
    min-height: 67px;
  }

  .fashion-page .fashion-latest-heading::before {
    width: 4px;
    height: 33px;
  }
}


/* Final streaming surface overrides. Keep after the legacy card rules. */
body.subpage.fashion-page {
  background-color: #08090a;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(255, 44, 123, 0.24) 0 1px, transparent 1.3px),
    linear-gradient(145deg, #151719 0%, #08090a 48%, #160a0f 100%);
  background-size: 20px 20px, 100% 100%;
}

.fashion-page .content-window,
.fashion-page .content-window-body {
  background: #0a0c0d;
}

.fashion-page .content-window {
  border-color: #34383b;
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, 0.11),
    0 5px 18px rgba(0, 0, 0, 0.50);
}

.fashion-page .fashion-latest-heading {
  min-height: 72px;
  padding-top: 8px;
  padding-bottom: 8px;
  align-items: center;
  background: #0b0c0d;
}

.fashion-page .fashion-latest-heading h2 {
  color: #fff !important;
  font-family: "Arial Black", "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif !important;
  font-size: clamp(28px, 3.7vw, 44px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: -0.055em !important;
  text-shadow: 0 2px 0 #000 !important;
}

.fashion-page .fashion-latest-heading h2::after {
  content: "NEW";
  margin-left: 12px;
  display: inline-block;
  color: #ff2d7f;
  font: 800 8px/1 "Courier New", monospace;
  letter-spacing: 0.16em;
  vertical-align: middle;
}

.fashion-page .fashion-latest-heading span {
  color: #b9bec1;
}

@media (max-width: 620px) {
  .fashion-page .fashion-latest-heading h2::after {
    display: none;
  }
}


/* =========================
   STREAMING-SHOW HERO
========================= */

body.subpage.fashion-page.fashion-player-page .fashion-hero {
  min-height: 430px;
  padding: clamp(24px, 4vw, 48px);
  display: flex;
  align-items: flex-end;
  border-color: #2b2529;
  background-position: center, center, center 72%;
  background-size: cover;
}

body.subpage.fashion-page.fashion-player-page .fashion-hero::before,
body.subpage.fashion-page.fashion-player-page .fashion-hero::after {
  display: none;
}

body.subpage.fashion-page.fashion-player-page .fashion-hero-copy {
  width: min(590px, 62%);
  padding: 20px 0 3px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

body.subpage.fashion-page.fashion-player-page .fashion-hero h1[data-material-heading="rhinestone"] {
  width: max-content;
  min-height: 0;
  margin: 16px 0 14px;
  justify-content: flex-start;
  font-size: clamp(54px, 7.6vw, 100px);
  filter: saturate(0.94);
}

body.subpage.fashion-page.fashion-player-page .fashion-status,
body.subpage.fashion-page.fashion-player-page .fashion-file-label {
  display: none;
}

.fashion-page .fashion-stream-meta {
  margin: 0 0 15px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: #d8dcde;
  font-size: 11px;
  font-weight: 700;
  text-shadow: 0 1px 2px #000;
}

.fashion-page .fashion-stream-meta strong {
  color: #4dd383;
}

.fashion-page .fashion-stream-meta b {
  padding: 2px 4px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  font-size: 9px;
}

.fashion-page .fashion-hero-actions {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.fashion-page .fashion-hero-actions a,
.fashion-page .fashion-hero-actions button {
  min-height: 38px;
  border: 0;
  color: #fff;
  font-family: Arial, sans-serif;
  font-weight: 700;
  text-decoration: none;
}

.fashion-page .fashion-hero-play {
  padding: 0 17px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border-radius: 5px;
  color: #111 !important;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.34);
}

.fashion-page .fashion-hero-play:hover {
  opacity: 1;
  background: #d8d8d8;
}

.fashion-page .fashion-hero-add,
.fashion-page .fashion-hero-rate {
  width: 38px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.70) !important;
  border-radius: 50%;
  background: rgba(20, 20, 20, 0.68);
  box-shadow: none;
  font-size: 20px;
}

.fashion-page .fashion-hero-add:hover,
.fashion-page .fashion-hero-rate:hover {
  background: rgba(255, 255, 255, 0.18);
}

.fashion-page .fashion-stream-tags {
  margin: 0 0 10px;
  color: #f2f2f2;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-shadow: 0 1px 3px #000;
}

body.subpage.fashion-page.fashion-player-page .fashion-hero-copy > p:last-child {
  max-width: 520px;
  margin: 0;
  color: #d5d8da;
  font-size: 12px;
  line-height: 1.7;
  text-shadow: 0 1px 3px #000;
}

@media (max-width: 760px) {
  body.subpage.fashion-page.fashion-player-page .fashion-hero {
    min-height: 390px;
    padding: 20px;
    background-position: 64% center;
  }

  body.subpage.fashion-page.fashion-player-page .fashion-hero-copy {
    width: 78%;
  }

  body.subpage.fashion-page.fashion-player-page .fashion-hero h1[data-material-heading="rhinestone"] {
    font-size: clamp(44px, 14vw, 74px);
  }
}

@media (max-width: 520px) {
  body.subpage.fashion-page.fashion-player-page .fashion-hero {
    min-height: 370px;
    background-position: 69% center;
  }

  body.subpage.fashion-page.fashion-player-page .fashion-hero-copy {
    width: 100%;
  }

  .fashion-page .fashion-stream-tags,
  body.subpage.fashion-page.fashion-player-page .fashion-hero-copy > p:last-child {
    max-width: 84%;
  }
}


/* =========================
   STREAMING HOME / LATEST RAIL
========================= */

body.subpage.fashion-page.fashion-player-page .fashion-hero {
  background-image:
    linear-gradient(90deg, rgba(5, 6, 8, 0.96) 0%, rgba(8, 9, 11, 0.88) 36%, rgba(8, 9, 11, 0.30) 70%, rgba(8, 9, 11, 0.55) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.06) 42%, rgba(0, 0, 0, 0.82) 100%),
    url("../images/free-skater-venice.webp");
  background-position: center, center, center 66%;
  background-size: cover;
}

.fashion-player-page .fashion-watch {
  display: none;
}

.fashion-page .fashion-latest {
  margin-top: 12px;
  padding: 0 0 19px;
  overflow: hidden;
  border-top: 1px solid #c6ccd0;
  background: #e7ebed;
}

@media (max-width: 700px) {
  .fashion-page .fashion-latest-heading {
    min-height: 56px;
    align-items: center;
  }

  .fashion-page .fashion-latest-heading h2 {
    font-size: 22px;
  }

  .fashion-page .fashion-latest-heading span {
    max-width: 46%;
    font-size: 8px;
    line-height: 1.35;
    text-align: right;
  }

  .fashion-page .fashion-latest-rail {
    scroll-snap-type: x proximity;
    scroll-padding-left: 12px;
  }

  .fashion-page .fashion-stream-card {
    scroll-snap-align: start;
  }

  .fashion-page .fashion-card-controls > a,
  .fashion-page .fashion-card-controls > button {
    width: 34px;
    height: 34px;
    font-size: 15px;
  }

  .fashion-page .fashion-card-controls .is-play {
    font-size: 12px;
  }

  .fashion-page .fashion-unavailable-thumb b {
    font-size: 11px;
  }

  .fashion-page .fashion-unavailable-thumb small,
  .fashion-page .fashion-card-tags {
    font-size: 9px;
    line-height: 1.45;
  }
}

.fashion-page .fashion-latest-heading {
  min-height: 68px;
  padding: 9px 14px 5px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}

.fashion-page .fashion-latest-heading h2 {
  margin: 0;
  color: #151719;
  font-family: Georgia, "Yu Mincho", serif;
  font-size: clamp(32px, 5vw, 58px);
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: -0.08em;
}

.fashion-page .fashion-latest-heading span {
  padding-bottom: 4px;
  color: #68737a;
  font: 700 8px/1 "Courier New", monospace;
  letter-spacing: 0.12em;
  white-space: nowrap;
}

.fashion-page .fashion-latest-rail {
  padding: 7px 14px 12px;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(250px, 286px);
  gap: 12px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x proximity;
  scrollbar-color: #68747a #d6dcdf;
  scrollbar-width: thin;
}

.fashion-page .fashion-stream-card {
  min-width: 0;
  overflow: hidden;
  scroll-snap-align: start;
  border: 1px solid #101214;
  border-radius: 5px;
  color: #f4f4f4;
  background: #121415;
  box-shadow: 4px 5px 0 rgba(51, 57, 61, 0.20);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.fashion-page .fashion-stream-card:hover {
  transform: translateY(-4px);
  box-shadow: 5px 9px 0 rgba(51, 57, 61, 0.18);
}

.fashion-page .fashion-stream-card > a {
  color: inherit;
  text-decoration: none;
}

.fashion-page .fashion-stream-card > a:hover {
  opacity: 1;
}

.fashion-page .fashion-stream-cover {
  height: 158px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid #050606;
  background: #222;
}

.fashion-page .fashion-stream-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.04) 35%, rgba(0, 0, 0, 0.72) 100%);
  pointer-events: none;
}

.fashion-page .fashion-stream-cover img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(0.88) contrast(1.04);
  transition: transform 260ms ease, filter 180ms ease;
}

.fashion-page .fashion-stream-card:hover .fashion-stream-cover img {
  filter: saturate(1.03) contrast(1.05);
  transform: scale(1.025);
}

.fashion-page .fashion-card-mark {
  position: absolute;
  top: 9px;
  left: 9px;
  z-index: 2;
  color: #ff2f86;
  font: 900 13px/1 Arial, sans-serif;
  letter-spacing: -0.06em;
}

.fashion-page .fashion-stream-cover strong {
  max-width: 90%;
  position: absolute;
  right: 10px;
  bottom: 10px;
  left: 10px;
  z-index: 2;
  overflow: hidden;
  color: #ff3a8e;
  font-family: Arial Black, Arial, sans-serif;
  font-size: clamp(20px, 2.5vw, 28px);
  line-height: 0.95;
  letter-spacing: -0.06em;
  text-shadow: 0 2px 0 #370015, 2px 0 0 #370015;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fashion-page .fashion-stream-card-body {
  min-height: 151px;
  padding: 10px 11px 12px;
}

.fashion-page .fashion-card-controls {
  min-height: 25px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.fashion-page .fashion-card-controls > span {
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  border: 1px solid #8e969a;
  border-radius: 50%;
  color: #f5f5f5;
  font-size: 13px;
}

.fashion-page .fashion-card-controls .is-play {
  border-color: #fff;
  color: #111;
  background: #fff;
  font-size: 10px;
}

.fashion-page .fashion-card-controls small {
  margin-left: auto;
  color: #aeb4b7;
  font: 700 8px/1 "Courier New", monospace;
}

.fashion-page .fashion-stream-card h3 {
  min-height: 36px;
  margin: 0 0 8px;
  overflow: hidden;
  color: #fff;
  font-size: 14px;
  line-height: 1.35;
}

.fashion-page .fashion-card-meta,
.fashion-page .fashion-card-tags {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  color: #aeb4b7;
  font-size: 9px;
  line-height: 1.45;
}

.fashion-page .fashion-card-meta b,
.fashion-page .fashion-card-meta em {
  padding: 2px 4px;
  border: 1px solid #697176;
  color: #d9dcde;
  font-style: normal;
}

.fashion-page .fashion-card-meta b {
  color: #ff4f9b;
}

.fashion-page .fashion-card-tags {
  margin-top: 8px;
  color: #d3d5d6;
}

.fashion-page .fashion-stream-card.is-soon {
  opacity: 0.86;
}

.fashion-page .fashion-stream-card.is-soon .fashion-stream-cover img {
  filter: saturate(0.48) brightness(0.72) contrast(1.08);
}

.fashion-page .fashion-stream-card.is-soon .fashion-stream-cover strong,
.fashion-page .fashion-stream-card.is-soon .fashion-card-mark {
  color: #d7dce0;
  text-shadow: 0 2px 0 #24282b;
}

@media (max-width: 620px) {
  .fashion-page .fashion-latest-heading {
    min-height: 59px;
    padding-right: 9px;
    padding-left: 9px;
  }

  .fashion-page .fashion-latest-heading span {
    display: none;
  }

  .fashion-page .fashion-latest-rail {
    padding-right: 9px;
    padding-left: 9px;
    grid-auto-columns: minmax(235px, 78vw);
  }
}


/* Final shell and light article library. */
body.subpage.fashion-page.fashion-player-page .fashion-hero {
  min-height: 380px;
  border-color: #596268;
  background-color: #30383d;
  background-image:
    linear-gradient(90deg, rgba(30, 36, 40, 0.88) 0%, rgba(38, 42, 46, 0.76) 38%, rgba(42, 45, 48, 0.24) 72%, rgba(32, 37, 40, 0.42) 100%),
    linear-gradient(180deg, rgba(99, 128, 141, 0.06) 43%, rgba(28, 34, 37, 0.68) 100%),
    url("../images/free-skater-venice.webp");
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, 0.44),
    inset 0 -12px 22px rgba(25, 31, 34, 0.24),
    0 5px 0 rgba(68, 78, 84, 0.30);
}

@media (max-width: 760px) {
  body.subpage.fashion-page.fashion-player-page .fashion-hero {
    min-height: 360px;
  }
}

body.subpage.fashion-page {
  background-color: #b9b3aa;
  background-image:
    radial-gradient(circle, rgba(53, 43, 38, 0.70) 0 1px, transparent 1.6px),
    linear-gradient(135deg, rgba(225, 239, 246, 0.72), rgba(221, 211, 229, 0.64));
  background-size: 11px 11px, 100% 100%;
}

.fashion-page .content-window {
  border-color: #596268;
  background: #d8dcde;
  box-shadow:
    inset 1px 1px 0 #fff,
    4px 5px 0 rgba(50, 53, 55, 0.20);
}

.fashion-page .content-window-body {
  background:
    repeating-linear-gradient(90deg, rgba(80, 87, 91, 0.04) 0 1px, transparent 1px 11px),
    #e7ebed;
}

.fashion-page .fashion-stream-cover {
  display: block;
}

.fashion-page .fashion-latest {
  border-top-color: #b7c1c6;
  color: #25343c;
  background: #e7ebed;
}

.fashion-page .fashion-latest-heading {
  min-height: 0;
  padding: 12px 14px 5px;
  display: block;
  border-bottom: 0;
  background: transparent;
}

.fashion-page .fashion-latest-heading::before,
.fashion-page .fashion-latest-heading h2::after,
.fashion-page .fashion-latest-heading span {
  display: none;
}

.fashion-page .fashion-latest-heading h2 {
  margin: 0;
  color: #24323a !important;
  font-family: Arial, "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-shadow: 0 1px 0 #fff !important;
}

.fashion-page .fashion-latest-rail {
  padding-top: 7px;
  scrollbar-color: #7a8a92 #d7dee1;
}

.fashion-page .fashion-stream-card {
  border-color: #6f7b81;
  color: #24323a;
  background: #eef2f4;
  box-shadow: inset 1px 1px 0 #fff, 4px 5px 0 rgba(73, 83, 89, 0.20);
}

.fashion-page .fashion-stream-card:hover {
  box-shadow: inset 1px 1px 0 #fff, 5px 8px 0 rgba(73, 83, 89, 0.18);
}

.fashion-page .fashion-stream-card-body {
  border-top: 1px solid #aab5ba;
  background: #edf1f3;
}

.fashion-page .fashion-card-controls > a,
.fashion-page .fashion-card-controls > button,
.fashion-page .fashion-card-controls > span {
  border-color: #708087;
  color: #33454e;
  background: #f8fafb;
}

.fashion-page .fashion-card-controls > a:hover,
.fashion-page .fashion-card-controls > button:hover {
  border-color: #3e89a8;
  color: #173746;
  background: #d8edf5;
}

.fashion-page .fashion-card-controls .is-play {
  border-color: #4f859b;
  color: #fff;
  background: #56a9cc;
}

.fashion-page .fashion-card-controls > button:disabled {
  border-color: #a3adb2;
  color: #899499;
  background: #dce2e5;
}

.fashion-page .fashion-card-controls small {
  color: #69767d;
}

.fashion-page .fashion-stream-card h3,
.fashion-page .fashion-stream-card h3 a {
  color: #24323a;
}

.fashion-page .fashion-card-meta,
.fashion-page .fashion-card-tags {
  color: #52636c;
}

.fashion-page .fashion-card-meta b,
.fashion-page .fashion-card-meta em {
  border-color: #86959c;
  color: #42555e;
  background: #f8fafb;
}

.fashion-page .fashion-card-meta b {
  color: #c72e6c;
}

.fashion-page .fashion-unavailable-thumb {
  color: #718087;
  background:
    repeating-linear-gradient(90deg, transparent 0 19px, rgba(74, 91, 100, 0.09) 19px 20px),
    repeating-linear-gradient(0deg, transparent 0 19px, rgba(74, 91, 100, 0.07) 19px 20px),
    #d7dde0;
}

.fashion-page .fashion-unavailable-thumb span {
  border-color: #839198;
  color: #738087;
  background: rgba(255, 255, 255, 0.42);
}

.fashion-page .fashion-unavailable-thumb b,
.fashion-page .fashion-stream-card.is-soon .fashion-stream-cover strong,
.fashion-page .fashion-stream-card.is-soon .fashion-card-mark {
  color: #596970;
  text-shadow: 0 1px 0 #fff;
}

.fashion-page .fashion-unavailable-thumb small {
  color: #78868c;
}
