.genre-filter-panel { overflow: hidden; border-radius: 5px; border-top: 3px solid #fea410; }
.genre-filter-title { margin: 0; font-size: 30px; }
.genre-filter-panel a { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 9px 16px; color: #f5f3fa; font-size: 15px; line-height: 1.45; overflow-wrap: anywhere; }
.genre-filter-panel a:hover, .genre-filter-panel a:focus-visible { background: #ffffff12; color: #fff; }
.genre-filter-panel a.active { background: #fea410; color: #241e17; font-weight: 800; }
.genre-filter-all { border-bottom: 1px solid #ffffff26; }
.genre-filter-group { padding: 13px 0; border-bottom: 1px solid #ffffff20; }
.genre-filter-group:last-child { border-bottom: 0; }
.genre-filter-group h3 { padding: 0 16px 6px; margin: 0; font-size: 22px; color: #fff0d4; }
.genre-filter-group ul { list-style: none; padding: 0; margin: 0; }
.genre-filter-count { flex: 0 0 auto; font-size: 14px; opacity: .85; }
.mobile-genre-filter { border: 1px solid #ffffff30; border-radius: 5px; background: #34324c; color: #fff; }
.mobile-genre-filter > summary { padding: 14px 16px; font-size: 17px; font-weight: 800; cursor: pointer; }
.mobile-genre-filter > summary > span { display: inline-block; margin-left: 10px; color: #e7d9bd; font-size: 15px; font-weight: 600; }
.mobile-genre-filter > summary:focus-visible { outline: 2px solid #fea410; outline-offset: 2px; }
.mobile-genre-filter .genre-filter-title { display: none; }
.mobile-genre-filter .genre-filter-panel > .p-3 { display: none; }
