Create notifier

src/lib/notifier.svelte.js

@@ -3,6 +3,10 @@ let notifications = $state([]);
 export function notify(type, message){
     notifications.push({type, message});
 
+    while(notifications.length > 3){
+        notifications.shift();
+    }
+
     setTimeout(()=>{
         notifications.shift();
     }, 7500);

src/routes/+layout.svelte

@@ -55,4 +55,41 @@
         height: 100%;
         width: auto;
     }
+
+    .notifications{
+        position: fixed;
+        top: 1rem;
+        right: 1rem;
+        z-index: 9999;
+        display: flex;
+        flex-direction: column;
+        gap: 0.5rem;
+        width: min(320px, calc(100vw - 2rem));
+        pointer-events: none;
+    }
+
+    .notifications p{
+        margin: 0;
+        padding: 0.75rem 1rem;
+        border-radius: 6px;
+        font-size: 0.9rem;
+        line-height: 1.3;
+        color: var(--color-text);
+        background: var(--color-surface-alt);
+        border: 1px solid var(--color-border);
+        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
+        pointer-events: auto;
+    }
+
+    .notifications p.success{
+        border-color: var(--color-success);
+    }
+
+    .notifications p.warning{
+        border-color: var(--color-warning);
+    }
+
+    .notifications p.error{
+        border-color: var(--color-error);
+    }
 </style>

src/routes/register/+page.svelte

@@ -5,7 +5,6 @@
 
     let {form} = $props();
     let nameInput;
-    $inspect(form);
 
     $effect(()=>{
         nameInput?.focus();