diff --git a/website/canvas.html b/website/canvas.html
index fe67b22..29b0716 100644
--- a/website/canvas.html
+++ b/website/canvas.html
@@ -37,7 +37,7 @@
 				left: 12px;
 				display: flex;
 				flex-direction: column;
-				align-items: stretch;
+				align-items: flex-start;
 				gap: 4px;
 				padding: 6px 4px;
 				background: var(--rs-toolbar-bg);
@@ -224,56 +224,37 @@
 				color: white;
 			}
 
-			/* Icon-only toolbar: show only emoji, clip text */
+			/* Icon-only toolbar: show only emoji, fluid expand on hover/open */
 			.toolbar-group-toggle {
-				width: 42px;
+				max-width: 42px;
 				overflow: hidden;
 				text-overflow: clip;
 				text-align: center;
 				padding-left: 0;
 				padding-right: 0;
 				position: relative;
+				transition: max-width 0.25s ease, padding 0.2s ease;
 			}
 
-			/* Tooltip on hover */
-			.toolbar-group-toggle[data-tip]::after {
-				content: attr(data-tip);
-				position: absolute;
-				left: calc(100% + 8px);
-				top: 50%;
-				transform: translateY(-50%);
-				padding: 4px 10px;
-				border-radius: 6px;
-				background: var(--rs-toolbar-panel-bg);
-				color: var(--rs-toolbar-btn-text);
-				font-size: 12px;
-				white-space: nowrap;
-				box-shadow: var(--rs-shadow-md);
-				opacity: 0;
-				pointer-events: none;
-				transition: opacity 0.15s;
-				z-index: 1002;
+			/* 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: 10px;
+				padding-right: 10px;
+				text-align: left;
 			}
 
-			.toolbar-group-toggle[data-tip]:hover::after {
-				opacity: 1;
-			}
-
-			/* Hide tooltip when group is open (dropdown is showing) */
-			.toolbar-group.open > .toolbar-group-toggle[data-tip]::after {
-				display: none;
-			}
-
-			/* Collapse/expand toggle — small pill at bottom of toolbar */
+			/* Collapse/expand toggle — chevron at bottom of toolbar */
 			#toolbar-collapse {
 				padding: 4px 0 !important;
 				background: transparent !important;
-				font-size: 11px !important;
+				font-size: 16px !important;
 				line-height: 1;
 				opacity: 0.4;
 				transition: opacity 0.2s;
 				text-align: center;
-				letter-spacing: 2px;
+				letter-spacing: 0;
 				color: var(--rs-text-muted);
 				order: 999; /* always last */
 				margin-top: auto;
@@ -1531,18 +1512,14 @@
 
 				#toolbar .toolbar-group-toggle {
 					width: 100%;
+					max-width: none;
 					text-align: left;
-					padding: 12px 14px;
-					font-size: 14px;
-					min-height: 44px;
+					padding: 14px 16px;
+					font-size: 16px;
+					min-height: 48px;
 					overflow: visible;
 				}
 
-				/* Hide tooltips on mobile — full text shown */
-				#toolbar .toolbar-group-toggle[data-tip]::after {
-					display: none;
-				}
-
 				#toolbar .toolbar-dropdown {
 					position: static;
 					box-shadow: none;
@@ -1551,16 +1528,17 @@
 				}
 
 				#toolbar .toolbar-dropdown button {
-					padding: 12px 14px;
-					font-size: 14px;
-					min-height: 44px;
+					padding: 14px 16px;
+					font-size: 16px;
+					min-height: 48px;
 				}
 
 				#toolbar > button {
 					width: 100%;
 					text-align: left;
-					padding: 12px 14px;
-					min-height: 44px;
+					padding: 14px 16px;
+					min-height: 48px;
+					font-size: 16px;
 				}
 
 				#toolbar .toolbar-sep {
@@ -1592,6 +1570,12 @@
 					max-height: 50vh;
 				}
 
+				#toolbar-panel-body button {
+					padding: 14px 16px;
+					font-size: 16px;
+					min-height: 48px;
+				}
+
 				/* Bottom toolbar: compact on mobile */
 				#bottom-toolbar {
 					bottom: 8px;
@@ -1831,50 +1815,46 @@
 		</div>
 
 		<div id="toolbar">
+			<!-- 1. Note -->
 			<div class="toolbar-group">
-				<button class="toolbar-group-toggle" data-tip="Note">📝 Note</button>
+				<button class="toolbar-group-toggle">📝 Note</button>
 				<div class="toolbar-dropdown">
 					<button id="new-markdown" title="New Note">📝 Note</button>
 					<button id="new-slide" title="New Slide">🎞️ Slide</button>
+				</div>
+			</div>
+
+			<!-- 2. Connect -->
+			<div class="toolbar-group">
+				<button class="toolbar-group-toggle">🤝 Connect</button>
+				<div class="toolbar-dropdown">
 					<button id="new-chat" title="New Chat">💬 Chat</button>
+					<button id="new-video-chat" title="Video Meet">📹 Video Meet</button>
+					<button id="new-record" title="Record" class="toolbar-disabled">🔴 Record</button>
 				</div>
 			</div>
 
+			<!-- 3. Media -->
 			<div class="toolbar-group">
-				<button class="toolbar-group-toggle" data-tip="Creative">🔮 Creative</button>
+				<button class="toolbar-group-toggle">🎵 Media</button>
 				<div class="toolbar-dropdown">
-					<button id="new-image-gen" title="New AI Image">🎨 AI Image</button>
-					<button id="new-video-gen" title="New AI Video">🎬 AI Video</button>
-					<button id="new-zine-gen" title="Zine Generator">📰 Zine Gen</button>
-					<button id="new-splat" title="New 3D Splat">🔮 3D Splat</button>
-					<button id="new-blender" title="New 3D Blender">🧊 3D Blender</button>
-					<button id="new-drawfast" title="New Drawing">✏️ Drawfast</button>
-					<button id="new-freecad" title="New FreeCAD">📐 FreeCAD</button>
-					<button id="new-kicad" title="New KiCAD PCB">🔌 KiCAD PCB</button>
-					<button id="embed-swag" title="Embed rSwag">🎨 rSwag</button>
-					<button id="embed-pubs" title="Embed rPubs">📖 rPubs</button>
-				</div>
-			</div>
-
-			<div class="toolbar-group">
-				<button class="toolbar-group-toggle" data-tip="Media">🎨 Media</button>
-				<div class="toolbar-dropdown">
-					<button id="new-transcription" title="New Transcription">🎤 Transcribe</button>
-					<button id="new-video-chat" title="New Video Call">📹 Video Call</button>
-					<button id="new-piano" title="New Piano">🎹 Piano</button>
-					<button id="embed-photos" title="Embed rPhotos">📸 rPhotos</button>
+					<button id="new-transcription" title="Transcribe">🎤 Transcribe</button>
+					<button id="new-stream" title="Stream" class="toolbar-disabled">📡 Stream</button>
+					<button id="new-piano" title="Piano">🎹 Piano</button>
 					<button id="embed-tube" title="Embed rTube">🎬 rTube</button>
+					<button id="embed-photos" title="Embed rPhotos">📸 rPhotos</button>
 				</div>
 			</div>
 
+			<!-- 4. Embed -->
 			<div class="toolbar-group">
-				<button class="toolbar-group-toggle" data-tip="Embed">🔗 Embed</button>
+				<button class="toolbar-group-toggle">🔗 Embed</button>
 				<div class="toolbar-dropdown">
-					<button id="new-embed" title="New Embed">🔗 Web Embed</button>
-					<button id="new-google-item" title="New Google Item">📎 Google</button>
-					<button id="new-calendar" title="New Calendar">📅 Calendar</button>
-					<button id="new-map" title="New Map">🗺️ Map</button>
-					<button id="new-social-post" title="New Post">📱 Social Post</button>
+					<button id="new-embed" title="Web Embed">🔗 Web Embed</button>
+					<button id="new-google-item" title="Google">📎 Google</button>
+					<button id="new-calendar" title="Calendar">📅 Calendar</button>
+					<button id="new-map" title="Map">🗺️ Map</button>
+					<button id="new-social-post" title="Social Post">📱 Social Post</button>
 					<button id="embed-notes" title="Embed rNotes">📝 rNotes</button>
 					<button id="embed-books" title="Embed rBooks">📚 rBooks</button>
 					<button id="embed-forum" title="Embed rForum">💬 rForum</button>
@@ -1887,41 +1867,68 @@
 				</div>
 			</div>
 
+			<!-- 5. AI -->
 			<div class="toolbar-group">
-				<button class="toolbar-group-toggle" data-tip="AI">🤖 AI</button>
+				<button class="toolbar-group-toggle">🤖 AI</button>
 				<div class="toolbar-dropdown">
-					<button id="new-prompt" title="New AI Chat">🤖 AI Chat</button>
-					<button id="new-workflow" title="New Workflow">⚙️ Workflow</button>
+					<button id="new-prompt" title="AI Chat">🤖 AI Chat</button>
+					<button id="new-workflow" title="Workflow">⚙️ Workflow</button>
+					<button id="new-image-gen" title="AI Image">🎨 AI Image</button>
+					<button id="new-video-gen" title="AI Video">🎬 AI Video</button>
+					<button id="new-zine-gen" title="Zine Gen">📰 Zine Gen</button>
 				</div>
 			</div>
 
+			<!-- 6. Create -->
 			<div class="toolbar-group">
-				<button class="toolbar-group-toggle" data-tip="Travel">✈️ Travel</button>
+				<button class="toolbar-group-toggle">🛠️ Create</button>
 				<div class="toolbar-dropdown">
-					<button id="new-itinerary" title="New Itinerary">🗓️ Itinerary</button>
-					<button id="new-destination" title="New Destination">📍 Destination</button>
-					<button id="new-budget" title="New Budget">💰 Budget</button>
-					<button id="new-packing-list" title="New Packing List">🎒 Packing List</button>
-					<button id="new-booking" title="New Booking">✈️ Booking</button>
+					<button id="new-splat" title="3D Splat">🔮 3D Splat</button>
+					<button id="new-blender" title="3D Blender">🧊 Blender</button>
+					<button id="new-drawfast" title="Drawfast">✏️ Drawfast</button>
+					<button id="new-freecad" title="FreeCAD">📐 FreeCAD</button>
+					<button id="new-kicad" title="KiCAD PCB">🔌 KiCAD</button>
+					<button id="embed-swag" title="Embed rSwag">🎨 rSwag</button>
+					<button id="embed-pubs" title="Embed rPubs">📖 rPubs</button>
 				</div>
 			</div>
 
+			<!-- 7. Decide -->
 			<div class="toolbar-group">
-				<button class="toolbar-group-toggle" data-tip="Decide">📊 Decide</button>
+				<button class="toolbar-group-toggle">📊 Decide</button>
 				<div class="toolbar-dropdown">
-					<button id="new-choice-vote" title="New Poll">☑ Poll</button>
-					<button id="new-choice-rank" title="New Ranking">📊 Ranking</button>
-					<button id="new-choice-spider" title="New Scoring">🕸 Scoring</button>
-					<button id="new-spider-3d" title="3D Spider Plot">📊 3D Spider</button>
-					<button id="new-conviction" title="Conviction Ranking">⏳ Conviction</button>
-					<button id="new-token" title="New Token">🪙 Token</button>
-					<button id="embed-flows" title="Embed rFlows">🌊 rFlows</button>
-					<button id="embed-wallet" title="Embed rWallet">💰 rWallet</button>
+					<button id="new-choice-vote" title="Poll">☑ Poll</button>
+					<button id="new-choice-rank" title="Ranking">📊 Ranking</button>
+					<button id="new-choice-spider" title="Scoring">🕸 Scoring</button>
+					<button id="new-spider-3d" title="3D Spider">📊 3D Spider</button>
+					<button id="new-conviction" title="Conviction">⏳ Conviction</button>
+					<button id="new-token" title="Token">🪙 Token</button>
 					<button id="embed-vote" title="Embed rVote">🗳️ rVote</button>
 				</div>
 			</div>
 
-			<button id="toolbar-collapse" title="Minimize toolbar">···</button>
+			<!-- 8. Spend -->
+			<div class="toolbar-group">
+				<button class="toolbar-group-toggle">💰 Spend</button>
+				<div class="toolbar-dropdown">
+					<button id="embed-wallet" title="rWallet">💰 rWallet</button>
+					<button id="embed-flows" title="rFlows">🌊 rFlows</button>
+				</div>
+			</div>
+
+			<!-- 9. Travel -->
+			<div class="toolbar-group">
+				<button class="toolbar-group-toggle">✈️ Travel</button>
+				<div class="toolbar-dropdown">
+					<button id="new-itinerary" title="Itinerary">🗓️ Itinerary</button>
+					<button id="new-destination" title="Destination">📍 Destination</button>
+					<button id="new-budget" title="Budget">💰 Budget</button>
+					<button id="new-packing-list" title="Packing List">🎒 Packing List</button>
+					<button id="new-booking" title="Booking">✈️ Booking</button>
+				</div>
+			</div>
+
+			<button id="toolbar-collapse" title="Minimize toolbar">‹</button>
 		</div>
 
 		<div id="toolbar-panel">
@@ -3587,6 +3594,8 @@
 			document.getElementById("new-prompt").addEventListener("click", () => setPendingTool("folk-prompt"));
 			document.getElementById("new-transcription").addEventListener("click", () => setPendingTool("folk-transcription"));
 			document.getElementById("new-video-chat").addEventListener("click", () => setPendingTool("folk-video-chat"));
+			document.getElementById("new-record").addEventListener("click", () => setPendingTool("folk-record"));
+			document.getElementById("new-stream").addEventListener("click", () => setPendingTool("folk-stream"));
 			document.getElementById("new-workflow").addEventListener("click", () => {
 				setPendingTool("folk-workflow-block", {
 					blockType: "trigger",
@@ -4924,7 +4933,7 @@
 			const collapseBtn = document.getElementById("toolbar-collapse");
 			collapseBtn.addEventListener("click", () => {
 				const isCollapsed = toolbarEl.classList.toggle("collapsed");
-				collapseBtn.textContent = isCollapsed ? "▶" : "···";
+				collapseBtn.textContent = isCollapsed ? "›" : "‹";
 				collapseBtn.title = isCollapsed ? "Expand toolbar" : "Minimize toolbar";
 			});