feat: unify style with copy package name button

Author: ghostdevv

app/pages/package/[[org]]/[name].vue

@@ -686,7 +686,7 @@ const showSkeleton = shallowRef(false)
               </span>
             </h1>
 
-            <!-- Floating copy button -->
+            <!-- Floating copy name button -->
             <button
               type="button"
               @click="copyPkgName()"
@@ -709,30 +709,43 @@ const showSkeleton = shallowRef(false)
             v-if="resolvedVersion"
             class="inline-flex items-baseline gap-1.5 font-mono text-base sm:text-lg text-fg-muted shrink-0"
           >
-            <!-- Version resolution indicator (e.g., "latest → 4.2.0") -->
-            <template v-if="requestedVersion && resolvedVersion !== requestedVersion">
-              <span class="font-mono text-fg-muted text-sm" dir="ltr">{{ requestedVersion }}</span>
-              <span class="i-carbon:arrow-right rtl-flip w-3 h-3" aria-hidden="true" />
-            </template>
+            <div class="relative inline-flex gap-1.5 items-baseline group">
+              <!-- Version resolution indicator (e.g., "latest → 4.2.0") -->
+              <template v-if="requestedVersion && resolvedVersion !== requestedVersion">
+                <span class="font-mono text-fg-muted text-sm" dir="ltr">
+                  {{ requestedVersion }}
+                </span>
+                <span class="i-carbon:arrow-right rtl-flip w-3 h-3" aria-hidden="true" />
+              </template>
 
-            <LinkBase
-              v-if="requestedVersion && resolvedVersion !== requestedVersion"
-              :to="packageRoute(pkg.name, resolvedVersion)"
-              :title="$t('package.view_permalink')"
-              dir="ltr"
-              >{{ resolvedVersion }}</LinkBase
-            >
-            <span dir="ltr" v-else class="inline-flex items-center gap-1"
-              >v{{ resolvedVersion }}
+              <LinkBase
+                v-if="requestedVersion && resolvedVersion !== requestedVersion"
+                :to="packageRoute(pkg.name, resolvedVersion)"
+                :title="$t('package.view_permalink')"
+                dir="ltr"
+              >
+                {{ resolvedVersion }}
+              </LinkBase>
 
-              <ButtonBase
-                size="small"
-                class="opacity-50 hover:opacity-100 transition-opacity"
-                :classicon="copiedVersion ? 'i-carbon:checkmark' : 'i-carbon:copy'"
-                :title="copiedVersion ? $t('common.copied') : $t('package.copy_version')"
+              <!-- Floating copy version button -->
+              <button
+                type="button"
                 @click="copyVersion()"
-              />
-            </span>
+                class="absolute z-20 inset-is-0 top-full inline-flex items-center gap-1 px-2 py-1 rounded border text-xs font-mono whitespace-nowrap transition-all duration-150 opacity-0 -translate-y-1 pointer-events-none group-hover:opacity-100 group-hover:translate-y-0 group-hover:pointer-events-auto focus-visible:opacity-100 focus-visible:translate-y-0 focus-visible:pointer-events-auto"
+                :class="[
+                  $style.copyButton,
+                  copiedVersion ? 'text-accent bg-accent/10' : 'text-fg-muted bg-bg border-border',
+                ]"
+                :aria-label="copiedVersion ? $t('common.copied') : $t('package.copy_version')"
+              >
+                <span
+                  :class="copiedVersion ? 'i-carbon:checkmark' : 'i-carbon:copy'"
+                  class="w-3.5 h-3.5"
+                  aria-hidden="true"
+                />
+                {{ copiedVersion ? $t('common.copied') : $t('package.copy_version') }}
+              </button>
+            </div>
 
             <template v-if="hasProvenance(displayVersion)">
               <TooltipApp