/* Keeping It Real videos (source/ytv; homepage #home.video and /videos/; split.py links it on pages with class="yv").
   Uses the site's tokens from site.css (--black, --white, --champ, --kgold, --maroon, --display, --body). */
.yv{position:relative;isolation:isolate;overflow:hidden;overflow:clip;background:var(--black);color:var(--white);padding:clamp(48px,6vw,92px) 0;border-top:1px solid rgba(210,178,124,.35)}
.yv::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(820px 520px at 30% 50%,rgba(210,178,124,.16),transparent 70%),radial-gradient(520px 380px at 96% 0%,rgba(112,16,32,.22),transparent 70%)}
.yv-in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4.5vw,72px);align-items:center}
.yv-eb{display:flex;align-items:center;gap:10px;margin:0;color:var(--champ)}
.yv-dot{width:9px;height:9px;border-radius:50%;background:#E0312B;box-shadow:0 0 0 4px rgba(224,49,43,.18)}
.yv-h{font-family:var(--display);font-weight:500;font-size:clamp(32px,3.4vw,54px);line-height:1.05;letter-spacing:-.01em;margin:14px 0 14px;color:var(--white)}
.yv-h em{font-style:normal;color:var(--champ)}
.yv-lede{font-size:clamp(17px,1.4vw,20px);line-height:1.55;color:rgba(251,248,241,.82);margin:0 0 22px;max-width:48ch}
.yv-ch{list-style:none;margin:0 0 26px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 18px}
.yv-ch button{all:unset;cursor:pointer;display:flex;gap:10px;align-items:baseline;padding:6px 0;font:500 15px/1.35 var(--body);color:rgba(251,248,241,.88);border-bottom:1px solid rgba(255,255,255,.08);width:100%}
.yv-ch button:hover,.yv-ch button:focus-visible{color:var(--champ)}
.yv-ch button:focus-visible{outline:2px solid var(--champ);outline-offset:2px}
.yv-ch b{font:600 13px/1 var(--body);color:var(--champ);min-width:38px;font-variant-numeric:tabular-nums}
.yv-acts{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.yv-acts .btn.ghost{background:transparent;color:var(--white);border-color:rgba(251,248,241,.45)}
.yv-acts .btn.ghost:hover{border-color:var(--champ);color:var(--champ)}
.yv-me{margin:18px 0 0;font-size:14px;color:rgba(251,248,241,.62)}
.yv-me a{color:var(--champ)}
.yv-stage{position:relative}
.yv-frame{position:relative;aspect-ratio:16/9;background:#000;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(210,178,124,.35);overflow:hidden}
.yv-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yv-play{all:unset;position:absolute;inset:0;cursor:pointer;display:block}
.yv-play img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease,filter .4s}
.yv-play::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.55))}
.yv-btn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;width:clamp(68px,8vw,96px);height:clamp(68px,8vw,96px);border-radius:50%;background:var(--champ);display:grid;place-items:center;box-shadow:0 0 0 10px rgba(210,178,124,.25),0 12px 30px rgba(0,0,0,.5);transition:transform .25s}
.yv-btn svg{width:34%;height:34%;margin-left:8%;fill:var(--black)}
.yv-play:hover img{transform:scale(1.03);filter:brightness(1.08)}
.yv-play:hover .yv-btn,.yv-play:focus-visible .yv-btn{transform:translate(-50%,-50%) scale(1.08)}
.yv-play:focus-visible{outline:3px solid var(--champ);outline-offset:-3px}
.yv-len{position:absolute;right:12px;bottom:12px;z-index:1;font:600 13px/1 var(--body);background:rgba(0,0,0,.78);color:#fff;padding:6px 8px}
.yv-cap{position:absolute;left:14px;bottom:12px;z-index:1;font:600 12px/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--white)}
.yv-note{margin:12px 0 0;font-size:13px;color:rgba(251,248,241,.55)}
.yv-ep[hidden]{display:none}
.yv-long:not(.open) li:nth-child(n+9){display:none}
.yv-long:not(.open){margin-bottom:10px}
.yv-chm{all:unset;cursor:pointer;display:inline-block;margin:0 0 24px;font:600 14px/1.3 var(--body);color:var(--champ);border-bottom:1px solid rgba(210,178,124,.5)}
.yv-chm:hover{border-color:var(--champ)}
.yv-chm:focus-visible{outline:2px solid var(--champ);outline-offset:3px}
.yv-more{margin-top:clamp(34px,4vw,56px);padding-top:clamp(22px,2.6vw,32px);border-top:1px solid rgba(210,178,124,.22)}
.yv-lh{margin:0 0 16px;font:600 12px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--champ)}
.yv-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.8vw,24px)}
.yv-card{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:8px;width:100%;color:rgba(251,248,241,.88)}
.yv-ct{position:relative;display:block;aspect-ratio:16/9;background:#000;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.1)}
.yv-ct img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease,filter .3s}
.yv-cl{position:absolute;right:8px;bottom:8px;font:600 12px/1 var(--body);background:rgba(0,0,0,.8);color:#fff;padding:4px 6px}
.yv-now{position:absolute;left:8px;top:8px;display:none;font:600 11px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;background:var(--champ);color:var(--black);padding:5px 7px}
.yv-cn{font:600 12px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--champ)}
.yv-ctt{font:500 16px/1.35 var(--body)}
.yv-card:hover .yv-ct img{transform:scale(1.04);filter:brightness(1.08)}
.yv-card:hover .yv-ctt{color:var(--champ)}
.yv-card:focus-visible{outline:2px solid var(--champ);outline-offset:4px}
.yv-card[aria-pressed="true"] .yv-ct{box-shadow:0 0 0 2px var(--champ)}
.yv-card[aria-pressed="true"] .yv-now{display:block}
.yv-all{margin:22px 0 0;font:600 15px/1.4 var(--body)}
.yv-all a{color:var(--champ);text-decoration:none;border-bottom:1px solid rgba(210,178,124,.5)}
.yv-all a:hover{border-color:var(--champ)}
.yv-h:focus{outline:none}
@media (max-width:980px){.yv-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.yv-list{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding-bottom:6px}.yv-list li{flex:0 0 72%;scroll-snap-align:start}}
@media (max-width:980px){.yv-in{grid-template-columns:1fr}.yv-stage{order:-1}}
@media (max-width:560px){.yv-ch{grid-template-columns:1fr}.yv-acts .btn{flex:1 1 100%;text-align:center}}
@media (prefers-reduced-motion:reduce){.yv-play img,.yv-btn,.yv-ct img{transition:none}}