.p-main{
  position:relative;z-index:1;
  width:100%;max-width:var(--page-max);
  margin:0 auto;padding:18px var(--gutter) 40px;
}
.p-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 340px;
  gap:16px;align-items:start;
}
@media (max-width:1020px){.p-grid{grid-template-columns:minmax(0,1fr)}}

.stage{
  position:relative;
  background:#050409;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
  overflow:hidden;
}
.stage__inner{
  position:relative;
  width:100%;aspect-ratio:16/9;
  background:#050409;
  overflow:hidden;
}
@media (max-width:640px){.stage__inner{aspect-ratio:16/10}}
.stage__inner video,.stage__inner>div{width:100%;height:100%}
.stage video{object-fit:contain}
.stage video.mode-fill{object-fit:fill!important}
.stage video.mode-cover{object-fit:cover!important}

.ov{
  position:absolute;inset:0;z-index:4;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;padding:24px;text-align:center;
  background:radial-gradient(circle at 50% 40%,rgba(255,45,120,.08),rgba(5,4,9,.96) 62%);
  color:var(--text-muted);font-size:12.5px;
}
.ov__spin{
  width:34px;height:34px;border-radius:50%;
  border:3px solid rgba(255,255,255,.10);
  border-top-color:var(--accent-primary);
  animation:spin .9s linear infinite;
}
.ov h3{font-size:17px;letter-spacing:-.02em}
.ov p{font-size:12.5px;color:var(--text-muted);max-width:44ch;line-height:1.6}
.ov .btn{margin-top:4px}

.stage__bar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:12px 14px;
  border-top:1px solid var(--border-subtle);
  background:linear-gradient(180deg,var(--bg-elevated),var(--bg-surface));
  min-height:52px;
}
.stage__meta{min-width:0;flex:1 1 180px}
.stage__title{
  font-family:var(--font-display);font-size:14px;font-weight:700;letter-spacing:-.02em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.stage__sub{
  font-family:var(--font-mono);font-size:9.5px;color:var(--text-muted);
  letter-spacing:.12em;text-transform:uppercase;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.stage__tools{display:flex;align-items:center;gap:7px;flex:0 0 auto}

.evmeta{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:16px 0 4px;
}
.evmeta__title{
  font-family:var(--font-display);font-size:19px;font-weight:700;
  letter-spacing:-.03em;line-height:1.2;overflow-wrap:anywhere;
}
.evmeta__tags{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-family:var(--font-mono);font-size:9.5px;color:var(--text-muted);
  letter-spacing:.12em;text-transform:uppercase;
}
.evmeta__tags .dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.6}

.rail{
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.008));
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-lg);
  padding:16px;
}
@media (min-width:1021px){.rail{position:sticky;top:calc(var(--header-h) + 18px)}}
.rail__head{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.rail__t{font-family:var(--font-display);font-size:14px;font-weight:700;letter-spacing:-.02em}
.rail__n{
  font-family:var(--font-mono);font-size:10px;color:var(--text-dim);
  padding:1px 7px;border-radius:var(--radius-pill);
  background:rgba(255,255,255,.07);font-variant-numeric:tabular-nums;
}
.rail__list{display:flex;flex-direction:column;gap:8px;max-height:60vh;overflow:auto;padding-right:2px}
@media (max-width:1020px){.rail__list{max-height:none}}

.srv{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:var(--radius-sm);
  background:rgba(255,255,255,.03);
  border:1px solid var(--border-subtle);
  cursor:pointer;text-align:left;width:100%;
  transition:border-color .14s linear,background .14s linear;
}
.srv:hover{border-color:rgba(255,45,120,.35);background:rgba(255,45,120,.06)}
.srv.is-active{
  border-color:rgba(255,45,120,.55);
  background:var(--grad-brand-soft);
  box-shadow:0 6px 20px rgba(255,45,120,.14);
}
.srv__i{
  width:24px;height:24px;flex:0 0 auto;border-radius:8px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.06);
  font-family:var(--font-mono);font-size:10.5px;font-weight:700;color:var(--text-dim);
}
.srv.is-active .srv__i{background:var(--grad-brand);color:#fff}
.srv__b{min-width:0;flex:1 1 auto}
.srv__name{
  font-size:12.5px;font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.srv__tags{
  display:flex;align-items:center;gap:5px;margin-top:2px;
  font-family:var(--font-mono);font-size:8.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--text-muted);
}
.tag{
  padding:1px 5px;border-radius:4px;
  border:1px solid var(--border-subtle);background:rgba(255,255,255,.04);
}
.tag--hls{color:#ffb3ce;border-color:rgba(255,45,120,.3);background:rgba(255,45,120,.1)}
.tag--dash{color:#d9b4ff;border-color:rgba(178,75,243,.3);background:rgba(178,75,243,.1)}
.tag--drm{color:var(--accent-tertiary);border-color:rgba(250,204,21,.3);background:rgba(250,204,21,.1)}
.srv__emb{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;
  padding:5px 9px;border-radius:7px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border-subtle);
  color:var(--text-dim);font-size:10.5px;font-weight:700;
  transition:background .14s linear,color .14s linear,border-color .14s linear;
}
.srv__emb:hover{background:rgba(255,45,120,.18);color:#fff;border-color:rgba(255,45,120,.4)}
.srv__emb svg{width:11px;height:11px}

.rail__empty{
  padding:22px 12px;text-align:center;font-size:12.5px;color:var(--text-muted);
  border:1px dashed var(--border-subtle);border-radius:var(--radius-sm);line-height:1.6;
}

.shaka-video-container{font-family:var(--font-body)}
.shaka-controls-button-panel button{color:#f5f3ff}
.shaka-range-element::-webkit-slider-thumb{background:var(--accent-primary)}
.vx-fit{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;height:32px;padding:0 8px;margin:0 2px;
  border-radius:6px;background:transparent;color:#f5f3ff;
  font-family:var(--font-mono);font-size:11px;font-weight:700;
  letter-spacing:.04em;opacity:.9;
}
.vx-fit:hover{background:rgba(255,255,255,.14);opacity:1}
.jw-icon-vxfit{background-size:20px 20px!important;background-position:center!important;background-repeat:no-repeat!important}

.sblock{
  position:fixed;inset:0;z-index:var(--z-block);
  display:flex;align-items:center;justify-content:center;
  padding:24px;overflow:auto;
  background:
    radial-gradient(circle at 20% 15%,rgba(255,45,120,.16),transparent 55%),
    radial-gradient(circle at 85% 85%,rgba(178,75,243,.16),transparent 55%),
    rgba(4,3,8,.97);
}
.sblock__card{
  width:min(540px,100%);padding:30px 28px;
  border-radius:var(--radius-lg);
  background:linear-gradient(180deg,var(--bg-card),var(--bg-surface));
  border:1px solid rgba(255,59,48,.28);
  box-shadow:var(--shadow-lg);
}
.sblock__i{
  width:56px;height:56px;border-radius:18px;margin-bottom:16px;
  display:grid;place-items:center;
  background:var(--live-soft);border:1px solid rgba(255,59,48,.35);color:#ff8a83;
}
.sblock__i svg{width:26px;height:26px}
.sblock__t{font-family:var(--font-display);font-size:24px;font-weight:800;letter-spacing:-.035em;margin-bottom:10px}
.sblock__d{font-size:13.5px;color:var(--text-dim);line-height:1.65;margin-bottom:18px}
.sblock__c{
  font-family:var(--font-mono);font-size:11.5px;line-height:1.7;
  color:#ffd9e6;background:#0a0812;
  border:1px solid var(--border-soft);border-radius:var(--radius-md);
  padding:14px 16px;margin-bottom:10px;overflow-x:auto;white-space:pre;
}
.sblock__c .ok{color:#a7f3d0}
.sblock__h{font-size:11.5px;color:var(--text-muted);line-height:1.6;margin-bottom:20px}
.sblock__a{display:flex;gap:10px;flex-wrap:wrap}
.sblock__a button,.sblock__a a{
  flex:1 1 130px;display:flex;align-items:center;justify-content:center;
  padding:11px 16px;border-radius:var(--radius-sm);
  border:1px solid var(--border-soft);background:rgba(255,255,255,.04);
  color:var(--text-primary);font-size:13px;font-weight:600;
}
.sblock__a button:hover{background:rgba(255,255,255,.08)}
.sblock__a a{background:var(--grad-brand);border-color:transparent;color:#fff}

@media (max-width:600px){
  .p-main{padding:12px var(--gutter) 30px}
  .stage__tools .btn span{display:none}
  .evmeta__title{font-size:16px}
  .rail{padding:13px}
  .sblock__card{padding:22px 18px}
  .sblock__t{font-size:20px}
  .sblock__c{font-size:10.5px}
}
