diff --git a/package.json b/package.json
index e9a675dbd..7b0e3abb9 100644
--- a/package.json
+++ b/package.json
@@ -24,9 +24,9 @@
         "@ai-sdk/svelte": "^1.1.24",
         "@appwrite.io/console": "https://pkg.vc/-/@appwrite/@appwrite.io/console@5ce6dc7",
         "@appwrite.io/pink-icons": "0.25.0",
-        "@appwrite.io/pink-icons-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@c255e7b",
+        "@appwrite.io/pink-icons-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@5b26bb8",
         "@appwrite.io/pink-legacy": "^1.0.3",
-        "@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@c255e7b",
+        "@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@5b26bb8",
         "@faker-js/faker": "^9.9.0",
         "@popperjs/core": "^2.11.8",
         "@sentry/sveltekit": "^8.55.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index cbf867a83..0ab7d6498 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -18,14 +18,14 @@ importers:
         specifier: 0.25.0
         version: 0.25.0
       '@appwrite.io/pink-icons-svelte':
-        specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@c255e7b
-        version: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@c255e7b(svelte@5.43.6)
+        specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@5b26bb8
+        version: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@5b26bb8(svelte@5.43.6)
       '@appwrite.io/pink-legacy':
         specifier: ^1.0.3
         version: 1.0.3
       '@appwrite.io/pink-svelte':
-        specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@c255e7b
-        version: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@c255e7b(svelte@5.43.6)
+        specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@5b26bb8
+        version: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@5b26bb8(svelte@5.43.6)
       '@faker-js/faker':
         specifier: ^9.9.0
         version: 9.9.0
@@ -281,8 +281,8 @@ packages:
     peerDependencies:
       svelte: ^4.0.0
 
-  '@appwrite.io/pink-icons-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@c255e7b':
-    resolution: {tarball: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@c255e7b}
+  '@appwrite.io/pink-icons-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@5b26bb8':
+    resolution: {tarball: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@5b26bb8}
     version: 2.0.0-RC.1
     peerDependencies:
       svelte: ^4.0.0
@@ -296,8 +296,8 @@ packages:
   '@appwrite.io/pink-legacy@1.0.3':
     resolution: {integrity: sha512-GGde5fmPhs+s6/3aFeMPc/kKADG/gTFkYQSy6oBN8pK0y0XNCLrZZgBv+EBbdhwdtqVEWXa0X85Mv9w7jcIlwQ==}
 
-  '@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@c255e7b':
-    resolution: {tarball: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@c255e7b}
+  '@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@5b26bb8':
+    resolution: {tarball: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@5b26bb8}
     version: 2.0.0-RC.2
     peerDependencies:
       svelte: ^4.0.0
@@ -3654,7 +3654,7 @@ snapshots:
     dependencies:
       svelte: 5.43.6
 
-  '@appwrite.io/pink-icons-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@c255e7b(svelte@5.43.6)':
+  '@appwrite.io/pink-icons-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@5b26bb8(svelte@5.43.6)':
     dependencies:
       svelte: 5.43.6
 
@@ -3667,7 +3667,7 @@ snapshots:
       '@appwrite.io/pink-icons': 1.0.0
       the-new-css-reset: 1.11.3
 
-  '@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@c255e7b(svelte@5.43.6)':
+  '@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@5b26bb8(svelte@5.43.6)':
     dependencies:
       '@appwrite.io/pink-icons-svelte': 2.0.0-RC.1(svelte@5.43.6)
       '@floating-ui/dom': 1.6.13
diff --git a/src/lib/components/sidebar.svelte b/src/lib/components/sidebar.svelte
index 9a8561cb7..876773e81 100644
--- a/src/lib/components/sidebar.svelte
+++ b/src/lib/components/sidebar.svelte
@@ -19,13 +19,13 @@
         IconChartBar,
         IconChatBubble,
         IconCog,
-        IconCommand,
         IconDatabase,
         IconFolder,
         IconGlobeAlt,
         IconLightningBolt,
         IconSearch,
-        IconUserGroup
+        IconUserGroup,
+        IconTemplate
     } from '@appwrite.io/pink-icons-svelte';
     import { toggleCommandCenter } from '$lib/commandCenter/commandCenter.svelte';
     import { feedback } from '$lib/stores/feedback';
@@ -188,7 +188,7 @@
                                     sideBarIsOpen = false;
                                 }}
                                 ><span class="link-icon"
-                                    ><Icon icon={IconCommand} size="s" />
+                                    ><Icon icon={IconTemplate} size="s" />
                                 </span><span
                                     class:no-text={state === 'icons'}
                                     class:has-text={state === 'open'}
diff --git a/src/lib/layout/shell.svelte b/src/lib/layout/shell.svelte
index b6eb2f32d..87ff8d1c9 100644
--- a/src/lib/layout/shell.svelte
+++ b/src/lib/layout/shell.svelte
@@ -257,7 +257,7 @@
         margin-block-start: 48px;
         border-radius: 16px;
         border: 1px solid var(--border-neutral);
-        overflow: scroll;
+        overflow: hidden;
         height: calc(100vh - 60px);
         max-width: calc(100vw - 76px);
         margin-top: 48px;
diff --git a/src/lib/profiles/css/studio.css b/src/lib/profiles/css/studio.css
index 6f6e8d48c..2ef461427 100644
--- a/src/lib/profiles/css/studio.css
+++ b/src/lib/profiles/css/studio.css
@@ -1,6 +1,196 @@
 body {
     background: var(--bgcolor-neutral-primary);
 }
+a.primary,
+button.primary {
+    --border-width-s: 0px;
+    background:
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0.08) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            #2d2d31 100%
+        ),
+        #2d2d31 !important;
+    --button-box-shadow:
+        0 3px 0 0 rgba(255, 255, 255, 0.16) inset, 0 -2px 0 0 #000 inset, 0 1px 0 0 #000 inset,
+        0 1px 1px 0 rgba(0, 0, 0, 0.12), 0 2px 5px 0 rgba(0, 0, 0, 0.16);
+}
+
+a.primary:hover,
+button.primary:hover {
+    background:
+        linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%),
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0.04) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            #2d2d31 100%
+        ),
+        #2d2d31 !important;
+    --button-box-shadow:
+        0 3px 0 0 rgba(255, 255, 255, 0.16) inset, 0 -2px 0 0 #000 inset, 0 1px 0 0 #000 inset,
+        0 1px 1px 0 rgba(0, 0, 0, 0.12), 0 2px 5px 0 rgba(0, 0, 0, 0.12);
+}
+
+a.primary:active:not(:disabled),
+button.primary:active:not(:disabled) {
+    background:
+        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(0, 0, 0, 0) 40.87%, #000 100%),
+        #2d2d31 !important;
+    box-shadow:
+        0 4px 4px 0 rgba(0, 0, 0, 0.02) inset,
+        0 -3px 4px 0 rgba(255, 255, 255, 0.16) inset,
+        0 1px 1px 0 rgba(0, 0, 0, 0.12);
+}
+
+.theme-dark a.primary,
+.theme-dark button.primary {
+    background:
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            rgba(0, 0, 0, 0.08) 100%
+        ),
+        #f4f4f7 !important;
+    --button-box-shadow:
+        0 -2px 0 0 rgba(0, 0, 0, 0.12) inset, 0 1px 0 0 rgba(237, 237, 240, 0.8) inset,
+        0 3px 0 0 rgba(255, 255, 255, 1) inset, 0 1px 1px 0 rgba(0, 0, 0, 0.2),
+        0 2px 5px 0 rgba(0, 0, 0, 0.24);
+}
+
+.theme-dark a.primary:hover,
+.theme-dark button.primary:hover {
+    background:
+        linear-gradient(0deg, rgba(255, 255, 255, 0) -16.18%, rgba(255, 255, 255, 0.7) 100%),
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            rgba(0, 0, 0, 0.08) 100%
+        ),
+        #f4f4f7 !important;
+    --button-box-shadow:
+        0 -2px 0 0 rgba(0, 0, 0, 0.16) inset, 0 1px 0 0 rgba(237, 237, 240, 0.8) inset,
+        0 3px 0 0 rgba(255, 255, 255, 1) inset, 0 1px 1px 0 rgba(0, 0, 0, 0.16),
+        0 2px 5px 0 rgba(0, 0, 0, 0.2);
+}
+
+.theme-dark a.primary:active:not(:disabled),
+.theme-dark button.primary:active:not(:disabled) {
+    background:
+        linear-gradient(
+            180deg,
+            rgba(0, 0, 0, 0.12) 0%,
+            rgba(0, 0, 0, 0.06) 40.87%,
+            rgba(0, 0, 0, 0.18) 100%
+        ),
+        #f4f4f7 !important;
+    --button-box-shadow:
+        0 1px 4px 4px rgba(0, 0, 0, 0.08), 0 3px 0 0 rgba(255, 255, 255, 0.16) inset,
+        0 -2px 0 0 rgba(0, 0, 0, 0.16) inset, 0 1px 0 0 rgba(250, 250, 251, 0.8) inset,
+        0 1px 1px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.24);
+}
+
+a.secondary,
+button.secondary {
+    --border-width-s: 0px;
+    background:
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            rgba(0, 0, 0, 0.08) 100%
+        ),
+        #f4f4f7 !important;
+    --button-box-shadow:
+        0 -2px 0 0 rgba(0, 0, 0, 0.04) inset, 0 1px 0 0 rgba(237, 237, 240, 0.8) inset,
+        0 3px 0 0 rgba(255, 255, 255, 0.5) inset, 0 1px 1px 0 rgba(0, 0, 0, 0.12),
+        0 2px 5px 0 rgba(0, 0, 0, 0.12);
+}
+a.secondary:hover,
+button.secondary:hover {
+    background:
+        linear-gradient(0deg, rgba(255, 255, 255, 0) -16.18%, rgba(255, 255, 255, 0.4) 100%),
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            rgba(0, 0, 0, 0.08) 100%
+        ),
+        #f4f4f7 !important;
+    --button-box-shadow:
+        0 -2px 0 0 rgba(0, 0, 0, 0.04) inset, 0 1px 0 0 rgba(237, 237, 240, 0.8) inset,
+        0 3px 0 0 rgba(255, 255, 255, 0.5) inset, 0 1px 1px 0 rgba(0, 0, 0, 0.09),
+        0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+
+a.secondary:active:not(:disabled),
+button.secondary:active:not(:disabled) {
+    background:
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            rgba(0, 0, 0, 0.08) 100%
+        ),
+        #f4f4f7 !important;
+    --button-box-shadow:
+        0 1px 4px 4px rgba(0, 0, 0, 0.01), 0 3px 0 0 rgba(255, 255, 255, 0.02) inset,
+        0 -2px 0 0 rgba(0, 0, 0, 0.02) inset, 0 1px 0 0 rgba(250, 250, 251, 0.5) inset,
+        0 1px 1px 0 rgba(0, 0, 0, 0.06), 0 2px 5px 0 rgba(0, 0, 0, 0.06);
+}
+
+.theme-dark a.secondary,
+.theme-dark button.secondary {
+    background:
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0.08) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            #2d2d31 100%
+        ),
+        #2d2d31 !important;
+    --button-color: oklch(0.985 0 0);
+    --button-box-shadow:
+        0 3px 0 0 rgba(255, 255, 255, 0.1) inset, 0 -2px 0 0 #000 inset, 0 1px 0 0 #000 inset,
+        0 1px 1px 0 rgba(0, 0, 0, 0.12), 0 2px 5px 0 rgba(0, 0, 0, 0.16);
+}
+
+.theme-dark a.secondary:hover,
+.theme-dark button.secondary:hover {
+    background:
+        linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0) 100%),
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0.04) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            #2d2d31 100%
+        ),
+        #2d2d31 !important;
+    --button-box-shadow:
+        0 3px 0 0 rgba(255, 255, 255, 0.1) inset, 0 -2px 0 0 #000 inset, 0 1px 0 0 #000 inset,
+        0 1px 1px 0 rgba(0, 0, 0, 0.12), 0 2px 5px 0 rgba(0, 0, 0, 0.12);
+
+    --button-color: oklch(0.985 0 0);
+}
+
+.theme-dark a.secondary:active:not(:disabled),
+.theme-dark button.secondary:active:not(:disabled) {
+    background:
+        linear-gradient(
+            180deg,
+            rgba(255, 255, 255, 0.02) 0%,
+            rgba(0, 0, 0, 0) 40.87%,
+            rgba(0, 0, 0, 0.08) 100%
+        ),
+        #2d2d31 !important;
+    --button-box-shadow:
+        0 3px 0 0 rgba(255, 255, 255, 0.1) inset, 0 -2px 0 0 #000 inset, 0 1px 0 0 #000 inset,
+        0 1px 1px 0 rgba(0, 0, 0, 0.12), 0 2px 5px 0 rgba(0, 0, 0, 0.16);
+}
+
 button.danger {
     --button-color: var(--neutral-0);
 }
diff --git a/src/routes/(console)/organization-[organization]/viewStudio.svelte b/src/routes/(console)/organization-[organization]/viewStudio.svelte
index fc576bdaf..fad67f227 100644
--- a/src/routes/(console)/organization-[organization]/viewStudio.svelte
+++ b/src/routes/(console)/organization-[organization]/viewStudio.svelte
@@ -37,8 +37,9 @@
 
 <style>
     .studio-page {
-        position: relative;
-        width: 100%;
+        position: fixed;
+        width: calc(100vw - 20px);
+        left: 10px;
         height: calc(100vh - 48px);
         overflow: scroll;
         background: var(--bgcolor-neutral-primary);