/* Exact approved-reference logo/banner regions; image pixels remain unedited. */
:root{font-family:'Segoe UI',Arial,sans-serif;--ink:#2c1248;--purple:#7932df}
.hj-header{min-height:74px;padding:5px 36px;gap:38px;flex-wrap:nowrap}
.hj-header .hj-logo,.hj-footer .hj-logo{width:226px;height:64px}
.hj-logo img{width:1536px;height:1024px;left:-42px;top:-5px}
.hj-nav{gap:36px}.hj-nav a{font-size:17px;font-weight:700}
.hj-search{width:314px;flex-shrink:0}.hj-search button{font-size:14px;min-height:36px}
.hj-banner{height:11.13vw;min-height:140px;max-height:210px}
.hj-banner img{width:100vw;height:auto;left:0;top:-4.753vw}
.catalog-main{max-width:none;padding:0 36px;position:relative}
.catalog-main .categories{padding-right:360px;margin:20px 0 16px;gap:7px;flex-wrap:wrap}
.catalog-main .categories a{border:1px solid #e6ddf2;box-shadow:none;border-radius:24px;padding:9px 18px;font-size:14px;min-height:40px;background:#ffffffd9;font-weight:650}
.catalog-main .categories a[aria-current]{background:var(--purple);color:white;border-color:var(--purple)}
.catalog-main .categories a span{display:none}
.catalog-main .rankbar{position:absolute;right:36px;top:0;padding:0;border:0;margin:0}
.catalog-main .rankbar>a{display:none}
.catalog-main .periods{border:1px solid #dfd2ee;border-radius:24px;background:#fff;gap:0;padding:0;overflow:hidden}
.catalog-main .periods a{padding:10px 18px;font-size:14px;min-height:40px}
.catalog-main .periods a[aria-current]{background:var(--purple);color:white;border-radius:24px}
.catalog-main .sectionhead{margin:0 0 10px;align-items:center;gap:12px}
.catalog-main .sectionhead>div{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap}
.catalog-main .sectionhead h2{font-size:28px;letter-spacing:-.8px;line-height:1.2;margin:0;font-weight:850}
.catalog-main .sectionhead p{font-size:14px;line-height:1.4;margin:0;color:#746287;max-width:550px}
.catalog-main .sort{padding:0;background:transparent;gap:4px}.catalog-main .sort a{font-size:14px;padding:8px 12px;min-height:40px}
.catalog-main .results{font-size:14px;margin:0 0 10px;color:#665378}
.catalog-main .notice{font-size:14px;padding:10px 16px;margin:10px 0}
.catalog-main .grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px 12px;align-items:start}
.compact-card{display:block!important;border:0;border-radius:0;background:transparent!important;box-shadow:none!important;overflow:visible;min-width:0;transition:transform .18s}
.card-visual{position:relative;aspect-ratio:1.5;isolation:isolate}
.compact-card .art{display:block;padding:0;aspect-ratio:1.5;border-radius:15px;overflow:hidden;background:#dfcff5}
.compact-card .art img{width:100%;height:100%;object-fit:cover;border-radius:15px}
.rich-thumb{display:block;width:100%;height:100%;background-image:url('/assets/genre-atlas-v2-optimized.webp');background-size:600% 400%;background-repeat:no-repeat}
.compact-card .cardbody{padding:5px 6px 0;display:block;height:auto}
.compact-card h3{font-size:14px;line-height:1.3;margin:0;font-weight:750;letter-spacing:0;overflow-wrap:anywhere}
.compact-card h3 a{color:var(--ink);text-decoration:none}
.compact-meta{display:flex;justify-content:space-between;gap:4px;font-size:12px;color:#665478;line-height:1.5;margin-top:2px}
.compact-card .play{position:absolute;right:6px;bottom:6px;padding:7px 13px;min-height:40px;width:auto;font-size:14px;line-height:24px;border-radius:20px;border:2px solid #fff;color:white;background:#7430d8;box-shadow:0 2px 7px #29134840;opacity:0;transform:none;margin:0;z-index:2}
.card-info,.card-report{position:absolute;top:5px;width:40px;height:40px;border-radius:50%;background:#ffffffed;display:grid;place-items:center;text-decoration:none;color:#45255f;font-size:18px;font-weight:800;opacity:0;z-index:2}.card-info{right:5px}.card-report{left:5px}
.compact-card:hover .play,.compact-card:focus-within .play,.compact-card:hover .card-info,.compact-card:focus-within .card-info,.compact-card:hover .card-report,.compact-card:focus-within .card-report{opacity:1}
.compact-card:hover .art{box-shadow:0 5px 18px #7546b544;transform:translateY(-2px)}
.catalog-main .meet{margin-top:30px;padding:20px 26px;border-radius:18px}.catalog-main .meet h2{font-size:22px}
@media(max-width:1250px){.hj-header{gap:20px;padding:5px 24px}.hj-nav{gap:18px}.hj-search{width:260px}.catalog-main{padding:0 24px}.catalog-main .grid{grid-template-columns:repeat(6,minmax(0,1fr))}.catalog-main .categories{padding-right:0}.catalog-main .rankbar{position:static;margin:8px 0 12px}.hj-banner img{width:1250px;left:calc(50% - 625px);top:-59.4px}.hj-banner{height:140px}}
@media(max-width:1000px){.hj-header{flex-wrap:wrap;gap:4px 20px}.hj-header .hj-search{width:100%;order:3}.hj-nav{margin-left:auto;gap:14px}.catalog-main .grid{grid-template-columns:repeat(4,minmax(0,1fr))}.catalog-main .sectionhead>div{gap:6px}.hj-banner{height:140px}}
@media(max-width:600px){.hj-header{padding:4px 14px 8px;gap:0 12px}.hj-header .hj-logo{width:170px;height:48px}.hj-header .hj-logo img{width:1152px;height:768px;left:-31.5px;top:-3.75px}.hj-nav{width:100%;justify-content:space-between;gap:4px;order:2}.hj-nav a{font-size:14px;min-height:40px;padding:8px 2px}.hj-header .hj-search{margin-top:4px}.hj-search input[type=search]{min-height:34px}.hj-banner{height:120px;min-height:120px}.hj-banner img{width:1080px;left:calc(50% - 590px);top:-51.3px}.catalog-main{padding:0 12px}.catalog-main .categories{margin:12px 0 10px;gap:6px}.catalog-main .categories a{padding:8px 13px;min-height:40px}.catalog-main .sectionhead{align-items:flex-start}.catalog-main .sectionhead h2{font-size:24px}.catalog-main .sectionhead p{display:block;font-size:14px;line-height:1.35}.catalog-main .sort{flex-shrink:0;flex-direction:column}.catalog-main .sort a{padding:6px 10px}.catalog-main .periods a{padding:10px 16px}.catalog-main .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}.compact-card .cardbody{padding:5px 2px 0}.compact-card h3{font-size:14px}.compact-meta{font-size:12px}.compact-card .play{opacity:1;min-height:40px;padding:6px 10px;bottom:4px;right:4px;font-size:14px}.card-info{opacity:1;width:40px;height:40px}.card-report{opacity:1;width:40px;height:40px}.catalog-main .meet{padding:16px}.hj-footer{padding:20px 14px}}
@media(prefers-reduced-motion:reduce){.compact-card,.compact-card .art{transition:none;transform:none!important}}

.thumb-0{background-position:0% 0.0%}
.thumb-1{background-position:20% 0.0%}
.thumb-2{background-position:40% 0.0%}
.thumb-3{background-position:60% 0.0%}
.thumb-4{background-position:80% 0.0%}
.thumb-5{background-position:100% 0.0%}
.thumb-6{background-position:0% 33.333333333333336%}
.thumb-7{background-position:20% 33.333333333333336%}
.thumb-8{background-position:40% 33.333333333333336%}
.thumb-9{background-position:60% 33.333333333333336%}
.thumb-10{background-position:80% 33.333333333333336%}
.thumb-11{background-position:100% 33.333333333333336%}
.thumb-12{background-position:0% 66.66666666666667%}
.thumb-13{background-position:20% 66.66666666666667%}
.thumb-14{background-position:40% 66.66666666666667%}
.thumb-15{background-position:60% 66.66666666666667%}
.thumb-16{background-position:80% 66.66666666666667%}
.thumb-17{background-position:100% 66.66666666666667%}
.thumb-18{background-position:0% 100.0%}
.thumb-19{background-position:20% 100.0%}
.thumb-20{background-position:40% 100.0%}
.thumb-21{background-position:60% 100.0%}
.thumb-22{background-position:80% 100.0%}
.thumb-23{background-position:100% 100.0%}

.languages{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:8px 0}.languages a{font-size:14px;min-width:42px;min-height:40px;display:grid;place-items:center;background:#fff;border:1px solid #dfd2ee;border-radius:20px;text-decoration:none}.languages a[aria-current]{background:#7932df;color:#fff}.languages>span{font-size:14px;color:#665378}.language-badges{display:inline-flex;gap:3px}.language-badges>span{background:#eee3ff;border-radius:5px;padding:0 4px;color:#482565;font-size:14px;font-weight:700}.compact-meta{font-size:14px;flex-wrap:wrap}.detail-art{aspect-ratio:1.5;overflow:hidden;border-radius:20px}.detail-art img{width:100%;height:100%;object-fit:cover}.catalog-main .notice br{display:none}

.sample-rich{aspect-ratio:1.5;height:auto}.card-ad-summary{font-size:14px;line-height:1.4}

.catalog-main .sectionhead .sort{display:none}.catalog-main .sectionhead{display:block}.catalog-main .sectionhead>div{display:flex}.compact-card .cardbody .language-badges{flex-shrink:0}

.content-note{font-size:14px;color:#6a326f;display:inline-block;line-height:1.5;text-underline-offset:3px}

.access-notice{font-size:14px;line-height:1.4;margin:4px 0;color:#68356b}

.genre-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}.genre-grid .cardbody{padding:16px}.genre-grid h2{font-size:1.25rem}.genre-grid .art{display:block;aspect-ratio:3/2;overflow:hidden}.genre-grid img{width:100%;height:100%;object-fit:cover}
