.j3-ss-container{
  --j3ss-accent:#333;
  --j3ss-gap:10px;
  --j3ss-radius:6px;
  margin:15px 0;
}
.j3-ss-title{ margin:0 0 10px; font-weight:600; }
.j3-ss-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:var(--j3ss-gap);
}
.j3-ss-button{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:var(--j3ss-radius);
  border:1px solid rgba(0,0,0,.12);
  background:rgba(0,0,0,.03);
  color:inherit;
  text-decoration:none;
  line-height:1;
  user-select:none;
}
.j3-ss-button:hover{
  background:rgba(0,0,0,.08);
}
.j3-ss-ico svg{ display:block; }
.j3-ss-label{ white-space:nowrap; font-size:13px; opacity:.9; }

.j3-ss-size-s .j3-ss-button{ padding:6px 10px; }
.j3-ss-size-l .j3-ss-button{ padding:10px 14px; }

.j3-ss-radius-0{ --j3ss-radius:0px; }
.j3-ss-radius-6{ --j3ss-radius:6px; }
.j3-ss-radius-12{ --j3ss-radius:12px; }
.j3-ss-radius-pill{ --j3ss-radius:999px; }

.j3-ss-button.copied{ outline:2px solid rgba(0,0,0,.2); }

@media (max-width:575px){
  .j3-ss-mode-icon_text .j3-ss-label{ display:none; }
  .j3-ss-buttons{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  .j3-ss-button{ flex:0 0 auto; padding:10px 12px; }
}
