fix(web): long artist name overflow + textarea resize artifact

- Player.vue: wrap artist text in a span with ellipsis. The previous
  text node sat directly inside the flex `.song-artist` container with
  no overflow handling, so a long author name expanded the container
  past its 240px parent and broke the bottom Player bar layout. Also
  add `min-width: 0 + overflow: hidden` to `.song-info` and
  `.song-artist`, and a `:title` attribute for the full text on hover.

- Settings.vue: change `resize: vertical` on the cookie textareas
  to `resize: none`. The browser's resize grip rendered as a stray
  black triangle at the bottom-right corner in dark theme, and
  dragging it caused visual artifacts on the right edge. The
  textareas keep their `rows="3"` default height.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

web/src/components/Player.vue

@@ -27,10 +27,10 @@
       <div class="player-left" @click="toggleLyrics">
         <CoverArt :url="currentSong.coverUrl" :size="40" />
         <div class="song-info">
-          <div class="song-name">{{ currentSong.name }}</div>
+          <div class="song-name" :title="currentSong.name">{{ currentSong.name }}</div>
           <div class="song-artist">
             <span v-if="showBotBadge" class="bot-badge">{{ activeBot?.name }}</span>
-            {{ currentSong.artist }}
+            <span class="artist-name" :title="currentSong.artist">{{ currentSong.artist }}</span>
           </div>
         </div>
       </div>
@@ -310,6 +310,8 @@ function cycleMode() {
 
 .song-info {
   min-width: 0;
+  flex: 1;
+  overflow: hidden;
 }
 
 .song-name {
@@ -326,6 +328,16 @@ function cycleMode() {
   display: flex;
   align-items: center;
   gap: 4px;
+  min-width: 0;
+  overflow: hidden;
+}
+
+.artist-name {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  min-width: 0;
+  flex: 1;
 }
 
 .bot-badge {

web/src/views/Settings.vue

@@ -1483,7 +1483,7 @@ onUnmounted(() => {
   font-family: inherit;
   font-size: 13px;
   outline: none;
-  resize: vertical;
+  resize: none;
   &:focus { border-color: var(--color-primary); }
 }