diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 0000000..b58b603
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
diff --git a/.idea/baklava.iml b/.idea/baklava.iml
new file mode 100644
index 0000000..24643cc
--- /dev/null
+++ b/.idea/baklava.iml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/.idea/material_theme_project_new.xml b/.idea/material_theme_project_new.xml
new file mode 100644
index 0000000..7b49ce2
--- /dev/null
+++ b/.idea/material_theme_project_new.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="MaterialThemeProjectNewConfig">
+    <option name="metadata">
+      <MTProjectMetadataState>
+        <option name="migrated" value="true" />
+        <option name="pristineConfig" value="false" />
+        <option name="userId" value="24761b29:192b8726b00:-7ffe" />
+      </MTProjectMetadataState>
+    </option>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 0000000..f110fba
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/baklava.iml" filepath="$PROJECT_DIR$/.idea/baklava.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..35eb1dd
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/app/lib.ts b/app/lib.ts
index 689ac80..e596d33 100644
--- a/app/lib.ts
+++ b/app/lib.ts
@@ -29,12 +29,14 @@ export { Spinner } from '../src/components/graphics/Spinner/Spinner.tsx';
 
 export { PropertyList } from '../src/components/lists/PropertyList/PropertyList.tsx';
 
-export { Tabs } from '../src/components/navigations/Tabs/Tabs.tsx';
+export { Tab, Tabs } from '../src/components/navigations/Tabs/Tabs.tsx';
+export { Stepper } from '../src/components/navigations/Stepper/Stepper.tsx';
 
 export { DropdownMenu } from '../src/components/overlays/DropdownMenu/DropdownMenu.tsx';
 export { Modal } from '../src/components/overlays/Modal/Modal.tsx';
 export { type ToastContent, ToastContainer, ToastMessage } from '../src/components/overlays/Toast/Toast.tsx';
 export { Tooltip } from '../src/components/overlays/Tooltip/Tooltip.tsx';
+export { TooltipProvider } from '../src/components/overlays/Tooltip/TooltipProvider.tsx';
 
 // Layouts
 
diff --git a/src/components/actions/Button/Button.module.scss b/src/components/actions/Button/Button.module.scss
index cbf4803..ac91775 100644
--- a/src/components/actions/Button/Button.module.scss
+++ b/src/components/actions/Button/Button.module.scss
@@ -32,11 +32,6 @@
     /* letter-spacing: 0.1ch; */
     text-transform: uppercase;
     
-    @media (prefers-reduced-motion: no-preference) {
-      transition: none 150ms ease-in-out;
-      transition-property: border, background, color;
-    }
-    
     /* Tertiary (default) */
     border-color: transparent;
     background-color: transparent;
@@ -72,6 +67,11 @@
       --bk-button-color-contrast: #{bk.$theme-button-primary-text-non-active};
       cursor: not-allowed;
     }
+
+    @media (prefers-reduced-motion: no-preference) {
+      transition: none 150ms ease-in-out;
+      transition-property: border, background, color;
+    }
     
     /* & > :global(.icon) { font-size: 1.2rem; } */
     
diff --git a/src/components/overlays/Modal/Modal.module.scss b/src/components/overlays/Modal/Modal.module.scss
index 289fb43..7720d75 100644
--- a/src/components/overlays/Modal/Modal.module.scss
+++ b/src/components/overlays/Modal/Modal.module.scss
@@ -87,6 +87,15 @@
       flex: 1; /* Make sure we cover all available space */
       overflow: auto;
     }
+
+    transition:
+      opacity 1ms ease-out,
+      scale 1ms ease-out,
+      overlay 1ms ease-out allow-discrete,
+      display 1ms ease-out allow-discrete;
+    opacity: 0;
+    scale: 0.98 0.98;
+    transition-duration: 200ms; /* Exit transition duration */
     
     /* Variant: slide out */
     --modal-slide-out-inset: var(--bk-sizing-3);
@@ -129,15 +138,6 @@
     
     /* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog#animating_dialogs */
     
-    opacity: 0;
-    scale: 0.98 0.98;
-    transition:
-      opacity 1ms ease-out,
-      scale 1ms ease-out,
-      overlay 1ms ease-out allow-discrete,
-      display 1ms ease-out allow-discrete;
-    transition-duration: 200ms; /* Exit transition duration */
-    
     &:modal {
       display: flex;
       opacity: 1;
diff --git a/src/components/overlays/Toast/Toast.stories.tsx b/src/components/overlays/Toast/Toast.stories.tsx
index 4bc70ec..d99a375 100644
--- a/src/components/overlays/Toast/Toast.stories.tsx
+++ b/src/components/overlays/Toast/Toast.stories.tsx
@@ -12,11 +12,11 @@ import { Button } from '../../actions/Button/Button.tsx';
 import { notify, CopyActionButton, ToastMessage, ToastContainer } from './Toast.tsx';
 
 
-type ToastArg = React.ComponentProps<typeof ToastMessage>;
+type ToastArg = React.ComponentProps<typeof ToastContainer>;
 type Story = StoryObj<ToastArg>;
 
 export default {
-  component: ToastMessage,
+  component: ToastContainer,
   parameters: {
     layout: 'centered',
   },
diff --git a/src/layouts/AppLayout/AppLayout.module.scss b/src/layouts/AppLayout/AppLayout.module.scss
index 5573b69..d241508 100644
--- a/src/layouts/AppLayout/AppLayout.module.scss
+++ b/src/layouts/AppLayout/AppLayout.module.scss
@@ -19,12 +19,7 @@
     
     --bk-app-layout-sidebar-width-open: 220px;
     --bk-app-layout-sidebar-width: var(--bk-app-layout-sidebar-width-open);
-    
-    //&:has([slot='sidebar']:hover) { --bk-app-layout-sidebar-width: 80px; } // TEST
-    @media (prefers-reduced-motion: no-preference) {
-      transition: grid 300ms;
-    }
-    
+
     /* Note: do not use vw/vh, because we may want to show the layout in a container (e.g. story) */
     min-width: 100cqw;
     min-height: 100cqh;
@@ -106,5 +101,10 @@
         'footer' max-content
         / 1fr;
     }
+
+    //&:has([slot='sidebar']:hover) { --bk-app-layout-sidebar-width: 80px; } // TEST
+    @media (prefers-reduced-motion: no-preference) {
+      transition: grid 300ms;
+    }
   }
 }
diff --git a/src/styling/variables.scss b/src/styling/variables.scss
index b2e25a7..bde02ad 100644
--- a/src/styling/variables.scss
+++ b/src/styling/variables.scss
@@ -47,7 +47,7 @@ $color-blackberry-100: #777392 !default;
 $color-blackberry-200: #5f5a7c !default;
 $color-blackberry-300: #484266 !default;
 $color-blackberry-400: #332b50 !default;
-$color-blackberry-500: #2d294b !default;
+$color-blackberry-500: #39355c !default;
 $color-blackberry-600: #262645 !default;
 $color-blackberry-700: #202440 !default;
 $color-blackberry-800: #1a1c37 !default;