:root{
  --yt-play:#F5FF6B;
}

body.page-highlights{
  --accent1:#F5FF6B;
}

.page-highlights .page-shell{
  padding-top:calc(var(--shell-pad) + 8px);
}

.highlights-hero{
  display:grid;
  gap:clamp(12px,3vw,18px);
  grid-template-columns:1fr;
  align-items:center;
}

@media(min-width:960px){
  .highlights-hero{
    grid-template-columns:1.2fr .8fr;
  }
}

.hero-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#dfe8ff;
}

.highlights-hero h1{
  margin:8px 0 6px;
  font-size:clamp(22px,3vw,30px);
}

.highlights-hero p{
  margin:0;
  color:var(--muted,#c9d7ef);
  line-height:1.6;
}

.highlights-meta{
  display:grid;
  gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
}

.meta-chip{
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);
}

.meta-chip span{
  display:block;
  color:rgba(255,255,255,.7);
  font-size:12px;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.meta-chip strong{
  display:block;
  margin-top:6px;
  font-size:18px;
}

.pill-rail a.league-pill{
  text-decoration:none;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#f7f9ff;
  font-weight:700;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}

.pill-rail a.league-pill:hover{
  background:rgba(255,255,255,.12);
}

.pill-rail a.league-pill::before{
  content:'';
  width:10px;
  height:10px;
  border-radius:999px;
  background:var(--accent1,#F5FF6B);
  display:inline-block;
  margin-right:8px;
  box-shadow:0 0 0 4px rgba(245,255,107,.12);
}

.video-section .section-heading{
  align-items:center;
}

.video-section .section-heading p{
  margin:0;
  color:var(--muted,#c9d7ef);
}

.youtube-link{
  font-size:13px;
  font-weight:700;
  color:#0b1426;
  background:var(--accent1,#F5FF6B);
  border-radius:10px;
  padding:8px 12px;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.youtube-link:hover{
  filter:brightness(1.05);
}

.video-grid{
  display:grid;
  gap:clamp(12px,3vw,16px);
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}

.video-card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.video-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.16);
  box-shadow:var(--shadow-soft);
}

.video-thumb{
  position:relative;
  padding-top:56.25%;
  background-size:cover;
  background-position:center;
  overflow:hidden;
}

.video-thumb img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.video-thumb::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.0) 45%,rgba(0,0,0,.45) 100%);
}

.play-tag{
  position:absolute;
  right:12px;
  bottom:12px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(11,20,38,.85);
  border:1px solid rgba(255,255,255,.18);
  color:#f7f9ff;
  font-weight:700;
  z-index:2;
}

.play-icon{
  width:12px;
  height:12px;
  display:inline-block;
  background:var(--yt-play,#F5FF6B);
  clip-path:polygon(0 0,100% 50%,0 100%);
}

.video-body{
  padding:12px 12px 14px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.video-title{
  margin:0;
  font-size:15px;
  line-height:1.4;
}

.video-title a{
  color:#f7f9ff;
  text-decoration:none;
}

.video-title a:hover{
  text-decoration:underline;
}

.video-meta{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--muted,#c9d7ef);
  font-size:13px;
  flex-wrap:wrap;
}

.video-meta .dot{
  width:5px;
  height:5px;
  background:rgba(255,255,255,.5);
  border-radius:50%;
}

.empty-block{
  padding:14px;
  border:1px dashed rgba(255,255,255,.16);
  border-radius:12px;
  color:var(--muted,#c9d7ef);
}

.video-embed{
  position:relative;
  padding-top:56.25%;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.4);
}

.video-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}