/* V.4 DRAFT NEWSIUM_V4_VIDEO_SWIPE: shared swipeable video row */
.vsw{margin:.5rem 0 1rem}
.vsw-head{display:flex;align-items:center;gap:.6rem;min-height:44px}
.vsw-head h2{font-size:1.05rem;margin:0}
.vsw-hint{margin-left:auto}
.vsw-all{display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding:0 .4rem;font-weight:600}
.vsw-wrap{position:relative}
.vsw-track{list-style:none;margin:0;padding:.25rem 2px .6rem;display:flex;gap:.7rem;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scroll-padding-left:2px;
  touch-action:pan-x pan-y;scrollbar-width:thin}
.vsw-track>li{flex:0 0 auto;width:min(72vw,260px);scroll-snap-align:start}
.vsw-card{display:flex;flex-direction:column;gap:.3rem;min-height:44px;text-decoration:none;color:inherit;-webkit-tap-highlight-color:transparent}
.vsw-th{position:relative;display:block;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#222}
.vsw-th img{width:100%;height:100%;object-fit:cover;display:block}
.vsw-ph{display:flex;align-items:center;justify-content:center;height:100%;color:#ddd;font-size:.85rem;padding:.5rem;text-align:center}
.vsw-play{position:absolute;right:.4rem;bottom:.4rem;width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:1rem}
.vsw-t{font-size:.92rem;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vsw-src{font-size:.8rem;opacity:.75}
.vsw-nav{display:none;position:absolute;top:calc(50% - 40px);z-index:2;width:44px;height:44px;border-radius:50%;border:0;
  background:rgba(0,0,0,.65);color:#fff;font-size:1.5rem;cursor:pointer}
.vsw-prev{left:-6px}.vsw-next{right:-6px}
.vsw-nav[disabled]{opacity:0;pointer-events:none}
@media (hover:hover) and (min-width:760px){.vsw-nav{display:block}.vsw-hint{display:none}.vsw-track>li{width:250px}}
/* flow: with the row on the page, phones get the videos above the fold - the ticker stack (world clock / tickers / pulse)
   steps aside (it stays on wider screens). The row itself sits above the language bar. */
@media (max-width:759px){
  body:has(#vsw-row) #tick-stack{display:none}
  .vsw{margin-top:.25rem}
}
@media (prefers-reduced-motion:reduce){.vsw-track{scroll-behavior:auto}}
/* MEDIA_UX */
.mx-box{display:block;aspect-ratio:16/9;width:100%}.mx-box iframe{width:100%;height:100%;border:0;border-radius:8px;display:block}
.mx-open{display:inline-block;margin-top:.25rem;text-decoration:underline;cursor:pointer}
