.genre-discipline{position:relative;isolation:isolate;min-height:260px;margin-top:1.5rem;padding:clamp(1.5rem,4vw,3.5rem);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2rem;background:linear-gradient(110deg,#141222 0 75%,#5b2da7 75%);border:3px solid #e0d9ec;box-shadow:12px 12px 0 #000;overflow:hidden}.genre-discipline:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.13;background:repeating-linear-gradient(115deg,transparent 0 20px,#fff 21px 22px)}.genre-discipline h1{margin:.2rem 0 .5rem;color:#fff5dc;font:italic 900 clamp(3.8rem,8vw,7rem)/.78 var(--theme-font-heading);text-transform:uppercase;text-shadow:6px 6px 0 #000}.genre-discipline div>p:last-child{max-width:38rem;color:#b9c0d0}.genre-discipline aside{position:relative;z-index:2;min-width:170px;padding:1rem;background:#080a10;border:2px solid #e0d9ec;box-shadow:7px 7px 0 #9b5cff;text-align:center;transform:skewX(-5deg)}.genre-discipline aside span,.genre-discipline aside small{display:block;font-size:.58rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.genre-discipline aside span{color:#b688ff}.genre-discipline aside strong{display:block;color:#fff;font:italic 900 4rem/.9 var(--theme-font-heading)}.genre-discipline aside small{color:#8993a8}.genre-discipline>b{position:absolute;right:-.1em;bottom:-.3em;color:#ffffff0a;font:italic 900 13rem/1 var(--theme-font-heading);text-transform:uppercase}
.genre-catalogue{padding-top:3rem}.genre-catalogue__toolbar{display:flex;align-items:end;justify-content:space-between;gap:1.5rem;margin-bottom:1.5rem;padding:1rem;background:#111521;border:2px solid #4e4265;border-left:6px solid #9b5cff;box-shadow:8px 8px 0 #000}.genre-catalogue__toolbar>div p{margin:0;color:#b688ff;font-size:.58rem;font-weight:900;letter-spacing:.16em}.genre-catalogue__toolbar h2{margin:.15rem 0 0;color:#fff5dc;font:italic 900 clamp(1.7rem,3vw,2.7rem)/.9 var(--theme-font-heading);text-transform:uppercase}.genre-catalogue .genre-sort{display:flex;align-items:end;gap:.55rem;margin:0}.genre-catalogue .genre-sort label{display:grid;gap:.3rem;color:#aab2c5;font-size:.65rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.genre-catalogue .genre-sort select{min-width:220px;min-height:48px;padding:.65rem 2.6rem .65rem .8rem;border:2px solid #69738a;border-radius:0;background-color:#0a0d15;color:#f6edd8;box-shadow:4px 4px 0 #9b5cff;color-scheme:dark;font-weight:800;cursor:pointer}.genre-catalogue .genre-sort select:hover{border-color:#b688ff;background-color:#151a28}.genre-catalogue .genre-sort select:focus-visible{outline:3px solid #f4bd34;outline-offset:3px}.genre-catalogue .genre-sort select option{background:#101521;color:#f6edd8;padding:.55rem}.genre-catalogue .genre-sort select option:checked{background:#5b2da7;color:#fff}.genre-catalogue .genre-sort button{min-height:48px;display:grid;align-content:center;padding:.45rem 1rem;border:2px solid #d9ddea;border-radius:0;background:#9b5cff;color:#fff;box-shadow:4px 4px 0 #ed224b;font:italic 900 .95rem var(--theme-font-heading);text-transform:uppercase}.genre-catalogue .genre-sort button small{color:#ddd0f5;font:800 .5rem sans-serif;letter-spacing:.15em}.genre-catalogue>.manga-grid{padding:1rem;background:linear-gradient(135deg,#111521,#090b11);border:1px solid #4e4265;box-shadow:9px 9px 0 #000}
@media(max-width:46rem){.genre-discipline{grid-template-columns:1fr;min-height:auto;padding:1.4rem}.genre-discipline h1{font-size:4rem}.genre-discipline aside{justify-self:start;display:flex;align-items:center;gap:.6rem;min-width:0}.genre-discipline aside strong{font-size:2rem}.genre-discipline aside small{display:none}.genre-catalogue__toolbar{display:grid;align-items:stretch}.genre-catalogue .genre-sort{display:grid;grid-template-columns:1fr auto}.genre-catalogue .genre-sort label{min-width:0}.genre-catalogue .genre-sort select{width:100%;min-width:0}.genre-catalogue .genre-sort button{min-width:105px}}
@media(max-width:30rem){.genre-discipline h1{font-size:3.2rem}.genre-catalogue{width:calc(100% - 1rem)}.genre-catalogue__toolbar{padding:.75rem}.genre-catalogue .genre-sort{grid-template-columns:1fr}.genre-catalogue .genre-sort button{width:100%}}