Add lyrics pipeline, playlist views, admin toggles, and player polish

Lyrics pipeline (Whisper + Demucs + description alignment):
- New GenerateLyricsJob runs WhisperX with VAD filtering and forced word
  alignment, writes per-track JSON to NAS.
- New DecorateLyricsJob calls the active LLM provider to bake one to
  several emojis into each line (heavy decoration prompt).
- LyricsDescriptionParser strips heading content, section markers, and
  emoji-decoration from a song's description while preserving every
  language verbatim.
- correct_whisper_with_description aligner: strong-match anchors only,
  vocal-region-aware gap-fill so missing verses land on actual singing.
- Owner UI for generate/regenerate/edit/delete in the player gear.

Admin pages:
- /admin/lyrics    toggles for VAD, vocal gap-fill, Demucs, master
- /admin/gpu       extracted GPU section, encoder picker, FFmpeg path
- /admin/backup    extracted users-and-settings export/import
- /admin/settings  now AI/LLM only with provider list and Test button
- /admin/nas-storage hosts NAS settings, repair, disable flow, browser
- Shared partials/settings-styles for a uniform look across pages.

Playlist view tracking:
- Migration adds playlists.view_count and playlist_views dedup table.
- Playlist::bumpViewIfNew increments per device with a one-hour window.
- Tracked from /playlists/{id}, /playlists/share/{token}, /ps/{token},
  and /videos/{id}?playlist={token}.  Dispatched after-response so it
  never blocks the page render.
- Loading a playlist on the video page now runs one query instead of
  the four the old getNextVideo/getPreviousVideo path triggered.
- View counts shown on every playlist card and the playlist hero.

Player polish:
- Floating mini-player is draggable, persists its position in
  localStorage, clamps to viewport on resize.
- Mini disabled entirely on mobile (less than 768px).
- New gear-menu Mini Player toggle (persists in localStorage) lets the
  user disable both scroll-activation and SPA-nav-activation.
- Close button keeps media playing when used on the player's own page.
- SPA navigator now swaps a #page-scripts container so per-page JS
  (channel tabs, etc.) gets re-executed after content swaps.

Storage layout:
- Runtime data moved from /storage/* to /data/* and gitignored.
- /ml/venv, /ml/cache, /ml/__pycache__ excluded.

Co-Authored-By: Claude Opus 4.7 <[email protected]>

resources/views/components/image-cropper.blade.php

@@ -14,113 +14,8 @@
     $resultCallback = $attributes->get('result-callback', ''); // callback mode: JS fn called with the cropped File
 @endphp
 
-@once
-<link rel="stylesheet" href="{{ asset('css/cropme.min.css') }}">
-<script src="{{ asset('js/cropme.min.js') }}"></script>
-<style>
-/* ── TakeOne Cropper Modal ─────────────────────────── */
-.tc-overlay {
-    display: none; position: fixed; inset: 0; z-index: 10100;
-    background: rgba(0,0,0,.82); backdrop-filter: blur(4px);
-    align-items: center; justify-content: center;
-}
-.tc-overlay.open { display: flex; animation: tcFadeIn .18s ease; }
-@keyframes tcFadeIn { from { opacity: 0; } to { opacity: 1; } }
-.tc-modal {
-    background: #141414; border: 1px solid rgba(255,255,255,.12);
-    border-radius: 18px; width: min(540px, 95vw);
-    box-shadow: 0 24px 80px rgba(0,0,0,.75);
-    overflow: hidden; animation: tcSlideUp .2s cubic-bezier(.34,1.3,.64,1);
-}
-@keyframes tcSlideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
-.tc-modal-header {
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 16px 20px 14px;
-    border-bottom: 1px solid rgba(255,255,255,.07);
-}
-.tc-modal-title {
-    font-size: 15px; font-weight: 700; color: #fff;
-    display: flex; align-items: center; gap: 8px;
-}
-.tc-modal-title i { color: #ef4444; }
-.tc-modal-close {
-    background: none; border: none; color: rgba(255,255,255,.45);
-    font-size: 20px; cursor: pointer; line-height: 1; padding: 4px 6px;
-    border-radius: 6px; transition: color .15s, background .15s;
-}
-.tc-modal-close:hover { color: #fff; background: rgba(255,255,255,.08); }
-.tc-modal-body { padding: 16px 20px; }
-.tc-file-row { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
-.tc-file-label {
-    display: inline-flex; align-items: center; gap: 7px; flex-shrink: 0;
-    height: 36px; padding: 0 14px; border-radius: 8px;
-    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12);
-    color: #fff; font-size: 13px; font-weight: 600; cursor: pointer;
-    transition: background .15s;
-}
-.tc-file-label:hover { background: rgba(255,255,255,.13); }
-.tc-file-name {
-    font-size: 12px; color: rgba(255,255,255,.38); flex: 1;
-    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
-}
-.tc-canvas {
-    width: 100%; height: 320px; background: #0d0d0d;
-    border-radius: 10px; border: 1px solid rgba(255,255,255,.07);
-    overflow: hidden; position: relative;
-}
-.tc-placeholder {
-    position: absolute; inset: 0; display: flex; flex-direction: column;
-    align-items: center; justify-content: center;
-    color: rgba(255,255,255,.2); gap: 10px; pointer-events: none;
-}
-.tc-placeholder i { font-size: 42px; }
-.tc-placeholder span { font-size: 13px; }
-.tc-controls { display: flex; gap: 14px; margin-top: 14px; }
-.tc-control { flex: 1; }
-.tc-control-label {
-    font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
-    color: rgba(255,255,255,.35); margin-bottom: 6px; display: flex; align-items: center; gap: 5px;
-}
-.tc-range {
-    -webkit-appearance: none; appearance: none; width: 100%; height: 3px;
-    background: rgba(255,255,255,.12); border-radius: 3px; outline: none; cursor: pointer;
-}
-.tc-range::-webkit-slider-thumb {
-    -webkit-appearance: none; width: 15px; height: 15px;
-    border-radius: 50%; background: #ef4444; cursor: pointer;
-    box-shadow: 0 0 0 3px rgba(239,68,68,.2); transition: box-shadow .15s;
-}
-.tc-range::-webkit-slider-thumb:hover { box-shadow: 0 0 0 5px rgba(239,68,68,.3); }
-.tc-range::-moz-range-thumb {
-    width: 15px; height: 15px; border: none;
-    border-radius: 50%; background: #ef4444; cursor: pointer;
-}
-.tc-modal-footer {
-    padding: 12px 20px 18px; display: flex; gap: 8px; justify-content: flex-end;
-    border-top: 1px solid rgba(255,255,255,.07); flex-wrap: wrap;
-}
-.tc-btn {
-    display: inline-flex; align-items: center; gap: 7px;
-    height: 38px; padding: 0 18px; border-radius: 8px;
-    font-size: 14px; font-weight: 600; cursor: pointer; border: none; font-family: inherit;
-    transition: background .15s, transform .1s, opacity .15s;
-}
-.tc-btn-ghost {
-    background: rgba(255,255,255,.07); color: rgba(255,255,255,.75);
-    border: 1px solid rgba(255,255,255,.12);
-}
-.tc-btn-ghost:hover { background: rgba(255,255,255,.13); color: #fff; }
-.tc-btn-as-is {
-    background: rgba(255,255,255,.05); color: rgba(255,255,255,.55);
-    border: 1px solid rgba(255,255,255,.09); margin-right: auto;
-}
-.tc-btn-as-is:hover { background: rgba(255,255,255,.1); color: rgba(255,255,255,.85); }
-.tc-btn-as-is:disabled { opacity: .3; cursor: not-allowed; }
-.tc-btn-primary { background: #ef4444; color: #fff; }
-.tc-btn-primary:hover:not(:disabled) { background: #dc2626; transform: translateY(-1px); }
-.tc-btn-primary:disabled { opacity: .45; cursor: not-allowed; }
-</style>
-@endonce
+{{-- Cropme assets + .tc-* styles now live in layouts/app.blade.php <head>
+     so they survive SPA-nav innerHTML swaps on #main. --}}
 
 {{-- Modal --}}
 <div class="tc-overlay" id="tcOverlay_{{ $id }}" role="dialog" aria-modal="true">