diff --git a/src/app/website/index/Countdown.svelte b/src/app/website/index/Countdown.svelte
index f3eb0f3..e9ddd40 100644
--- a/src/app/website/index/Countdown.svelte
+++ b/src/app/website/index/Countdown.svelte
@@ -2,7 +2,7 @@
   import { onDestroy } from 'svelte';
 
   interface Props {
-      end: Date,
+    end: Date;
   }
 
   let { end }: Props = $props();
diff --git a/src/components/popup/ConfirmPopup.svelte b/src/components/popup/ConfirmPopup.svelte
index 259f429..8648c7b 100644
--- a/src/components/popup/ConfirmPopup.svelte
+++ b/src/components/popup/ConfirmPopup.svelte
@@ -5,16 +5,22 @@
   // html bindings
   let modal: HTMLDialogElement;
 
+  // state
+  let closeTimeoutId = $state(-1);
+
   // lifecycle
   const cancel = confirmPopupState.subscribe((value) => {
-    if (value) modal.show();
+    if (!value) return;
+
+    clearTimeout(closeTimeoutId);
+    modal.show();
   });
 
   onDestroy(cancel);
 
   // callbacks
   function onModalClose() {
-    setTimeout(() => ($confirmPopupState = null), 300);
+    closeTimeoutId = setTimeout(() => ($confirmPopupState = null), 300);
   }
 </script>
 
diff --git a/src/components/popup/Popup.svelte b/src/components/popup/Popup.svelte
index c7d00f2..2cbcf0a 100644
--- a/src/components/popup/Popup.svelte
+++ b/src/components/popup/Popup.svelte
@@ -5,9 +5,15 @@
   // html bindings
   let modal: HTMLDialogElement;
 
+  // state
+  let closeTimeoutId = $state(-1);
+
   // lifecycle
   const cancel = popupState.subscribe((value) => {
-    if (value) modal.show();
+    if (!value) return;
+
+    clearTimeout(closeTimeoutId);
+    modal.show();
   });
 
   onDestroy(cancel);