diff --git a/app/database.py b/app/database.py
index a11cbe0..ce29310 100644
--- a/app/database.py
+++ b/app/database.py
@@ -23,6 +23,7 @@ def create_db_and_tables():
     from app.models.favorites import FavoriteTable
     from app.models.sonarr import SonarrMappingTable, SonarrConfigTable
     from app.models.settings import AppSettingsTable
+    from app.models.download import DownloadTaskTable
     
     SQLModel.metadata.create_all(engine)
     
diff --git a/app/download_manager.py b/app/download_manager.py
index 8ff3a4a..1dbf3fe 100644
--- a/app/download_manager.py
+++ b/app/download_manager.py
@@ -2,13 +2,16 @@ import asyncio
 import os
 import uuid
 import logging
-import asyncio
 from datetime import datetime
 from pathlib import Path
 from typing import Dict, Optional
 import httpx
 from app.models import DownloadTask, DownloadStatus, DownloadRequest
+from app.models.download import DownloadTaskTable
+from app.database import engine
+from sqlmodel import Session, select
 from app.downloaders import get_downloader
+from app.utils import sanitize_filename
 
 logger = logging.getLogger(__name__)
 
@@ -24,6 +27,92 @@ class DownloadManager:
         self.active_downloads: Dict[str, asyncio.Task] = {}
         self._semaphore = asyncio.Semaphore(max_parallel)
 
+    # ==================== DB Persistence ====================
+
+    def _save_task_to_db(self, task: DownloadTask) -> None:
+        """Persist a download task to the database (upsert)."""
+        try:
+            with Session(engine) as session:
+                existing = session.get(DownloadTaskTable, task.id)
+                if existing:
+                    existing.url = task.url
+                    existing.filename = task.filename
+                    existing.host = task.host.value if hasattr(task.host, 'value') else str(task.host)
+                    existing.status = task.status.value if hasattr(task.status, 'value') else str(task.status)
+                    existing.progress = task.progress
+                    existing.downloaded_bytes = task.downloaded_bytes
+                    existing.total_bytes = task.total_bytes
+                    existing.speed = task.speed
+                    existing.error = task.error
+                    existing.started_at = task.started_at
+                    existing.completed_at = task.completed_at
+                    existing.file_path = task.file_path
+                    session.add(existing)
+                    session.commit()
+                else:
+                    db_task = DownloadTaskTable(
+                        id=task.id,
+                        url=task.url,
+                        filename=task.filename,
+                        host=task.host.value if hasattr(task.host, 'value') else str(task.host),
+                        status=task.status.value if hasattr(task.status, 'value') else str(task.status),
+                        progress=task.progress,
+                        downloaded_bytes=task.downloaded_bytes,
+                        total_bytes=task.total_bytes,
+                        speed=task.speed,
+                        error=task.error,
+                        created_at=task.created_at,
+                        started_at=task.started_at,
+                        completed_at=task.completed_at,
+                        file_path=task.file_path,
+                    )
+                    session.add(db_task)
+                    session.commit()
+        except Exception as e:
+            logger.error(f"Failed to save task {task.id} to DB: {e}", exc_info=True)
+
+    def _delete_task_from_db(self, task_id: str) -> None:
+        """Remove a download task from the database."""
+        try:
+            with Session(engine) as session:
+                db_task = session.get(DownloadTaskTable, task_id)
+                if db_task:
+                    session.delete(db_task)
+                    session.commit()
+        except Exception as e:
+            logger.error(f"Failed to delete task {task_id} from DB: {e}", exc_info=True)
+
+    def _load_tasks_from_db(self) -> None:
+        """Load persisted download tasks from the database into memory."""
+        try:
+            with Session(engine) as session:
+                statement = select(DownloadTaskTable)
+                db_tasks = session.exec(statement).all()
+                for db_task in db_tasks:
+                    if db_task.id not in self.tasks:
+                        task = DownloadTask(
+                            id=db_task.id,
+                            url=db_task.url,
+                            filename=db_task.filename,
+                            host="other",
+                            status=DownloadStatus(db_task.status),
+                            progress=db_task.progress,
+                            downloaded_bytes=db_task.downloaded_bytes,
+                            total_bytes=db_task.total_bytes,
+                            speed=db_task.speed,
+                            error=db_task.error,
+                            created_at=db_task.created_at,
+                            started_at=db_task.started_at,
+                            completed_at=db_task.completed_at,
+                            file_path=db_task.file_path,
+                        )
+                        self.tasks[task.id] = task
+                logger.info(f"Loaded {len(db_tasks)} download tasks from database")
+        except Exception as e:
+            logger.error(f"Failed to load tasks from DB: {e}", exc_info=True)
+
+    # ==================== Task Management ====================
+
     def get_task(self, task_id: str) -> Optional[DownloadTask]:
         return self.tasks.get(task_id)
 
@@ -60,6 +149,8 @@ class DownloadManager:
             created_at=datetime.now()
         )
         self.tasks[task_id] = task
+        # Persist to database
+        self._save_task_to_db(task)
         return task
 
     async def start_download(self, task_id: str):
@@ -82,6 +173,7 @@ class DownloadManager:
         task = self.tasks.get(task_id)
         if task and task.status == DownloadStatus.DOWNLOADING:
             task.status = DownloadStatus.PAUSED
+            self._save_task_to_db(task)
             if task_id in self.active_downloads:
                 self.active_downloads[task_id].cancel()
                 del self.active_downloads[task_id]
@@ -90,6 +182,7 @@ class DownloadManager:
         task = self.tasks.get(task_id)
         if task:
             task.status = DownloadStatus.CANCELLED
+            self._save_task_to_db(task)
             if task_id in self.active_downloads:
                 self.active_downloads[task_id].cancel()
                 del self.active_downloads[task_id]
@@ -112,14 +205,16 @@ class DownloadManager:
                 if task.file_path and os.path.exists(task.file_path):
                     os.remove(task.file_path)
 
-            # Remove from tasks dict
+            # Remove from tasks dict and database
             del self.tasks[task_id]
+            self._delete_task_from_db(task_id)
 
     async def _download(self, task: DownloadTask):
         async with self._semaphore:
             try:
                 task.status = DownloadStatus.DOWNLOADING
                 task.started_at = datetime.now()
+                self._save_task_to_db(task)
 
                 # Get downloader and extract link
                 downloader = get_downloader(task.url)
@@ -150,6 +245,9 @@ class DownloadManager:
                 else:
                     logger.debug(f"Task filename kept as: {task.filename}")
 
+                # Sanitize filename to prevent path traversal and invalid characters
+                task.filename = sanitize_filename(task.filename)
+
                 task.file_path = str(self.download_dir / task.filename)
 
                 # Check if URL is HLS/m3u8 - use ffmpeg to download
@@ -157,6 +255,7 @@ class DownloadManager:
                     logger.info(f"Detected HLS stream, using ffmpeg to download: {task.filename}")
                     success = await self._download_hls(download_url, task)
                     if success:
+                        self._save_task_to_db(task)
                         return
                     # If ffmpeg fails, fall through to regular download attempt
                     logger.warning("ffmpeg download failed, trying regular download")
@@ -167,8 +266,12 @@ class DownloadManager:
                     # Move file to expected location if different
                     import shutil
                     if download_url != task.file_path:
-                        shutil.move(download_url, task.file_path)
-                        logger.debug(f"Moved file to: {task.file_path}")
+                        try:
+                            shutil.move(download_url, task.file_path)
+                            logger.debug(f"Moved file to: {task.file_path}")
+                        except shutil.Error:
+                            # Same file, no move needed
+                            pass
 
                     # Mark as complete
                     file_size = os.path.getsize(task.file_path)
@@ -178,6 +281,7 @@ class DownloadManager:
                     task.downloaded_bytes = file_size
                     task.total_bytes = file_size
                     task.completed_at = datetime.now()
+                    self._save_task_to_db(task)
                     return
 
                 # Check if file already exists and is complete (for VidMoly which downloads directly)
@@ -190,6 +294,7 @@ class DownloadManager:
                         task.downloaded_bytes = file_size
                         task.total_bytes = file_size
                         task.completed_at = datetime.now()
+                        self._save_task_to_db(task)
                         return
 
                 # Check for partial download (resume)
@@ -241,6 +346,7 @@ class DownloadManager:
             except Exception as e:
                 task.status = DownloadStatus.FAILED
                 task.error = str(e)
+                self._save_task_to_db(task)
             finally:
                 if task.id in self.active_downloads:
                     del self.active_downloads[task.id]
@@ -269,9 +375,11 @@ class DownloadManager:
 
             async for chunk in response.aiter_bytes(chunk_size=1024 * 1024):
                 if task.status == DownloadStatus.CANCELLED:
+                    self._save_task_to_db(task)
                     return
 
                 if task.status == DownloadStatus.PAUSED:
+                    self._save_task_to_db(task)
                     return
 
                 f.write(chunk)
@@ -295,6 +403,9 @@ class DownloadManager:
         final_size = os.path.getsize(task.file_path) if os.path.exists(task.file_path) else 0
         logger.info(f" ✅ Completed: {task.filename} ({final_size / (1024*1024):.2f} MB)")
 
+        # Persist to database
+        self._save_task_to_db(task)
+
     async def _download_hls(self, m3u8_url: str, task: DownloadTask) -> bool:
         """Download HLS/m3u8 stream using ffmpeg"""
         import subprocess
@@ -386,6 +497,7 @@ class DownloadManager:
                     task.downloaded_bytes = file_size
                     task.total_bytes = file_size
                     task.completed_at = datetime.now()
+                    self._save_task_to_db(task)
                     return True
                 else:
                     logger.error(f"HLS download failed: file not created")
diff --git a/app/downloaders/anime_sites/animesama.py b/app/downloaders/anime_sites/animesama.py
index a09da34..23e37ec 100644
--- a/app/downloaders/anime_sites/animesama.py
+++ b/app/downloaders/anime_sites/animesama.py
@@ -144,12 +144,34 @@ class AnimeSamaDownloader(BaseAnimeSite):
                 logger.info(f"Direct video URL detected: {url[:60]}... -> {filename}")
                 return url, filename
 
-            # Check if URL contains the anime page context (format: video_url|anime_page_url|episode_title?)
+            # Check if URL contains the anime page context (format: video_url|...|anime_page_url|episode_title)
+            # The LAST two parts are always anime_page_url and episode_title.
+            # Everything before them is video URLs (multiple sources for fallback).
             if "|" in url:
                 parts = url.split("|")
-                video_url = parts[0]
-                anime_page_url = parts[1] if len(parts) > 1 else None
-                episode_title = parts[2] if len(parts) > 2 else None
+                # Correctly identify anime_page_url (2nd to last) and episode_title (last)
+                if len(parts) >= 3:
+                    # Multiple video URLs + anime_page_url + episode_title
+                    potential_anime_url = parts[-2].strip()
+                    potential_title = parts[-1].strip()
+                    # Validate: anime_page_url should look like a URL
+                    # episode_title should NOT look like a URL
+                    if potential_title and not potential_title.startswith("http"):
+                        anime_page_url = potential_anime_url if potential_anime_url.startswith("http") else None
+                        episode_title = potential_title
+                    elif len(parts) >= 5 and parts[-2].startswith("http"):
+                        # Last part is also a URL (no episode title) - 2nd to last is anime page URL
+                        anime_page_url = potential_anime_url
+                        episode_title = None
+                    else:
+                        anime_page_url = None
+                        episode_title = None
+                    # Pass the full URL to fallback (it parses correctly)
+                    video_url = url
+                else:
+                    video_url = parts[0]
+                    anime_page_url = parts[1] if len(parts) > 1 else None
+                    episode_title = None
 
                 logger.debug(
                     f"Split URL - video: {video_url[:60]}..., anime: {anime_page_url}, episode: {episode_title}"
@@ -160,6 +182,7 @@ class AnimeSamaDownloader(BaseAnimeSite):
                     video_url,
                     anime_page_url=anime_page_url,
                     episode_title=episode_title,
+                    target_filename=target_filename,
                 )
 
             # Check if this is a third-party host URL
diff --git a/app/downloaders/series_sites/fs7.py b/app/downloaders/series_sites/fs7.py
index a5ad7d2..01673da 100644
--- a/app/downloaders/series_sites/fs7.py
+++ b/app/downloaders/series_sites/fs7.py
@@ -23,7 +23,7 @@ class FS7Downloader(BaseSeriesSite):
         self.id = "fs7"
         self.provider_id = "fs7"
         self.default_domain = "fs7.lol"
-        self.test_tlds = ["lol", "com", "net", "org", "tv", "ws", "cc", "co"]
+        self.test_tlds = ["lol", "one", "site", "vip", "fun", "stream", "com", "net", "org", "tv", "ws", "cc", "co"]
         self.base_url = f"https://{self.default_domain}"
         self._domain_checked = False
         self.client.headers.update(
@@ -234,35 +234,93 @@ class FS7Downloader(BaseSeriesSite):
             # Clean up title: remove "affiche" suffix
             title = re.sub(r"\s+affiche$", "", title, flags=re.IGNORECASE).strip()
 
-            # Extract description/synopsis
-            description_elem = soup.find("div", class_="full-text")
-            description = (
-                description_elem.get_text(strip=True) if description_elem else ""
-            )
+            # --- Synopsis: div.fdesc > p ---
+            description = ""
+            fdesc = soup.find("div", class_="fdesc")
+            if fdesc:
+                p = fdesc.find("p")
+                if p:
+                    description = p.get_text(strip=True)
+                else:
+                    description = fdesc.get_text(strip=True)
 
-            # Extract cover image
-            img = soup.find("img", class_="poster")
-            poster_image = img.get("src", "") if img else ""
+            # --- Poster: div.fleft > img ---
+            poster_image = ""
+            fleft = soup.find("div", class_="fleft")
+            if fleft:
+                img = fleft.find("img")
+                if img:
+                    poster_image = (
+                        img.get("data-src")
+                        or img.get("data-original")
+                        or img.get("src")
+                        or ""
+                    )
 
-            # Try to get poster from meta tag if not found
+            # Fallback: img.poster, then og:image
+            if not poster_image:
+                img = soup.find("img", class_="poster")
+                poster_image = img.get("src", "") if img else ""
             if not poster_image:
                 meta_img = soup.find("meta", property="og:image")
                 poster_image = meta_img.get("content", "") if meta_img else ""
 
-            # Extract year
-            year_match = re.search(r"\b(19|20)\d{2}\b", description)
-            release_year = int(year_match.group()) if year_match else None
+            # --- Year: span.release ---
+            release_year = None
+            release_span = soup.find("span", class_="release")
+            if release_span:
+                year_match = re.search(r"\b(19|20)\d{2}\b", release_span.get_text())
+                if year_match:
+                    release_year = int(year_match.group())
+
+            # --- Genres: span.genres ---
+            genres = []
+            genres_span = soup.find("span", class_="genres")
+            if genres_span:
+                genres = [
+                    g.strip()
+                    for g in genres_span.get_text().split(",")
+                    if g.strip()
+                ]
+
+            # --- Runtime: span.runtime ---
+            runtime = None
+            runtime_span = soup.find("span", class_="runtime")
+            if runtime_span:
+                runtime = runtime_span.get_text(strip=True)
+
+            # --- Casting info from second div.flist ---
+            original_title = ""
+            director = ""
+            cast = []
+            flists = soup.find_all("div", class_="flist")
+            for fl in flists:
+                text = fl.get_text(strip=True)
+                if "Titre Original" in text:
+                    m = re.search(r"Titre Original\s*:\s*(.+?)(?:Réalisateur|$)", text)
+                    if m:
+                        original_title = m.group(1).strip()
+                    m2 = re.search(r"Réalisateur\s*:\s*(.+?)(?:Avec\s*:|$)", text)
+                    if m2:
+                        director = m2.group(1).strip()
+                    m3 = re.search(r"Avec\s*:\s*(.+?)(?:plus|$)", text)
+                    if m3:
+                        cast = [c.strip() for c in m3.group(1).split(",") if c.strip()]
 
             return {
                 "title": title,
                 "synopsis": description,
                 "poster_image": poster_image,
                 "release_year": release_year,
-                "genres": [],
+                "genres": genres,
                 "rating": None,
                 "studio": None,
                 "total_episodes": None,
                 "status": None,
+                "original_title": original_title,
+                "director": director,
+                "cast": cast,
+                "runtime": runtime,
             }
 
         except Exception as e:
@@ -301,3 +359,80 @@ class FS7Downloader(BaseSeriesSite):
             return await player.get_download_link(url, target_filename)
         else:
             raise ValueError(f"No video player found for URL: {url}")
+
+    async def get_latest_series(self, limit: int = 20) -> List[Dict[str, Any]]:
+        """
+        Scrape the 'Nouveautés Séries' section from FS7 homepage.
+
+        Returns:
+            List of dicts with title, url, cover_image, synopsis, lang, provider_id.
+        """
+        await self._ensure_base_url()
+
+        try:
+            resp = await self.client.get(self.base_url + "/", timeout=15)
+            soup = BeautifulSoup(resp.text, "html.parser")
+        except Exception as e:
+            logger.error(f"Failed to fetch FS7 homepage: {e}")
+            return []
+
+        results = []
+
+        # Find the 'Nouveautés Séries' section
+        for section in soup.find_all("div", class_="pages"):
+            title_el = section.find("div", class_="sect-t")
+            if not title_el:
+                continue
+            title = title_el.get_text(strip=True)
+            if "Nouveautés" not in title or "Séries" not in title:
+                continue
+
+            for item in section.find_all("div", class_="short"):
+                # Get the poster link (contains real URL)
+                poster_a = item.find("a", class_="short-poster", href=True)
+                if not poster_a:
+                    continue
+
+                url = poster_a["href"]
+                if url.startswith("/"):
+                    url = self.base_url + url
+
+                # Title from alt attribute
+                title_attr = poster_a.get("alt", "").strip()
+                if not title_attr:
+                    continue
+
+                # Poster image
+                img = poster_a.find("img")
+                cover_image = img.get("src", "") if img else ""
+
+                # Synopsis from hidden span
+                desc_span = item.find("span", id=re.compile(r"^desc-\d+"))
+                synopsis = desc_span.get_text(strip=True) if desc_span else ""
+
+                # Language (VF/VOSTFR)
+                lang = "vf"
+                version_span = item.find("span", class_="film-version")
+                if version_span:
+                    version_text = version_span.get_text(strip=True).upper()
+                    if "VOSTFR" in version_text:
+                        lang = "vostfr"
+                    elif "VF" in version_text:
+                        lang = "vf"
+
+                results.append({
+                    "title": title_attr,
+                    "url": url,
+                    "cover_image": cover_image,
+                    "synopsis": synopsis,
+                    "lang": lang,
+                    "provider_id": self.provider_id,
+                    "content_type": "series",
+                })
+
+                if len(results) >= limit:
+                    break
+            break  # Only process the first matching section
+
+        logger.info(f"FS7 latest series: found {len(results)} items")
+        return results
diff --git a/app/models/__init__.py b/app/models/__init__.py
index 21bcbca..d924cab 100644
--- a/app/models/__init__.py
+++ b/app/models/__init__.py
@@ -70,3 +70,4 @@ from .watchlist import WatchlistItemTable, WatchlistSettingsTable
 from .favorites import FavoriteTable
 from .sonarr import SonarrMappingTable, SonarrConfigTable
 from .settings import AppSettingsTable
+from .download import DownloadTaskTable
diff --git a/app/models/download.py b/app/models/download.py
new file mode 100644
index 0000000..7e55f34
--- /dev/null
+++ b/app/models/download.py
@@ -0,0 +1,40 @@
+"""Models for download task persistence with SQLModel support"""
+import uuid
+from typing import Optional
+from datetime import datetime
+from sqlmodel import SQLModel, Field, Column, String
+from enum import Enum
+
+
+class DownloadStatus(str, Enum):
+    PENDING = "pending"
+    DOWNLOADING = "downloading"
+    PAUSED = "paused"
+    COMPLETED = "completed"
+    FAILED = "failed"
+    CANCELLED = "cancelled"
+
+
+class DownloadTaskTable(SQLModel, table=True):
+    """Database table for persisting download tasks across server restarts."""
+    __tablename__ = "download_tasks"
+
+    id: str = Field(
+        default_factory=lambda: str(uuid.uuid4()),
+        primary_key=True,
+        index=True,
+        nullable=False,
+    )
+    url: str = Field(default="", sa_column=Column(String))
+    filename: str = Field(sa_column=Column(String))
+    host: str = Field(default="other", sa_column=Column(String))
+    status: str = Field(default="pending", sa_column=Column(String))
+    progress: float = Field(default=0.0)
+    downloaded_bytes: int = Field(default=0)
+    total_bytes: Optional[int] = Field(default=None)
+    speed: float = Field(default=0.0)
+    error: Optional[str] = Field(default=None, sa_column=Column(String))
+    created_at: datetime = Field(default_factory=datetime.now)
+    started_at: Optional[datetime] = Field(default=None)
+    completed_at: Optional[datetime] = Field(default=None)
+    file_path: Optional[str] = Field(default=None, sa_column=Column(String))
diff --git a/app/models/settings.py b/app/models/settings.py
index c705c92..e131a13 100644
--- a/app/models/settings.py
+++ b/app/models/settings.py
@@ -27,6 +27,13 @@ class AppSettingsBase(SQLModel):
 
     # #12: Custom download directory
     download_dir: str = Field(default="downloads")
+
+    # #13: Content weight mode ("auto" = based on download habits, "manual" = user-defined)
+    content_weight_mode: str = Field(default="auto", sa_column=Column(String))
+
+    # #14: Manual content weights (used when content_weight_mode = "manual")
+    content_weight_anime: int = Field(default=2)
+    content_weight_series: int = Field(default=1)
     
     @property
     def disabled_providers(self) -> List[str]:
@@ -64,6 +71,9 @@ class AppSettings(BaseModel):
     anime_enabled: bool = True
     series_enabled: bool = True
     download_dir: str = "downloads"
+    content_weight_mode: str = "auto"
+    content_weight_anime: int = 2
+    content_weight_series: int = 1
     
     class Config:
         from_attributes = True
@@ -79,3 +89,6 @@ class AppSettingsUpdate(BaseModel):
     anime_enabled: Optional[bool] = None
     series_enabled: Optional[bool] = None
     download_dir: Optional[str] = None
+    content_weight_mode: Optional[str] = None
+    content_weight_anime: Optional[int] = None
+    content_weight_series: Optional[int] = None
diff --git a/app/routers/router_anime.py b/app/routers/router_anime.py
index 1e156c8..75104df 100644
--- a/app/routers/router_anime.py
+++ b/app/routers/router_anime.py
@@ -296,8 +296,7 @@ async def search_series_unified(
 
     search_results = await asyncio.gather(*search_tasks, return_exceptions=True)
 
-    # Enrich results with metadata (synopsis, rating, genres)
-    enricher = await get_metadata_enricher()
+    # Enrich results with metadata from scrapers (not Kitsu — Kitsu is anime-only)
     enrichment_tasks = []
     enrichment_mapping = []
 
@@ -308,17 +307,15 @@ async def search_series_unified(
         elif result:
             results[provider_id] = result
             print(f"[SERIES SEARCH] {provider_id}: Found {len(result)} results")
-            # Prepare enrichment for top 15 results
-            for idx, item in enumerate(result[:15]):
-                if isinstance(item, dict):
-                    enrichment_tasks.append(
-                        enricher.enrich_metadata(
-                            item.get("metadata") or {},
-                            item.get("title") or "",
-                            item.get("url") or "",
+            # Enrich top 10 results with metadata from the scraper itself
+            downloader = series_downloaders.get(provider_id)
+            if downloader and hasattr(downloader, "get_anime_metadata"):
+                for idx, item in enumerate(result[:10]):
+                    if isinstance(item, dict) and item.get("url"):
+                        enrichment_tasks.append(
+                            downloader.get_anime_metadata(item["url"])
                         )
-                    )
-                    enrichment_mapping.append((provider_id, idx))
+                        enrichment_mapping.append((provider_id, idx))
         else:
             print(f"[SERIES SEARCH] {provider_id}: No results returned")
 
@@ -334,9 +331,7 @@ async def search_series_unified(
                     and provider_id in results
                     and pos < len(results[provider_id])
                 ):
-                    results[provider_id][pos]["metadata"] = (
-                        meta.model_dump() if hasattr(meta, "model_dump") else meta
-                    )
+                    results[provider_id][pos]["metadata"] = meta
 
     # Truncate synopses at sentence boundaries
     for pid in results:
diff --git a/app/routers/router_recommendations.py b/app/routers/router_recommendations.py
index 69cff44..cea7953 100644
--- a/app/routers/router_recommendations.py
+++ b/app/routers/router_recommendations.py
@@ -3,15 +3,22 @@ Recommendations and releases routes for Ohm Stream Downloader API.
 """
 
 import hashlib
+import logging
 from datetime import datetime
-from typing import Optional
+from typing import Optional, List, Dict, Any
 
 from fastapi import APIRouter, Request, Query, HTTPException, Depends
 from fastapi.templating import Jinja2Templates
+from sqlmodel import Session, select
 
 from app.recommendation_engine import RecommendationEngine
 from app.models.auth import User
+from app.models.settings import AppSettingsTable
+from app.database import get_session
 from app.routers.router_auth import get_optional_user, get_current_user_from_token
+from app.routers.router_settings import _compute_auto_weights
+
+logger = logging.getLogger(__name__)
 
 router = APIRouter(prefix="/api", tags=["recommendations"])
 templates = Jinja2Templates(directory="templates")
@@ -23,6 +30,79 @@ def hash_filter(s):
 templates.env.filters["hash"] = hash_filter
 
 
+def _get_effective_weights(session: Session, user_id: str) -> tuple:
+    """Return (anime_enabled, series_enabled, anime_weight, series_weight)."""
+    settings = session.exec(
+        select(AppSettingsTable).where(AppSettingsTable.user_id == user_id)
+    ).first()
+
+    if settings is None:
+        return True, True, 1, 1
+
+    anime_enabled = getattr(settings, 'anime_enabled', True)
+    series_enabled = getattr(settings, 'series_enabled', True)
+    mode = getattr(settings, 'content_weight_mode', 'auto')
+    download_dir = getattr(settings, 'download_dir', 'downloads')
+
+    if mode == "auto":
+        weights = _compute_auto_weights(download_dir)
+        return anime_enabled, series_enabled, weights["anime_weight"], weights["series_weight"]
+    else:
+        aw = getattr(settings, 'content_weight_anime', 2)
+        sw = getattr(settings, 'content_weight_series', 1)
+        return anime_enabled, series_enabled, int(aw), int(sw)
+
+
+def _weighted_mix(items_a: List[Dict], items_b: List[Dict], limit: int,
+                  weight_a: int = 2, weight_b: int = 1) -> List[Dict]:
+    """Mix two lists using weights. Distributes items proportionally and interleaves.
+
+    If weight_a=2, weight_b=1 and limit=15:
+      - slots_a ≈ 10, slots_b ≈ 5
+      - B items are spaced evenly across the list
+    If one list is shorter, the other fills remaining slots.
+    """
+    total_weight = weight_a + weight_b
+    if total_weight == 0:
+        return (items_a + items_b)[:limit]
+
+    slots_a = round(limit * weight_a / total_weight)
+    slots_b = limit - slots_a
+
+    pick_a = min(slots_a, len(items_a))
+    pick_b = min(slots_b, len(items_b))
+
+    # Redistribute unfilled slots
+    if pick_a < slots_a:
+        pick_b = min(pick_b + (slots_a - pick_a), len(items_b))
+    elif pick_b < slots_b:
+        pick_a = min(pick_a + (slots_b - pick_b), len(items_a))
+
+    a = items_a[:pick_a]
+    b = items_b[:pick_b]
+
+    total = pick_a + pick_b
+    if total == 0:
+        return []
+    if pick_b == 0:
+        return a[:limit]
+    if pick_a == 0:
+        return b[:limit]
+
+    # Place B items at evenly spaced positions, fill gaps with A
+    result = [None] * total
+    for i, item in enumerate(b):
+        pos = round(i * (total - 1) / max(pick_b - 1, 1))
+        result[pos] = item
+    a_idx = 0
+    for i in range(total):
+        if result[i] is None:
+            result[i] = a[a_idx]
+            a_idx += 1
+
+    return result[:limit]
+
+
 @router.get("/recommendations")
 async def get_recommendations(
     request: Request,
@@ -30,8 +110,9 @@ async def get_recommendations(
     html: bool = Query(False),
     content_type: Optional[str] = Query(None, description="Filter: 'anime', 'series', or None for all"),
     current_user: Optional[User] = Depends(get_optional_user),
+    session: Session = Depends(get_session),
 ):
-    """Get personalized anime recommendations based on download history"""
+    """Get personalized recommendations based on user settings (anime + series)"""
     is_htmx = request.headers.get("HX-Request")
 
     if current_user is None and (html or is_htmx):
@@ -42,14 +123,38 @@ async def get_recommendations(
     if current_user is None:
         raise HTTPException(status_code=401, detail="Authentication required")
 
-    engine = RecommendationEngine(download_dir="downloads")
+    anime_enabled, series_enabled, anime_weight, series_weight = _get_effective_weights(session, current_user.id)
+    recommendations = []
 
     try:
-        recommendations = await engine.get_personalized_recommendations(limit=limit)
-        
-        # Filter by content_type if specified
+        if anime_enabled:
+            engine = RecommendationEngine(download_dir="downloads")
+            try:
+                anime_recs = await engine.get_personalized_recommendations(limit=limit)
+                for r in anime_recs:
+                    r['content_type'] = 'anime'
+                recommendations.extend(anime_recs)
+            finally:
+                await engine.close()
+
+        if series_enabled:
+            try:
+                from app.downloaders.series_sites.fs7 import FS7Downloader
+                downloader = FS7Downloader()
+                series_recs = await downloader.get_latest_series(limit=limit)
+                for r in series_recs:
+                    r['content_type'] = 'series'
+                recommendations.extend(series_recs)
+            except Exception as e:
+                logger.warning(f"Series recommendations fetch failed: {e}")
+
         if content_type and content_type != "all":
-            recommendations = [r for r in recommendations if r.get("content_type", r.get("type", "")) == content_type]
+            recommendations = [r for r in recommendations if r.get("content_type") == content_type]
+        else:
+            anime_items = [r for r in recommendations if r.get("content_type") == "anime"]
+            series_items = [r for r in recommendations if r.get("content_type") == "series"]
+            recommendations = _weighted_mix(anime_items, series_items, limit,
+                                            weight_a=anime_weight, weight_b=series_weight)
 
         if html or is_htmx:
             return templates.TemplateResponse(
@@ -59,11 +164,8 @@ async def get_recommendations(
 
         return {"recommendations": recommendations, "count": len(recommendations)}
     except Exception as e:
-        import logging
-        logging.getLogger(__name__).error(f"Recommendations error: {e}", exc_info=True)
+        logger.error(f"Recommendations error: {e}", exc_info=True)
         raise HTTPException(status_code=500, detail=str(e))
-    finally:
-        await engine.close()
 
 
 @router.get("/releases/latest")
@@ -72,18 +174,52 @@ async def get_latest_releases(
     limit: int = 20,
     html: bool = Query(False),
     content_type: Optional[str] = Query(None, description="Filter: 'anime', 'series', or None for all"),
+    current_user: Optional[User] = Depends(get_optional_user),
+    session: Session = Depends(get_session),
 ):
-    """Get latest anime releases"""
+    """Get latest releases based on user settings (anime + series)"""
     from app.recommendations import get_latest_releases_with_info
 
-    try:
-        releases = await get_latest_releases_with_info(limit=limit)
-        
-        # Filter by content_type if specified
-        if content_type and content_type != "all":
-            releases = [r for r in releases if r.get("content_type", r.get("type", "")) == content_type]
+    is_htmx = request.headers.get("HX-Request")
 
-        if html or request.headers.get("HX-Request"):
+    if current_user is None and (html or is_htmx):
+        return templates.TemplateResponse(
+            "components/login_prompt.html", {"request": request}
+        )
+
+    if current_user is None:
+        raise HTTPException(status_code=401, detail="Authentication required")
+
+    anime_enabled, series_enabled, anime_weight, series_weight = _get_effective_weights(session, current_user.id)
+    releases = []
+
+    try:
+        if anime_enabled:
+            anime_releases = await get_latest_releases_with_info(limit=limit)
+            for r in anime_releases:
+                r['content_type'] = 'anime'
+            releases.extend(anime_releases)
+
+        if series_enabled:
+            try:
+                from app.downloaders.series_sites.fs7 import FS7Downloader
+                downloader = FS7Downloader()
+                series_releases = await downloader.get_latest_series(limit=limit)
+                for r in series_releases:
+                    r['content_type'] = 'series'
+                releases.extend(series_releases)
+            except Exception as e:
+                logger.warning(f"Series releases fetch failed: {e}")
+
+        if content_type and content_type != "all":
+            releases = [r for r in releases if r.get("content_type") == content_type]
+        else:
+            anime_items = [r for r in releases if r.get("content_type") == "anime"]
+            series_items = [r for r in releases if r.get("content_type") == "series"]
+            releases = _weighted_mix(anime_items, series_items, limit,
+                                     weight_a=anime_weight, weight_b=series_weight)
+
+        if html or is_htmx:
             return templates.TemplateResponse(
                 "components/releases_list.html",
                 {"request": request, "releases": releases}
@@ -95,8 +231,7 @@ async def get_latest_releases(
             "updated": datetime.now().isoformat(),
         }
     except Exception as e:
-        import logging
-        logging.getLogger(__name__).error(f"Latest releases error: {e}", exc_info=True)
+        logger.error(f"Latest releases error: {e}", exc_info=True)
         raise HTTPException(status_code=500, detail=str(e))
 
 
@@ -177,3 +312,41 @@ async def get_download_statistics(
         raise HTTPException(status_code=500, detail=str(e))
     finally:
         await engine.close()
+
+
+@router.get("/series/latest")
+async def get_latest_series(
+    request: Request,
+    limit: int = 20,
+    html: bool = Query(False),
+    current_user: Optional[User] = Depends(get_optional_user),
+):
+    """Get latest TV series releases from FS7 homepage"""
+    if current_user is None and (html or request.headers.get("HX-Request")):
+        return templates.TemplateResponse(
+            "components/login_prompt.html", {"request": request}
+        )
+
+    if current_user is None:
+        raise HTTPException(status_code=401, detail="Authentication required")
+
+    try:
+        from app.downloaders.series_sites.fs7 import FS7Downloader
+
+        downloader = FS7Downloader()
+        series = await downloader.get_latest_series(limit=limit)
+
+        if html or request.headers.get("HX-Request"):
+            return templates.TemplateResponse(
+                "components/series_releases_list.html",
+                {"request": request, "releases": series}
+            )
+
+        return {
+            "releases": series,
+            "count": len(series),
+            "updated": datetime.now().isoformat(),
+        }
+    except Exception as e:
+        logger.error(f"Latest series error: {e}", exc_info=True)
+        raise HTTPException(status_code=500, detail=str(e))
diff --git a/app/routers/router_settings.py b/app/routers/router_settings.py
index c4238b0..3e3c15f 100644
--- a/app/routers/router_settings.py
+++ b/app/routers/router_settings.py
@@ -1,6 +1,8 @@
 """Application settings routes for Ohm Stream Downloader API"""
 
 import json
+import logging
+from pathlib import Path
 from typing import List, Dict, Any, Optional
 from fastapi import APIRouter, Depends, HTTPException, Request, Response
 from fastapi.templating import Jinja2Templates
@@ -13,10 +15,74 @@ from app.routers.router_auth import get_current_user_from_token, get_optional_us
 from app.providers import get_anime_providers, get_series_providers
 from app.providers_manager import providers_manager
 
+logger = logging.getLogger(__name__)
+
 router = APIRouter(prefix="/api/settings", tags=["settings"])
 templates = Jinja2Templates(directory="templates")
 
 
+def _compute_auto_weights(download_dir: str) -> Dict[str, Any]:
+    """Analyze downloaded files to compute anime vs series ratio.
+
+    Uses filename conventions:
+    - Series: contains "Saison" or "Season" keywords
+    - Anime: everything else in the downloads folder
+    Returns dict with counts and computed weights.
+    """
+    base = Path(download_dir)
+    if not base.exists():
+        return {"anime_count": 0, "series_count": 0, "anime_weight": 1, "series_weight": 1, "total": 0}
+
+    anime_count = 0
+    series_count = 0
+
+    for f in base.rglob("*"):
+        if not f.is_file():
+            continue
+        if f.suffix.lower() not in (".mp4", ".mkv", ".avi", ".wmv", ".flv", ".mov"):
+            continue
+
+        name = f.stem.lower()
+        # Heuristic: series TV files often have "Saison" or "Season" + number
+        # Anime files rarely use this format (they use "Episode" or "S01E01")
+        import re
+        if re.search(r'(?:saison|season)\s*\d+', name):
+            series_count += 1
+        else:
+            anime_count += 1
+
+    total = anime_count + series_count
+    if total == 0:
+        return {"anime_count": 0, "series_count": 0, "anime_weight": 1, "series_weight": 1, "total": 0}
+
+    # Compute weights: proportional to download count, minimum 1
+    if anime_count == 0:
+        aw, sw = 0, 1
+    elif series_count == 0:
+        aw, sw = 1, 0
+    else:
+        # Keep weights small (max 5) for reasonable interleaving
+        ratio = anime_count / series_count
+        if ratio >= 4:
+            aw, sw = 4, 1
+        elif ratio >= 2:
+            aw, sw = 2, 1
+        elif ratio >= 1:
+            aw, sw = 1, 1
+        elif ratio >= 0.5:
+            aw, sw = 1, 2
+        else:
+            aw, sw = 1, 4
+
+    return {
+        "anime_count": anime_count,
+        "series_count": series_count,
+        "anime_weight": aw,
+        "series_weight": sw,
+        "total": total,
+    }
+
+
 @router.get("", response_model=AppSettings)
 async def get_settings(
     current_user: User = Depends(get_current_user_from_token),
@@ -44,6 +110,9 @@ async def get_settings(
         anime_enabled=getattr(settings_obj, 'anime_enabled', True),
         series_enabled=getattr(settings_obj, 'series_enabled', True),
         download_dir=getattr(settings_obj, 'download_dir', 'downloads'),
+        content_weight_mode=getattr(settings_obj, 'content_weight_mode', 'auto'),
+        content_weight_anime=getattr(settings_obj, 'content_weight_anime', 2),
+        content_weight_series=getattr(settings_obj, 'content_weight_series', 1),
     )
 
 
@@ -86,6 +155,12 @@ async def update_settings(
         settings_obj.series_enabled = update_data.series_enabled
     if update_data.download_dir is not None:
         settings_obj.download_dir = update_data.download_dir
+    if update_data.content_weight_mode is not None:
+        settings_obj.content_weight_mode = update_data.content_weight_mode
+    if update_data.content_weight_anime is not None:
+        settings_obj.content_weight_anime = update_data.content_weight_anime
+    if update_data.content_weight_series is not None:
+        settings_obj.content_weight_series = update_data.content_weight_series
 
     session.add(settings_obj)
     session.commit()
@@ -98,6 +173,34 @@ async def update_settings(
     return settings_obj
 
 
+@router.get("/content-weight")
+async def get_content_weight(
+    current_user: User = Depends(get_current_user_from_token),
+    session: Session = Depends(get_session),
+):
+    """Get current effective content weights (auto-computed or manual)"""
+    statement = select(AppSettingsTable).where(
+        AppSettingsTable.user_id == current_user.id
+    )
+    settings_obj = session.exec(statement).first()
+    download_dir = getattr(settings_obj, 'download_dir', 'downloads') if settings_obj else 'downloads'
+    mode = getattr(settings_obj, 'content_weight_mode', 'auto') if settings_obj else 'auto'
+
+    if mode == "auto":
+        weights = _compute_auto_weights(download_dir)
+        weights["mode"] = "auto"
+        return weights
+    else:
+        return {
+            "mode": "manual",
+            "anime_weight": getattr(settings_obj, 'content_weight_anime', 2),
+            "series_weight": getattr(settings_obj, 'content_weight_series', 1),
+            "anime_count": None,
+            "series_count": None,
+            "total": None,
+        }
+
+
 @router.get("/providers/availability")
 async def get_providers_availability(
     current_user: User = Depends(get_current_user_from_token),
diff --git a/app/routers/router_watchlist.py b/app/routers/router_watchlist.py
index 752a88e..04cc9dc 100644
--- a/app/routers/router_watchlist.py
+++ b/app/routers/router_watchlist.py
@@ -213,7 +213,7 @@ async def delete_from_watchlist(
     raise HTTPException(status_code=500, detail="Failed to delete item")
 
 
-@router.post("/check", response_model=List)
+@router.post("/check")
 async def check_watchlist_now(
     background_tasks: BackgroundTasks,
     response: Response,
diff --git a/app/utils.py b/app/utils.py
index 545e882..4077398 100644
--- a/app/utils.py
+++ b/app/utils.py
@@ -95,13 +95,18 @@ class DomainManager:
                     response = await client.get(url)
                     
                     if response.status_code == 200:
-                        logger.info(f"Active domain found for {provider_id}: {domain}")
-                        cls._cache[provider_id] = {
-                            'domain': domain,
-                            'last_check': datetime.now().isoformat()
-                        }
-                        cls._save_cache()
-                        return domain
+                        # Verify it's actually the right site, not a parking/placeholder page
+                        content = response.text.lower()
+                        body_size = len(response.text)
+                        # Valid pages should be reasonably large and contain expected keywords
+                        if body_size > 10000 and ('french' in content or 'stream' in content or 'serie' in content or 'anime' in content or 'film' in content or 'telechargement' in content or 'zone' in content):
+                            logger.info(f"Active domain found for {provider_id}: {domain} ({body_size} bytes)")
+                            cls._cache[provider_id] = {
+                                'domain': domain,
+                                'last_check': datetime.now().isoformat()
+                            }
+                            cls._save_cache()
+                            return domain
                 except Exception as e:
                     logger.debug(f"Domain test failed for {domain}: {e}")
                     continue
diff --git a/app/watchlist.py b/app/watchlist.py
index e1480a4..aa345c8 100644
--- a/app/watchlist.py
+++ b/app/watchlist.py
@@ -216,8 +216,12 @@ class WatchlistManager:
     update_check_time = update_last_checked
 
     def get_due_items(self) -> List[WatchlistItem]:
+        """Get all items that are due for a check based on current settings"""
+        return self.get_due_for_check(self.settings.check_interval_hours if self.settings else 6)
+
+    def get_due_for_check(self, interval_hours: int) -> List[WatchlistItem]:
         """Get all items that are due for a check based on settings"""
-        interval = timedelta(hours=self.settings.check_interval_hours)
+        interval = timedelta(hours=interval_hours)
         now = datetime.now()
         
         with Session(engine) as session:
@@ -234,6 +238,12 @@ class WatchlistManager:
             
             return due_items
 
+    def get_settings(self) -> WatchlistSettings:
+        """Get global watchlist settings"""
+        if self.settings is None:
+            self._load_settings()
+        return self.settings
+
     def update_settings(self, settings: WatchlistSettings) -> WatchlistSettings:
         """Update global watchlist settings"""
         self.settings = settings
diff --git a/full_test2.mjs b/full_test2.mjs
new file mode 100644
index 0000000..6d074cc
--- /dev/null
+++ b/full_test2.mjs
@@ -0,0 +1,174 @@
+import { chromium } from 'playwright';
+
+const BASE = 'http://127.0.0.1:3000';
+const opts = { waitUntil: 'domcontentloaded', timeout: 15000 };
+
+(async () => {
+  const browser = await chromium.launch({ headless: true, args: ['--no-sandbox'] });
+
+  // Obtenir un token via API
+  const apiCtx = await browser.newContext();
+  const apiPage = await apiCtx.newPage();
+  await apiPage.goto(BASE + '/api/auth/login', opts);
+  const token = await apiPage.evaluate(async () => {
+    const res = await fetch('/api/auth/login', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ username: 'roman', password: 'roman123' })
+    });
+    const data = await res.json();
+    return data.access_token || null;
+  });
+  await apiCtx.close();
+  console.log(`Token obtained: ${token ? token.substring(0, 20) + '...' : 'FAILED'}`);
+
+  if (!token) {
+    console.error('Cannot get token, aborting');
+    process.exit(1);
+  }
+
+  // ========== NON AUTHENTIFIE ==========
+  console.log('\n=== NON AUTHENTIFIE ===');
+  const anonCtx = await browser.newContext({ viewport: { width: 1440, height: 900 } });
+  const anon = await anonCtx.newPage();
+
+  const snap = async (p, name, url, wait = 3000) => {
+    try {
+      await p.goto(url, opts);
+      await p.waitForTimeout(wait);
+      await p.screenshot({ path: `/tmp/screenshots/${name}.png`, fullPage: false });
+      console.log(`OK: ${name}`);
+    } catch(e) {
+      console.log(`FAIL: ${name} - ${e.message}`);
+    }
+  };
+
+  await snap(anon, 'anon_01_home', `${BASE}/`);
+  await snap(anon, 'anon_02_watchlist', `${BASE}/watchlist`);
+  await snap(anon, 'anon_03_favorites', `${BASE}/favorites`);
+  await snap(anon, 'anon_04_downloads', `${BASE}/downloads`);
+  await snap(anon, 'anon_05_settings', `${BASE}/settings`);
+  await snap(anon, 'anon_06_recommendations', `${BASE}/recommendations`);
+
+  // ========== AUTHENTIFIE (cookie + localStorage) ==========
+  console.log('\n=== AUTHENTIFIE ===');
+  const authCtx = await browser.newContext({
+    viewport: { width: 1440, height: 900 },
+  });
+  // Injecter le token comme cookie AVANT toute navigation
+  await authCtx.addCookies([{
+    name: 'auth_token',
+    value: token,
+    domain: '127.0.0.1',
+    path: '/',
+    sameSite: 'Strict',
+    httpOnly: false,
+  }]);
+
+  const auth = await authCtx.newPage();
+
+  // Injecter dans localStorage au premier chargement
+  await auth.goto(BASE + '/', opts);
+  await auth.evaluate((t) => {
+    localStorage.setItem('auth_token', t);
+  }, token);
+  await auth.waitForTimeout(3000);
+  await auth.screenshot({ path: '/tmp/screenshots/auth_01_home.png', fullPage: false });
+  console.log('OK: auth_01_home');
+
+  await snap(auth, 'auth_02_watchlist', `${BASE}/watchlist`);
+  await snap(auth, 'auth_03_favorites', `${BASE}/favorites`);
+  await snap(auth, 'auth_04_downloads', `${BASE}/downloads`);
+  await snap(auth, 'auth_05_settings', `${BASE}/settings`);
+  await snap(auth, 'auth_06_recommendations', `${BASE}/recommendations`);
+
+  // ========== TESTS FONCTIONNELS ==========
+  console.log('\n=== TESTS FONCTIONNELS ===');
+
+  // Test API: toggle favori
+  const favResult = await auth.evaluate(async (t) => {
+    try {
+      const res = await fetch('/api/favorites/toggle', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          'Authorization': `Bearer ${t}`
+        },
+        body: JSON.stringify({ content_type: 'anime', anime_id: 'test-screenshot-1', title: 'Test Screenshot Anime' })
+      });
+      const data = await res.json();
+      return { status: res.status, is_favorite: data.is_favorite };
+    } catch(e) {
+      return { error: e.message };
+    }
+  }, token);
+  console.log(`Favorite toggle: ${JSON.stringify(favResult)}`);
+
+  // Voir les favoris
+  await snap(auth, 'auth_07_favorites_after_add', `${BASE}/favorites`);
+
+  // Test API: ajouter watchlist item
+  const wlResult = await auth.evaluate(async (t) => {
+    try {
+      const res = await fetch('/api/watchlist', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          'Authorization': `Bearer ${t}`
+        },
+        body: JSON.stringify({
+          anime_title: 'Test Screenshot Anime',
+          anime_url: 'https://example.com/anime/1',
+          episode_count: 12,
+          current_episode: 0,
+          status: 'watching'
+        })
+      });
+      const data = await res.json();
+      return { status: res.status, id: data.id, title: data.anime_title };
+    } catch(e) {
+      return { error: e.message };
+    }
+  }, token);
+  console.log(`Watchlist add: ${JSON.stringify(wlResult)}`);
+
+  // Voir la watchlist
+  await snap(auth, 'auth_08_watchlist_with_item', `${BASE}/watchlist`);
+
+  // Scroller sur la home
+  await auth.goto(`${BASE}/`, opts);
+  await auth.waitForTimeout(2000);
+  await auth.evaluate(() => window.scrollTo(0, 600));
+  await auth.waitForTimeout(1000);
+  await auth.screenshot({ path: '/tmp/screenshots/auth_09_home_scrolled.png', fullPage: false });
+  console.log('OK: auth_09_home_scrolled');
+
+  // ========== NETTOYAGE ==========
+  console.log('\n=== Nettoyage ===');
+  // Retirer le favori de test
+  await auth.evaluate(async (t) => {
+    await fetch('/api/favorites/toggle', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        'Authorization': `Bearer ${t}`
+      },
+      body: JSON.stringify({ content_type: 'anime', anime_id: 'test-screenshot-1', title: 'Test Screenshot Anime' })
+    });
+  });
+
+  // Retirer le watchlist item de test
+  if (wlResult.id) {
+    await auth.evaluate(async ({t, id}) => {
+      await fetch(`/api/watchlist/${id}`, {
+        method: 'DELETE',
+        headers: { 'Authorization': `Bearer ${t}` }
+      });
+    }, { t: token, id: wlResult.id });
+    console.log('Test watchlist item deleted');
+  }
+  console.log('Test favorite removed');
+
+  await browser.close();
+  console.log('\n=== ALL DONE ===');
+})();
diff --git a/main.py b/main.py
index d1cdf11..93df5a1 100644
--- a/main.py
+++ b/main.py
@@ -86,12 +86,17 @@ async def startup_event():
 
 
 def restore_completed_downloads():
-    """Scan downloads directory and restore completed download tasks"""
+    """Restore download tasks: first from the database, then scan for untracked files."""
+    # Step 1: Load persisted tasks from database
+    download_manager._load_tasks_from_db()
+
+    # Step 2: Scan downloads directory for files not yet tracked in the database
     download_dir = Path("downloads")
     if not download_dir.exists():
         return
 
     video_extensions = {".mp4", ".mkv", ".avi", ".mov", ".wmv", ".flv", ".webm"}
+    tracked_filenames = {t.filename for t in download_manager.tasks.values()}
 
     for file_path in download_dir.iterdir():
         if file_path.is_file() and file_path.suffix.lower() in video_extensions:
@@ -99,6 +104,11 @@ def restore_completed_downloads():
                 continue
 
             filename = file_path.name
+
+            # Skip if already tracked in DB
+            if filename in tracked_filenames:
+                continue
+
             file_size = file_path.stat().st_size
 
             task_id = str(uuid.uuid4())
@@ -118,7 +128,8 @@ def restore_completed_downloads():
             )
 
             download_manager.tasks[task_id] = task
-            logger.info(f"Restored completed download: {filename}")
+            download_manager._save_task_to_db(task)
+            logger.info(f"Restored untracked completed download: {filename}")
 
 
 # Restore completed downloads on startup
diff --git a/static/css/style.css b/static/css/style.css
index 363d2a7..5f55a04 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -1,90 +1,28 @@
-/* Ohm Streaming - Material Design Dark Theme */
+/* Ohm Streaming - Flat Design Theme */
 :root {
-    /* ========== EXISTING VARIABLES (kept for compatibility) ========== */
-    --bg-dark: #0b0b14;
-    --bg-card: #161625;
-    --primary: #00d9ff;
-    --primary-hover: #00b8d9;
-    --primary-glow: rgba(0, 217, 255, 0.3);
-    --secondary: #ff6b6b;
-    --secondary-hover: #e55a5a;
-    --text-main: #ffffff;
-    --text-dim: #a0a0b0;
-    --accent: #00ff88;
-    --danger: #ff4d4d;
-    --card-radius: 12px;
-    --input-radius: 8px;
-    --transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
-
-    /* ========== MATERIAL DESIGN VARIABLES ========== */
-    /* Material Colors */
-    --md-primary: #6C63FF;
-    --md-primary-variant: #5a52d5;
-    --md-secondary: #00BCD4;
-    --md-secondary-variant: #0097a7;
-    --md-surface: #1E1E2E;
-    --md-surface-variant: #2A2A3C;
-    --md-background: #12121c;
-    --md-error: #ff5252;
-    --md-success: #4caf50;
-    --md-warning: #ffc107;
-    --md-on-primary: #ffffff;
-    --md-on-surface: #e0e0e0;
-    --md-on-background: #ffffff;
-    --md-outline: rgba(255, 255, 255, 0.12);
-
-    /* Material Elevation (Box Shadows) */
-    --md-elevation-0: none;
-    --md-elevation-1: 0 2px 8px rgba(0, 0, 0, 0.3);
-    --md-elevation-2: 0 4px 16px rgba(0, 0, 0, 0.4);
-    --md-elevation-3: 0 6px 24px rgba(0, 0, 0, 0.5);
-    --md-elevation-4: 0 8px 32px rgba(0, 0, 0, 0.6);
-    --md-elevation-hover: 0 12px 40px rgba(0, 0, 0, 0.7);
-
-    /* Material Radius */
-    --md-radius: 16px;
-    --md-radius-sm: 8px;
-    --md-radius-lg: 24px;
-    --md-radius-pill: 50px;
-
-    /* Material Transitions */
-    --md-transition-fast: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
-    --md-transition-standard: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
-    --md-transition-slow: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
-
-    /* Material Letter Spacing */
-    --md-letter-spacing: 0.5px;
-    --md-letter-spacing-lg: 1px;
-
-    /* ========== LIGHT THEME VARIABLES (commented, ready for toggle) ========== */
-    /*
-    [data-theme="light"] {
-        --md-primary: #6C63FF;
-        --md-primary-variant: #5a52d5;
-        --md-secondary: #00BCD4;
-        --md-secondary-variant: #0097a7;
-        --md-surface: #ffffff;
-        --md-surface-variant: #f5f5f5;
-        --md-background: #fafafa;
-        --md-error: #d32f2f;
-        --md-success: #388e3c;
-        --md-warning: #ffa000;
-        --md-on-primary: #ffffff;
-        --md-on-surface: #1c1b1f;
-        --md-on-background: #1c1b1f;
-        --md-outline: rgba(0, 0, 0, 0.12);
-        --md-elevation-1: 0 2px 8px rgba(0, 0, 0, 0.15);
-        --md-elevation-2: 0 4px 16px rgba(0, 0, 0, 0.2);
-        --md-elevation-3: 0 6px 24px rgba(0, 0, 0, 0.25);
-        --md-elevation-4: 0 8px 32px rgba(0, 0, 0, 0.3);
-        --md-elevation-hover: 0 12px 40px rgba(0, 0, 0, 0.35);
-        --bg-dark: #f5f5f5;
-        --bg-card: #ffffff;
-        --primary: #6C63FF;
-        --text-main: #1c1b1f;
-        --text-dim: #605d62;
-    }
-    */
+    /* ========== FLAT DESIGN VARIABLES - SUNSET GLITCH PALETTE ========== */
+    --primary: #FF9F1C;
+    --primary-hover: #e08a15;
+    --bg-dark: #15171A;
+    --bg-card: #202327;
+    --bg-elevated: #2a2d32;
+    --text-main: #F2F2F2;
+    --text-dim: #8a8f98;
+    --text-muted: #5a5f68;
+    --secondary: #FF9F1C;
+    --border: #2a2d32;
+    --border-hover: #FFBF69;
+    --accent: #FF9F1C;
+    --hover: rgba(255, 191, 105, 0.15);
+    --lilac: #8a8f98;
+    --pastel-petal: #F2F2F2;
+    --surface-hover: rgba(255, 191, 105, 0.08);
+    --danger: #e63946;
+    --success: #2d936c;
+    --warning: #f4a261;
+    --card-radius: 4px;
+    --input-radius: 4px;
+    --transition: all 0.2s ease;
 }
 
 /* ========== BASE RESET ========== */
@@ -102,31 +40,31 @@ body {
     overflow-x: hidden;
 }
 
-/* ========== CUSTOM SCROLLBAR (Material Design) ========== */
+/* ========== CUSTOM SCROLLBAR ========== */
 ::-webkit-scrollbar {
     width: 8px;
     height: 8px;
 }
 
 ::-webkit-scrollbar-track {
-    background: rgba(255, 255, 255, 0.03);
-    border-radius: 10px;
+    background: #202327;
+    border-radius: 4px;
 }
 
 ::-webkit-scrollbar-thumb {
-    background: var(--md-primary);
-    border-radius: 10px;
-    transition: var(--md-transition-standard);
+    background: var(--text-dim);
+    border-radius: 4px;
+    transition: var(--transition);
 }
 
 ::-webkit-scrollbar-thumb:hover {
-    background: var(--md-primary-variant);
+    background: var(--text-main);
 }
 
 /* Firefox scrollbar */
 * {
     scrollbar-width: thin;
-    scrollbar-color: var(--md-primary) rgba(255, 255, 255, 0.03);
+    scrollbar-color: var(--text-dim) #202327;
 }
 
 /* ========== CONTAINER ========== */
@@ -148,9 +86,7 @@ h1 {
     font-weight: 800;
     letter-spacing: -1px;
     margin-bottom: 5px;
-    background: linear-gradient(90deg, var(--primary), var(--accent));
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
+    color: var(--primary);
 }
 
 .subtitle {
@@ -169,48 +105,28 @@ h1 {
 .section-header h2 {
     font-size: 1.5rem;
     font-weight: 700;
-    border-left: 4px solid var(--primary);
+    border-left: 4px solid #FFBF69;
     padding-left: 15px;
+    color: var(--text-main);
 }
 
-/* ========== MATERIAL DESIGN BUTTONS ========== */
+/* ========== FLAT BUTTONS ========== */
 .btn {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     padding: 10px 20px;
-    border-radius: var(--md-radius-sm);
+    border-radius: var(--input-radius);
     font-size: 0.9rem;
     font-weight: 600;
-    letter-spacing: var(--md-letter-spacing);
     cursor: pointer;
-    transition: var(--md-transition-standard);
+    transition: var(--transition);
     border: 1px solid transparent;
     text-decoration: none;
     color: #fff;
     white-space: nowrap;
     position: relative;
-    overflow: hidden;
-}
-
-/* Ripple effect (CSS-only) */
-.btn::before {
-    content: '';
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    width: 0;
-    height: 0;
-    border-radius: 50%;
-    background: rgba(255, 255, 255, 0.3);
-    transform: translate(-50%, -50%);
-    transition: width 0.6s, height 0.6s;
-}
-
-.btn:active::before {
-    width: 300px;
-    height: 300px;
 }
 
 .btn:disabled {
@@ -218,94 +134,81 @@ h1 {
     cursor: not-allowed;
 }
 
-.btn:disabled::before {
-    display: none;
-}
-
-/* Material Button Variants */
-.btn-contained {
-    background: var(--md-primary);
-    color: var(--md-on-primary);
-    box-shadow: var(--md-elevation-1);
-}
-
-.btn-contained:hover:not(:disabled) {
-    background: var(--md-primary-variant);
-    box-shadow: var(--md-elevation-2);
-    transform: translateY(-2px);
-}
-
-.btn-outlined {
-    background: transparent;
-    border: 1px solid var(--md-outline);
-    color: var(--md-on-surface);
-}
-
-.btn-outlined:hover:not(:disabled) {
-    background: rgba(108, 99, 255, 0.08);
-    border-color: var(--md-primary);
-    color: var(--md-primary);
-}
-
-.btn-text {
-    background: transparent;
-    color: var(--md-primary);
-    padding: 10px 15px;
-}
-
-.btn-text:hover:not(:disabled) {
-    background: rgba(108, 99, 255, 0.08);
-}
-
-/* Primary Button (legacy compatibility) */
+/* Primary Button */
 .btn-primary {
     background: var(--primary);
-    color: #000;
-    box-shadow: var(--md-elevation-1);
+    color: #fff;
 }
 
 .btn-primary:hover:not(:disabled) {
     background: var(--primary-hover);
-    box-shadow: 0 0 15px var(--primary-glow), var(--md-elevation-2);
-    transform: translateY(-2px);
 }
 
 /* Secondary Button */
 .btn-secondary {
-    background: rgba(255, 255, 255, 0.05);
-    border-color: rgba(255, 255, 255, 0.1);
+    background: var(--bg-card);
+    border-color: var(--text-dim);
     color: var(--text-main);
 }
 
 .btn-secondary:hover:not(:disabled) {
-    background: rgba(255, 255, 255, 0.1);
-    border-color: rgba(255, 255, 255, 0.2);
-    box-shadow: var(--md-elevation-1);
+    background: var(--text-dim);
+    border-color: var(--text-main);
 }
 
 /* Accent Button */
 .btn-accent {
     background: var(--accent);
-    color: #000;
-    box-shadow: var(--md-elevation-1);
+    color: #fff;
 }
 
 .btn-accent:hover:not(:disabled) {
-    box-shadow: var(--md-elevation-2);
-    transform: translateY(-2px);
+    background: var(--primary-hover);
 }
 
 /* Danger Button */
 .btn-danger {
-    background: rgba(255, 77, 77, 0.15);
-    border-color: rgba(255, 77, 77, 0.3);
+    background: transparent;
+    border-color: var(--danger);
     color: var(--danger);
 }
 
 .btn-danger:hover:not(:disabled) {
     background: var(--danger);
     color: #fff;
-    box-shadow: var(--md-elevation-2);
+}
+
+/* Contained Button */
+.btn-contained {
+    background: var(--primary);
+    color: #fff;
+}
+
+.btn-contained:hover:not(:disabled) {
+    background: var(--primary-hover);
+}
+
+/* Outlined Button */
+.btn-outlined {
+    background: transparent;
+    border: 1px solid var(--text-dim);
+    color: var(--text-main);
+}
+
+.btn-outlined:hover:not(:disabled) {
+    border-color: var(--text-dim);
+    color: var(--text-dim);
+}
+
+/* Text Button */
+.btn-text {
+    background: transparent;
+    color: var(--primary);
+    padding: 10px 15px;
+}
+
+.btn-text:hover:not(:disabled) {
+    background: var(--bg-card);
 }
 
 /* Button Sizes */
@@ -343,42 +246,37 @@ h1 {
     font-size: 0.75rem;
     font-weight: 700;
     text-transform: uppercase;
-    letter-spacing: var(--md-letter-spacing-lg);
 }
 
 .btn-watch {
     background: var(--primary);
-    color: #000;
-    box-shadow: var(--md-elevation-1);
-}
-
-.btn-watch:hover {
-    box-shadow: var(--md-elevation-2);
-}
-
-.btn-download {
-    background: rgba(255, 255, 255, 0.05);
-    border: 1px solid rgba(255, 255, 255, 0.1);
     color: #fff;
 }
 
-.btn-download:hover {
-    background: rgba(255, 255, 255, 0.1);
+.btn-watch:hover:not(:disabled) {
+    background: var(--primary-hover);
 }
 
-/* ========== MATERIAL DESIGN CARDS ========== */
+.btn-download {
+    background: var(--bg-card);
+    border: 1px solid var(--text-dim);
+    color: var(--text-main);
+}
+
+.btn-download:hover:not(:disabled) {
+    background: var(--text-dim);
+}
+
+/* ========== FLAT CARDS ========== */
 .card, .hc, .download-item {
-    background: var(--md-surface);
-    border-radius: var(--md-radius);
-    border: 1px solid rgba(255, 255, 255, 0.06);
-    box-shadow: var(--md-elevation-1);
-    transition: var(--md-transition-standard);
+    background: var(--bg-card);
+    border-radius: var(--card-radius);
+    border: 1px solid var(--text-dim);
+    transition: var(--transition);
 }
 
 .card:hover, .hc:hover, .download-item:hover {
-    transform: translateY(-2px);
-    box-shadow: var(--md-elevation-2);
-    border-color: rgba(255, 255, 255, 0.1);
+    border-color: #FFBF69;
 }
 
 /* ========== HORIZONTAL SCROLL ROW ========== */
@@ -402,36 +300,32 @@ h1 {
 .streaming-row::-webkit-scrollbar-thumb,
 .recommendations-carousel::-webkit-scrollbar-thumb,
 .releases-carousel::-webkit-scrollbar-thumb {
-    background: rgba(255, 255, 255, 0.1);
-    border-radius: 10px;
+    background: var(--text-dim);
+    border-radius: 4px;
 }
 
 .home-row::-webkit-scrollbar-thumb:hover,
 .streaming-row::-webkit-scrollbar-thumb:hover,
 .recommendations-carousel::-webkit-scrollbar-thumb:hover,
 .releases-carousel::-webkit-scrollbar-thumb:hover {
-    background: var(--primary);
+    background: var(--text-main);
 }
 
-/* ========== HOME CARD (Material Card) ========== */
+/* ========== HOME CARD ========== */
 .hc {
     flex: 0 0 180px;
     display: block;
-    background: var(--md-surface);
-    border-radius: var(--md-radius);
+    background: var(--bg-card);
+    border-radius: var(--card-radius);
     overflow: hidden;
-    transition: var(--md-transition-standard);
-    border: 1px solid rgba(255, 255, 255, 0.06);
+    transition: var(--transition);
+    border: 1px solid var(--text-dim);
     text-decoration: none;
     color: inherit;
-    box-shadow: var(--md-elevation-1);
 }
 
 .hc:hover {
-    transform: translateY(-2px) scale(1.02);
-    z-index: 10;
-    border-color: var(--primary);
-    box-shadow: var(--md-elevation-hover);
+    border-color: #FFBF69;
 }
 
 .hc-poster {
@@ -453,14 +347,12 @@ h1 {
     position: absolute;
     top: 8px;
     right: 8px;
-    background: rgba(0, 0, 0, 0.85);
+    background: rgba(0, 0, 0, 0.75);
     color: #ffcc00;
     padding: 4px 8px;
-    border-radius: var(--md-radius-sm);
+    border-radius: 4px;
     font-size: 0.7rem;
     font-weight: 800;
-    letter-spacing: var(--md-letter-spacing);
-    backdrop-filter: blur(4px);
 }
 
 .hc-play {
@@ -471,19 +363,17 @@ h1 {
     height: 36px;
     border-radius: 50%;
     background: var(--primary);
-    color: var(--bg-dark);
+    color: #fff;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 0.75rem;
     opacity: 0;
-    transition: var(--md-transition-standard);
-    box-shadow: var(--md-elevation-2);
+    transition: var(--transition);
 }
 
 .hc:hover .hc-play {
     opacity: 1;
-    transform: scale(1.1);
 }
 
 .hc-info {
@@ -495,7 +385,6 @@ h1 {
     font-weight: 700;
     text-transform: uppercase;
     color: var(--primary);
-    letter-spacing: var(--md-letter-spacing-lg);
     display: block;
     margin-bottom: 4px;
 }
@@ -517,11 +406,11 @@ h1 {
     gap: 20px;
 }
 
-/* ========== MATERIAL TABS ========== */
+/* ========== FLAT TABS ========== */
 .tabs {
     display: flex;
     gap: 20px;
-    border-bottom: 1px solid var(--md-outline);
+    border-bottom: 1px solid var(--text-dim);
     margin-bottom: 30px;
     overflow-x: auto;
 }
@@ -534,12 +423,11 @@ h1 {
     font-weight: 600;
     cursor: pointer;
     position: relative;
-    transition: var(--md-transition-standard);
+    transition: var(--transition);
     display: flex;
     align-items: center;
     gap: 8px;
     white-space: nowrap;
-    letter-spacing: var(--md-letter-spacing);
 }
 
 .tab svg {
@@ -552,7 +440,7 @@ h1 {
 }
 
 .tab.active {
-    color: var(--primary);
+    color: #FFBF69;
 }
 
 .tab.active::after {
@@ -562,32 +450,29 @@ h1 {
     left: 0;
     width: 100%;
     height: 3px;
-    background: var(--primary);
-    box-shadow: 0 0 10px var(--primary-glow);
+    background: #FF9F1C;
     border-radius: 3px 3px 0 0;
 }
 
-/* ========== MATERIAL INPUTS ========== */
+/* ========== FLAT INPUTS ========== */
 .input-group {
     display: flex;
-    background: rgba(255, 255, 255, 0.03);
-    border-radius: var(--md-radius);
+    background: var(--bg-card);
+    border-radius: var(--input-radius);
     padding: 6px;
-    border: 1px solid var(--md-outline);
-    transition: var(--md-transition-standard);
+    border: 1px solid var(--text-dim);
+    transition: var(--transition);
 }
 
 .input-group:focus-within {
-    border-color: var(--primary);
-    background: rgba(255, 255, 255, 0.05);
-    box-shadow: 0 0 15px rgba(0, 217, 255, 0.1);
+    border-color: #FFBF69;
 }
 
 .input-group input {
     background: none;
     border: none;
     padding: 12px 16px;
-    color: #fff;
+    color: var(--text-main);
     flex-grow: 1;
     font-size: 1rem;
 }
@@ -603,10 +488,10 @@ h1 {
 
 .btn-search {
     padding: 0 25px;
-    border-radius: var(--md-radius-sm);
+    border-radius: var(--input-radius);
 }
 
-/* Material Underline Input Style */
+/* Flat Input Style */
 .form-group {
     margin-bottom: 24px;
     position: relative;
@@ -618,8 +503,7 @@ h1 {
     color: var(--text-dim);
     font-size: 0.85rem;
     font-weight: 500;
-    letter-spacing: var(--md-letter-spacing);
-    transition: var(--md-transition-standard);
+    transition: var(--transition);
 }
 
 .form-group input {
@@ -627,22 +511,22 @@ h1 {
     padding: 16px 0;
     background: transparent;
     border: none;
-    border-bottom: 2px solid var(--md-outline);
-    color: #fff;
+    border-bottom: 2px solid var(--text-dim);
+    color: var(--text-main);
     font-size: 1rem;
-    transition: var(--md-transition-standard);
+    transition: var(--transition);
 }
 
 .form-group input:focus {
     outline: none;
-    border-bottom-color: var(--primary);
+    border-bottom-color: #FFBF69;
 }
 
 .form-group input:focus + label,
 .form-group input:not(:placeholder-shown) + label {
     transform: translateY(-24px);
     font-size: 0.75rem;
-    color: var(--primary);
+    color: var(--text-dim);
 }
 
 .form-group input::placeholder {
@@ -653,34 +537,33 @@ h1 {
 .auth-panel {
     margin-bottom: 25px;
     padding: 16px 20px;
-    background: linear-gradient(90deg, rgba(0, 217, 255, 0.1), transparent);
-    border: 1px solid rgba(0, 217, 255, 0.15);
-    border-radius: var(--md-radius);
+    background: var(--bg-card);
+    border: 1px solid var(--text-dim);
+    border-radius: var(--card-radius);
     display: flex;
     justify-content: space-between;
     align-items: center;
-    box-shadow: var(--md-elevation-1);
 }
 
 .auth-container {
     max-width: 450px;
     margin: 80px auto;
     padding: 40px;
-    background: var(--md-surface);
-    border-radius: var(--md-radius-lg);
-    border: 1px solid var(--md-outline);
-    box-shadow: var(--md-elevation-3);
+    background: var(--bg-card);
+    border-radius: 6px;
+    border: 1px solid rgba(255, 191, 105, 0.3);
 }
 
 .auth-title {
     text-align: center;
     margin-bottom: 30px;
+    color: var(--text-dim);
 }
 
 .auth-tabs {
     display: flex;
     margin-bottom: 30px;
-    border-bottom: 1px solid var(--md-outline);
+    border-bottom: 1px solid var(--text-dim);
 }
 
 .auth-tab {
@@ -689,13 +572,13 @@ h1 {
     text-align: center;
     cursor: pointer;
     color: var(--text-dim);
-    transition: var(--md-transition-standard);
+    transition: var(--transition);
     font-weight: 600;
     position: relative;
 }
 
 .auth-tab.active {
-    color: var(--primary);
+    color: #FFBF69;
 }
 
 .auth-tab.active::after {
@@ -705,7 +588,7 @@ h1 {
     left: 0;
     width: 100%;
     height: 3px;
-    background: var(--primary);
+    background: #FF9F1C;
 }
 
 .auth-form {
@@ -718,32 +601,32 @@ h1 {
 
 .auth-error, .auth-success {
     padding: 12px 16px;
-    border-radius: var(--md-radius-sm);
+    border-radius: var(--input-radius);
     margin-bottom: 20px;
     font-size: 0.9rem;
     display: none;
 }
 
 .auth-error {
-    background: rgba(255, 77, 77, 0.1);
-    border: 1px solid rgba(255, 77, 77, 0.3);
+    background: rgba(230, 57, 70, 0.1);
+    border: 1px solid var(--danger);
     color: var(--danger);
 }
 
 .auth-success {
-    background: rgba(0, 255, 136, 0.1);
-    border: 1px solid rgba(0, 255, 136, 0.3);
-    color: var(--accent);
+    background: rgba(255, 191, 105, 0.1);
+    border: 1px solid var(--success);
+    color: var(--success);
 }
 
 .show {
     display: block !important;
 }
 
-/* ========== MATERIAL PROGRESS BARS ========== */
+/* ========== FLAT PROGRESS BARS ========== */
 .progress-container {
     height: 6px;
-    background: rgba(255, 255, 255, 0.1);
+    background: rgba(255, 191, 105, 0.15);
     border-radius: 3px;
     margin: 12px 0;
     overflow: hidden;
@@ -751,7 +634,7 @@ h1 {
 
 .progress-bar {
     height: 100%;
-    background: linear-gradient(90deg, var(--primary), var(--accent));
+    background: #FF9F1C;
     transition: width 0.3s ease;
     border-radius: 3px;
 }
@@ -761,21 +644,20 @@ h1 {
     width: 40px;
     height: 40px;
     padding: 0;
-    border-radius: var(--md-radius-sm);
-    background: rgba(255, 255, 255, 0.05);
-    border: 1px solid var(--md-outline);
+    border-radius: var(--input-radius);
+    background: var(--bg-card);
+    border: 1px solid var(--text-dim);
     color: var(--text-main);
     display: inline-flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
-    transition: var(--md-transition-standard);
+    transition: var(--transition);
 }
 
 .btn-icon:hover {
-    background: rgba(255, 255, 255, 0.1);
-    border-color: rgba(255, 255, 255, 0.2);
-    box-shadow: var(--md-elevation-1);
+    background: var(--text-dim);
+    border-color: var(--text-main);
 }
 
 .btn-icon.danger {
@@ -783,17 +665,19 @@ h1 {
 }
 
 .btn-icon.danger:hover {
-    background: rgba(255, 77, 77, 0.15);
-    border-color: rgba(255, 77, 77, 0.3);
+    background: var(--danger);
+    color: #fff;
+    border-color: var(--danger);
 }
 
 .btn-icon.success {
-    color: var(--accent);
+    color: var(--success);
 }
 
 .btn-icon.success:hover {
-    background: rgba(0, 255, 136, 0.15);
-    border-color: rgba(0, 255, 136, 0.3);
+    background: var(--success);
+    color: #fff;
+    border-color: var(--success);
 }
 
 /* ========== DOWNLOAD ITEMS ========== */
@@ -804,20 +688,18 @@ h1 {
 }
 
 .download-item {
-    background: var(--md-surface);
-    border-radius: var(--md-radius);
+    background: var(--bg-card);
+    border-radius: var(--card-radius);
     padding: 20px;
-    border: 1px solid rgba(255, 255, 255, 0.06);
-    transition: var(--md-transition-standard);
-    box-shadow: var(--md-elevation-1);
+    border: 1px solid var(--text-dim);
+    transition: var(--transition);
     border-left: 4px solid var(--text-dim);
     margin-bottom: 10px;
 }
 
 .download-item:hover {
-    border-color: var(--primary);
-    transform: translateY(-2px);
-    box-shadow: var(--md-elevation-2);
+    border-color: #FFBF69;
+    border-left-color: #FFBF69;
 }
 
 .download-info {
@@ -852,11 +734,13 @@ h1 {
 }
 
 .download-actions .btn-icon.warning {
-    color: #f0a500;
+    color: var(--warning);
 }
 
 .download-actions .btn-icon.warning:hover {
-    background: rgba(240, 165, 0, 0.2);
+    background: var(--warning);
+    color: #fff;
+    border-color: var(--warning);
 }
 
 /* Download Status Colors */
@@ -866,7 +750,7 @@ h1 {
 }
 
 .download-item.status-completed {
-    border-left-color: var(--accent);
+    border-left-color: var(--success);
 }
 
 .download-item.status-failed,
@@ -875,7 +759,7 @@ h1 {
 }
 
 .download-item.status-paused {
-    border-left-color: #f0a500;
+    border-left-color: var(--warning);
 }
 
 .download-item.status-pending {
@@ -887,56 +771,45 @@ h1 {
         border-left-color: var(--primary);
     }
     50% {
-        border-left-color: rgba(0, 217, 255, 0.3);
+        border-left-color: var(--warning);
     }
 }
 
-/* Progress bar shimmer */
+/* Progress bar for downloading */
 .download-item.status-downloading .progress-bar {
-    background: linear-gradient(90deg, var(--primary) 0%, var(--accent) 50%, var(--primary) 100%);
-    background-size: 200% 100%;
-    animation: shimmer 1.5s ease-in-out infinite;
-}
-
-@keyframes shimmer {
-    0% {
-        background-position: 200% 0;
-    }
-    100% {
-        background-position: -200% 0;
-    }
+    background: var(--text-dim);
 }
 
 /* ========== BADGE SYSTEM ========== */
 .badge-completed {
-    color: var(--accent);
-    background: rgba(0, 255, 136, 0.1);
+    color: var(--success);
+    background: rgba(255, 191, 105, 0.1);
     padding: 4px 8px;
-    border-radius: var(--md-radius-sm);
+    border-radius: var(--input-radius);
 }
 
 .badge-failed {
     color: var(--danger);
-    background: rgba(255, 77, 77, 0.1);
+    background: rgba(230, 57, 70, 0.1);
     padding: 4px 8px;
-    border-radius: var(--md-radius-sm);
+    border-radius: var(--input-radius);
 }
 
 .badge-downloading {
     color: var(--primary);
-    background: rgba(0, 217, 255, 0.1);
+    background: rgba(255, 191, 105, 0.15);
     padding: 4px 8px;
-    border-radius: var(--md-radius-sm);
+    border-radius: var(--input-radius);
 }
 
 .badge-paused {
-    color: #ffcc00;
-    background: rgba(255, 204, 0, 0.1);
+    color: var(--warning);
+    background: rgba(244, 162, 97, 0.1);
     padding: 4px 8px;
-    border-radius: var(--md-radius-sm);
+    border-radius: var(--input-radius);
 }
 
-/* ========== MATERIAL LOADING STATES ========== */
+/* ========== LOADING STATES ========== */
 .loading-placeholder, .loading-spinner-container {
     display: flex;
     flex-direction: column;
@@ -947,12 +820,12 @@ h1 {
     gap: 15px;
 }
 
-/* Material Circular Spinner */
+/* Circular Spinner */
 .spinner {
     width: 40px;
     height: 40px;
-    border: 3px solid rgba(108, 99, 255, 0.2);
-    border-top-color: var(--md-primary);
+    border: 3px solid var(--text-dim);
+    border-top-color: var(--text-main);
     border-radius: 50%;
     animation: spin 1s linear infinite;
 }
@@ -963,25 +836,19 @@ h1 {
     }
 }
 
-/* Material Skeleton Loading */
+/* Skeleton Loading */
 .skeleton {
-    background: linear-gradient(
-        90deg,
-        var(--md-surface) 0%,
-        var(--md-surface-variant) 50%,
-        var(--md-surface) 100%
-    );
-    background-size: 200% 100%;
+    background: rgba(255, 191, 105, 0.1);
     animation: skeleton-loading 1.5s ease-in-out infinite;
-    border-radius: var(--md-radius-sm);
+    border-radius: var(--input-radius);
 }
 
 @keyframes skeleton-loading {
-    0% {
-        background-position: 200% 0;
+    0%, 100% {
+        opacity: 0.5;
     }
-    100% {
-        background-position: -200% 0;
+    50% {
+        opacity: 1;
     }
 }
 
@@ -998,7 +865,7 @@ h1 {
 
 .skeleton-card {
     height: 200px;
-    border-radius: var(--md-radius);
+    border-radius: var(--card-radius);
 }
 
 .empty-state, .no-results {
@@ -1029,7 +896,7 @@ h1 {
     margin-bottom: 50px;
 }
 
-/* ========== MATERIAL TOAST/SNACKBAR ========== */
+/* ========== FLAT TOAST ========== */
 .toast-container {
     position: fixed;
     bottom: 24px;
@@ -1044,32 +911,33 @@ h1 {
 
 .toast {
     padding: 16px 24px;
-    background: var(--md-surface);
-    border-left: 4px solid var(--primary);
-    border-radius: var(--md-radius);
-    box-shadow: var(--md-elevation-3);
+    background: var(--bg-card);
+    border-left: 4px solid var(--text-dim);
+    border-radius: var(--card-radius);
+    border: 1px solid var(--text-dim);
     display: flex;
     align-items: center;
     gap: 12px;
     animation: slide-up 0.3s ease-out;
     min-width: 300px;
     max-width: 500px;
+    color: var(--text-main);
 }
 
 .toast.success {
-    border-left-color: var(--md-success);
+    border-left-color: var(--success);
 }
 
 .toast.error {
-    border-left-color: var(--md-error);
+    border-left-color: var(--danger);
 }
 
 .toast.warning {
-    border-left-color: var(--md-warning);
+    border-left-color: var(--warning);
 }
 
 .toast.info {
-    border-left-color: var(--md-primary);
+    border-left-color: #FFBF69;
 }
 
 @keyframes slide-up {
@@ -1102,6 +970,99 @@ h1 {
 }
 
 @media (max-width: 768px) {
+    /* --- Header --- */
+    header {
+        padding: 16px 0 0;
+    }
+
+    h1 {
+        font-size: 1.5rem;
+        letter-spacing: 0;
+    }
+
+    .subtitle {
+        font-size: 0.85rem;
+        margin-bottom: 16px;
+    }
+
+    /* --- Auth panel: compact on mobile --- */
+    .auth-panel {
+        flex-direction: column;
+        gap: 6px;
+        text-align: center;
+        padding: 4px 0;
+        font-size: 0.8rem;
+    }
+
+    .auth-panel > div {
+        justify-content: center;
+    }
+
+    .auth-panel span {
+        font-size: 0.75rem;
+    }
+
+    .auth-panel .btn {
+        margin: 0 auto;
+    }
+
+    /* --- Tabs: compact icon mode, scrollable --- */
+    .tabs {
+        gap: 0;
+        margin-bottom: 16px;
+        padding-bottom: 0;
+        -webkit-overflow-scrolling: touch;
+        scrollbar-width: none;
+    }
+
+    .tabs::-webkit-scrollbar {
+        display: none;
+    }
+
+    .tab {
+        padding: 12px 14px;
+        font-size: 0.7rem;
+        gap: 4px;
+        min-height: 48px;
+        min-width: auto;
+        flex: 0 0 auto;
+    }
+
+    .tab svg {
+        width: 18px;
+        height: 18px;
+        flex-shrink: 0;
+    }
+
+    .tab.active::after {
+        height: 2px;
+    }
+
+    /* --- Touch targets: iOS minimum 44px --- */
+    .btn,
+    .btn-small,
+    .btn-sm {
+        min-height: 44px;
+        padding: 10px 16px;
+        font-size: 0.85rem;
+    }
+
+    .btn-xs {
+        min-height: 36px;
+        padding: 6px 10px;
+    }
+
+    /* --- Input groups --- */
+    .input-group {
+        flex-wrap: nowrap;
+    }
+
+    .input-group input {
+        min-height: 44px;
+        font-size: 16px; /* prevent iOS zoom */
+    }
+
+    /* --- Cards --- */
     .anime-grid {
         grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
         gap: 12px;
@@ -1111,32 +1072,47 @@ h1 {
         flex: 0 0 140px;
     }
 
-    .tabs {
+    .hc-play {
+        width: 40px;
+        height: 40px;
+        opacity: 1; /* always visible on mobile */
+    }
+
+    /* --- Sections --- */
+    .section-header {
+        flex-direction: column;
+        align-items: flex-start;
         gap: 10px;
     }
 
-    .tab {
-        padding: 10px 16px;
+    .section-header h2 {
+        font-size: 1.2rem;
     }
 
-    .auth-panel {
-        flex-direction: column;
-        gap: 15px;
-        text-align: center;
+    .section-header .btn {
+        align-self: stretch;
     }
 
+    /* --- Layout --- */
+    .container {
+        padding: 0 16px;
+    }
+
+    /* --- Auth container (login page) --- */
     .auth-container {
-        margin: 40px 20px;
-        padding: 24px;
+        margin: 20px 16px;
+        padding: 20px;
     }
 
+    /* --- Downloads --- */
     .downloads-grid {
         grid-template-columns: 1fr;
     }
 
+    /* --- Toast --- */
     .toast-container {
-        left: 20px;
-        right: 20px;
+        left: 16px;
+        right: 16px;
         transform: none;
     }
 
@@ -1144,20 +1120,42 @@ h1 {
         min-width: auto;
         width: 100%;
     }
+
+    /* --- Horizontal carousels: full bleed on mobile --- */
+    .home-row,
+    .streaming-row,
+    .recommendations-carousel,
+    .releases-carousel {
+        padding: 10px 0 16px;
+        margin: 0 -16px;
+        padding-left: 16px;
+        padding-right: 16px;
+    }
+
+    /* --- Settings form --- */
+    .settings-section {
+        padding: 16px;
+    }
+
+    /* --- Watchlist --- */
+    .watchlist-item {
+        padding: 12px;
+    }
 }
 
 @media (max-width: 480px) {
-    .container {
-        padding: 0 16px;
-    }
-
     h1 {
-        font-size: 2rem;
+        font-size: 1.3rem;
     }
 
-    .btn {
-        padding: 8px 16px;
-        font-size: 0.85rem;
+    .tab {
+        padding: 12px 10px;
+        font-size: 0.65rem;
+    }
+
+    .tab svg {
+        width: 20px;
+        height: 20px;
     }
 
     .hc {
@@ -1167,12 +1165,6 @@ h1 {
     .hc-info {
         padding: 8px;
     }
-
-    .section-header {
-        flex-direction: column;
-        align-items: flex-start;
-        gap: 10px;
-    }
 }
 
 @media (min-width: 1400px) {
diff --git a/static/js/anime-details.js b/static/js/anime-details.js
index 51d36ca..b530340 100644
--- a/static/js/anime-details.js
+++ b/static/js/anime-details.js
@@ -82,7 +82,7 @@ async function searchAnimeDetails(query, malId = null) {
             if (hasResults) {
                 streamingParts.unshift(
                     `<div class="streaming-results-header">
-                        <h3>🎬 Résultats de streaming</h3>
+                        <h3><i class="fa-solid fa-film"></i> Résultats de streaming</h3>
                     </div>
                     <div class="search-results" style="margin-top: 20px;">`
                 );
@@ -110,7 +110,7 @@ async function searchAnimeDetails(query, malId = null) {
             if (streamingHtml) {
                 resultsContainer.innerHTML = `
                     <div class="no-results" style="margin-bottom: 20px;">
-                        <p>ℹ️ Aucune fiche trouvée sur MyAnimeList pour "${escapeHtml(query)}"</p>
+                        <p><i class="fa-solid fa-circle-info"></i> Aucune fiche trouvée sur MyAnimeList pour "${escapeHtml(query)}"</p>
                         <p style="font-size: 12px; margin-top: 10px; color: #888;">
                             Essayez le nom en anglais ou japonais (ex: "Frieren: Beyond Journey's End")
                         </p>
@@ -125,7 +125,7 @@ async function searchAnimeDetails(query, malId = null) {
             } else {
                 resultsContainer.innerHTML = `
                     <div class="no-results">
-                        <p>❌ Aucun résultat trouvé pour "${escapeHtml(query)}"</p>
+                        <p><i class="fa-solid fa-xmark"></i> Aucun résultat trouvé pour "${escapeHtml(query)}"</p>
                         <p style="font-size: 12px; margin-top: 10px; color: #888;">
                             Essayez le nom en anglais ou japonais (ex: "Frieren: Beyond Journey's End", "One Piece")
                         </p>
@@ -138,7 +138,7 @@ async function searchAnimeDetails(query, malId = null) {
         console.error('Error searching anime details:', error);
         resultsContainer.innerHTML = `
             <div class="no-results">
-                <p>❌ Erreur lors de la recherche.</p>
+                <p><i class="fa-solid fa-xmark"></i> Erreur lors de la recherche.</p>
                 <p style="font-size: 12px; margin-top: 10px; color: #ff6b6b;">${error.message}</p>
             </div>
         `;
@@ -177,7 +177,7 @@ async function getProviderSearchResults(query) {
         if (hasResults) {
             htmlParts.unshift(
                 `<div class="streaming-results-header">
-                    <h3>🎬 Résultats de streaming</h3>
+                    <h3><i class="fa-solid fa-film"></i> Résultats de streaming</h3>
                 </div>
                 <div class="search-results" style="margin-top: 20px;">`
             );
@@ -249,16 +249,16 @@ function renderAnimeDetails(anime) {
                     ` : ''}
 
                     <div class="anime-details-meta">
-                        ${score > 0 ? `<div class="anime-details-rating">★ ${score.toFixed(2)}</div>` : ''}
+                        ${score > 0 ? `<div class="anime-details-rating"><i class="fa-solid fa-star"></i> ${score.toFixed(2)}</div>` : ''}
                         ${rank > 0 ? `<div class="anime-details-rank">#${rank}</div>` : ''}
                         ${popularity > 0 ? `<div class="anime-details-popularity">Popularity #${popularity}</div>` : ''}
                     </div>
 
                     <div class="anime-details-stats">
-                        ${anime.episodes ? `<span>📺 ${anime.episodes} épisodes</span>` : ''}
-                        ${anime.status ? `<span>📡 ${translateStatus(anime.status)}</span>` : ''}
-                        ${anime.duration ? `<span>⏱️ ${escapeHtml(anime.duration)}</span>` : ''}
-                        ${anime.year ? `<span>📅 ${anime.year}</span>` : ''}
+                        ${anime.episodes ? `<span><i class="fa-solid fa-tv"></i> ${anime.episodes} épisodes</span>` : ''}
+                        ${anime.status ? `<span><i class="fa-solid fa-tower-broadcast"></i> ${translateStatus(anime.status)}</span>` : ''}
+                        ${anime.duration ? `<span><i class="fa-solid fa-clock"></i> ${escapeHtml(anime.duration)}</span>` : ''}
+                        ${anime.year ? `<span><i class="fa-solid fa-calendar"></i> ${anime.year}</span>` : ''}
                     </div>
 
                     ${studios.length > 0 ? `
@@ -269,10 +269,10 @@ function renderAnimeDetails(anime) {
 
                     <div class="anime-details-actions">
                         <a href="${escapeHtml(anime.url)}" target="_blank" class="btn btn-secondary btn-small">
-                            🔗 Voir sur MAL
+                            <i class="fa-solid fa-link"></i> Voir sur MAL
                         </a>
                         <button onclick="searchAnimeOnProviders('${escapeHtml(anime.title)}')" class="btn btn-primary btn-small">
-                            📥 Télécharger
+                            <i class="fa-solid fa-download"></i> Télécharger
                         </button>
                     </div>
                 </div>
@@ -290,9 +290,9 @@ function renderAnimeDetails(anime) {
             ${synopsis ? `
                 <div class="anime-details-section">
                     <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;">
-                        <h3 style="margin: 0;">📖 Synopsis</h3>
+                        <h3 style="margin: 0;"><i class="fa-solid fa-book"></i> Synopsis</h3>
                         <button onclick="translateSynopsis('${synopsisId}', this)" class="btn btn-secondary btn-small" style="font-size: 12px;">
-                            🌐 Traduire en français
+                            <i class="fa-solid fa-globe"></i> Traduire en français
                         </button>
                     </div>
                     <p id="${synopsisId}" class="anime-details-synopsis">${escapeHtml(synopsis)}</p>
@@ -302,7 +302,7 @@ function renderAnimeDetails(anime) {
             <!-- Seasons (Sequel/Prequel) -->
             ${seasons.length > 0 ? `
                 <div class="anime-details-section">
-                    <h3>📺 Saisons</h3>
+                    <h3><i class="fa-solid fa-tv"></i> Saisons</h3>
                     <div class="anime-related-list">
                         ${seasons.map(season => `
                             <div class="anime-related-group">
@@ -310,7 +310,7 @@ function renderAnimeDetails(anime) {
                                 <div class="anime-related-items">
                                     ${season.entries.map(entry => `
                                         <div class="anime-related-item" onclick="searchAnimeDetails('${escapeHtml(entry.title)}', ${entry.mal_id})" style="cursor: pointer;">
-                                            ${entry.type ? `<span style="color: #00d9ff; font-size: 11px; margin-right: 8px;">${escapeHtml(entry.type)}</span>` : ''}
+                                            ${entry.type ? `<span style="color: #FFBF69; font-size: 11px; margin-right: 8px;">${escapeHtml(entry.type)}</span>` : ''}
                                             ${escapeHtml(entry.title)}
                                             ${entry.url ? `<a href="${escapeHtml(entry.url)}" target="_blank" style="margin-left: auto; color: #888; font-size: 18px; text-decoration: none;" title="Voir sur MyAnimeList">↗</a>` : ''}
                                         </div>
@@ -358,7 +358,7 @@ async function loadStreamingResults(query) {
         if (successfulResults.length === 0) {
             container.innerHTML = `
                 <div class="no-results">
-                    <p>⚠️ Aucun résultat de streaming trouvé pour "${escapeHtml(query)}"</p>
+                    <p><i class="fa-solid fa-triangle-exclamation"></i> Aucun résultat de streaming trouvé pour "${escapeHtml(query)}"</p>
                 </div>
             `;
             return;
@@ -367,7 +367,7 @@ async function loadStreamingResults(query) {
         // Display results
         container.innerHTML = `
             <div class="streaming-results-header">
-                <h3>🎬 Disponible sur</h3>
+                <h3><i class="fa-solid fa-film"></i> Disponible sur</h3>
             </div>
             <div class="streaming-results-grid">
                 ${successfulResults.map(result => renderStreamingResult(result, query)).join('')}
@@ -378,7 +378,7 @@ async function loadStreamingResults(query) {
         console.error('Error loading streaming results:', error);
         container.innerHTML = `
             <div class="no-results">
-                <p>❌ Erreur lors de la recherche des sources de streaming.</p>
+                <p><i class="fa-solid fa-xmark"></i> Erreur lors de la recherche des sources de streaming.</p>
             </div>
         `;
     }
@@ -406,7 +406,7 @@ function renderStreamingResult(result, query) {
                 </select>
 
                 <button class="btn btn-primary btn-small streaming-download-btn" onclick="downloadSelectedEpisode(this)">
-                    📥 Télécharger
+                    <i class="fa-solid fa-download"></i> Télécharger
                 </button>
             </div>
 
@@ -475,7 +475,7 @@ async function translateSynopsis(synopsisId, button) {
         // Revert to original
         synopsisElement.textContent = originalText;
         synopsisElement.dataset.translated = 'false';
-        button.innerHTML = '🌐 Traduire en français';
+        button.innerHTML = '<i class="fa-solid fa-globe"></i> Traduire en français';
         return;
     }
 
@@ -484,7 +484,7 @@ async function translateSynopsis(synopsisId, button) {
 
     // Show loading state
     button.disabled = true;
-    button.innerHTML = '⏳ Traduction...';
+    button.innerHTML = '<i class="fa-solid fa-spinner fa-spin"></i> Traduction...';
     synopsisElement.style.opacity = '0.5';
 
     try {
@@ -509,7 +509,7 @@ async function translateSynopsis(synopsisId, button) {
 
             synopsisElement.textContent = data.translatedText;
             synopsisElement.dataset.translated = 'true';
-            button.innerHTML = '🔄 Voir l\'original';
+            button.innerHTML = '<i class="fa-solid fa-rotate"></i> Voir l\'original';
         } else {
             const errorData = await response.json().catch(() => ({ detail: 'Unknown error' }));
             console.error('Translation API error:', errorData);
@@ -523,7 +523,7 @@ async function translateSynopsis(synopsisId, button) {
         const errorMessage = document.createElement('div');
         errorMessage.style.cssText = 'margin-top: 10px; padding: 10px; background: rgba(255, 107, 107, 0.2); border-radius: 8px; font-size: 12px; color: #ff6b6b;';
         errorMessage.innerHTML = `
-            ⚠️ Service de traduction temporairement indisponible.<br>
+            <i class="fa-solid fa-triangle-exclamation"></i> Service de traduction temporairement indisponible.<br>
             <small>Essayez à nouveau dans quelques instants.</small>
         `;
 
diff --git a/static/js/recommendations.js b/static/js/recommendations.js
index a6505c2..0bc2175 100644
--- a/static/js/recommendations.js
+++ b/static/js/recommendations.js
@@ -22,12 +22,12 @@ async function loadRecommendations() {
         } else {
             container.innerHTML = `
                 <div class="no-results">
-                    <p>⚠️ Aucune recommandation disponible pour le moment.</p>
+                    <p><i class="fa-solid fa-triangle-exclamation"></i> Aucune recommandation disponible pour le moment.</p>
                     <p style="font-size: 12px; margin-top: 10px; color: #888;">
                         Soit l'API MyAnimeList est inaccessible, soit vous n'avez pas encore de téléchargements.
                     </p>
                     <button class="btn btn-secondary btn-small" onclick="loadRecommendations()" style="margin-top: 10px;">
-                        🔄 Réessayer
+                        <i class="fa-solid fa-rotate"></i> Réessayer
                     </button>
                 </div>
             `;
@@ -38,10 +38,10 @@ async function loadRecommendations() {
         console.error('Error loading recommendations:', error);
         container.innerHTML = `
             <div class="no-results">
-                <p>❌ Erreur lors du chargement des recommandations.</p>
+                <p><i class="fa-solid fa-xmark"></i> Erreur lors du chargement des recommandations.</p>
                 <p style="font-size: 12px; margin-top: 10px; color: #ff6b6b;">${error.message}</p>
                 <button class="btn btn-secondary btn-small" onclick="loadRecommendations()" style="margin-top: 10px;">
-                    🔄 Réessayer
+                    <i class="fa-solid fa-rotate"></i> Réessayer
                 </button>
             </div>
         `;
@@ -71,12 +71,12 @@ async function loadLatestReleases() {
         } else {
             container.innerHTML = `
                 <div class="no-results">
-                    <p>⚠️ Aucune sortie disponible pour le moment.</p>
+                    <p><i class="fa-solid fa-triangle-exclamation"></i> Aucune sortie disponible pour le moment.</p>
                     <p style="font-size: 12px; margin-top: 10px; color: #888;">
                         L'API MyAnimeList pourrait être temporairement inaccessible.
                     </p>
                     <button class="btn btn-secondary btn-small" onclick="loadLatestReleases()" style="margin-top: 10px;">
-                        🔄 Réessayer
+                        <i class="fa-solid fa-rotate"></i> Réessayer
                     </button>
                 </div>
             `;
@@ -87,10 +87,10 @@ async function loadLatestReleases() {
         console.error('Error loading releases:', error);
         container.innerHTML = `
             <div class="no-results">
-                <p>❌ Erreur lors du chargement des sorties.</p>
+                <p><i class="fa-solid fa-xmark"></i> Erreur lors du chargement des sorties.</p>
                 <p style="font-size: 12px; margin-top: 10px; color: #ff6b6b;">${error.message}</p>
                 <button class="btn btn-secondary btn-small" onclick="loadLatestReleases()" style="margin-top: 10px;">
-                    🔄 Réessayer
+                    <i class="fa-solid fa-rotate"></i> Réessayer
                 </button>
             </div>
         `;
@@ -100,7 +100,7 @@ async function loadLatestReleases() {
 
 // Load all home content
 async function loadHomeContent() {
-    console.log('🏠 loadHomeContent() called');
+    console.log('loadHomeContent() called');
 
     const loading = document.getElementById('homeLoading');
     const recommendationsSection = document.getElementById('recommendationsSection');
@@ -123,13 +123,13 @@ async function loadHomeContent() {
             loadRecommendations(),
             loadLatestReleases()
         ]);
-        console.log('✅ Home content loaded successfully');
+        console.log('Home content loaded successfully');
 
         // Show sections if they have content
         if (recommendationsSection) recommendationsSection.style.display = 'block';
         if (releasesSection) releasesSection.style.display = 'block';
     } catch (error) {
-        console.error('❌ Error loading home content:', error);
+        console.error('Error loading home content:', error);
         if (loading) {
             loading.innerHTML = 'Erreur lors du chargement. Consultez la console pour plus de détails.';
         }
@@ -149,11 +149,11 @@ function renderRecommendationCard(anime) {
 
     return `
         <div class="anime-card-horizontal recommendation-card">
-            ${reason ? `<div class="recommendation-badge">💡 ${escapeHtml(reason)}</div>` : ''}
+            ${reason ? `<div class="recommendation-badge"><i class="fa-solid fa-lightbulb"></i> ${escapeHtml(reason)}</div>` : ''}
 
             <div class="anime-card-header">
                 <div class="anime-card-title">${escapeHtml(anime.title)}</div>
-                ${score > 0 ? `<div class="anime-card-rating">★ ${score.toFixed(1)}</div>` : ''}
+                ${score > 0 ? `<div class="anime-card-rating"><i class="fa-solid fa-star"></i> ${score.toFixed(1)}</div>` : ''}
             </div>
 
             <div class="anime-card-content">
@@ -165,7 +165,7 @@ function renderRecommendationCard(anime) {
                     </div>
 
                     <div class="anime-card-meta">
-                        ${anime.episodes ? `📺 ${anime.episodes} ep` : ''}
+                        ${anime.episodes ? `<i class="fa-solid fa-tv"></i> ${anime.episodes} ep` : ''}
                         ${anime.episodes && anime.status ? ' • ' : ''}
                         ${anime.status ? translateStatus(anime.status) : ''}
                     </div>
@@ -174,17 +174,17 @@ function renderRecommendationCard(anime) {
 
             ${anime.synopsis ? `
                 <details class="anime-synopsis">
-                    <summary>📖 Synopsis</summary>
+                    <summary><i class="fa-solid fa-book"></i> Synopsis</summary>
                     <p>${escapeHtml(anime.synopsis.substring(0, 150))}${anime.synopsis.length > 150 ? '...' : ''}</p>
                 </details>
             ` : ''}
 
             <div class="anime-card-actions">
                 <button class="btn btn-secondary btn-small" onclick="window.open('${escapeHtml(anime.url)}', '_blank')">
-                    🔗 MAL
+                    <i class="fa-solid fa-link"></i> MAL
                 </button>
                 <button class="btn btn-primary btn-small" onclick="searchAnimeOnProviders('${escapeHtml(anime.title)}')">
-                    📥 Télécharger
+                    <i class="fa-solid fa-download"></i> Télécharger
                 </button>
             </div>
         </div>
@@ -202,11 +202,11 @@ function renderReleaseCard(anime) {
 
     return `
         <div class="anime-card-horizontal release-card">
-            <div class="release-badge">🔥 ${escapeHtml(releaseType)}</div>
+            <div class="release-badge"><i class="fa-solid fa-fire"></i> ${escapeHtml(releaseType)}</div>
 
             <div class="anime-card-header">
                 <div class="anime-card-title">${escapeHtml(anime.title)}</div>
-                ${score > 0 ? `<div class="anime-card-rating">★ ${score.toFixed(1)}</div>` : ''}
+                ${score > 0 ? `<div class="anime-card-rating"><i class="fa-solid fa-star"></i> ${score.toFixed(1)}</div>` : ''}
             </div>
 
             <div class="anime-card-content">
@@ -218,7 +218,7 @@ function renderReleaseCard(anime) {
                     </div>
 
                     <div class="anime-card-meta">
-                        ${anime.episodes ? `📺 ${anime.episodes} ep` : ''}
+                        ${anime.episodes ? `<i class="fa-solid fa-tv"></i> ${anime.episodes} ep` : ''}
                         ${anime.episodes && anime.status ? ' • ' : ''}
                         ${anime.status ? translateStatus(anime.status) : ''}
                     </div>
@@ -227,17 +227,17 @@ function renderReleaseCard(anime) {
 
             ${anime.synopsis ? `
                 <details class="anime-synopsis">
-                    <summary>📖 Synopsis</summary>
+                    <summary><i class="fa-solid fa-book"></i> Synopsis</summary>
                     <p>${escapeHtml(anime.synopsis.substring(0, 150))}${anime.synopsis.length > 150 ? '...' : ''}</p>
                 </details>
             ` : ''}
 
             <div class="anime-card-actions">
                 <button class="btn btn-secondary btn-small" onclick="window.open('${escapeHtml(anime.url)}', '_blank')">
-                    🔗 MAL
+                    <i class="fa-solid fa-link"></i> MAL
                 </button>
                 <button class="btn btn-primary btn-small" onclick="searchAnimeOnProviders('${escapeHtml(anime.title)}')">
-                    📥 Télécharger
+                    <i class="fa-solid fa-download"></i> Télécharger
                 </button>
             </div>
         </div>
@@ -246,11 +246,11 @@ function renderReleaseCard(anime) {
 
 // Get rating color based on score
 function getRatingColor(score) {
-    if (score >= 9) return 'linear-gradient(45deg, #ffd700, #ffed4e)';
-    if (score >= 8) return 'linear-gradient(45deg, #00ff88, #00d9ff)';
-    if (score >= 7) return 'linear-gradient(45deg, #00d9ff, #6c5ce7)';
-    if (score >= 6) return 'linear-gradient(45deg, #ffa500, #ff6b6b)';
-    return 'linear-gradient(45deg, #666, #888)';
+    if (score >= 9) return '#ffd700';
+    if (score >= 8) return '#2d936c';
+    if (score >= 7) return '#FF9F1C';
+    if (score >= 6) return '#f4a261';
+    return '#888888';
 }
 
 // Search anime on providers (redirects to anime tab)
diff --git a/static/js/series-search.js b/static/js/series-search.js
index 3a51f9d..3a00079 100644
--- a/static/js/series-search.js
+++ b/static/js/series-search.js
@@ -26,7 +26,7 @@ async function handleSeriesSearch() {
             const series = data.results['fs7'];
             let html = `
                 <div class="streaming-results-header">
-                    <h3>📺 Résultats pour "${escapeHtml(query)}"</h3>
+                    <h3><i class="fa-solid fa-tv"></i> Résultats pour "${escapeHtml(query)}"</h3>
                 </div>
                 <div class="search-results" style="margin-top: 20px;">
             `;
@@ -46,19 +46,19 @@ async function handleSeriesSearch() {
                     <div class="anime-card" id="series-fs7-${encodeURIComponent(s.url)}">
                         <div class="anime-card-header">
                             <div class="anime-card-title">${escapeHtml(s.title)}</div>
-                            <div class="anime-card-provider">📺 French Stream</div>
+                            <div class="anime-card-provider"><i class="fa-solid fa-tv"></i> French Stream</div>
                         </div>
                         ${coverImage ? `
                             <div style="text-align: center; margin: 10px 0;">
-                                <img src="${escapeHtml(coverImage)}" alt="" style="max-width: 200px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.3);" onerror="this.style.display='none'">
+                                <img src="${escapeHtml(coverImage)}" alt="" style="max-width: 200px; border-radius: 4px;" onerror="this.style.display='none'">
                             </div>
                         ` : ''}
                         <div class="anime-card-actions">
                             <button class="btn btn-secondary btn-small" onclick="window.open('${escapeHtml(s.url)}', '_blank')">
-                                🔗 Voir sur FS7
+                                <i class="fa-solid fa-link"></i> Voir sur FS7
                             </button>
                             <button class="btn btn-primary btn-small" onclick="loadSeriesEpisodesDirect('${escapeHtml(s.url)}', '${escapeHtml(s.title)}')">
-                                📥 Voir les épisodes
+                                <i class="fa-solid fa-download"></i> Voir les épisodes
                             </button>
                         </div>
                         <div id="episodes-fs7-${encodeURIComponent(s.url)}" style="margin-top: 10px;"></div>
@@ -71,7 +71,7 @@ async function handleSeriesSearch() {
         } else {
             resultsContainer.innerHTML = `
                 <div class="no-results">
-                    <p>❌ Aucune série trouvée pour "${escapeHtml(query)}"</p>
+                    <p><i class="fa-solid fa-xmark"></i> Aucune série trouvée pour "${escapeHtml(query)}"</p>
                     <p style="font-size: 12px; margin-top: 10px; opacity: 0.7;">
                         Essayez avec un autre titre ou vérifiez l'orthographe
                     </p>
@@ -81,7 +81,7 @@ async function handleSeriesSearch() {
         console.error('Error searching series:', error);
         resultsContainer.innerHTML = `
             <div class="no-results">
-                <p>❌ Erreur lors de la recherche</p>
+                <p><i class="fa-solid fa-xmark"></i> Erreur lors de la recherche</p>
                 <p style="font-size: 12px; margin-top: 10px; color: #ff6b6b;">${error.message}</p>
             </div>`;
     }
@@ -102,10 +102,10 @@ async function loadSeriesEpisodesDirect(url, title) {
         if (data.episodes && data.episodes.length > 0) {
             let html = `
                 <div style="margin-top: 15px;">
-                    <label style="font-size: 12px; color: #00d9ff; margin-bottom: 5px; display: block;">
-                        📺 Sélectionner un épisode:
+                    <label style="font-size: 12px; color: #FF9F1C; margin-bottom: 5px; display: block;">
+                        <i class="fa-solid fa-tv"></i> Sélectionner un épisode:
                     </label>
-                    <select id="select-episodes-${encodeURIComponent(url)}" style="width: 100%; padding: 8px; border-radius: 4px; border: 1px solid rgba(0, 217, 255, 0.3); background: rgba(0, 0, 0, 0.3); color: white;">
+                    <select id="select-episodes-${encodeURIComponent(url)}" style="width: 100%; padding: 8px; border-radius: 4px; border: 1px solid #2a2d32; background: #202327; color: #F2F2F2;">
                         <option value="">Sélectionner un épisode</option>
                         ${data.episodes.map(ep => `
                             <option value="${escapeHtml(ep.url)}">Épisode ${escapeHtml(ep.episode)}</option>
@@ -145,7 +145,7 @@ async function downloadSeriesEpisode(url, title) {
         });
 
         if (response.ok) {
-            alert(`✅ Téléchargement démarré pour "${title}"`);
+            alert(`Téléchargement démarré pour "${title}"`);
             // Refresh downloads
             if (typeof loadDownloads === 'function') {
                 loadDownloads();
@@ -155,11 +155,11 @@ async function downloadSeriesEpisode(url, title) {
             const errorMessage = error.detail
                 ? (typeof error.detail === 'string' ? error.detail : JSON.stringify(error.detail))
                 : 'Impossible de démarrer le téléchargement';
-            alert(`❌ Erreur: ${errorMessage}`);
+            alert(`Erreur : ${errorMessage}`);
         }
     } catch (error) {
         console.error('Download error:', error);
-        alert(`❌ Erreur lors du téléchargement: ${error.message}`);
+        alert(`Erreur lors du téléchargement : ${error.message}`);
     }
 }
 
diff --git a/static/js/settings.js b/static/js/settings.js
new file mode 100644
index 0000000..5f7cd5f
--- /dev/null
+++ b/static/js/settings.js
@@ -0,0 +1,206 @@
+/**
+ * Settings page - form handlers for user preferences, filters, and weights.
+ * Loaded on all pages via base.html so functions are available when
+ * the settings section is dynamically loaded via HTMX.
+ */
+
+function saveSettings() {
+    const data = {
+        default_lang: document.getElementById('default_lang')?.value,
+        theme: document.getElementById('theme')?.value,
+        download_dir: document.getElementById('download_dir')?.value,
+    };
+    const token = localStorage.getItem('auth_token');
+    if (!token) return;
+    fetch('/api/settings', {
+        method: 'PATCH',
+        headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' },
+        body: JSON.stringify(data)
+    }).then(r => {
+        if (r.ok) showToast('Preferences enregistrees', 'success');
+    }).catch(e => {
+        showToast('Erreur: ' + e.message, 'error');
+    });
+}
+
+function saveFilter(field, value) {
+    const token = localStorage.getItem('auth_token');
+    if (!token) return;
+    fetch('/api/settings', {
+        method: 'PATCH',
+        headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' },
+        body: JSON.stringify({ [field]: value })
+    }).then(r => {
+        if (r.ok) showToast('Filtre mis a jour', 'success');
+    }).catch(e => {
+        showToast('Erreur: ' + e.message, 'error');
+    });
+}
+
+async function toggleCategory(field, value) {
+    if (!value) {
+        const otherField = field === 'anime_enabled' ? 'series_enabled' : 'anime_enabled';
+        const otherCheckbox = document.getElementById(otherField);
+        if (otherCheckbox && !otherCheckbox.checked) {
+            showToast('Au moins une categorie doit rester active', 'error');
+            document.getElementById(field).checked = true;
+            return;
+        }
+    }
+    const token = localStorage.getItem('auth_token');
+    if (!token) return;
+    try {
+        const r = await fetch('/api/settings', {
+            method: 'PATCH',
+            headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' },
+            body: JSON.stringify({ [field]: value })
+        });
+        if (!r.ok) {
+            const err = await r.json().catch(() => ({}));
+            showToast(err.detail || 'Erreur', 'error');
+            document.getElementById(field).checked = !value;
+        } else {
+            showToast('Categorie ' + (value ? 'activee' : 'desactivee'), 'success');
+        }
+    } catch (e) {
+        showToast('Erreur: ' + e.message, 'error');
+        document.getElementById(field).checked = !value;
+    }
+}
+
+function onWeightModeChange(mode) {
+    const autoInfo = document.getElementById('weight-auto-info');
+    const manualControls = document.getElementById('weight-manual-controls');
+
+    if (mode === 'auto') {
+        if (autoInfo) autoInfo.style.display = 'block';
+        if (manualControls) manualControls.style.display = 'none';
+        loadAutoWeights();
+    } else {
+        if (autoInfo) autoInfo.style.display = 'none';
+        if (manualControls) manualControls.style.display = 'block';
+        updateWeightPreview();
+    }
+
+    const token = localStorage.getItem('auth_token');
+    if (!token) return;
+    fetch('/api/settings', {
+        method: 'PATCH',
+        headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' },
+        body: JSON.stringify({ content_weight_mode: mode })
+    });
+}
+
+async function loadAutoWeights() {
+    const details = document.getElementById('weight-auto-details');
+    if (!details) return;
+    const token = localStorage.getItem('auth_token');
+    if (!token) return;
+    try {
+        const r = await fetch('/api/settings/content-weight', {
+            headers: { 'Authorization': 'Bearer ' + token }
+        });
+        if (!r.ok) return;
+        const data = await r.json();
+        const aw = data.anime_weight;
+        const sw = data.series_weight;
+        const ac = data.anime_count;
+        const sc = data.series_count;
+        const total = data.total || 0;
+
+        if (total === 0) {
+            details.innerHTML = '<span style="color: var(--text-dim);">Aucun telechargement detecte. Ratio par defaut : ' + aw + ' anime / ' + sw + ' serie.</span>';
+        } else {
+            const pctA = total > 0 ? Math.round(ac / total * 100) : 50;
+            const pctS = total > 0 ? Math.round(sc / total * 100) : 50;
+            details.innerHTML = `
+                <div style="margin-bottom: 8px;">
+                    <strong>${ac}</strong> anime${ac > 1 ? 's' : ''} (${pctA}%) &mdash; <strong>${sc}</strong> serie${sc > 1 ? 's' : ''} (${pctS}%)
+                </div>
+                <div style="height: 8px; background: var(--secondary); border-radius: 4px; overflow: hidden; display: flex;">
+                    <div style="width: ${pctA}%; background: var(--primary);"></div>
+                    <div style="width: ${pctS}%; background: #6CB4EE;"></div>
+                </div>
+                <div style="margin-top: 8px; font-size: 12px;">
+                    Ratio applique : <strong style="color: var(--primary);">${aw}</strong> anime / <strong style="color: #6CB4EE;">${sw}</strong> serie
+                </div>
+            `;
+        }
+    } catch (e) {
+        details.innerHTML = '<span style="color: var(--danger);">Erreur de chargement</span>';
+    }
+}
+
+function updateWeightPreview() {
+    const awEl = document.getElementById('content_weight_anime_range');
+    const swEl = document.getElementById('content_weight_series_range');
+    const preview = document.getElementById('weight-preview');
+    if (!awEl || !swEl || !preview) return;
+
+    const aw = parseInt(awEl.value) || 0;
+    const sw = parseInt(swEl.value) || 0;
+    const total = aw + sw;
+
+    if (total === 0) {
+        preview.innerHTML = '<span style="color: var(--danger);">Les deux poids ne peuvent pas etre a 0</span>';
+        return;
+    }
+
+    const pctA = Math.round(aw / total * 100);
+    const pctS = 100 - pctA;
+
+    preview.innerHTML = `
+        <div style="margin-bottom: 6px;">
+            <span style="color: var(--primary); font-weight: 700;">${pctA}%</span> animes &nbsp;/&nbsp;
+            <span style="color: #6CB4EE; font-weight: 700;">${pctS}%</span> series
+        </div>
+        <div style="height: 8px; background: var(--secondary); border-radius: 4px; overflow: hidden; display: flex;">
+            <div style="width: ${pctA}%; background: var(--primary); transition: width 0.2s;"></div>
+            <div style="width: ${pctS}%; background: #6CB4EE; transition: width 0.2s;"></div>
+        </div>
+    `;
+}
+
+async function saveManualWeights() {
+    const awEl = document.getElementById('content_weight_anime_range');
+    const swEl = document.getElementById('content_weight_series_range');
+    if (!awEl || !swEl) return;
+
+    const aw = parseInt(awEl.value) || 0;
+    const sw = parseInt(swEl.value) || 0;
+
+    if (aw === 0 && sw === 0) {
+        showToast('Les deux poids ne peuvent pas etre a 0', 'error');
+        return;
+    }
+
+    const token = localStorage.getItem('auth_token');
+    if (!token) return;
+    try {
+        const r = await fetch('/api/settings', {
+            method: 'PATCH',
+            headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' },
+            body: JSON.stringify({ content_weight_mode: 'manual', content_weight_anime: aw, content_weight_series: sw })
+        });
+        if (r.ok) showToast('Equilibre mis a jour', 'success');
+    } catch (e) {
+        showToast('Erreur: ' + e.message, 'error');
+    }
+}
+
+function showToast(message, type) {
+    const event = new CustomEvent('show-toast', { detail: { message, type } });
+    document.dispatchEvent(event);
+}
+
+// Initialize weight display when settings tab content is loaded via HTMX
+document.addEventListener('htmx:afterSettle', function(evt) {
+    if (evt.detail.target) {
+        const mode = evt.detail.target.querySelector('#content_weight_mode');
+        if (mode && mode.value === 'auto') {
+            loadAutoWeights();
+        } else if (mode && mode.value === 'manual') {
+            updateWeightPreview();
+        }
+    }
+});
diff --git a/static/js/tabs.js b/static/js/tabs.js
index 3daf96a..0732f10 100644
--- a/static/js/tabs.js
+++ b/static/js/tabs.js
@@ -19,7 +19,7 @@ function renderSeriesRecommendationCard(series) {
 
     return `
         <div class="anime-card-horizontal recommendation-card">
-            <div class="recommendation-badge">🎺 Série TV populaire</div>
+            <div class="recommendation-badge"><i class="fa-solid fa-music"></i> Série TV populaire</div>
 
             <div class="anime-card-header">
                 <div class="anime-card-title">${escapeHtml(series.title)}</div>
@@ -30,17 +30,17 @@ function renderSeriesRecommendationCard(series) {
 
                 <div class="anime-card-info">
                     <div class="anime-card-meta">
-                        📺 Série TV
+                        <i class="fa-solid fa-tv"></i> Série TV
                     </div>
                 </div>
             </div>
 
             <div class="anime-card-actions">
                 <button class="btn btn-secondary btn-small" onclick="window.open('${escapeHtml(series.url)}', '_blank')">
-                    🔗 Voir sur FS7
+                    <i class="fa-solid fa-link"></i> Voir sur FS7
                 </button>
                 <button class="btn btn-primary btn-small" onclick="loadSeriesEpisodes('${escapeHtml(series.url)}', '${escapeHtml(series.title)}')">
-                    📥 Voir les épisodes
+                    <i class="fa-solid fa-download"></i> Voir les épisodes
                 </button>
             </div>
         </div>
@@ -92,17 +92,17 @@ function renderSeriesReleaseCard(series) {
 
                 <div class="anime-card-info">
                     <div class="anime-card-meta">
-                        📺 Série TV • Nouveau
+                        <i class="fa-solid fa-tv"></i> Série TV • Nouveau
                     </div>
                 </div>
             </div>
 
             <div class="anime-card-actions">
                 <button class="btn btn-secondary btn-small" onclick="window.open('${escapeHtml(series.url)}', '_blank')">
-                    🔗 Voir sur FS7
+                    <i class="fa-solid fa-link"></i> Voir sur FS7
                 </button>
                 <button class="btn btn-primary btn-small" onclick="loadSeriesEpisodes('${escapeHtml(series.url)}', '${escapeHtml(series.title)}')">
-                    📥 Voir les épisodes
+                    <i class="fa-solid fa-download"></i> Voir les épisodes
                 </button>
             </div>
         </div>
@@ -236,10 +236,10 @@ async function loadSeriesReleases() {
         if (container) {
             container.innerHTML = `
                 <div class="no-results">
-                    <p>❌ Erreur lors du chargement des séries</p>
+                    <p><i class="fa-solid fa-xmark"></i> Erreur lors du chargement des séries</p>
                     <p style="font-size: 12px; margin-top: 10px; color: #ff6b6b;">${error.message}</p>
                     <button class="btn btn-secondary btn-small" onclick="loadSeriesReleases()" style="margin-top: 10px;">
-                        🔄 Réessayer
+                        <i class="fa-solid fa-rotate"></i> Réessayer
                     </button>
                 </div>`;
         }
@@ -260,7 +260,7 @@ async function loadProvidersGrid() {
         let html = '';
 
         // Section Anime providers
-        html += '<div class="section-header"><h3 style="margin-top: 20px;">🎬 Sites Anime</h3></div>';
+        html += '<div class="section-header"><h3 style="margin-top: 20px;"><i class="fa-solid fa-film"></i> Sites Anime</h3></div>';
         html += '<div class="search-results">';
 
         const animeProviders = Object.entries(data.anime_providers || {});
@@ -281,11 +281,11 @@ async function loadProvidersGrid() {
                         <div class="anime-card-actions">
                             ${domains.length > 0 ? `
                                 <button class="btn btn-primary btn-small" onclick="window.open('https://${domains[0]}', '_blank')">
-                                    🔗 Visiter le site
+                                    <i class="fa-solid fa-link"></i> Visiter le site
                                 </button>
                             ` : ''}
                             <button class="btn btn-secondary btn-small" onclick="showProviderSearch('${id}')">
-                                🔍 Rechercher
+                                <i class="fa-solid fa-magnifying-glass"></i> Rechercher
                             </button>
                         </div>
                     </div>
@@ -298,7 +298,7 @@ async function loadProvidersGrid() {
         html += '</div>';
 
         // Section File hosts
-        html += '<div class="section-header" style="margin-top: 40px;"><h3>💾 Hébergeurs de fichiers</h3></div>';
+        html += '<div class="section-header" style="margin-top: 40px;"><h3><i class="fa-solid fa-floppy-disk"></i> Hébergeurs de fichiers</h3></div>';
         html += '<div class="search-results">';
 
         const fileHosts = Object.entries(data.file_hosts || {});
@@ -311,7 +311,7 @@ async function loadProvidersGrid() {
                         </div>
                         <div class="anime-card-actions">
                             <button class="btn btn-secondary btn-small" onclick="showDownloadInfo()">
-                                📥 Télécharger un fichier
+                                <i class="fa-solid fa-download"></i> Télécharger un fichier
                             </button>
                         </div>
                     </div>
@@ -330,10 +330,10 @@ async function loadProvidersGrid() {
         if (container) {
             container.innerHTML = `
                 <div class="no-results">
-                    <p>❌ Erreur lors du chargement des fournisseurs</p>
+                    <p><i class="fa-solid fa-xmark"></i> Erreur lors du chargement des fournisseurs</p>
                     <p style="font-size: 12px; margin-top: 10px; color: #ff6b6b;">${error.message}</p>
                     <button class="btn btn-secondary btn-small" onclick="loadProvidersGrid()" style="margin-top: 10px;">
-                        🔄 Réessayer
+                        <i class="fa-solid fa-rotate"></i> Réessayer
                     </button>
                 </div>
             `;
@@ -349,7 +349,7 @@ function showProviderSearch(providerId) {
 
 // Show download info (explains how to download)
 function showDownloadInfo() {
-    alert('💡 Pour télécharger un fichier:\n\n1. Utilisez l\'onglet "Recherche"\n2. Entrez le nom de l\'anime/série\n3. Cliquez sur "Télécharger" sur un épisode\n\nOu bien:\n- Copiez directement un lien de téléchargement dans la barre d\'adresse de votre navigateur');
+    alert('Pour télécharger un fichier:\n\n1. Utilisez l\'onglet "Recherche"\n2. Entrez le nom de l\'anime/série\n3. Cliquez sur "Télécharger" sur un épisode\n\nOu bien:\n- Copiez directement un lien de téléchargement dans la barre d\'adresse de votre navigateur');
 }
 
 // Make additional functions available globally
diff --git a/static/js/watchlist.js b/static/js/watchlist.js
index 7a96b1e..e449b70 100644
--- a/static/js/watchlist.js
+++ b/static/js/watchlist.js
@@ -346,10 +346,10 @@ async function handleStartScheduler() {
     try {
         await startScheduler();
         await loadSchedulerStatus();
-        alert('✅ Planificateur démarré!');
+        alert('Planificateur démarré !');
     } catch (error) {
         console.error('Error starting scheduler:', error);
-        alert(`❌ Erreur: ${error.message}`);
+        alert(`Erreur : ${error.message}`);
     }
 }
 
@@ -360,10 +360,10 @@ async function handleStopScheduler() {
     try {
         await stopScheduler();
         await loadSchedulerStatus();
-        alert('✅ Planificateur arrêté!');
+        alert('Planificateur arrêté !');
     } catch (error) {
         console.error('Error stopping scheduler:', error);
-        alert(`❌ Erreur: ${error.message}`);
+        alert(`Erreur : ${error.message}`);
     }
 }
 
@@ -376,7 +376,7 @@ async function handleCheckAll() {
         await loadSchedulerStatus();
     } catch (error) {
         console.error('Error checking all:', error);
-        alert(`❌ Erreur: ${error.message}`);
+        alert(`Erreur : ${error.message}`);
     }
 }
 
@@ -394,7 +394,7 @@ async function handleOpenSettings() {
         document.body.appendChild(modalContainer);
     } catch (error) {
         console.error('Error loading settings:', error);
-        alert(`❌ Erreur: ${error.message}`);
+        alert(`Erreur : ${error.message}`);
     }
 }
 
@@ -438,17 +438,17 @@ function updateSchedulerUI(status) {
 
         if (status.next_run) {
             const nextRun = new Date(status.next_run);
-            nextRunInfo.innerHTML = `✓ En cours<br>Prochaine vérification: ${nextRun.toLocaleString('fr-FR')}`;
+            nextRunInfo.innerHTML = `<i class="fa-solid fa-check"></i> En cours<br>Prochaine vérification: ${nextRun.toLocaleString('fr-FR')}`;
         } else {
             // Scheduler running but no next_run yet (just started)
             const interval = status.settings?.check_interval_hours || 6;
-            nextRunInfo.innerHTML = `✓ En cours<br>Vérification toutes les ${interval}h`;
+            nextRunInfo.innerHTML = `<i class="fa-solid fa-check"></i> En cours<br>Vérification toutes les ${interval}h`;
         }
     } else {
         // Update buttons if they exist
         if (startBtn) startBtn.style.display = 'inline-block';
         if (stopBtn) stopBtn.style.display = 'none';
-        nextRunInfo.innerHTML = '⏸️ Arrêté';
+        nextRunInfo.innerHTML = '<i class="fa-solid fa-pause"></i> Arrêté';
     }
 }
 
diff --git a/static/vendor/alpine.min.js b/static/vendor/alpine.min.js
new file mode 100644
index 0000000..a3be81c
--- /dev/null
+++ b/static/vendor/alpine.min.js
@@ -0,0 +1,5 @@
+(()=>{var nt=!1,it=!1,W=[],ot=-1;function Ut(e){Rn(e)}function Rn(e){W.includes(e)||W.push(e),Mn()}function Wt(e){let t=W.indexOf(e);t!==-1&&t>ot&&W.splice(t,1)}function Mn(){!it&&!nt&&(nt=!0,queueMicrotask(Nn))}function Nn(){nt=!1,it=!0;for(let e=0;e<W.length;e++)W[e](),ot=e;W.length=0,ot=-1,it=!1}var T,N,$,at,st=!0;function Gt(e){st=!1,e(),st=!0}function Jt(e){T=e.reactive,$=e.release,N=t=>e.effect(t,{scheduler:r=>{st?Ut(r):r()}}),at=e.raw}function ct(e){N=e}function Yt(e){let t=()=>{};return[n=>{let i=N(n);return e._x_effects||(e._x_effects=new Set,e._x_runEffects=()=>{e._x_effects.forEach(o=>o())}),e._x_effects.add(i),t=()=>{i!==void 0&&(e._x_effects.delete(i),$(i))},i},()=>{t()}]}function ve(e,t){let r=!0,n,i=N(()=>{let o=e();JSON.stringify(o),r?n=o:queueMicrotask(()=>{t(o,n),n=o}),r=!1});return()=>$(i)}var Xt=[],Zt=[],Qt=[];function er(e){Qt.push(e)}function te(e,t){typeof t=="function"?(e._x_cleanups||(e._x_cleanups=[]),e._x_cleanups.push(t)):(t=e,Zt.push(t))}function Ae(e){Xt.push(e)}function Oe(e,t,r){e._x_attributeCleanups||(e._x_attributeCleanups={}),e._x_attributeCleanups[t]||(e._x_attributeCleanups[t]=[]),e._x_attributeCleanups[t].push(r)}function lt(e,t){e._x_attributeCleanups&&Object.entries(e._x_attributeCleanups).forEach(([r,n])=>{(t===void 0||t.includes(r))&&(n.forEach(i=>i()),delete e._x_attributeCleanups[r])})}function tr(e){for(e._x_effects?.forEach(Wt);e._x_cleanups?.length;)e._x_cleanups.pop()()}var ut=new MutationObserver(mt),ft=!1;function ue(){ut.observe(document,{subtree:!0,childList:!0,attributes:!0,attributeOldValue:!0}),ft=!0}function dt(){kn(),ut.disconnect(),ft=!1}var le=[];function kn(){let e=ut.takeRecords();le.push(()=>e.length>0&&mt(e));let t=le.length;queueMicrotask(()=>{if(le.length===t)for(;le.length>0;)le.shift()()})}function m(e){if(!ft)return e();dt();let t=e();return ue(),t}var pt=!1,Se=[];function rr(){pt=!0}function nr(){pt=!1,mt(Se),Se=[]}function mt(e){if(pt){Se=Se.concat(e);return}let t=[],r=new Set,n=new Map,i=new Map;for(let o=0;o<e.length;o++)if(!e[o].target._x_ignoreMutationObserver&&(e[o].type==="childList"&&(e[o].removedNodes.forEach(s=>{s.nodeType===1&&s._x_marker&&r.add(s)}),e[o].addedNodes.forEach(s=>{if(s.nodeType===1){if(r.has(s)){r.delete(s);return}s._x_marker||t.push(s)}})),e[o].type==="attributes")){let s=e[o].target,a=e[o].attributeName,c=e[o].oldValue,l=()=>{n.has(s)||n.set(s,[]),n.get(s).push({name:a,value:s.getAttribute(a)})},u=()=>{i.has(s)||i.set(s,[]),i.get(s).push(a)};s.hasAttribute(a)&&c===null?l():s.hasAttribute(a)?(u(),l()):u()}i.forEach((o,s)=>{lt(s,o)}),n.forEach((o,s)=>{Xt.forEach(a=>a(s,o))});for(let o of r)t.some(s=>s.contains(o))||Zt.forEach(s=>s(o));for(let o of t)o.isConnected&&Qt.forEach(s=>s(o));t=null,r=null,n=null,i=null}function Ce(e){return z(B(e))}function k(e,t,r){return e._x_dataStack=[t,...B(r||e)],()=>{e._x_dataStack=e._x_dataStack.filter(n=>n!==t)}}function B(e){return e._x_dataStack?e._x_dataStack:typeof ShadowRoot=="function"&&e instanceof ShadowRoot?B(e.host):e.parentNode?B(e.parentNode):[]}function z(e){return new Proxy({objects:e},Dn)}var Dn={ownKeys({objects:e}){return Array.from(new Set(e.flatMap(t=>Object.keys(t))))},has({objects:e},t){return t==Symbol.unscopables?!1:e.some(r=>Object.prototype.hasOwnProperty.call(r,t)||Reflect.has(r,t))},get({objects:e},t,r){return t=="toJSON"?Pn:Reflect.get(e.find(n=>Reflect.has(n,t))||{},t,r)},set({objects:e},t,r,n){let i=e.find(s=>Object.prototype.hasOwnProperty.call(s,t))||e[e.length-1],o=Object.getOwnPropertyDescriptor(i,t);return o?.set&&o?.get?o.set.call(n,r)||!0:Reflect.set(i,t,r)}};function Pn(){return Reflect.ownKeys(this).reduce((t,r)=>(t[r]=Reflect.get(this,r),t),{})}function Te(e){let t=n=>typeof n=="object"&&!Array.isArray(n)&&n!==null,r=(n,i="")=>{Object.entries(Object.getOwnPropertyDescriptors(n)).forEach(([o,{value:s,enumerable:a}])=>{if(a===!1||s===void 0||typeof s=="object"&&s!==null&&s.__v_skip)return;let c=i===""?o:`${i}.${o}`;typeof s=="object"&&s!==null&&s._x_interceptor?n[o]=s.initialize(e,c,o):t(s)&&s!==n&&!(s instanceof Element)&&r(s,c)})};return r(e)}function Re(e,t=()=>{}){let r={initialValue:void 0,_x_interceptor:!0,initialize(n,i,o){return e(this.initialValue,()=>In(n,i),s=>ht(n,i,s),i,o)}};return t(r),n=>{if(typeof n=="object"&&n!==null&&n._x_interceptor){let i=r.initialize.bind(r);r.initialize=(o,s,a)=>{let c=n.initialize(o,s,a);return r.initialValue=c,i(o,s,a)}}else r.initialValue=n;return r}}function In(e,t){return t.split(".").reduce((r,n)=>r[n],e)}function ht(e,t,r){if(typeof t=="string"&&(t=t.split(".")),t.length===1)e[t[0]]=r;else{if(t.length===0)throw error;return e[t[0]]||(e[t[0]]={}),ht(e[t[0]],t.slice(1),r)}}var ir={};function y(e,t){ir[e]=t}function fe(e,t){let r=Ln(t);return Object.entries(ir).forEach(([n,i])=>{Object.defineProperty(e,`$${n}`,{get(){return i(t,r)},enumerable:!1})}),e}function Ln(e){let[t,r]=_t(e),n={interceptor:Re,...t};return te(e,r),n}function or(e,t,r,...n){try{return r(...n)}catch(i){re(i,e,t)}}function re(e,t,r=void 0){e=Object.assign(e??{message:"No error message given."},{el:t,expression:r}),console.warn(`Alpine Expression Error: ${e.message}
+
+${r?'Expression: "'+r+`"
+
+`:""}`,t),setTimeout(()=>{throw e},0)}var Me=!0;function ke(e){let t=Me;Me=!1;let r=e();return Me=t,r}function R(e,t,r={}){let n;return x(e,t)(i=>n=i,r),n}function x(...e){return sr(...e)}var sr=xt;function ar(e){sr=e}function xt(e,t){let r={};fe(r,e);let n=[r,...B(e)],i=typeof t=="function"?$n(n,t):Fn(n,t,e);return or.bind(null,e,t,i)}function $n(e,t){return(r=()=>{},{scope:n={},params:i=[]}={})=>{let o=t.apply(z([n,...e]),i);Ne(r,o)}}var gt={};function jn(e,t){if(gt[e])return gt[e];let r=Object.getPrototypeOf(async function(){}).constructor,n=/^[\n\s]*if.*\(.*\)/.test(e.trim())||/^(let|const)\s/.test(e.trim())?`(async()=>{ ${e} })()`:e,o=(()=>{try{let s=new r(["__self","scope"],`with (scope) { __self.result = ${n} }; __self.finished = true; return __self.result;`);return Object.defineProperty(s,"name",{value:`[Alpine] ${e}`}),s}catch(s){return re(s,t,e),Promise.resolve()}})();return gt[e]=o,o}function Fn(e,t,r){let n=jn(t,r);return(i=()=>{},{scope:o={},params:s=[]}={})=>{n.result=void 0,n.finished=!1;let a=z([o,...e]);if(typeof n=="function"){let c=n(n,a).catch(l=>re(l,r,t));n.finished?(Ne(i,n.result,a,s,r),n.result=void 0):c.then(l=>{Ne(i,l,a,s,r)}).catch(l=>re(l,r,t)).finally(()=>n.result=void 0)}}}function Ne(e,t,r,n,i){if(Me&&typeof t=="function"){let o=t.apply(r,n);o instanceof Promise?o.then(s=>Ne(e,s,r,n)).catch(s=>re(s,i,t)):e(o)}else typeof t=="object"&&t instanceof Promise?t.then(o=>e(o)):e(t)}var wt="x-";function C(e=""){return wt+e}function cr(e){wt=e}var De={};function d(e,t){return De[e]=t,{before(r){if(!De[r]){console.warn(String.raw`Cannot find directive \`${r}\`. \`${e}\` will use the default order of execution`);return}let n=G.indexOf(r);G.splice(n>=0?n:G.indexOf("DEFAULT"),0,e)}}}function lr(e){return Object.keys(De).includes(e)}function pe(e,t,r){if(t=Array.from(t),e._x_virtualDirectives){let o=Object.entries(e._x_virtualDirectives).map(([a,c])=>({name:a,value:c})),s=Et(o);o=o.map(a=>s.find(c=>c.name===a.name)?{name:`x-bind:${a.name}`,value:`"${a.value}"`}:a),t=t.concat(o)}let n={};return t.map(dr((o,s)=>n[o]=s)).filter(mr).map(zn(n,r)).sort(Kn).map(o=>Bn(e,o))}function Et(e){return Array.from(e).map(dr()).filter(t=>!mr(t))}var yt=!1,de=new Map,ur=Symbol();function fr(e){yt=!0;let t=Symbol();ur=t,de.set(t,[]);let r=()=>{for(;de.get(t).length;)de.get(t).shift()();de.delete(t)},n=()=>{yt=!1,r()};e(r),n()}function _t(e){let t=[],r=a=>t.push(a),[n,i]=Yt(e);return t.push(i),[{Alpine:K,effect:n,cleanup:r,evaluateLater:x.bind(x,e),evaluate:R.bind(R,e)},()=>t.forEach(a=>a())]}function Bn(e,t){let r=()=>{},n=De[t.type]||r,[i,o]=_t(e);Oe(e,t.original,o);let s=()=>{e._x_ignore||e._x_ignoreSelf||(n.inline&&n.inline(e,t,i),n=n.bind(n,e,t,i),yt?de.get(ur).push(n):n())};return s.runCleanups=o,s}var Pe=(e,t)=>({name:r,value:n})=>(r.startsWith(e)&&(r=r.replace(e,t)),{name:r,value:n}),Ie=e=>e;function dr(e=()=>{}){return({name:t,value:r})=>{let{name:n,value:i}=pr.reduce((o,s)=>s(o),{name:t,value:r});return n!==t&&e(n,t),{name:n,value:i}}}var pr=[];function ne(e){pr.push(e)}function mr({name:e}){return hr().test(e)}var hr=()=>new RegExp(`^${wt}([^:^.]+)\\b`);function zn(e,t){return({name:r,value:n})=>{let i=r.match(hr()),o=r.match(/:([a-zA-Z0-9\-_:]+)/),s=r.match(/\.[^.\]]+(?=[^\]]*$)/g)||[],a=t||e[r]||r;return{type:i?i[1]:null,value:o?o[1]:null,modifiers:s.map(c=>c.replace(".","")),expression:n,original:a}}}var bt="DEFAULT",G=["ignore","ref","data","id","anchor","bind","init","for","model","modelable","transition","show","if",bt,"teleport"];function Kn(e,t){let r=G.indexOf(e.type)===-1?bt:e.type,n=G.indexOf(t.type)===-1?bt:t.type;return G.indexOf(r)-G.indexOf(n)}function J(e,t,r={}){e.dispatchEvent(new CustomEvent(t,{detail:r,bubbles:!0,composed:!0,cancelable:!0}))}function D(e,t){if(typeof ShadowRoot=="function"&&e instanceof ShadowRoot){Array.from(e.children).forEach(i=>D(i,t));return}let r=!1;if(t(e,()=>r=!0),r)return;let n=e.firstElementChild;for(;n;)D(n,t,!1),n=n.nextElementSibling}function E(e,...t){console.warn(`Alpine Warning: ${e}`,...t)}var _r=!1;function gr(){_r&&E("Alpine has already been initialized on this page. Calling Alpine.start() more than once can cause problems."),_r=!0,document.body||E("Unable to initialize. Trying to load Alpine before `<body>` is available. Did you forget to add `defer` in Alpine's `<script>` tag?"),J(document,"alpine:init"),J(document,"alpine:initializing"),ue(),er(t=>S(t,D)),te(t=>P(t)),Ae((t,r)=>{pe(t,r).forEach(n=>n())});let e=t=>!Y(t.parentElement,!0);Array.from(document.querySelectorAll(br().join(","))).filter(e).forEach(t=>{S(t)}),J(document,"alpine:initialized"),setTimeout(()=>{Vn()})}var vt=[],xr=[];function yr(){return vt.map(e=>e())}function br(){return vt.concat(xr).map(e=>e())}function Le(e){vt.push(e)}function $e(e){xr.push(e)}function Y(e,t=!1){return j(e,r=>{if((t?br():yr()).some(i=>r.matches(i)))return!0})}function j(e,t){if(e){if(t(e))return e;if(e._x_teleportBack&&(e=e._x_teleportBack),!!e.parentElement)return j(e.parentElement,t)}}function wr(e){return yr().some(t=>e.matches(t))}var Er=[];function vr(e){Er.push(e)}var Hn=1;function S(e,t=D,r=()=>{}){j(e,n=>n._x_ignore)||fr(()=>{t(e,(n,i)=>{n._x_marker||(r(n,i),Er.forEach(o=>o(n,i)),pe(n,n.attributes).forEach(o=>o()),n._x_ignore||(n._x_marker=Hn++),n._x_ignore&&i())})})}function P(e,t=D){t(e,r=>{tr(r),lt(r),delete r._x_marker})}function Vn(){[["ui","dialog",["[x-dialog], [x-popover]"]],["anchor","anchor",["[x-anchor]"]],["sort","sort",["[x-sort]"]]].forEach(([t,r,n])=>{lr(r)||n.some(i=>{if(document.querySelector(i))return E(`found "${i}", but missing ${t} plugin`),!0})})}var St=[],At=!1;function ie(e=()=>{}){return queueMicrotask(()=>{At||setTimeout(()=>{je()})}),new Promise(t=>{St.push(()=>{e(),t()})})}function je(){for(At=!1;St.length;)St.shift()()}function Sr(){At=!0}function me(e,t){return Array.isArray(t)?Ar(e,t.join(" ")):typeof t=="object"&&t!==null?qn(e,t):typeof t=="function"?me(e,t()):Ar(e,t)}function Ar(e,t){let r=o=>o.split(" ").filter(Boolean),n=o=>o.split(" ").filter(s=>!e.classList.contains(s)).filter(Boolean),i=o=>(e.classList.add(...o),()=>{e.classList.remove(...o)});return t=t===!0?t="":t||"",i(n(t))}function qn(e,t){let r=a=>a.split(" ").filter(Boolean),n=Object.entries(t).flatMap(([a,c])=>c?r(a):!1).filter(Boolean),i=Object.entries(t).flatMap(([a,c])=>c?!1:r(a)).filter(Boolean),o=[],s=[];return i.forEach(a=>{e.classList.contains(a)&&(e.classList.remove(a),s.push(a))}),n.forEach(a=>{e.classList.contains(a)||(e.classList.add(a),o.push(a))}),()=>{s.forEach(a=>e.classList.add(a)),o.forEach(a=>e.classList.remove(a))}}function X(e,t){return typeof t=="object"&&t!==null?Un(e,t):Wn(e,t)}function Un(e,t){let r={};return Object.entries(t).forEach(([n,i])=>{r[n]=e.style[n],n.startsWith("--")||(n=Gn(n)),e.style.setProperty(n,i)}),setTimeout(()=>{e.style.length===0&&e.removeAttribute("style")}),()=>{X(e,r)}}function Wn(e,t){let r=e.getAttribute("style",t);return e.setAttribute("style",t),()=>{e.setAttribute("style",r||"")}}function Gn(e){return e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()}function he(e,t=()=>{}){let r=!1;return function(){r?t.apply(this,arguments):(r=!0,e.apply(this,arguments))}}d("transition",(e,{value:t,modifiers:r,expression:n},{evaluate:i})=>{typeof n=="function"&&(n=i(n)),n!==!1&&(!n||typeof n=="boolean"?Yn(e,r,t):Jn(e,n,t))});function Jn(e,t,r){Or(e,me,""),{enter:i=>{e._x_transition.enter.during=i},"enter-start":i=>{e._x_transition.enter.start=i},"enter-end":i=>{e._x_transition.enter.end=i},leave:i=>{e._x_transition.leave.during=i},"leave-start":i=>{e._x_transition.leave.start=i},"leave-end":i=>{e._x_transition.leave.end=i}}[r](t)}function Yn(e,t,r){Or(e,X);let n=!t.includes("in")&&!t.includes("out")&&!r,i=n||t.includes("in")||["enter"].includes(r),o=n||t.includes("out")||["leave"].includes(r);t.includes("in")&&!n&&(t=t.filter((g,b)=>b<t.indexOf("out"))),t.includes("out")&&!n&&(t=t.filter((g,b)=>b>t.indexOf("out")));let s=!t.includes("opacity")&&!t.includes("scale"),a=s||t.includes("opacity"),c=s||t.includes("scale"),l=a?0:1,u=c?_e(t,"scale",95)/100:1,p=_e(t,"delay",0)/1e3,h=_e(t,"origin","center"),w="opacity, transform",F=_e(t,"duration",150)/1e3,Ee=_e(t,"duration",75)/1e3,f="cubic-bezier(0.4, 0.0, 0.2, 1)";i&&(e._x_transition.enter.during={transformOrigin:h,transitionDelay:`${p}s`,transitionProperty:w,transitionDuration:`${F}s`,transitionTimingFunction:f},e._x_transition.enter.start={opacity:l,transform:`scale(${u})`},e._x_transition.enter.end={opacity:1,transform:"scale(1)"}),o&&(e._x_transition.leave.during={transformOrigin:h,transitionDelay:`${p}s`,transitionProperty:w,transitionDuration:`${Ee}s`,transitionTimingFunction:f},e._x_transition.leave.start={opacity:1,transform:"scale(1)"},e._x_transition.leave.end={opacity:l,transform:`scale(${u})`})}function Or(e,t,r={}){e._x_transition||(e._x_transition={enter:{during:r,start:r,end:r},leave:{during:r,start:r,end:r},in(n=()=>{},i=()=>{}){Fe(e,t,{during:this.enter.during,start:this.enter.start,end:this.enter.end},n,i)},out(n=()=>{},i=()=>{}){Fe(e,t,{during:this.leave.during,start:this.leave.start,end:this.leave.end},n,i)}})}window.Element.prototype._x_toggleAndCascadeWithTransitions=function(e,t,r,n){let i=document.visibilityState==="visible"?requestAnimationFrame:setTimeout,o=()=>i(r);if(t){e._x_transition&&(e._x_transition.enter||e._x_transition.leave)?e._x_transition.enter&&(Object.entries(e._x_transition.enter.during).length||Object.entries(e._x_transition.enter.start).length||Object.entries(e._x_transition.enter.end).length)?e._x_transition.in(r):o():e._x_transition?e._x_transition.in(r):o();return}e._x_hidePromise=e._x_transition?new Promise((s,a)=>{e._x_transition.out(()=>{},()=>s(n)),e._x_transitioning&&e._x_transitioning.beforeCancel(()=>a({isFromCancelledTransition:!0}))}):Promise.resolve(n),queueMicrotask(()=>{let s=Cr(e);s?(s._x_hideChildren||(s._x_hideChildren=[]),s._x_hideChildren.push(e)):i(()=>{let a=c=>{let l=Promise.all([c._x_hidePromise,...(c._x_hideChildren||[]).map(a)]).then(([u])=>u?.());return delete c._x_hidePromise,delete c._x_hideChildren,l};a(e).catch(c=>{if(!c.isFromCancelledTransition)throw c})})})};function Cr(e){let t=e.parentNode;if(t)return t._x_hidePromise?t:Cr(t)}function Fe(e,t,{during:r,start:n,end:i}={},o=()=>{},s=()=>{}){if(e._x_transitioning&&e._x_transitioning.cancel(),Object.keys(r).length===0&&Object.keys(n).length===0&&Object.keys(i).length===0){o(),s();return}let a,c,l;Xn(e,{start(){a=t(e,n)},during(){c=t(e,r)},before:o,end(){a(),l=t(e,i)},after:s,cleanup(){c(),l()}})}function Xn(e,t){let r,n,i,o=he(()=>{m(()=>{r=!0,n||t.before(),i||(t.end(),je()),t.after(),e.isConnected&&t.cleanup(),delete e._x_transitioning})});e._x_transitioning={beforeCancels:[],beforeCancel(s){this.beforeCancels.push(s)},cancel:he(function(){for(;this.beforeCancels.length;)this.beforeCancels.shift()();o()}),finish:o},m(()=>{t.start(),t.during()}),Sr(),requestAnimationFrame(()=>{if(r)return;let s=Number(getComputedStyle(e).transitionDuration.replace(/,.*/,"").replace("s",""))*1e3,a=Number(getComputedStyle(e).transitionDelay.replace(/,.*/,"").replace("s",""))*1e3;s===0&&(s=Number(getComputedStyle(e).animationDuration.replace("s",""))*1e3),m(()=>{t.before()}),n=!0,requestAnimationFrame(()=>{r||(m(()=>{t.end()}),je(),setTimeout(e._x_transitioning.finish,s+a),i=!0)})})}function _e(e,t,r){if(e.indexOf(t)===-1)return r;let n=e[e.indexOf(t)+1];if(!n||t==="scale"&&isNaN(n))return r;if(t==="duration"||t==="delay"){let i=n.match(/([0-9]+)ms/);if(i)return i[1]}return t==="origin"&&["top","right","left","center","bottom"].includes(e[e.indexOf(t)+2])?[n,e[e.indexOf(t)+2]].join(" "):n}var I=!1;function A(e,t=()=>{}){return(...r)=>I?t(...r):e(...r)}function Tr(e){return(...t)=>I&&e(...t)}var Rr=[];function H(e){Rr.push(e)}function Mr(e,t){Rr.forEach(r=>r(e,t)),I=!0,kr(()=>{S(t,(r,n)=>{n(r,()=>{})})}),I=!1}var Be=!1;function Nr(e,t){t._x_dataStack||(t._x_dataStack=e._x_dataStack),I=!0,Be=!0,kr(()=>{Zn(t)}),I=!1,Be=!1}function Zn(e){let t=!1;S(e,(n,i)=>{D(n,(o,s)=>{if(t&&wr(o))return s();t=!0,i(o,s)})})}function kr(e){let t=N;ct((r,n)=>{let i=t(r);return $(i),()=>{}}),e(),ct(t)}function ge(e,t,r,n=[]){switch(e._x_bindings||(e._x_bindings=T({})),e._x_bindings[t]=r,t=n.includes("camel")?si(t):t,t){case"value":Qn(e,r);break;case"style":ti(e,r);break;case"class":ei(e,r);break;case"selected":case"checked":ri(e,t,r);break;default:Pr(e,t,r);break}}function Qn(e,t){if(Ot(e))e.attributes.value===void 0&&(e.value=t),window.fromModel&&(typeof t=="boolean"?e.checked=xe(e.value)===t:e.checked=Dr(e.value,t));else if(ze(e))Number.isInteger(t)?e.value=t:!Array.isArray(t)&&typeof t!="boolean"&&![null,void 0].includes(t)?e.value=String(t):Array.isArray(t)?e.checked=t.some(r=>Dr(r,e.value)):e.checked=!!t;else if(e.tagName==="SELECT")oi(e,t);else{if(e.value===t)return;e.value=t===void 0?"":t}}function ei(e,t){e._x_undoAddedClasses&&e._x_undoAddedClasses(),e._x_undoAddedClasses=me(e,t)}function ti(e,t){e._x_undoAddedStyles&&e._x_undoAddedStyles(),e._x_undoAddedStyles=X(e,t)}function ri(e,t,r){Pr(e,t,r),ii(e,t,r)}function Pr(e,t,r){[null,void 0,!1].includes(r)&&ci(t)?e.removeAttribute(t):(Ir(t)&&(r=t),ni(e,t,r))}function ni(e,t,r){e.getAttribute(t)!=r&&e.setAttribute(t,r)}function ii(e,t,r){e[t]!==r&&(e[t]=r)}function oi(e,t){let r=[].concat(t).map(n=>n+"");Array.from(e.options).forEach(n=>{n.selected=r.includes(n.value)})}function si(e){return e.toLowerCase().replace(/-(\w)/g,(t,r)=>r.toUpperCase())}function Dr(e,t){return e==t}function xe(e){return[1,"1","true","on","yes",!0].includes(e)?!0:[0,"0","false","off","no",!1].includes(e)?!1:e?Boolean(e):null}var ai=new Set(["allowfullscreen","async","autofocus","autoplay","checked","controls","default","defer","disabled","formnovalidate","inert","ismap","itemscope","loop","multiple","muted","nomodule","novalidate","open","playsinline","readonly","required","reversed","selected","shadowrootclonable","shadowrootdelegatesfocus","shadowrootserializable"]);function Ir(e){return ai.has(e)}function ci(e){return!["aria-pressed","aria-checked","aria-expanded","aria-selected"].includes(e)}function Lr(e,t,r){return e._x_bindings&&e._x_bindings[t]!==void 0?e._x_bindings[t]:jr(e,t,r)}function $r(e,t,r,n=!0){if(e._x_bindings&&e._x_bindings[t]!==void 0)return e._x_bindings[t];if(e._x_inlineBindings&&e._x_inlineBindings[t]!==void 0){let i=e._x_inlineBindings[t];return i.extract=n,ke(()=>R(e,i.expression))}return jr(e,t,r)}function jr(e,t,r){let n=e.getAttribute(t);return n===null?typeof r=="function"?r():r:n===""?!0:Ir(t)?!![t,"true"].includes(n):n}function ze(e){return e.type==="checkbox"||e.localName==="ui-checkbox"||e.localName==="ui-switch"}function Ot(e){return e.type==="radio"||e.localName==="ui-radio"}function Ke(e,t){var r;return function(){var n=this,i=arguments,o=function(){r=null,e.apply(n,i)};clearTimeout(r),r=setTimeout(o,t)}}function He(e,t){let r;return function(){let n=this,i=arguments;r||(e.apply(n,i),r=!0,setTimeout(()=>r=!1,t))}}function Ve({get:e,set:t},{get:r,set:n}){let i=!0,o,s,a=N(()=>{let c=e(),l=r();if(i)n(Ct(c)),i=!1;else{let u=JSON.stringify(c),p=JSON.stringify(l);u!==o?n(Ct(c)):u!==p&&t(Ct(l))}o=JSON.stringify(e()),s=JSON.stringify(r())});return()=>{$(a)}}function Ct(e){return typeof e=="object"?JSON.parse(JSON.stringify(e)):e}function Fr(e){(Array.isArray(e)?e:[e]).forEach(r=>r(K))}var Z={},Br=!1;function zr(e,t){if(Br||(Z=T(Z),Br=!0),t===void 0)return Z[e];Z[e]=t,Te(Z[e]),typeof t=="object"&&t!==null&&t.hasOwnProperty("init")&&typeof t.init=="function"&&Z[e].init()}function Kr(){return Z}var Hr={};function Vr(e,t){let r=typeof t!="function"?()=>t:t;return e instanceof Element?Tt(e,r()):(Hr[e]=r,()=>{})}function qr(e){return Object.entries(Hr).forEach(([t,r])=>{Object.defineProperty(e,t,{get(){return(...n)=>r(...n)}})}),e}function Tt(e,t,r){let n=[];for(;n.length;)n.pop()();let i=Object.entries(t).map(([s,a])=>({name:s,value:a})),o=Et(i);return i=i.map(s=>o.find(a=>a.name===s.name)?{name:`x-bind:${s.name}`,value:`"${s.value}"`}:s),pe(e,i,r).map(s=>{n.push(s.runCleanups),s()}),()=>{for(;n.length;)n.pop()()}}var Ur={};function Wr(e,t){Ur[e]=t}function Gr(e,t){return Object.entries(Ur).forEach(([r,n])=>{Object.defineProperty(e,r,{get(){return(...i)=>n.bind(t)(...i)},enumerable:!1})}),e}var li={get reactive(){return T},get release(){return $},get effect(){return N},get raw(){return at},version:"3.14.8",flushAndStopDeferringMutations:nr,dontAutoEvaluateFunctions:ke,disableEffectScheduling:Gt,startObservingMutations:ue,stopObservingMutations:dt,setReactivityEngine:Jt,onAttributeRemoved:Oe,onAttributesAdded:Ae,closestDataStack:B,skipDuringClone:A,onlyDuringClone:Tr,addRootSelector:Le,addInitSelector:$e,interceptClone:H,addScopeToNode:k,deferMutations:rr,mapAttributes:ne,evaluateLater:x,interceptInit:vr,setEvaluator:ar,mergeProxies:z,extractProp:$r,findClosest:j,onElRemoved:te,closestRoot:Y,destroyTree:P,interceptor:Re,transition:Fe,setStyles:X,mutateDom:m,directive:d,entangle:Ve,throttle:He,debounce:Ke,evaluate:R,initTree:S,nextTick:ie,prefixed:C,prefix:cr,plugin:Fr,magic:y,store:zr,start:gr,clone:Nr,cloneNode:Mr,bound:Lr,$data:Ce,watch:ve,walk:D,data:Wr,bind:Vr},K=li;function Rt(e,t){let r=Object.create(null),n=e.split(",");for(let i=0;i<n.length;i++)r[n[i]]=!0;return t?i=>!!r[i.toLowerCase()]:i=>!!r[i]}var ui="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly";var Ls=Rt(ui+",async,autofocus,autoplay,controls,default,defer,disabled,hidden,loop,open,required,reversed,scoped,seamless,checked,muted,multiple,selected");var Jr=Object.freeze({}),$s=Object.freeze([]);var fi=Object.prototype.hasOwnProperty,ye=(e,t)=>fi.call(e,t),V=Array.isArray,oe=e=>Yr(e)==="[object Map]";var di=e=>typeof e=="string",qe=e=>typeof e=="symbol",be=e=>e!==null&&typeof e=="object";var pi=Object.prototype.toString,Yr=e=>pi.call(e),Mt=e=>Yr(e).slice(8,-1);var Ue=e=>di(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e;var We=e=>{let t=Object.create(null);return r=>t[r]||(t[r]=e(r))},mi=/-(\w)/g,js=We(e=>e.replace(mi,(t,r)=>r?r.toUpperCase():"")),hi=/\B([A-Z])/g,Fs=We(e=>e.replace(hi,"-$1").toLowerCase()),Nt=We(e=>e.charAt(0).toUpperCase()+e.slice(1)),Bs=We(e=>e?`on${Nt(e)}`:""),kt=(e,t)=>e!==t&&(e===e||t===t);var Dt=new WeakMap,we=[],L,Q=Symbol("iterate"),Pt=Symbol("Map key iterate");function _i(e){return e&&e._isEffect===!0}function rn(e,t=Jr){_i(e)&&(e=e.raw);let r=xi(e,t);return t.lazy||r(),r}function nn(e){e.active&&(on(e),e.options.onStop&&e.options.onStop(),e.active=!1)}var gi=0;function xi(e,t){let r=function(){if(!r.active)return e();if(!we.includes(r)){on(r);try{return bi(),we.push(r),L=r,e()}finally{we.pop(),sn(),L=we[we.length-1]}}};return r.id=gi++,r.allowRecurse=!!t.allowRecurse,r._isEffect=!0,r.active=!0,r.raw=e,r.deps=[],r.options=t,r}function on(e){let{deps:t}=e;if(t.length){for(let r=0;r<t.length;r++)t[r].delete(e);t.length=0}}var se=!0,Lt=[];function yi(){Lt.push(se),se=!1}function bi(){Lt.push(se),se=!0}function sn(){let e=Lt.pop();se=e===void 0?!0:e}function M(e,t,r){if(!se||L===void 0)return;let n=Dt.get(e);n||Dt.set(e,n=new Map);let i=n.get(r);i||n.set(r,i=new Set),i.has(L)||(i.add(L),L.deps.push(i),L.options.onTrack&&L.options.onTrack({effect:L,target:e,type:t,key:r}))}function U(e,t,r,n,i,o){let s=Dt.get(e);if(!s)return;let a=new Set,c=u=>{u&&u.forEach(p=>{(p!==L||p.allowRecurse)&&a.add(p)})};if(t==="clear")s.forEach(c);else if(r==="length"&&V(e))s.forEach((u,p)=>{(p==="length"||p>=n)&&c(u)});else switch(r!==void 0&&c(s.get(r)),t){case"add":V(e)?Ue(r)&&c(s.get("length")):(c(s.get(Q)),oe(e)&&c(s.get(Pt)));break;case"delete":V(e)||(c(s.get(Q)),oe(e)&&c(s.get(Pt)));break;case"set":oe(e)&&c(s.get(Q));break}let l=u=>{u.options.onTrigger&&u.options.onTrigger({effect:u,target:e,key:r,type:t,newValue:n,oldValue:i,oldTarget:o}),u.options.scheduler?u.options.scheduler(u):u()};a.forEach(l)}var wi=Rt("__proto__,__v_isRef,__isVue"),an=new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(qe)),Ei=cn();var vi=cn(!0);var Xr=Si();function Si(){let e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...r){let n=_(this);for(let o=0,s=this.length;o<s;o++)M(n,"get",o+"");let i=n[t](...r);return i===-1||i===!1?n[t](...r.map(_)):i}}),["push","pop","shift","unshift","splice"].forEach(t=>{e[t]=function(...r){yi();let n=_(this)[t].apply(this,r);return sn(),n}}),e}function cn(e=!1,t=!1){return function(n,i,o){if(i==="__v_isReactive")return!e;if(i==="__v_isReadonly")return e;if(i==="__v_raw"&&o===(e?t?Bi:dn:t?Fi:fn).get(n))return n;let s=V(n);if(!e&&s&&ye(Xr,i))return Reflect.get(Xr,i,o);let a=Reflect.get(n,i,o);return(qe(i)?an.has(i):wi(i))||(e||M(n,"get",i),t)?a:It(a)?!s||!Ue(i)?a.value:a:be(a)?e?pn(a):et(a):a}}var Ai=Oi();function Oi(e=!1){return function(r,n,i,o){let s=r[n];if(!e&&(i=_(i),s=_(s),!V(r)&&It(s)&&!It(i)))return s.value=i,!0;let a=V(r)&&Ue(n)?Number(n)<r.length:ye(r,n),c=Reflect.set(r,n,i,o);return r===_(o)&&(a?kt(i,s)&&U(r,"set",n,i,s):U(r,"add",n,i)),c}}function Ci(e,t){let r=ye(e,t),n=e[t],i=Reflect.deleteProperty(e,t);return i&&r&&U(e,"delete",t,void 0,n),i}function Ti(e,t){let r=Reflect.has(e,t);return(!qe(t)||!an.has(t))&&M(e,"has",t),r}function Ri(e){return M(e,"iterate",V(e)?"length":Q),Reflect.ownKeys(e)}var Mi={get:Ei,set:Ai,deleteProperty:Ci,has:Ti,ownKeys:Ri},Ni={get:vi,set(e,t){return console.warn(`Set operation on key "${String(t)}" failed: target is readonly.`,e),!0},deleteProperty(e,t){return console.warn(`Delete operation on key "${String(t)}" failed: target is readonly.`,e),!0}};var $t=e=>be(e)?et(e):e,jt=e=>be(e)?pn(e):e,Ft=e=>e,Qe=e=>Reflect.getPrototypeOf(e);function Ge(e,t,r=!1,n=!1){e=e.__v_raw;let i=_(e),o=_(t);t!==o&&!r&&M(i,"get",t),!r&&M(i,"get",o);let{has:s}=Qe(i),a=n?Ft:r?jt:$t;if(s.call(i,t))return a(e.get(t));if(s.call(i,o))return a(e.get(o));e!==i&&e.get(t)}function Je(e,t=!1){let r=this.__v_raw,n=_(r),i=_(e);return e!==i&&!t&&M(n,"has",e),!t&&M(n,"has",i),e===i?r.has(e):r.has(e)||r.has(i)}function Ye(e,t=!1){return e=e.__v_raw,!t&&M(_(e),"iterate",Q),Reflect.get(e,"size",e)}function Zr(e){e=_(e);let t=_(this);return Qe(t).has.call(t,e)||(t.add(e),U(t,"add",e,e)),this}function Qr(e,t){t=_(t);let r=_(this),{has:n,get:i}=Qe(r),o=n.call(r,e);o?un(r,n,e):(e=_(e),o=n.call(r,e));let s=i.call(r,e);return r.set(e,t),o?kt(t,s)&&U(r,"set",e,t,s):U(r,"add",e,t),this}function en(e){let t=_(this),{has:r,get:n}=Qe(t),i=r.call(t,e);i?un(t,r,e):(e=_(e),i=r.call(t,e));let o=n?n.call(t,e):void 0,s=t.delete(e);return i&&U(t,"delete",e,void 0,o),s}function tn(){let e=_(this),t=e.size!==0,r=oe(e)?new Map(e):new Set(e),n=e.clear();return t&&U(e,"clear",void 0,void 0,r),n}function Xe(e,t){return function(n,i){let o=this,s=o.__v_raw,a=_(s),c=t?Ft:e?jt:$t;return!e&&M(a,"iterate",Q),s.forEach((l,u)=>n.call(i,c(l),c(u),o))}}function Ze(e,t,r){return function(...n){let i=this.__v_raw,o=_(i),s=oe(o),a=e==="entries"||e===Symbol.iterator&&s,c=e==="keys"&&s,l=i[e](...n),u=r?Ft:t?jt:$t;return!t&&M(o,"iterate",c?Pt:Q),{next(){let{value:p,done:h}=l.next();return h?{value:p,done:h}:{value:a?[u(p[0]),u(p[1])]:u(p),done:h}},[Symbol.iterator](){return this}}}}function q(e){return function(...t){{let r=t[0]?`on key "${t[0]}" `:"";console.warn(`${Nt(e)} operation ${r}failed: target is readonly.`,_(this))}return e==="delete"?!1:this}}function ki(){let e={get(o){return Ge(this,o)},get size(){return Ye(this)},has:Je,add:Zr,set:Qr,delete:en,clear:tn,forEach:Xe(!1,!1)},t={get(o){return Ge(this,o,!1,!0)},get size(){return Ye(this)},has:Je,add:Zr,set:Qr,delete:en,clear:tn,forEach:Xe(!1,!0)},r={get(o){return Ge(this,o,!0)},get size(){return Ye(this,!0)},has(o){return Je.call(this,o,!0)},add:q("add"),set:q("set"),delete:q("delete"),clear:q("clear"),forEach:Xe(!0,!1)},n={get(o){return Ge(this,o,!0,!0)},get size(){return Ye(this,!0)},has(o){return Je.call(this,o,!0)},add:q("add"),set:q("set"),delete:q("delete"),clear:q("clear"),forEach:Xe(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(o=>{e[o]=Ze(o,!1,!1),r[o]=Ze(o,!0,!1),t[o]=Ze(o,!1,!0),n[o]=Ze(o,!0,!0)}),[e,r,t,n]}var[Di,Pi,Ii,Li]=ki();function ln(e,t){let r=t?e?Li:Ii:e?Pi:Di;return(n,i,o)=>i==="__v_isReactive"?!e:i==="__v_isReadonly"?e:i==="__v_raw"?n:Reflect.get(ye(r,i)&&i in n?r:n,i,o)}var $i={get:ln(!1,!1)};var ji={get:ln(!0,!1)};function un(e,t,r){let n=_(r);if(n!==r&&t.call(e,n)){let i=Mt(e);console.warn(`Reactive ${i} contains both the raw and reactive versions of the same object${i==="Map"?" as keys":""}, which can lead to inconsistencies. Avoid differentiating between the raw and reactive versions of an object and only use the reactive version if possible.`)}}var fn=new WeakMap,Fi=new WeakMap,dn=new WeakMap,Bi=new WeakMap;function zi(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function Ki(e){return e.__v_skip||!Object.isExtensible(e)?0:zi(Mt(e))}function et(e){return e&&e.__v_isReadonly?e:mn(e,!1,Mi,$i,fn)}function pn(e){return mn(e,!0,Ni,ji,dn)}function mn(e,t,r,n,i){if(!be(e))return console.warn(`value cannot be made reactive: ${String(e)}`),e;if(e.__v_raw&&!(t&&e.__v_isReactive))return e;let o=i.get(e);if(o)return o;let s=Ki(e);if(s===0)return e;let a=new Proxy(e,s===2?n:r);return i.set(e,a),a}function _(e){return e&&_(e.__v_raw)||e}function It(e){return Boolean(e&&e.__v_isRef===!0)}y("nextTick",()=>ie);y("dispatch",e=>J.bind(J,e));y("watch",(e,{evaluateLater:t,cleanup:r})=>(n,i)=>{let o=t(n),a=ve(()=>{let c;return o(l=>c=l),c},i);r(a)});y("store",Kr);y("data",e=>Ce(e));y("root",e=>Y(e));y("refs",e=>(e._x_refs_proxy||(e._x_refs_proxy=z(Hi(e))),e._x_refs_proxy));function Hi(e){let t=[];return j(e,r=>{r._x_refs&&t.push(r._x_refs)}),t}var Bt={};function zt(e){return Bt[e]||(Bt[e]=0),++Bt[e]}function hn(e,t){return j(e,r=>{if(r._x_ids&&r._x_ids[t])return!0})}function _n(e,t){e._x_ids||(e._x_ids={}),e._x_ids[t]||(e._x_ids[t]=zt(t))}y("id",(e,{cleanup:t})=>(r,n=null)=>{let i=`${r}${n?`-${n}`:""}`;return Vi(e,i,t,()=>{let o=hn(e,r),s=o?o._x_ids[r]:zt(r);return n?`${r}-${s}-${n}`:`${r}-${s}`})});H((e,t)=>{e._x_id&&(t._x_id=e._x_id)});function Vi(e,t,r,n){if(e._x_id||(e._x_id={}),e._x_id[t])return e._x_id[t];let i=n();return e._x_id[t]=i,r(()=>{delete e._x_id[t]}),i}y("el",e=>e);gn("Focus","focus","focus");gn("Persist","persist","persist");function gn(e,t,r){y(t,n=>E(`You can't use [$${t}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${r}`,n))}d("modelable",(e,{expression:t},{effect:r,evaluateLater:n,cleanup:i})=>{let o=n(t),s=()=>{let u;return o(p=>u=p),u},a=n(`${t} = __placeholder`),c=u=>a(()=>{},{scope:{__placeholder:u}}),l=s();c(l),queueMicrotask(()=>{if(!e._x_model)return;e._x_removeModelListeners.default();let u=e._x_model.get,p=e._x_model.set,h=Ve({get(){return u()},set(w){p(w)}},{get(){return s()},set(w){c(w)}});i(h)})});d("teleport",(e,{modifiers:t,expression:r},{cleanup:n})=>{e.tagName.toLowerCase()!=="template"&&E("x-teleport can only be used on a <template> tag",e);let i=xn(r),o=e.content.cloneNode(!0).firstElementChild;e._x_teleport=o,o._x_teleportBack=e,e.setAttribute("data-teleport-template",!0),o.setAttribute("data-teleport-target",!0),e._x_forwardEvents&&e._x_forwardEvents.forEach(a=>{o.addEventListener(a,c=>{c.stopPropagation(),e.dispatchEvent(new c.constructor(c.type,c))})}),k(o,{},e);let s=(a,c,l)=>{l.includes("prepend")?c.parentNode.insertBefore(a,c):l.includes("append")?c.parentNode.insertBefore(a,c.nextSibling):c.appendChild(a)};m(()=>{s(o,i,t),A(()=>{S(o)})()}),e._x_teleportPutBack=()=>{let a=xn(r);m(()=>{s(e._x_teleport,a,t)})},n(()=>m(()=>{o.remove(),P(o)}))});var qi=document.createElement("div");function xn(e){let t=A(()=>document.querySelector(e),()=>qi)();return t||E(`Cannot find x-teleport element for selector: "${e}"`),t}var yn=()=>{};yn.inline=(e,{modifiers:t},{cleanup:r})=>{t.includes("self")?e._x_ignoreSelf=!0:e._x_ignore=!0,r(()=>{t.includes("self")?delete e._x_ignoreSelf:delete e._x_ignore})};d("ignore",yn);d("effect",A((e,{expression:t},{effect:r})=>{r(x(e,t))}));function ae(e,t,r,n){let i=e,o=c=>n(c),s={},a=(c,l)=>u=>l(c,u);if(r.includes("dot")&&(t=Ui(t)),r.includes("camel")&&(t=Wi(t)),r.includes("passive")&&(s.passive=!0),r.includes("capture")&&(s.capture=!0),r.includes("window")&&(i=window),r.includes("document")&&(i=document),r.includes("debounce")){let c=r[r.indexOf("debounce")+1]||"invalid-wait",l=tt(c.split("ms")[0])?Number(c.split("ms")[0]):250;o=Ke(o,l)}if(r.includes("throttle")){let c=r[r.indexOf("throttle")+1]||"invalid-wait",l=tt(c.split("ms")[0])?Number(c.split("ms")[0]):250;o=He(o,l)}return r.includes("prevent")&&(o=a(o,(c,l)=>{l.preventDefault(),c(l)})),r.includes("stop")&&(o=a(o,(c,l)=>{l.stopPropagation(),c(l)})),r.includes("once")&&(o=a(o,(c,l)=>{c(l),i.removeEventListener(t,o,s)})),(r.includes("away")||r.includes("outside"))&&(i=document,o=a(o,(c,l)=>{e.contains(l.target)||l.target.isConnected!==!1&&(e.offsetWidth<1&&e.offsetHeight<1||e._x_isShown!==!1&&c(l))})),r.includes("self")&&(o=a(o,(c,l)=>{l.target===e&&c(l)})),(Ji(t)||wn(t))&&(o=a(o,(c,l)=>{Yi(l,r)||c(l)})),i.addEventListener(t,o,s),()=>{i.removeEventListener(t,o,s)}}function Ui(e){return e.replace(/-/g,".")}function Wi(e){return e.toLowerCase().replace(/-(\w)/g,(t,r)=>r.toUpperCase())}function tt(e){return!Array.isArray(e)&&!isNaN(e)}function Gi(e){return[" ","_"].includes(e)?e:e.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase()}function Ji(e){return["keydown","keyup"].includes(e)}function wn(e){return["contextmenu","click","mouse"].some(t=>e.includes(t))}function Yi(e,t){let r=t.filter(o=>!["window","document","prevent","stop","once","capture","self","away","outside","passive"].includes(o));if(r.includes("debounce")){let o=r.indexOf("debounce");r.splice(o,tt((r[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(r.includes("throttle")){let o=r.indexOf("throttle");r.splice(o,tt((r[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(r.length===0||r.length===1&&bn(e.key).includes(r[0]))return!1;let i=["ctrl","shift","alt","meta","cmd","super"].filter(o=>r.includes(o));return r=r.filter(o=>!i.includes(o)),!(i.length>0&&i.filter(s=>((s==="cmd"||s==="super")&&(s="meta"),e[`${s}Key`])).length===i.length&&(wn(e.type)||bn(e.key).includes(r[0])))}function bn(e){if(!e)return[];e=Gi(e);let t={ctrl:"control",slash:"/",space:" ",spacebar:" ",cmd:"meta",esc:"escape",up:"arrow-up",down:"arrow-down",left:"arrow-left",right:"arrow-right",period:".",comma:",",equal:"=",minus:"-",underscore:"_"};return t[e]=e,Object.keys(t).map(r=>{if(t[r]===e)return r}).filter(r=>r)}d("model",(e,{modifiers:t,expression:r},{effect:n,cleanup:i})=>{let o=e;t.includes("parent")&&(o=e.parentNode);let s=x(o,r),a;typeof r=="string"?a=x(o,`${r} = __placeholder`):typeof r=="function"&&typeof r()=="string"?a=x(o,`${r()} = __placeholder`):a=()=>{};let c=()=>{let h;return s(w=>h=w),En(h)?h.get():h},l=h=>{let w;s(F=>w=F),En(w)?w.set(h):a(()=>{},{scope:{__placeholder:h}})};typeof r=="string"&&e.type==="radio"&&m(()=>{e.hasAttribute("name")||e.setAttribute("name",r)});var u=e.tagName.toLowerCase()==="select"||["checkbox","radio"].includes(e.type)||t.includes("lazy")?"change":"input";let p=I?()=>{}:ae(e,u,t,h=>{l(Kt(e,t,h,c()))});if(t.includes("fill")&&([void 0,null,""].includes(c())||ze(e)&&Array.isArray(c())||e.tagName.toLowerCase()==="select"&&e.multiple)&&l(Kt(e,t,{target:e},c())),e._x_removeModelListeners||(e._x_removeModelListeners={}),e._x_removeModelListeners.default=p,i(()=>e._x_removeModelListeners.default()),e.form){let h=ae(e.form,"reset",[],w=>{ie(()=>e._x_model&&e._x_model.set(Kt(e,t,{target:e},c())))});i(()=>h())}e._x_model={get(){return c()},set(h){l(h)}},e._x_forceModelUpdate=h=>{h===void 0&&typeof r=="string"&&r.match(/\./)&&(h=""),window.fromModel=!0,m(()=>ge(e,"value",h)),delete window.fromModel},n(()=>{let h=c();t.includes("unintrusive")&&document.activeElement.isSameNode(e)||e._x_forceModelUpdate(h)})});function Kt(e,t,r,n){return m(()=>{if(r instanceof CustomEvent&&r.detail!==void 0)return r.detail!==null&&r.detail!==void 0?r.detail:r.target.value;if(ze(e))if(Array.isArray(n)){let i=null;return t.includes("number")?i=Ht(r.target.value):t.includes("boolean")?i=xe(r.target.value):i=r.target.value,r.target.checked?n.includes(i)?n:n.concat([i]):n.filter(o=>!Xi(o,i))}else return r.target.checked;else{if(e.tagName.toLowerCase()==="select"&&e.multiple)return t.includes("number")?Array.from(r.target.selectedOptions).map(i=>{let o=i.value||i.text;return Ht(o)}):t.includes("boolean")?Array.from(r.target.selectedOptions).map(i=>{let o=i.value||i.text;return xe(o)}):Array.from(r.target.selectedOptions).map(i=>i.value||i.text);{let i;return Ot(e)?r.target.checked?i=r.target.value:i=n:i=r.target.value,t.includes("number")?Ht(i):t.includes("boolean")?xe(i):t.includes("trim")?i.trim():i}}})}function Ht(e){let t=e?parseFloat(e):null;return Zi(t)?t:e}function Xi(e,t){return e==t}function Zi(e){return!Array.isArray(e)&&!isNaN(e)}function En(e){return e!==null&&typeof e=="object"&&typeof e.get=="function"&&typeof e.set=="function"}d("cloak",e=>queueMicrotask(()=>m(()=>e.removeAttribute(C("cloak")))));$e(()=>`[${C("init")}]`);d("init",A((e,{expression:t},{evaluate:r})=>typeof t=="string"?!!t.trim()&&r(t,{},!1):r(t,{},!1)));d("text",(e,{expression:t},{effect:r,evaluateLater:n})=>{let i=n(t);r(()=>{i(o=>{m(()=>{e.textContent=o})})})});d("html",(e,{expression:t},{effect:r,evaluateLater:n})=>{let i=n(t);r(()=>{i(o=>{m(()=>{e.innerHTML=o,e._x_ignoreSelf=!0,S(e),delete e._x_ignoreSelf})})})});ne(Pe(":",Ie(C("bind:"))));var vn=(e,{value:t,modifiers:r,expression:n,original:i},{effect:o,cleanup:s})=>{if(!t){let c={};qr(c),x(e,n)(u=>{Tt(e,u,i)},{scope:c});return}if(t==="key")return Qi(e,n);if(e._x_inlineBindings&&e._x_inlineBindings[t]&&e._x_inlineBindings[t].extract)return;let a=x(e,n);o(()=>a(c=>{c===void 0&&typeof n=="string"&&n.match(/\./)&&(c=""),m(()=>ge(e,t,c,r))})),s(()=>{e._x_undoAddedClasses&&e._x_undoAddedClasses(),e._x_undoAddedStyles&&e._x_undoAddedStyles()})};vn.inline=(e,{value:t,modifiers:r,expression:n})=>{t&&(e._x_inlineBindings||(e._x_inlineBindings={}),e._x_inlineBindings[t]={expression:n,extract:!1})};d("bind",vn);function Qi(e,t){e._x_keyExpression=t}Le(()=>`[${C("data")}]`);d("data",(e,{expression:t},{cleanup:r})=>{if(eo(e))return;t=t===""?"{}":t;let n={};fe(n,e);let i={};Gr(i,n);let o=R(e,t,{scope:i});(o===void 0||o===!0)&&(o={}),fe(o,e);let s=T(o);Te(s);let a=k(e,s);s.init&&R(e,s.init),r(()=>{s.destroy&&R(e,s.destroy),a()})});H((e,t)=>{e._x_dataStack&&(t._x_dataStack=e._x_dataStack,t.setAttribute("data-has-alpine-state",!0))});function eo(e){return I?Be?!0:e.hasAttribute("data-has-alpine-state"):!1}d("show",(e,{modifiers:t,expression:r},{effect:n})=>{let i=x(e,r);e._x_doHide||(e._x_doHide=()=>{m(()=>{e.style.setProperty("display","none",t.includes("important")?"important":void 0)})}),e._x_doShow||(e._x_doShow=()=>{m(()=>{e.style.length===1&&e.style.display==="none"?e.removeAttribute("style"):e.style.removeProperty("display")})});let o=()=>{e._x_doHide(),e._x_isShown=!1},s=()=>{e._x_doShow(),e._x_isShown=!0},a=()=>setTimeout(s),c=he(p=>p?s():o(),p=>{typeof e._x_toggleAndCascadeWithTransitions=="function"?e._x_toggleAndCascadeWithTransitions(e,p,s,o):p?a():o()}),l,u=!0;n(()=>i(p=>{!u&&p===l||(t.includes("immediate")&&(p?a():o()),c(p),l=p,u=!1)}))});d("for",(e,{expression:t},{effect:r,cleanup:n})=>{let i=ro(t),o=x(e,i.items),s=x(e,e._x_keyExpression||"index");e._x_prevKeys=[],e._x_lookup={},r(()=>to(e,i,o,s)),n(()=>{Object.values(e._x_lookup).forEach(a=>m(()=>{P(a),a.remove()})),delete e._x_prevKeys,delete e._x_lookup})});function to(e,t,r,n){let i=s=>typeof s=="object"&&!Array.isArray(s),o=e;r(s=>{no(s)&&s>=0&&(s=Array.from(Array(s).keys(),f=>f+1)),s===void 0&&(s=[]);let a=e._x_lookup,c=e._x_prevKeys,l=[],u=[];if(i(s))s=Object.entries(s).map(([f,g])=>{let b=Sn(t,g,f,s);n(v=>{u.includes(v)&&E("Duplicate key on x-for",e),u.push(v)},{scope:{index:f,...b}}),l.push(b)});else for(let f=0;f<s.length;f++){let g=Sn(t,s[f],f,s);n(b=>{u.includes(b)&&E("Duplicate key on x-for",e),u.push(b)},{scope:{index:f,...g}}),l.push(g)}let p=[],h=[],w=[],F=[];for(let f=0;f<c.length;f++){let g=c[f];u.indexOf(g)===-1&&w.push(g)}c=c.filter(f=>!w.includes(f));let Ee="template";for(let f=0;f<u.length;f++){let g=u[f],b=c.indexOf(g);if(b===-1)c.splice(f,0,g),p.push([Ee,f]);else if(b!==f){let v=c.splice(f,1)[0],O=c.splice(b-1,1)[0];c.splice(f,0,O),c.splice(b,0,v),h.push([v,O])}else F.push(g);Ee=g}for(let f=0;f<w.length;f++){let g=w[f];g in a&&(m(()=>{P(a[g]),a[g].remove()}),delete a[g])}for(let f=0;f<h.length;f++){let[g,b]=h[f],v=a[g],O=a[b],ee=document.createElement("div");m(()=>{O||E('x-for ":key" is undefined or invalid',o,b,a),O.after(ee),v.after(O),O._x_currentIfEl&&O.after(O._x_currentIfEl),ee.before(v),v._x_currentIfEl&&v.after(v._x_currentIfEl),ee.remove()}),O._x_refreshXForScope(l[u.indexOf(b)])}for(let f=0;f<p.length;f++){let[g,b]=p[f],v=g==="template"?o:a[g];v._x_currentIfEl&&(v=v._x_currentIfEl);let O=l[b],ee=u[b],ce=document.importNode(o.content,!0).firstElementChild,qt=T(O);k(ce,qt,o),ce._x_refreshXForScope=On=>{Object.entries(On).forEach(([Cn,Tn])=>{qt[Cn]=Tn})},m(()=>{v.after(ce),A(()=>S(ce))()}),typeof ee=="object"&&E("x-for key cannot be an object, it must be a string or an integer",o),a[ee]=ce}for(let f=0;f<F.length;f++)a[F[f]]._x_refreshXForScope(l[u.indexOf(F[f])]);o._x_prevKeys=u})}function ro(e){let t=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,r=/^\s*\(|\)\s*$/g,n=/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/,i=e.match(n);if(!i)return;let o={};o.items=i[2].trim();let s=i[1].replace(r,"").trim(),a=s.match(t);return a?(o.item=s.replace(t,"").trim(),o.index=a[1].trim(),a[2]&&(o.collection=a[2].trim())):o.item=s,o}function Sn(e,t,r,n){let i={};return/^\[.*\]$/.test(e.item)&&Array.isArray(t)?e.item.replace("[","").replace("]","").split(",").map(s=>s.trim()).forEach((s,a)=>{i[s]=t[a]}):/^\{.*\}$/.test(e.item)&&!Array.isArray(t)&&typeof t=="object"?e.item.replace("{","").replace("}","").split(",").map(s=>s.trim()).forEach(s=>{i[s]=t[s]}):i[e.item]=t,e.index&&(i[e.index]=r),e.collection&&(i[e.collection]=n),i}function no(e){return!Array.isArray(e)&&!isNaN(e)}function An(){}An.inline=(e,{expression:t},{cleanup:r})=>{let n=Y(e);n._x_refs||(n._x_refs={}),n._x_refs[t]=e,r(()=>delete n._x_refs[t])};d("ref",An);d("if",(e,{expression:t},{effect:r,cleanup:n})=>{e.tagName.toLowerCase()!=="template"&&E("x-if can only be used on a <template> tag",e);let i=x(e,t),o=()=>{if(e._x_currentIfEl)return e._x_currentIfEl;let a=e.content.cloneNode(!0).firstElementChild;return k(a,{},e),m(()=>{e.after(a),A(()=>S(a))()}),e._x_currentIfEl=a,e._x_undoIf=()=>{m(()=>{P(a),a.remove()}),delete e._x_currentIfEl},a},s=()=>{e._x_undoIf&&(e._x_undoIf(),delete e._x_undoIf)};r(()=>i(a=>{a?o():s()})),n(()=>e._x_undoIf&&e._x_undoIf())});d("id",(e,{expression:t},{evaluate:r})=>{r(t).forEach(i=>_n(e,i))});H((e,t)=>{e._x_ids&&(t._x_ids=e._x_ids)});ne(Pe("@",Ie(C("on:"))));d("on",A((e,{value:t,modifiers:r,expression:n},{cleanup:i})=>{let o=n?x(e,n):()=>{};e.tagName.toLowerCase()==="template"&&(e._x_forwardEvents||(e._x_forwardEvents=[]),e._x_forwardEvents.includes(t)||e._x_forwardEvents.push(t));let s=ae(e,t,r,a=>{o(()=>{},{scope:{$event:a},params:[a]})});i(()=>s())}));rt("Collapse","collapse","collapse");rt("Intersect","intersect","intersect");rt("Focus","trap","focus");rt("Mask","mask","mask");function rt(e,t,r){d(t,n=>E(`You can't use [x-${t}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${r}`,n))}K.setEvaluator(xt);K.setReactivityEngine({reactive:et,effect:rn,release:nn,raw:_});var Vt=K;window.Alpine=Vt;queueMicrotask(()=>{Vt.start()});})();
diff --git a/static/vendor/htmx.min.js b/static/vendor/htmx.min.js
new file mode 100644
index 0000000..47eb70f
--- /dev/null
+++ b/static/vendor/htmx.min.js
@@ -0,0 +1 @@
+(function(e,t){if(typeof define==="function"&&define.amd){define([],t)}else if(typeof module==="object"&&module.exports){module.exports=t()}else{e.htmx=e.htmx||t()}})(typeof self!=="undefined"?self:this,function(){return function(){"use strict";var Q={onLoad:F,process:zt,on:de,off:ge,trigger:ce,ajax:Nr,find:C,findAll:f,closest:v,values:function(e,t){var r=dr(e,t||"post");return r.values},remove:_,addClass:z,removeClass:n,toggleClass:$,takeClass:W,defineExtension:Ur,removeExtension:Br,logAll:V,logNone:j,logger:null,config:{historyEnabled:true,historyCacheSize:10,refreshOnHistoryMiss:false,defaultSwapStyle:"innerHTML",defaultSwapDelay:0,defaultSettleDelay:20,includeIndicatorStyles:true,indicatorClass:"htmx-indicator",requestClass:"htmx-request",addedClass:"htmx-added",settlingClass:"htmx-settling",swappingClass:"htmx-swapping",allowEval:true,allowScriptTags:true,inlineScriptNonce:"",attributesToSettle:["class","style","width","height"],withCredentials:false,timeout:0,wsReconnectDelay:"full-jitter",wsBinaryType:"blob",disableSelector:"[hx-disable], [data-hx-disable]",useTemplateFragments:false,scrollBehavior:"smooth",defaultFocusScroll:false,getCacheBusterParam:false,globalViewTransitions:false,methodsThatUseUrlParams:["get"],selfRequestsOnly:false,ignoreTitle:false,scrollIntoViewOnBoost:true,triggerSpecsCache:null},parseInterval:d,_:t,createEventSource:function(e){return new EventSource(e,{withCredentials:true})},createWebSocket:function(e){var t=new WebSocket(e,[]);t.binaryType=Q.config.wsBinaryType;return t},version:"1.9.10"};var r={addTriggerHandler:Lt,bodyContains:se,canAccessLocalStorage:U,findThisElement:xe,filterValues:yr,hasAttribute:o,getAttributeValue:te,getClosestAttributeValue:ne,getClosestMatch:c,getExpressionVars:Hr,getHeaders:xr,getInputValues:dr,getInternalData:ae,getSwapSpecification:wr,getTriggerSpecs:it,getTarget:ye,makeFragment:l,mergeObjects:le,makeSettleInfo:T,oobSwap:Ee,querySelectorExt:ue,selectAndSwap:je,settleImmediately:nr,shouldCancel:ut,triggerEvent:ce,triggerErrorEvent:fe,withExtensions:R};var w=["get","post","put","delete","patch"];var i=w.map(function(e){return"[hx-"+e+"], [data-hx-"+e+"]"}).join(", ");var S=e("head"),q=e("title"),H=e("svg",true);function e(e,t=false){return new RegExp(`<${e}(\\s[^>]*>|>)([\\s\\S]*?)<\\/${e}>`,t?"gim":"im")}function d(e){if(e==undefined){return undefined}let t=NaN;if(e.slice(-2)=="ms"){t=parseFloat(e.slice(0,-2))}else if(e.slice(-1)=="s"){t=parseFloat(e.slice(0,-1))*1e3}else if(e.slice(-1)=="m"){t=parseFloat(e.slice(0,-1))*1e3*60}else{t=parseFloat(e)}return isNaN(t)?undefined:t}function ee(e,t){return e.getAttribute&&e.getAttribute(t)}function o(e,t){return e.hasAttribute&&(e.hasAttribute(t)||e.hasAttribute("data-"+t))}function te(e,t){return ee(e,t)||ee(e,"data-"+t)}function u(e){return e.parentElement}function re(){return document}function c(e,t){while(e&&!t(e)){e=u(e)}return e?e:null}function L(e,t,r){var n=te(t,r);var i=te(t,"hx-disinherit");if(e!==t&&i&&(i==="*"||i.split(" ").indexOf(r)>=0)){return"unset"}else{return n}}function ne(t,r){var n=null;c(t,function(e){return n=L(t,e,r)});if(n!=="unset"){return n}}function h(e,t){var r=e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.webkitMatchesSelector||e.oMatchesSelector;return r&&r.call(e,t)}function A(e){var t=/<([a-z][^\/\0>\x20\t\r\n\f]*)/i;var r=t.exec(e);if(r){return r[1].toLowerCase()}else{return""}}function a(e,t){var r=new DOMParser;var n=r.parseFromString(e,"text/html");var i=n.body;while(t>0){t--;i=i.firstChild}if(i==null){i=re().createDocumentFragment()}return i}function N(e){return/<body/.test(e)}function l(e){var t=!N(e);var r=A(e);var n=e;if(r==="head"){n=n.replace(S,"")}if(Q.config.useTemplateFragments&&t){var i=a("<body><template>"+n+"</template></body>",0);return i.querySelector("template").content}switch(r){case"thead":case"tbody":case"tfoot":case"colgroup":case"caption":return a("<table>"+n+"</table>",1);case"col":return a("<table><colgroup>"+n+"</colgroup></table>",2);case"tr":return a("<table><tbody>"+n+"</tbody></table>",2);case"td":case"th":return a("<table><tbody><tr>"+n+"</tr></tbody></table>",3);case"script":case"style":return a("<div>"+n+"</div>",1);default:return a(n,0)}}function ie(e){if(e){e()}}function I(e,t){return Object.prototype.toString.call(e)==="[object "+t+"]"}function k(e){return I(e,"Function")}function P(e){return I(e,"Object")}function ae(e){var t="htmx-internal-data";var r=e[t];if(!r){r=e[t]={}}return r}function M(e){var t=[];if(e){for(var r=0;r<e.length;r++){t.push(e[r])}}return t}function oe(e,t){if(e){for(var r=0;r<e.length;r++){t(e[r])}}}function X(e){var t=e.getBoundingClientRect();var r=t.top;var n=t.bottom;return r<window.innerHeight&&n>=0}function se(e){if(e.getRootNode&&e.getRootNode()instanceof window.ShadowRoot){return re().body.contains(e.getRootNode().host)}else{return re().body.contains(e)}}function D(e){return e.trim().split(/\s+/)}function le(e,t){for(var r in t){if(t.hasOwnProperty(r)){e[r]=t[r]}}return e}function E(e){try{return JSON.parse(e)}catch(e){b(e);return null}}function U(){var e="htmx:localStorageTest";try{localStorage.setItem(e,e);localStorage.removeItem(e);return true}catch(e){return false}}function B(t){try{var e=new URL(t);if(e){t=e.pathname+e.search}if(!/^\/$/.test(t)){t=t.replace(/\/+$/,"")}return t}catch(e){return t}}function t(e){return Tr(re().body,function(){return eval(e)})}function F(t){var e=Q.on("htmx:load",function(e){t(e.detail.elt)});return e}function V(){Q.logger=function(e,t,r){if(console){console.log(t,e,r)}}}function j(){Q.logger=null}function C(e,t){if(t){return e.querySelector(t)}else{return C(re(),e)}}function f(e,t){if(t){return e.querySelectorAll(t)}else{return f(re(),e)}}function _(e,t){e=g(e);if(t){setTimeout(function(){_(e);e=null},t)}else{e.parentElement.removeChild(e)}}function z(e,t,r){e=g(e);if(r){setTimeout(function(){z(e,t);e=null},r)}else{e.classList&&e.classList.add(t)}}function n(e,t,r){e=g(e);if(r){setTimeout(function(){n(e,t);e=null},r)}else{if(e.classList){e.classList.remove(t);if(e.classList.length===0){e.removeAttribute("class")}}}}function $(e,t){e=g(e);e.classList.toggle(t)}function W(e,t){e=g(e);oe(e.parentElement.children,function(e){n(e,t)});z(e,t)}function v(e,t){e=g(e);if(e.closest){return e.closest(t)}else{do{if(e==null||h(e,t)){return e}}while(e=e&&u(e));return null}}function s(e,t){return e.substring(0,t.length)===t}function G(e,t){return e.substring(e.length-t.length)===t}function J(e){var t=e.trim();if(s(t,"<")&&G(t,"/>")){return t.substring(1,t.length-2)}else{return t}}function Z(e,t){if(t.indexOf("closest ")===0){return[v(e,J(t.substr(8)))]}else if(t.indexOf("find ")===0){return[C(e,J(t.substr(5)))]}else if(t==="next"){return[e.nextElementSibling]}else if(t.indexOf("next ")===0){return[K(e,J(t.substr(5)))]}else if(t==="previous"){return[e.previousElementSibling]}else if(t.indexOf("previous ")===0){return[Y(e,J(t.substr(9)))]}else if(t==="document"){return[document]}else if(t==="window"){return[window]}else if(t==="body"){return[document.body]}else{return re().querySelectorAll(J(t))}}var K=function(e,t){var r=re().querySelectorAll(t);for(var n=0;n<r.length;n++){var i=r[n];if(i.compareDocumentPosition(e)===Node.DOCUMENT_POSITION_PRECEDING){return i}}};var Y=function(e,t){var r=re().querySelectorAll(t);for(var n=r.length-1;n>=0;n--){var i=r[n];if(i.compareDocumentPosition(e)===Node.DOCUMENT_POSITION_FOLLOWING){return i}}};function ue(e,t){if(t){return Z(e,t)[0]}else{return Z(re().body,e)[0]}}function g(e){if(I(e,"String")){return C(e)}else{return e}}function ve(e,t,r){if(k(t)){return{target:re().body,event:e,listener:t}}else{return{target:g(e),event:t,listener:r}}}function de(t,r,n){jr(function(){var e=ve(t,r,n);e.target.addEventListener(e.event,e.listener)});var e=k(r);return e?r:n}function ge(t,r,n){jr(function(){var e=ve(t,r,n);e.target.removeEventListener(e.event,e.listener)});return k(r)?r:n}var me=re().createElement("output");function pe(e,t){var r=ne(e,t);if(r){if(r==="this"){return[xe(e,t)]}else{var n=Z(e,r);if(n.length===0){b('The selector "'+r+'" on '+t+" returned no matches!");return[me]}else{return n}}}}function xe(e,t){return c(e,function(e){return te(e,t)!=null})}function ye(e){var t=ne(e,"hx-target");if(t){if(t==="this"){return xe(e,"hx-target")}else{return ue(e,t)}}else{var r=ae(e);if(r.boosted){return re().body}else{return e}}}function be(e){var t=Q.config.attributesToSettle;for(var r=0;r<t.length;r++){if(e===t[r]){return true}}return false}function we(t,r){oe(t.attributes,function(e){if(!r.hasAttribute(e.name)&&be(e.name)){t.removeAttribute(e.name)}});oe(r.attributes,function(e){if(be(e.name)){t.setAttribute(e.name,e.value)}})}function Se(e,t){var r=Fr(t);for(var n=0;n<r.length;n++){var i=r[n];try{if(i.isInlineSwap(e)){return true}}catch(e){b(e)}}return e==="outerHTML"}function Ee(e,i,a){var t="#"+ee(i,"id");var o="outerHTML";if(e==="true"){}else if(e.indexOf(":")>0){o=e.substr(0,e.indexOf(":"));t=e.substr(e.indexOf(":")+1,e.length)}else{o=e}var r=re().querySelectorAll(t);if(r){oe(r,function(e){var t;var r=i.cloneNode(true);t=re().createDocumentFragment();t.appendChild(r);if(!Se(o,e)){t=r}var n={shouldSwap:true,target:e,fragment:t};if(!ce(e,"htmx:oobBeforeSwap",n))return;e=n.target;if(n["shouldSwap"]){Fe(o,e,e,t,a)}oe(a.elts,function(e){ce(e,"htmx:oobAfterSwap",n)})});i.parentNode.removeChild(i)}else{i.parentNode.removeChild(i);fe(re().body,"htmx:oobErrorNoTarget",{content:i})}return e}function Ce(e,t,r){var n=ne(e,"hx-select-oob");if(n){var i=n.split(",");for(var a=0;a<i.length;a++){var o=i[a].split(":",2);var s=o[0].trim();if(s.indexOf("#")===0){s=s.substring(1)}var l=o[1]||"true";var u=t.querySelector("#"+s);if(u){Ee(l,u,r)}}}oe(f(t,"[hx-swap-oob], [data-hx-swap-oob]"),function(e){var t=te(e,"hx-swap-oob");if(t!=null){Ee(t,e,r)}})}function Re(e){oe(f(e,"[hx-preserve], [data-hx-preserve]"),function(e){var t=te(e,"id");var r=re().getElementById(t);if(r!=null){e.parentNode.replaceChild(r,e)}})}function Te(o,e,s){oe(e.querySelectorAll("[id]"),function(e){var t=ee(e,"id");if(t&&t.length>0){var r=t.replace("'","\\'");var n=e.tagName.replace(":","\\:");var i=o.querySelector(n+"[id='"+r+"']");if(i&&i!==o){var a=e.cloneNode();we(e,i);s.tasks.push(function(){we(e,a)})}}})}function Oe(e){return function(){n(e,Q.config.addedClass);zt(e);Nt(e);qe(e);ce(e,"htmx:load")}}function qe(e){var t="[autofocus]";var r=h(e,t)?e:e.querySelector(t);if(r!=null){r.focus()}}function m(e,t,r,n){Te(e,r,n);while(r.childNodes.length>0){var i=r.firstChild;z(i,Q.config.addedClass);e.insertBefore(i,t);if(i.nodeType!==Node.TEXT_NODE&&i.nodeType!==Node.COMMENT_NODE){n.tasks.push(Oe(i))}}}function He(e,t){var r=0;while(r<e.length){t=(t<<5)-t+e.charCodeAt(r++)|0}return t}function Le(e){var t=0;if(e.attributes){for(var r=0;r<e.attributes.length;r++){var n=e.attributes[r];if(n.value){t=He(n.name,t);t=He(n.value,t)}}}return t}function Ae(e){var t=ae(e);if(t.onHandlers){for(var r=0;r<t.onHandlers.length;r++){const n=t.onHandlers[r];e.removeEventListener(n.event,n.listener)}delete t.onHandlers}}function Ne(e){var t=ae(e);if(t.timeout){clearTimeout(t.timeout)}if(t.webSocket){t.webSocket.close()}if(t.sseEventSource){t.sseEventSource.close()}if(t.listenerInfos){oe(t.listenerInfos,function(e){if(e.on){e.on.removeEventListener(e.trigger,e.listener)}})}Ae(e);oe(Object.keys(t),function(e){delete t[e]})}function p(e){ce(e,"htmx:beforeCleanupElement");Ne(e);if(e.children){oe(e.children,function(e){p(e)})}}function Ie(t,e,r){if(t.tagName==="BODY"){return Ue(t,e,r)}else{var n;var i=t.previousSibling;m(u(t),t,e,r);if(i==null){n=u(t).firstChild}else{n=i.nextSibling}r.elts=r.elts.filter(function(e){return e!=t});while(n&&n!==t){if(n.nodeType===Node.ELEMENT_NODE){r.elts.push(n)}n=n.nextElementSibling}p(t);u(t).removeChild(t)}}function ke(e,t,r){return m(e,e.firstChild,t,r)}function Pe(e,t,r){return m(u(e),e,t,r)}function Me(e,t,r){return m(e,null,t,r)}function Xe(e,t,r){return m(u(e),e.nextSibling,t,r)}function De(e,t,r){p(e);return u(e).removeChild(e)}function Ue(e,t,r){var n=e.firstChild;m(e,n,t,r);if(n){while(n.nextSibling){p(n.nextSibling);e.removeChild(n.nextSibling)}p(n);e.removeChild(n)}}function Be(e,t,r){var n=r||ne(e,"hx-select");if(n){var i=re().createDocumentFragment();oe(t.querySelectorAll(n),function(e){i.appendChild(e)});t=i}return t}function Fe(e,t,r,n,i){switch(e){case"none":return;case"outerHTML":Ie(r,n,i);return;case"afterbegin":ke(r,n,i);return;case"beforebegin":Pe(r,n,i);return;case"beforeend":Me(r,n,i);return;case"afterend":Xe(r,n,i);return;case"delete":De(r,n,i);return;default:var a=Fr(t);for(var o=0;o<a.length;o++){var s=a[o];try{var l=s.handleSwap(e,r,n,i);if(l){if(typeof l.length!=="undefined"){for(var u=0;u<l.length;u++){var f=l[u];if(f.nodeType!==Node.TEXT_NODE&&f.nodeType!==Node.COMMENT_NODE){i.tasks.push(Oe(f))}}}return}}catch(e){b(e)}}if(e==="innerHTML"){Ue(r,n,i)}else{Fe(Q.config.defaultSwapStyle,t,r,n,i)}}}function Ve(e){if(e.indexOf("<title")>-1){var t=e.replace(H,"");var r=t.match(q);if(r){return r[2]}}}function je(e,t,r,n,i,a){i.title=Ve(n);var o=l(n);if(o){Ce(r,o,i);o=Be(r,o,a);Re(o);return Fe(e,r,t,o,i)}}function _e(e,t,r){var n=e.getResponseHeader(t);if(n.indexOf("{")===0){var i=E(n);for(var a in i){if(i.hasOwnProperty(a)){var o=i[a];if(!P(o)){o={value:o}}ce(r,a,o)}}}else{var s=n.split(",");for(var l=0;l<s.length;l++){ce(r,s[l].trim(),[])}}}var ze=/\s/;var x=/[\s,]/;var $e=/[_$a-zA-Z]/;var We=/[_$a-zA-Z0-9]/;var Ge=['"',"'","/"];var Je=/[^\s]/;var Ze=/[{(]/;var Ke=/[})]/;function Ye(e){var t=[];var r=0;while(r<e.length){if($e.exec(e.charAt(r))){var n=r;while(We.exec(e.charAt(r+1))){r++}t.push(e.substr(n,r-n+1))}else if(Ge.indexOf(e.charAt(r))!==-1){var i=e.charAt(r);var n=r;r++;while(r<e.length&&e.charAt(r)!==i){if(e.charAt(r)==="\\"){r++}r++}t.push(e.substr(n,r-n+1))}else{var a=e.charAt(r);t.push(a)}r++}return t}function Qe(e,t,r){return $e.exec(e.charAt(0))&&e!=="true"&&e!=="false"&&e!=="this"&&e!==r&&t!=="."}function et(e,t,r){if(t[0]==="["){t.shift();var n=1;var i=" return (function("+r+"){ return (";var a=null;while(t.length>0){var o=t[0];if(o==="]"){n--;if(n===0){if(a===null){i=i+"true"}t.shift();i+=")})";try{var s=Tr(e,function(){return Function(i)()},function(){return true});s.source=i;return s}catch(e){fe(re().body,"htmx:syntax:error",{error:e,source:i});return null}}}else if(o==="["){n++}if(Qe(o,a,r)){i+="(("+r+"."+o+") ? ("+r+"."+o+") : (window."+o+"))"}else{i=i+o}a=t.shift()}}}function y(e,t){var r="";while(e.length>0&&!t.test(e[0])){r+=e.shift()}return r}function tt(e){var t;if(e.length>0&&Ze.test(e[0])){e.shift();t=y(e,Ke).trim();e.shift()}else{t=y(e,x)}return t}var rt="input, textarea, select";function nt(e,t,r){var n=[];var i=Ye(t);do{y(i,Je);var a=i.length;var o=y(i,/[,\[\s]/);if(o!==""){if(o==="every"){var s={trigger:"every"};y(i,Je);s.pollInterval=d(y(i,/[,\[\s]/));y(i,Je);var l=et(e,i,"event");if(l){s.eventFilter=l}n.push(s)}else if(o.indexOf("sse:")===0){n.push({trigger:"sse",sseEvent:o.substr(4)})}else{var u={trigger:o};var l=et(e,i,"event");if(l){u.eventFilter=l}while(i.length>0&&i[0]!==","){y(i,Je);var f=i.shift();if(f==="changed"){u.changed=true}else if(f==="once"){u.once=true}else if(f==="consume"){u.consume=true}else if(f==="delay"&&i[0]===":"){i.shift();u.delay=d(y(i,x))}else if(f==="from"&&i[0]===":"){i.shift();if(Ze.test(i[0])){var c=tt(i)}else{var c=y(i,x);if(c==="closest"||c==="find"||c==="next"||c==="previous"){i.shift();var h=tt(i);if(h.length>0){c+=" "+h}}}u.from=c}else if(f==="target"&&i[0]===":"){i.shift();u.target=tt(i)}else if(f==="throttle"&&i[0]===":"){i.shift();u.throttle=d(y(i,x))}else if(f==="queue"&&i[0]===":"){i.shift();u.queue=y(i,x)}else if(f==="root"&&i[0]===":"){i.shift();u[f]=tt(i)}else if(f==="threshold"&&i[0]===":"){i.shift();u[f]=y(i,x)}else{fe(e,"htmx:syntax:error",{token:i.shift()})}}n.push(u)}}if(i.length===a){fe(e,"htmx:syntax:error",{token:i.shift()})}y(i,Je)}while(i[0]===","&&i.shift());if(r){r[t]=n}return n}function it(e){var t=te(e,"hx-trigger");var r=[];if(t){var n=Q.config.triggerSpecsCache;r=n&&n[t]||nt(e,t,n)}if(r.length>0){return r}else if(h(e,"form")){return[{trigger:"submit"}]}else if(h(e,'input[type="button"], input[type="submit"]')){return[{trigger:"click"}]}else if(h(e,rt)){return[{trigger:"change"}]}else{return[{trigger:"click"}]}}function at(e){ae(e).cancelled=true}function ot(e,t,r){var n=ae(e);n.timeout=setTimeout(function(){if(se(e)&&n.cancelled!==true){if(!ct(r,e,Wt("hx:poll:trigger",{triggerSpec:r,target:e}))){t(e)}ot(e,t,r)}},r.pollInterval)}function st(e){return location.hostname===e.hostname&&ee(e,"href")&&ee(e,"href").indexOf("#")!==0}function lt(t,r,e){if(t.tagName==="A"&&st(t)&&(t.target===""||t.target==="_self")||t.tagName==="FORM"){r.boosted=true;var n,i;if(t.tagName==="A"){n="get";i=ee(t,"href")}else{var a=ee(t,"method");n=a?a.toLowerCase():"get";if(n==="get"){}i=ee(t,"action")}e.forEach(function(e){ht(t,function(e,t){if(v(e,Q.config.disableSelector)){p(e);return}he(n,i,e,t)},r,e,true)})}}function ut(e,t){if(e.type==="submit"||e.type==="click"){if(t.tagName==="FORM"){return true}if(h(t,'input[type="submit"], button')&&v(t,"form")!==null){return true}if(t.tagName==="A"&&t.href&&(t.getAttribute("href")==="#"||t.getAttribute("href").indexOf("#")!==0)){return true}}return false}function ft(e,t){return ae(e).boosted&&e.tagName==="A"&&t.type==="click"&&(t.ctrlKey||t.metaKey)}function ct(e,t,r){var n=e.eventFilter;if(n){try{return n.call(t,r)!==true}catch(e){fe(re().body,"htmx:eventFilter:error",{error:e,source:n.source});return true}}return false}function ht(a,o,e,s,l){var u=ae(a);var t;if(s.from){t=Z(a,s.from)}else{t=[a]}if(s.changed){t.forEach(function(e){var t=ae(e);t.lastValue=e.value})}oe(t,function(n){var i=function(e){if(!se(a)){n.removeEventListener(s.trigger,i);return}if(ft(a,e)){return}if(l||ut(e,a)){e.preventDefault()}if(ct(s,a,e)){return}var t=ae(e);t.triggerSpec=s;if(t.handledFor==null){t.handledFor=[]}if(t.handledFor.indexOf(a)<0){t.handledFor.push(a);if(s.consume){e.stopPropagation()}if(s.target&&e.target){if(!h(e.target,s.target)){return}}if(s.once){if(u.triggeredOnce){return}else{u.triggeredOnce=true}}if(s.changed){var r=ae(n);if(r.lastValue===n.value){return}r.lastValue=n.value}if(u.delayed){clearTimeout(u.delayed)}if(u.throttle){return}if(s.throttle>0){if(!u.throttle){o(a,e);u.throttle=setTimeout(function(){u.throttle=null},s.throttle)}}else if(s.delay>0){u.delayed=setTimeout(function(){o(a,e)},s.delay)}else{ce(a,"htmx:trigger");o(a,e)}}};if(e.listenerInfos==null){e.listenerInfos=[]}e.listenerInfos.push({trigger:s.trigger,listener:i,on:n});n.addEventListener(s.trigger,i)})}var vt=false;var dt=null;function gt(){if(!dt){dt=function(){vt=true};window.addEventListener("scroll",dt);setInterval(function(){if(vt){vt=false;oe(re().querySelectorAll("[hx-trigger='revealed'],[data-hx-trigger='revealed']"),function(e){mt(e)})}},200)}}function mt(t){if(!o(t,"data-hx-revealed")&&X(t)){t.setAttribute("data-hx-revealed","true");var e=ae(t);if(e.initHash){ce(t,"revealed")}else{t.addEventListener("htmx:afterProcessNode",function(e){ce(t,"revealed")},{once:true})}}}function pt(e,t,r){var n=D(r);for(var i=0;i<n.length;i++){var a=n[i].split(/:(.+)/);if(a[0]==="connect"){xt(e,a[1],0)}if(a[0]==="send"){bt(e)}}}function xt(s,r,n){if(!se(s)){return}if(r.indexOf("/")==0){var e=location.hostname+(location.port?":"+location.port:"");if(location.protocol=="https:"){r="wss://"+e+r}else if(location.protocol=="http:"){r="ws://"+e+r}}var t=Q.createWebSocket(r);t.onerror=function(e){fe(s,"htmx:wsError",{error:e,socket:t});yt(s)};t.onclose=function(e){if([1006,1012,1013].indexOf(e.code)>=0){var t=wt(n);setTimeout(function(){xt(s,r,n+1)},t)}};t.onopen=function(e){n=0};ae(s).webSocket=t;t.addEventListener("message",function(e){if(yt(s)){return}var t=e.data;R(s,function(e){t=e.transformResponse(t,null,s)});var r=T(s);var n=l(t);var i=M(n.children);for(var a=0;a<i.length;a++){var o=i[a];Ee(te(o,"hx-swap-oob")||"true",o,r)}nr(r.tasks)})}function yt(e){if(!se(e)){ae(e).webSocket.close();return true}}function bt(u){var f=c(u,function(e){return ae(e).webSocket!=null});if(f){u.addEventListener(it(u)[0].trigger,function(e){var t=ae(f).webSocket;var r=xr(u,f);var n=dr(u,"post");var i=n.errors;var a=n.values;var o=Hr(u);var s=le(a,o);var l=yr(s,u);l["HEADERS"]=r;if(i&&i.length>0){ce(u,"htmx:validation:halted",i);return}t.send(JSON.stringify(l));if(ut(e,u)){e.preventDefault()}})}else{fe(u,"htmx:noWebSocketSourceError")}}function wt(e){var t=Q.config.wsReconnectDelay;if(typeof t==="function"){return t(e)}if(t==="full-jitter"){var r=Math.min(e,6);var n=1e3*Math.pow(2,r);return n*Math.random()}b('htmx.config.wsReconnectDelay must either be a function or the string "full-jitter"')}function St(e,t,r){var n=D(r);for(var i=0;i<n.length;i++){var a=n[i].split(/:(.+)/);if(a[0]==="connect"){Et(e,a[1])}if(a[0]==="swap"){Ct(e,a[1])}}}function Et(t,e){var r=Q.createEventSource(e);r.onerror=function(e){fe(t,"htmx:sseError",{error:e,source:r});Tt(t)};ae(t).sseEventSource=r}function Ct(a,o){var s=c(a,Ot);if(s){var l=ae(s).sseEventSource;var u=function(e){if(Tt(s)){return}if(!se(a)){l.removeEventListener(o,u);return}var t=e.data;R(a,function(e){t=e.transformResponse(t,null,a)});var r=wr(a);var n=ye(a);var i=T(a);je(r.swapStyle,n,a,t,i);nr(i.tasks);ce(a,"htmx:sseMessage",e)};ae(a).sseListener=u;l.addEventListener(o,u)}else{fe(a,"htmx:noSSESourceError")}}function Rt(e,t,r){var n=c(e,Ot);if(n){var i=ae(n).sseEventSource;var a=function(){if(!Tt(n)){if(se(e)){t(e)}else{i.removeEventListener(r,a)}}};ae(e).sseListener=a;i.addEventListener(r,a)}else{fe(e,"htmx:noSSESourceError")}}function Tt(e){if(!se(e)){ae(e).sseEventSource.close();return true}}function Ot(e){return ae(e).sseEventSource!=null}function qt(e,t,r,n){var i=function(){if(!r.loaded){r.loaded=true;t(e)}};if(n>0){setTimeout(i,n)}else{i()}}function Ht(t,i,e){var a=false;oe(w,function(r){if(o(t,"hx-"+r)){var n=te(t,"hx-"+r);a=true;i.path=n;i.verb=r;e.forEach(function(e){Lt(t,e,i,function(e,t){if(v(e,Q.config.disableSelector)){p(e);return}he(r,n,e,t)})})}});return a}function Lt(n,e,t,r){if(e.sseEvent){Rt(n,r,e.sseEvent)}else if(e.trigger==="revealed"){gt();ht(n,r,t,e);mt(n)}else if(e.trigger==="intersect"){var i={};if(e.root){i.root=ue(n,e.root)}if(e.threshold){i.threshold=parseFloat(e.threshold)}var a=new IntersectionObserver(function(e){for(var t=0;t<e.length;t++){var r=e[t];if(r.isIntersecting){ce(n,"intersect");break}}},i);a.observe(n);ht(n,r,t,e)}else if(e.trigger==="load"){if(!ct(e,n,Wt("load",{elt:n}))){qt(n,r,t,e.delay)}}else if(e.pollInterval>0){t.polling=true;ot(n,r,e)}else{ht(n,r,t,e)}}function At(e){if(Q.config.allowScriptTags&&(e.type==="text/javascript"||e.type==="module"||e.type==="")){var t=re().createElement("script");oe(e.attributes,function(e){t.setAttribute(e.name,e.value)});t.textContent=e.textContent;t.async=false;if(Q.config.inlineScriptNonce){t.nonce=Q.config.inlineScriptNonce}var r=e.parentElement;try{r.insertBefore(t,e)}catch(e){b(e)}finally{if(e.parentElement){e.parentElement.removeChild(e)}}}}function Nt(e){if(h(e,"script")){At(e)}oe(f(e,"script"),function(e){At(e)})}function It(e){var t=e.attributes;for(var r=0;r<t.length;r++){var n=t[r].name;if(s(n,"hx-on:")||s(n,"data-hx-on:")||s(n,"hx-on-")||s(n,"data-hx-on-")){return true}}return false}function kt(e){var t=null;var r=[];if(It(e)){r.push(e)}if(document.evaluate){var n=document.evaluate('.//*[@*[ starts-with(name(), "hx-on:") or starts-with(name(), "data-hx-on:") or'+' starts-with(name(), "hx-on-") or starts-with(name(), "data-hx-on-") ]]',e);while(t=n.iterateNext())r.push(t)}else{var i=e.getElementsByTagName("*");for(var a=0;a<i.length;a++){if(It(i[a])){r.push(i[a])}}}return r}function Pt(e){if(e.querySelectorAll){var t=", [hx-boost] a, [data-hx-boost] a, a[hx-boost], a[data-hx-boost]";var r=e.querySelectorAll(i+t+", form, [type='submit'], [hx-sse], [data-hx-sse], [hx-ws],"+" [data-hx-ws], [hx-ext], [data-hx-ext], [hx-trigger], [data-hx-trigger], [hx-on], [data-hx-on]");return r}else{return[]}}function Mt(e){var t=v(e.target,"button, input[type='submit']");var r=Dt(e);if(r){r.lastButtonClicked=t}}function Xt(e){var t=Dt(e);if(t){t.lastButtonClicked=null}}function Dt(e){var t=v(e.target,"button, input[type='submit']");if(!t){return}var r=g("#"+ee(t,"form"))||v(t,"form");if(!r){return}return ae(r)}function Ut(e){e.addEventListener("click",Mt);e.addEventListener("focusin",Mt);e.addEventListener("focusout",Xt)}function Bt(e){var t=Ye(e);var r=0;for(var n=0;n<t.length;n++){const i=t[n];if(i==="{"){r++}else if(i==="}"){r--}}return r}function Ft(t,e,r){var n=ae(t);if(!Array.isArray(n.onHandlers)){n.onHandlers=[]}var i;var a=function(e){return Tr(t,function(){if(!i){i=new Function("event",r)}i.call(t,e)})};t.addEventListener(e,a);n.onHandlers.push({event:e,listener:a})}function Vt(e){var t=te(e,"hx-on");if(t){var r={};var n=t.split("\n");var i=null;var a=0;while(n.length>0){var o=n.shift();var s=o.match(/^\s*([a-zA-Z:\-\.]+:)(.*)/);if(a===0&&s){o.split(":");i=s[1].slice(0,-1);r[i]=s[2]}else{r[i]+=o}a+=Bt(o)}for(var l in r){Ft(e,l,r[l])}}}function jt(e){Ae(e);for(var t=0;t<e.attributes.length;t++){var r=e.attributes[t].name;var n=e.attributes[t].value;if(s(r,"hx-on")||s(r,"data-hx-on")){var i=r.indexOf("-on")+3;var a=r.slice(i,i+1);if(a==="-"||a===":"){var o=r.slice(i+1);if(s(o,":")){o="htmx"+o}else if(s(o,"-")){o="htmx:"+o.slice(1)}else if(s(o,"htmx-")){o="htmx:"+o.slice(5)}Ft(e,o,n)}}}}function _t(t){if(v(t,Q.config.disableSelector)){p(t);return}var r=ae(t);if(r.initHash!==Le(t)){Ne(t);r.initHash=Le(t);Vt(t);ce(t,"htmx:beforeProcessNode");if(t.value){r.lastValue=t.value}var e=it(t);var n=Ht(t,r,e);if(!n){if(ne(t,"hx-boost")==="true"){lt(t,r,e)}else if(o(t,"hx-trigger")){e.forEach(function(e){Lt(t,e,r,function(){})})}}if(t.tagName==="FORM"||ee(t,"type")==="submit"&&o(t,"form")){Ut(t)}var i=te(t,"hx-sse");if(i){St(t,r,i)}var a=te(t,"hx-ws");if(a){pt(t,r,a)}ce(t,"htmx:afterProcessNode")}}function zt(e){e=g(e);if(v(e,Q.config.disableSelector)){p(e);return}_t(e);oe(Pt(e),function(e){_t(e)});oe(kt(e),jt)}function $t(e){return e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()}function Wt(e,t){var r;if(window.CustomEvent&&typeof window.CustomEvent==="function"){r=new CustomEvent(e,{bubbles:true,cancelable:true,detail:t})}else{r=re().createEvent("CustomEvent");r.initCustomEvent(e,true,true,t)}return r}function fe(e,t,r){ce(e,t,le({error:t},r))}function Gt(e){return e==="htmx:afterProcessNode"}function R(e,t){oe(Fr(e),function(e){try{t(e)}catch(e){b(e)}})}function b(e){if(console.error){console.error(e)}else if(console.log){console.log("ERROR: ",e)}}function ce(e,t,r){e=g(e);if(r==null){r={}}r["elt"]=e;var n=Wt(t,r);if(Q.logger&&!Gt(t)){Q.logger(e,t,r)}if(r.error){b(r.error);ce(e,"htmx:error",{errorInfo:r})}var i=e.dispatchEvent(n);var a=$t(t);if(i&&a!==t){var o=Wt(a,n.detail);i=i&&e.dispatchEvent(o)}R(e,function(e){i=i&&(e.onEvent(t,n)!==false&&!n.defaultPrevented)});return i}var Jt=location.pathname+location.search;function Zt(){var e=re().querySelector("[hx-history-elt],[data-hx-history-elt]");return e||re().body}function Kt(e,t,r,n){if(!U()){return}if(Q.config.historyCacheSize<=0){localStorage.removeItem("htmx-history-cache");return}e=B(e);var i=E(localStorage.getItem("htmx-history-cache"))||[];for(var a=0;a<i.length;a++){if(i[a].url===e){i.splice(a,1);break}}var o={url:e,content:t,title:r,scroll:n};ce(re().body,"htmx:historyItemCreated",{item:o,cache:i});i.push(o);while(i.length>Q.config.historyCacheSize){i.shift()}while(i.length>0){try{localStorage.setItem("htmx-history-cache",JSON.stringify(i));break}catch(e){fe(re().body,"htmx:historyCacheError",{cause:e,cache:i});i.shift()}}}function Yt(e){if(!U()){return null}e=B(e);var t=E(localStorage.getItem("htmx-history-cache"))||[];for(var r=0;r<t.length;r++){if(t[r].url===e){return t[r]}}return null}function Qt(e){var t=Q.config.requestClass;var r=e.cloneNode(true);oe(f(r,"."+t),function(e){n(e,t)});return r.innerHTML}function er(){var e=Zt();var t=Jt||location.pathname+location.search;var r;try{r=re().querySelector('[hx-history="false" i],[data-hx-history="false" i]')}catch(e){r=re().querySelector('[hx-history="false"],[data-hx-history="false"]')}if(!r){ce(re().body,"htmx:beforeHistorySave",{path:t,historyElt:e});Kt(t,Qt(e),re().title,window.scrollY)}if(Q.config.historyEnabled)history.replaceState({htmx:true},re().title,window.location.href)}function tr(e){if(Q.config.getCacheBusterParam){e=e.replace(/org\.htmx\.cache-buster=[^&]*&?/,"");if(G(e,"&")||G(e,"?")){e=e.slice(0,-1)}}if(Q.config.historyEnabled){history.pushState({htmx:true},"",e)}Jt=e}function rr(e){if(Q.config.historyEnabled)history.replaceState({htmx:true},"",e);Jt=e}function nr(e){oe(e,function(e){e.call()})}function ir(a){var e=new XMLHttpRequest;var o={path:a,xhr:e};ce(re().body,"htmx:historyCacheMiss",o);e.open("GET",a,true);e.setRequestHeader("HX-Request","true");e.setRequestHeader("HX-History-Restore-Request","true");e.setRequestHeader("HX-Current-URL",re().location.href);e.onload=function(){if(this.status>=200&&this.status<400){ce(re().body,"htmx:historyCacheMissLoad",o);var e=l(this.response);e=e.querySelector("[hx-history-elt],[data-hx-history-elt]")||e;var t=Zt();var r=T(t);var n=Ve(this.response);if(n){var i=C("title");if(i){i.innerHTML=n}else{window.document.title=n}}Ue(t,e,r);nr(r.tasks);Jt=a;ce(re().body,"htmx:historyRestore",{path:a,cacheMiss:true,serverResponse:this.response})}else{fe(re().body,"htmx:historyCacheMissLoadError",o)}};e.send()}function ar(e){er();e=e||location.pathname+location.search;var t=Yt(e);if(t){var r=l(t.content);var n=Zt();var i=T(n);Ue(n,r,i);nr(i.tasks);document.title=t.title;setTimeout(function(){window.scrollTo(0,t.scroll)},0);Jt=e;ce(re().body,"htmx:historyRestore",{path:e,item:t})}else{if(Q.config.refreshOnHistoryMiss){window.location.reload(true)}else{ir(e)}}}function or(e){var t=pe(e,"hx-indicator");if(t==null){t=[e]}oe(t,function(e){var t=ae(e);t.requestCount=(t.requestCount||0)+1;e.classList["add"].call(e.classList,Q.config.requestClass)});return t}function sr(e){var t=pe(e,"hx-disabled-elt");if(t==null){t=[]}oe(t,function(e){var t=ae(e);t.requestCount=(t.requestCount||0)+1;e.setAttribute("disabled","")});return t}function lr(e,t){oe(e,function(e){var t=ae(e);t.requestCount=(t.requestCount||0)-1;if(t.requestCount===0){e.classList["remove"].call(e.classList,Q.config.requestClass)}});oe(t,function(e){var t=ae(e);t.requestCount=(t.requestCount||0)-1;if(t.requestCount===0){e.removeAttribute("disabled")}})}function ur(e,t){for(var r=0;r<e.length;r++){var n=e[r];if(n.isSameNode(t)){return true}}return false}function fr(e){if(e.name===""||e.name==null||e.disabled||v(e,"fieldset[disabled]")){return false}if(e.type==="button"||e.type==="submit"||e.tagName==="image"||e.tagName==="reset"||e.tagName==="file"){return false}if(e.type==="checkbox"||e.type==="radio"){return e.checked}return true}function cr(e,t,r){if(e!=null&&t!=null){var n=r[e];if(n===undefined){r[e]=t}else if(Array.isArray(n)){if(Array.isArray(t)){r[e]=n.concat(t)}else{n.push(t)}}else{if(Array.isArray(t)){r[e]=[n].concat(t)}else{r[e]=[n,t]}}}}function hr(t,r,n,e,i){if(e==null||ur(t,e)){return}else{t.push(e)}if(fr(e)){var a=ee(e,"name");var o=e.value;if(e.multiple&&e.tagName==="SELECT"){o=M(e.querySelectorAll("option:checked")).map(function(e){return e.value})}if(e.files){o=M(e.files)}cr(a,o,r);if(i){vr(e,n)}}if(h(e,"form")){var s=e.elements;oe(s,function(e){hr(t,r,n,e,i)})}}function vr(e,t){if(e.willValidate){ce(e,"htmx:validation:validate");if(!e.checkValidity()){t.push({elt:e,message:e.validationMessage,validity:e.validity});ce(e,"htmx:validation:failed",{message:e.validationMessage,validity:e.validity})}}}function dr(e,t){var r=[];var n={};var i={};var a=[];var o=ae(e);if(o.lastButtonClicked&&!se(o.lastButtonClicked)){o.lastButtonClicked=null}var s=h(e,"form")&&e.noValidate!==true||te(e,"hx-validate")==="true";if(o.lastButtonClicked){s=s&&o.lastButtonClicked.formNoValidate!==true}if(t!=="get"){hr(r,i,a,v(e,"form"),s)}hr(r,n,a,e,s);if(o.lastButtonClicked||e.tagName==="BUTTON"||e.tagName==="INPUT"&&ee(e,"type")==="submit"){var l=o.lastButtonClicked||e;var u=ee(l,"name");cr(u,l.value,i)}var f=pe(e,"hx-include");oe(f,function(e){hr(r,n,a,e,s);if(!h(e,"form")){oe(e.querySelectorAll(rt),function(e){hr(r,n,a,e,s)})}});n=le(n,i);return{errors:a,values:n}}function gr(e,t,r){if(e!==""){e+="&"}if(String(r)==="[object Object]"){r=JSON.stringify(r)}var n=encodeURIComponent(r);e+=encodeURIComponent(t)+"="+n;return e}function mr(e){var t="";for(var r in e){if(e.hasOwnProperty(r)){var n=e[r];if(Array.isArray(n)){oe(n,function(e){t=gr(t,r,e)})}else{t=gr(t,r,n)}}}return t}function pr(e){var t=new FormData;for(var r in e){if(e.hasOwnProperty(r)){var n=e[r];if(Array.isArray(n)){oe(n,function(e){t.append(r,e)})}else{t.append(r,n)}}}return t}function xr(e,t,r){var n={"HX-Request":"true","HX-Trigger":ee(e,"id"),"HX-Trigger-Name":ee(e,"name"),"HX-Target":te(t,"id"),"HX-Current-URL":re().location.href};Rr(e,"hx-headers",false,n);if(r!==undefined){n["HX-Prompt"]=r}if(ae(e).boosted){n["HX-Boosted"]="true"}return n}function yr(t,e){var r=ne(e,"hx-params");if(r){if(r==="none"){return{}}else if(r==="*"){return t}else if(r.indexOf("not ")===0){oe(r.substr(4).split(","),function(e){e=e.trim();delete t[e]});return t}else{var n={};oe(r.split(","),function(e){e=e.trim();n[e]=t[e]});return n}}else{return t}}function br(e){return ee(e,"href")&&ee(e,"href").indexOf("#")>=0}function wr(e,t){var r=t?t:ne(e,"hx-swap");var n={swapStyle:ae(e).boosted?"innerHTML":Q.config.defaultSwapStyle,swapDelay:Q.config.defaultSwapDelay,settleDelay:Q.config.defaultSettleDelay};if(Q.config.scrollIntoViewOnBoost&&ae(e).boosted&&!br(e)){n["show"]="top"}if(r){var i=D(r);if(i.length>0){for(var a=0;a<i.length;a++){var o=i[a];if(o.indexOf("swap:")===0){n["swapDelay"]=d(o.substr(5))}else if(o.indexOf("settle:")===0){n["settleDelay"]=d(o.substr(7))}else if(o.indexOf("transition:")===0){n["transition"]=o.substr(11)==="true"}else if(o.indexOf("ignoreTitle:")===0){n["ignoreTitle"]=o.substr(12)==="true"}else if(o.indexOf("scroll:")===0){var s=o.substr(7);var l=s.split(":");var u=l.pop();var f=l.length>0?l.join(":"):null;n["scroll"]=u;n["scrollTarget"]=f}else if(o.indexOf("show:")===0){var c=o.substr(5);var l=c.split(":");var h=l.pop();var f=l.length>0?l.join(":"):null;n["show"]=h;n["showTarget"]=f}else if(o.indexOf("focus-scroll:")===0){var v=o.substr("focus-scroll:".length);n["focusScroll"]=v=="true"}else if(a==0){n["swapStyle"]=o}else{b("Unknown modifier in hx-swap: "+o)}}}}return n}function Sr(e){return ne(e,"hx-encoding")==="multipart/form-data"||h(e,"form")&&ee(e,"enctype")==="multipart/form-data"}function Er(t,r,n){var i=null;R(r,function(e){if(i==null){i=e.encodeParameters(t,n,r)}});if(i!=null){return i}else{if(Sr(r)){return pr(n)}else{return mr(n)}}}function T(e){return{tasks:[],elts:[e]}}function Cr(e,t){var r=e[0];var n=e[e.length-1];if(t.scroll){var i=null;if(t.scrollTarget){i=ue(r,t.scrollTarget)}if(t.scroll==="top"&&(r||i)){i=i||r;i.scrollTop=0}if(t.scroll==="bottom"&&(n||i)){i=i||n;i.scrollTop=i.scrollHeight}}if(t.show){var i=null;if(t.showTarget){var a=t.showTarget;if(t.showTarget==="window"){a="body"}i=ue(r,a)}if(t.show==="top"&&(r||i)){i=i||r;i.scrollIntoView({block:"start",behavior:Q.config.scrollBehavior})}if(t.show==="bottom"&&(n||i)){i=i||n;i.scrollIntoView({block:"end",behavior:Q.config.scrollBehavior})}}}function Rr(e,t,r,n){if(n==null){n={}}if(e==null){return n}var i=te(e,t);if(i){var a=i.trim();var o=r;if(a==="unset"){return null}if(a.indexOf("javascript:")===0){a=a.substr(11);o=true}else if(a.indexOf("js:")===0){a=a.substr(3);o=true}if(a.indexOf("{")!==0){a="{"+a+"}"}var s;if(o){s=Tr(e,function(){return Function("return ("+a+")")()},{})}else{s=E(a)}for(var l in s){if(s.hasOwnProperty(l)){if(n[l]==null){n[l]=s[l]}}}}return Rr(u(e),t,r,n)}function Tr(e,t,r){if(Q.config.allowEval){return t()}else{fe(e,"htmx:evalDisallowedError");return r}}function Or(e,t){return Rr(e,"hx-vars",true,t)}function qr(e,t){return Rr(e,"hx-vals",false,t)}function Hr(e){return le(Or(e),qr(e))}function Lr(t,r,n){if(n!==null){try{t.setRequestHeader(r,n)}catch(e){t.setRequestHeader(r,encodeURIComponent(n));t.setRequestHeader(r+"-URI-AutoEncoded","true")}}}function Ar(t){if(t.responseURL&&typeof URL!=="undefined"){try{var e=new URL(t.responseURL);return e.pathname+e.search}catch(e){fe(re().body,"htmx:badResponseUrl",{url:t.responseURL})}}}function O(e,t){return t.test(e.getAllResponseHeaders())}function Nr(e,t,r){e=e.toLowerCase();if(r){if(r instanceof Element||I(r,"String")){return he(e,t,null,null,{targetOverride:g(r),returnPromise:true})}else{return he(e,t,g(r.source),r.event,{handler:r.handler,headers:r.headers,values:r.values,targetOverride:g(r.target),swapOverride:r.swap,select:r.select,returnPromise:true})}}else{return he(e,t,null,null,{returnPromise:true})}}function Ir(e){var t=[];while(e){t.push(e);e=e.parentElement}return t}function kr(e,t,r){var n;var i;if(typeof URL==="function"){i=new URL(t,document.location.href);var a=document.location.origin;n=a===i.origin}else{i=t;n=s(t,document.location.origin)}if(Q.config.selfRequestsOnly){if(!n){return false}}return ce(e,"htmx:validateUrl",le({url:i,sameHost:n},r))}function he(t,r,n,i,a,e){var o=null;var s=null;a=a!=null?a:{};if(a.returnPromise&&typeof Promise!=="undefined"){var l=new Promise(function(e,t){o=e;s=t})}if(n==null){n=re().body}var M=a.handler||Mr;var X=a.select||null;if(!se(n)){ie(o);return l}var u=a.targetOverride||ye(n);if(u==null||u==me){fe(n,"htmx:targetError",{target:te(n,"hx-target")});ie(s);return l}var f=ae(n);var c=f.lastButtonClicked;if(c){var h=ee(c,"formaction");if(h!=null){r=h}var v=ee(c,"formmethod");if(v!=null){if(v.toLowerCase()!=="dialog"){t=v}}}var d=ne(n,"hx-confirm");if(e===undefined){var D=function(e){return he(t,r,n,i,a,!!e)};var U={target:u,elt:n,path:r,verb:t,triggeringEvent:i,etc:a,issueRequest:D,question:d};if(ce(n,"htmx:confirm",U)===false){ie(o);return l}}var g=n;var m=ne(n,"hx-sync");var p=null;var x=false;if(m){var B=m.split(":");var F=B[0].trim();if(F==="this"){g=xe(n,"hx-sync")}else{g=ue(n,F)}m=(B[1]||"drop").trim();f=ae(g);if(m==="drop"&&f.xhr&&f.abortable!==true){ie(o);return l}else if(m==="abort"){if(f.xhr){ie(o);return l}else{x=true}}else if(m==="replace"){ce(g,"htmx:abort")}else if(m.indexOf("queue")===0){var V=m.split(" ");p=(V[1]||"last").trim()}}if(f.xhr){if(f.abortable){ce(g,"htmx:abort")}else{if(p==null){if(i){var y=ae(i);if(y&&y.triggerSpec&&y.triggerSpec.queue){p=y.triggerSpec.queue}}if(p==null){p="last"}}if(f.queuedRequests==null){f.queuedRequests=[]}if(p==="first"&&f.queuedRequests.length===0){f.queuedRequests.push(function(){he(t,r,n,i,a)})}else if(p==="all"){f.queuedRequests.push(function(){he(t,r,n,i,a)})}else if(p==="last"){f.queuedRequests=[];f.queuedRequests.push(function(){he(t,r,n,i,a)})}ie(o);return l}}var b=new XMLHttpRequest;f.xhr=b;f.abortable=x;var w=function(){f.xhr=null;f.abortable=false;if(f.queuedRequests!=null&&f.queuedRequests.length>0){var e=f.queuedRequests.shift();e()}};var j=ne(n,"hx-prompt");if(j){var S=prompt(j);if(S===null||!ce(n,"htmx:prompt",{prompt:S,target:u})){ie(o);w();return l}}if(d&&!e){if(!confirm(d)){ie(o);w();return l}}var E=xr(n,u,S);if(t!=="get"&&!Sr(n)){E["Content-Type"]="application/x-www-form-urlencoded"}if(a.headers){E=le(E,a.headers)}var _=dr(n,t);var C=_.errors;var R=_.values;if(a.values){R=le(R,a.values)}var z=Hr(n);var $=le(R,z);var T=yr($,n);if(Q.config.getCacheBusterParam&&t==="get"){T["org.htmx.cache-buster"]=ee(u,"id")||"true"}if(r==null||r===""){r=re().location.href}var O=Rr(n,"hx-request");var W=ae(n).boosted;var q=Q.config.methodsThatUseUrlParams.indexOf(t)>=0;var H={boosted:W,useUrlParams:q,parameters:T,unfilteredParameters:$,headers:E,target:u,verb:t,errors:C,withCredentials:a.credentials||O.credentials||Q.config.withCredentials,timeout:a.timeout||O.timeout||Q.config.timeout,path:r,triggeringEvent:i};if(!ce(n,"htmx:configRequest",H)){ie(o);w();return l}r=H.path;t=H.verb;E=H.headers;T=H.parameters;C=H.errors;q=H.useUrlParams;if(C&&C.length>0){ce(n,"htmx:validation:halted",H);ie(o);w();return l}var G=r.split("#");var J=G[0];var L=G[1];var A=r;if(q){A=J;var Z=Object.keys(T).length!==0;if(Z){if(A.indexOf("?")<0){A+="?"}else{A+="&"}A+=mr(T);if(L){A+="#"+L}}}if(!kr(n,A,H)){fe(n,"htmx:invalidPath",H);ie(s);return l}b.open(t.toUpperCase(),A,true);b.overrideMimeType("text/html");b.withCredentials=H.withCredentials;b.timeout=H.timeout;if(O.noHeaders){}else{for(var N in E){if(E.hasOwnProperty(N)){var K=E[N];Lr(b,N,K)}}}var I={xhr:b,target:u,requestConfig:H,etc:a,boosted:W,select:X,pathInfo:{requestPath:r,finalRequestPath:A,anchor:L}};b.onload=function(){try{var e=Ir(n);I.pathInfo.responsePath=Ar(b);M(n,I);lr(k,P);ce(n,"htmx:afterRequest",I);ce(n,"htmx:afterOnLoad",I);if(!se(n)){var t=null;while(e.length>0&&t==null){var r=e.shift();if(se(r)){t=r}}if(t){ce(t,"htmx:afterRequest",I);ce(t,"htmx:afterOnLoad",I)}}ie(o);w()}catch(e){fe(n,"htmx:onLoadError",le({error:e},I));throw e}};b.onerror=function(){lr(k,P);fe(n,"htmx:afterRequest",I);fe(n,"htmx:sendError",I);ie(s);w()};b.onabort=function(){lr(k,P);fe(n,"htmx:afterRequest",I);fe(n,"htmx:sendAbort",I);ie(s);w()};b.ontimeout=function(){lr(k,P);fe(n,"htmx:afterRequest",I);fe(n,"htmx:timeout",I);ie(s);w()};if(!ce(n,"htmx:beforeRequest",I)){ie(o);w();return l}var k=or(n);var P=sr(n);oe(["loadstart","loadend","progress","abort"],function(t){oe([b,b.upload],function(e){e.addEventListener(t,function(e){ce(n,"htmx:xhr:"+t,{lengthComputable:e.lengthComputable,loaded:e.loaded,total:e.total})})})});ce(n,"htmx:beforeSend",I);var Y=q?null:Er(b,n,T);b.send(Y);return l}function Pr(e,t){var r=t.xhr;var n=null;var i=null;if(O(r,/HX-Push:/i)){n=r.getResponseHeader("HX-Push");i="push"}else if(O(r,/HX-Push-Url:/i)){n=r.getResponseHeader("HX-Push-Url");i="push"}else if(O(r,/HX-Replace-Url:/i)){n=r.getResponseHeader("HX-Replace-Url");i="replace"}if(n){if(n==="false"){return{}}else{return{type:i,path:n}}}var a=t.pathInfo.finalRequestPath;var o=t.pathInfo.responsePath;var s=ne(e,"hx-push-url");var l=ne(e,"hx-replace-url");var u=ae(e).boosted;var f=null;var c=null;if(s){f="push";c=s}else if(l){f="replace";c=l}else if(u){f="push";c=o||a}if(c){if(c==="false"){return{}}if(c==="true"){c=o||a}if(t.pathInfo.anchor&&c.indexOf("#")===-1){c=c+"#"+t.pathInfo.anchor}return{type:f,path:c}}else{return{}}}function Mr(l,u){var f=u.xhr;var c=u.target;var e=u.etc;var t=u.requestConfig;var h=u.select;if(!ce(l,"htmx:beforeOnLoad",u))return;if(O(f,/HX-Trigger:/i)){_e(f,"HX-Trigger",l)}if(O(f,/HX-Location:/i)){er();var r=f.getResponseHeader("HX-Location");var v;if(r.indexOf("{")===0){v=E(r);r=v["path"];delete v["path"]}Nr("GET",r,v).then(function(){tr(r)});return}var n=O(f,/HX-Refresh:/i)&&"true"===f.getResponseHeader("HX-Refresh");if(O(f,/HX-Redirect:/i)){location.href=f.getResponseHeader("HX-Redirect");n&&location.reload();return}if(n){location.reload();return}if(O(f,/HX-Retarget:/i)){if(f.getResponseHeader("HX-Retarget")==="this"){u.target=l}else{u.target=ue(l,f.getResponseHeader("HX-Retarget"))}}var d=Pr(l,u);var i=f.status>=200&&f.status<400&&f.status!==204;var g=f.response;var a=f.status>=400;var m=Q.config.ignoreTitle;var o=le({shouldSwap:i,serverResponse:g,isError:a,ignoreTitle:m},u);if(!ce(c,"htmx:beforeSwap",o))return;c=o.target;g=o.serverResponse;a=o.isError;m=o.ignoreTitle;u.target=c;u.failed=a;u.successful=!a;if(o.shouldSwap){if(f.status===286){at(l)}R(l,function(e){g=e.transformResponse(g,f,l)});if(d.type){er()}var s=e.swapOverride;if(O(f,/HX-Reswap:/i)){s=f.getResponseHeader("HX-Reswap")}var v=wr(l,s);if(v.hasOwnProperty("ignoreTitle")){m=v.ignoreTitle}c.classList.add(Q.config.swappingClass);var p=null;var x=null;var y=function(){try{var e=document.activeElement;var t={};try{t={elt:e,start:e?e.selectionStart:null,end:e?e.selectionEnd:null}}catch(e){}var r;if(h){r=h}if(O(f,/HX-Reselect:/i)){r=f.getResponseHeader("HX-Reselect")}if(d.type){ce(re().body,"htmx:beforeHistoryUpdate",le({history:d},u));if(d.type==="push"){tr(d.path);ce(re().body,"htmx:pushedIntoHistory",{path:d.path})}else{rr(d.path);ce(re().body,"htmx:replacedInHistory",{path:d.path})}}var n=T(c);je(v.swapStyle,c,l,g,n,r);if(t.elt&&!se(t.elt)&&ee(t.elt,"id")){var i=document.getElementById(ee(t.elt,"id"));var a={preventScroll:v.focusScroll!==undefined?!v.focusScroll:!Q.config.defaultFocusScroll};if(i){if(t.start&&i.setSelectionRange){try{i.setSelectionRange(t.start,t.end)}catch(e){}}i.focus(a)}}c.classList.remove(Q.config.swappingClass);oe(n.elts,function(e){if(e.classList){e.classList.add(Q.config.settlingClass)}ce(e,"htmx:afterSwap",u)});if(O(f,/HX-Trigger-After-Swap:/i)){var o=l;if(!se(l)){o=re().body}_e(f,"HX-Trigger-After-Swap",o)}var s=function(){oe(n.tasks,function(e){e.call()});oe(n.elts,function(e){if(e.classList){e.classList.remove(Q.config.settlingClass)}ce(e,"htmx:afterSettle",u)});if(u.pathInfo.anchor){var e=re().getElementById(u.pathInfo.anchor);if(e){e.scrollIntoView({block:"start",behavior:"auto"})}}if(n.title&&!m){var t=C("title");if(t){t.innerHTML=n.title}else{window.document.title=n.title}}Cr(n.elts,v);if(O(f,/HX-Trigger-After-Settle:/i)){var r=l;if(!se(l)){r=re().body}_e(f,"HX-Trigger-After-Settle",r)}ie(p)};if(v.settleDelay>0){setTimeout(s,v.settleDelay)}else{s()}}catch(e){fe(l,"htmx:swapError",u);ie(x);throw e}};var b=Q.config.globalViewTransitions;if(v.hasOwnProperty("transition")){b=v.transition}if(b&&ce(l,"htmx:beforeTransition",u)&&typeof Promise!=="undefined"&&document.startViewTransition){var w=new Promise(function(e,t){p=e;x=t});var S=y;y=function(){document.startViewTransition(function(){S();return w})}}if(v.swapDelay>0){setTimeout(y,v.swapDelay)}else{y()}}if(a){fe(l,"htmx:responseError",le({error:"Response Status Error Code "+f.status+" from "+u.pathInfo.requestPath},u))}}var Xr={};function Dr(){return{init:function(e){return null},onEvent:function(e,t){return true},transformResponse:function(e,t,r){return e},isInlineSwap:function(e){return false},handleSwap:function(e,t,r,n){return false},encodeParameters:function(e,t,r){return null}}}function Ur(e,t){if(t.init){t.init(r)}Xr[e]=le(Dr(),t)}function Br(e){delete Xr[e]}function Fr(e,r,n){if(e==undefined){return r}if(r==undefined){r=[]}if(n==undefined){n=[]}var t=te(e,"hx-ext");if(t){oe(t.split(","),function(e){e=e.replace(/ /g,"");if(e.slice(0,7)=="ignore:"){n.push(e.slice(7));return}if(n.indexOf(e)<0){var t=Xr[e];if(t&&r.indexOf(t)<0){r.push(t)}}})}return Fr(u(e),r,n)}var Vr=false;re().addEventListener("DOMContentLoaded",function(){Vr=true});function jr(e){if(Vr||re().readyState==="complete"){e()}else{re().addEventListener("DOMContentLoaded",e)}}function _r(){if(Q.config.includeIndicatorStyles!==false){re().head.insertAdjacentHTML("beforeend","<style>                      ."+Q.config.indicatorClass+"{opacity:0}                      ."+Q.config.requestClass+" ."+Q.config.indicatorClass+"{opacity:1; transition: opacity 200ms ease-in;}                      ."+Q.config.requestClass+"."+Q.config.indicatorClass+"{opacity:1; transition: opacity 200ms ease-in;}                    </style>")}}function zr(){var e=re().querySelector('meta[name="htmx-config"]');if(e){return E(e.content)}else{return null}}function $r(){var e=zr();if(e){Q.config=le(Q.config,e)}}jr(function(){$r();_r();var e=re().body;zt(e);var t=re().querySelectorAll("[hx-trigger='restored'],[data-hx-trigger='restored']");e.addEventListener("htmx:abort",function(e){var t=e.target;var r=ae(t);if(r&&r.xhr){r.xhr.abort()}});const r=window.onpopstate?window.onpopstate.bind(window):null;window.onpopstate=function(e){if(e.state&&e.state.htmx){ar();oe(t,function(e){ce(e,"htmx:restored",{document:re(),triggerEvent:ce})})}else{if(r){r(e)}}};setTimeout(function(){ce(e,"htmx:load",{});e=null},0)});return Q}()});
\ No newline at end of file
diff --git a/templates/base.html b/templates/base.html
index 15a2a0e..7c0ecbb 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -7,11 +7,12 @@
 
     <!-- CSS -->
     <link rel="stylesheet" href="/static/css/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />
     <link rel="stylesheet" href="https://cdn.plyr.io/3.7.8/plyr.css" />
 
-    <!-- External Libraries -->
-    <script src="https://unpkg.com/htmx.org@1.9.10"></script>
-    <script src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
+    <!-- External Libraries (local first, CDN fallback) -->
+    <script src="/static/vendor/htmx.min.js"></script>
+    <script src="/static/vendor/alpine.min.js" defer></script>
     <script src="https://cdn.plyr.io/3.7.8/plyr.polyfilled.js"></script>
 
     <style>
@@ -40,6 +41,7 @@
     <script src="/static/js/watchlist.js?v=1.11" defer></script>
     <!-- <script src="/static/js/watchlist-ui.js?v=1.11" defer></script> -->
     <script src="/static/js/main.js?v=1.11" defer></script>
+    <script src="/static/js/settings.js?v=1.0" defer></script>
 </head>
 <body x-data="globalAppState">
     {% include "components/toast_container.html" %}
diff --git a/templates/components/admin_panel.html b/templates/components/admin_panel.html
index 857093a..f14c307 100644
--- a/templates/components/admin_panel.html
+++ b/templates/components/admin_panel.html
@@ -5,23 +5,23 @@
 
     <!-- Stats Cards -->
     <div id="admin-stats" class="admin-stats-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 15px; margin-bottom: 30px;">
-        <div class="admin-stat-card" style="padding: 20px; background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid rgba(255,255,255,0.05); text-align: center;">
+        <div class="admin-stat-card" style="padding: 20px; background: var(--bg-card); border-radius: var(--card-radius);    border: 1px solid #2a2d32;text-align: center;">
             <div style="font-size: 2rem; font-weight: 800; color: var(--primary);" id="stat-total-users">{{ users|length }}</div>
             <div style="color: var(--text-dim); font-size: 0.85rem;">Utilisateurs</div>
         </div>
-        <div class="admin-stat-card" style="padding: 20px; background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid rgba(255,255,255,0.05); text-align: center;">
+        <div class="admin-stat-card" style="padding: 20px; background: var(--bg-card); border-radius: var(--card-radius);    border: 1px solid #2a2d32;text-align: center;">
             <div style="font-size: 2rem; font-weight: 800; color: var(--accent);" id="stat-active-users">{{ users|selectattr('is_active')|list|length }}</div>
             <div style="color: var(--text-dim); font-size: 0.85rem;">Actifs</div>
         </div>
-        <div class="admin-stat-card" style="padding: 20px; background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid rgba(255,255,255,0.05); text-align: center;">
+        <div class="admin-stat-card" style="padding: 20px; background: var(--bg-card); border-radius: var(--card-radius);    border: 1px solid #2a2d32;text-align: center;">
             <div style="font-size: 2rem; font-weight: 800; color: #f0a500;" id="stat-admin-users">{{ users|selectattr('is_admin')|list|length }}</div>
             <div style="color: var(--text-dim); font-size: 0.85rem;">Admins</div>
         </div>
     </div>
 
     <!-- Users Table -->
-    <div style="background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid rgba(255,255,255,0.05); overflow: hidden;">
-        <div style="padding: 20px 25px; border-bottom: 1px solid rgba(255,255,255,0.05);">
+    <div style="background: var(--bg-card); border-radius: var(--card-radius);    border: 1px solid #2a2d32;overflow: hidden;">
+        <div style="padding: 20px 25px;    border-bottom: 1px solid #2a2d32;">
             <h3 style="margin: 0; color: var(--primary);">Gestion des utilisateurs</h3>
         </div>
         
@@ -29,7 +29,7 @@
         <div style="overflow-x: auto;">
             <table style="width: 100%; border-collapse: collapse;">
                 <thead>
-                    <tr style="border-bottom: 1px solid rgba(255,255,255,0.05);">
+                    <tr style="border-bottom: 1px solid #2a2d32;">
                         <th style="padding: 12px 20px; text-align: left; color: var(--text-dim); font-size: 0.8rem; text-transform: uppercase;">Utilisateur</th>
                         <th style="padding: 12px 15px; text-align: left; color: var(--text-dim); font-size: 0.8rem; text-transform: uppercase;">Email</th>
                         <th style="padding: 12px 15px; text-align: center; color: var(--text-dim); font-size: 0.8rem; text-transform: uppercase;">Statut</th>
@@ -41,7 +41,7 @@
                 </thead>
                 <tbody>
                     {% for user in users %}
-                    <tr style="border-bottom: 1px solid rgba(255,255,255,0.03); {% if not user.is_active %}opacity: 0.5;{% endif %}">
+                    <tr style="border-bottom: 1px solid #2a2d32; {% if not user.is_active %}opacity: 0.5;{% endif %}">
                         <td style="padding: 12px 20px;">
                             <div style="font-weight: 600;">{{ user.username }}</div>
                             {% if user.full_name %}
@@ -50,12 +50,12 @@
                         </td>
                         <td style="padding: 12px 15px; color: var(--text-dim); font-size: 0.9rem;">{{ user.email or '-' }}</td>
                         <td style="padding: 12px 15px; text-align: center;">
-                            <span style="display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 0.75rem; font-weight: 600; background: {% if user.is_active %}rgba(0,255,136,0.15); color: var(--accent){% else %}rgba(255,77,77,0.15); color: var(--danger){% endif %};">
+                            <span style="display: inline-block; padding: 3px 10px; border-radius: 4px; font-size: 0.75rem; font-weight: 600; background: {% if user.is_active %}rgba(45,147,108,0.1); color: #2d936c{% else %}rgba(230,57,70,0.1); color: #e63946{% endif %};">
                                 {% if user.is_active %}Actif{% else %}Inactif{% endif %}
                             </span>
                         </td>
                         <td style="padding: 12px 15px; text-align: center;">
-                            <span style="display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 0.75rem; font-weight: 600; background: {% if user.is_admin %}rgba(240,165,0,0.15); color: #f0a500{% else %}rgba(255,255,255,0.05); color: var(--text-dim){% endif %};">
+                            <span style="display: inline-block; padding: 3px 10px; border-radius: 4px; font-size: 0.75rem; font-weight: 600; background: {% if user.is_admin %}rgba(244,162,97,0.15); color: #f4a261{% else %}var(--bg-elevated); color: var(--text-dim){% endif %};">
                                 {% if user.is_admin %}Admin{% else %}User{% endif %}
                             </span>
                         </td>
diff --git a/templates/components/anime_card.html b/templates/components/anime_card.html
index a5beb66..1796504 100644
--- a/templates/components/anime_card.html
+++ b/templates/components/anime_card.html
@@ -2,9 +2,9 @@
 <div class="hc" id="anime-{{ anime.url | hash }}"
      @click="activeTab = 'anime'; window.dispatchEvent(new CustomEvent('set-tab', { detail: { tab: 'anime' } })); $nextTick(() => { const input = document.getElementById('animeSearchInput'); if (input) { input.value = '{{ anime.title | e }}'; htmx.trigger(input, 'keyup'); } });">
     <div class="hc-poster">
-        {% set poster = anime.cover_image or (anime.metadata.poster_image if anime.metadata else None) or 'https://placehold.co/400x600/161625/00d9ff?text=No+Image' %}
+        {% set poster = anime.cover_image or (anime.metadata.poster_image if anime.metadata else None) or 'https://placehold.co/400x600/e6e8e6/f15025?text=No+Image' %}
         <img src="{{ poster }}" alt="{{ anime.title }}" loading="lazy" referrerpolicy="no-referrer"
-             onerror="this.src='https://placehold.co/400x600/161625/00d9ff?text=Error'; this.onerror=null;">
+             onerror="this.src='https://placehold.co/400x600/e6e8e6/f15025?text=Error'; this.onerror=null;">
         {% if anime.metadata and anime.metadata.rating %}
         <span class="hc-rating"><i class="fas fa-star"></i> {{ anime.metadata.rating }}</span>
         {% endif %}
diff --git a/templates/components/anime_search_results.html b/templates/components/anime_search_results.html
index 6d716e6..b5490f1 100644
--- a/templates/components/anime_search_results.html
+++ b/templates/components/anime_search_results.html
@@ -1,4 +1,4 @@
-{% set accent = "#00d9ff" %}
+{% set accent = "#FF9F1C" %}
 {% set default_lang = settings.default_lang if settings else 'vostfr' %}
 
 {% set _groups = namespace(items={}) %}
@@ -36,9 +36,9 @@
             {% set first_url = group.providers[0].url %}
             <div class="sr-card" style="--sr-accent: {{ accent }};">
                 <a class="sr-poster-link" href="{{ first_url }}" target="_blank" rel="noopener">
-                    <img class="sr-poster-img" src="{{ group.cover or 'https://placehold.co/240x360/161625/00d9ff?text=No+Image' }}"
+                    <img class="sr-poster-img" src="{{ group.cover or 'https://placehold.co/240x360/29274c/7e52a0?text=No+Image' }}"
                          alt="{{ group.title }}" loading="lazy" referrerpolicy="no-referrer"
-                         onerror="this.src='https://placehold.co/240x360/161625/00d9ff?text=Error'; this.onerror=null;">
+                         onerror="this.src='https://placehold.co/240x360/29274c/7e52a0?text=Error'; this.onerror=null;">
                 </a>
                 <div class="sr-body">
                     <div class="sr-top">
@@ -114,11 +114,11 @@
 .sr-card {
     display: flex; gap: 20px;
     background: var(--bg-card); border-radius: var(--card-radius);
-    padding: 20px; border: 1px solid rgba(255,255,255,0.05);
+    padding: 20px; border: 1px solid #2a2d32;"
     transition: var(--transition);
 }
-.sr-card:hover { border-color: var(--sr-accent); box-shadow: 0 4px 24px rgba(0,0,0,0.4); }
-.sr-poster-link { flex-shrink: 0; display: block; width: 120px; aspect-ratio: 2/3; border-radius: 8px; overflow: hidden; background: #000; }
+.sr-card:hover { border-color: var(--sr-accent); }
+.sr-poster-link { flex-shrink: 0; display: block; width: 120px; aspect-ratio: 2/3; border-radius: 4px; overflow: hidden; background: #000; }
 .sr-poster-img { width: 100%; height: 100%; object-fit: cover; display: block; }
 .sr-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
 .sr-top { display: flex; align-items: baseline; gap: 12px; }
@@ -126,24 +126,24 @@
 .sr-rating { flex-shrink: 0; font-size: 0.8rem; font-weight: 700; color: #ffcc00; }
 .sr-synopsis { font-size: 0.85rem; color: var(--text-dim); margin: 0; line-height: 1.5; }
 .sr-tags { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; }
-.sr-tag { font-size: 0.65rem; font-weight: 600; padding: 2px 8px; border-radius: 4px; background: rgba(255,255,255,0.06); color: var(--text-dim); }
+.sr-tag { font-size: 0.65rem; font-weight: 600; padding: 2px 8px; border-radius: 4px; background: var(--bg-elevated); color: var(--text-dim); }
 .sr-providers { display: flex; flex-wrap: wrap; gap: 6px; }
 .sr-provider-badge { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; padding: 4px 12px; border-radius: 20px; border: 1px solid var(--sr-accent); color: var(--sr-accent); background: transparent; cursor: pointer; transition: var(--transition); letter-spacing: 0.5px; text-decoration: none; }
-.sr-provider-badge:hover { background: var(--sr-accent); color: var(--bg-dark); }
+.sr-provider-badge:hover { background: var(--sr-accent); color: #fff; }
 .sr-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
-.sr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 16px; border-radius: 8px; font-size: 0.8rem; font-weight: 600; border: 1px solid rgba(255,255,255,0.1); cursor: pointer; transition: var(--transition); text-decoration: none; background: transparent; color: var(--text-main); min-height: 34px; }
-.sr-btn:hover { border-color: rgba(255,255,255,0.2); background: rgba(255,255,255,0.05); }
+.sr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 16px; border-radius: 4px; font-size: 0.8rem; font-weight: 600; border: 1px solid #2a2d32; cursor: pointer; transition: var(--transition); text-decoration: none; background: transparent; color: var(--text-main); min-height: 34px; }
+.sr-btn:hover { border-color: var(--text-main); background: var(--bg-card); }
 .sr-btn-dl { border-color: var(--secondary); color: var(--secondary); }
-.sr-btn-dl:hover { background: var(--secondary); color: var(--bg-dark); }
+.sr-btn-dl:hover { background: var(--secondary); color: #ffffff; }
 .sr-btn-watch { border-color: var(--sr-accent); color: var(--sr-accent); }
-.sr-btn-watch:hover { background: var(--sr-accent); color: var(--bg-dark); }
+.sr-btn-watch:hover { background: var(--sr-accent); color: #fff; }
 .sr-btn-follow { border-color: var(--accent); color: var(--accent); }
-.sr-btn-follow:hover { background: var(--accent); color: var(--bg-dark); }
-.sr-btn-followed { border-color: var(--accent); color: var(--accent); background: rgba(0,255,136,0.1); pointer-events: none; }
+.sr-btn-follow:hover { background: var(--accent); color: #fff; }
+.sr-btn-followed { border-color: var(--accent); color: var(--accent); background: rgba(255,191,105,0.1); pointer-events: none; }
 .sr-dropdown { position: relative; }
-.sr-dropdown-menu { position: absolute; top: calc(100% + 6px); left: 0; min-width: 200px; background: var(--bg-card); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 4px; z-index: 100; box-shadow: 0 8px 32px rgba(0,0,0,0.6); }
-.sr-dropdown-item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 10px 12px; border: none; background: transparent; color: var(--text-main); font-size: 0.8rem; cursor: pointer; border-radius: 6px; transition: var(--transition); text-align: left; }
-.sr-dropdown-item:hover { background: rgba(255,255,255,0.06); }
+.sr-dropdown-menu { position: absolute; top: calc(100% + 6px); left: 0; min-width: 200px; background: var(--bg-card); border: 1px solid #2a2d32; border-radius: 4px; padding: 4px; z-index: 100; }
+.sr-dropdown-item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 10px 12px; border: none; background: transparent; color: var(--text-main); font-size: 0.8rem; cursor: pointer; border-radius: 4px; transition: var(--transition); text-align: left; }
+.sr-dropdown-item:hover { background: var(--bg-elevated); }
 .sr-empty { text-align: center; padding: 100px 20px; color: var(--text-dim); }
 .sr-empty i { font-size: 4rem; margin-bottom: 20px; display: block; opacity: 0.2; }
 @media (max-width: 768px) {
diff --git a/templates/components/downloads_section.html b/templates/components/downloads_section.html
index 2069927..d9fcd3f 100644
--- a/templates/components/downloads_section.html
+++ b/templates/components/downloads_section.html
@@ -36,7 +36,7 @@
     font-size: 0.85rem;
     font-weight: 600;
     color: var(--primary);
-    background: rgba(0, 217, 255, 0.1);
+    background: rgba(241, 80, 37, 0.1);
     padding: 2px 10px;
     border-radius: 12px;
     margin-left: 10px;
diff --git a/templates/components/episode_list.html b/templates/components/episode_list.html
index 5f3a190..00e5641 100644
--- a/templates/components/episode_list.html
+++ b/templates/components/episode_list.html
@@ -60,7 +60,7 @@
     background: var(--bg-card);
     border-radius: var(--card-radius);
     padding: 30px;
-    border: 1px solid rgba(255, 255, 255, 0.05);
+    border: 1px solid var(--secondary);
     animation: fadeIn 0.3s ease-out;
 }
 
@@ -71,21 +71,20 @@
 }
 
 .view-grid .episode-item {
-    background: rgba(255, 255, 255, 0.03);
+    background: var(--bg-elevated);
     padding: 20px 15px;
-    border-radius: 12px;
+    border-radius: 4px;
     text-align: center;
     transition: var(--transition);
-    border: 1px solid rgba(255, 255, 255, 0.05);
+    border: 1px solid var(--secondary);
     display: flex;
     flex-direction: column;
     gap: 12px;
 }
 
 .view-grid .episode-item:hover { 
-    background: rgba(255, 255, 255, 0.07); 
+    background: var(--text-dim); 
     border-color: var(--primary);
-    transform: translateY(-3px); 
 }
 
 .view-grid .ep-title { display: none; }
@@ -103,15 +102,15 @@
     display: flex;
     align-items: center;
     gap: 20px;
-    background: rgba(255, 255, 255, 0.03);
+    background: var(--bg-elevated);
     padding: 12px 20px;
-    border-radius: 10px;
-    border: 1px solid rgba(255, 255, 255, 0.05);
+    border-radius: 4px;
+    border: 1px solid var(--secondary);
     transition: var(--transition);
 }
 
 .view-list .episode-item:hover {
-    background: rgba(255, 255, 255, 0.07);
+    background: var(--text-dim);
     border-color: var(--primary);
 }
 
@@ -123,9 +122,8 @@
     margin: 20px 0 30px 0;
     padding: 25px;
     background: #000;
-    border-radius: 12px;
+    border-radius: 4px;
     border: 1px solid var(--primary);
-    box-shadow: 0 0 30px rgba(0, 217, 255, 0.15);
 }
 
 @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
diff --git a/templates/components/header.html b/templates/components/header.html
index 57f9553..0b38dec 100644
--- a/templates/components/header.html
+++ b/templates/components/header.html
@@ -1,25 +1,25 @@
 <header>
-    <h1>⚡ Ohm Stream Downloader</h1>
+    <h1><i class="fa-solid fa-bolt"></i> Ohm Stream Downloader</h1>
     <p class="subtitle">Téléchargez vos vidéos, animes et séries depuis vos hébergeurs préférés</p>
 
     <!-- User info and logout button -->
     <div id="userInfo" x-show="isAuthenticated" class="auth-panel" x-cloak>
         <div style="display: flex; align-items: center; gap: 10px;">
-            <span style="color: var(--primary); font-size: 1.2rem;">👤</span>
-            <span style="color: #fff; font-size: 14px;">Connecté en tant que <strong x-text="username" style="color: var(--primary);">-</strong></span>
+            <span style="color: var(--primary); font-size: 1.2rem;"><i class="fa-solid fa-user"></i></span>
+            <span style="color: var(--text-main); font-size: 14px;">Connecté en tant que <strong x-text="username" style="color: var(--primary);">-</strong></span>
         </div>
         <button class="btn btn-secondary btn-small" 
                 onclick="removeToken(); isAuthenticated = false"
                 hx-post="/api/auth/logout"
                 hx-on::after-request="window.location.href = '/login'">
-            🚪 Déconnexion
+            <i class="fa-solid fa-right-from-bracket"></i> Déconnexion
         </button>
     </div>
 
     <!-- Login prompt (shown when not logged in) -->
     <div id="loginPrompt" x-show="!isAuthenticated" class="auth-panel" style="justify-content: center;" x-cloak>
         <p style="color: var(--primary); margin: 0;">
-            👋 Bienvenue! <a href="/login" class="btn btn-secondary btn-small" style="margin-left: 10px;">Se connecter</a> pour accéder à toutes les fonctionnalités.
+            <i class="fa-solid fa-hand"></i> Bienvenue! <a href="/login" class="btn btn-secondary btn-small" style="margin-left: 10px;">Se connecter</a> pour accéder à toutes les fonctionnalités.
         </p>
     </div>
 
diff --git a/templates/components/home_section.html b/templates/components/home_section.html
index 367954f..1326529 100644
--- a/templates/components/home_section.html
+++ b/templates/components/home_section.html
@@ -2,7 +2,7 @@
 
     <div class="section-container">
         <div class="section-header">
-            <h2>🎯 Recommandé pour vous</h2>
+            <h2><i class="fa-solid fa-bullseye"></i> Recommandé pour vous</h2>
             <button class="btn btn-secondary btn-small" 
                     hx-get="/api/recommendations" 
                     hx-target="#recommendationsList">
@@ -19,7 +19,7 @@
 
     <div class="section-container">
         <div class="section-header">
-            <h2>🔥 Dernières sorties</h2>
+            <h2><i class="fa-solid fa-fire"></i> Dernières sorties</h2>
             <button class="btn btn-secondary btn-small" 
                     hx-get="/api/releases/latest" 
                     hx-target="#releasesList">
diff --git a/templates/components/login_prompt.html b/templates/components/login_prompt.html
index 5ed18bc..5d0fe88 100644
--- a/templates/components/login_prompt.html
+++ b/templates/components/login_prompt.html
@@ -1,4 +1,4 @@
 <div class="login-prompt" style="text-align: center; padding: 40px 20px;">
-    <i class="fas fa-lock" style="font-size: 2rem; color: #00d9ff; margin-bottom: 15px;"></i>
-    <p style="color: #888; font-size: 0.95rem;">Connectez-vous pour accéder à cette section.</p>
+    <i class="fa-solid fa-lock" style="font-size: 2rem; color: #FF9F1C; margin-bottom: 15px;"></i>
+    <p style="color: #8a8f98; font-size: 0.95rem;">Connectez-vous pour accéder à cette section.</p>
 </div>
diff --git a/templates/components/player_embed.html b/templates/components/player_embed.html
index fc2aadc..de74c07 100644
--- a/templates/components/player_embed.html
+++ b/templates/components/player_embed.html
@@ -19,7 +19,7 @@
                     mozallowfullscreen></iframe>
         </div>
         <div class="player-info-hint">
-            💡 Lecteur externe utilisé. Les contrôles dépendent de l'hébergeur.
+            <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">
@@ -41,8 +41,8 @@
     margin: 20px 0;
     padding: 15px;
     background: #000;
-    border-radius: 12px;
-    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
+    border-radius: 4px;
+    border: 1px solid #2a2d32;
 }
 .iframe-container {
     position: relative;
@@ -65,7 +65,7 @@
 }
 .player-info-hint {
     font-size: 0.8rem;
-    color: #888;
+    color: var(--text-dim);
     margin-top: 10px;
     text-align: center;
 }
diff --git a/templates/components/series_card.html b/templates/components/series_card.html
index 9bac403..b704f85 100644
--- a/templates/components/series_card.html
+++ b/templates/components/series_card.html
@@ -1,18 +1,17 @@
-{% macro series_card(series, in_watchlist=False, lang='vf') %}
-<div class="ac" id="series-{{ series.url | hash }}">
-    <div class="ac-poster">
-        <img src="{{ series.cover_image or 'https://placehold.co/400x600/161625/ff6b6b?text=No+Image' }}"
-             alt="{{ series.title }}" loading="lazy" referrerpolicy="no-referrer"
-             onerror="this.src='https://placehold.co/400x600/161625/ff6b6b?text=Error'; this.onerror=null;">
-        <button class="ac-play"
-                hx-get="/api/anime/episodes?url={{ series.url | urlencode }}&lang={{ lang }}"
-                hx-target="#player-container" hx-swap="innerHTML">
-            <i class="fas fa-play"></i>
-        </button>
+{% macro series_card(series) %}
+<div class="hc"
+     @click="activeTab = 'series'; window.dispatchEvent(new CustomEvent('set-tab', { detail: { tab: 'series' } })); $nextTick(() => { const input = document.getElementById('seriesSearchInput'); if (input) { input.value = '{{ series.title | e }}'; htmx.trigger(input, 'keyup'); } });">
+    <div class="hc-poster">
+        <img src="{{ series.cover_image or 'https://placehold.co/400x600/202327/FF9F1C?text=No+Image' }}" alt="{{ series.title }}" loading="lazy" referrerpolicy="no-referrer"
+             onerror="this.src='https://placehold.co/400x600/202327/FF9F1C?text=Error'; this.onerror=null;">
+        {% if series.lang %}
+        <span class="hc-rating" style="text-transform: uppercase;">{{ series.lang }}</span>
+        {% endif %}
+        <span class="hc-play"><i class="fas fa-search"></i></span>
     </div>
-    <div class="ac-info">
-        <span class="ac-provider" style="--ac-color: var(--secondary)">{{ series.provider_id | upper if series.provider_id else 'FS7' }}</span>
-        <h3 class="ac-title" title="{{ series.title }}">{{ series.title }}</h3>
+    <div class="hc-info">
+        <span class="hc-src">{{ series.provider_id or 'FS7' }}</span>
+        <span class="hc-title">{{ series.title }}</span>
     </div>
 </div>
 {% endmacro %}
diff --git a/templates/components/series_releases_list.html b/templates/components/series_releases_list.html
new file mode 100644
index 0000000..9664f97
--- /dev/null
+++ b/templates/components/series_releases_list.html
@@ -0,0 +1,11 @@
+{% from "components/series_card.html" import series_card %}
+
+{% if releases %}
+    {% for series in releases %}
+        {{ series_card(series) }}
+    {% endfor %}
+{% else %}
+    <div class="empty-state">
+        <p>Aucune sortie recente trouvee.</p>
+    </div>
+{% endif %}
diff --git a/templates/components/series_search_results.html b/templates/components/series_search_results.html
index a7bee4b..5e3bf99 100644
--- a/templates/components/series_search_results.html
+++ b/templates/components/series_search_results.html
@@ -1,4 +1,4 @@
-{% set accent = "#ff6b6b" %}
+{% set accent = "#FF9F1C" %}
 {% set default_lang = settings.default_lang if settings else 'vf' %}
 
 {% set _groups = namespace(items={}) %}
@@ -28,9 +28,9 @@
             {% set first_url = group.providers[0].url %}
             <div class="sr-card" style="--sr-accent: {{ accent }};">
                 <a class="sr-poster-link" href="{{ first_url }}" target="_blank" rel="noopener">
-                    <img class="sr-poster-img" src="{{ group.cover or 'https://placehold.co/240x360/161625/ff6b6b?text=No+Image' }}"
+                    <img class="sr-poster-img" src="{{ group.cover or 'https://placehold.co/240x360/29274c/7e52a0?text=No+Image' }}"
                          alt="{{ group.title }}" loading="lazy" referrerpolicy="no-referrer"
-                         onerror="this.src='https://placehold.co/240x360/161625/ff6b6b?text=Error'; this.onerror=null;">
+                         onerror="this.src='https://placehold.co/240x360/29274c/7e52a0?text=Error'; this.onerror=null;">
                 </a>
                 <div class="sr-body">
                     <h3 class="sr-title">{{ group.title }}</h3>
@@ -93,32 +93,32 @@
 .sr-card {
     display: flex; gap: 20px;
     background: var(--bg-card); border-radius: var(--card-radius);
-    padding: 20px; border: 1px solid rgba(255,255,255,0.05);
+    padding: 20px; border: 1px solid #2a2d32;"
     transition: var(--transition);
 }
-.sr-card:hover { border-color: var(--sr-accent); box-shadow: 0 4px 24px rgba(0,0,0,0.4); }
-.sr-poster-link { flex-shrink: 0; display: block; width: 120px; aspect-ratio: 2/3; border-radius: 8px; overflow: hidden; background: #000; }
+.sr-card:hover { border-color: var(--sr-accent); }
+.sr-poster-link { flex-shrink: 0; display: block; width: 120px; aspect-ratio: 2/3; border-radius: 4px; overflow: hidden; background: #000; }
 .sr-poster-img { width: 100%; height: 100%; object-fit: cover; display: block; }
 .sr-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
 .sr-title { font-size: 1.1rem; font-weight: 700; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .sr-synopsis { font-size: 0.85rem; color: var(--text-dim); margin: 0; line-height: 1.5; }
 .sr-providers { display: flex; flex-wrap: wrap; gap: 6px; }
 .sr-provider-badge { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; padding: 4px 12px; border-radius: 20px; border: 1px solid var(--sr-accent); color: var(--sr-accent); background: transparent; cursor: pointer; transition: var(--transition); letter-spacing: 0.5px; text-decoration: none; }
-.sr-provider-badge:hover { background: var(--sr-accent); color: var(--bg-dark); }
+.sr-provider-badge:hover { background: var(--sr-accent); color: #fff; }
 .sr-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
-.sr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 16px; border-radius: 8px; font-size: 0.8rem; font-weight: 600; border: 1px solid rgba(255,255,255,0.1); cursor: pointer; transition: var(--transition); text-decoration: none; background: transparent; color: var(--text-main); min-height: 34px; }
-.sr-btn:hover { border-color: rgba(255,255,255,0.2); background: rgba(255,255,255,0.05); }
+.sr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 16px; border-radius: 4px; font-size: 0.8rem; font-weight: 600; border: 1px solid #2a2d32; cursor: pointer; transition: var(--transition); text-decoration: none; background: transparent; color: var(--text-main); min-height: 34px; }
+.sr-btn:hover { border-color: var(--text-main); background: var(--bg-card); }
 .sr-btn-dl { border-color: var(--secondary); color: var(--secondary); }
-.sr-btn-dl:hover { background: var(--secondary); color: var(--bg-dark); }
+.sr-btn-dl:hover { background: var(--secondary); color: #ffffff; }
 .sr-btn-watch { border-color: var(--sr-accent); color: var(--sr-accent); }
-.sr-btn-watch:hover { background: var(--sr-accent); color: var(--bg-dark); }
+.sr-btn-watch:hover { background: var(--sr-accent); color: #fff; }
 .sr-btn-follow { border-color: var(--accent); color: var(--accent); }
-.sr-btn-follow:hover { background: var(--accent); color: var(--bg-dark); }
-.sr-btn-followed { border-color: var(--accent); color: var(--accent); background: rgba(0,255,136,0.1); pointer-events: none; }
+.sr-btn-follow:hover { background: var(--accent); color: #fff; }
+.sr-btn-followed { border-color: var(--accent); color: var(--accent); background: rgba(255,191,105,0.1); pointer-events: none; }
 .sr-dropdown { position: relative; }
-.sr-dropdown-menu { position: absolute; top: calc(100% + 6px); left: 0; min-width: 200px; background: var(--bg-card); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 4px; z-index: 100; box-shadow: 0 8px 32px rgba(0,0,0,0.6); }
-.sr-dropdown-item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 10px 12px; border: none; background: transparent; color: var(--text-main); font-size: 0.8rem; cursor: pointer; border-radius: 6px; transition: var(--transition); text-align: left; }
-.sr-dropdown-item:hover { background: rgba(255,255,255,0.06); }
+.sr-dropdown-menu { position: absolute; top: calc(100% + 6px); left: 0; min-width: 200px; background: var(--bg-card); border: 1px solid #2a2d32; border-radius: 4px; padding: 4px; z-index: 100; }
+.sr-dropdown-item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 10px 12px; border: none; background: transparent; color: var(--text-main); font-size: 0.8rem; cursor: pointer; border-radius: 4px; transition: var(--transition); text-align: left; }
+.sr-dropdown-item:hover { background: var(--bg-elevated); }
 .sr-empty { text-align: center; padding: 100px 20px; color: var(--text-dim); }
 .sr-empty i { font-size: 4rem; margin-bottom: 20px; display: block; opacity: 0.2; }
 @media (max-width: 768px) {
diff --git a/templates/components/settings_section.html b/templates/components/settings_section.html
index a63606f..54e7e3d 100644
--- a/templates/components/settings_section.html
+++ b/templates/components/settings_section.html
@@ -4,7 +4,7 @@
     </div>
 
     <!-- General Preferences -->
-    <div class="settings-card card" style="margin-bottom: 30px; padding: 25px; background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid rgba(255,255,255,0.05);">
+    <div class="settings-card card" style="margin-bottom: 30px; padding: 25px; background: var(--bg-card); border-radius: var(--card-radius);    border: 1px solid #2a2d32;">
         <h3 style="margin-bottom: 20px; color: var(--primary);">General</h3>
         
         <form id="settings-form" class="settings-form">
@@ -43,7 +43,7 @@
     </div>
 
     <!-- Content Filters -->
-    <div class="settings-card card" style="margin-bottom: 30px; padding: 25px; background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid rgba(255,255,255,0.05);">
+    <div class="settings-card card" style="margin-bottom: 30px; padding: 25px; background: var(--bg-card); border-radius: var(--card-radius);    border: 1px solid #2a2d32;">
         <h3 style="margin-bottom: 20px; color: var(--primary);">Filtres de contenu</h3>
         
         <div class="form-group">
@@ -66,12 +66,12 @@
     </div>
 
     <!-- Categories -->
-    <div class="settings-card card" style="margin-bottom: 30px; padding: 25px; background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid rgba(255,255,255,0.05);">
+    <div class="settings-card card" style="margin-bottom: 30px; padding: 25px; background: var(--bg-card); border-radius: var(--card-radius);    border: 1px solid #2a2d32;">
         <h3 style="margin-bottom: 20px; color: var(--primary);">Categories</h3>
         <p style="color: var(--text-dim); font-size: 13px; margin-bottom: 15px;">Activez ou desactivez les categories. Au moins une doit rester active.</p>
         
         <div style="display: flex; gap: 15px; flex-wrap: wrap;">
-            <label class="toggle-card" style="flex: 1; min-width: 200px; padding: 15px; background: rgba(255,255,255,0.02); border-radius: 10px; border: 1px solid rgba(255,255,255,0.05); display: flex; align-items: center; justify-content: space-between; cursor: pointer;">
+            <label class="toggle-card" style="flex: 1; min-width: 200px; padding: 15px; background: var(--bg-elevated); border-radius: 4px; border: 1px solid var(--secondary); display: flex; align-items: center; justify-content: space-between; cursor: pointer;">
                 <div>
                     <div style="font-weight: 600; font-size: 1.1rem;">Animes</div>
                     <div style="font-size: 0.8rem; color: var(--text-dim);">Films et series anime</div>
@@ -79,7 +79,7 @@
                 <input type="checkbox" id="anime_enabled" {% if settings.anime_enabled %}checked{% endif %} onchange="toggleCategory('anime_enabled', this.checked)" style="width: 20px; height: 20px; cursor: pointer; accent-color: var(--primary);">
             </label>
             
-            <label class="toggle-card" style="flex: 1; min-width: 200px; padding: 15px; background: rgba(255,255,255,0.02); border-radius: 10px; border: 1px solid rgba(255,255,255,0.05); display: flex; align-items: center; justify-content: space-between; cursor: pointer;">
+            <label class="toggle-card" style="flex: 1; min-width: 200px; padding: 15px; background: var(--bg-elevated); border-radius: 4px; border: 1px solid var(--secondary); display: flex; align-items: center; justify-content: space-between; cursor: pointer;">
                 <div>
                     <div style="font-weight: 600; font-size: 1.1rem;">Series TV</div>
                     <div style="font-size: 0.8rem; color: var(--text-dim);">Series americaines et europeennes</div>
@@ -89,8 +89,70 @@
         </div>
     </div>
 
+    <!-- Content Weight -->
+    <div class="settings-card card" style="margin-bottom: 30px; padding: 25px; background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid #2a2d32;">
+        <h3 style="margin-bottom: 5px; color: var(--primary);">Equilibre du fil d'actualite</h3>
+        <p style="color: var(--text-dim); font-size: 13px; margin-bottom: 20px;">
+            Definissez la proportion d'animes et de series affiches dans les recommandations et dernieres sorties.
+        </p>
+
+        <div class="form-group">
+            <label for="content_weight_mode" style="font-weight: 600; margin-bottom: 10px; display: block;">Mode</label>
+            <select name="content_weight_mode" id="content_weight_mode" class="btn btn-secondary btn-block" style="text-align: left; padding: 12px 15px;" onchange="onWeightModeChange(this.value)">
+                <option value="auto" {% if settings.content_weight_mode == 'auto' %}selected{% endif %}>Automatique (basé sur vos telechargements)</option>
+                <option value="manual" {% if settings.content_weight_mode == 'manual' %}selected{% endif %}>Manuel</option>
+            </select>
+        </div>
+
+        <!-- Auto mode info -->
+        <div id="weight-auto-info" style="margin-top: 15px; padding: 15px; background: var(--bg-elevated); border-radius: 4px; border: 1px solid var(--secondary); display: {% if settings.content_weight_mode == 'auto' %}block{% else %}none{% endif %};">
+            <div style="display: flex; align-items: center; gap: 10px; margin-bottom: 10px;">
+                <i class="fas fa-chart-pie" style="color: var(--primary);"></i>
+                <span style="font-weight: 600;">Analyse de vos telechargements</span>
+            </div>
+            <div id="weight-auto-details" style="font-size: 14px; color: var(--text-dim);">
+                Chargement...
+            </div>
+        </div>
+
+        <!-- Manual mode controls -->
+        <div id="weight-manual-controls" style="margin-top: 15px; display: {% if settings.content_weight_mode == 'manual' %}block{% else %}none{% endif %};">
+            <div style="display: flex; gap: 15px; align-items: center;">
+                <div style="flex: 1;">
+                    <label for="content_weight_anime" style="font-weight: 600; font-size: 0.9rem; display: block; margin-bottom: 8px;">
+                        <i class="fas fa-dragon" style="color: var(--primary);"></i> Poids Animes
+                    </label>
+                    <input type="range" id="content_weight_anime_range" min="0" max="5" step="1" value="{{ settings.content_weight_anime }}" 
+                           style="width: 100%; accent-color: var(--primary);"
+                           oninput="document.getElementById('content_weight_anime').value = this.value; updateWeightPreview();">
+                    <div style="display: flex; justify-content: space-between; font-size: 11px; color: var(--text-dim); margin-top: 2px;">
+                        <span>0</span><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span>
+                    </div>
+                </div>
+                <div style="flex: 1;">
+                    <label for="content_weight_series" style="font-weight: 600; font-size: 0.9rem; display: block; margin-bottom: 8px;">
+                        <i class="fas fa-tv" style="color: #6CB4EE;"></i> Poids Series
+                    </label>
+                    <input type="range" id="content_weight_series_range" min="0" max="5" step="1" value="{{ settings.content_weight_series }}" 
+                           style="width: 100%; accent-color: #6CB4EE;"
+                           oninput="document.getElementById('content_weight_series').value = this.value; updateWeightPreview();">
+                    <div style="display: flex; justify-content: space-between; font-size: 11px; color: var(--text-dim); margin-top: 2px;">
+                        <span>0</span><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span>
+                    </div>
+                </div>
+            </div>
+            <input type="hidden" id="content_weight_anime" value="{{ settings.content_weight_anime }}">
+            <input type="hidden" id="content_weight_series" value="{{ settings.content_weight_series }}">
+            <div id="weight-preview" style="margin-top: 15px; padding: 12px; background: var(--bg-elevated); border-radius: 4px; text-align: center; font-size: 14px;">
+            </div>
+            <button class="btn btn-primary" style="margin-top: 15px; width: 100%;" onclick="saveManualWeights()">
+                <i class="fas fa-balance-scale"></i> Appliquer
+            </button>
+        </div>
+    </div>
+
     <!-- Providers Management -->
-    <div class="settings-card card" style="padding: 25px; background: var(--bg-card); border-radius: var(--card-radius); border: 1px solid rgba(255,255,255,0.05);">
+    <div class="settings-card card" style="padding: 25px; background: var(--bg-card); border-radius: var(--card-radius);    border: 1px solid #2a2d32;">
         <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;">
             <h3 style="margin: 0; color: var(--primary);">Disponibilite des Fournisseurs</h3>
             <button class="btn btn-secondary btn-small" hx-post="/api/providers/health/check" hx-swap="none">
@@ -100,13 +162,13 @@
 
         <div class="providers-settings-list" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 15px;">
             {% for provider in providers %}
-            <div class="provider-status-card" style="padding: 15px; background: rgba(255,255,255,0.02); border-radius: 10px; border: 1px solid rgba(255,255,255,0.05); display: flex; align-items: center; justify-content: space-between;">
+            <div class="provider-status-card" style="padding: 15px; background: var(--bg-elevated); border-radius: 4px; border: 1px solid var(--secondary); display: flex; align-items: center; justify-content: space-between;">
                 <div style="display: flex; align-items: center; gap: 12px;">
                     <span style="font-size: 1.5rem;">{{ provider.icon }}</span>
                     <div>
                         <div style="font-weight: 600;">{{ provider.name }}</div>
                         <div style="font-size: 0.75rem; display: flex; align-items: center; gap: 5px;">
-                            <span class="status-dot" style="width: 8px; height: 8px; border-radius: 50%; background: {% if provider.status == 'up' %}var(--accent){% elif provider.status == 'down' %}var(--danger){% else %}#aaa{% endif %};"></span>
+                            <span class="status-dot" style="width: 8px; height: 8px; border-radius: 50%; background: {% if provider.status == 'up' %}var(--accent){% elif provider.status == 'down' %}var(--danger){% else %}var(--text-muted){% endif %};"></span>
                             <span style="color: {% if provider.status == 'up' %}var(--accent){% elif provider.status == 'down' %}var(--danger){% else %}var(--text-dim){% endif %}; text-transform: uppercase; font-weight: 800;">
                                 {{ provider.status | upper }}
                             </span>
@@ -127,93 +189,6 @@
     </div>
 </div>
 
-<script>
-function getToken() {
-    return localStorage.getItem('auth_token') || null;
-}
-
-async function saveSettings() {
-    const token = getToken();
-    if (!token) return;
-    
-    const data = {
-        default_lang: document.getElementById('default_lang').value,
-        theme: document.getElementById('theme').value,
-        download_dir: document.getElementById('download_dir').value,
-    };
-    
-    try {
-        const r = await fetch('/api/settings', {
-            method: 'PATCH',
-            headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' },
-            body: JSON.stringify(data)
-        });
-        if (r.ok) {
-            showToast('Preferences enregistrees', 'success');
-        }
-    } catch (e) {
-        showToast('Erreur: ' + e.message, 'error');
-    }
-}
-
-async function saveFilter(field, value) {
-    const token = getToken();
-    if (!token) return;
-    
-    try {
-        const r = await fetch('/api/settings', {
-            method: 'PATCH',
-            headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' },
-            body: JSON.stringify({ [field]: value })
-        });
-        if (r.ok) {
-            showToast('Filtre mis a jour', 'success');
-        }
-    } catch (e) {
-        showToast('Erreur: ' + e.message, 'error');
-    }
-}
-
-async function toggleCategory(field, value) {
-    const token = getToken();
-    if (!token) return;
-    
-    // Prevent disabling both
-    if (!value) {
-        const otherField = field === 'anime_enabled' ? 'series_enabled' : 'anime_enabled';
-        const otherCheckbox = document.getElementById(otherField);
-        if (otherCheckbox && !otherCheckbox.checked) {
-            showToast('Au moins une categorie doit rester active', 'error');
-            document.getElementById(field).checked = true;
-            return;
-        }
-    }
-    
-    try {
-        const r = await fetch('/api/settings', {
-            method: 'PATCH',
-            headers: { 'Authorization': 'Bearer ' + token, 'Content-Type': 'application/json' },
-            body: JSON.stringify({ [field]: value })
-        });
-        if (!r.ok) {
-            const err = await r.json().catch(() => ({}));
-            showToast(err.detail || 'Erreur', 'error');
-            document.getElementById(field).checked = !value;
-        } else {
-            showToast('Categorie ' + (value ? 'activee' : 'desactivee'), 'success');
-        }
-    } catch (e) {
-        showToast('Erreur: ' + e.message, 'error');
-        document.getElementById(field).checked = !value;
-    }
-}
-
-function showToast(message, type) {
-    const event = new CustomEvent('show-toast', { detail: { message, type } });
-    document.dispatchEvent(event);
-}
-</script>
-
 <style>
 .settings-form label {
     display: block;
@@ -223,6 +198,5 @@ function showToast(message, type) {
 }
 .status-dot {
     display: inline-block;
-    box-shadow: 0 0 5px currentColor;
 }
 </style>
diff --git a/templates/components/toast_container.html b/templates/components/toast_container.html
index 4470a69..61d2193 100644
--- a/templates/components/toast_container.html
+++ b/templates/components/toast_container.html
@@ -1,10 +1,12 @@
 <div id="toast-container" 
      class="toast-container"
+     style="pointer-events: none;"
      x-data="{ toasts: [] }"
      @show-toast.window="toasts.push({ id: Date.now(), message: $event.detail.message, type: $event.detail.type || 'info' }); setTimeout(() => { toasts = toasts.filter(t => t.id !== toasts[0].id) }, 5000)">
     
     <template x-for="toast in toasts" :key="toast.id">
         <div class="toast" 
+             style="pointer-events: auto;"
              :class="'toast-' + toast.type"
              x-show="true"
              x-transition:enter="toast-enter"
@@ -33,22 +35,25 @@
     display: flex;
     flex-direction: column;
     gap: 10px;
+    pointer-events: none;
+    max-height: 80vh;
+    overflow: hidden;
 }
 .toast {
     min-width: 250px;
     padding: 12px 16px;
-    border-radius: 8px;
-    background: #2d2d2d;
-    color: white;
-    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
+    border-radius: 4px;
+    background: var(--bg-card);
+    color: var(--text-main);
+    border: 1px solid var(--secondary);
     display: flex;
     justify-content: space-between;
     align-items: center;
-    border-left: 4px solid #ccc;
+    border-left: 4px solid var(--secondary);
 }
-.toast-success { border-left-color: #4caf50; }
-.toast-error { border-left-color: #f44336; }
-.toast-info { border-left-color: #2196f3; }
+.toast-success { border-left-color: #2d936c; }
+.toast-error { border-left-color: #e63946; }
+.toast-info { border-left-color: #FFBF69; }
 .toast-content { display: flex; align-items: center; gap: 10px; }
 .toast-close { background: none; border: none; color: #aaa; cursor: pointer; }
 </style>
diff --git a/templates/components/watchlist_items_list.html b/templates/components/watchlist_items_list.html
index d229bec..7018cb6 100644
--- a/templates/components/watchlist_items_list.html
+++ b/templates/components/watchlist_items_list.html
@@ -167,7 +167,7 @@
 .filter-tabs {
     display: flex;
     gap: 8px;
-    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+    border-bottom: 1px solid #2a2d32;
     padding-bottom: 12px;
     margin-bottom: 8px;
 }
@@ -188,7 +188,7 @@
 }
 
 .filter-tab:hover {
-    background: rgba(255, 255, 255, 0.05);
+    background: var(--bg-elevated);
     color: var(--text-main);
 }
 
@@ -211,14 +211,12 @@
     background: var(--bg-card);
     border-radius: var(--card-radius);
     padding: 16px;
-    border: 1px solid rgba(255, 255, 255, 0.05);
+    border: 1px solid #2a2d32;
     transition: var(--transition);
 }
 
 .watchlist-card:hover {
     border-color: var(--primary);
-    box-shadow: 0 4px 24px rgba(0, 217, 255, 0.15);
-    transform: translateY(-2px);
 }
 
 /* Poster */
@@ -254,22 +252,22 @@
 }
 
 .poster-badge.active {
-    background: rgba(0, 255, 136, 0.9);
-    color: var(--bg-dark);
+    background: #2d936c;
+    color: #fff;
 }
 
 .poster-badge.paused {
-    background: rgba(255, 193, 7, 0.9);
-    color: var(--bg-dark);
+    background: #f4a261;
+    color: #15171A;
 }
 
 .poster-badge.completed {
-    background: rgba(156, 39, 176, 0.9);
-    color: var(--bg-dark);
+    background: #FF9F1C;
+    color: #15171A;
 }
 
 .poster-badge.archived {
-    background: rgba(255, 255, 255, 0.15);
+    background: rgba(206, 208, 206, 0.2);
     color: var(--text-dim);
 }
 
@@ -279,7 +277,7 @@
     left: 8px;
     padding: 4px 10px;
     border-radius: 20px;
-    background: rgba(0, 217, 255, 0.9);
+    background: #FF9F1C;
     color: var(--bg-dark);
     font-size: 0.65rem;
     font-weight: 700;
@@ -327,21 +325,21 @@
 }
 
 .meta-provider {
-    background: rgba(0, 217, 255, 0.15);
+    background: rgba(255, 191, 105, 0.1);
     color: var(--primary);
-    border: 1px solid rgba(0, 217, 255, 0.3);
+    border: 1px solid rgba(255, 191, 105, 0.3);
 }
 
 .meta-lang {
-    background: rgba(255, 107, 107, 0.15);
-    color: var(--secondary);
-    border: 1px solid rgba(255, 107, 107, 0.3);
+    background: rgba(206, 208, 206, 0.3);
+    color: var(--text-dim);
+    border: 1px solid var(--text-dim);
 }
 
 .meta-quality {
-    background: rgba(0, 255, 136, 0.15);
-    color: var(--accent);
-    border: 1px solid rgba(0, 255, 136, 0.3);
+    background: rgba(45, 147, 108, 0.1);
+    color: var(--success);
+    border: 1px solid rgba(45, 147, 108, 0.3);
 }
 
 .watchlist-synopsis {
@@ -375,7 +373,7 @@
     gap: 6px;
     margin-top: auto;
     padding-top: 8px;
-    border-top: 1px solid rgba(255, 255, 255, 0.05);
+    border-top: 1px solid #2a2d32;
 }
 
 .action-btn {
@@ -389,12 +387,12 @@
     font-size: 0.85rem;
     cursor: pointer;
     transition: var(--transition);
-    background: rgba(255, 255, 255, 0.05);
+    background: var(--bg-elevated);
     color: var(--text-dim);
 }
 
 .action-btn:hover {
-    background: rgba(255, 255, 255, 0.1);
+    background: var(--secondary);
     color: var(--text-main);
 }
 
@@ -415,11 +413,11 @@
 }
 
 .btn-complete {
-    color: #9c27b0;
+    color: #FFBF69;
 }
 
 .btn-complete:hover {
-    background: rgba(156, 39, 176, 0.15);
+    background: rgba(255, 191, 105, 0.15);
 }
 
 .btn-delete {
@@ -436,7 +434,7 @@
     padding: 80px 40px;
     background: var(--bg-card);
     border-radius: var(--card-radius);
-    border: 1px dashed rgba(255, 255, 255, 0.1);
+    border: 1px dashed #2a2d32;
 }
 
 .watchlist-empty i {
diff --git a/templates/components/watchlist_section.html b/templates/components/watchlist_section.html
index 73469fc..617db68 100644
--- a/templates/components/watchlist_section.html
+++ b/templates/components/watchlist_section.html
@@ -1,6 +1,6 @@
 <div class="section-container">
     <div class="section-header">
-        <h2>📋 Ma Watchlist</h2>
+        <h2><i class="fa-solid fa-clipboard-list"></i> Ma Watchlist</h2>
         <div class="header-actions">
             <button class="btn btn-sm btn-primary" hx-post="/api/watchlist/check" hx-swap="none">
                 <i class="fas fa-sync"></i> Vérifier épisodes
@@ -35,15 +35,15 @@
     display: flex;
     gap: 15px;
     padding: 15px;
-    background: rgba(255, 255, 255, 0.05);
-    border-radius: 12px;
-    border: 1px solid rgba(255, 255, 255, 0.1);
-    transition: transform 0.2s;
+    background: var(--bg-card);
+    border-radius: 4px;
+    border: 1px solid var(--secondary);
+    transition: border-color 0.2s;
 }
-.watchlist-item:hover { transform: translateY(-3px); border-color: #00d9ff; }
-.item-poster img { width: 80px; height: 120px; border-radius: 8px; object-fit: cover; }
+.watchlist-item:hover { border-color: #FFBF69; }
+.item-poster img { width: 80px; height: 120px; border-radius: 4px; object-fit: cover; }
 .item-info { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
-.item-info h3 { font-size: 1rem; margin-bottom: 5px; color: #fff; }
+.item-info h3 { font-size: 1rem; margin-bottom: 5px; color: #F2F2F2; }
 .item-meta { display: flex; gap: 8px; margin-bottom: 8px; }
 .item-actions { display: flex; gap: 10px; margin-top: 10px; }
 </style>
diff --git a/templates/index.html b/templates/index.html
index c6a81d7..f412c13 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -46,7 +46,7 @@
     <!-- Player container for HTMX injections -->
     <div id="player-container"></div>
 
-    <hr style="border: none; border-top: 1px solid rgba(255,255,255,0.05); margin: 40px 0;">
+    <hr style="border: none; border-top: 1px solid #2a2d32; margin: 40px 0;">
 
     <!-- Latest Releases Section - Anime only -->
     <div class="section-header">
@@ -97,27 +97,13 @@
     <!-- Series search results -->
     <div id="seriesSearchResults" style="margin-bottom: 40px;"></div>
 
-    <hr style="border: none; border-top: 1px solid rgba(255,255,255,0.05); margin: 40px 0;">
-
-    <!-- Recommendations Section - Series only -->
-    <div class="section-header">
-        <h2>Recommande pour vous</h2>
-        <button class="btn btn-secondary btn-small" 
-                hx-get="/api/recommendations?content_type=series&html=1" 
-                hx-target="#seriesRecommendationsList">
-            <svg fill="none" stroke="currentColor" viewBox="0 0 24 24" style="width:14px;height:14px;">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path>
-            </svg>
-            Actualiser
-        </button>
-    </div>
-    <div id="seriesRecommendationsList" class="recommendations-carousel" style="margin-bottom: 40px;" hx-get="/api/recommendations?content_type=series&html=1" hx-trigger="load delay:600ms"></div>
+    <hr style="border: none; border-top: 1px solid #2a2d32; margin: 40px 0;">
 
     <!-- Latest Releases Section - Series only -->
-    <div class="section-header" style="margin-top: 40px;">
+    <div class="section-header">
         <h2>Dernieres sorties Series TV</h2>
         <button class="btn btn-secondary btn-small" 
-                hx-get="/api/releases/latest?content_type=series&html=1" 
+                hx-get="/api/series/latest?html=1" 
                 hx-target="#seriesReleasesList">
             <svg fill="none" stroke="currentColor" viewBox="0 0 24 24" style="width:14px;height:14px;">
                 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path>
@@ -125,7 +111,7 @@
             Actualiser
         </button>
     </div>
-    <div id="seriesReleasesList" class="releases-carousel" hx-get="/api/releases/latest?content_type=series&html=1" hx-trigger="load delay:700ms"></div>
+    <div id="seriesReleasesList" class="releases-carousel" hx-get="/api/series/latest?html=1" hx-trigger="load delay:700ms"></div>
 </div>
 
 <div id="tab-watchlist" class="tab-content" x-show="activeTab === 'watchlist'">
diff --git a/templates/login.html b/templates/login.html
index 7d4ed8f..64d1912 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -8,7 +8,7 @@
 </head>
 <body>
     <div class="auth-container">
-        <h1 class="auth-title">🎬 Ohm Stream</h1>
+        <h1 class="auth-title"><i class="fa-solid fa-film"></i> Ohm Stream</h1>
 
         <div class="auth-tabs">
             <div class="auth-tab active" data-tab="login">Connexion</div>
diff --git a/templates/player.html b/templates/player.html
index 4985ae2..1afe5d0 100644
--- a/templates/player.html
+++ b/templates/player.html
@@ -14,13 +14,13 @@
 
         body {
             font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
-            background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
+            background: #15171A;
             min-height: 100vh;
             display: flex;
             flex-direction: column;
             align-items: center;
             padding: 20px;
-            color: #fff;
+            color: #F2F2F2;
         }
 
         .container {
@@ -36,13 +36,14 @@
         .header h1 {
             font-size: 1.5rem;
             margin-bottom: 10px;
-            color: #00d9ff;
+            color: #FFBF69;
         }
 
         .video-info {
-            background: rgba(255, 255, 255, 0.05);
+            background: #202327;
             padding: 15px 20px;
-            border-radius: 10px;
+            border-radius: 4px;
+            border: 1px solid #2a2d32;
             margin-bottom: 20px;
             display: flex;
             justify-content: space-between;
@@ -57,19 +58,18 @@
         }
 
         .video-info .filesize {
-            color: #aaa;
+            color: #8a8f98;
             font-size: 0.9rem;
         }
 
         .video-wrapper {
             background: #000;
-            border-radius: 15px;
+            border-radius: 4px;
             overflow: hidden;
-            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
         }
 
         .plyr {
-            border-radius: 15px;
+            border-radius: 4px;
         }
 
         .controls {
@@ -82,13 +82,13 @@
 
         .btn {
             padding: 12px 24px;
-            background: rgba(255, 255, 255, 0.1);
-            border: 1px solid rgba(255, 255, 255, 0.2);
-            color: #fff;
-            border-radius: 8px;
+            background: #202327;
+            border: 1px solid #2a2d32;
+            color: #F2F2F2;
+            border-radius: 4px;
             cursor: pointer;
             font-size: 0.9rem;
-            transition: all 0.3s ease;
+            transition: all 0.2s ease;
             text-decoration: none;
             display: inline-flex;
             align-items: center;
@@ -96,28 +96,28 @@
         }
 
         .btn:hover {
-            background: rgba(0, 217, 255, 0.2);
-            border-color: #00d9ff;
-            transform: translateY(-2px);
+            background: #2a2d32;
+            border-color: #FFBF69;
         }
 
         .btn-primary {
-            background: linear-gradient(135deg, #00d9ff 0%, #00ff88 100%);
-            border: none;
-            color: #000;
+            background: #FF9F1C;
+            border: 1px solid #FF9F1C;
+            color: #fff;
             font-weight: 600;
         }
 
         .btn-primary:hover {
-            background: linear-gradient(135deg, #00ff88 0%, #00d9ff 100%);
+            background: #e08a15;
+            border-color: #e08a15;
         }
 
         .error-message {
-            background: rgba(255, 71, 87, 0.1);
-            border: 1px solid #ff4757;
-            color: #ff4757;
+            background: rgba(230, 57, 70, 0.1);
+            border: 1px solid #e63946;
+            color: #e63946;
             padding: 20px;
-            border-radius: 10px;
+            border-radius: 4px;
             text-align: center;
             margin-top: 20px;
         }
@@ -135,7 +135,7 @@
 <body>
     <div class="container">
         <div class="header">
-            <h1>🎬 Ohm Stream Player</h1>
+            <h1><i class="fa-solid fa-film"></i> Ohm Stream Player</h1>
         </div>
 
         <div class="video-info">
@@ -151,7 +151,7 @@
 
         <div class="controls">
             <a href="/web" class="btn">← Retour à l'accueil</a>
-            <a href="/stream/{{ filename }}" class="btn btn-primary" download>⬇️ Télécharger</a>
+            <a href="/stream/{{ filename }}" class="btn btn-primary" download><i class="fa-solid fa-download"></i> Télécharger</a>
         </div>
     </div>
 
@@ -169,8 +169,8 @@
             wrapper.innerHTML = `
                 <div class="error-message">
                     Erreur lors de la lecture du flux vidéo.<br>
-                    <a href="/video/{{ task_id }}" style="color: #00d9ff; text-decoration: underline;">Réessayer</a> ou 
-                    <a href="/stream/{{ filename }}" style="color: #00d9ff; text-decoration: underline;" download>Télécharger</a>
+                    <a href="/video/{{ task_id }}" style="color: #FF9F1C; text-decoration: underline;">Réessayer</a> ou 
+                    <a href="/stream/{{ filename }}" style="color: #FF9F1C; text-decoration: underline;" download>Télécharger</a>
                 </div>
             `;
         });
diff --git a/templates/watchlist.html b/templates/watchlist.html
index ffae2cb..bb6dea6 100644
--- a/templates/watchlist.html
+++ b/templates/watchlist.html
@@ -10,29 +10,29 @@
 <body class="watchlist-body">
     <!-- Main Header -->
     <div style="text-align: center; margin-bottom: 20px;">
-        <h1 style="background: linear-gradient(45deg, #00d9ff, #00ff88); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 32px; margin: 0;">⚡ Ohm Stream Downloader</h1>
-        <p style="color: #888; font-size: 14px; margin: 5px 0 0;">Téléchargez vos vidéos, animes et séries</p>
+        <h1 style="color: #FF9F1C; font-size: 32px; margin: 0;"><i class="fa-solid fa-bolt"></i> Ohm Stream Downloader</h1>
+        <p style="color: #8a8f98; font-size: 14px; margin: 5px 0 0;">Téléchargez vos vidéos, animes et séries</p>
     </div>
     
     <!-- User Info -->
-    <div id="userInfo" style="display: none; max-width: 1200px; margin: 0 auto 15px; padding: 10px; background: rgba(0,217,255,0.1); border-radius: 8px; display: flex; justify-content: space-between; align-items: center;">
-        <span style="color: #00d9ff;">👤 Connecté</span>
-        <button class="btn-secondary btn-small" onclick="handleLogout()">🚪 Déconnexion</button>
+    <div id="userInfo" style="display: none; max-width: 1200px; margin: 0 auto 15px; padding: 10px; background: rgba(255,191,105,0.1); border: 1px solid #FF9F1C; border-radius: 4px;">
+        <span style="color: #FF9F1C;"><i class="fa-solid fa-user"></i> Connecté</span>
+        <button class="btn-secondary btn-small" onclick="handleLogout()"><i class="fa-solid fa-right-from-bracket"></i> Déconnexion</button>
     </div>
     
     <!-- Tabs -->
-    <div class="tabs" style="max-width: 1200px; margin: 0 auto 20px; display: flex; gap: 5px; border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 10px;">
-        <button class="tab" onclick="window.location.href='/web'">🏠 Accueil</button>
-        <button class="tab" onclick="window.location.href='/web#anime'">🎬 Anime</button>
-        <button class="tab" onclick="window.location.href='/web#series'">📺 Série</button>
-        <button class="tab" onclick="window.location.href='/web#providers'">📦 Fournisseurs</button>
-        <button class="tab active" onclick="window.location.href='/watchlist'">📋 Watchlist</button>
+    <div class="tabs" style="max-width: 1200px; margin: 0 auto 20px; display: flex; gap: 5px; border-bottom: 1px solid #2a2d32; padding-bottom: 10px;">
+        <button class="tab" onclick="window.location.href='/web'"><i class="fa-solid fa-house"></i> Accueil</button>
+        <button class="tab" onclick="window.location.href='/web#anime'"><i class="fa-solid fa-film"></i> Anime</button>
+        <button class="tab" onclick="window.location.href='/web#series'"><i class="fa-solid fa-tv"></i> Série</button>
+        <button class="tab" onclick="window.location.href='/web#providers'"><i class="fa-solid fa-box"></i> Fournisseurs</button>
+        <button class="tab active" onclick="window.location.href='/watchlist'"><i class="fa-solid fa-clipboard-list"></i> Watchlist</button>
     </div>
     
     <div class="watchlist-container">
         <!-- Header -->
         <div class="watchlist-header">
-            <h1>📋 Ma Watchlist</h1>
+            <h1><i class="fa-solid fa-clipboard-list"></i> Ma Watchlist</h1>
             <p>Suivez vos animes préférés et téléchargez automatiquement les nouveaux épisodes</p>
             <button type="button" class="btn-secondary watchlist-header-back-btn" onclick="window.location.href = '/web'">
                 ← Retour à l'accueil
@@ -43,21 +43,21 @@
         <div class="scheduler-status" id="schedulerStatus">
             <div class="scheduler-status-header">
                 <div>
-                    <h3>⏰ Planificateur Automatique</h3>
+                    <h3><i class="fa-solid fa-clock"></i> Planificateur Automatique</h3>
                     <div id="nextRunInfo" class="next-run-info">Chargement...</div>
                 </div>
                 <div class="scheduler-controls">
                     <button id="startSchedulerBtn" class="btn-primary btn-small watchlist-btn-small" onclick="handleStartScheduler()" style="display:none;">
-                        ▶️ Démarrer
+                        <i class="fa-solid fa-play"></i> Démarrer
                     </button>
                     <button id="stopSchedulerBtn" class="btn-secondary btn-small watchlist-btn-small" onclick="handleStopScheduler()" style="display:none;">
-                        ⏸️ Arrêter
+                        <i class="fa-solid fa-pause"></i> Arrêter
                     </button>
                     <button class="btn-secondary btn-small watchlist-btn-small" onclick="handleCheckAll()">
-                        🔍 Vérifier tout
+                        <i class="fa-solid fa-magnifying-glass"></i> Vérifier tout
                     </button>
                     <button class="btn-secondary btn-small watchlist-btn-small" onclick="handleOpenSettings()">
-                        ⚙️ Paramètres
+                        <i class="fa-solid fa-gear"></i> Paramètres
                     </button>
                 </div>
             </div>
@@ -161,17 +161,17 @@
 
                 if (status.next_run) {
                     const nextRun = new Date(status.next_run);
-                    nextRunInfo.innerHTML = `✓ En cours<br>Prochaine vérification: ${nextRun.toLocaleString('fr-FR')}`;
+                    nextRunInfo.innerHTML = `<i class="fa-solid fa-check"></i> En cours<br>Prochaine vérification: ${nextRun.toLocaleString('fr-FR')}`;
                 } else {
                     // Scheduler running but no next_run yet (just started)
                     const interval = status.settings?.check_interval_hours || 6;
-                    nextRunInfo.innerHTML = `✓ En cours<br>Vérification toutes les ${interval}h`;
+                    nextRunInfo.innerHTML = `<i class="fa-solid fa-check"></i> En cours<br>Vérification toutes les ${interval}h`;
                 }
             } else {
                 // Update buttons if they exist
                 if (startBtn) startBtn.style.display = 'inline-block';
                 if (stopBtn) stopBtn.style.display = 'none';
-                nextRunInfo.innerHTML = '⏸️ Arrêté';
+                nextRunInfo.innerHTML = '<i class="fa-solid fa-pause"></i> Arrêté';
             }
         }
 
@@ -198,10 +198,10 @@
             try {
                 await startScheduler();
                 await loadSchedulerStatus();
-                alert('✅ Planificateur démarré!');
+                alert('Planificateur démarré !');
             } catch (error) {
                 console.error('Error starting scheduler:', error);
-                alert(`❌ Erreur: ${error.message}`);
+                alert(`Erreur : ${error.message}`);
             }
         }
 
@@ -212,10 +212,10 @@
             try {
                 await stopScheduler();
                 await loadSchedulerStatus();
-                alert('✅ Planificateur arrêté!');
+                alert('Planificateur arrêté !');
             } catch (error) {
                 console.error('Error stopping scheduler:', error);
-                alert(`❌ Erreur: ${error.message}`);
+                alert(`Erreur : ${error.message}`);
             }
         }
 
@@ -228,7 +228,7 @@
                 await loadSchedulerStatus();
             } catch (error) {
                 console.error('Error checking all:', error);
-                alert(`❌ Erreur: ${error.message}`);
+                alert(`Erreur : ${error.message}`);
             }
         }
 
@@ -246,7 +246,7 @@
                 document.body.appendChild(modalContainer);
             } catch (error) {
                 console.error('Error loading settings:', error);
-                alert(`❌ Erreur: ${error.message}`);
+                alert(`Erreur : ${error.message}`);
             }
         }
 
diff --git a/tests/auto/results/report.md b/tests/auto/results/report.md
new file mode 100644
index 0000000..0d762ed
--- /dev/null
+++ b/tests/auto/results/report.md
@@ -0,0 +1,28 @@
+# Ohm Streaming - Automated Test Report
+**Date:** 2026-04-09T15:34:39.316Z
+**Duration:** 62.0s
+**Base URL:** http://127.0.0.1:3000
+
+## Summary
+
+| Metric | Value |
+|--------|-------|
+| ✅ Passed | 30 |
+| ❌ Failed | 0 |
+| 📊 Total | 30 |
+| 📊 Pass Rate | 100.0% |
+
+## All tests passed!
+
+## Screenshots
+
+- ![](screenshots/01_landing_page.png)
+- ![](screenshots/02_login_page.png)
+- ![](screenshots/03_tab_anime.png)
+- ![](screenshots/03_tab_downloads.png)
+- ![](screenshots/03_tab_home.png)
+- ![](screenshots/03_tab_providers.png)
+- ![](screenshots/03_tab_series.png)
+- ![](screenshots/03_tab_settings.png)
+- ![](screenshots/03_tab_watchlist.png)
+- ![](screenshots/07_mobile_home.png)
diff --git a/tests/auto/results/screenshots/01_landing_page.png b/tests/auto/results/screenshots/01_landing_page.png
new file mode 100644
index 0000000..74f712e
Binary files /dev/null and b/tests/auto/results/screenshots/01_landing_page.png differ
diff --git a/tests/auto/results/screenshots/02_login_page.png b/tests/auto/results/screenshots/02_login_page.png
new file mode 100644
index 0000000..4c3d883
Binary files /dev/null and b/tests/auto/results/screenshots/02_login_page.png differ
diff --git a/tests/auto/results/screenshots/03_tab_anime.png b/tests/auto/results/screenshots/03_tab_anime.png
new file mode 100644
index 0000000..6db0ed3
Binary files /dev/null and b/tests/auto/results/screenshots/03_tab_anime.png differ
diff --git a/tests/auto/results/screenshots/03_tab_downloads.png b/tests/auto/results/screenshots/03_tab_downloads.png
new file mode 100644
index 0000000..a1a3a5a
Binary files /dev/null and b/tests/auto/results/screenshots/03_tab_downloads.png differ
diff --git a/tests/auto/results/screenshots/03_tab_home.png b/tests/auto/results/screenshots/03_tab_home.png
new file mode 100644
index 0000000..41d7174
Binary files /dev/null and b/tests/auto/results/screenshots/03_tab_home.png differ
diff --git a/tests/auto/results/screenshots/03_tab_providers.png b/tests/auto/results/screenshots/03_tab_providers.png
new file mode 100644
index 0000000..2d79fe3
Binary files /dev/null and b/tests/auto/results/screenshots/03_tab_providers.png differ
diff --git a/tests/auto/results/screenshots/03_tab_series.png b/tests/auto/results/screenshots/03_tab_series.png
new file mode 100644
index 0000000..e0fe6ce
Binary files /dev/null and b/tests/auto/results/screenshots/03_tab_series.png differ
diff --git a/tests/auto/results/screenshots/03_tab_settings.png b/tests/auto/results/screenshots/03_tab_settings.png
new file mode 100644
index 0000000..92c678f
Binary files /dev/null and b/tests/auto/results/screenshots/03_tab_settings.png differ
diff --git a/tests/auto/results/screenshots/03_tab_watchlist.png b/tests/auto/results/screenshots/03_tab_watchlist.png
new file mode 100644
index 0000000..f0f328c
Binary files /dev/null and b/tests/auto/results/screenshots/03_tab_watchlist.png differ
diff --git a/tests/auto/results/screenshots/07_mobile_home.png b/tests/auto/results/screenshots/07_mobile_home.png
new file mode 100644
index 0000000..7fe539e
Binary files /dev/null and b/tests/auto/results/screenshots/07_mobile_home.png differ
diff --git a/tests/auto/run_tests.mjs b/tests/auto/run_tests.mjs
new file mode 100644
index 0000000..05dd02e
--- /dev/null
+++ b/tests/auto/run_tests.mjs
@@ -0,0 +1,371 @@
+/**
+ * Ohm Streaming - Automated E2E Test Suite
+ * Run: node tests/auto/run_tests.mjs
+ * Output: tests/auto/results/report.md + screenshots/
+ */
+import { chromium } from 'playwright';
+import fs from 'fs';
+import path from 'path';
+
+const BASE = 'http://127.0.0.1:3000';
+const RESULTS_DIR = path.join(import.meta.dirname, 'results');
+const SCREENSHOT_DIR = path.join(RESULTS_DIR, 'screenshots');
+
+const CREDS = { username: 'roman', password: 'roman123' };
+
+// ── Helpers ──
+const results = { passed: 0, failed: 0, errors: [], duration: 0 };
+const startTime = Date.now();
+
+function screenshot(page, name) {
+  const p = path.join(SCREENSHOT_DIR, `${name}.png`);
+  return page.screenshot({ path: p, fullPage: true }).then(() => p);
+}
+
+async function test(name, fn) {
+  try {
+    await fn();
+    results.passed++;
+    console.log(`  ✅ ${name}`);
+  } catch (err) {
+    results.failed++;
+    const msg = `❌ ${name}: ${err.message}`;
+    results.errors.push(msg);
+    console.error(`  ❌ ${name}: ${err.message}`);
+  }
+}
+
+function assert(condition, message) {
+  if (!condition) throw new Error(message || 'Assertion failed');
+}
+
+// ── Main ──
+(async () => {
+  // Ensure output dirs
+  fs.mkdirSync(SCREENSHOT_DIR, { recursive: true });
+
+  const browser = await chromium.launch({ headless: true, args: ['--no-sandbox'] });
+  const page = await browser.newPage({ viewport: { width: 1440, height: 900 } });
+
+  // Collect console errors
+  const consoleErrors = [];
+  page.on('console', msg => {
+    if (msg.type() === 'error') consoleErrors.push(msg.text());
+  });
+
+  // Network error tracking
+  const networkErrors = [];
+  page.on('requestfailed', req => {
+    networkErrors.push(`${req.method()} ${req.url()}: ${req.failure()?.errorText}`);
+  });
+
+  console.log('\n🧪 Ohm Streaming - Automated Test Suite\n');
+  console.log('═══ Phase 1: API Health ═══');
+
+  // ── Phase 1: API Health Checks ──
+  await page.goto(`${BASE}/health`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+  await page.waitForTimeout(1000);
+
+  await test('GET /health returns 200', async () => {
+    const text = await page.textContent('body');
+    const json = JSON.parse(text);
+    assert(json.status === 'healthy' || json.status === 'ok', `Unexpected status: ${json.status}`);
+  });
+
+  await test('GET / returns landing page', async () => {
+    const resp = await page.goto(`${BASE}/`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+    assert(resp.status() === 200, `Status ${resp.status()}`);
+    await page.waitForTimeout(1500);
+    const screenshotPath = await screenshot(page, '01_landing_page');
+    console.log(`    📸 ${screenshotPath}`);
+  });
+
+  await test('GET /login returns login page', async () => {
+    const resp = await page.goto(`${BASE}/login`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+    assert(resp.status() === 200);
+    await page.waitForTimeout(1500);
+    const screenshotPath = await screenshot(page, '02_login_page');
+    console.log(`    📸 ${screenshotPath}`);
+  });
+
+  // ── Phase 2: Authentication ──
+  console.log('\n═══ Phase 2: Authentication ═══');
+
+  await test('Login with valid credentials (roman/roman123)', async () => {
+    await page.goto(`${BASE}/login`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+    await page.waitForTimeout(2000);
+
+    // Use API to login (SPA approach)
+    await page.goto(`${BASE}/login`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+    await page.waitForTimeout(2000);
+
+    const token = await page.evaluate(async (creds) => {
+      const res = await fetch('/api/auth/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(creds)
+      });
+      if (!res.ok) throw new Error(`Login failed: ${res.status} ${await res.text()}`);
+      return (await res.json()).access_token;
+    }, CREDS);
+
+    assert(token && token.length > 10, 'No valid token received');
+
+    // Inject token into localStorage
+    await page.evaluate((t) => {
+      localStorage.setItem('auth_token', t);
+    }, token);
+    console.log(`    🔑 Token received (${token.substring(0, 20)}...)`);
+  });
+
+  await test('GET /api/auth/me returns user info', async () => {
+    const user = await page.evaluate(async () => {
+      const token = localStorage.getItem('auth_token');
+      const res = await fetch('/api/auth/me', {
+        headers: { 'Authorization': `Bearer ${token}` }
+      });
+      return res.json();
+    });
+    // Response may be { username, ... } or { user: { username, ... } }
+    const name = user.username || user.user?.username || user.id;
+    assert(name, `No username found in /me response: ${JSON.stringify(user).substring(0, 200)}`);
+    console.log(`    👤 User: ${name} (admin: ${user.is_admin || user.user?.is_admin || false})`);
+  });
+
+  // ── Phase 3: SPA Navigation ──
+  console.log('\n═══ Phase 3: SPA Navigation (/web) ═══');
+
+  const tabs = ['home', 'anime', 'series', 'providers', 'downloads', 'watchlist', 'settings'];
+
+  for (const tab of tabs) {
+    await test(`Navigate to tab: ${tab}`, async () => {
+      await page.goto(`${BASE}/web`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+      await page.waitForTimeout(2000);
+
+      // Inject auth
+      await page.evaluate(() => {
+        // Token should already be in localStorage from login test
+        // but let's verify
+        const token = localStorage.getItem('auth_token');
+        if (!token) throw new Error('No auth token in localStorage');
+      });
+
+      // Switch tab using the app's own mechanism
+      await page.evaluate((tabName) => {
+        window.location.hash = tabName;
+        window.dispatchEvent(new CustomEvent('set-tab', { detail: { tab: tabName } }));
+      }, tab);
+      await page.waitForTimeout(3000);
+
+      // Check no JS errors during navigation
+      const currentErrors = consoleErrors.length;
+      // Just verify page didn't crash
+      const content = await page.textContent('body');
+      assert(content && content.length > 10, `Tab ${tab} rendered empty content`);
+
+      const screenshotPath = await screenshot(page, `03_tab_${tab}`);
+      console.log(`    📸 ${screenshotPath}`);
+    });
+  }
+
+  // ── Phase 4: API Endpoints ──
+  console.log('\n═══ Phase 4: API Endpoints ═══');
+
+  const apiTests = [
+    { name: 'GET /api/settings', endpoint: '/api/settings', method: 'GET' },
+    { name: 'GET /api/favorites', endpoint: '/api/favorites', method: 'GET' },
+    { name: 'GET /api/watchlist', endpoint: '/api/watchlist', method: 'GET' },
+    { name: 'GET /api/downloads', endpoint: '/api/downloads', method: 'GET' },
+    { name: 'GET /api/watchlist/settings', endpoint: '/api/watchlist/settings', method: 'GET' },
+    { name: 'GET /api/watchlist/stats/summary', endpoint: '/api/watchlist/stats/summary', method: 'GET' },
+    { name: 'GET /api/providers/health', endpoint: '/api/providers/health', method: 'GET' },
+    { name: 'GET /api/recommendations', endpoint: '/api/recommendations', method: 'GET' },
+    { name: 'GET /api/releases/latest', endpoint: '/api/releases/latest', method: 'GET' },
+    { name: 'GET /api/favorites/stats', endpoint: '/api/favorites/stats', method: 'GET' },
+  ];
+
+  for (const apiTest of apiTests) {
+    await test(`${apiTest.name} returns 200`, async () => {
+      const result = await page.evaluate(async ({ endpoint, method }) => {
+        const token = localStorage.getItem('auth_token');
+        const res = await fetch(endpoint, {
+          method,
+          headers: { 'Authorization': `Bearer ${token}` }
+        });
+        let body = null;
+        try { body = await res.json(); } catch(e) { /* body stays null */ }
+        return { status: res.status, body };
+      }, apiTest);
+
+      assert(result.status === 200, `${apiTest.name} returned ${result.status}: ${JSON.stringify(result.body).substring(0, 200)}`);
+      // Verify it's valid JSON
+      assert(typeof result.body === 'object', `${apiTest.name} returned non-JSON`);
+    });
+  }
+
+  // ── Phase 5: Content Validation ──
+  console.log('\n═══ Phase 5: Content Validation ═══');
+
+  await test('Home tab renders content (not blank)', async () => {
+    await page.goto(`${BASE}/web#home`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+    await page.waitForTimeout(3000);
+    const content = await page.textContent('body');
+    assert(content.length > 100, 'Home tab content too short - may be blank');
+    console.log(`    📝 Content length: ${content.length} chars`);
+  });
+
+  await test('Alpine.js loaded correctly', async () => {
+    const alpineLoaded = await page.evaluate(() => typeof window.Alpine !== 'undefined');
+    assert(alpineLoaded, 'Alpine.js not loaded - x-* directives are dead');
+    console.log(`    ⚡ Alpine.js: loaded`);
+  });
+
+  await test('HTMX loaded correctly', async () => {
+    const htmxLoaded = await page.evaluate(() => typeof window.htmx !== 'undefined');
+    assert(htmxLoaded, 'HTMX not loaded');
+    console.log(`    ⚡ HTMX: loaded`);
+  });
+
+  await test('No critical JS errors in console', async () => {
+    // Filter out non-critical errors (network, extensions)
+    const critical = consoleErrors.filter(e =>
+      !e.includes('favicon') &&
+      !e.includes('net::ERR_CONNECTION') &&
+      !e.includes('404') &&
+      !e.includes('DevTools')
+    );
+    assert(critical.length === 0, `${critical.length} critical JS errors: ${critical.slice(0, 3).join('; ')}`);
+    console.log(`    ✨ Console clean (${consoleErrors.length} total, 0 critical)`);
+  });
+
+  // ── Phase 6: Search Functionality ──
+  console.log('\n═══ Phase 6: Search Functionality ═══');
+
+  await test('Anime search API works', async () => {
+    const result = await page.evaluate(async () => {
+      const token = localStorage.getItem('auth_token');
+      const res = await fetch('/api/anime/search?q=naruto&limit=3', {
+        headers: { 'Authorization': `Bearer ${token}` }
+      });
+      return { status: res.status, body: await res.json() };
+    });
+    // Search may return empty if providers are down, but should not error
+    assert(result.status === 200, `Search returned ${result.status}`);
+    console.log(`    🔍 Search results: ${JSON.stringify(result.body).substring(0, 100)}`);
+  });
+
+  // ── Phase 7: Responsive Design ──
+  console.log('\n═══ Phase 7: Responsive Design ═══');
+
+  await test('Mobile viewport rendering', async () => {
+    const context = await browser.newContext({
+      viewport: { width: 390, height: 844 },
+      isMobile: true,
+      hasTouch: true,
+      userAgent: 'Mozilla/5.0 (iPhone; CPU iPhone OS 17_0 like Mac OS X) AppleWebKit/605.1.15'
+    });
+    const mobilePage = await context.newPage();
+
+    // Re-auth on mobile
+    await mobilePage.goto(`${BASE}/login`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+    await mobilePage.waitForTimeout(2000);
+
+    const token = await mobilePage.evaluate(async (creds) => {
+      const res = await fetch('/api/auth/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(creds)
+      });
+      return (await res.json()).access_token;
+    }, CREDS);
+
+    await mobilePage.evaluate((t) => localStorage.setItem('auth_token', t), token);
+
+    await mobilePage.goto(`${BASE}/web#home`, { waitUntil: 'domcontentloaded', timeout: 10000 });
+    await mobilePage.waitForTimeout(3000);
+
+    const screenshotPath = await mobilePage.screenshot({ path: path.join(SCREENSHOT_DIR, '07_mobile_home.png'), fullPage: true });
+    console.log(`    📸 ${screenshotPath}`);
+
+    // Check for horizontal overflow
+    const overflow = await mobilePage.evaluate(() => {
+      const w = window.innerWidth;
+      return Array.from(document.querySelectorAll('*'))
+        .filter(el => el.getBoundingClientRect().width > w)
+        .length;
+    });
+    assert(overflow === 0, `${overflow} elements overflow horizontally on mobile`);
+
+    await context.close();
+    console.log(`    📱 Mobile: no horizontal overflow`);
+  });
+
+  // ── Phase 8: Settings API ──
+  console.log('\n═══ Phase 8: Settings & Providers ═══');
+
+  await test('GET /api/settings returns valid config', async () => {
+    const settings = await page.evaluate(async () => {
+      const token = localStorage.getItem('auth_token');
+      const res = await fetch('/api/settings', {
+        headers: { 'Authorization': `Bearer ${token}` }
+      });
+      return res.json();
+    });
+    assert(settings && typeof settings === 'object', 'Settings not an object');
+    console.log(`    ⚙️ Settings keys: ${Object.keys(settings).join(', ')}`);
+  });
+
+  await test('GET /api/providers/health check', async () => {
+    const health = await page.evaluate(async () => {
+      const token = localStorage.getItem('auth_token');
+      const res = await fetch('/api/providers/health', {
+        headers: { 'Authorization': `Bearer ${token}` }
+      });
+      return res.json();
+    });
+    assert(health !== null, 'Provider health returned null');
+    const providerCount = Array.isArray(health) ? health.length : Object.keys(health).length;
+    console.log(`    🏥 Providers checked: ${providerCount}`);
+  });
+
+  await browser.close();
+
+  // ── Generate Report ──
+  results.duration = ((Date.now() - startTime) / 1000).toFixed(1);
+  consoleErrors.length = 0;
+
+  const report = `# Ohm Streaming - Automated Test Report
+**Date:** ${new Date().toISOString()}
+**Duration:** ${results.duration}s
+**Base URL:** ${BASE}
+
+## Summary
+
+| Metric | Value |
+|--------|-------|
+| ✅ Passed | ${results.passed} |
+| ❌ Failed | ${results.failed} |
+| 📊 Total | ${results.passed + results.failed} |
+| 📊 Pass Rate | ${((results.passed / (results.passed + results.failed)) * 100).toFixed(1)}% |
+
+${results.errors.length > 0 ? `## Failed Tests\n\n${results.errors.map((e, i) => `${i + 1}. ${e}`).join('\n')}` : '## All tests passed!'}
+
+## Screenshots
+
+${fs.readdirSync(SCREENSHOT_DIR).map(f => `- ![](screenshots/${f})`).join('\n')}
+`;
+
+  fs.writeFileSync(path.join(RESULTS_DIR, 'report.md'), report);
+
+  console.log('\n═══════════════════════════════════');
+  console.log(`  Results: ${results.passed}/${results.passed + results.failed} passed (${results.duration}s)`);
+  console.log(`  Report: ${path.join(RESULTS_DIR, 'report.md')}`);
+  console.log(`  Screenshots: ${SCREENSHOT_DIR}`);
+  if (results.errors.length > 0) {
+    console.log(`\n  Failed tests:`);
+    results.errors.forEach(e => console.log(`    ${e}`));
+  }
+  console.log('═══════════════════════════════════\n');
+
+  process.exit(results.failed > 0 ? 1 : 0);
+})();