diff --git a/website/canvas.html b/website/canvas.html
index 76d0ed1..4b71c1c 100644
--- a/website/canvas.html
+++ b/website/canvas.html
@@ -45,9 +45,7 @@
 				box-shadow: var(--rs-shadow-md);
 				z-index: 1000;
 				max-height: calc(100vh - 130px);
-				overflow-y: auto;
-				overflow-x: visible;
-				scrollbar-width: thin;
+				overflow: visible;
 			}
 
 			/* Dropdown group container */
@@ -249,37 +247,33 @@
 			}
 			.tg-label {
 				display: none;
-				font-size: 12px;
+				position: absolute;
+				left: 100%;
+				top: 50%;
+				transform: translateY(-50%);
+				margin-left: 6px;
+				font-size: 11px;
 				font-weight: 600;
 				white-space: nowrap;
+				background: var(--rs-toolbar-panel-bg, #1e293b);
+				color: var(--rs-text-primary, #e2e8f0);
+				padding: 4px 8px;
+				border-radius: 6px;
+				box-shadow: var(--rs-shadow-md);
+				pointer-events: none;
+				z-index: 1002;
 			}
 
-			/* Icon-only toolbar: show only emoji, fluid expand on hover/open */
+			/* Icon-only toolbar: fixed width, label pops out */
 			.toolbar-group-toggle {
-				max-width: 42px;
-				overflow: hidden;
-				text-overflow: clip;
-				text-align: center;
-				padding-left: 0;
-				padding-right: 0;
+				overflow: visible;
 				position: relative;
-				transition: max-width 0.25s ease, padding 0.2s ease;
-				gap: 6px;
-			}
-
-			/* Fluid expand: show title text on hover or when group is open */
-			.toolbar-group:hover > .toolbar-group-toggle,
-			.toolbar-group.open > .toolbar-group-toggle {
-				max-width: 160px;
-				padding-left: 8px;
-				padding-right: 10px;
-				text-align: left;
-				justify-content: flex-start;
 			}
 
+			/* Show label outside toolbar on hover or when group is open */
 			.toolbar-group:hover > .toolbar-group-toggle .tg-label,
 			.toolbar-group.open > .toolbar-group-toggle .tg-label {
-				display: inline;
+				display: block;
 			}
 
 			/* Collapse/expand toggle — at top of toolbar */