/* YouTube-style playlist player — shared across service and case pages */
.yt-pl{margin:32px 0;border:1px solid var(--rule,#E8E6E1);border-radius:16px;overflow:hidden;
  background:#0F0E0C;}
.yt-pl-grid{display:flex;flex-direction:column;}
.yt-pl-stage{position:relative;width:100%;aspect-ratio:16/9;background:#000;}
.yt-pl-stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
.yt-pl-side{display:flex;flex-direction:column;background:#141311;max-height:320px;}
.yt-pl-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding:14px 16px 10px;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0;}
.yt-pl-title{font-family:var(--ff-disp,sans-serif);font-size:14px;font-weight:800;color:#fff;
  letter-spacing:-.2px;}
.yt-pl-count{font-family:var(--ff-mono,monospace);font-size:10px;letter-spacing:.06em;
  color:rgba(255,255,255,.45);white-space:nowrap;}
.yt-pl-list{overflow-y:auto;overscroll-behavior:contain;flex:1;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent;}
.yt-pl-list::-webkit-scrollbar{width:6px}
.yt-pl-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:3px}
.yt-pl-item{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;
  padding:9px 14px;background:none;border:0;cursor:pointer;color:inherit;font:inherit;
  border-left:2px solid transparent;transition:background .14s;}
.yt-pl-item:hover{background:rgba(255,255,255,.06)}
.yt-pl-item[aria-current="true"]{background:rgba(232,41,74,.12);border-left-color:#E8294A}
.yt-pl-idx{font-family:var(--ff-mono,monospace);font-size:10px;color:rgba(255,255,255,.4);
  width:16px;flex-shrink:0;padding-top:14px;text-align:right}
.yt-pl-item[aria-current="true"] .yt-pl-idx{color:#E8294A}
.yt-pl-thumb{width:74px;height:42px;border-radius:5px;object-fit:cover;flex-shrink:0;
  background:#000;display:block}
.yt-pl-name{font-size:11.5px;line-height:1.35;color:rgba(255,255,255,.82);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.yt-pl-item[aria-current="true"] .yt-pl-name{color:#fff;font-weight:600}
.yt-pl-foot{padding:10px 16px;border-top:1px solid rgba(255,255,255,.08);flex-shrink:0}
.yt-pl-foot a{font-family:var(--ff-mono,monospace);font-size:10px;letter-spacing:.05em;
  color:rgba(255,255,255,.5);text-decoration:none}
.yt-pl-foot a:hover{color:#fff}

@media (min-width:860px){
  .yt-pl-grid{flex-direction:row}
  .yt-pl-stage{flex:1 1 64%;aspect-ratio:16/9}
  .yt-pl-side{flex:0 0 300px;max-height:none}
}
@media (prefers-reduced-motion:reduce){
  .yt-pl-item{transition:none}
}