.ht-single-share{
  margin-top:12px;
}

.ht-single__main .ht-single-share{
  margin-top:12px;
}

.ht-single-share .ht-sec-head{
  margin-bottom:12px;
}

.ht-single-share .share-panel{
  padding:14px 16px;
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:#ffffff;
  display:flex;
  flex-direction:column;
  gap:12px;
}

html[data-theme="dark"] .ht-single-share .share-panel{
  background:var(--surface-2);
}

.ht-single-share .share-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.ht-single-share .share-btn{
  inline-size:34px;
  block-size:34px;
  border-radius:999px;
  border:1px solid color-mix(in oklab,var(--border),transparent 10%);
  background:var(--surface);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  cursor:pointer;
  color:var(--fg-muted);
  transition:background .16s ease,
             border-color .16s ease,
             color .16s ease,
             transform .12s ease;
}

.ht-single-share .share-btn .ic{
  inline-size:18px;
  block-size:18px;
}

.ht-single-share .share-btn:hover{
  background:color-mix(in oklab,var(--surface),var(--brand-100) 30%);
  border-color:var(--brand-400);
  color:var(--fg);
  transform:translateY(-1px);
}

.ht-single-share .share-btn:active{
  transform:translateY(0);
}

html[data-theme="dark"] .ht-single-share .share-btn{
  background:var(--surface);
  border-color:var(--border);
  color:var(--fg-muted);
}

html[data-theme="dark"] .ht-single-share .share-btn:hover{
  background:color-mix(in oklab,var(--surface),var(--brand-900) 30%);
  border-color:var(--brand-300);
  color:var(--fg);
}

.ht-single-share .share-copy{
  display:flex;
  align-items:center;
  gap:8px;
  direction:ltr;
}

.ht-single-share .share-input{
  flex:1 1 auto;
  min-width:0;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--surface);
  font-size:13px;
  line-height:1.6;
  color:var(--fg);
  outline:none;
}

.ht-single-share .share-input:focus{
  border-color:var(--brand-400);
}

html[data-theme="dark"] .ht-single-share .share-input{
  background:var(--surface);
  border-color:var(--border);
  color:var(--fg);
}

.ht-single-share .copy-btn{
  inline-size:34px;
  block-size:34px;
  border-radius:999px;
  border:1px solid color-mix(in oklab,var(--border),transparent 10%);
  background:var(--surface);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  cursor:pointer;
  color:var(--fg-muted);
  transition:background .16s ease,
             border-color .16s ease,
             color .16s ease,
             transform .12s ease;
}

.ht-single-share .copy-btn .ic{
  inline-size:18px;
  block-size:18px;
}

.ht-single-share .copy-btn:hover{
  background:color-mix(in oklab,var(--surface),var(--brand-100) 30%);
  border-color:var(--brand-400);
  color:var(--fg);
  transform:translateY(-1px);
}

.ht-single-share .copy-btn:active{
  transform:translateY(0);
}

html[data-theme="dark"] .ht-single-share .copy-btn{
  background:var(--surface);
  border-color:var(--border);
  color:var(--fg-muted);
}

html[data-theme="dark"] .ht-single-share .copy-btn:hover{
  background:color-mix(in oklab,var(--surface),var(--brand-900) 30%);
  border-color:var(--brand-300);
  color:var(--fg);
}

.ht-single-share .share-toast{
  margin-top:4px;
  min-height:0;
  font-size:12px;
  color:var(--fg-muted);
  opacity:0;
  transform:translateY(2px);
  transition:opacity .18s ease,transform .18s ease;
}

.ht-single-share .share-toast.is-show{
  opacity:1;
  transform:translateY(0);
}

@media (max-width:480px){
  .ht-single-share .share-panel{
    padding:12px 12px;
  }
}