/* copy-button.css: Copy button primitive (P2.T9). A square icon button at least --size-target-min (24) a side that follows a copyable
   value; the success state swaps copy for check in --good. The rest of the look is the icon button's. */
.copy-button {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: var(--size-target-min);
  block-size: var(--size-target-min);
  min-inline-size: var(--size-target-min);
  min-block-size: var(--size-target-min);
  padding: 0;
  border: 0;
  border-radius: var(--radius-control);
  background: transparent;
  color: var(--text-secondary);
}
.copy-button:hover { background: var(--surface-hover); color: var(--text); }
.copy-button[data-copied="true"] { color: var(--good); }
.copy-button__sink { position: fixed; inset-block-start: 0; inset-inline-start: 0; inline-size: var(--border-width); block-size: var(--border-width); opacity: 0; }
@media (width < 768px) and (pointer: coarse) { .copy-button { inline-size: var(--size-control-touch); block-size: var(--size-control-touch); } }