diff --git a/src/index.css b/src/index.css
index 6baad17..eca6e28 100644
--- a/src/index.css
+++ b/src/index.css
@@ -3476,3 +3476,108 @@ details[open] > .untangled-language-bar {
 	grid-template-columns: auto 1fr auto;
 }
 
+
+.untangled-topbar-menu {
+	position: relative;
+}
+
+.untangled-topbar-menu-summary {
+	cursor: pointer;
+	list-style: none;
+	display: flex;
+	align-items: center;
+	gap: 0.5rem;
+}
+
+.untangled-topbar-menu-summary::-webkit-details-marker {
+	display: none;
+}
+
+.untangled-topbar-menu-dropdown {
+	position: absolute;
+	right: 0;
+	margin-top: 0.5rem;
+	border-radius: 0.375rem;
+	background-color: rgb(255 255 255);
+	border: 1px solid rgb(229 231 235);
+	box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+	z-index: 50;
+	font-size: 0.875rem;
+	width: 14rem;
+	overflow: hidden;
+}
+
+@media (prefers-color-scheme: dark) {
+	.untangled-topbar-menu-dropdown {
+		background-color: rgb(31 41 55);
+		border-color: rgb(55 65 81);
+	}
+}
+
+.untangled-topbar-menu-item {
+	display: flex;
+	width: 100%;
+	align-items: center;
+	gap: 0.75rem;
+	padding: 0.625rem 1rem;
+	text-align: left;
+	text-decoration: none;
+	color: inherit;
+	transition: background-color 150ms;
+	border: 0;
+	background: transparent;
+	cursor: pointer;
+}
+
+.untangled-topbar-menu-item:hover {
+	background-color: rgb(243 244 246);
+	text-decoration: none;
+}
+
+@media (prefers-color-scheme: dark) {
+	.untangled-topbar-menu-item:hover {
+		background-color: rgb(55 65 81 / 0.5);
+	}
+}
+
+.untangled-topbar-menu-item-danger {
+	color: rgb(239 68 68);
+}
+
+.untangled-topbar-menu-item-danger:hover {
+	background-color: rgb(254 242 242);
+}
+
+@media (prefers-color-scheme: dark) {
+	.untangled-topbar-menu-item-danger:hover {
+		background-color: rgb(153 27 27 / 0.2);
+	}
+}
+
+.untangled-topbar-menu-add-account-icon {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	width: 1.5rem;
+	height: 1.5rem;
+	border-radius: 9999px;
+	background-color: rgb(229 231 235);
+	color: rgb(55 65 81);
+}
+
+@media (prefers-color-scheme: dark) {
+	.untangled-topbar-menu-add-account-icon {
+		background-color: rgb(75 85 99);
+		color: rgb(229 231 235);
+	}
+}
+
+.untangled-topbar-menu-item-separator {
+	border-top: 1px solid rgb(229 231 235);
+}
+
+@media (prefers-color-scheme: dark) {
+	.untangled-topbar-menu-item-separator {
+		border-color: rgb(55 65 81);
+	}
+}
diff --git a/src/layout.tsx b/src/layout.tsx
index 8ea7aa2..a78dc49 100644
--- a/src/layout.tsx
+++ b/src/layout.tsx
@@ -1,5 +1,5 @@
 import clsx from 'clsx';
-import { Bell, LogOut, RotateCcw, Save, Search, Settings, UserRound } from 'lucide-solid';
+import { Bell, BookMarked, LogOut, Plus, RotateCcw, Save, Search, Settings, UserRound } from 'lucide-solid';
 import { A, useLocation, useNavigate } from '@solidjs/router';
 import { createQuery, useQueryClient } from '@tanstack/solid-query';
 import { For, Show, createEffect, createSignal, onCleanup, onMount, type Component, type JSX } from 'solid-js';
@@ -218,40 +218,55 @@ const UserProfileMenu: Component = () => {
 		queryFn: async () => resolveActor(auth.currentDid()!),
 	}));
 
+	const closeMenu = (e: MouseEvent) => {
+		const details = (e.currentTarget as HTMLElement).closest('details');
+		if (details) details.open = false;
+	};
+
 	return (
-		<details data-topbar-menu class="relative">
-			<summary class="cursor-pointer list-none flex items-center gap-2">
+		<details data-topbar-menu class="untangled-topbar-menu">
+			<summary class="untangled-topbar-menu-summary">
 				<Avatar did={auth.currentDid()!} size="size-8 md:size-6" />
 				<span class="hidden md:inline">{viewerQuery.data?.handle ?? auth.currentDid()}</span>
 			</summary>
-			<div class="absolute right-0 mt-4 rounded bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 shadow-lg z-50 text-sm w-56">
-				<div class="px-4 py-3 border-b border-gray-200 dark:border-gray-700">
-					<div class="font-medium truncate">{viewerQuery.data?.handle ?? auth.currentDid()}</div>
-					<div class="text-gray-500 dark:text-gray-400 truncate">{auth.currentDid()}</div>
-				</div>
-				<Show when={viewerQuery.data?.handle}>
-					{(handle) => (
-						<A
-							href={`/${handle()}`}
-							class="w-full px-4 py-3 flex items-center gap-2 text-left hover:bg-gray-50 hover:dark:bg-gray-700/50 text-black dark:text-white no-underline hover:no-underline border-b border-gray-200 dark:border-gray-700"
-							onClick={(e) => {
-								const details = e.currentTarget.closest('details');
-								if (details) details.open = false;
-							}}
-						>
-							<UserRound class="size-4" />
-							profile
-						</A>
-					)}
-				</Show>
-				<button
-					type="button"
-					class="w-full px-4 py-3 flex items-center gap-2 text-left hover:bg-gray-50 hover:dark:bg-gray-700/50"
-					onClick={() => void auth.signOut()}
-				>
-					<LogOut class="size-4" />
-					logout
+			<div class="untangled-topbar-menu-dropdown">
+				<button type="button" class="untangled-topbar-menu-item" onClick={() => void auth.signIn()}>
+					<div class="untangled-topbar-menu-add-account-icon">
+						<Plus class="size-4" />
+					</div>
+					add account
 				</button>
+
+				<div class="untangled-topbar-menu-item-separator">
+					<Show when={viewerQuery.data?.handle}>
+						{(handle) => (
+							<>
+								<A href={`/${handle()}`} class="untangled-topbar-menu-item" onClick={closeMenu}>
+									<UserRound class="size-4" />
+									profile
+								</A>
+								<A href={`/${handle()}?tab=repos`} class="untangled-topbar-menu-item" onClick={closeMenu}>
+									<BookMarked class="size-4" />
+									repositories
+								</A>
+							</>
+						)}
+					</Show>
+
+					<A href="/settings" class="untangled-topbar-menu-item" onClick={closeMenu}>
+						<Settings class="size-4" />
+						settings
+					</A>
+
+					<button
+						type="button"
+						class="untangled-topbar-menu-item untangled-topbar-menu-item-danger"
+						onClick={() => void auth.signOut()}
+					>
+						<LogOut class="size-4" />
+						logout
+					</button>
+				</div>
 			</div>
 		</details>
 	);
@@ -335,11 +350,21 @@ const Topbar: Component = () => {
 	return (
 		<nav ref={(element) => { topbar = element; }} class="mx-auto space-x-4 px-6 py-2">
 			<div class="flex justify-between gap-4 p-0 items-center">
-				<A href="/" class="text-2xl no-underline hover:no-underline flex shrink-0 items-center gap-2">
-					<img src="/static/logos/dolly.svg" alt="" class="size-8" />
-					<span class="font-bold text-xl">untangled</span>
-					<span class="font-normal text-xs rounded bg-gray-100 dark:bg-gray-700 px-1">alpha</span>
-				</A>
+				<div class="flex shrink-0 items-center gap-2">
+					<A href="/" class="flex shrink-0 items-center gap-2 no-underline hover:no-underline">
+						<img src="/static/logos/dolly.svg" alt="" class="size-8" />
+						<div class="flex flex-col">
+							<span class="font-bold text-xl leading-none">untangled</span>
+							<a
+								href="https://untangled.wisp.place/ptr.pet/untangled"
+								class="text-[10px] leading-none text-gray-400 dark:text-gray-500 hover:text-blue-500 dark:hover:text-blue-400 no-underline transition-colors mt-0.5"
+								onClick={(e) => e.stopPropagation()}
+							>
+								src
+							</a>
+						</div>
+					</A>
+				</div>
 
 				<div class="flex shrink-0 items-center gap-4">
 					<TopbarSearch />