.vid-featured { display:flex; gap:28px; align-items:flex-start; background:#fff; border-radius:20px; padding:24px; border:1px solid rgba(255,201,77,0.08); box-shadow:0 4px 24px rgba(0,40,80,0.05); }
.vid-embed { flex:0 0 58%; position:relative; border-radius:12px; overflow:hidden; background:#000; }
.vid-embed::before { content:''; display:block; padding-top:56.25%; }
.vid-embed iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.vid-meta { flex:1; display:flex; flex-direction:column; gap:16px; padding-top:4px; }
.vid-meta-title { font-size:14px; font-weight:700; line-height:1.75; color:var(--text); }
.vid-meta-ch { font-size:11px; color:var(--text-soft); font-family:var(--font-ui); letter-spacing:0.06em; }
.vid-meta-link { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; color:var(--pink); border:1px solid rgba(255,201,77,0.25); padding:7px 16px; border-radius:8px; transition:all 0.2s; margin-top:auto; }
.vid-meta-link:hover { background:var(--pink); color:#fff; }
@media(max-width:700px) { .vid-featured { flex-direction:column; } .vid-embed { flex:none; width:100%; } }
.vid-featured { background:none; border:none; box-shadow:none; padding:0; }
.vid-embed { border-radius:22px; box-shadow:0 26px 60px rgba(23,64,99,0.16); }
.vid-featured { border-color:rgba(66,165,245,0.12); }
.vid-meta-link { color:var(--aqua-deep); border-color:rgba(30,136,229,0.3); }
.vid-meta-link:hover { background:var(--aqua-deep); color:#fff; }
#videos .vid-embed { min-height:200px; }
#videos .vid-meta-title { font-size:20px; line-height:1.65; }
#videos .vid-meta-ch, #videos .vid-meta-link { font-size:14px; }
.yt-collection { margin-top:48px; }
.yt-collection h3 { font-size:20px; margin:0 0 20px; }
.yt-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.yt-card { display:block; min-width:0; }
.yt-card-image { position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:14px; background:var(--snow-deep); }
.yt-card-image img { width:100%; height:100%; object-fit:cover; }
.yt-card h4 { font-size:16px; line-height:1.65; margin:12px 0 6px; font-weight:700; }
.yt-card time { font-size:13px; color:var(--ink-soft); }
.yt-card:hover h4 { text-decoration:underline; text-underline-offset:4px; }
.yt-card:focus-visible { outline:3px solid var(--aqua-deep); outline-offset:7px; border-radius:14px; }
.yt-channel-link { display:inline-flex; margin-top:28px; color:var(--aqua-deep); font-weight:700; text-decoration:underline; text-underline-offset:4px; }
.yt-group + .yt-group { margin-top:64px; }
.yt-group-header { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:12px 24px; margin-bottom:24px; }
.yt-group-title { font-size:24px; margin:0; }
.yt-group-link { font-size:14px; color:var(--aqua-deep); text-underline-offset:4px; }
.yt-group .yt-cards { margin-top:32px; }
.yt-group .vid-meta-title { margin:0; }
.yt-empty { font-size:14px; line-height:1.8; }
@media(max-width:600px) { .yt-cards { grid-template-columns:1fr; gap:26px; } }

/* A complete, consistent surface around each video and its readable metadata. */
.vid-featured { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:24px; padding:24px; border:1px solid #bddce9; border-radius:20px; }
.vid-embed { min-width:0; width:100%; align-self:start; box-shadow:none; border-radius:14px; }
#videos .vid-embed { min-height:0; }
.vid-meta { min-width:0; gap:12px; }
.vid-meta-title, #videos .vid-meta-title { font-size:18px; line-height:1.65; overflow-wrap:anywhere; }
.vid-meta time { font-size:13px; }
.yt-card { display:flex; flex-direction:column; height:100%; padding:16px; border:1px solid #bddce9; border-radius:20px; }
.yt-card-image { flex-shrink:0; width:100%; }
.yt-card h4 { overflow-wrap:anywhere; }
.yt-card time { display:block; margin-top:auto; padding-top:8px; }
@media(max-width:700px) { .vid-featured { grid-template-columns:minmax(0,1fr); gap:18px; padding:18px; } }
