PLAYER: reworked player panel and fulscreen

templates/player/shell.html

@@ -946,6 +946,7 @@
     <div class="player-bar"
          :class="{ 'mobile-expanded': $store.mobile.playerExpanded, 'mobile-dragging': $store.mobile.playerDragging }"
          :style="$store.mobile.playerDragStyle()"
+         @click.capture="$store.mobile.handlePlayerClick($event)"
          @pointerdown="$store.mobile.startPlayerDrag($event)">
         <button class="mobile-player-collapse-btn" type="button" @click.stop="$store.mobile.closePlayerFullscreen()" title="{{ t.player_close }}" aria-label="{{ t.player_close }}">
             <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4">
@@ -956,8 +957,7 @@
             <template x-if="$store.player.currentTrack">
                 <div style="display:flex;align-items:center;gap:12px;overflow:hidden">
                     <div class="player-cover"
-                         @click.stop="$store.mobile.openPlayerFullscreen()"
-                         @pointerdown.stop="$store.mobile.startPlayerDrag($event, true)">
+                         @click.stop="$store.mobile.openPlayerFullscreen()">
                         <template x-if="$store.player.currentTrack.cover_url">
                             <img :src="$store.player.currentTrack.cover_url" :alt="$store.player.currentTrack.title">
                         </template>
@@ -1030,6 +1030,8 @@
                         <div class="progress-bar-thumb"></div>
                     </div>
                 </div>
+                <div class="player-progress-strip-times"
+                     x-text="'-' + formatTime(Math.max(0, $store.player.duration - $store.player.currentTime)) + ' / ' + formatTime($store.player.duration)"></div>
                 <span class="player-time" x-text="formatTime($store.player.duration)"></span>
             </div>
             <div class="player-version-chip">v{{ t.app_version() }}</div>