diff --git a/.changeset/28483-phone-record-page-one-bar.md b/.changeset/28483-phone-record-page-one-bar.md
new file mode 100644
index 00000000000..e1418b03bd8
--- /dev/null
+++ b/.changeset/28483-phone-record-page-one-bar.md
@@ -0,0 +1,17 @@
+---
+'@object-ui/app-shell': patch
+'@object-ui/layout': patch
+---
+
+feat(app-shell): a phone record page draws one bar, its own top bar, and the record's name once
+
+Clause-②: yes (widening)
+Metadata-protocol: none
+
+Below 768 px a console record page drew two bars at its top: the app bar (sidebar trigger, app, the record's name, search, notifications, account) and, under it, the record page's own top bar (「‹ <object plural>」 and the counter with ↓ ↑). The record's name showed twice, once in the app bar and once as the header title right below it.
+
+- **One bar on a phone record page.** Below 768 px the console mounts no app bar on a record route (`/apps/APP/OBJECT/record/ID`, and the same record on a named record page, `.../page/PAGE`). The record page's top bar is the page's one bar, and the record's name shows once, as the header title.
+- **The four doors stay on the root routes.** The app menu, search, notifications and the account menu stay in the app bar on every other route: the object's list, home, dashboards, the record's edit form. A phone record page reaches them through its 「‹」 link, one tap. No menu is added to the record bar, and there is no bottom navigation bar.
+- **A record page that cannot show its record keeps its 「‹」 bar on a phone.** While it loads, and when the record is not found, the read is refused or fails, the object is unknown, the named page is not one of the object's record pages, or the viewer's approval access has ended, the page draws the same back bar above that state, so a deep link always has a way off the page.
+- **768 px and up is unchanged.** Every route keeps the app bar, and a record page that cannot show its record draws no extra bar.
+- **`AppShell` gains `showHeader`** (`@object-ui/layout`, optional, default `true`). `showHeader={false}` draws no `<header>` element and does not mount `navbar`. Leaving it out renders exactly as before, including a shell with no `navbar`, which still draws its empty bar.
diff --git a/content/docs/frontend/app-shell.mdx b/content/docs/frontend/app-shell.mdx
index b00fc254d74..4b14b98f1c4 100644
--- a/content/docs/frontend/app-shell.mdx
+++ b/content/docs/frontend/app-shell.mdx
@@ -44,6 +44,8 @@ interface AppShellProps {
   branding?: AppShellBranding;   // App branding — four theme fields, see Branding
   rightRail?: React.ReactNode;   // Optional right rail beside the content, not
                                  // over it (ADR-0057 P3a)
+  showHeader?: boolean;          // Draw the top bar (default: true); false draws
+                                 // no header and does not mount navbar
 }
 ```
 
@@ -70,6 +72,12 @@ of its own to it, in particular **no sidebar toggle**. If you want one, render i
 - Border bottom separator
 - Background matching app theme
 
+Pass `showHeader={false}` to draw no header at all, for a page that draws its own top bar:
+the shell then renders no `<header>` element and does not mount `navbar`. It defaults to
+`true`, and leaving `navbar` out alone still draws the (empty) bar. The Console uses it on
+a phone (below 768 px): a record page's own top bar, with its back link to the object's
+list, is the page's only bar there, and every other route keeps the app bar.
+
 ### Content Area
 
 The main content area features:
diff --git a/content/docs/frontend/layout.mdx b/content/docs/frontend/layout.mdx
index b7befdd6e10..9bef309a173 100644
--- a/content/docs/frontend/layout.mdx
+++ b/content/docs/frontend/layout.mdx
@@ -29,7 +29,7 @@ Layout components are automatically registered when you import ObjectUI.
 The `AppShell` provides a complete application structure with a top navbar, a sidebar, and
 a main content area.
 
-**`AppShell` is a React component, not an authorable JSON node.** Four of its seven props
+**`AppShell` is a React component, not an authorable JSON node.** Four of its eight props
 are `React.ReactNode` slots — `sidebar`, `navbar`, `children` and `rightRail` — and a JSON
 document has no way to put a node into any of them. Compose the shell in React, and render
 your JSON pages *inside* it. `app-shell` is not a component key either — what a
@@ -64,7 +64,7 @@ the component's `children`; there is no `body` prop either.
 
 ### Props
 
-`AppShellProps` (`packages/layout/src/AppShell.tsx`) declares exactly these seven. The
+`AppShellProps` (`packages/layout/src/AppShell.tsx`) declares exactly these eight. The
 component destructures that fixed key list with **no rest element**, so anything else you
 pass is built and then dropped on the floor.
 
@@ -80,6 +80,7 @@ These are React props, passed in JSX. None of them is authorable in JSON — the
 | `defaultOpen` | `boolean` | no | Initial open state of the underlying Shadcn `SidebarProvider`. Defaults to `true`. |
 | `branding` | `AppShellBranding` | no | App branding, applied by `useAppShellBranding`: `primaryColor` / `accentColor` become CSS custom properties on the document root, `favicon` sets the icon link's `href`, and `title` sets `document.title`. |
 | `rightRail` | `React.ReactNode` | no | Optional right-side rail. It reflows the content beside it rather than overlaying it; absent → unchanged single-pane layout. |
+| `showHeader` | `boolean` | no | Whether the shell draws its top bar. Defaults to `true`; `false` draws no `<header>` element and does not mount `navbar`, for a page that draws its own top bar. Leaving `navbar` out alone still draws the bar. |
 
 ### There is no `app-shell` node
 
@@ -93,7 +94,7 @@ does not register it, and nothing else in this repo does either, so a
   `unknown-component` and the message `<app-shell> is not a known component`.
 
 It **was** registered until objectui#4841, and the registration could never produce a
-shell. Four of the seven props are `React.ReactNode` slots that a JSON document cannot
+shell. Four of the eight props are `React.ReactNode` slots that a JSON document cannot
 fill, so a node had exactly two outcomes: `children` was stripped by `SchemaRenderer`
 before a node's keys were spread as props — `AppShell` reads its `children` prop, never
 `schema.children` — so the `<main>` element rendered **empty with nothing logged**; and a
diff --git a/ui/packages/app-shell/src/layout/ConsoleLayout.tsx b/ui/packages/app-shell/src/layout/ConsoleLayout.tsx
index 6f3a2ba8964..af15253f4d7 100644
--- a/ui/packages/app-shell/src/layout/ConsoleLayout.tsx
+++ b/ui/packages/app-shell/src/layout/ConsoleLayout.tsx
@@ -30,6 +30,7 @@ import { ConsoleNotificationBanners } from './ConsoleNotificationBanners.js';
 import { UnifiedSidebar } from './UnifiedSidebar.js';
 import { AppHeader } from './AppHeader.js';
 import { useResponsiveSidebar } from '../hooks/useResponsiveSidebar.js';
+import { usePhoneViewport } from '../hooks/usePhoneViewport.js';
 import { primeConsoleSidebarOpen } from './consoleSidebarRail.js';
 import { useAiSurfaceEnabled } from '../hooks/useAiSurface.js';
 import { useNavigationContext } from '../context/NavigationContext.js';
@@ -118,6 +119,15 @@ function SkipToContentLink({ targetRef }: { targetRef: React.RefObject<HTMLDivEl
   );
 }
 
+/**
+ * Is `pathname` a record page, the console route `RecordDetailView` draws:
+ * `/apps/APP/OBJECT/record/ID`, or the same record on a named record page
+ * (`.../page/PAGE`)? The record's edit form (`.../edit`) is not one.
+ */
+export function isRecordPagePath(pathname: string): boolean {
+  return /^\/apps\/[^/]+\/[^/]+\/record\/[^/]+(?:\/page\/[^/]+)?\/?$/.test(pathname);
+}
+
 /** Inner component that can access SidebarProvider context */
 function ConsoleLayoutInner({ children }: { children: React.ReactNode }) {
   useResponsiveSidebar();
@@ -167,6 +177,14 @@ export function ConsoleLayout({
   // rail's `hidden md:` classes alone) decides which one MOUNTS, so the phone
   // never pays for an invisible rail's chat graph.
   const isMobile = useIsMobile();
+  // objectstack#28483 (ruling letter A) — on a phone a record page has one
+  // bar, its own top bar (「‹ <object plural>」 and the stepper), so the app
+  // bar is not mounted there. The app menu, search, notifications and account
+  // stay on every other route, one 「‹」 away. From 768 px up every route keeps
+  // the app bar. The width is read synchronously, at the breakpoint the record
+  // page draws its phone face at, so the two never disagree for a frame.
+  const phone = usePhoneViewport();
+  const recordPageOwnsTopBar = phone && isRecordPagePath(location.pathname);
   // "/ai = the dock maximized": record where we maximized FROM at click time,
   // so the page's collapse-to-dock returns exactly here (history-back could
   // land on a prior /ai URL after in-page conversation switches).
@@ -221,6 +239,7 @@ export function ConsoleLayout({
            railOverlay
          />
       }
+      showHeader={!recordPageOwnsTopBar}
       navbar={
           <AppHeader
             variant="app"
diff --git a/ui/packages/app-shell/src/layout/__tests__/ConsoleLayout.phoneRecordOneBar-28483.test.tsx b/ui/packages/app-shell/src/layout/__tests__/ConsoleLayout.phoneRecordOneBar-28483.test.tsx
new file mode 100644
index 00000000000..b760b21c2f0
--- /dev/null
+++ b/ui/packages/app-shell/src/layout/__tests__/ConsoleLayout.phoneRecordOneBar-28483.test.tsx
@@ -0,0 +1,154 @@
+// Copyright (c) 2026 ObjectStack. Licensed under the Apache-2.0 license.
+
+/**
+ * objectstack#28483 (ruling letter A) — below 768 px a record route draws no
+ * app bar: the record page's own top bar (「‹ <object plural>」, the stepper)
+ * is the page's one bar, and the record's name shows once, as the header
+ * title under it. The four doors (app menu, search, notifications, account)
+ * stay on every other route, the object's list among them, one 「‹」 away.
+ * From 768 px up every route keeps the app bar.
+ *
+ * Harness: the real `ConsoleLayout` with its real `@object-ui/layout`
+ * `AppShell` (`ConsoleLayout.oneMainLandmark-13334`'s). `AppHeader` is a stub
+ * that draws what its phone label draws on a record route, the record's name
+ * (`AppHeader`'s own label is `AppHeader.phoneNoViewDropdown-27058`'s pin); the
+ * route's page is a stub of the record page's phone face: its top bar and its
+ * header title. The record page's own phone bar is `RecordDetailView.phoneFace-27058`'s.
+ */
+
+import '@testing-library/jest-dom/vitest';
+import { describe, it, expect, vi, afterEach } from 'vitest';
+import React from 'react';
+import { render, screen, cleanup } from '@testing-library/react';
+import { MemoryRouter } from 'react-router-dom';
+import { createI18n, I18nProvider } from '@object-ui/i18n';
+
+vi.mock('../../hooks/useAiSurface', () => ({
+  useAiSurfaceEnabled: () => ({ enabled: false, isLoading: false }),
+}));
+vi.mock('../UnifiedSidebar', () => ({ UnifiedSidebar: () => <nav aria-label="App menu" /> }));
+vi.mock('../AppHeader', () => ({
+  AppHeader: () => (
+    <div data-testid="app-bar">
+      <button type="button">Search</button>
+      <span>Mira Costa</span>
+    </div>
+  ),
+}));
+vi.mock('../ConsoleNotificationBanners', () => ({ ConsoleNotificationBanners: () => null }));
+vi.mock('../../preview/DraftPreviewBar', () => ({ DraftPreviewBar: () => null }));
+vi.mock('../../preview/UnpublishedAppBar', () => ({ UnpublishedAppBar: () => null }));
+
+import { ConsoleLayout, isRecordPagePath } from '../ConsoleLayout';
+import { NavigationProvider } from '../../context/NavigationContext';
+
+const APP = { name: 'crm', label: 'CRM', active: true, navigation: [] };
+const RECORD = '/apps/crm/crm_lead/record/r-1';
+
+function setWidth(width: number) {
+  Object.defineProperty(window, 'innerWidth', { value: width, configurable: true, writable: true });
+}
+
+/** The record page's phone face, as far as this layout sees it: its bar and its title. */
+function RecordPageStub() {
+  return (
+    <div data-record-page-root="">
+      <div data-record-top-bar="">
+        <a href="/apps/crm/crm_lead" data-record-crumb-back="">Leads</a>
+      </div>
+      <h1>Mira Costa</h1>
+    </div>
+  );
+}
+
+function mountAt(path: string, width: number) {
+  setWidth(width);
+  return render(
+    <I18nProvider instance={createI18n({ defaultLanguage: 'en', detectBrowserLanguage: false })} persistLanguage={false}>
+      <MemoryRouter initialEntries={[path]}>
+        <NavigationProvider>
+          <ConsoleLayout activeAppName="crm" activeApp={APP} onAppChange={vi.fn()} objects={[]}>
+            <RecordPageStub />
+          </ConsoleLayout>
+        </NavigationProvider>
+      </MemoryRouter>
+    </I18nProvider>,
+  );
+}
+
+/** Every bar across the page's top: the shell's `<header>` and the record page's top bar. */
+const bars = () => [...document.querySelectorAll('header, [data-record-top-bar]')];
+
+afterEach(() => {
+  cleanup();
+  setWidth(1440);
+});
+
+describe('a phone record page draws one bar (objectstack#28483)', () => {
+  it('at 390 px a record route has one bar, the record\'s own, and the record name once', () => {
+    mountAt(RECORD, 390);
+    expect(document.querySelectorAll('header')).toHaveLength(0);
+    expect(screen.queryByTestId('app-bar')).toBeNull();
+    expect(bars()).toHaveLength(1);
+    expect(bars()[0]).toHaveAttribute('data-record-top-bar');
+    expect(screen.getAllByText('Mira Costa')).toHaveLength(1);
+    // The way to the four doors: the bar's 「‹」, to the object's list.
+    expect(screen.getByRole('link', { name: 'Leads' })).toHaveAttribute('href', '/apps/crm/crm_lead');
+  });
+
+  it('at 390 px the same record on a named record page draws no app bar either', () => {
+    mountAt(`${RECORD}/page/print_sheet`, 390);
+    expect(document.querySelectorAll('header')).toHaveLength(0);
+    expect(bars()).toHaveLength(1);
+  });
+
+  it('at 390 px the root routes keep the app bar, the four doors with it', () => {
+    for (const path of ['/apps/crm', '/apps/crm/crm_lead', '/apps/crm/crm_lead/view/all', '/apps/crm/dashboard/sales']) {
+      mountAt(path, 390);
+      expect(document.querySelectorAll('header'), path).toHaveLength(1);
+      expect(screen.getByTestId('app-bar'), path).toBeInTheDocument();
+      cleanup();
+    }
+  });
+
+  it('at 390 px the record\'s edit form is not the record page: it keeps the app bar', () => {
+    mountAt(`${RECORD}/edit`, 390);
+    expect(document.querySelectorAll('header')).toHaveLength(1);
+    expect(screen.getByTestId('app-bar')).toBeInTheDocument();
+  });
+
+  it('control: at 768 px and 1440 px a record route keeps the app bar, as before', () => {
+    for (const width of [768, 1440]) {
+      mountAt(RECORD, width);
+      const headers = document.querySelectorAll('header');
+      expect(headers, `${width} px`).toHaveLength(1);
+      expect(headers[0]).toContainElement(screen.getByTestId('app-bar'));
+      cleanup();
+    }
+  });
+
+  it('at 767 px, one pixel under the breakpoint, the record route is already on its phone face', () => {
+    mountAt(RECORD, 767);
+    expect(document.querySelectorAll('header')).toHaveLength(0);
+  });
+});
+
+describe('isRecordPagePath (objectstack#28483)', () => {
+  it('names the two routes the record page draws, and nothing else', () => {
+    expect(isRecordPagePath(RECORD)).toBe(true);
+    expect(isRecordPagePath(`${RECORD}/`)).toBe(true);
+    expect(isRecordPagePath(`${RECORD}/page/print_sheet`)).toBe(true);
+    for (const path of [
+      '/apps/crm',
+      '/apps/crm/crm_lead',
+      '/apps/crm/crm_lead/view/all',
+      `${RECORD}/edit`,
+      '/apps/crm/crm_lead/new',
+      '/apps/crm/crm_lead/record',
+      '/apps/crm/page/home',
+      '/organizations/acme',
+    ]) {
+      expect(isRecordPagePath(path), path).toBe(false);
+    }
+  });
+});
diff --git a/ui/packages/app-shell/src/views/RecordDetailView.phoneGuardBar-28483.test.tsx b/ui/packages/app-shell/src/views/RecordDetailView.phoneGuardBar-28483.test.tsx
new file mode 100644
index 00000000000..e883898e78e
--- /dev/null
+++ b/ui/packages/app-shell/src/views/RecordDetailView.phoneGuardBar-28483.test.tsx
@@ -0,0 +1,161 @@
+/**
+ * ObjectUI
+ * Copyright (c) 2024-present ObjectStack Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * objectstack#28483 (ruling letter A) — below 768 px the console mounts no app
+ * bar on a record route, so the record page's 「‹」 bar is the only way off
+ * it. A page that cannot show its record (a refused read, a 404, a failed
+ * read) still draws that bar above its state on a phone: a deep link to such
+ * a record is never a page without a way out.
+ *
+ * Harness: `RecordDetailView.recordReadFailure-11902`'s real
+ * `ObjectStackAdapter` over a stubbed transport, mounted on the console's
+ * record route at 390 px. Control: at 1440 px the same states draw no bar,
+ * as before (the app bar is there).
+ */
+import '@testing-library/jest-dom/vitest';
+import * as React from 'react';
+import { describe, it, expect, vi, afterEach } from 'vitest';
+import { render, screen, cleanup } from '@testing-library/react';
+import { MemoryRouter, Route, Routes } from 'react-router-dom';
+
+vi.mock('@object-ui/auth', async (importOriginal) => ({
+  ...(await importOriginal<Record<string, unknown>>()),
+  useAuth: () => ({ user: { id: 'u1', name: 'Ada', image: null }, activeOrganization: null }),
+}));
+vi.mock('@object-ui/collaboration', async (importOriginal) => ({
+  ...(await importOriginal<Record<string, unknown>>()),
+  useRecordPresence: () => [],
+  PresenceAvatars: () => null,
+}));
+vi.mock('sonner', () => ({
+  toast: Object.assign(vi.fn(), {
+    success: vi.fn(), error: vi.fn(), info: vi.fn(),
+    warning: vi.fn(), loading: vi.fn(), dismiss: vi.fn(),
+  }),
+}));
+
+import { MetadataCtx } from '@object-ui/react';
+import { I18nProvider } from '@object-ui/i18n';
+import { ObjectStackAdapter } from '@object-ui/data-objectstack';
+import { RecordDetailView } from './RecordDetailView';
+
+const BASE = 'http://test.local';
+const APP = 'demo';
+const OBJECT = 'probe_invoice';
+const REC = 'inv-28483';
+
+const objectDef = {
+  name: OBJECT,
+  label: 'Invoice',
+  pluralLabel: 'Invoices',
+  fields: {
+    id: { label: 'Id', type: 'text' },
+    name: { label: 'Name', type: 'text' },
+  },
+};
+
+type Answer = 'forbidden' | 'notFound' | 'serverError';
+let answer: Answer = 'forbidden';
+
+function json(status: number, body: unknown): Response {
+  return new Response(JSON.stringify(body), { status, headers: { 'content-type': 'application/json' } });
+}
+
+/** One transport for the adapter and the page's side reads, never torn down (objectui#6640). */
+const transport = vi.fn(async (input: RequestInfo | URL): Promise<Response> => {
+  const url = typeof input === 'string' ? input : input instanceof URL ? input.href : input.url;
+  const path = url.replace(BASE, '');
+  if (path.endsWith('/api/v1/discovery')) {
+    return json(200, { success: true, data: { capabilities: {}, routes: {} } });
+  }
+  if (path.startsWith(`/api/v1/data/${OBJECT}`)) {
+    switch (answer) {
+      case 'forbidden':
+        return json(403, { error: `Permission denied: read on ${OBJECT}`, code: 'PERMISSION_DENIED', object: OBJECT });
+      case 'notFound':
+        return json(404, { error: 'Record not found', code: 'RECORD_NOT_FOUND' });
+      case 'serverError':
+        return json(500, { error: 'Internal server error', code: 'INTERNAL_ERROR' });
+    }
+  }
+  if (path.endsWith('/security/explain')) return json(200, { allowed: true });
+  return json(200, { success: true, data: [] });
+});
+vi.stubGlobal('fetch', transport);
+
+function setWidth(width: number) {
+  Object.defineProperty(window, 'innerWidth', { value: width, configurable: true, writable: true });
+}
+
+async function openRecordPage(width: number) {
+  setWidth(width);
+  const ds = new ObjectStackAdapter({ baseUrl: BASE, fetch: transport, autoReconnect: false });
+  await ds.connect();
+  (ds as unknown as { getObjectSchema: () => Promise<unknown> }).getObjectSchema = async () => objectDef;
+  const metadata = {
+    objects: [objectDef], pages: [], loading: false, error: null,
+    refresh: async () => {}, invalidate: () => {},
+    ensureType: async () => [], getItem: async () => null, getItemsByType: () => [],
+  } as never;
+  render(
+    <I18nProvider config={{ defaultLanguage: 'en', detectBrowserLanguage: false }} persistLanguage={false}>
+      <MemoryRouter initialEntries={[`/apps/${APP}/${OBJECT}/record/${REC}`]}>
+        <MetadataCtx.Provider value={metadata}>
+          <Routes>
+            <Route
+              path="/apps/:appName/:objectName/record/:recordId"
+              element={<RecordDetailView dataSource={ds as never} objects={[objectDef] as never} onEdit={() => {}} />}
+            />
+          </Routes>
+        </MetadataCtx.Provider>
+      </MemoryRouter>
+    </I18nProvider>,
+  );
+}
+
+/** The state the page settled on, and the bar above it on a phone. */
+const STATES: ReadonlyArray<{ answer: Answer; state: () => Promise<HTMLElement> }> = [
+  { answer: 'forbidden', state: () => screen.findByTestId('record-access-denied', undefined, { timeout: 5000 }) },
+  { answer: 'notFound', state: () => screen.findByText('Record not found', undefined, { timeout: 5000 }) },
+  { answer: 'serverError', state: () => screen.findByTestId('record-load-failed', undefined, { timeout: 5000 }) },
+];
+
+afterEach(() => {
+  cleanup();
+  setWidth(1440);
+  answer = 'forbidden';
+});
+
+describe('a phone record page that cannot show its record keeps its 「‹」 bar (objectstack#28483)', () => {
+  for (const { answer: a, state } of STATES) {
+    it(`${a}: at 390 px the state sits under one bar, 「‹ Invoices」 back to the object's list`, async () => {
+      answer = a;
+      await openRecordPage(390);
+      const shown = await state();
+      const frame = screen.getByTestId('record-page-phone-guard');
+      expect(frame).toContainElement(shown);
+      const bars = frame.querySelectorAll('[data-record-top-bar]');
+      expect(bars).toHaveLength(1);
+      const back = bars[0].querySelector('[data-record-crumb-back]') as HTMLAnchorElement;
+      expect(back.tagName).toBe('A');
+      expect(back.textContent).toBe('Invoices');
+      expect(back.getAttribute('href')).toBe(`/apps/${APP}/${OBJECT}`);
+      // The bar sits above the state, not inside it.
+      expect(bars[0].compareDocumentPosition(shown) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+    });
+  }
+
+  it('control: at 1440 px a refused read draws its state alone, no bar (the app bar is there)', async () => {
+    answer = 'forbidden';
+    await openRecordPage(1440);
+    await STATES[0].state();
+    expect(screen.queryByTestId('record-page-phone-guard')).toBeNull();
+    expect(document.querySelector('[data-record-top-bar]')).toBeNull();
+  });
+});
diff --git a/ui/packages/app-shell/src/views/RecordDetailView.tsx b/ui/packages/app-shell/src/views/RecordDetailView.tsx
index dda218b4edf..dfb8e3e56b1 100644
--- a/ui/packages/app-shell/src/views/RecordDetailView.tsx
+++ b/ui/packages/app-shell/src/views/RecordDetailView.tsx
@@ -8,7 +8,7 @@
  * (`buildDefaultPageSchema`).
  */
 
-import { useState, useEffect, useLayoutEffect, useCallback, useContext, useMemo, useRef } from 'react';
+import { useState, useEffect, useLayoutEffect, useCallback, useContext, useMemo, useRef, type ReactElement } from 'react';
 import { useParams, useNavigate, useLocation, useSearchParams, Link } from 'react-router-dom';
 import { activityRowToFeedItem, auditEntriesToFeedItems, bodyTableIdsOf, claimQueuedRecord, RecordFieldChangesContext, DefaultRecordPageContext, EMPTY_RELATED_ARRANGEMENT, InlineEditSaveBar, RecordBodyTablesContext, RecordMetaFooter, RecordPageColumns, buildDefaultPageColumns, buildDefaultPageSchema, extractMentions, isRefusedFeedRead, recordPageTierHasRightColumn, recordSitsInQueue, resolveTitleField, useQueueClaimOffered, useRecordEditable, useRecordPageTier } from '@object-ui/plugin-detail';
 import { Empty, EmptyTitle, EmptyDescription, Button, PageHeaderActions, PageHeaderPhoneContext, PageHeaderTrailingContext, PanelToggles, RecordTopBar, cn, useRecordStepKeys, type PanelToggleItem, type RecordTopBarStepper } from '@object-ui/components';
@@ -3887,12 +3887,91 @@ export function RecordDetailView({ dataSource, objects, onEdit, objectNameOverri
   const [pageScrollerEl, setPageScrollerEl] = useState<HTMLDivElement | null>(null);
   useRecordPageScrollMemory(phonePage ? pageScrollerEl : null, pageRecordStatus === 'loaded');
 
+  // The trail and the way back the page's top bar is built from (objectstack#27524,
+  // Target 7; objectstack#27058, Target 3). They are read before the guard
+  // states below because on a phone those states draw the same 「‹」 bar.
+  const pageTrail = embedded ? [] : decodeRecordTrail(new URLSearchParams(location.search).get(RECORD_TRAIL_PARAM));
+  const objectListPath = appName && objectName ? `/apps/${appName}/${objectName}` : undefined;
+  const originPathOnly = originFromState?.pathname?.split('?')[0];
+  // An origin that is a list of this object's records (a view of it) is named
+  // by the object; any other origin (an inbox, a dashboard) by its own label.
+  const originIsObjectList = !!objectListPath && !!originPathOnly
+    && (originPathOnly === objectListPath || originPathOnly.startsWith(`${objectListPath}/`));
+  const withoutPaneParam = (href: string) => {
+    const [path, query = ''] = href.split('?');
+    const sp = new URLSearchParams(query);
+    sp.delete(RECORD_DRAWER_PARAM);
+    const qs = sp.toString();
+    return qs ? `${path}?${qs}` : path;
+  };
+  const crumbClass =
+    'min-w-0 truncate rounded px-1 hover:bg-accent hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring';
+  const shortRecordId = (id: string) => `#${id.length > 12 ? `${id.slice(0, 8)}…` : id}`;
+
+  // objectstack#27058, Target 3 — the top bar on a phone: one link that
+  // returns where the page came from. A top-level page reads
+  // 「‹ <object plural>」, the breadcrumb's object half (the record's name is
+  // the header title directly below), and returns to the list it was opened
+  // from, or to the object's list. A page one level down (Target 8) is named
+  // by where it returns, its parent record (「‹ Acme Corp」): pushed from a
+  // related row or a lookup it goes back in the history, so the parent comes
+  // back where it was scrolled; reached by a `?from=` link it follows the
+  // trail's way back.
+  // Right, the counter and ↓ ↑ when the page knows its siblings. No ⊟ (the
+  // stack has no right column), no ⤡ (there is no drawer to collapse to).
+  const phonePushed = phonePage && isRecordPagePushed(location.state);
+  const phoneBackClass =
+    'inline-flex min-w-0 items-center gap-0.5 rounded-md py-1 pr-2 text-sm font-medium text-foreground transition-colors hover:bg-accent focus:outline-none focus-visible:ring-2 focus-visible:ring-ring';
+  const phoneBack = phonePage ? (() => {
+    const plural = objectDef ? objectPluralLabel(objectDef) : objectName;
+    const parent = pageTrail.length > 0 ? pageTrail[pageTrail.length - 1] : undefined;
+    const label = parent
+      ? parent.t || shortRecordId(parent.i)
+      : phonePushed || (originFromState?.pathname && !originIsObjectList)
+        ? originFromState?.label ?? plural
+        : plural;
+    const face = (
+      <>
+        <ChevronLeft className="h-5 w-5 shrink-0" aria-hidden="true" />
+        <span className="truncate">{label}</span>
+      </>
+    );
+    const goBack = t('detail.goBack', { defaultValue: 'Go back' });
+    if (phonePushed) {
+      return (
+        <button type="button" onClick={() => navigate(-1)} className={phoneBackClass} title={goBack} data-record-crumb-back="">
+          {face}
+        </button>
+      );
+    }
+    const to = pageTrail.length > 0
+      ? originFrom?.pathname
+      : originFromState?.pathname
+        ? (originIsObjectList ? withoutPaneParam(originFromState.pathname) : originFromState.pathname)
+        : objectListPath;
+    return to ? (
+      <Link to={to} className={phoneBackClass} title={goBack} data-record-crumb-back="">{face}</Link>
+    ) : (
+      <span className={phoneBackClass}>{face}</span>
+    );
+  })() : null;
+  // objectstack#28483 — on a phone the console mounts no app bar on a record
+  // route, so the record page's 「‹」 bar is the only way off it. Every state
+  // the page returns early with (loading, not found, refused, missing, access
+  // ended, forbidden, failed) draws that bar above itself on a phone.
+  const withPhoneBar = (state: ReactElement): ReactElement => phonePage ? (
+    <div className="flex h-full flex-col bg-background" data-testid="record-page-phone-guard">
+      <RecordTopBar leadingTestId="record-page-leading" leading={phoneBack} />
+      <div className="min-h-0 flex-1 overflow-auto">{state}</div>
+    </div>
+  ) : state;
+
   if (isLoading) {
-    return <SkeletonDetail />;
+    return withPhoneBar(<SkeletonDetail />);
   }
 
   if (!objectDef) {
-    return (
+    return withPhoneBar(
       <div className="flex h-full items-center justify-center p-4">
         <Empty>
           <div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted">
@@ -3912,10 +3991,10 @@ export function RecordDetailView({ dataSource, objects, onEdit, objectNameOverri
   // page of this object shows the console's page-not-found state. Neither
   // stamps the print root, so a print driver never reads either as ready.
   if (namedPageState === 'pending') {
-    return <SkeletonDetail />;
+    return withPhoneBar(<SkeletonDetail />);
   }
   if (namedPageState === 'refused') {
-    return (
+    return withPhoneBar(
       <div className="flex h-full items-center justify-center p-4">
         <Empty data-testid="record-page-not-found">
           <div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted">
@@ -3935,7 +4014,7 @@ export function RecordDetailView({ dataSource, objects, onEdit, objectNameOverri
   // record didn't exist, which made invalid links look like a partially-
   // broken page instead of a clean 404.
   if (pageRecordStatus === 'missing') {
-    return (
+    return withPhoneBar(
       <div className="flex h-full items-center justify-center p-4">
         <Empty>
           <div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted">
@@ -3959,7 +4038,7 @@ export function RecordDetailView({ dataSource, objects, onEdit, objectNameOverri
   // that the record does not exist. The read is not kept any longer; the
   // inbox link is the way on.
   if (pageRecordStatus === 'accessEnded') {
-    return (
+    return withPhoneBar(
       <div className="flex h-full items-center justify-center p-4">
         <Empty data-testid="record-access-ended">
           <div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted">
@@ -3992,7 +4071,7 @@ export function RecordDetailView({ dataSource, objects, onEdit, objectNameOverri
   // No Retry: retrying a permission decision cannot change it — the same
   // reasoning as the app-level `appAccessDenied` screen in `AppContent`.
   if (pageRecordStatus === 'forbidden') {
-    return (
+    return withPhoneBar(
       <div className="flex h-full items-center justify-center p-4">
         <Empty data-testid="record-access-denied">
           <div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted">
@@ -4018,7 +4097,7 @@ export function RecordDetailView({ dataSource, objects, onEdit, objectNameOverri
   // objectui#11902 — the read FAILED (a 5xx, a transport error, …): say so,
   // and offer Retry, which re-runs the page's own record load.
   if (pageRecordStatus === 'failed') {
-    return (
+    return withPhoneBar(
       <div className="flex h-full items-center justify-center p-4">
         <Empty data-testid="record-load-failed">
           <div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted">
@@ -4394,23 +4473,6 @@ export function RecordDetailView({ dataSource, objects, onEdit, objectNameOverri
   // ancestor returns to its page), else 「对象 › 记录名」, the object returning
   // to the list the page was opened from (or the object's list). Right, each
   // only where it applies: the counter and ↓ ↑ (a list context), ⊟, ⤡.
-  const pageTrail = embedded ? [] : decodeRecordTrail(new URLSearchParams(location.search).get(RECORD_TRAIL_PARAM));
-  const objectListPath = appName && objectName ? `/apps/${appName}/${objectName}` : undefined;
-  const originPathOnly = originFromState?.pathname?.split('?')[0];
-  // An origin that is a list of this object's records (a view of it) is named
-  // by the object; any other origin (an inbox, a dashboard) by its own label.
-  const originIsObjectList = !!objectListPath && !!originPathOnly
-    && (originPathOnly === objectListPath || originPathOnly.startsWith(`${objectListPath}/`));
-  const withoutPaneParam = (href: string) => {
-    const [path, query = ''] = href.split('?');
-    const sp = new URLSearchParams(query);
-    sp.delete(RECORD_DRAWER_PARAM);
-    const qs = sp.toString();
-    return qs ? `${path}?${qs}` : path;
-  };
-  const crumbClass =
-    'min-w-0 truncate rounded px-1 hover:bg-accent hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring';
-  const shortRecordId = (id: string) => `#${id.length > 12 ? `${id.slice(0, 8)}…` : id}`;
   const objectDefOf = (name: string) => objects.find((o: any) => o?.name === name);
   const pageLeading = embedded ? null : pageTrail.length > 0 ? (
     <>
@@ -4488,53 +4550,6 @@ export function RecordDetailView({ dataSource, objects, onEdit, objectNameOverri
       </span>
     </nav>
   );
-  // objectstack#27058, Target 3 — the top bar on a phone: one link that
-  // returns where the page came from. A top-level page reads
-  // 「‹ <object plural>」, the breadcrumb's object half (the record's name is
-  // the header title directly below), and returns to the list it was opened
-  // from, or to the object's list. A page one level down (Target 8) is named
-  // by where it returns, its parent record (「‹ Acme Corp」): pushed from a
-  // related row or a lookup it goes back in the history, so the parent comes
-  // back where it was scrolled; reached by a `?from=` link it follows the
-  // trail's way back.
-  // Right, the counter and ↓ ↑ when the page knows its siblings. No ⊟ (the
-  // stack has no right column), no ⤡ (there is no drawer to collapse to).
-  const phonePushed = phonePage && isRecordPagePushed(location.state);
-  const phoneBackClass =
-    'inline-flex min-w-0 items-center gap-0.5 rounded-md py-1 pr-2 text-sm font-medium text-foreground transition-colors hover:bg-accent focus:outline-none focus-visible:ring-2 focus-visible:ring-ring';
-  const phoneBack = phonePage ? (() => {
-    const plural = objectDef ? objectPluralLabel(objectDef) : objectName;
-    const parent = pageTrail.length > 0 ? pageTrail[pageTrail.length - 1] : undefined;
-    const label = parent
-      ? parent.t || shortRecordId(parent.i)
-      : phonePushed || (originFromState?.pathname && !originIsObjectList)
-        ? originFromState?.label ?? plural
-        : plural;
-    const face = (
-      <>
-        <ChevronLeft className="h-5 w-5 shrink-0" aria-hidden="true" />
-        <span className="truncate">{label}</span>
-      </>
-    );
-    const goBack = t('detail.goBack', { defaultValue: 'Go back' });
-    if (phonePushed) {
-      return (
-        <button type="button" onClick={() => navigate(-1)} className={phoneBackClass} title={goBack} data-record-crumb-back="">
-          {face}
-        </button>
-      );
-    }
-    const to = pageTrail.length > 0
-      ? originFrom?.pathname
-      : originFromState?.pathname
-        ? (originIsObjectList ? withoutPaneParam(originFromState.pathname) : originFromState.pathname)
-        : objectListPath;
-    return to ? (
-      <Link to={to} className={phoneBackClass} title={goBack} data-record-crumb-back="">{face}</Link>
-    ) : (
-      <span className={phoneBackClass}>{face}</span>
-    );
-  })() : null;
   // objectstack#27058, Target 8 — the path row of a page one level down
   // (「线索 Mira Costa › 任务」): the `?from=` trail, each ancestor a link, the
   // parent going back in the history when the page was pushed from it.
diff --git a/ui/packages/layout/README.md b/ui/packages/layout/README.md
index a7bf9a1b0e7..92d2cecddb6 100644
--- a/ui/packages/layout/README.md
+++ b/ui/packages/layout/README.md
@@ -73,7 +73,7 @@ fills it (`:249`) — there is no `header` prop. This example used to pass one
 floor: copied verbatim, the snippet rendered an empty top bar and said nothing.
 
 Like `SidebarNav` below, `AppShell` is composed in JSX and is **not** on the
-`ComponentRegistry`: four of its seven props are `React.ReactNode` slots that no
+`ComponentRegistry`: four of its eight props are `React.ReactNode` slots that no
 JSON document can fill, so the `app-shell` key was retired in objectui#4841 and
 `{ "type": "app-shell" }` now reports `Unknown component type`. When the whole
 shell has to come from metadata, the key for that is `app-schema-renderer`.
@@ -86,6 +86,7 @@ shell has to come from metadata, the key for that is `app-schema-renderer`.
 | `navbar` | `React.ReactNode` | — | Top bar content. `AppShell` supplies the sticky `<header>` around it, so pass only what goes inside. |
 | `sidebar` | `React.ReactNode` | — | Left sidebar node, rendered as a flex sibling of the content. Pass `SidebarNav`, or your own node. |
 | `rightRail` | `React.ReactNode` | — | Optional right-side rail. It reflows the content beside it rather than overlaying it (ADR-0057 P3a); absent → unchanged single-pane layout. |
+| `showHeader` | `boolean` | `true` | Whether the shell draws its top bar. `false` draws no `<header>` element at all, and `navbar` is not mounted: for a page that draws its own top bar (the console's record page on a phone). Leaving `navbar` out alone still draws the bar. |
 | `className` | `string` | — | Tailwind overrides for the content element — **not** for the outer container. |
 | `defaultOpen` | `boolean` | `true` | Initial open state of the underlying Shadcn `SidebarProvider`. |
 | `branding` | `AppShellBranding` | — | App branding, applied by `useAppShellBranding`: `primaryColor` / `accentColor` become CSS custom properties on the document root (re-derived for dark mode), `favicon` sets the icon link's `href`, and `title` sets `document.title`. |
diff --git a/ui/packages/layout/src/AppShell.tsx b/ui/packages/layout/src/AppShell.tsx
index 872997fcb8a..5b85bed47ff 100644
--- a/ui/packages/layout/src/AppShell.tsx
+++ b/ui/packages/layout/src/AppShell.tsx
@@ -39,6 +39,13 @@ export interface AppShellProps {
    * this is purely additive.
    */
   rightRail?: React.ReactNode;
+  /**
+   * Whether the shell draws its top bar, the header element around `navbar`.
+   * Defaults to `true`; `false` draws no header element at all, for a page
+   * that draws its own top bar (the console's record page on a phone,
+   * objectstack#28483). Omitting `navbar` alone still draws the bar.
+   */
+  showHeader?: boolean;
 }
 
 /**
@@ -292,6 +299,7 @@ export function AppShell({
   defaultOpen = true,
   branding,
   rightRail,
+  showHeader = true,
 }: AppShellProps) {
   // Apply branding CSS custom properties
   useAppShellBranding(branding, branding?.title);
@@ -302,10 +310,12 @@ export function AppShell({
           every console frame's bar (objectui#12639): the class is the one
           `@object-ui/app-shell` spells as `CONSOLE_TOP_BAR`, and that
           package's `consoleTopBar.height-12639` test holds this copy equal
-          to it. */}
-      <header className="sticky top-0 z-30 flex h-12 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4">
-        {navbar}
-      </header>
+          to it. `showHeader={false}` draws no header element. */}
+      {showHeader && (
+        <header className="sticky top-0 z-30 flex h-12 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4">
+          {navbar}
+        </header>
+      )}
 
       {/* 2. Lower section: sidebar + main content (+ optional right rail) */}
       <div className="flex flex-1 min-h-0 w-full">
diff --git a/ui/packages/layout/src/__tests__/app-shell-show-header-28483.test.tsx b/ui/packages/layout/src/__tests__/app-shell-show-header-28483.test.tsx
new file mode 100644
index 00000000000..9495472a74e
--- /dev/null
+++ b/ui/packages/layout/src/__tests__/app-shell-show-header-28483.test.tsx
@@ -0,0 +1,70 @@
+/**
+ * ObjectUI
+ * Copyright (c) 2024-present ObjectStack Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * objectstack#28483 — `AppShell`'s `showHeader`. `false` draws no `<header>`
+ * element at all (the console's record page on a phone draws its own top bar),
+ * and the `navbar` passed with it is not mounted. The prop is additive: left
+ * out, the shell draws its bar exactly as before, and a shell with no `navbar`
+ * still draws its (empty) bar, which an external host may rely on.
+ */
+
+import '@testing-library/jest-dom/vitest';
+import { describe, it, expect, afterEach } from 'vitest';
+import { render, screen, cleanup } from '@testing-library/react';
+import React from 'react';
+
+import { AppShell } from '../index';
+
+const navbar = <span data-testid="navbar-content">Search</span>;
+const headers = (c: HTMLElement) => c.querySelectorAll('header');
+
+afterEach(() => cleanup());
+
+describe('AppShell showHeader (objectstack#28483)', () => {
+  it('showHeader={false}: no header element, and the navbar is not mounted', () => {
+    const { container } = render(
+      <AppShell navbar={navbar} showHeader={false}>
+        <p data-testid="page">page</p>
+      </AppShell>,
+    );
+    expect(headers(container)).toHaveLength(0);
+    expect(screen.queryByTestId('navbar-content')).toBeNull();
+    // The page still renders, inside the shell's one main landmark.
+    expect(container.querySelector('main')).toContainElement(screen.getByTestId('page'));
+  });
+
+  it('control: showHeader left out draws the bar around the navbar, as before', () => {
+    const { container } = render(
+      <AppShell navbar={navbar}>
+        <p>page</p>
+      </AppShell>,
+    );
+    expect(headers(container)).toHaveLength(1);
+    expect(headers(container)[0]).toContainElement(screen.getByTestId('navbar-content'));
+  });
+
+  it('control: showHeader={true} is the same as leaving it out', () => {
+    const { container } = render(
+      <AppShell navbar={navbar} showHeader>
+        <p>page</p>
+      </AppShell>,
+    );
+    expect(headers(container)).toHaveLength(1);
+  });
+
+  it('control: no navbar and no showHeader still draws the empty bar (published behaviour)', () => {
+    const { container } = render(
+      <AppShell>
+        <p>page</p>
+      </AppShell>,
+    );
+    expect(headers(container)).toHaveLength(1);
+    expect(headers(container)[0]).toBeEmptyDOMElement();
+  });
+});