feat: complete UI redesign with DaisyUI + Tailwind CSS v4

Design system overhaul using DaisyUI v5 on Tailwind CSS v4:

- Custom 'ohmstream' dark theme with orange primary (#FF9F1C),
  magenta secondary, gold accent matching existing palette
- Tailwind CSS-first config (input.css source, style.css built output)
- DaisyUI components: navbar, drawer, cards, badges, alerts, tables,
  progress bars, tabs, toggles, stats, form controls, tooltips
- Mobile-first responsive layout with drawer navigation
- Eliminated ~500+ lines of embedded CSS across 15+ template files
- Removed all inline style spam from admin_panel and settings_section
- Preserved all HTMX triggers, Alpine.js state, and Jinja2 logic
- Updated auth-ui.js for DaisyUI tab-active class compatibility

Build: npm run build:css (minified) / npm run watch:css (dev)

templates/components/player_embed.html

@@ -1,4 +1,4 @@
-<div class="player-embed-box" 
+<div class="bg-black rounded-lg border border-base-300 overflow-hidden my-5 p-4" 
      x-data="{ 
         initPlayer() {
             if (!this.$refs.player) return;
@@ -12,66 +12,27 @@
      x-init="initPlayer()">
     
     {% if is_iframe %}
-        <div class="iframe-container">
+        <div class="relative w-full" style="padding-bottom: 56.25%; height: 0; overflow: hidden;">
             <iframe src="{{ video_url }}" 
                     allowfullscreen 
                     webkitallowfullscreen 
-                    mozallowfullscreen></iframe>
+                    mozallowfullscreen
+                    class="absolute top-0 left-0 w-full h-full border-0 rounded-t-lg"></iframe>
         </div>
-        <div class="player-info-hint">
+        <div class="text-xs text-base-content/40 mt-3 text-center">
             <i class="fa-solid fa-lightbulb"></i> Lecteur externe utilisé. Les contrôles dépendent de l'hébergeur.
         </div>
     {% else %}
-        <div class="video-wrapper">
-            <video x-ref="player" playsinline controls preload="metadata">
+        <div class="w-full rounded-lg overflow-hidden">
+            <video x-ref="player" playsinline controls preload="metadata" class="w-full rounded-lg">
                 <source src="{{ video_url }}" type="video/mp4">
             </video>
         </div>
     {% endif %}
     
-    <div class="player-footer-actions">
-        <a href="{{ video_url }}" class="btn btn-sm btn-secondary" target="_blank">
+    <div class="flex justify-center mt-4">
+        <a href="{{ video_url }}" class="btn btn-sm btn-ghost" target="_blank">
             <i class="fas fa-external-link-alt"></i> Ouvrir sur l'hébergeur
         </a>
     </div>
 </div>
-
-<style>
-.player-embed-box {
-    margin: 20px 0;
-    padding: 15px;
-    background: #000;
-    border-radius: 4px;
-    border: 1px solid #2a2d32;
-}
-.iframe-container {
-    position: relative;
-    padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
-    height: 0;
-    overflow: hidden;
-}
-.iframe-container iframe {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    border: none;
-}
-.video-wrapper {
-    max-width: 100%;
-    border-radius: 8px;
-    overflow: hidden;
-}
-.player-info-hint {
-    font-size: 0.8rem;
-    color: var(--text-dim);
-    margin-top: 10px;
-    text-align: center;
-}
-.player-footer-actions {
-    margin-top: 15px;
-    display: flex;
-    justify-content: center;
-}
-</style>