Improve delivery workflows and add versioned guided tours (#1)

Reviewed-on: #1
Co-authored-by: Egor Pozharov <chedius232@gmail.com>

frontend/src/components/ui/Toast.tsx

@@ -19,20 +19,20 @@ export const ToastContainer = () => {
   if (toasts.length === 0) return null;
 
   return (
-    <div className="fixed bottom-4 right-4 z-50 flex flex-col gap-2">
+    <div className="fixed bottom-4 left-4 right-4 sm:left-auto z-50 max-w-sm flex flex-col gap-2">
       {toasts.map((toast) => {
         const Icon = icons[toast.type];
         return (
           <div
             key={toast.id}
-            className={`flex items-center gap-3 px-4 py-3 rounded-lg border shadow-lg min-w-[300px] animate-in slide-in-from-right ${styles[toast.type]}`}
+            className={`flex items-center gap-3 px-4 py-3 rounded-lg border shadow-lg w-full animate-in slide-in-from-right ${styles[toast.type]}`}
             role="alert"
           >
             <Icon size={20} />
             <p className="flex-1 text-sm">{toast.message}</p>
             <button
               onClick={() => removeToast(toast.id)}
-              className="p-1 hover:bg-black/5 rounded transition-colors"
+              className="icon-button hover:bg-black/5"
               aria-label="Закрыть"
             >
               <X size={16} />