@meith/web 0.33.1 → 0.33.3

package/app/(board)/members/page.tsx

@@ -22,7 +22,7 @@ export async function generateMetadata(): Promise<Metadata> {
 }
 
 const INPUT =
-  'rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 export default async function MembersPage({
   searchParams,

package/app/(board)/thread/[slug]/page.tsx

@@ -1,6 +1,5 @@
 import type { Metadata } from 'next'
 import { notFound, redirect } from 'next/navigation'
-import { after as scheduleAfterResponse } from 'next/server'
 
 import { currentRequestId } from '@meith/core/logger'
 import { acceptsThreads, canHoldThreads } from '@meith/forums'
@@ -268,14 +267,11 @@ export default async function ThreadPage({
   })
 
   if (readState !== null && actor.userId !== null) {
-    const readerId = actor.userId
     const lastRenderedPostId = postPage.rows.at(-1)?.id
     if (lastRenderedPostId !== undefined) {
-      scheduleAfterResponse(() =>
-        readState
-          .markThreadRead(readerId, thread.id, lastRenderedPostId, new Date())
-          .catch(() => undefined),
-      )
+      await readState
+        .markThreadRead(actor.userId, thread.id, lastRenderedPostId, new Date())
+        .catch(() => undefined)
     }
   }
 

package/app/admin/content/attachments/page.tsx

@@ -111,7 +111,7 @@ export default async function AdminAttachmentsPage({
           <input
             name="filename"
             defaultValue={filename ?? ''}
-            className="w-full rounded-md border border-border bg-background px-3 py-2 text-sm"
+            className="w-full rounded-md border border-input bg-card px-3 py-2 text-sm"
           />
         </label>
 
@@ -120,7 +120,7 @@ export default async function AdminAttachmentsPage({
           <select
             name="status"
             defaultValue={status ?? ''}
-            className="rounded-md border border-border bg-background px-3 py-2 text-sm"
+            className="rounded-md border border-input bg-card px-3 py-2 text-sm"
           >
             <option value="">{translator.t('adminAttachments.any')}</option>
             <option value="ready">{translator.t('adminAttachments.ready')}</option>

package/app/admin/layout.tsx

@@ -73,13 +73,30 @@ export default async function AdminLayout({ children }: { children: React.ReactN
         {await tr('page.skip-content')}
       </a>
 
-      <header className="sticky top-0 z-30 border-b border-border bg-card">
-        <div className="mx-auto flex min-h-14 w-full max-w-6xl items-center gap-x-3 px-4 py-2 sm:gap-x-4 sm:px-6">
+      <header className="sticky top-0 z-30 border-b border-border bg-card/95 backdrop-blur supports-[backdrop-filter]:bg-card/85">
+        <div className="mx-auto flex h-14 w-full max-w-6xl items-center gap-x-3 px-4 sm:gap-x-4 sm:px-6">
           <a
             href="/admin"
-            className="min-w-0 truncate font-heading text-base font-semibold whitespace-nowrap text-foreground sm:text-lg"
+            className="flex min-w-0 items-center gap-2.5 font-heading text-base font-semibold whitespace-nowrap text-foreground sm:text-lg"
           >
-            {await tr('page.control-panel')}
+            <span
+              aria-hidden="true"
+              className="flex size-8 shrink-0 items-center justify-center rounded-lg bg-primary text-primary-foreground shadow-sm"
+            >
+              <svg
+                aria-hidden="true"
+                viewBox="0 0 16 16"
+                className="size-4"
+                fill="none"
+                stroke="currentColor"
+                strokeWidth="1.5"
+                strokeLinecap="round"
+                strokeLinejoin="round"
+              >
+                <path d="M3 4.5h10M3 8h10M3 11.5h10M6 3v3M10.5 6.5v3M5 10v3" />
+              </svg>
+            </span>
+            <span className="truncate">{await tr('page.control-panel')}</span>
           </a>
           <div className="ml-auto flex shrink-0 items-center gap-3 text-sm whitespace-nowrap sm:gap-4">
             <AdminSignOutForm copy={adminFormsCopy(t)} />

package/app/admin/users/[id]/merge/page.tsx

@@ -17,7 +17,7 @@ export async function generateMetadata(): Promise<Metadata> {
 }
 
 const INPUT =
-  'w-full rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 export default async function AdminMergePage({
   params,

package/app/admin/users/page.tsx

@@ -24,7 +24,7 @@ export async function generateMetadata(): Promise<Metadata> {
 }
 
 const INPUT =
-  'w-full rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 export default async function AdminUsersPage({
   searchParams,

package/app/admin/users/prune/page.tsx

@@ -16,7 +16,7 @@ export async function generateMetadata(): Promise<Metadata> {
 }
 
 const INPUT =
-  'w-full rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 export default async function AdminPrunePage({
   searchParams,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meith/web",
-  "version": "0.33.1",
+  "version": "0.33.3",
   "description": "The board itself: the Next.js app, and the forum-web bin that materializes it into an external board workspace.",
   "license": "MIT",
   "repository": {
@@ -43,54 +43,54 @@
     "react-dom": "19.2.8",
     "tailwindcss": "^4.3.3",
     "typescript": "7.0.2",
-    "@meith/accounts": "0.33.1",
-    "@meith/admin": "0.33.1",
-    "@meith/antispam": "0.33.1",
-    "@meith/api": "0.33.1",
-    "@meith/attachments": "0.33.1",
-    "@meith/authorization": "0.33.1",
-    "@meith/avatars": "0.33.1",
-    "@meith/board-digest": "0.33.1",
-    "@meith/core": "0.33.1",
-    "@meith/db": "0.33.1",
-    "@meith/demo": "0.33.1",
-    "@meith/drafts": "0.33.1",
-    "@meith/drivers": "0.33.1",
-    "@meith/events": "0.33.1",
-    "@meith/forums": "0.33.1",
-    "@meith/groups": "0.33.1",
-    "@meith/i18n": "0.33.1",
-    "@meith/import": "0.33.1",
-    "@meith/install": "0.33.1",
-    "@meith/mail": "0.33.1",
-    "@meith/markdown": "0.33.1",
-    "@meith/marketplace": "0.33.1",
-    "@meith/messages": "0.33.1",
-    "@meith/moderation": "0.33.1",
-    "@meith/notifications": "0.33.1",
-    "@meith/plugin-calendar": "0.33.1",
-    "@meith/plugin-dues": "0.33.1",
-    "@meith/plugin-kit": "0.33.1",
-    "@meith/polls": "0.33.1",
-    "@meith/posts": "0.33.1",
-    "@meith/profile-fields": "0.33.1",
-    "@meith/relations": "0.33.1",
-    "@meith/reputation": "0.33.1",
-    "@meith/runtime": "0.33.1",
-    "@meith/search": "0.33.1",
-    "@meith/settings": "0.33.1",
-    "@meith/signatures": "0.33.1",
-    "@meith/subscriptions": "0.33.1",
-    "@meith/tasks": "0.33.1",
-    "@meith/theme-clubhouse": "0.33.1",
-    "@meith/theme-default": "0.33.1",
-    "@meith/theme-kit": "0.33.1",
-    "@meith/theme-midnight": "0.33.1",
-    "@meith/theme-phasebook": "0.33.1",
-    "@meith/theme-raidframe": "0.33.1",
-    "@meith/threads": "0.33.1",
-    "@meith/ui": "0.33.1",
-    "@meith/upgrade": "0.33.1"
+    "@meith/accounts": "0.33.3",
+    "@meith/admin": "0.33.3",
+    "@meith/antispam": "0.33.3",
+    "@meith/api": "0.33.3",
+    "@meith/attachments": "0.33.3",
+    "@meith/authorization": "0.33.3",
+    "@meith/avatars": "0.33.3",
+    "@meith/board-digest": "0.33.3",
+    "@meith/core": "0.33.3",
+    "@meith/db": "0.33.3",
+    "@meith/demo": "0.33.3",
+    "@meith/drafts": "0.33.3",
+    "@meith/drivers": "0.33.3",
+    "@meith/events": "0.33.3",
+    "@meith/forums": "0.33.3",
+    "@meith/groups": "0.33.3",
+    "@meith/i18n": "0.33.3",
+    "@meith/import": "0.33.3",
+    "@meith/install": "0.33.3",
+    "@meith/mail": "0.33.3",
+    "@meith/markdown": "0.33.3",
+    "@meith/marketplace": "0.33.3",
+    "@meith/messages": "0.33.3",
+    "@meith/moderation": "0.33.3",
+    "@meith/notifications": "0.33.3",
+    "@meith/plugin-calendar": "0.33.3",
+    "@meith/plugin-dues": "0.33.3",
+    "@meith/plugin-kit": "0.33.3",
+    "@meith/polls": "0.33.3",
+    "@meith/posts": "0.33.3",
+    "@meith/profile-fields": "0.33.3",
+    "@meith/reputation": "0.33.3",
+    "@meith/relations": "0.33.3",
+    "@meith/runtime": "0.33.3",
+    "@meith/search": "0.33.3",
+    "@meith/settings": "0.33.3",
+    "@meith/signatures": "0.33.3",
+    "@meith/subscriptions": "0.33.3",
+    "@meith/tasks": "0.33.3",
+    "@meith/theme-default": "0.33.3",
+    "@meith/theme-clubhouse": "0.33.3",
+    "@meith/theme-kit": "0.33.3",
+    "@meith/theme-midnight": "0.33.3",
+    "@meith/theme-phasebook": "0.33.3",
+    "@meith/theme-raidframe": "0.33.3",
+    "@meith/threads": "0.33.3",
+    "@meith/ui": "0.33.3",
+    "@meith/upgrade": "0.33.3"
   },
   "scripts": {
     "dev": "next dev",

package/src/components/account/avatar-form.tsx

@@ -92,7 +92,7 @@ export function AvatarForm({
             type="file"
             name="avatar"
             accept=".png,.jpg,.jpeg"
-            className="rounded-md border border-border bg-background px-3 py-2 text-sm file:mr-3 file:rounded file:border-0 file:bg-muted file:px-3 file:py-1 file:text-sm"
+            className="rounded-md border border-input bg-card px-3 py-2 text-sm file:mr-3 file:rounded file:border-0 file:bg-muted file:px-3 file:py-1 file:text-sm"
           />
           <span className="text-xs text-muted-foreground">
             {fromCopy(copy, 'accountForm.avatar.hint')}

package/src/components/account/notification-forms.tsx

@@ -204,7 +204,7 @@ export function AnnouncementsOptInForm({ optedIn, copy }: { optedIn: boolean; co
 }
 
 const FIELD =
-  'w-full max-w-xs rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full max-w-xs rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 export function BoardDigestCadenceForm({ cadence, copy }: { cadence: string; copy: Copy }) {
   const [state, action] = useActionState(saveBoardDigestCadenceAction, EMPTY_STATE)

package/src/components/account/reputation-forms.tsx

@@ -9,7 +9,7 @@ import { FormError, PendingButton } from '../auth/form-controls'
 import { type Copy, fromCopy } from '../shell/copy'
 
 const FIELD =
-  'w-full rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 const CARD = 'flex flex-col gap-3 rounded-lg border border-border bg-card p-5'
 

package/src/components/account/usercp-forms.tsx

@@ -22,7 +22,7 @@ import { type Copy, fromCopy } from '../shell/copy'
 export type { CustomFieldInput }
 
 const FIELD =
-  'w-full rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 const BUTTON =
   'inline-flex h-9 items-center justify-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground transition-opacity hover:opacity-90 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'

package/src/components/admin/form-bits.tsx

@@ -1,7 +1,7 @@
 import { Alert, AlertDescription } from '@meith/ui'
 
 export const INPUT =
-  'w-full rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 export function Saved({ when = true, children }: { when?: boolean; children: React.ReactNode }) {
   if (!when) return null

package/src/components/admin/forum-forms.tsx

@@ -368,7 +368,10 @@ function MatrixSection({
           </thead>
           <tbody>
             {rows.map((row) => (
-              <tr key={row.key} className="border-b border-border/60 last:border-b-0">
+              <tr
+                key={row.key}
+                className="scroll-mt-16 scroll-mb-24 border-b border-border/60 last:border-b-0"
+              >
                 <th
                   scope="row"
                   title={row.description}

package/src/components/admin/oklch-picker.tsx

@@ -120,7 +120,7 @@ export function OklchPicker({
           value={value}
           onChange={(event) => onChange(event.target.value)}
           placeholder={shipped}
-          className="w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
+          className="w-full rounded-md border border-input bg-card px-3 py-2 font-mono text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
         />
       </div>
 

package/src/components/admin/system-forms.tsx

@@ -135,7 +135,7 @@ export function RetryJobForm({ copy }: { copy: Copy }) {
         <span className="font-medium">{fromCopy(copy, 'adminPanel.system.jobId')}</span>
         <input
           name="jobId"
-          className="w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-xs"
+          className="w-full rounded-md border border-input bg-card px-3 py-2 font-mono text-xs"
           required
         />
         <span className="text-xs text-muted-foreground">

package/src/components/admin/theme-forms.tsx

@@ -40,7 +40,7 @@ import { type CellState, PaletteGrid } from './theme-palette'
 import { ThemePreview, ValidatedSample } from './theme-preview'
 
 const INPUT =
-  'w-full rounded-md border border-border bg-background px-3 py-2 font-mono text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 font-mono text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 const GHOST_BUTTON =
   'inline-flex h-8 items-center justify-center rounded-md border border-border px-3 text-xs font-medium hover:bg-accent hover:text-accent-foreground focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
@@ -348,7 +348,7 @@ export function ThemeEditorForm({
                   value={query}
                   onChange={(event) => setQuery(event.target.value)}
                   placeholder={fromCopy(copy, 'adminTheme.find.placeholder')}
-                  className="w-full rounded-md border border-border bg-background px-3 py-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
+                  className="w-full rounded-md border border-input bg-card px-3 py-2 text-xs focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
                 />
               </label>
 

package/src/components/content/edit-post-form.tsx

@@ -117,7 +117,7 @@ export function EditPostForm({
           name="reason"
           maxLength={200}
           defaultValue={state.values?.reason ?? reason ?? ''}
-          className="rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
+          className="rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
         />
       </label>
 

package/src/components/content/new-thread-form.tsx

@@ -128,7 +128,7 @@ export function NewThreadForm({
           <select
             name="prefixId"
             defaultValue={state.values?.prefixId ?? draft?.prefixId?.toString() ?? ''}
-            className="h-10 rounded-md border border-border bg-background px-3 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
+            className="h-10 rounded-md border border-input bg-card px-3 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
           >
             <option value="">
               {requiresPrefix
@@ -183,7 +183,7 @@ export function NewThreadForm({
               min={0}
               step={1}
               defaultValue={pollDraft?.maxOptions ?? '1'}
-              className="h-10 rounded-md border border-border bg-background px-3 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
+              className="h-10 rounded-md border border-input bg-card px-3 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
             />
             <span className="text-xs text-muted-foreground">
               {fromCopy(copy, 'composer.newThread.pollChoicesHint')}
@@ -215,7 +215,7 @@ export function NewThreadForm({
               type="datetime-local"
               name="pollClosesAt"
               defaultValue={pollDraft?.closesAt ?? ''}
-              className="h-10 rounded-md border border-border bg-background px-3 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
+              className="h-10 rounded-md border border-input bg-card px-3 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring"
             />
             <span className="text-xs text-muted-foreground">
               {fromCopy(copy, 'pollEdit.closesAtHint')}

package/src/components/messages/message-forms.tsx

@@ -12,7 +12,7 @@ import { type Copy, fromCopy } from '../shell/copy'
 import { RecipientField } from './recipient-field'
 
 const FIELD =
-  'w-full rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 const BUTTON =
   'inline-flex h-9 items-center justify-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground transition-opacity hover:opacity-90 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'

package/src/components/moderation/warning-forms.tsx

@@ -9,7 +9,7 @@ import { FormError, PendingButton } from '../auth/form-controls'
 import { type Copy, fromCopy } from '../shell/copy'
 
 const FIELD =
-  'w-full rounded-md border border-border bg-background px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
+  'w-full rounded-md border border-input bg-card px-3 py-2 text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'
 
 const BUTTON =
   'inline-flex h-9 items-center justify-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground transition-opacity hover:opacity-90 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring'

package/src/components/shell/panel-list.tsx

@@ -4,13 +4,13 @@ export const PANEL_LIST =
   'flex flex-col divide-y divide-border overflow-hidden rounded-xl border border-border bg-card shadow-elevation'
 
 export const PANEL_ROW =
-  'flex flex-wrap items-center justify-between gap-x-3 gap-y-2 px-4 py-3 transition-colors hover:bg-muted/40'
+  'flex flex-wrap items-center justify-between gap-x-3 gap-y-2 px-4 py-3 transition-colors hover:bg-muted/40 sm:px-5'
 
 export const PANEL_CARD =
-  'flex flex-col gap-3 rounded-xl border border-border bg-card p-4 shadow-elevation'
+  'flex flex-col gap-4 rounded-xl border border-border bg-card p-5 shadow-elevation sm:p-6'
 
 export const PANEL_NOTE =
-  'rounded-xl border border-border bg-card p-4 text-sm text-muted-foreground shadow-elevation'
+  'rounded-xl border border-border bg-card px-5 py-4 text-sm text-muted-foreground shadow-elevation'
 
 export function PanelList({
   children,
@@ -85,7 +85,7 @@ export function PanelEmpty({
   readonly description?: React.ReactNode
 }) {
   return (
-    <div className="rounded-xl border border-border bg-card shadow-elevation">
+    <div className="rounded-xl border border-dashed border-border bg-card/60">
       <Empty className="py-10">
         <EmptyTitle>{title}</EmptyTitle>
         {description !== undefined && <EmptyDescription>{description}</EmptyDescription>}

package/src/components/shell/panel-overview.tsx

@@ -12,13 +12,15 @@ export interface WaitingItem {
 
 function PanelWaiting({ item }: { item: WaitingItem }) {
   return (
-    <Card className="flex-1 border-moderation-pending/50">
-      <CardContent className="flex items-center justify-between gap-4 p-4">
+    <Card className="flex-1 rounded-xl border-l-4 border-l-thread-pinned">
+      <CardContent className="flex items-center justify-between gap-4 p-5">
         <div>
-          <p className="text-2xl font-semibold tabular-nums text-foreground">{item.count}</p>
+          <p className="text-3xl font-semibold tracking-tight tabular-nums text-foreground">
+            {item.count}
+          </p>
           <p className="text-sm text-muted-foreground">{item.count === 1 ? item.one : item.many}</p>
         </div>
-        <a href={item.href} className={buttonVariants({ variant: 'outline', size: 'sm' })}>
+        <a href={item.href} className={buttonVariants({ variant: 'primary', size: 'sm' })}>
           {item.action}
         </a>
       </CardContent>
@@ -39,12 +41,29 @@ export function PanelWaitingList({
 
   if (waiting.length === 0) {
     return (
-      <Card>
+      <div className="rounded-xl border border-dashed border-border bg-card/60">
         <Empty className="py-8">
+          <span
+            aria-hidden="true"
+            className="mb-1 flex size-9 items-center justify-center rounded-full bg-moderation-approved/10 text-moderation-approved"
+          >
+            <svg
+              aria-hidden="true"
+              viewBox="0 0 16 16"
+              className="size-4"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="1.75"
+              strokeLinecap="round"
+              strokeLinejoin="round"
+            >
+              <path d="m3.5 8.5 3 3 6-7" />
+            </svg>
+          </span>
           <EmptyTitle>{emptyTitle}</EmptyTitle>
           <EmptyDescription>{emptyDescription}</EmptyDescription>
         </Empty>
-      </Card>
+      </div>
     )
   }
 
@@ -62,15 +81,29 @@ export function PanelSectionGrid({ sections }: { sections: readonly PanelSection
     <ul className="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
       {sections.map((section) => (
         <li key={section.href}>
-          <Card className="relative h-full transition-colors hover:bg-muted/50">
-            <CardContent className="flex flex-col gap-0.5 p-4">
-              <a
-                href={section.href}
-                className="text-sm font-medium text-foreground underline-offset-2 hover:underline"
-              >
-                <span className="absolute inset-0" />
-                {section.title}
-              </a>
+          <Card className="group relative h-full rounded-xl transition-[border-color,box-shadow] hover:border-primary/40 hover:shadow-lg">
+            <CardContent className="flex h-full flex-col gap-1 p-4">
+              <span className="flex items-center justify-between gap-2">
+                <a
+                  href={section.href}
+                  className="text-sm font-semibold text-foreground underline-offset-2 group-hover:text-primary"
+                >
+                  <span className="absolute inset-0" />
+                  {section.title}
+                </a>
+                <svg
+                  aria-hidden="true"
+                  viewBox="0 0 16 16"
+                  className="size-4 shrink-0 text-muted-foreground/60 transition-[color,transform] group-hover:translate-x-0.5 group-hover:text-primary"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="1.5"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
+                  <path d="M3.5 8h9M8.5 4l4 4-4 4" />
+                </svg>
+              </span>
               <p className="text-xs text-muted-foreground">{section.blurb}</p>
             </CardContent>
           </Card>

package/src/server/upgrade-notice.ts

@@ -1,11 +1,12 @@
 import 'server-only'
 
-import { env, logger, ValidationError } from '@meith/core'
+import { ConfigurationError, env, logger, ValidationError } from '@meith/core'
 import {
   appliedPluginMigrations,
   applyPluginMigration,
   getDb,
   PostgresNavigationRepository,
+  pendingCoreMigrations,
   readVersion,
   recordVersion,
 } from '@meith/db'
@@ -16,12 +17,29 @@ import { planUpgrade, type UpgradeState, upgradeNotice } from '@meith/upgrade'
 
 import { activeDefinitions } from './plugin-host'
 
-export const CODE_VERSION = '0.33.1'
+export const CODE_VERSION = '0.33.3'
 
 export interface UpgradeApplied {
   readonly plugins: readonly string[]
 }
 
+let coreMigrationsUnreadable = false
+
+async function missingCoreMigrations(db: ReturnType<typeof getDb>): Promise<readonly string[]> {
+  if (coreMigrationsUnreadable) return []
+
+  try {
+    return await pendingCoreMigrations(db)
+  } catch (error) {
+    if (error instanceof ConfigurationError) coreMigrationsUnreadable = true
+    logger().warn(
+      { err: String(error) },
+      'could not read the pending core migrations, comparing versions only',
+    )
+    return []
+  }
+}
+
 export async function applyPendingUpgrade(): Promise<UpgradeApplied> {
   const db = getDb()
   const definitions = activeDefinitions()
@@ -31,10 +49,12 @@ export async function applyPendingUpgrade(): Promise<UpgradeApplied> {
     applied[plugin.key] = await appliedPluginMigrations(db, plugin.key)
   }
 
+  const pendingCore = await missingCoreMigrations(db)
+
   const state: UpgradeState = {
     recordedVersion: (await readVersion(db, 'core')) ?? CODE_VERSION,
     codeVersion: CODE_VERSION,
-    pendingCoreMigrations: [],
+    pendingCoreMigrations: pendingCore,
     plugins: definitions.map((plugin) => ({
       key: plugin.key,
       version: plugin.version,
@@ -52,6 +72,15 @@ export async function applyPendingUpgrade(): Promise<UpgradeApplied> {
       : new ValidationError(notice)
   }
 
+  if (pendingCore.length > 0) {
+    throw new ValidationError(
+      msg('error.app.core-migrations-pending', {
+        count: pendingCore.length,
+        migrations: pendingCore.join(', '),
+      }),
+    )
+  }
+
   const fresh = new Set<string>()
   for (const plugin of definitions) {
     if ((await readVersion(db, `plugin:${plugin.key}`)) === null) fresh.add(plugin.key)
@@ -101,7 +130,7 @@ export async function pendingUpgradeNotice(): Promise<string | null> {
     const state: UpgradeState = {
       recordedVersion: (await readVersion(db, 'core')) ?? CODE_VERSION,
       codeVersion: CODE_VERSION,
-      pendingCoreMigrations: [],
+      pendingCoreMigrations: await missingCoreMigrations(db),
       plugins: plugins.map((plugin) => ({
         key: plugin.key,
         version: plugin.version,

package/src/styles/globals.css

@@ -485,10 +485,12 @@
   /*
    * A permalink to `#post-12` otherwise lands the post flush against the top
    * of the viewport, with its own header cropped and the previous post's footer
-   * nowhere — the reader cannot tell they arrived at the right one.
+   * nowhere — the reader cannot tell they arrived at the right one. The
+   * default theme's header is sticky — 3.5rem on a phone, 6.25rem with its
+   * navigation row on a desktop — so the margin clears it with room to spare.
    */
   :target {
-    scroll-margin-block-start: 1.5rem;
+    scroll-margin-block-start: 7.5rem;
   }
 
   ::selection {
@@ -954,6 +956,34 @@ div.md-directive {
   margin-block-end: 0;
 }
 
+/*
+ * A themed arrow on every single-choice <select>.
+ *
+ * The browser's own arrow ignores the palette — it stays the platform grey in
+ * both schemes and sits hard against the field's edge. `appearance: none`
+ * removes it, and two small gradient squares draw a chevron in
+ * `--muted-foreground` instead, so it follows a runtime token override like
+ * everything else. Gradients rather than an SVG data URI because a URI cannot
+ * read a custom property, and this file never hardcodes a colour twice.
+ * Multi-selects and list boxes keep their native rendering: they have no arrow.
+ */
+select:not([multiple], [size]) {
+  appearance: none;
+  padding-inline-end: 2.25rem;
+  background-image:
+    linear-gradient(45deg, transparent 50%, var(--muted-foreground) 50%),
+    linear-gradient(135deg, var(--muted-foreground) 50%, transparent 50%);
+  background-position:
+    calc(100% - 1.05rem) 50%,
+    calc(100% - 0.75rem) 50%;
+  background-size: 0.3rem 0.3rem;
+  background-repeat: no-repeat;
+}
+
+select:not([multiple], [size]):disabled {
+  opacity: 0.6;
+}
+
 @media (pointer: coarse) {
   input:not(
     [type="checkbox"],