/* update */
/* --- FLAT (no boxes) --- */
/*
.lfm-wrap { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: rgba(255,255,255,.92); }
.lfm-title { font-weight: 800; margin: 0 0 10px; opacity: .95; }
.lfm-sub { font-size: 12px; opacity: .75; margin-bottom: 10px; }
*/
/* Make grid behave like a simple list (optional but matches “simple”) */
/*
.lfm-grid { 
  display: grid;
  grid-template-columns: 1fr !important;
  gap: 6px;
}
*/
/* kill the boxes */
/*
.lfm-item{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 0;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  text-decoration: none;
}
*/
/* add a tiny separator instead of a box */
/*
.lfm-item + .lfm-item{
  border-top: 1px solid rgba(255,255,255,.10);
  padding-top: 8px;
  margin-top: 8px;
}
*/
/*
.lfm-rank{
  opacity: .65;
  min-width: 22px;
  text-align: right;
}
*/
/*
.lfm-img{
  width: 34px;
  height: 34px;
  border-radius: 8px;
  object-fit: cover;
  flex: 0 0 auto;
  background: transparent;
}
*/
/* hide empty images (prevents ugly placeholder icons) */
/*
.lfm-img[src=""]{ display:none; }

.lfm-main{ min-width: 0; flex: 1 1 auto; }
.lfm-name{ font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lfm-meta{ font-size: 12px; opacity: .75; white-space: nowrap; overflow: hidden; text-overfl

*/

/* update end */

/* Last.fm widgets */
.lfm-wrap { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.lfm-title { font-weight: 800; margin: 0 0 10px; opacity: .95; }
.lfm-sub { font-size: 12px; opacity: .75; margin-bottom: 10px; }

.lfm-grid {
  display: grid;
  gap: 10px 14px;
  width: 100%;
}

/* always 3/2/1 columns */
@media (min-width: 1200px) { .lfm-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) and (max-width: 1199px) { .lfm-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .lfm-grid { grid-template-columns: 1fr; } }

.lfm-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  overflow: hidden;
}

.lfm-rank { opacity: .75; min-width: 22px; text-align: right; }
.lfm-img {
  width: 34px; height: 34px; border-radius: 10px;
  object-fit: cover; flex: 0 0 auto;
  background: rgba(255,255,255,.10);
}
.lfm-main { min-width: 0; flex: 1 1 auto; }
.lfm-name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lfm-meta { font-size: 12px; opacity: .75; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.lfm-list .lfm-item { border-radius: 999px; }
.lfm-table { width: 100%; border-collapse: collapse; }
.lfm-table th, .lfm-table td { padding: 8px 10px; border-bottom: 1px solid rgba(255,255,255,.12); }
.lfm-table th { text-align: left; opacity: .75; font-size: 12px; }
