/* Drama catalog shares the Donghua catalog's typography, grid and poster rhythm. */
#ax-drama:not(.ax-drama--detail){padding:0 0 48px}
#ax-drama:not(.ax-drama--detail) .ax-drama-heading{margin:var(--ax-space-4) 0 var(--ax-space-5);gap:16px}
#ax-drama:not(.ax-drama--detail) .ax-drama-heading>div{width:100%;min-width:0}
#ax-drama:not(.ax-drama--detail) .ax-drama-heading-line{justify-content:space-between;gap:16px}
#ax-drama:not(.ax-drama--detail) .ax-drama-heading h1{font-size:var(--ax-fs-2xl);font-weight:800;line-height:1.1;letter-spacing:-.02em;margin:0;text-wrap:balance}
#ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools{padding:0;border:0;border-radius:0;background:transparent;gap:8px;margin:0 0 20px;align-items:center}
#ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools .ax-drama-source{display:block!important;flex:0 1 auto;margin:0!important;min-width:0}
#ax-drama:not(.ax-drama--detail) .ax-drama-browse-tools{flex:0 1 auto;margin:0;gap:8px;max-width:100%}
#ax-drama:not(.ax-drama--detail) .ax-drama-browse-tools label{display:block;flex:0 1 auto;min-width:0;max-width:100%}
#ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools select{width:auto;max-width:100%;min-height:40px;padding:8px 14px!important;border:1px solid var(--ax-border-strong);border-radius:var(--ax-radius-pill)!important;background:var(--ax-tint);color:var(--ax-text-primary);font-size:var(--ax-fs-md);line-height:1.4}
#ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools select:focus-visible{outline:2px solid var(--ax-focus);outline-offset:3px}
#ax-drama:not(.ax-drama--detail) .ax-drama-group{margin:0 0 var(--ax-space-6)}
#ax-drama:not(.ax-drama--detail) #drama-results>.ax-drama-group:only-child>h2{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#ax-drama:not(.ax-drama--detail) .ax-drama-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ax-space-4)}
#ax-drama:not(.ax-drama--detail) .ax-drama-poster{aspect-ratio:var(--ax-poster-ratio);border-radius:var(--ax-radius);box-shadow:var(--ax-shadow-card)}
#ax-drama:not(.ax-drama--detail) .ax-drama-poster img{object-fit:cover}
#ax-drama:not(.ax-drama--detail) .ax-drama-card h3{margin:10px 4px 0;text-align:center;font-size:var(--ax-fs-sm);font-weight:700;line-height:1.4;min-height:2.8em}
#ax-drama:not(.ax-drama--detail) .ax-drama-card a:hover h3{color:var(--ax-accent-text)}
#ax-drama:not(.ax-drama--detail) .ax-drama-tag{inset:10px;display:block;pointer-events:none}
#ax-drama:not(.ax-drama--detail) .ax-drama-tag span{position:absolute;max-width:100%;padding:4px 8px;border:1px solid rgba(255,255,255,.75);border-radius:var(--ax-radius-pill);background:rgba(8,13,8,.86);color:#f2f8ed;font-size:12px;font-weight:800;line-height:1.2;white-space:nowrap}
#ax-drama:not(.ax-drama--detail) .ax-drama-tag span:first-child{top:0;right:0}
#ax-drama:not(.ax-drama--detail) .ax-drama-tag span+span{bottom:0;left:0}
#ax-drama:not(.ax-drama--detail) .ax-drama-history{margin-top:var(--ax-space-7);padding-top:var(--ax-space-5);border-top:1px solid var(--ax-border)}
@media(min-width:640px){#ax-drama:not(.ax-drama--detail) .ax-drama-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:900px){#ax-drama:not(.ax-drama--detail) .ax-drama-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(min-width:1200px){#ax-drama:not(.ax-drama--detail) .ax-drama-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--ax-space-5)}}
@media(max-width:639px){
 #ax-drama:not(.ax-drama--detail) .ax-drama-grid{gap:14px 8px}
 #ax-drama:not(.ax-drama--detail) .ax-drama-heading-line{align-items:center;gap:10px}
 #ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools{gap:8px}
 #ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools select{font-size:13px;min-height:38px;padding:7px 10px!important}
 #ax-drama:not(.ax-drama--detail) .ax-drama-card h3{margin:7px 2px 0;font-size:12px;line-height:1.25;min-height:2.5em}
 #ax-drama:not(.ax-drama--detail) .ax-drama-tag{inset:6px}
 #ax-drama:not(.ax-drama--detail) .ax-drama-tag span{font-size:10px;padding:3px 5px}
}
@media(max-width:359px){
 #ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools{flex-direction:row;align-items:center}
 #ax-drama:not(.ax-drama--detail) .ax-drama-heading h1{font-size:var(--ax-fs-2xl)}
}

/* Compact catalog filters; title search is provided by the header. */
#ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools{display:flex;flex-wrap:wrap;gap:10px}
#ax-drama:not(.ax-drama--detail) .ax-drama-platform-filter{flex:0 1 170px;width:170px;max-width:100%;min-width:0}
#ax-drama:not(.ax-drama--detail) .ax-drama-platform-filter select{width:100%;text-overflow:ellipsis}
.ax-drama-actions button:disabled{opacity:.65;cursor:wait}
@media(max-width:639px){
 #ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools{display:grid;grid-template-columns:max-content minmax(0,160px);gap:8px}
 #ax-drama:not(.ax-drama--detail) .ax-drama-catalog-tools .ax-drama-source select{width:100%}
 #ax-drama:not(.ax-drama--detail) .ax-drama-platform-filter{width:100%;max-width:160px}
 #ax-drama:not(.ax-drama--detail) .ax-drama-browse-tools{grid-column:1/-1}
 #ax-drama:not(.ax-drama--detail) .ax-drama-heading-line{flex-wrap:wrap}
 #ax-drama:not(.ax-drama--detail) .ax-drama-heading h1{flex:1 1 200px}
}

@media(max-width:359px){#ax-drama:not(.ax-drama--detail) .ax-drama-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
#ax-drama .ax-drama-card a:focus-visible{display:block;outline:2px solid var(--ax-focus);outline-offset:4px;border-radius:var(--ax-radius)}
