/* Category 49 owns this component. The legacy genres.css file is not loaded here. */
.mzk-genres-page .mzk-main-in {
  width: 100%;
  min-width: 0;
}

.mzk-genres-page .mzk-genres {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 24px 32px 52px;
  color: #f4f7fa;
}

.mzk-genres-page .mzk-genres-symbols {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.mzk-genres-page .mzk-genres-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 22px;
  color: #728093;
  font-size: 13px;
}

.mzk-genres-page .mzk-genres-breadcrumbs a {
  color: #a3adba;
  text-decoration: none;
}

.mzk-genres-page .mzk-genres-breadcrumbs a:hover {
  color: #ffa200;
}

.mzk-genres-page .mzk-page-head {
  margin: 0 0 28px;
}

.mzk-genres-page .mzk-page-head__title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: #f4f7fa;
  font-size: clamp(28px, 2.4vw, 38px);
  font-weight: 800;
  line-height: 1.15;
}

.mzk-genres-page .mzk-page-head__title svg {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  fill: none;
  stroke: #ffa200;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mzk-genres-page .mzk-page-head__desc {
  max-width: 760px;
  margin: 10px 0 0;
  color: #a3adba;
  font-size: 15px;
  line-height: 1.65;
}

.mzk-genres-page .mzk-genres__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  scroll-margin-top: 84px;
}

.mzk-genres-page .mzk-genres-card {
  position: relative;
  display: block;
  min-width: 0;
  min-height: 148px;
  padding: 20px;
  overflow: hidden;
  color: #f4f7fa;
  background: #0d1926;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
  text-decoration: none;
  isolation: isolate;
  transition: background-color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.mzk-genres-page .mzk-genres-card::before {
  position: absolute;
  right: -44px;
  bottom: -72px;
  z-index: -1;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,162,0,.15) 0, rgba(255,162,0,.055) 42%, transparent 70%);
  content: "";
  transition: opacity .18s ease, transform .18s ease;
}

.mzk-genres-page .mzk-genres-card::after {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ffa200;
  box-shadow: 0 0 0 5px rgba(255,162,0,.09);
  content: "";
}

.mzk-genres-page .mzk-genres-card__content {
  position: relative;
  z-index: 2;
  display: flex;
  min-width: 0;
  height: 108px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding-right: 56px;
}

.mzk-genres-page .mzk-genres-card__name {
  display: -webkit-box;
  max-width: 100%;
  overflow: hidden;
  color: #f7f9fb;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.25;
  letter-spacing: -.015em;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.mzk-genres-page .mzk-genres-card__count {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  gap: 8px;
  color: #91a0b2;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

.mzk-genres-page .mzk-genres-card__count-dot {
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  border-radius: 50%;
  background: #ffa200;
}

.mzk-genres-page .mzk-genres-card__visual {
  position: absolute;
  right: 15px;
  bottom: 12px;
  z-index: 1;
  display: grid;
  width: 68px;
  height: 68px;
  place-items: center;
  color: rgba(255,162,0,.62);
  transform: rotate(-7deg);
  transition: color .18s ease, transform .18s ease;
}

.mzk-genres-page .mzk-genres-card__visual svg {
  width: 54px;
  height: 54px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mzk-genres-page .mzk-genres-card:hover,
.mzk-genres-page .mzk-genres-card:focus-visible {
  color: #f4f7fa;
  background: #112131;
  border-color: rgba(255,162,0,.34);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 14px 30px rgba(0,0,0,.2);
  transform: translateY(-3px);
  outline: 0;
}

.mzk-genres-page .mzk-genres-card:hover::before,
.mzk-genres-page .mzk-genres-card:focus-visible::before {
  transform: scale(1.12);
}

.mzk-genres-page .mzk-genres-card:hover .mzk-genres-card__visual,
.mzk-genres-page .mzk-genres-card:focus-visible .mzk-genres-card__visual {
  color: #ffa200;
  transform: rotate(0) scale(1.06);
}

.mzk-genres-page .mzk-genres-card:focus-visible {
  box-shadow: 0 0 0 3px rgba(255,162,0,.18), 0 14px 30px rgba(0,0,0,.2);
}

.mzk-genres-page .mzk-genres-card:active {
  transform: scale(.98);
}
.mzk-genres-page .mzk-ptl-section{margin-top:42px}
.mzk-genres-page .mzk-ptl__title{margin:0 0 20px;color:#f4f7fa;font-size:20px;font-weight:750;line-height:1.3}
.mzk-genres-page .mzk-genres-popular__controls{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.mzk-genres-page .mzk-genres-filter{display:flex;min-width:0;align-items:center;gap:8px;overflow-x:auto;padding:2px;scrollbar-width:none}
.mzk-genres-page .mzk-genres-filter::-webkit-scrollbar{display:none}
.mzk-genres-page .mzk-genres-filter button{display:inline-flex;min-height:44px;flex:0 0 auto;align-items:center;justify-content:center;gap:8px;padding:0 17px;color:#a3adba;background:#0d1926;border:1px solid rgba(255,255,255,.08);border-radius:22px;font:inherit;font-size:14px;font-weight:650;cursor:pointer;transition:color .16s ease,background-color .16s ease,border-color .16s ease}
.mzk-genres-page .mzk-genres-filter button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.mzk-genres-page .mzk-genres-filter button:hover,.mzk-genres-page .mzk-genres-filter button:focus-visible{color:#f4f7fa;background:#142230;border-color:rgba(255,162,0,.28);outline:0}
.mzk-genres-page .mzk-genres-filter button.is-active{color:#111;background:#ffa200;border-color:#ffa200}
.mzk-genres-page .mzk-genres-sort{position:relative;display:block;flex:0 0 190px}
.mzk-genres-page .mzk-genres-sort select{width:100%;height:44px;padding:0 42px 0 16px;color:#f4f7fa;background:#0d1926;border:1px solid rgba(255,255,255,.08);border-radius:12px;font:inherit;font-size:14px;font-weight:650;appearance:none;cursor:pointer}
.mzk-genres-page .mzk-genres-sort select:focus{border-color:#ffa200;outline:2px solid rgba(255,162,0,.14);outline-offset:1px}
.mzk-genres-page .mzk-genres-sort select option{color:#f4f7fa;background:#0d1926}
.mzk-genres-page .mzk-genres-sort>svg{position:absolute;top:50%;right:14px;width:18px;height:18px;fill:none;stroke:#a3adba;stroke-width:2;transform:translateY(-50%);pointer-events:none}
.mzk-genres-page .mzk-genres-track-list{min-width:0}
.mzk-genres-page .mzk-ptl-panel:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.mzk-genres-page .mzk-ptl-panel[hidden]{display:none!important}
.mzk-genres-page .mzk-genres-track-row .mzk-tl-actions{display:none}
.mzk-genres-page .mzk-genres-track-row:hover .mzk-tl-duration,.mzk-genres-page .mzk-genres-track-row:focus-within .mzk-tl-duration{opacity:1}
.mzk-genres-page .mzk-ptl-more{display:flex;width:max-content;min-height:46px;align-items:center;justify-content:center;gap:8px;margin:20px auto 0;padding:0 22px;color:#ffa200;background:#0d1926;border:1px solid rgba(255,162,0,.24);border-radius:24px;text-decoration:none}
.mzk-genres-page .mzk-ptl-more:hover,.mzk-genres-page .mzk-ptl-more:focus-visible{color:#111;background:#ffa200;border-color:#ffa200;outline:0}
.mzk-genres-page .mzk-ptl-more svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.mzk-genres-page .mzk-ptl-empty{color:#a3adba;background:#0d1926}
.mzk-genres-page .mzk-genres-guide{position:relative;overflow:hidden;margin-top:36px;padding:0;color:#a3adba;background:transparent;border:0;border-radius:0;box-shadow:none;transition:max-height .22s ease}
.mzk-genres-page .mzk-genres-guide[data-catalog-seo-ready="1"]{padding-bottom:64px}
.mzk-genres-page .mzk-genres-guide__intro{padding:0;background:transparent;border:0}
.mzk-genres-page .mzk-genres-guide h2{margin:0;color:#f4f7fa;font-size:20px;font-weight:750;line-height:1.35}
.mzk-genres-page .mzk-genres-guide h3{margin:0;color:#f4f7fa;font-size:16px;font-weight:700}
.mzk-genres-page .mzk-genres-guide p,.mzk-genres-page .mzk-genres-guide li{color:#a3adba;font-size:14px;line-height:1.7}
.mzk-genres-page .mzk-genres-guide__intro>p{margin:10px 0 0}
.mzk-genres-page .mzk-genres-seo__columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-top:22px}
.mzk-genres-page .mzk-genres-seo__section{min-width:0;padding:2px 28px 2px 0;background:transparent;border:0;border-radius:0}
.mzk-genres-page .mzk-genres-seo__section+.mzk-genres-seo__section{padding-right:0;padding-left:28px;border-left:1px solid rgba(255,255,255,.07)}
.mzk-genres-page .mzk-genres-seo__section>p{margin:8px 0 0}
.mzk-genres-page .mzk-genres-seo__list,.mzk-genres-page .mzk-genres-seo__steps{display:grid;gap:12px;margin:16px 0 0;padding:0;list-style:none}
.mzk-genres-page .mzk-genres-seo__list li,.mzk-genres-page .mzk-genres-seo__steps li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:start}
.mzk-genres-page .mzk-genres-seo__icon,.mzk-genres-page .mzk-genres-seo__steps>li>span{display:grid;width:34px;height:34px;place-items:center;color:#ffa200;background:rgba(255,162,0,.07);border:1px solid rgba(255,162,0,.14);border-radius:10px;font-size:12px;font-weight:700}
.mzk-genres-page .mzk-genres-seo__icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.mzk-genres-page .mzk-genres-seo__item-title{display:block;color:#f4f7fa;font-weight:700;line-height:1.4}
.mzk-genres-page .mzk-genres-seo__list p,.mzk-genres-page .mzk-genres-seo__steps p{margin:3px 0 0}
.mzk-genres-page .mzk-genres-seo__note{margin:20px 0 0;padding:0;color:#a3adba;background:transparent;border:0;border-radius:0}
.mzk-genres-page .mzk-genres-seo__note a{color:#ffa200}
.mzk-genres-page .mzk-genres-guide.mzk-catalog-seo--collapsed{max-height:300px}
.mzk-genres-page .mzk-genres-guide.mzk-catalog-seo--collapsed::after{position:absolute;right:0;bottom:0;left:0;z-index:1;height:116px;background:linear-gradient(transparent,var(--color-bg-app) 68%);content:"";pointer-events:none}
.mzk-genres-page .mzk-genres-guide .mzk-catalog-seo-toggle{position:absolute;right:50%;bottom:18px;z-index:2;display:inline-flex;min-height:44px;align-items:center;gap:7px;padding:0 18px;color:#ffa200;background:#111f2d;border:1px solid rgba(255,162,0,.24);border-radius:22px;transform:translateX(50%);cursor:pointer}
.mzk-genres-page .mzk-genres-guide .mzk-catalog-seo-toggle:hover,.mzk-genres-page .mzk-genres-guide .mzk-catalog-seo-toggle:focus-visible{color:#111;background:#ffa200;border-color:#ffa200;outline:0}
.mzk-genres-page .mzk-genres-guide .mzk-catalog-seo-toggle svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s ease}
.mzk-genres-page .mzk-genres-guide .mzk-catalog-seo-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
@media(max-width:1199px){.mzk-genres-page .mzk-genres{padding-inline:24px}.mzk-genres-page .mzk-genres__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1023px){.mzk-genres-page .mzk-genres-popular__controls{align-items:stretch;flex-direction:column}.mzk-genres-page .mzk-genres-sort{width:190px;flex-basis:auto}}
@media(max-width:767px){.mzk-genres-page .mzk-genres{padding:18px 16px calc(96px + env(safe-area-inset-bottom))}.mzk-genres-page .mzk-genres-breadcrumbs{margin-bottom:18px}.mzk-genres-page .mzk-page-head{margin-bottom:22px}.mzk-genres-page .mzk-page-head__title{font-size:27px}.mzk-genres-page .mzk-page-head__title svg{width:26px;height:26px}.mzk-genres-page .mzk-genres__grid{grid-template-columns:minmax(0,1fr);gap:8px;padding:0}.mzk-genres-page .mzk-genres-card{display:grid;width:100%;height:78px;min-height:78px;grid-template-columns:54px minmax(0,1fr) 24px;grid-template-rows:1fr;align-items:center;column-gap:13px;padding:11px 13px;border-radius:14px}.mzk-genres-page .mzk-genres-card::before{display:none}.mzk-genres-page .mzk-genres-card::after{top:50%;right:17px;width:9px;height:9px;border-top:2px solid #7f8da0;border-right:2px solid #7f8da0;border-radius:0;background:transparent;box-shadow:none;transform:translateY(-50%) rotate(45deg)}.mzk-genres-page .mzk-genres-card__content{position:static;display:flex;width:auto;height:auto;min-width:0;grid-column:2;grid-row:1;align-items:flex-start;justify-content:center;gap:3px;padding:0}.mzk-genres-page .mzk-genres-card__name{display:block;width:100%;margin:0;padding:0;overflow:hidden;font-size:16px;line-height:1.3;text-align:left;white-space:nowrap;text-overflow:ellipsis;-webkit-line-clamp:1}.mzk-genres-page .mzk-genres-card__count{display:inline-flex;min-height:0;margin:0;font-size:13px;line-height:1.25;text-align:left}.mzk-genres-page .mzk-genres-card__count-dot{display:none}.mzk-genres-page .mzk-genres-card__visual{position:static;width:54px;height:54px;grid-column:1;grid-row:1;flex:none;border:1px solid rgba(255,162,0,.14);border-radius:14px;color:#ffa200;background:rgba(255,162,0,.07);transform:none}.mzk-genres-page .mzk-genres-card__visual svg{width:29px;height:29px;stroke-width:1.8}.mzk-genres-page .mzk-genres-card:hover .mzk-genres-card__visual,.mzk-genres-page .mzk-genres-card:focus-visible .mzk-genres-card__visual{transform:none}.mzk-genres-page .mzk-ptl-section{margin-top:34px}.mzk-genres-page .mzk-genres-popular__controls{display:flex;width:100%;min-width:0;gap:12px}.mzk-genres-page .mzk-genres-filter{display:grid;width:100%;min-width:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;padding:0;overflow:visible;scroll-snap-type:none}.mzk-genres-page .mzk-genres-filter button{width:100%;min-width:0;min-height:44px;padding:0 10px;border-radius:12px;scroll-snap-align:none}.mzk-genres-page .mzk-genres-filter button:first-child{grid-column:1/-1}.mzk-genres-page .mzk-genres-sort{width:100%}.mzk-genres-page .mzk-genres-guide{margin-top:30px;padding:0}.mzk-genres-page .mzk-genres-guide[data-catalog-seo-ready="1"]{padding-bottom:64px}.mzk-genres-page .mzk-genres-seo__columns{grid-template-columns:minmax(0,1fr);gap:20px}.mzk-genres-page .mzk-genres-seo__section,.mzk-genres-page .mzk-genres-seo__section+.mzk-genres-seo__section{padding:0;border-left:0}.mzk-genres-page .mzk-genres-seo__section+.mzk-genres-seo__section{padding-top:20px;border-top:1px solid rgba(255,255,255,.07)}.mzk-genres-page .mzk-genres-guide.mzk-catalog-seo--collapsed{max-height:280px}}
@media(max-width:359px){.mzk-genres-page .mzk-genres{padding-inline:12px}.mzk-genres-page .mzk-genres__grid{gap:8px}.mzk-genres-page .mzk-genres-card{height:72px;min-height:72px;grid-template-columns:50px minmax(0,1fr) 24px;column-gap:11px;padding:10px 11px}.mzk-genres-page .mzk-genres-card::after{right:14px}.mzk-genres-page .mzk-genres-card__visual{width:50px;height:50px}.mzk-genres-page .mzk-genres-card__visual svg{width:27px;height:27px}.mzk-genres-page .mzk-genres-card__name{font-size:15px}}
@media(prefers-reduced-motion:reduce){.mzk-genres-page .mzk-genres-card,.mzk-genres-page .mzk-genres-card__visual,.mzk-genres-page .mzk-catalog-seo-toggle svg{transition:none}}
