.rio-video { margin: 24px 0; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; overflow: hidden; background: #0b1016; }
.rio-video video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #0b1016; }
.rio-video video::cue { font-size: 1rem; background: rgba(0,0,0,.72); }
.rio-video-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px 12px; font-size: .8rem; color: rgba(255,255,255,.7); }
.rio-video-bar span { margin-left: 8px; text-transform: uppercase; letter-spacing: .06em; font-size: .7rem; }
.rio-video-bar span:first-child { margin-left: 0; }
.rio-video-bar button { border: 1px solid rgba(255,255,255,.25); background: transparent; color: inherit; border-radius: 6px; padding: 2px 10px; cursor: pointer; font: inherit; }
.rio-video-bar button.active { background: #1ea0e6; border-color: #1ea0e6; color: #fff; }
.rio-video-download { margin-left: auto; color: #1ea0e6; text-decoration: none; font-size: .8rem; }
.rio-video-download:hover { text-decoration: underline; }
.rio-video-bar .rio-video-date { flex-basis: 100%; margin-left: 0; text-transform: none; letter-spacing: 0; font-size: .75rem; color: rgba(255,255,255,.55); cursor: help; }