feat(nav): add cursor-pointer and tooltip to notification bell

Extract bellLabel as $derived to DRY up aria-label and title.
Add cursor-pointer globally to button via @layer base so Tailwind
preflight reset doesn't override the browser default.

Closes #344

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/lib/components/NotificationBell.svelte.spec.ts

@@ -55,6 +55,34 @@ async function openDropdownAndClickFirstNotification() {
 	notifButton.click();
 }
 
+describe('NotificationBell — cursor and tooltip', () => {
+	it('bell button has cursor-pointer class', async () => {
+		render(NotificationBell);
+		const btn = document.querySelector<HTMLButtonElement>('button[aria-haspopup="true"]')!;
+		expect(btn.classList.contains('cursor-pointer')).toBe(true);
+	});
+
+	it('bell button title equals aria-label when unreadCount is 0', async () => {
+		mockNotificationList.value = [];
+		render(NotificationBell);
+		const btn = document.querySelector<HTMLButtonElement>('button[aria-haspopup="true"]')!;
+		expect(btn.getAttribute('title')).toBe('Benachrichtigungen');
+		expect(btn.getAttribute('aria-label')).toBe(btn.getAttribute('title'));
+	});
+
+	it('bell button title equals aria-label when unreadCount is 3', async () => {
+		mockNotificationList.value = [
+			makeNotification({ id: 'n1' }),
+			makeNotification({ id: 'n2' }),
+			makeNotification({ id: 'n3' })
+		];
+		render(NotificationBell);
+		const btn = document.querySelector<HTMLButtonElement>('button[aria-haspopup="true"]')!;
+		expect(btn.getAttribute('title')).toBe('3 ungelesene Benachrichtigungen');
+		expect(btn.getAttribute('aria-label')).toBe(btn.getAttribute('title'));
+	});
+});
+
 describe('NotificationBell', () => {
 	it('handleMarkRead navigates to URL including annotationId when notification has annotationId', async () => {
 		mockNotificationList.value = [makeNotification({ annotationId: 'annot-1' })];