Link to Learning Lab from the topbar

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/components/AppLayout.tsx

@@ -7,6 +7,9 @@ import { workspaceCredits } from '../api/engine'
 import { Brand, Icon, type IconName } from './Icon'
 import { Toaster } from './Toast'
 
+// Learning Studio (learning-lab/frontend); both apps share one Clerk instance, so the user stays signed in.
+const STUDIO_URL: string = import.meta.env.VITE_STUDIO_URL
+
 // The Production dashboard shows what Express is making; the four settings doors run it:
 // feed the Brain, give an instruction, watch the schedule, collect results.
 export const NAV_GROUPS: { label: Key; items: { to: string; label: Key; icon: IconName }[] }[] = [
@@ -167,6 +170,7 @@ export function AppLayout() {
           <div className="topbar-right">
             <span className="demo-indicator"><i></i> {t('layout.engine')}</span>
             <CreditBalance />
+            <a className="studio-link" href={STUDIO_URL}><Icon name="external" />{t('layout.toStudio')}</a>
             <LanguageSwitch />
           </div>
         </header>

src/components/Icon.tsx

@@ -12,6 +12,7 @@ const paths: Record<string, string> = {
   upload: '<path d="M12 16V4m-5 5 5-5 5 5M4 16v5h16v-5"/>',
   file: '<path d="M5 3h9l5 5v13H5zM14 3v6h5M8 13h8M8 17h6"/>',
   'arrow-right': '<path d="M4 12h16m-6-6 6 6-6 6"/>',
+  external: '<path d="M14 4h6v6M20 4l-9 9M18 14v6H4V6h6"/>',
   close: '<path d="M6 6l12 12M18 6 6 18"/>',
   search: '<circle cx="10" cy="10" r="6"/><path d="m15 15 5 5"/>',
   info: '<circle cx="12" cy="12" r="9"/><path d="M12 11v6M12 7v.2"/>',