* { -webkit-tap-highlight-color: transparent; }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

#full-player.open { transform: translateY(0); }

input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  background: rgba(255,255,255,0.25);
  border-radius: 999px;
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  margin-top: -5px;
}
input[type="range"]::-webkit-slider-runnable-track {
  height: 3px;
  border-radius: 999px;
  background: rgba(255,255,255,0.25);
}

.chip {
  white-space: nowrap;
  font-size: 13px;
  font-weight: 600;
  padding: 7px 14px;
  border-radius: 999px;
  background: #212121;
  color: #eee;
  flex-shrink: 0;
}
.chip.active { background: #fff; color: #0F0F0F; }

.row-item { display:flex; align-items:center; gap:12px; padding:6px 4px; border-radius:8px; }
.row-item:active { background: rgba(255,255,255,0.06); }
.row-thumb { width:48px; height:48px; border-radius:6px; object-fit:cover; background:#212121; flex-shrink:0; }
.row-thumb-round { border-radius: 50%; }

.card { flex-shrink:0; width:150px; }
.card img { width:150px; height:150px; border-radius:10px; object-fit:cover; background:#212121; }
.card-wide { flex-shrink:0; width:260px; }
.card-wide img { width:260px; height:146px; border-radius:10px; object-fit:cover; background:#212121; }

.scroll-x { display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x proximity; }
.scroll-x > * { scroll-snap-align:start; }

.skeleton { background: linear-gradient(90deg, #1a1a1a 25%, #242424 37%, #1a1a1a 63%); background-size: 400% 100%; animation: shimmer 1.4s ease infinite; }
@keyframes shimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }

.spin { animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }