/* OIO Movie Mini Ticker v1.0.4 — Cinematic reset, tight spacing, yellow label */
.oio-mini{
  display:flex; align-items:center; gap:.6rem;
  background:#0f141a; color:#e5e7eb;
  padding:.34rem .6rem .26rem; /* minimal bottom space */
  border-radius:12px;
  box-shadow: 0 1px 0 rgba(255,255,255,.04) inset, 0 8px 24px rgba(0,0,0,.35);
  overflow:hidden; position:relative;
}
.oio-mini__label{
  flex:0 0 auto;
  font-weight:700; font-size:.82rem; line-height:1;
  color:#111; padding:.32rem .56rem;
  background:linear-gradient(135deg,#facc15 0%, #f59e0b 50%, #f97316 100%);
  border-radius:.45rem;
  box-shadow: 0 2px 8px rgba(250, 204, 21, .25);
}
.oio-mini__track{ position:relative; display:flex; align-items:center; overflow:hidden; }
.oio-mini .oio-list{
  display:flex; gap:.5rem; list-style:none; margin:0; padding:0 .2rem;
  transform:translateX(0);
  will-change: transform, opacity, filter;
}
.oio-card{ flex:0 0 auto; width:74px; text-align:center; }
.oio-card a{ text-decoration:none; color:inherit; display:block; }
.oio-thumb{
  width:68px; height:90px; border-radius:.55rem; overflow:hidden;
  background:#1f2937; display:flex; align-items:center; justify-content:center;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
  margin:0 auto;
}
.oio-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.oio-noimg{ font-size:1.1rem; opacity:.75; }

.oio-title{
  margin-top:.2rem; font-size:.54rem; line-height:1; max-width:68px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  color:#e5e7eb;
}
.oio-card:hover .oio-thumb{ transform:translateY(-1px); transition:transform .2s ease; }

/* Cinematic effects */
.oio-cine-fade { animation: oioFade .38s ease both; }
@keyframes oioFade { 0%{opacity:.0; filter:blur(2px);} 100%{opacity:1; filter:blur(0);} }

.oio-cine-shutter::after{
  content:""; position:absolute; inset:0;
  background: radial-gradient(ellipse at center, rgba(0,0,0,.85) 0%, rgba(0,0,0,.65) 30%, rgba(0,0,0,0) 60%);
  pointer-events:none; opacity:0; animation:oioShutter .45s ease both;
}
@keyframes oioShutter {
  0% { opacity:1; }
  100% { opacity:0; }
}

@media (max-width:768px){
  .oio-mini{ gap:.5rem; padding:.32rem .5rem .24rem; }
  .oio-card{ width:68px; }
  .oio-thumb{ width:62px; height:82px; border-radius:.5rem; }
  .oio-title{ max-width:62px; font-size:.52rem; }
}