.ssdi-wrap{color:#fff;margin:24px 0}
.ssdi-wrap *{box-sizing:border-box}
.ssdi-search-bar{margin-bottom:16px}
#ssdiMount .ssdi-search-bar input,
#ssdiMount input#ssdiInput,
#ssdiInput{
  width:100%;padding:13px 18px;border-radius:14px;
  border:1px solid rgba(255,255,255,.28) !important;
  background:rgba(0,0,0,.4) !important;
  color:#fff !important;
  caret-color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-size:15px;outline:none;
  opacity:1 !important;
}
#ssdiMount .ssdi-search-bar input::placeholder,
#ssdiMount input#ssdiInput::placeholder,
#ssdiInput::placeholder{
  color:rgba(255,255,255,.55) !important;
  opacity:1 !important;
}
#ssdiMount .ssdi-search-bar input:focus,
#ssdiMount input#ssdiInput:focus,
#ssdiInput:focus{border-color:rgba(255,255,255,.65) !important}
.ssdi-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.ssdi-chip{
  padding:7px 16px;border-radius:999px;
  border:1px solid rgba(255,255,255,.25);
  background:transparent;color:#fff;
  cursor:pointer;font-size:13px;font-weight:700;
}
.ssdi-chip:hover{background:rgba(255,255,255,.08)}
.ssdi-chip-on{background:#fff;color:#000;border-color:#fff}
.ssdi-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:10px;
}
@media(max-width:1200px){.ssdi-grid{grid-template-columns:repeat(5,1fr)!important}}
@media(max-width:900px){.ssdi-grid{grid-template-columns:repeat(4,1fr)!important}}
@media(max-width:650px){.ssdi-grid{grid-template-columns:repeat(3,1fr)!important}}
@media(max-width:420px){.ssdi-grid{grid-template-columns:repeat(2,1fr)!important}}
.ssdi-card{
  border:1px solid rgba(255,255,255,.15);border-radius:10px;
  background:rgba(0,0,0,.55);overflow:hidden;
  text-decoration:none;color:#fff;display:block;
}
.ssdi-card:hover{border-color:rgba(255,255,255,.45)}
.ssdi-cover{
  width:100%;aspect-ratio:1/1;
  background:#111 center/cover no-repeat;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.ssdi-meta{padding:6px 8px 9px}
.ssdi-title{font-weight:800;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ssdi-artist{font-size:11px;opacity:.75;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ssdi-genre{font-size:10px;opacity:.55;margin-top:2px}
.ssdi-more{
  display:block;width:100%;margin-top:18px;padding:14px;
  border-radius:14px;border:1px solid rgba(255,255,255,.3);
  background:rgba(0,0,0,.4);color:#fff;
  cursor:pointer;font-weight:900;font-size:15px;text-align:center;
}
.ssdi-more:hover{background:rgba(255,255,255,.08)}
.ssdi-more:disabled{opacity:.4;cursor:not-allowed}
.ssdi-none{opacity:.8;padding:12px 0;font-size:14px}
.ssdi-spin{
  display:none;width:16px;height:16px;
  border:2px solid rgba(255,255,255,.3);border-top-color:#fff;
  border-radius:50%;animation:ssdiSpin .7s linear infinite;
  vertical-align:middle;margin-right:8px;
}
.ssdi-more.ssdi-loading .ssdi-spin{display:inline-block}
@keyframes ssdiSpin{to{transform:rotate(360deg)}}