refactor: improve download dropdown UX and styling

- Use lightweight fade‑in hover

youtube/static/watch.css

@@ -358,7 +358,7 @@ figure.sc-video {
     font-size: 0.875rem;
 }
 .download-table thead {
-    background: var(--primary-background);
+    background: var(--thead-background);
     position: sticky;
     top: 0;
     z-index: 1;
@@ -379,26 +379,23 @@ figure.sc-video {
     transition: all 0.2s ease;
 }
 .download-table tbody tr:hover {
-    background: rgba(0,0,0,0.04);
+    background: var(--primary-background);
 }
 .download-table a.download-link {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    padding: 0.45rem 0.9rem;
-    background: var(--buttom);
+    display: inline-block;
+    padding: 0.4rem 0.85rem;
+    background: rgba(0,0,0,0.12);
     color: var(--buttom-text);
     text-decoration: none;
     border-radius: 5px;
     font-weight: 500;
     font-size: 0.85rem;
-    transition: all 0.2s ease;
-    min-width: 80px;
+    transition: background 0.2s ease;
+    white-space: nowrap;
 }
 .download-table a.download-link:hover {
-    background: var(--buttom-hover);
+    background: rgba(0,0,0,0.28);
     color: var(--buttom-text);
-    transform: translateY(-1px);
 }
 .download-table tbody tr:last-child td {
     border-bottom: none;
@@ -410,13 +407,8 @@ figure.sc-video {
 }
 .download-table td[data-label="Link"] {
     white-space: nowrap;
-    padding: 0.4rem 0;
     vertical-align: middle;
 }
-.download-table td[data-label="Link"] a {
-    display: inline-block;
-    white-space: nowrap;
-}
 .download-table td[data-label="Codecs"] {
     max-width: 180px;
     text-overflow: ellipsis;