UI: fix drawer display with backdrop and auto-close on view switch

app.js

@@ -46,6 +46,7 @@ const toolsCloseBtn = document.getElementById("toolsCloseBtn");
 const gamesDrawer = document.getElementById("gamesDrawer");
 const gamesToggleBtn = document.getElementById("gamesToggleBtn");
 const gamesCloseBtn = document.getElementById("gamesCloseBtn");
+const drawerBackdrop = document.getElementById("drawerBackdrop");
 const totalGamesCount = document.getElementById("totalGamesCount");
 const totalGamesValue = document.getElementById("totalGamesValue");
 const migrateBtn = document.getElementById("migrateBtn");
@@ -151,19 +152,23 @@ coverFileInput.addEventListener("change", async (event) => {
 toolsToggleBtn.addEventListener("click", () => {
   gamesDrawer.classList.remove("open");
   toolsDrawer.classList.toggle("open");
+  syncDrawersUi();
 });
 
 toolsCloseBtn.addEventListener("click", () => {
   toolsDrawer.classList.remove("open");
+  syncDrawersUi();
 });
 
 gamesToggleBtn.addEventListener("click", () => {
   toolsDrawer.classList.remove("open");
   gamesDrawer.classList.toggle("open");
+  syncDrawersUi();
 });
 
 gamesCloseBtn.addEventListener("click", () => {
   gamesDrawer.classList.remove("open");
+  syncDrawersUi();
 });
 
 document.addEventListener("click", (event) => {
@@ -182,18 +187,28 @@ document.addEventListener("click", (event) => {
   }
   toolsDrawer.classList.remove("open");
   gamesDrawer.classList.remove("open");
+  syncDrawersUi();
 });
 
 document.addEventListener("keydown", (event) => {
   if (event.key === "Escape") {
     toolsDrawer.classList.remove("open");
     gamesDrawer.classList.remove("open");
+    syncDrawersUi();
     if (scannerRunning) {
       stopScanner("Camera arretee.");
     }
   }
 });
 
+if (drawerBackdrop) {
+  drawerBackdrop.addEventListener("click", () => {
+    toolsDrawer.classList.remove("open");
+    gamesDrawer.classList.remove("open");
+    syncDrawersUi();
+  });
+}
+
 googleConnectBtn.addEventListener("click", async () => {
   try {
     const payload = await apiRequest("/api/google/connect-url");
@@ -922,9 +937,20 @@ function setCurrentView(view) {
   showLoanedOnly = view === "loans";
   resetPaging();
   selectedGameIds.clear();
+  toolsDrawer.classList.remove("open");
+  gamesDrawer.classList.remove("open");
+  syncDrawersUi();
   render();
 }
 
+function syncDrawersUi() {
+  if (!drawerBackdrop) {
+    return;
+  }
+  const anyDrawerOpen = toolsDrawer.classList.contains("open") || gamesDrawer.classList.contains("open");
+  drawerBackdrop.classList.toggle("hidden", !anyDrawerOpen);
+}
+
 function renderViewChrome() {
   const isStats = currentView === "stats";
   const isLoans = currentView === "loans";