.genre-page{background:var(--dark-base);min-height:100vh}.genre-mobile-pills{border-bottom:1px solid var(--border);background:var(--dark-card);scrollbar-width:none;display:none;overflow-x:auto}.genre-mobile-pills::-webkit-scrollbar{display:none}.genre-layout{grid-template-columns:200px 1fr;min-height:calc(100vh - 60px);display:grid}.genre-sidebar{background:var(--dark-card);border-right:1px solid var(--border);height:fit-content;max-height:calc(100vh - 60px);padding:20px 10px;position:sticky;top:60px;overflow-y:auto}.genre-sidebar-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px;padding:0 10px;font-size:10px;font-weight:700}.genre-sidebar-item{color:var(--text-tertiary);background:0 0;border:1px solid #0000;border-radius:9px;align-items:center;gap:8px;margin-bottom:2px;padding:9px 10px;font-size:13px;font-weight:400;text-decoration:none;transition:all .15s;display:flex}.genre-sidebar-item:hover{color:var(--text-secondary);background:#ffffff0a}.genre-sidebar-item.active{background:color-mix(in srgb,var(--gc,var(--primary-blue))18%,transparent);border-color:color-mix(in srgb,var(--gc,var(--primary-blue))33%,transparent);color:var(--gc,var(--primary-blue));font-weight:600}.genre-sidebar-icon{font-size:16px;line-height:1}.genre-main{min-width:0}.genre-hero{border-bottom:1px solid var(--border);background:linear-gradient(160deg,color-mix(in srgb,var(--gc,var(--primary-blue))6%,transparent),var(--dark-base)100%);padding:40px 32px;position:relative;overflow:hidden}.genre-glow-blob{background:radial-gradient(circle,color-mix(in srgb,var(--gc,var(--primary-blue))16%,transparent),transparent 70%);pointer-events:none;border-radius:50%;width:180px;height:180px;position:absolute;top:-40px;right:-40px}.genre-hero-icon{margin-bottom:10px;font-size:44px;line-height:1}.genre-title{font-family:var(--font-display);letter-spacing:-.04em;color:var(--text-primary);margin:0 0 8px;font-size:clamp(1.6rem,3vw,2rem);font-weight:800}.genre-description{color:var(--text-secondary);max-width:500px;margin:0 0 18px;font-size:.94rem;line-height:1.65}.genre-stats{gap:20px;display:flex}.genre-stat-value{font-family:var(--font-display);letter-spacing:-.03em;font-size:1.1rem;font-weight:800;display:block}.genre-stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.625rem;display:block}.genre-body{padding:28px 32px 4rem}.genre-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem;margin-bottom:3rem;display:grid}.genre-card{border:1px solid var(--border);color:inherit;background:#ffffff08;border-radius:12px;gap:1rem;padding:1.25rem;text-decoration:none;transition:background .2s,border-color .2s,transform .15s;display:flex}.genre-card:hover{background:#ffffff0f;border-color:#3b82f64d;transform:translateY(-2px)}.genre-card-cover{border-radius:8px;flex-shrink:0;width:100px;overflow:hidden}.genre-card-cover img{width:100%;height:auto;display:block}.genre-card-title{color:var(--text-primary);margin-bottom:.25rem;font-size:1.0625rem;font-weight:700;line-height:1.3}.genre-card-author{color:var(--text-muted);margin-bottom:.5rem;font-size:.8125rem}.genre-card-meta{color:var(--text-muted);gap:.75rem;margin-bottom:.5rem;font-size:.8125rem;display:flex}.genre-card-desc{color:var(--text-secondary);margin:0;font-size:.8125rem;line-height:1.5}.genre-empty{text-align:center;color:var(--text-muted);padding:4rem 0}.genre-empty p{margin-bottom:1.5rem;font-size:1.125rem}@media (max-width:768px){.genre-mobile-pills{flex-wrap:nowrap;gap:6px;padding:12px 16px;display:flex}.genre-pill{border:1px solid var(--border);color:var(--text-tertiary);white-space:nowrap;background:0 0;border-radius:999px;flex-shrink:0;align-items:center;gap:6px;padding:8px 14px;font-size:13px;font-weight:400;text-decoration:none;transition:all .15s;display:inline-flex}.genre-pill.active{background:color-mix(in srgb,var(--gc,var(--primary-blue))18%,transparent);border-color:color-mix(in srgb,var(--gc,var(--primary-blue))44%,transparent);color:var(--gc,var(--primary-blue));font-weight:600}.genre-pill-icon{font-size:16px}.genre-layout{display:block}.genre-sidebar{display:none}.genre-hero{padding:20px 16px}.genre-hero-icon{margin-bottom:8px;font-size:32px}.genre-title{font-size:1.5rem}.genre-body{padding:16px 16px 3rem}.genre-grid{grid-template-columns:1fr}.genre-card-cover{width:80px}}.genre-controls{border:1px solid var(--border,#ffffff12);border-radius:var(--radius-lg,16px);-webkit-backdrop-filter:blur(8px);background:#12131c99;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:20px;padding:12px 14px;display:flex}.genre-select{color:var(--text-primary,#fff);border:1px solid var(--border-mid,#ffffff1f);border-radius:var(--radius-md,10px);cursor:pointer;appearance:none;background:#ffffff0a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237b7e9a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") right 10px center no-repeat;outline:none;min-height:38px;padding:8px 32px 8px 12px;font-family:inherit;font-size:13px;font-weight:500;transition:border-color .15s,background-color .15s}.genre-select:hover,.genre-select:focus{background-color:#ffffff0f;border-color:#3b82f680}.genre-select option{color:#fff;background:#12131c}.genre-result-count{color:var(--text-tertiary,#7b7e9a);white-space:nowrap;margin-left:auto;font-size:13px;font-weight:500}@media (max-width:480px){.genre-controls{gap:8px;padding:10px 12px}.genre-select{flex:1;min-width:0;padding:8px 28px 8px 10px;font-size:12px}.genre-result-count{text-align:right;flex-basis:100%;margin-left:0}}