/* Metadata overview only. Playback keeps its current layout and controls. */
.drama-overview-page>.page-shell{width:100%;max-width:1920px;margin:0 auto;padding:0 min(60px,3.125vw)}
.drama-overview-page .detail-overview-heading .breadcrumbs{margin-bottom:14px}
.drama-overview-page .detail-overview-heading>.section-kicker{margin:0 0 20px}
.drama-overview-page .detail-overview-layout{grid-template-columns:minmax(0,1fr) min(296px,15.416667vw);gap:min(36px,1.875vw);align-items:start}
.drama-overview-page .detail-main,.drama-overview-page .detail-hero-main,.drama-overview-page .detail-hero-info{min-width:0}
.drama-overview-page .detail-hero{display:flex;align-items:flex-start;gap:min(24px,1.25vw);padding:min(24px,1.25vw);border:1px solid var(--line);border-radius:12px;background:#19181f}
.drama-overview-page .detail-cover{flex-shrink:0;width:min(300px,15.625vw);height:auto;aspect-ratio:3 / 4;padding:12px;border-radius:10px}
.drama-overview-page .detail-hero-main{display:flex;flex:1 1 0;flex-direction:column;align-items:stretch;gap:16px}
.drama-overview-page .detail-title{margin:0;color:var(--text);font:600 clamp(22px,1.771vw,34px)/1.4 'Noto Serif SC',serif;overflow-wrap:anywhere}
.drama-overview-page .detail-metrics{margin:12px 0 0;padding:0;border:0;gap:8px 14px;font-size:11px;line-height:1.6}
.drama-overview-page .detail-description{margin:0;font-size:12px;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere}
.drama-overview-page .detail-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.drama-overview-page .detail-actions .continue-button{width:auto;min-height:44px;margin:0;padding:0 20px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;font-size:12px}
.drama-overview-page .detail-actions .follow-button{min-height:44px;padding:0 18px;font-size:12px}
.drama-overview-page .detail-tags{flex-wrap:wrap;gap:8px;min-width:0}
.drama-overview-page .detail-interactions .button{min-height:40px;padding:0 12px;font-size:11px}
.drama-overview-page .detail-share-status{margin:0;overflow-wrap:anywhere}
.drama-overview-page .detail-episodes{grid-template-columns:repeat(auto-fill,minmax(min(135px,100%),1fr));gap:10px}
.drama-overview-page .detail-episodes .episode-button{height:auto;min-height:44px;padding:10px 8px;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.drama-overview-page .detail-episodes .episode-button small{font-size:10px;line-height:1.65;white-space:normal;overflow-wrap:anywhere}
.drama-overview-page .detail-related-sidebar{display:block;padding:0;min-width:0}
.drama-overview-page .related-section{padding-top:0}
.drama-overview-page .detail-related-sidebar .section-heading{align-items:flex-start;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.drama-overview-page .detail-related-sidebar .section-heading h2{font-size:18px}
.drama-overview-page .detail-related-sidebar .section-kicker{font-size:8px;letter-spacing:.08em}
.drama-overview-page .detail-related-sidebar .drama-grid{display:flex;flex-direction:column;gap:18px;margin:0;min-width:0}
.drama-overview-page .detail-related-sidebar .drama-card{display:block;width:100%;min-width:0}
.drama-overview-page .detail-related-sidebar .poster{height:auto;aspect-ratio:296 / 415}
.drama-overview-page .detail-related-sidebar .poster-title{font-size:14px;overflow-wrap:anywhere}
.drama-overview-page .detail-related-sidebar .card-title{font-size:12px;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
.drama-overview-page .detail-related-sidebar .related-state{min-width:0;overflow-wrap:anywhere}
.drama-overview-page .detail-related-sidebar .related-state .button{max-width:100%;white-space:normal}
.drama-overview-page :is(a,button):focus-visible{outline:2px solid var(--pink-soft);outline-offset:3px}
@media(max-width:767px){
 .drama-overview-page{padding-top:18px}
 .drama-overview-page>.page-shell{padding:0 16px}
 .drama-overview-page .detail-overview-layout{display:flex;flex-direction:column;gap:30px}
 .drama-overview-page .detail-main,.drama-overview-page .detail-related-sidebar{width:100%}
 .drama-overview-page .detail-hero{display:grid;grid-template-columns:76px minmax(0,1fr);gap:18px 12px;padding:0;border:0;border-radius:0;background:transparent}
 .drama-overview-page .detail-cover{grid-column:1;grid-row:1;width:76px;height:106px;aspect-ratio:auto;padding:6px;border-radius:6px}
 .drama-overview-page .detail-cover span{font-size:8px;overflow-wrap:anywhere}
 .drama-overview-page .detail-hero-main{display:contents}
 .drama-overview-page .detail-hero-info{grid-column:2;grid-row:1}
 .drama-overview-page .detail-title{font-size:16px;line-height:22px}
 .drama-overview-page .detail-description,.drama-overview-page .detail-actions,.drama-overview-page .detail-hero-main>.detail-tags,.drama-overview-page .detail-share-status{grid-column:1/-1}
 .drama-overview-page .detail-metrics{margin-top:10px;font-size:10px;gap:6px 10px}
 .drama-overview-page .detail-episodes{display:flex;flex-wrap:nowrap;align-items:stretch;gap:8px;max-width:100%;overflow-x:auto;padding:4px 2px 12px;scroll-padding:4px}
 .drama-overview-page .detail-episodes .episode-button{flex:0 0 150px;min-width:0}
 .drama-overview-page .detail-related-sidebar .drama-grid{flex-direction:row;align-items:flex-start;gap:9px;overflow-x:auto;padding:4px 2px 12px;scroll-padding:4px}
 .drama-overview-page .detail-related-sidebar .drama-card{flex:0 0 111px;width:111px}
 .drama-overview-page .detail-related-sidebar .poster{height:148px;aspect-ratio:3 / 4}
 .drama-overview-page .detail-related-sidebar .related-state,.drama-overview-page .detail-related-sidebar .drama-grid>.source-note{flex:0 0 160px}
 .drama-overview-page .detail-related-sidebar .section-heading{margin-bottom:12px}
}
