/* UI-022 · actual drama detail only. Keep the existing body and bottom Dock clearance. */
.phone #routePanel:has(>.drama-detail):has(>.detail-route-top) {
 --drama-topbar-bg-alpha:0.6;
 padding-top:0;
}
#routePanel:has(>.drama-detail)>.route-top.detail-route-top {
 display:grid;
 grid-template-columns:minmax(56px,1fr) minmax(0,2fr) minmax(56px,1fr);
 align-items:center;
 gap:8px;
 position:sticky;
 top:0;
 z-index:3;
 min-height:68px;
 margin-left:-22px;
 margin-right:-22px;
 padding:12px 22px;
 background:rgb(16 17 18 / var(--drama-topbar-bg-alpha,0.6));
 -webkit-backdrop-filter:blur(var(--ui-glass-blur,13px)) saturate(var(--ui-glass-saturation,1.12));
 backdrop-filter:blur(var(--ui-glass-blur,13px)) saturate(var(--ui-glass-saturation,1.12));
 isolation:isolate;
}
#routePanel:has(>.drama-detail)>.detail-route-top::before,
#routePanel:has(>.drama-detail)>.detail-route-top::after {content:none;background:none;}
#routePanel:has(>.drama-detail)>.detail-route-top>:first-child {justify-self:start;text-align:left;}
#routePanel:has(>.drama-detail)>.detail-route-top>:nth-child(2) {min-width:0;text-align:center;overflow-wrap:anywhere;}
#routePanel:has(>.drama-detail)>.detail-route-top>:last-child {justify-self:end;}
#routePanel:has(>.drama-detail)>.detail-route-top>button {min-width:56px;min-height:44px;padding:10px 0;font-size:14px;line-height:1.7;}