diff --git a/frontend/src/config/apps.ts b/frontend/src/config/apps.ts
index b20c276..dd63476 100644
--- a/frontend/src/config/apps.ts
+++ b/frontend/src/config/apps.ts
@@ -627,6 +627,24 @@ export const BUILTIN_PHONE_APP_IDS: ReadonlySet<BuiltinPhoneAppId> = new Set(
   BUILTIN_PHONE_APPS.map((app) => app.id),
 )
 
+export const DEFAULT_INSTALLED_PHONE_APP_IDS: ReadonlySet<BuiltinPhoneAppId> =
+  new Set([
+    'phone',
+    'messages',
+    'calculator',
+    'camera',
+    'clock',
+    'weather',
+    'mail',
+    'notes',
+    'memos',
+    'photos',
+    'app-store',
+    'settings',
+    'map',
+    'calendar',
+  ])
+
 export const NON_REMOVABLE_PHONE_APP_IDS: ReadonlySet<LaunchablePhoneAppId> =
   new Set([
     'app-store',
diff --git a/frontend/src/stores/app-store.test.ts b/frontend/src/stores/app-store.test.ts
index 21b1510..5ac2891 100644
--- a/frontend/src/stores/app-store.test.ts
+++ b/frontend/src/stores/app-store.test.ts
@@ -1,7 +1,10 @@
 import { createPinia, setActivePinia } from 'pinia'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
-import { NON_REMOVABLE_PHONE_APP_IDS } from '@/config/apps'
+import {
+  DEFAULT_INSTALLED_PHONE_APP_IDS,
+  NON_REMOVABLE_PHONE_APP_IDS,
+} from '@/config/apps'
 import { useAppStoreStore } from '@/stores/app-store'
 import {
   getHomeFolder,
@@ -32,6 +35,53 @@ describe('app store', () => {
     vi.useRealTimers()
   })
 
+  it('installs only the fourteen standard built-in apps by default', () => {
+    const apps = useAppStoreStore()
+
+    apps.hydrate(null)
+
+    expect([...DEFAULT_INSTALLED_PHONE_APP_IDS]).toEqual([
+      'phone',
+      'messages',
+      'calculator',
+      'camera',
+      'clock',
+      'weather',
+      'mail',
+      'notes',
+      'memos',
+      'photos',
+      'app-store',
+      'settings',
+      'map',
+      'calendar',
+    ])
+    for (const appId of DEFAULT_INSTALLED_PHONE_APP_IDS) {
+      expect(apps.isInstalled(appId)).toBe(true)
+    }
+    expect(apps.isInstalled('banking')).toBe(false)
+    expect(apps.isInstalled('feather')).toBe(false)
+    expect(apps.isInstalled('snake')).toBe(false)
+  })
+
+  it('removes old automatic apps unless the player installed them', () => {
+    const apps = useAppStoreStore()
+
+    apps.hydrate({
+      claimedApps: ['feather'],
+      homeLayout: {
+        dock: [],
+        grid: ['banking', 'feather', 'phone'],
+        hidden: [],
+        version: 5,
+      },
+    })
+
+    expect(apps.homeLayout.grid).not.toContain('banking')
+    expect(apps.homeLayout.grid).toContain('feather')
+    expect(mocks.phone.saveDeviceNamespace).toHaveBeenCalledTimes(1)
+  })
+
   it('hydrates valid launch counts and persists launches with claimed apps', () => {
     const apps = useAppStoreStore()
 
@@ -129,6 +179,79 @@ describe('app store', () => {
     })
   })
 
+  it('fully uninstalls removable apps and allows downloading them again', () => {
+    vi.useFakeTimers()
+    const apps = useAppStoreStore()
+    apps.hydrate(null)
+    mocks.phone.saveDeviceNamespace.mockClear()
+
+    expect(apps.uninstallApp('calculator')).toBe(true)
+    expect(apps.isInstalled('calculator')).toBe(false)
+    expect(apps.uninstalledApps).toEqual(['calculator'])
+    expect(apps.homeLayout.hidden).toContain('calculator')
+    expect(mocks.phone.saveDeviceNamespace).toHaveBeenLastCalledWith('apps', {
+      claimedApps: [],
+      homeLayout: apps.homeLayout,
+      launchCounts: {},
+      uninstalledApps: ['calculator'],
+    })
+
+    apps.installApp('calculator')
+    vi.advanceTimersByTime(3000)
+
+    expect(apps.isInstalled('calculator')).toBe(true)
+    expect(apps.uninstalledApps).toEqual([])
+    expect(apps.homeLayout.hidden).not.toContain('calculator')
+  })
+
+  it('hydrates persisted removals while rejecting protected and invalid ids', () => {
+    const apps = useAppStoreStore()
+
+    apps.hydrate({
+      uninstalledApps: ['calculator', 'phone', 'not-an-app'],
+      updatedAppReleases: {
+        calculator: '2026-08-14',
+        phone: '2026-08-14',
+        snake: 'x'.repeat(64),
+      },
+    })
+
+    expect(apps.uninstalledApps).toEqual(['calculator'])
+    expect(apps.isInstalled('calculator')).toBe(false)
+    expect(apps.isInstalled('phone')).toBe(true)
+    expect(apps.updatedAppReleases).toEqual({ phone: '2026-08-14' })
+  })
+
+  it('protects system apps from full uninstallation', () => {
+    const apps = useAppStoreStore()
+    apps.hydrate(null)
+    mocks.phone.saveDeviceNamespace.mockClear()
+
+    expect(apps.uninstallApp('phone')).toBe(false)
+    expect(apps.isInstalled('phone')).toBe(true)
+    expect(mocks.phone.saveDeviceNamespace).not.toHaveBeenCalled()
+  })
+
+  it('updates installed apps and persists the current release', () => {
+    vi.useFakeTimers()
+    const apps = useAppStoreStore()
+    apps.hydrate(null)
+
+    apps.updateApp('phone', '2026-08-14')
+    expect(apps.updatingApps.phone).toBe(true)
+
+    vi.advanceTimersByTime(1800)
+
+    expect(apps.updatingApps.phone).toBeUndefined()
+    expect(apps.updatedAppReleases.phone).toBe('2026-08-14')
+    expect(mocks.phone.saveDeviceNamespace).toHaveBeenLastCalledWith('apps', {
+      claimedApps: [],
+      homeLayout: apps.homeLayout,
+      launchCounts: {},
+      updatedAppReleases: { phone: '2026-08-14' },
+    })
+  })
+
   it('ignores duplicate installation requests and invalid persisted ids', () => {
     vi.useFakeTimers()
     const apps = useAppStoreStore()
diff --git a/frontend/src/stores/app-store.ts b/frontend/src/stores/app-store.ts
index 5a9a163..b46cd49 100644
--- a/frontend/src/stores/app-store.ts
+++ b/frontend/src/stores/app-store.ts
@@ -1,6 +1,7 @@
 import { defineStore } from 'pinia'
 
 import {
+  DEFAULT_INSTALLED_PHONE_APP_IDS,
   getPhoneApp,
   isExternalPhoneApp,
   isPhoneAppId,
@@ -30,6 +31,7 @@ import {
 import { nuiCall } from '@/utils/nui'
 
 const INSTALL_DURATION_MS = 3000
+const UPDATE_DURATION_MS = 1800
 
 type PendingInstallation = {
   deviceImei: string
@@ -37,10 +39,19 @@ type PendingInstallation = {
   token: symbol
 }
 
+type PendingUpdate = {
+  deviceImei: string
+  timer: ReturnType<typeof globalThis.setTimeout>
+}
+
 const pendingInstallations = new WeakMap<
   object,
   Map<LaunchablePhoneAppId, PendingInstallation>
 >()
+const pendingUpdates = new WeakMap<
+  object,
+  Map<LaunchablePhoneAppId, PendingUpdate>
+>()
 
 function getDefaultGridIds(): LaunchablePhoneAppId[] {
   return [...PHONE_APPS]
@@ -56,7 +67,9 @@ function getDefaultDockIds(): LaunchablePhoneAppId[] {
 
 function getDefaultInstalledIds(): LaunchablePhoneAppId[] {
   return PHONE_APPS.filter((app) =>
-    isExternalPhoneApp(app) ? app.defaultInstalled : app.category !== 'games',
+    isExternalPhoneApp(app)
+      ? app.defaultInstalled
+      : DEFAULT_INSTALLED_PHONE_APP_IDS.has(app.id),
   ).map((app) => app.id)
 }
 
@@ -67,9 +80,39 @@ function isProtectedHomeApp(appId: LaunchablePhoneAppId): boolean {
     : NON_REMOVABLE_PHONE_APP_IDS.has(appId)
 }
 
+function hasUninstalledBuiltinApp(
+  layout: unknown,
+  installedIds: readonly LaunchablePhoneAppId[],
+): boolean {
+  if (!layout || typeof layout !== 'object') return false
+  const installed = new Set(installedIds)
+  const source = layout as {
+    dock?: unknown
+    grid?: unknown
+    hidden?: unknown
+  }
+  const items = [source.dock, source.grid, source.hidden]
+    .filter(Array.isArray)
+    .flat(2)
+
+  return items.some((item) => {
+    const ids =
+      item && typeof item === 'object' && Array.isArray(item.apps)
+        ? item.apps
+        : [item]
+    return ids.some((id: unknown) => {
+      if (typeof id !== 'string') return false
+      const app = getPhoneApp(id)
+      return !!app && !installed.has(app.id) && !isExternalPhoneApp(app)
+    })
+  })
+}
+
 export const useAppStoreStore = defineStore('app-store', {
   state: () => ({
     claimedApps: [] as LaunchablePhoneAppId[],
+    uninstalledApps: [] as LaunchablePhoneAppId[],
+    updatedAppReleases: {} as Partial<Record<LaunchablePhoneAppId, string>>,
     homeLayout: createDefaultHomeLayout(
       getDefaultInstalledIds(),
       getDefaultGridIds(),
@@ -77,6 +120,7 @@ export const useAppStoreStore = defineStore('app-store', {
     ),
     hydrated: false,
     installingApps: {} as Partial<Record<LaunchablePhoneAppId, boolean>>,
+    updatingApps: {} as Partial<Record<LaunchablePhoneAppId, boolean>>,
     launchCounts: {} as Partial<Record<LaunchablePhoneAppId, number>>,
   }),
   actions: {
@@ -95,6 +139,9 @@ export const useAppStoreStore = defineStore('app-store', {
       return true
     },
     claimApp(id: LaunchablePhoneAppId): void {
+      this.uninstalledApps = this.uninstalledApps.filter(
+        (appId) => appId !== id,
+      )
       if (!this.claimedApps.includes(id)) {
         this.claimedApps.push(id)
         this.homeLayout = restoreHomeApp(this.homeLayout, id)
@@ -110,6 +157,14 @@ export const useAppStoreStore = defineStore('app-store', {
         pendingInstallations.delete(this)
       }
       this.installingApps = {}
+      const updates = pendingUpdates.get(this)
+      if (updates) {
+        for (const update of updates.values()) {
+          globalThis.clearTimeout(update.timer)
+        }
+        pendingUpdates.delete(this)
+      }
+      this.updatingApps = {}
     },
     installApp(id: LaunchablePhoneAppId): void {
       const installed = this.isInstalled(id)
@@ -188,6 +243,8 @@ export const useAppStoreStore = defineStore('app-store', {
         claimedApps?: unknown
         homeLayout?: unknown
         launchCounts?: unknown
+        uninstalledApps?: unknown
+        updatedAppReleases?: unknown
       } | null
       const layoutVersion =
         data?.homeLayout && typeof data.homeLayout === 'object'
@@ -204,9 +261,40 @@ export const useAppStoreStore = defineStore('app-store', {
                   isValidExternalPhoneAppId(id))),
           )
         : []
+      this.uninstalledApps = Array.isArray(data?.uninstalledApps)
+        ? data.uninstalledApps.filter((id): id is LaunchablePhoneAppId => {
+            if (typeof id !== 'string' || !isPhoneAppId(id)) return false
+            const app = getPhoneApp(id)
+            return !!app && isPhoneAppRemovable(app)
+          })
+        : []
+      this.updatedAppReleases = {}
+      if (
+        data?.updatedAppReleases &&
+        typeof data.updatedAppReleases === 'object'
+      ) {
+        for (const [id, release] of Object.entries(data.updatedAppReleases)) {
+          if (
+            isPhoneAppId(id) &&
+            typeof release === 'string' &&
+            release.length <= 32
+          ) {
+            this.updatedAppReleases[id] = release
+          }
+        }
+      }
       const installedIds = [
         ...new Set([...getDefaultInstalledIds(), ...this.claimedApps]),
-      ]
+      ].filter((id) => !this.uninstalledApps.includes(id))
+      for (const appId of Object.keys(this.updatedAppReleases)) {
+        if (!isPhoneAppId(appId) || !installedIds.includes(appId)) {
+          delete this.updatedAppReleases[appId as LaunchablePhoneAppId]
+        }
+      }
+      const removedLegacyDefaults = hasUninstalledBuiltinApp(
+        data?.homeLayout,
+        installedIds,
+      )
       const defaults = createDefaultHomeLayout(
         installedIds,
         getDefaultGridIds(),
@@ -216,6 +304,7 @@ export const useAppStoreStore = defineStore('app-store', {
         data?.homeLayout,
         defaults,
         installedIds,
+        false,
       )
       const protectedHiddenAppIds =
         this.homeLayout.hidden.filter(isProtectedHomeApp)
@@ -240,6 +329,7 @@ export const useAppStoreStore = defineStore('app-store', {
       this.hydrated = true
       if (
         protectedHiddenAppIds.length ||
+        removedLegacyDefaults ||
         layoutVersion === 2 ||
         layoutVersion === 3 ||
         layoutVersion === 4
@@ -248,24 +338,30 @@ export const useAppStoreStore = defineStore('app-store', {
       }
     },
     isInstalled(appId: LaunchablePhoneAppId): boolean {
+      if (this.uninstalledApps.includes(appId)) return false
       if (this.claimedApps.includes(appId)) return true
       const app = getPhoneApp(appId)
       if (!app) return false
       return isExternalPhoneApp(app)
         ? app.defaultInstalled
-        : app.category !== 'games'
+        : DEFAULT_INSTALLED_PHONE_APP_IDS.has(app.id)
     },
     reconcileCatalog(): void {
       const installedIds = [
         ...new Set([...getDefaultInstalledIds(), ...this.claimedApps]),
-      ]
+      ].filter((id) => !this.uninstalledApps.includes(id))
       const defaults = createDefaultHomeLayout(
         installedIds,
         getDefaultGridIds(),
         getDefaultDockIds(),
       )
       const previous = JSON.stringify(this.homeLayout)
-      this.homeLayout = parseHomeLayout(this.homeLayout, defaults, installedIds)
+      this.homeLayout = parseHomeLayout(
+        this.homeLayout,
+        defaults,
+        installedIds,
+        false,
+      )
 
       for (const appId of [...this.homeLayout.hidden]) {
         if (isProtectedHomeApp(appId)) {
@@ -406,11 +502,73 @@ export const useAppStoreStore = defineStore('app-store', {
       this.homeLayout = restoreHomeApp(this.homeLayout, appId)
       this.persist()
     },
+    uninstallApp(appId: LaunchablePhoneAppId): boolean {
+      const app = getPhoneApp(appId)
+      if (!app || !this.isInstalled(appId) || !isPhoneAppRemovable(app)) {
+        return false
+      }
+
+      this.claimedApps = this.claimedApps.filter((id) => id !== appId)
+      if (!this.uninstalledApps.includes(appId)) {
+        this.uninstalledApps.push(appId)
+      }
+      delete this.updatedAppReleases[appId]
+      this.homeLayout = removeHomeApp(this.homeLayout, appId)
+      this.persist()
+
+      return true
+    },
+    updateApp(appId: LaunchablePhoneAppId, release: string): void {
+      if (
+        !this.isInstalled(appId) ||
+        this.updatingApps[appId] ||
+        !release.trim()
+      ) {
+        return
+      }
+
+      const phone = usePhoneStore()
+      const deviceImei = phone.device?.imei
+      if (!phone.isOpen || !deviceImei) {
+        console.error(
+          `[App store] Update cancelled because no phone device is open for ${appId}.`,
+        )
+        return
+      }
+
+      const updates =
+        pendingUpdates.get(this) ??
+        new Map<LaunchablePhoneAppId, PendingUpdate>()
+      this.updatingApps[appId] = true
+      const timer = globalThis.setTimeout(() => {
+        updates.delete(appId)
+        if (!updates.size) pendingUpdates.delete(this)
+        delete this.updatingApps[appId]
+        const activePhone = usePhoneStore()
+        if (!activePhone.isOpen || activePhone.device?.imei !== deviceImei) {
+          console.error(
+            `[App store] Update cancelled because the active phone changed for ${appId}.`,
+          )
+          return
+        }
+        if (!this.isInstalled(appId)) return
+        this.updatedAppReleases[appId] = release
+        this.persist()
+      }, UPDATE_DURATION_MS)
+      updates.set(appId, { deviceImei, timer })
+      pendingUpdates.set(this, updates)
+    },
     persist(): void {
       usePhoneStore().saveDeviceNamespace('apps', {
         claimedApps: this.claimedApps,
         homeLayout: this.homeLayout,
         launchCounts: this.launchCounts,
+        ...(this.uninstalledApps.length
+          ? { uninstalledApps: this.uninstalledApps }
+          : {}),
+        ...(Object.keys(this.updatedAppReleases).length
+          ? { updatedAppReleases: this.updatedAppReleases }
+          : {}),
       })
     },
   },
diff --git a/frontend/src/stores/phone.ts b/frontend/src/stores/phone.ts
index c01e077..a0271d7 100644
--- a/frontend/src/stores/phone.ts
+++ b/frontend/src/stores/phone.ts
@@ -35,6 +35,7 @@ export type PhoneOpenPayload = {
   locales?: LocaleTree
   memos?: DeviceBootstrap['memos']
   notes?: DeviceBootstrap['notes']
+  player?: DeviceBootstrap['player']
   security?: DeviceSecurity
   token?: string
 }
@@ -1756,15 +1757,116 @@ const defaultLocales: LocaleTree = {
       get: 'GET',
       open: 'OPEN',
       installing: 'Installing',
-      searchPlaceholder: 'Search apps and games',
+      player: 'Player',
+      profileLabel: '{name} profile',
+      searchPlaceholder: 'Games, apps, stories and more',
       appsTitle: 'Built-in Apps',
       gamesTitle: 'Games',
       selected: 'Apps available for your Sky Phone',
       tabs: {
+        today: 'Today',
         apps: 'Apps',
         games: 'Games',
         search: 'Search',
       },
+      today: {
+        freshDaily: 'A fresh selection every day',
+        dailyEdition: 'Daily Edition',
+        featured: 'Featured today',
+        gameHighlight: 'Game highlight',
+        appHighlight: 'App highlight',
+        curatedForYou: 'Curated for you',
+        editorsChoice: "Editor's Choice",
+        discoverTitle: 'Discover {app}',
+        playTitle: 'Play something new with {app}',
+        description: '{app} is in the spotlight today on Sky Phone.',
+        categoryDescription: '{category} · Made for Sky Phone',
+        moreHighlights: "Today's Highlights",
+        topToday: 'Top Today',
+        topTodayDescription: 'Popular picks from today’s edition',
+        oneMoreThing: 'One more thing',
+      },
+      filters: {
+        all: 'All',
+        social: 'Social',
+        utilities: 'Utilities',
+        shopping: 'Shopping',
+        productivity: 'Productivity',
+        arcade: 'Arcade',
+        puzzle: 'Puzzle',
+        classic: 'Classics',
+      },
+      browse: {
+        categories: 'Store categories',
+        availableNow: 'Available now',
+        featureTitle: 'Discover {app}',
+        featuredPages: 'Featured apps',
+        handPicked: 'Hand-picked for you',
+        essentialApps: 'Essential Apps',
+        essentialGames: 'Essential Games',
+      },
+      search: {
+        recommended: 'Recommended',
+        discover: 'Discover',
+        results: 'Search Results',
+        noResults: 'No matching apps or games found.',
+        ad: 'Ad',
+        topApps: 'Top Apps',
+        topGames: 'Top Games',
+        bestApps: 'Bestselling Apps',
+        bestGames: 'Bestselling Games',
+        productivity: 'Productivity',
+        photoVideo: 'Photo & Video',
+      },
+      account: {
+        account: 'Account',
+        title: 'App Management',
+        skyAccount: 'Sky Phone Account',
+        apps: 'Installed Apps',
+        games: 'Games',
+        library: 'Your Library',
+        myApps: 'My Apps',
+        update: 'UPDATE',
+        uninstall: 'Uninstall',
+        uninstallApp: 'Uninstall {app}',
+        uninstallTitle: 'Uninstall this app?',
+        uninstallBody:
+          '{app} will be removed from this phone. You can download it again from the App Store.',
+      },
+      details: {
+        skyStudios: 'Sky Studios',
+        share: 'Share app',
+        openDetails: 'View {app}',
+        shareReady: 'App information is ready to share.',
+        shareCopy: 'Take a look at {app} in the App Store.',
+        ratings: '{count} ratings',
+        age: 'Age Rating',
+        years: 'Years',
+        chart: 'Chart',
+        whatsNew: "What's New",
+        version: 'Version {version}',
+        updatedToday: 'Today',
+        releaseNotes:
+          '{app} now includes fresh content, faster loading and several interface improvements.',
+        preview: 'Preview',
+        testData: 'Preview data',
+        previewLive: 'Live Preview',
+        previousPreview: 'Previous preview',
+        nextPreview: 'Next preview',
+        previewOverview: 'Everything important at a glance',
+        previewCommunity: 'Community',
+        previewInsights: 'Insights',
+        today: 'Today',
+        progress: 'Progress',
+        communityTitle: 'Together in {app}',
+        communityBody: 'Discover activity from players around Los Santos.',
+        featuredMoment: 'Featured moment from today',
+        weeklyActivity: 'Weekly Activity',
+        fromLastWeek: 'from last week',
+        about: 'About this App',
+        description:
+          '{app} is a detailed {category} experience made for Sky Phone. Explore its features, connect with the city and keep everything close at hand.',
+      },
     },
     phone: {
       name: 'Phone',
@@ -3637,7 +3739,8 @@ const defaultLocales: LocaleTree = {
         shareCopy: '{count} photos and videos shared from Photos.',
         delete: 'Delete Selected',
         deleteTitle: 'Delete Selected Media?',
-        deleteBody: 'The selected photos and videos will be permanently deleted.',
+        deleteBody:
+          'The selected photos and videos will be permanently deleted.',
         deleted: '{count} media items deleted.',
         limit: 'You can select up to 50 media items.',
       },
@@ -4101,6 +4204,10 @@ export const usePhoneStore = defineStore('phone', {
     preferences: cloneJsonData(DEFAULT_PHONE_PREFERENCES),
     persistenceGeneration: 0,
     persistenceSession: ++nextPersistenceSession,
+    player: {
+      firstName: '',
+      lastName: '',
+    } as DeviceBootstrap['player'],
     security: {
       enabled: false,
       length: null,
@@ -4133,6 +4240,7 @@ export const usePhoneStore = defineStore('phone', {
       this.lang = payload.lang ?? 'en'
       this.locales = payload.locales ?? defaultLocales
       if (payload.device) this.hydrateDevice(payload.device)
+      if (payload.player) this.player = payload.player
       this.security = payload.security ?? {
         enabled: false,
         length: null,
@@ -4142,6 +4250,7 @@ export const usePhoneStore = defineStore('phone', {
     },
     endDeviceSession(): void {
       this.close()
+      this.player = { firstName: '', lastName: '' }
       if (this.deviceSessionToken !== null) {
         this.deviceSessionToken = null
         this.persistenceGeneration += 1
diff --git a/frontend/src/types/device.ts b/frontend/src/types/device.ts
index 4a4dd32..34ee1b4 100644
--- a/frontend/src/types/device.ts
+++ b/frontend/src/types/device.ts
@@ -14,6 +14,11 @@ export type PhoneDevice = {
   sim: PhoneSim | null
 }
 
+export type PhonePlayerIdentity = {
+  firstName: string
+  lastName: string
+}
+
 export type PhoneNotificationDevicePayload = {
   imei: string
   name: string
@@ -45,6 +50,7 @@ export type DeviceBootstrap = {
   device: PhoneDevice
   memos: MemoDto[]
   notes: Note[]
+  player: PhonePlayerIdentity
   security: DeviceSecurity
   token: string
 }
diff --git a/frontend/src/ui/controls.css b/frontend/src/ui/controls.css
index 7165875..2c4770f 100644
--- a/frontend/src/ui/controls.css
+++ b/frontend/src/ui/controls.css
@@ -1203,6 +1203,15 @@ label.sky-list-item__row {
   opacity: 0.55;
 }
 
+.sky-searchbar__suffix {
+  width: var(--sky-touch-target, 44px);
+  height: var(--sky-touch-target, 44px);
+  display: grid;
+  flex: none;
+  place-items: center;
+  color: var(--sky-muted, rgba(0, 0, 0, 0.55));
+}
+
 .sky-searchbar__clear {
   width: var(--sky-touch-target, 44px);
   height: var(--sky-touch-target, 44px);
diff --git a/frontend/src/ui/controls/SkySearchbar.vue b/frontend/src/ui/controls/SkySearchbar.vue
index c4acfe9..2da2ea8 100644
--- a/frontend/src/ui/controls/SkySearchbar.vue
+++ b/frontend/src/ui/controls/SkySearchbar.vue
@@ -160,6 +160,9 @@ function disable(event: MouseEvent): void {
         @focus="handleFocus"
         @input="handleInput"
       />
+      <span v-if="$slots.suffix" class="sky-searchbar__suffix">
+        <slot name="suffix" />
+      </span>
       <button
         v-if="clearButton && localValue"
         class="sky-searchbar__clear"
diff --git a/frontend/src/utils/appStoreHighlights.test.ts b/frontend/src/utils/appStoreHighlights.test.ts
new file mode 100644
index 0000000..a395992
--- /dev/null
+++ b/frontend/src/utils/appStoreHighlights.test.ts
@@ -0,0 +1,33 @@
+import { describe, expect, it } from 'vitest'
+
+import { getDailyHighlights } from '@/utils/appStoreHighlights'
+
+const candidates = [
+  { id: 'banking' },
+  { id: 'feather' },
+  { id: 'snake' },
+  { id: 'music' },
+  { id: 'picstagram' },
+]
+
+describe('daily App Store highlights', () => {
+  it('keeps the generated order stable throughout one local day', () => {
+    const morning = getDailyHighlights(candidates, new Date(2026, 7, 14, 8, 15))
+    const evening = getDailyHighlights(
+      candidates,
+      new Date(2026, 7, 14, 22, 45),
+    )
+
+    expect(evening).toEqual(morning)
+    expect(morning).toHaveLength(candidates.length)
+  })
+
+  it('generates a different curation for the next local day', () => {
+    const today = getDailyHighlights(candidates, new Date(2026, 7, 14))
+    const tomorrow = getDailyHighlights(candidates, new Date(2026, 7, 15))
+
+    expect(tomorrow.map((app) => app.id)).not.toEqual(
+      today.map((app) => app.id),
+    )
+  })
+})
diff --git a/frontend/src/utils/appStoreHighlights.ts b/frontend/src/utils/appStoreHighlights.ts
new file mode 100644
index 0000000..d13c80a
--- /dev/null
+++ b/frontend/src/utils/appStoreHighlights.ts
@@ -0,0 +1,38 @@
+type HighlightCandidate = {
+  id: string
+}
+
+function localDayNumber(date: Date): number {
+  return Math.floor(
+    Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()) / 86_400_000,
+  )
+}
+
+function nextRandom(seed: number): number {
+  return (Math.imul(seed, 1_664_525) + 1_013_904_223) >>> 0
+}
+
+export function getDailyHighlights<T extends HighlightCandidate>(
+  candidates: readonly T[],
+  date = new Date(),
+): T[] {
+  const ordered = [...candidates].sort((left, right) =>
+    left.id.localeCompare(right.id),
+  )
+  let seed = localDayNumber(date) >>> 0
+
+  for (let index = ordered.length - 1; index > 0; index -= 1) {
+    seed = nextRandom(seed)
+    const target = seed % (index + 1)
+    const current = ordered[index]
+    ordered[index] = ordered[target]
+    ordered[target] = current
+  }
+
+  if (ordered.length > 1) {
+    const offset = localDayNumber(date) % ordered.length
+    return [...ordered.slice(offset), ...ordered.slice(0, offset)]
+  }
+
+  return ordered
+}
diff --git a/frontend/src/utils/homeLayout.ts b/frontend/src/utils/homeLayout.ts
index 68e5e88..0826cfd 100644
--- a/frontend/src/utils/homeLayout.ts
+++ b/frontend/src/utils/homeLayout.ts
@@ -453,12 +453,16 @@ export function parseHomeLayout(
   value: unknown,
   defaults: HomeLayout,
   installedIds: LaunchablePhoneAppId[],
+  preservePersistedIds = true,
 ): HomeLayout {
   if (!value || typeof value !== 'object') return defaults
 
   const source = value as Partial<Record<keyof HomeLayout, unknown>>
   const availableIds = new Set(installedIds)
-  if (source.version === 3 || source.version === 4 || source.version === 5) {
+  if (
+    preservePersistedIds &&
+    (source.version === 3 || source.version === 4 || source.version === 5)
+  ) {
     for (const collection of [source.dock, source.grid, source.hidden]) {
       if (!Array.isArray(collection)) continue
       for (const item of collection) {
diff --git a/frontend/src/views/apps/AppStoreAction.contract.test.ts b/frontend/src/views/apps/AppStoreAction.contract.test.ts
new file mode 100644
index 0000000..011c803
--- /dev/null
+++ b/frontend/src/views/apps/AppStoreAction.contract.test.ts
@@ -0,0 +1,29 @@
+import { readFileSync } from 'node:fs'
+import { fileURLToPath } from 'node:url'
+
+import { describe, expect, it } from 'vitest'
+
+const source = readFileSync(
+  fileURLToPath(new URL('./AppStoreAction.vue', import.meta.url)),
+  'utf8',
+)
+
+describe('AppStoreAction contract', () => {
+  it('uses an Apple-style cloud download icon instead of GET text', () => {
+    expect(source).toContain("import { CloudDownload } from 'lucide-vue-next'")
+    expect(source).toContain('v-if="action === \'get\'"')
+    expect(source).not.toContain("phone.t('Apps.appStore.get')")
+  })
+
+  it('shows a timed circular installation progress with a center stop mark', () => {
+    expect(source).toContain('class="app-store-action__progress"')
+    expect(source).toContain('class="app-store-action__track"')
+    expect(source).toContain('class="app-store-action__value"')
+    expect(source).toContain(
+      'animation: app-store-download-progress 3s linear forwards',
+    )
+    expect(source).toMatch(
+      /\.app-store-action__progress i\s*\{[^}]*width:\s*7px/s,
+    )
+  })
+})
diff --git a/frontend/src/views/apps/AppStoreAction.vue b/frontend/src/views/apps/AppStoreAction.vue
new file mode 100644
index 0000000..15ef053
--- /dev/null
+++ b/frontend/src/views/apps/AppStoreAction.vue
@@ -0,0 +1,112 @@
+<script setup lang="ts">
+import { CloudDownload } from 'lucide-vue-next'
+
+import { usePhoneStore } from '@/stores/phone'
+
+defineProps<{
+  action: 'get' | 'installing' | 'open'
+}>()
+
+const phone = usePhoneStore()
+</script>
+
+<template>
+  <span
+    class="app-store-action"
+    :class="{ 'app-store-action--icon': action !== 'open' }"
+    aria-hidden="true"
+  >
+    <CloudDownload
+      v-if="action === 'get'"
+      class="app-store-action__download"
+      :size="24"
+      :stroke-width="1.9"
+    />
+    <span
+      v-else-if="action === 'installing'"
+      class="app-store-action__progress"
+    >
+      <svg viewBox="0 0 28 28">
+        <circle class="app-store-action__track" cx="14" cy="14" r="11" />
+        <circle class="app-store-action__value" cx="14" cy="14" r="11" />
+      </svg>
+      <i></i>
+    </span>
+    <template v-else>{{ phone.t('Apps.appStore.open') }}</template>
+  </span>
+</template>
+
+<style scoped>
+.app-store-action {
+  display: grid;
+  place-items: center;
+  font: inherit;
+}
+
+.app-store-action--icon {
+  width: 28px;
+  height: 28px;
+  color: var(--sky-app-accent);
+}
+
+.app-store-action__download {
+  filter: drop-shadow(
+    0 2px 5px color-mix(in srgb, var(--sky-app-accent) 30%, transparent)
+  );
+}
+
+.app-store-action__progress {
+  width: 28px;
+  height: 28px;
+  position: relative;
+  display: grid;
+  place-items: center;
+}
+
+.app-store-action__progress svg {
+  width: 28px;
+  height: 28px;
+  position: absolute;
+  inset: 0;
+  overflow: visible;
+  fill: none;
+  stroke-width: 2.2;
+}
+
+.app-store-action__track {
+  stroke: color-mix(in srgb, var(--sky-app-accent) 24%, transparent);
+}
+
+.app-store-action__value {
+  stroke: var(--sky-app-accent);
+  stroke-linecap: round;
+  stroke-dasharray: 69.2;
+  stroke-dashoffset: 69.2;
+  transform: rotate(-90deg);
+  transform-origin: 50% 50%;
+  animation: app-store-download-progress 3s linear forwards;
+}
+
+.app-store-action__progress i {
+  width: 7px;
+  height: 7px;
+  border-radius: 1.5px;
+  background: var(--sky-app-accent);
+}
+
+@keyframes app-store-download-progress {
+  from {
+    stroke-dashoffset: 69.2;
+  }
+  to {
+    stroke-dashoffset: 4;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .app-store-action__value {
+    animation: none;
+    stroke-dashoffset: 34.6;
+  }
+}
+</style>
diff --git a/frontend/src/views/apps/AppStoreApp.contract.test.ts b/frontend/src/views/apps/AppStoreApp.contract.test.ts
index 9925e14..2d68d5f 100644
--- a/frontend/src/views/apps/AppStoreApp.contract.test.ts
+++ b/frontend/src/views/apps/AppStoreApp.contract.test.ts
@@ -23,7 +23,8 @@ describe('AppStoreApp Sky navigation contract', () => {
     expect(source.match(/<SkyScrollArea/g)).toHaveLength(1)
   })
 
-  it('renders the Apps, Games and Search glass navigation', () => {
+  it('renders the Today, Apps, Games and Search glass navigation', () => {
+    expect(source).toContain("{ id: 'today', icon: Newspaper }")
     expect(source).toContain("{ id: 'apps', icon: Grid2X2 }")
     expect(source).toContain("{ id: 'games', icon: Gamepad2 }")
     expect(source).toContain("{ id: 'search', icon: Search }")
@@ -40,8 +41,75 @@ describe('AppStoreApp Sky navigation contract', () => {
     expect(navigationSource).not.toContain('compact')
   })
 
+  it('renders an Apple-style Search landing page and separate results state', () => {
+    expect(source).toContain('const hasSearchQuery = computed')
+    expect(source).toContain('const searchRecommendations = computed')
+    expect(source).toContain('const searchDiscoverCards = computed')
+    expect(source).toContain('v-if="!hasSearchQuery"')
+    expect(source).toContain('class="store-search__recommendations"')
+    expect(source).toContain('class="store-search__discover-grid"')
+    expect(source).toContain(
+      'class="store-list store-list--browse store-list--search-results"',
+    )
+    expect(source).not.toContain('.store-list--search-results article > button')
+    expect(source).not.toContain('<template #suffix>')
+    expect(source).not.toMatch(/\bMic\b/)
+    expect(source).toContain('selectSearchDiscovery(card.app)')
+    expect(source).toMatch(
+      /\.store-search__discover-grid > button\s*\{[^}]*min-height:\s*124px/s,
+    )
+  })
+
+  it('opens profile app management with update and uninstall actions', () => {
+    expect(source).toContain('@click="profileOpened = true"')
+    expect(source).toContain('const installedApps = computed')
+    expect(source).toContain('return !appStore.isInstalled(app.id)')
+    expect(source).toContain('class="store-account__apps"')
+    expect(source).toContain('appStore.updateApp(app.id, currentRelease)')
+    expect(source).toContain(
+      'appStore.uninstallApp(uninstallCandidate.value.id)',
+    )
+    expect(source).toContain('v-if="isPhoneAppRemovable(app)"')
+    expect(source).toContain(':opened="Boolean(uninstallCandidate)"')
+    expect(source).toContain('class="store-account__grabber"')
+    expect(source).toContain('@pointerdown="beginProfileDrag"')
+    expect(source).toContain('@pointermove="moveProfileDrag"')
+    expect(source).toContain('@pointerup="endProfileDrag"')
+    expect(source).toContain('profileDragOffset.value >= 72')
+    expect(source).not.toContain('<X :size="20"')
+  })
+
+  it('opens App Store details from app and game lists without replacing direct actions', () => {
+    expect(source).toContain(
+      "import AppStoreDetail from './AppStoreDetail.vue'",
+    )
+    expect(source).toContain(
+      'const selectedApp = ref<LaunchablePhoneAppDefinition | null>(null)',
+    )
+    expect(source).toContain('<AppStoreDetail')
+    expect(source).toContain('@click="openAppDetail(app)"')
+    expect(source).toContain('@action="handleApp(selectedApp)"')
+    expect(source).toContain('@back="selectedApp = null"')
+    expect(source).toContain('@click="selectStoreTab(item.id)"')
+    expect(source).toContain('scrollElement?.scrollTo({ top: 0 })')
+  })
+
+  it('shares app details through EasyShare and restores shared detail links', () => {
+    expect(source).toContain(
+      "import { useEasyShareStore } from '@/stores/easyshare'",
+    )
+    expect(source).toContain("appId: 'app-store'")
+    expect(source).toContain("kind: 'link'")
+    expect(source).toContain('link: `skyphone://app-store/${app.id}`')
+    expect(source).toContain('easyShare.open({')
+    expect(source).toContain('route.query.easyShareId')
+    expect(source).not.toContain('shareToastOpened')
+  })
+
   it('keeps one scroll owner and accessible 44px app actions', () => {
-    expect(source).toContain('<SkyScrollArea class="store-scroll" with-tabbar>')
+    expect(source).toMatch(
+      /<SkyScrollArea\s+ref="storeScroll"\s+class="store-scroll"[\s\S]*?with-tabbar\s*>/,
+    )
     expect(source).toMatch(/\.store-scroll\s*\{[^}]*overflow-y:\s*auto/s)
     expect(source).not.toMatch(/\.store-scroll\s*\{[^}]*padding\s*:/s)
     expect(source).toMatch(/\.store-scroll\s*\{[^}]*padding-top:\s*0/s)
@@ -52,11 +120,101 @@ describe('AppStoreApp Sky navigation contract', () => {
       /\.store-scroll\s*\{[^}]*padding-left:\s*calc\(var\(--sky-page-gutter\) \+ var\(--sky-safe-area-left\)\)/s,
     )
     expect(source).toMatch(
-      /\.store-list article > button\s*\{[^}]*min-height:\s*var\(--sky-touch-target\)/s,
+      /\.store-list article > button:not\(\.store-list__detail-link\)\s*\{[^}]*min-height:\s*var\(--sky-touch-target\)/s,
     )
     expect(source).toContain(':clear-label="phone.t(\'Common.clear\')"')
     expect(source).toContain(
       ':label="phone.t(\'Apps.appStore.searchPlaceholder\')"',
     )
+    expect(source).toContain(
+      ':class="{ \'store-scroll--detail\': selectedApp }"',
+    )
+    expect(source).toMatch(
+      /\.store-scroll--detail\s*\{[^}]*margin-top:\s*var\(--sky-safe-area-top\)/s,
+    )
+  })
+
+  it('gives interactive download, update and remove buttons subtle pointer feedback', () => {
+    expect(source).toContain('@media (hover: hover) and (pointer: fine)')
+    expect(source).toMatch(
+      /button:not\(\.store-ranking__detail-link\):not\(:disabled\):hover\)\s*\{[^}]*brightness\(1\.08\)[^}]*translateY\(-1px\)/s,
+    )
+    expect(source).toContain(
+      '.app-store-page :deep(button:has(.app-store-action--icon):hover)',
+    )
+    expect(source).toContain(
+      '.store-account__primary-action:not(:disabled):hover',
+    )
+    expect(source).toContain('.store-account__remove:not(:disabled):hover')
+    expect(source).toContain('@media (prefers-reduced-motion: reduce)')
+  })
+
+  it('builds daily Today cards from non-standard internal apps', () => {
+    expect(source).toContain(
+      "ref<'today' | 'apps' | 'games' | 'search'>('today')",
+    )
+    expect(source).toContain('getDailyHighlights(')
+    expect(source).toContain('!DEFAULT_INSTALLED_PHONE_APP_IDS.has(app.id)')
+    expect(source).toContain('v-else-if="tab === \'today\'"')
+    expect(source).toContain('class="store-highlight store-highlight--hero"')
+    expect(source).toContain('class="store-highlight store-highlight--compact"')
+    expect(source).toContain('class="store-today__edition"')
+    expect(source).toContain('class="store-ranking"')
+    expect(source).toContain('class="store-final-pick"')
+    expect(source).toContain('editorialHighlights')
+    expect(source).toContain('topToday')
+    expect(source).toContain('var(--sky-touch-target)')
+  })
+
+  it('opens app details from every Today banner without hijacking app actions', () => {
+    expect(source.match(/class="store-highlight__detail-link"/g)).toHaveLength(
+      3,
+    )
+    expect(source).toContain('@click="openAppDetail(dailyHighlights[0])"')
+    expect(source).toContain('@click="openAppDetail(app)"')
+    expect(source).toContain('@click="openAppDetail(finalHighlight)"')
+    expect(source).toContain('@click.stop="handleApp(dailyHighlights[0])"')
+    expect(source).toContain('@click.stop="handleApp(finalHighlight)"')
+    expect(source).toContain(
+      '.store-highlight:has(.store-highlight__detail-link:hover)',
+    )
+  })
+
+  it('opens Top Today apps while keeping their direct app actions separate', () => {
+    expect(source).toContain('class="store-ranking__detail-link"')
+    expect(source).toContain('@click="openAppDetail(app)"')
+    expect(source).toContain('@click.stop="handleApp(app)"')
+    expect(source).toContain(
+      '.store-ranking li > button:not(.store-ranking__detail-link)',
+    )
+    expect(source).not.toContain('.store-ranking__detail-link:hover')
+    expect(source).toContain(
+      'button:not(.store-ranking__detail-link):not(:disabled):hover',
+    )
+  })
+
+  it('builds clean Apps and Games pages with rotating features', () => {
+    expect(source).not.toContain('class="store-browse__filters"')
+    expect(source).not.toContain('browseFilter')
+    expect(source).toContain('class="store-browse-feature"')
+    expect(source).toContain('class="store-list store-list--browse"')
+    expect(source).toContain('featuredCandidates')
+    expect(source).toContain('globalThis.setInterval')
+    expect(source).toContain('}, 6500)')
+    expect(source).toContain('globalThis.clearInterval')
+    expect(source).toMatch(
+      /\.store-browse__pages button\s*\{[^}]*width:\s*var\(--sky-touch-target\)[^}]*height:\s*var\(--sky-touch-target\)/s,
+    )
+  })
+
+  it('matches the Photos large header with the player initials profile', () => {
+    expect(source).toContain('class="app-store-navbar"')
+    expect(source).toContain(':scroll-el="null"')
+    expect(source).toContain('<template #right>')
+    expect(source).toContain('class="app-store-profile"')
+    expect(source).toContain('phone.player.firstName')
+    expect(source).toContain('phone.player.lastName')
+    expect(source).toContain('{{ profileInitials }}')
+    expect(source).toContain('var(--sky-navbar-large-title-height) - 30px')
   })
 })
diff --git a/frontend/src/views/apps/AppStoreApp.vue b/frontend/src/views/apps/AppStoreApp.vue
index 69eb727..a873252 100644
--- a/frontend/src/views/apps/AppStoreApp.vue
+++ b/frontend/src/views/apps/AppStoreApp.vue
@@ -1,21 +1,46 @@
 <script setup lang="ts">
-import { Gamepad2, Grid2X2, Search } from 'lucide-vue-next'
-import { computed, ref } from 'vue'
-import { useRouter } from 'vue-router'
+import {
+  Camera,
+  ChevronRight,
+  Crown,
+  Gamepad2,
+  Grid2X2,
+  Newspaper,
+  Plane,
+  RefreshCw,
+  Search,
+  ShieldCheck,
+  Sparkles,
+  Trophy,
+  Trash2,
+} from 'lucide-vue-next'
+import {
+  computed,
+  nextTick,
+  onMounted,
+  onUnmounted,
+  ref,
+  watch,
+  type ComponentPublicInstance,
+} from 'vue'
+import { useRoute, useRouter } from 'vue-router'
 
 import {
+  DEFAULT_INSTALLED_PHONE_APP_IDS,
   getPhoneAppLabel,
+  isExternalPhoneApp,
   isLaunchablePhoneApp,
+  isPhoneAppRemovable,
   PHONE_APPS,
 } from '@/config/apps'
 import { useAppStoreStore } from '@/stores/app-store'
+import { useEasyShareStore } from '@/stores/easyshare'
 import { usePhoneStore } from '@/stores/phone'
-import type {
-  LaunchablePhoneAppDefinition,
-  LaunchablePhoneAppId,
-} from '@/types/apps'
+import type { LaunchablePhoneAppDefinition } from '@/types/apps'
 import {
   SkyAppPage,
+  SkyDialog,
+  SkyDialogButton,
   SkyNavbar,
   SkyPillNavigation,
   SkyScrollArea,
@@ -23,37 +48,137 @@ import {
   SkySegmented,
   SkySegmentedButton,
   SkySpinner,
+  SkySheet,
 } from '@/ui'
+import { getDailyHighlights } from '@/utils/appStoreHighlights'
+
+import AppStoreDetail from './AppStoreDetail.vue'
+import AppStoreAction from './AppStoreAction.vue'
 
 const phone = usePhoneStore()
 const appStore = useAppStoreStore()
+const easyShare = useEasyShareStore()
+const route = useRoute()
 const router = useRouter()
-const tab = ref<'apps' | 'games' | 'search'>('apps')
+const tab = ref<'today' | 'apps' | 'games' | 'search'>('today')
 const query = ref('')
-const installedDuringVisit = ref<LaunchablePhoneAppId[]>([])
+const openedAt = new Date()
+const featuredSlide = ref(0)
+const profileOpened = ref(false)
+const uninstallCandidate = ref<LaunchablePhoneAppDefinition | null>(null)
+const selectedApp = ref<LaunchablePhoneAppDefinition | null>(null)
+const storeScroll = ref<ComponentPublicInstance | null>(null)
+const profileDragOffset = ref(0)
+const profileDragging = ref(false)
+let profileDragPointerId: number | null = null
+let profileDragStartTime = 0
+let profileDragStartY = 0
+let featuredTimer: ReturnType<typeof globalThis.setInterval> | null = null
 const tabs = [
+  { id: 'today', icon: Newspaper },
   { id: 'apps', icon: Grid2X2 },
   { id: 'games', icon: Gamepad2 },
   { id: 'search', icon: Search },
 ] as const
+const searchDiscoverTiles = [
+  { id: 'topApps', icon: Trophy, background: '#5d9ee8' },
+  { id: 'topGames', icon: Crown, background: '#ee9347' },
+  { id: 'bestApps', icon: Sparkles, background: '#58c85a' },
+  { id: 'bestGames', icon: Gamepad2, background: '#7b5ce9' },
+  { id: 'productivity', icon: Plane, background: '#4e91cf' },
+  { id: 'photoVideo', icon: Camera, background: '#c28b36' },
+] as const
+const highlightPalettes = [
+  { background: '#244cc8', glow: '#7da4ff' },
+  { background: '#d54b38', glow: '#ffbd6f' },
+  { background: '#087c78', glow: '#4ee4cb' },
+  { background: '#783daf', glow: '#dca4ff' },
+  { background: '#ae6c13', glow: '#ffd37d' },
+] as const
 const activeTabIndex = computed(() =>
   tabs.findIndex((item) => item.id === tab.value),
 )
+const profileName = computed(() => {
+  const name = [phone.player.firstName, phone.player.lastName]
+    .map((part) => part.trim())
+    .filter(Boolean)
+    .join(' ')
+  return name || phone.t('Apps.appStore.player')
+})
+const profileInitials = computed(() => {
+  const initials = `${phone.player.firstName.trim().charAt(0)}${phone.player.lastName
+    .trim()
+    .charAt(0)}`
+  return initials.toLocaleUpperCase(phone.lang) || 'P'
+})
+const todayDate = computed(() =>
+  new Intl.DateTimeFormat(phone.lang, {
+    day: 'numeric',
+    month: 'long',
+    weekday: 'long',
+  }).format(openedAt),
+)
+const currentRelease = `${openedAt.getFullYear()}-${String(openedAt.getMonth() + 1).padStart(2, '0')}-${String(openedAt.getDate()).padStart(2, '0')}`
 const catalog = computed(() =>
   PHONE_APPS.filter((app): app is LaunchablePhoneAppDefinition => {
     if (!isLaunchablePhoneApp(app) || app.id === 'app-store') {
       return false
     }
 
-    const installed = appStore.isInstalled(app.id)
-    return (
-      !installed ||
-      appStore.homeLayout.hidden.includes(app.id) ||
-      installedDuringVisit.value.includes(app.id)
-    )
+    return !appStore.isInstalled(app.id)
   }).sort((a, b) => a.gridOrder - b.gridOrder),
 )
+const installedApps = computed(() =>
+  PHONE_APPS.filter(
+    (app): app is LaunchablePhoneAppDefinition =>
+      isLaunchablePhoneApp(app) && appStore.isInstalled(app.id),
+  ).sort((a, b) => a.gridOrder - b.gridOrder),
+)
+const installedGameCount = computed(
+  () => installedApps.value.filter((app) => app.category === 'games').length,
+)
+const dailyCandidates = computed(() =>
+  getDailyHighlights(
+    PHONE_APPS.filter(
+      (app): app is LaunchablePhoneAppDefinition =>
+        isLaunchablePhoneApp(app) &&
+        !isExternalPhoneApp(app) &&
+        app.id !== 'app-store' &&
+        !DEFAULT_INSTALLED_PHONE_APP_IDS.has(app.id) &&
+        !appStore.isInstalled(app.id),
+    ),
+  ),
+)
+const dailyHighlights = computed(() => dailyCandidates.value.slice(0, 8))
+const editorialHighlights = computed(() => dailyHighlights.value.slice(1, 3))
+const topToday = computed(() => dailyHighlights.value.slice(3, 7))
+const finalHighlight = computed(() => dailyHighlights.value[7])
+const featuredCandidates = computed(() => {
+  return dailyCandidates.value
+    .filter((app) =>
+      tab.value === 'games'
+        ? app.category === 'games'
+        : app.category !== 'games',
+    )
+    .slice(0, 6)
+})
+const featuredApp = computed(() => {
+  if (!featuredCandidates.value.length) return null
+  return featuredCandidates.value[
+    featuredSlide.value % featuredCandidates.value.length
+  ]
+})
+const hasSearchQuery = computed(() => Boolean(query.value.trim()))
+const searchRecommendations = computed(() => dailyCandidates.value.slice(0, 3))
+const searchDiscoverCards = computed(() => {
+  if (!dailyCandidates.value.length) return []
+  return searchDiscoverTiles.map((tile, index) => ({
+    ...tile,
+    app: dailyCandidates.value[(index + 3) % dailyCandidates.value.length]!,
+  }))
+})
 const shownApps = computed(() => {
+  if (tab.value === 'today') return []
   if (tab.value === 'games') {
     return catalog.value.filter((app) => app.category === 'games')
   }
@@ -62,12 +187,35 @@ const shownApps = computed(() => {
   }
 
   const search = query.value.trim().toLocaleLowerCase(phone.lang)
-  if (!search) return catalog.value
-  return catalog.value.filter((app) =>
-    getPhoneAppLabel(app, phone.t)
+  if (!search) return []
+  return catalog.value.filter((app) => {
+    const searchable = [
+      getPhoneAppLabel(app, phone.t),
+      phone.t(`Home.groups.${app.category}`),
+    ]
+      .join(' ')
       .toLocaleLowerCase(phone.lang)
-      .includes(search),
-  )
+    return searchable.includes(search)
+  })
+})
+
+watch(tab, () => {
+  featuredSlide.value = 0
+})
+
+onMounted(() => {
+  featuredTimer = globalThis.setInterval(() => {
+    if (
+      (tab.value === 'apps' || tab.value === 'games') &&
+      featuredCandidates.value.length > 1
+    ) {
+      featuredSlide.value += 1
+    }
+  }, 6500)
+})
+
+onUnmounted(() => {
+  if (featuredTimer) globalThis.clearInterval(featuredTimer)
 })
 
 function appAction(
@@ -76,11 +224,7 @@ function appAction(
   if (appStore.installingApps[app.id]) return 'installing'
 
   const installed = appStore.isInstalled(app.id)
-  if (
-    installed &&
-    !appStore.homeLayout.hidden.includes(app.id) &&
-    installedDuringVisit.value.includes(app.id)
-  ) {
+  if (installed && !appStore.homeLayout.hidden.includes(app.id)) {
     return 'open'
   }
 
@@ -93,11 +237,135 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
     return
   }
 
-  if (!installedDuringVisit.value.includes(app.id)) {
-    installedDuringVisit.value.push(app.id)
-  }
   appStore.installApp(app.id)
 }
+
+function handleManagedApp(app: LaunchablePhoneAppDefinition): void {
+  if (appStore.updatedAppReleases[app.id] !== currentRelease) {
+    appStore.updateApp(app.id, currentRelease)
+    return
+  }
+
+  closeProfile()
+  void router.push(app.route)
+}
+
+function closeProfile(): void {
+  profileOpened.value = false
+  profileDragging.value = false
+  profileDragPointerId = null
+  profileDragOffset.value = 0
+}
+
+function beginProfileDrag(event: PointerEvent): void {
+  if (!profileOpened.value || event.button !== 0) return
+  profileDragPointerId = event.pointerId
+  profileDragStartTime = performance.now()
+  profileDragStartY = event.clientY
+  profileDragOffset.value = 0
+  profileDragging.value = true
+  ;(event.currentTarget as HTMLElement).setPointerCapture(event.pointerId)
+}
+
+function moveProfileDrag(event: PointerEvent): void {
+  if (!profileDragging.value || event.pointerId !== profileDragPointerId) return
+  profileDragOffset.value = Math.max(0, event.clientY - profileDragStartY)
+}
+
+function endProfileDrag(event: PointerEvent): void {
+  if (!profileDragging.value || event.pointerId !== profileDragPointerId) return
+  const elapsed = Math.max(1, performance.now() - profileDragStartTime)
+  const shouldClose =
+    profileDragOffset.value >= 72 ||
+    (profileDragOffset.value >= 24 && profileDragOffset.value / elapsed >= 0.55)
+  ;(event.currentTarget as HTMLElement).releasePointerCapture(event.pointerId)
+  profileDragging.value = false
+  profileDragPointerId = null
+  if (shouldClose) closeProfile()
+  profileDragOffset.value = 0
+}
+
+function confirmUninstall(): void {
+  if (!uninstallCandidate.value) return
+  appStore.uninstallApp(uninstallCandidate.value.id)
+  uninstallCandidate.value = null
+}
+
+function highlightStyle(index: number): Record<string, string> {
+  const palette = highlightPalettes[index % highlightPalettes.length]
+  return {
+    '--store-highlight-background': palette.background,
+    '--store-highlight-glow': palette.glow,
+  }
+}
+
+function highlightTitle(app: LaunchablePhoneAppDefinition): string {
+  const appName = getPhoneAppLabel(app, phone.t)
+  return phone.t(
+    app.category === 'games'
+      ? 'Apps.appStore.today.playTitle'
+      : 'Apps.appStore.today.discoverTitle',
+    { app: appName },
+  )
+}
+
+function categoryDescription(app: LaunchablePhoneAppDefinition): string {
+  return phone.t('Apps.appStore.today.categoryDescription', {
+    category: phone.t(`Home.groups.${app.category}`),
+  })
+}
+
+function selectSearchDiscovery(app: LaunchablePhoneAppDefinition): void {
+  query.value = getPhoneAppLabel(app, phone.t)
+}
+
+function openAppDetail(app: LaunchablePhoneAppDefinition): void {
+  selectedApp.value = app
+  void nextTick(() => {
+    const scrollElement = storeScroll.value?.$el as HTMLElement | undefined
+    scrollElement?.scrollTo({ top: 0 })
+  })
+}
+
+function selectStoreTab(nextTab: (typeof tabs)[number]['id']): void {
+  selectedApp.value = null
+  tab.value = nextTab
+}
+
+function shareSelectedApp(): void {
+  const app = selectedApp.value
+  if (!app) return
+  const appName = getPhoneAppLabel(app, phone.t)
+  easyShare.open({
+    appId: 'app-store',
+    copyText: phone.t('Apps.appStore.details.shareCopy', { app: appName }),
+    id: app.id,
+    imageUrl: app.iconImage,
+    kind: 'link',
+    link: `skyphone://app-store/${app.id}`,
+    meta: { appId: app.id },
+    subtitle: phone.t(`Home.groups.${app.category}`),
+    title: appName,
+  })
+}
+
+watch(
+  () => route.query.easyShareId,
+  (sharedAppId) => {
+    if (
+      route.query.easyShareKind !== 'link' ||
+      typeof sharedAppId !== 'string'
+    ) {
+      return
+    }
+    const app = PHONE_APPS.find(
+      (candidate) =>
+        candidate.id === sharedAppId && isLaunchablePhoneApp(candidate),
+    )
+    if (app && isLaunchablePhoneApp(app)) openAppDetail(app)
+  },
+  { immediate: true },
+)
 </script>
 
 <template>
@@ -109,10 +377,25 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
     :label="phone.t('Apps.appStore.name')"
   >
     <SkyNavbar
+      v-if="!selectedApp"
+      class="app-store-navbar"
+      :scroll-el="null"
       transparent
-      :title="phone.t('Apps.appStore.name')"
+      :title="phone.t(`Apps.appStore.tabs.${tab}`)"
       variant="large"
     >
+      <template #right>
+        <button
+          type="button"
+          class="app-store-profile"
+          :aria-label="
+            phone.t('Apps.appStore.profileLabel', { name: profileName })
+          "
+          @click="profileOpened = true"
+        >
+          {{ profileInitials }}
+        </button>
+      </template>
       <template v-if="tab === 'search'" #subnavbar>
         <SkySearchbar
           v-model="query"
@@ -123,39 +406,471 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
       </template>
     </SkyNavbar>
 
-    <SkyScrollArea class="store-scroll" with-tabbar>
-      <section class="store-list">
-        <article v-for="app in shownApps" :key="app.id">
-          <img
-            class="store-icon"
-            :src="app.iconImage"
-            alt=""
-            draggable="false"
-          />
+    <SkyScrollArea
+      ref="storeScroll"
+      class="store-scroll"
+      :class="{ 'store-scroll--detail': selectedApp }"
+      with-tabbar
+    >
+      <AppStoreDetail
+        v-if="selectedApp"
+        :app="selectedApp"
+        :action="appAction(selectedApp)"
+        @action="handleApp(selectedApp)"
+        @back="selectedApp = null"
+        @share="shareSelectedApp"
+      />
+      <section v-else-if="tab === 'today'" class="store-today">
+        <header class="store-today__edition">
           <div>
-            <strong>{{ getPhoneAppLabel(app, phone.t) }}</strong>
-            <small>{{ phone.t(`Home.groups.${app.category}`) }}</small>
+            <strong>{{ todayDate }}</strong>
+            <span>{{ phone.t('Apps.appStore.today.freshDaily') }}</span>
           </div>
+          <span class="store-today__edition-badge">
+            <Sparkles :size="13" :stroke-width="2.4" aria-hidden="true" />
+            {{ phone.t('Apps.appStore.today.dailyEdition') }}
+          </span>
+        </header>
+
+        <article
+          v-if="dailyHighlights[0]"
+          class="store-highlight store-highlight--hero"
+          :style="highlightStyle(0)"
+        >
           <button
             type="button"
-            :disabled="appStore.installingApps[app.id]"
-            :aria-label="`${getPhoneAppLabel(app, phone.t)} ${phone.t(
-              `Apps.appStore.${appAction(app)}`,
+            class="store-highlight__detail-link"
+            :aria-label="
+              phone.t('Apps.appStore.details.openDetails', {
+                app: getPhoneAppLabel(dailyHighlights[0], phone.t),
+              })
+            "
+            @click="openAppDetail(dailyHighlights[0])"
+          ></button>
+          <div class="store-highlight__texture" aria-hidden="true"></div>
+          <div class="store-highlight__copy">
+            <p>
+              <Sparkles :size="12" :stroke-width="2.5" aria-hidden="true" />
+              {{ phone.t('Apps.appStore.today.featured') }}
+            </p>
+            <h2>{{ highlightTitle(dailyHighlights[0]) }}</h2>
+            <span>
+              {{
+                phone.t('Apps.appStore.today.description', {
+                  app: getPhoneAppLabel(dailyHighlights[0], phone.t),
+                })
+              }}
+            </span>
+          </div>
+          <div class="store-highlight__art" aria-hidden="true">
+            <span class="store-highlight__orbit"></span>
+            <span
+              class="store-highlight__spark store-highlight__spark--one"
+            ></span>
+            <span
+              class="store-highlight__spark store-highlight__spark--two"
+            ></span>
+            <img :src="dailyHighlights[0].iconImage" alt="" draggable="false" />
+          </div>
+          <footer class="store-highlight__footer">
+            <img :src="dailyHighlights[0].iconImage" alt="" draggable="false" />
+            <div>
+              <strong>{{
+                getPhoneAppLabel(dailyHighlights[0], phone.t)
+              }}</strong>
+              <small>
+                {{ categoryDescription(dailyHighlights[0]) }}
+              </small>
+            </div>
+            <button
+              type="button"
+              :disabled="appStore.installingApps[dailyHighlights[0].id]"
+              :aria-label="`${getPhoneAppLabel(dailyHighlights[0], phone.t)} ${phone.t(
+                `Apps.appStore.${appAction(dailyHighlights[0])}`,
+              )}`"
+              @click.stop="handleApp(dailyHighlights[0])"
+            >
+              <AppStoreAction :action="appAction(dailyHighlights[0])" />
+            </button>
+          </footer>
+        </article>
+
+        <header class="store-today__section-heading">
+          <div>
+            <span>{{ phone.t('Apps.appStore.today.curatedForYou') }}</span>
+            <h2>{{ phone.t('Apps.appStore.today.moreHighlights') }}</h2>
+          </div>
+          <Sparkles :size="20" :stroke-width="2" aria-hidden="true" />
+        </header>
+        <article
+          v-for="(app, index) in editorialHighlights"
+          :key="app.id"
+          class="store-highlight store-highlight--compact"
+          :class="{ 'store-highlight--reverse': index % 2 === 1 }"
+          :style="highlightStyle(index + 1)"
+        >
+          <button
+            type="button"
+            class="store-highlight__detail-link"
+            :aria-label="
+              phone.t('Apps.appStore.details.openDetails', {
+                app: getPhoneAppLabel(app, phone.t),
+              })
+            "
+            @click="openAppDetail(app)"
+          ></button>
+          <div class="store-highlight__texture" aria-hidden="true"></div>
+          <div class="store-highlight__copy">
+            <p>
+              <span class="store-highlight__story-number"
+                >0{{ index + 1 }}</span
+              >
+              {{
+                phone.t(
+                  app.category === 'games'
+                    ? 'Apps.appStore.today.gameHighlight'
+                    : 'Apps.appStore.today.appHighlight',
+                )
+              }}
+            </p>
+            <h2>{{ highlightTitle(app) }}</h2>
+            <span>{{ categoryDescription(app) }}</span>
+          </div>
+          <div class="store-highlight__art" aria-hidden="true">
+            <span class="store-highlight__orbit"></span>
+            <img :src="app.iconImage" alt="" draggable="false" />
+          </div>
+          <footer class="store-highlight__footer">
+            <img :src="app.iconImage" alt="" draggable="false" />
+            <div>
+              <strong>{{ getPhoneAppLabel(app, phone.t) }}</strong>
+              <small>{{ phone.t('Apps.appStore.today.editorsChoice') }}</small>
+            </div>
+            <button
+              type="button"
+              :disabled="appStore.installingApps[app.id]"
+              :aria-label="`${getPhoneAppLabel(app, phone.t)} ${phone.t(
+                `Apps.appStore.${appAction(app)}`,
+              )}`"
+              @click.stop="handleApp(app)"
+            >
+              <AppStoreAction :action="appAction(app)" />
+            </button>
+          </footer>
+        </article>
+
+        <section class="store-ranking">
+          <header class="store-ranking__header">
+            <span class="store-ranking__icon">
+              <Trophy :size="18" :stroke-width="2.2" aria-hidden="true" />
+            </span>
+            <div>
+              <h2>{{ phone.t('Apps.appStore.today.topToday') }}</h2>
+              <p>{{ phone.t('Apps.appStore.today.topTodayDescription') }}</p>
+            </div>
+          </header>
+          <ol>
+            <li v-for="(app, index) in topToday" :key="app.id">
+              <span class="store-ranking__position">{{ index + 1 }}</span>
+              <button
+                type="button"
+                class="store-ranking__detail-link"
+                :aria-label="
+                  phone.t('Apps.appStore.details.openDetails', {
+                    app: getPhoneAppLabel(app, phone.t),
+                  })
+                "
+                @click="openAppDetail(app)"
+              >
+                <img :src="app.iconImage" alt="" draggable="false" />
+                <span class="store-ranking__details">
+                  <strong>{{ getPhoneAppLabel(app, phone.t) }}</strong>
+                  <small>{{ categoryDescription(app) }}</small>
+                </span>
+              </button>
+              <button
+                type="button"
+                :disabled="appStore.installingApps[app.id]"
+                :aria-label="`${getPhoneAppLabel(app, phone.t)} ${phone.t(
+                  `Apps.appStore.${appAction(app)}`,
+                )}`"
+                @click.stop="handleApp(app)"
+              >
+                <AppStoreAction :action="appAction(app)" />
+              </button>
+            </li>
+          </ol>
+        </section>
+
+        <article
+          v-if="finalHighlight"
+          class="store-final-pick"
+          :style="highlightStyle(4)"
+        >
+          <button
+            type="button"
+            class="store-highlight__detail-link"
+            :aria-label="
+              phone.t('Apps.appStore.details.openDetails', {
+                app: getPhoneAppLabel(finalHighlight, phone.t),
+              })
+            "
+            @click="openAppDetail(finalHighlight)"
+          ></button>
+          <div class="store-final-pick__glow" aria-hidden="true"></div>
+          <div class="store-final-pick__heading">
+            <span>{{ phone.t('Apps.appStore.today.oneMoreThing') }}</span>
+            <strong>{{ highlightTitle(finalHighlight) }}</strong>
+            <small>{{ categoryDescription(finalHighlight) }}</small>
+          </div>
+          <img :src="finalHighlight.iconImage" alt="" draggable="false" />
+          <button
+            type="button"
+            :disabled="appStore.installingApps[finalHighlight.id]"
+            :aria-label="`${getPhoneAppLabel(finalHighlight, phone.t)} ${phone.t(
+              `Apps.appStore.${appAction(finalHighlight)}`,
             )}`"
-            @click="handleApp(app)"
+            @click.stop="handleApp(finalHighlight)"
           >
-            <SkySpinner
-              v-if="appStore.installingApps[app.id]"
-              class="store-installing"
-            />
-            <template v-else>
-              {{ phone.t(`Apps.appStore.${appAction(app)}`) }}
-            </template>
+            <AppStoreAction :action="appAction(finalHighlight)" />
           </button>
         </article>
-        <p v-if="shownApps.length === 0" class="store-empty">
-          {{ phone.t('Home.noApps') }}
-        </p>
+      </section>
+
+      <section
+        v-else-if="tab === 'apps' || tab === 'games'"
+        class="store-browse"
+      >
+        <Transition name="store-featured" mode="out-in">
+          <article
+            v-if="featuredApp"
+            :key="featuredApp.id"
+            class="store-browse-feature"
+            :style="highlightStyle(featuredSlide + 1)"
+          >
+            <div class="store-browse-feature__texture" aria-hidden="true"></div>
+            <div class="store-browse-feature__copy">
+              <span>{{ phone.t('Apps.appStore.browse.availableNow') }}</span>
+              <h2>
+                {{
+                  phone.t('Apps.appStore.browse.featureTitle', {
+                    app: getPhoneAppLabel(featuredApp, phone.t),
+                  })
+                }}
+              </h2>
+              <p>{{ categoryDescription(featuredApp) }}</p>
+            </div>
+            <div class="store-browse-feature__art" aria-hidden="true">
+              <span></span>
+              <component
+                :is="featuredApp.icon"
+                :size="104"
+                :stroke-width="1.1"
+              />
+              <img :src="featuredApp.iconImage" alt="" draggable="false" />
+            </div>
+            <footer>
+              <img :src="featuredApp.iconImage" alt="" draggable="false" />
+              <button
+                type="button"
+                class="store-browse-feature__details"
+                @click="openAppDetail(featuredApp)"
+              >
+                <strong>{{ getPhoneAppLabel(featuredApp, phone.t) }}</strong>
+                <small>{{ categoryDescription(featuredApp) }}</small>
+              </button>
+              <button
+                type="button"
+                :disabled="appStore.installingApps[featuredApp.id]"
+                :aria-label="`${getPhoneAppLabel(featuredApp, phone.t)} ${phone.t(
+                  `Apps.appStore.${appAction(featuredApp)}`,
+                )}`"
+                @click="handleApp(featuredApp)"
+              >
+                <AppStoreAction :action="appAction(featuredApp)" />
+              </button>
+            </footer>
+          </article>
+        </Transition>
+
+        <div
+          v-if="featuredCandidates.length > 1"
+          class="store-browse__pages"
+          :aria-label="phone.t('Apps.appStore.browse.featuredPages')"
+        >
+          <button
+            v-for="(app, index) in featuredCandidates"
+            :key="app.id"
+            type="button"
+            :class="{
+              'is-active': featuredSlide % featuredCandidates.length === index,
+            }"
+            :aria-label="getPhoneAppLabel(app, phone.t)"
+            @click="featuredSlide = index"
+          ></button>
+        </div>
+
+        <header class="store-browse__list-heading">
+          <div>
+            <span>{{ phone.t('Apps.appStore.browse.handPicked') }}</span>
+            <h2>
+              {{
+                phone.t(
+                  tab === 'games'
+                    ? 'Apps.appStore.browse.essentialGames'
+                    : 'Apps.appStore.browse.essentialApps',
+                )
+              }}
+            </h2>
+          </div>
+          <strong>{{ shownApps.length }}</strong>
+        </header>
+
+        <section class="store-list store-list--browse">
+          <article v-for="app in shownApps" :key="app.id">
+            <button
+              type="button"
+              class="store-list__detail-link"
+              @click="openAppDetail(app)"
+            >
+              <img
+                class="store-icon"
+                :src="app.iconImage"
+                alt=""
+                draggable="false"
+              />
+              <span>
+                <strong>{{ getPhoneAppLabel(app, phone.t) }}</strong>
+                <small>{{ categoryDescription(app) }}</small>
+              </span>
+            </button>
+            <button
+              type="button"
+              :disabled="appStore.installingApps[app.id]"
+              :aria-label="`${getPhoneAppLabel(app, phone.t)} ${phone.t(
+                `Apps.appStore.${appAction(app)}`,
+              )}`"
+              @click="handleApp(app)"
+            >
+              <AppStoreAction :action="appAction(app)" />
+            </button>
+          </article>
+          <p v-if="shownApps.length === 0" class="store-empty">
+            {{ phone.t('Home.noApps') }}
+          </p>
+        </section>
+      </section>
+
+      <section v-else class="store-search">
+        <template v-if="!hasSearchQuery">
+          <section class="store-search__section">
+            <header class="store-search__heading">
+              <h2>{{ phone.t('Apps.appStore.search.recommended') }}</h2>
+              <ChevronRight :size="22" :stroke-width="2.5" aria-hidden="true" />
+            </header>
+            <div class="store-search__recommendations">
+              <article
+                v-for="(app, index) in searchRecommendations"
+                :key="app.id"
+                :class="{
+                  'store-search__recommendation--promoted': index === 0,
+                }"
+              >
+                <button
+                  type="button"
+                  class="store-search__detail-link"
+                  @click="openAppDetail(app)"
+                >
+                  <img :src="app.iconImage" alt="" draggable="false" />
+                  <span>
+                    <strong>{{ getPhoneAppLabel(app, phone.t) }}</strong>
+                    <small>{{ categoryDescription(app) }}</small>
+                    <em v-if="index === 0">{{
+                      phone.t('Apps.appStore.search.ad')
+                    }}</em>
+                  </span>
+                </button>
+                <button
+                  type="button"
+                  :disabled="appStore.installingApps[app.id]"
+                  :aria-label="`${getPhoneAppLabel(app, phone.t)} ${phone.t(
+                    `Apps.appStore.${appAction(app)}`,
+                  )}`"
+                  @click="handleApp(app)"
+                >
+                  <AppStoreAction :action="appAction(app)" />
+                </button>
+              </article>
+            </div>
+          </section>
+
+          <section class="store-search__section store-search__discover">
+            <header class="store-search__heading">
+              <h2>{{ phone.t('Apps.appStore.search.discover') }}</h2>
+              <ChevronRight :size="22" :stroke-width="2.5" aria-hidden="true" />
+            </header>
+            <div class="store-search__discover-grid">
+              <button
+                v-for="card in searchDiscoverCards"
+                :key="card.id"
+                type="button"
+                :style="{ '--store-search-tile': card.background }"
+                @click="selectSearchDiscovery(card.app)"
+              >
+                <component
+                  :is="card.icon"
+                  :size="40"
+                  :stroke-width="1.4"
+                  aria-hidden="true"
+                />
+                <span>{{ phone.t(`Apps.appStore.search.${card.id}`) }}</span>
+                <small>{{ getPhoneAppLabel(card.app, phone.t) }}</small>
+              </button>
+            </div>
+          </section>
+        </template>
+
+        <section v-else class="store-search__results">
+          <header class="store-search__heading">
+            <div>
+              <h2>{{ phone.t('Apps.appStore.search.results') }}</h2>
+              <span>{{ shownApps.length }}</span>
+            </div>
+          </header>
+          <div class="store-list store-list--browse store-list--search-results">
+            <article v-for="app in shownApps" :key="app.id">
+              <button
+                type="button"
+                class="store-list__detail-link"
+                @click="openAppDetail(app)"
+              >
+                <img
+                  class="store-icon"
+                  :src="app.iconImage"
+                  alt=""
+                  draggable="false"
+                />
+                <span>
+                  <strong>{{ getPhoneAppLabel(app, phone.t) }}</strong>
+                  <small>{{ categoryDescription(app) }}</small>
+                </span>
+              </button>
+              <button
+                type="button"
+                :disabled="appStore.installingApps[app.id]"
+                :aria-label="`${getPhoneAppLabel(app, phone.t)} ${phone.t(
+                  `Apps.appStore.${appAction(app)}`,
+                )}`"
+                @click="handleApp(app)"
+              >
+                <AppStoreAction :action="appAction(app)" />
+              </button>
+            </article>
+          </div>
+          <p v-if="shownApps.length === 0" class="store-empty">
+            {{ phone.t('Apps.appStore.search.noResults') }}
+          </p>
+        </section>
       </section>
     </SkyScrollArea>
 
@@ -178,7 +893,7 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
           :key="item.id"
           :active="tab === item.id"
           :aria-label="phone.t(`Apps.appStore.tabs.${item.id}`)"
-          @click="tab = item.id"
+          @click="selectStoreTab(item.id)"
         >
           <span class="app-store-navigation__item">
             <component
@@ -192,6 +907,138 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
         </SkySegmentedButton>
       </SkySegmented>
     </SkyPillNavigation>
+
+    <SkySheet
+      :opened="profileOpened"
+      class="app-store-account-sheet"
+      :class="{ 'app-store-account-sheet--dragging': profileDragging }"
+      :style="{
+        '--store-account-drag-offset': `${profileDragOffset}px`,
+      }"
+      :aria-label="phone.t('Apps.appStore.account.title')"
+      @backdropclick="closeProfile"
+      @escape="closeProfile"
+    >
+      <section class="store-account">
+        <button
+          type="button"
+          class="store-account__grabber"
+          :aria-label="phone.t('Common.close')"
+          @click="closeProfile"
+          @pointercancel="endProfileDrag"
+          @pointerdown="beginProfileDrag"
+          @pointermove="moveProfileDrag"
+          @pointerup="endProfileDrag"
+        >
+          <span aria-hidden="true"></span>
+        </button>
+        <header class="store-account__toolbar">
+          <div>
+            <span>{{ phone.t('Apps.appStore.account.account') }}</span>
+            <h2>{{ phone.t('Apps.appStore.account.title') }}</h2>
+          </div>
+        </header>
+
+        <section class="store-account__identity">
+          <span>{{ profileInitials }}</span>
+          <div>
+            <strong>{{ profileName }}</strong>
+            <small>{{ phone.t('Apps.appStore.account.skyAccount') }}</small>
+          </div>
+          <ShieldCheck :size="24" :stroke-width="1.8" aria-hidden="true" />
+        </section>
+
+        <dl class="store-account__summary">
+          <div>
+            <dt>{{ installedApps.length }}</dt>
+            <dd>{{ phone.t('Apps.appStore.account.apps') }}</dd>
+          </div>
+          <div>
+            <dt>{{ installedGameCount }}</dt>
+            <dd>{{ phone.t('Apps.appStore.account.games') }}</dd>
+          </div>
+        </dl>
+
+        <header class="store-account__section-heading">
+          <div>
+            <span>{{ phone.t('Apps.appStore.account.library') }}</span>
+            <h3>{{ phone.t('Apps.appStore.account.myApps') }}</h3>
+          </div>
+          <strong>{{ installedApps.length }}</strong>
+        </header>
+
+        <div class="store-account__apps">
+          <article v-for="app in installedApps" :key="app.id">
+            <img :src="app.iconImage" alt="" draggable="false" />
+            <div>
+              <strong>{{ getPhoneAppLabel(app, phone.t) }}</strong>
+              <small>{{ categoryDescription(app) }}</small>
+            </div>
+            <button
+              type="button"
+              class="store-account__primary-action"
+              :disabled="appStore.updatingApps[app.id]"
+              @click="handleManagedApp(app)"
+            >
+              <SkySpinner
+                v-if="appStore.updatingApps[app.id]"
+                class="store-installing"
+              />
+              <template
+                v-else-if="
+                  appStore.updatedAppReleases[app.id] !== currentRelease
+                "
+              >
+                <RefreshCw :size="13" :stroke-width="2.5" aria-hidden="true" />
+                {{ phone.t('Apps.appStore.account.update') }}
+              </template>
+              <template v-else>
+                {{ phone.t('Apps.appStore.open') }}
+              </template>
+            </button>
+            <button
+              v-if="isPhoneAppRemovable(app)"
+              type="button"
+              class="store-account__remove"
+              :aria-label="
+                phone.t('Apps.appStore.account.uninstallApp', {
+                  app: getPhoneAppLabel(app, phone.t),
+                })
+              "
+              @click="uninstallCandidate = app"
+            >
+              <Trash2 :size="17" :stroke-width="2" aria-hidden="true" />
+            </button>
+          </article>
+        </div>
+      </section>
+    </SkySheet>
+
+    <SkyDialog
+      :opened="Boolean(uninstallCandidate)"
+      role="alertdialog"
+      @backdropclick="uninstallCandidate = null"
+      @escape="uninstallCandidate = null"
+    >
+      <template #title>
+        {{ phone.t('Apps.appStore.account.uninstallTitle') }}
+      </template>
+      <p v-if="uninstallCandidate">
+        {{
+          phone.t('Apps.appStore.account.uninstallBody', {
+            app: getPhoneAppLabel(uninstallCandidate, phone.t),
+          })
+        }}
+      </p>
+      <template #buttons>
+        <SkyDialogButton @click="uninstallCandidate = null">
+          {{ phone.t('Common.cancel') }}
+        </SkyDialogButton>
+        <SkyDialogButton strong @click="confirmUninstall">
+          {{ phone.t('Apps.appStore.account.uninstall') }}
+        </SkyDialogButton>
+      </template>
+    </SkyDialog>
   </SkyAppPage>
 </template>
 
@@ -202,6 +1049,325 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
   color: var(--sky-text);
 }
 
+.app-store-page :deep(button:not(:disabled)) {
+  transition:
+    transform var(--sky-transition-fast) var(--sky-ease-out),
+    filter var(--sky-transition-fast) var(--sky-ease-out),
+    background-color var(--sky-transition-fast) var(--sky-ease-out),
+    color var(--sky-transition-fast) var(--sky-ease-out);
+}
+
+.app-store-navbar {
+  min-height: calc(
+    var(--sky-safe-area-top) + var(--sky-navbar-height) +
+      var(--sky-navbar-large-title-height) - 30px
+  );
+}
+
+.app-store-navbar :deep(.sky-navbar__right) {
+  z-index: 2;
+  transform: translateY(calc(var(--sky-navbar-height) - 30px));
+}
+
+.app-store-navbar :deep(.sky-navbar__inner) {
+  margin-bottom: 0;
+}
+
+.app-store-navbar :deep(.sky-navbar__title-container) {
+  padding-right: calc(
+    var(--sky-touch-target) + var(--sky-page-gutter) +
+      var(--sky-safe-area-right)
+  );
+  transform: translateY(calc(0px - var(--sky-navbar-collapse-offset) - 30px));
+}
+
+.app-store-profile {
+  width: var(--sky-touch-target);
+  height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  border: 0;
+  padding: 0;
+  border-radius: 50%;
+  color: var(--sky-text);
+  background: var(--sky-glass-solid);
+  box-shadow: var(
+    --sky-shadow-glass,
+    inset 0 0 0 1px var(--sky-hairline),
+    inset 0 0 5px 1px rgba(255, 255, 255, 0.35),
+    0 4px 14px rgba(0, 0, 0, 0.16)
+  );
+  font-size: 14px;
+  font-weight: 700;
+  letter-spacing: 0.02em;
+}
+
+.app-store-profile:focus-visible {
+  outline: 2px solid var(--sky-app-accent);
+  outline-offset: 2px;
+}
+
+.app-store-account-sheet :deep(.sky-sheet__panel) {
+  max-height: 92%;
+}
+
+.app-store-account-sheet--dragging :deep(.sky-sheet__panel) {
+  transform: translateY(var(--store-account-drag-offset, 0px));
+  transition-duration: 0ms;
+}
+
+.store-account {
+  display: grid;
+  gap: var(--sky-space-4);
+  padding: var(--sky-space-4) var(--sky-page-gutter)
+    calc(var(--sky-safe-area-bottom) + var(--sky-space-5));
+}
+
+.store-account__grabber {
+  width: 100%;
+  height: 28px;
+  display: grid;
+  place-items: center;
+  margin: calc(0px - var(--sky-space-3)) 0 calc(0px - var(--sky-space-2));
+  border: 0;
+  padding: 0;
+  background: transparent;
+  cursor: grab;
+  touch-action: none;
+}
+
+.store-account__grabber:active {
+  cursor: grabbing;
+}
+
+.store-account__grabber:focus-visible {
+  outline: none;
+}
+
+.store-account__grabber span {
+  width: 36px;
+  height: 5px;
+  border-radius: var(--sky-radius-pill);
+  background: var(--sky-subtle);
+}
+
+.store-account__toolbar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--sky-space-3);
+}
+
+.store-account__toolbar > div {
+  min-width: 0;
+}
+
+.store-account__toolbar span,
+.store-account__section-heading span {
+  color: var(--sky-app-accent);
+  font-size: 10px;
+  font-weight: 800;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.store-account__toolbar h2,
+.store-account__section-heading h3 {
+  margin: 2px 0 0;
+  color: var(--sky-text);
+  line-height: 1.08;
+}
+
+.store-account__toolbar h2 {
+  font-size: var(--sky-font-medium-title);
+}
+
+.store-account__identity {
+  min-height: 82px;
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-3);
+  border: 1px solid var(--sky-hairline);
+  border-radius: var(--sky-radius-card);
+  padding: var(--sky-space-4);
+  background: var(--sky-surface-muted);
+}
+
+.store-account__identity > span {
+  width: 54px;
+  height: 54px;
+  display: grid;
+  place-items: center;
+  flex: 0 0 54px;
+  border-radius: 50%;
+  color: #fff;
+  background: linear-gradient(145deg, #8eacf0, #586db8);
+  font-size: 17px;
+  font-weight: 800;
+}
+
+.store-account__identity > div {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+}
+
+.store-account__identity strong,
+.store-account__identity small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.store-account__identity small {
+  margin-top: 3px;
+  color: var(--sky-muted);
+  font-size: 11px;
+}
+
+.store-account__identity > svg {
+  flex: 0 0 auto;
+  color: var(--sky-app-accent);
+}
+
+.store-account__summary {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: var(--sky-space-3);
+  margin: 0;
+}
+
+.store-account__summary > div {
+  min-height: 70px;
+  display: grid;
+  place-items: center;
+  border-radius: var(--sky-radius-card);
+  padding: var(--sky-space-3);
+  background: var(--sky-surface-variant);
+  text-align: center;
+}
+
+.store-account__summary dt {
+  color: var(--sky-text);
+  font-size: 22px;
+  font-weight: 800;
+}
+
+.store-account__summary dd {
+  margin: -4px 0 0;
+  color: var(--sky-muted);
+  font-size: 11px;
+  font-weight: 700;
+}
+
+.store-account__section-heading {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: var(--sky-space-3);
+}
+
+.store-account__section-heading h3 {
+  font-size: 20px;
+}
+
+.store-account__section-heading > strong {
+  min-width: 28px;
+  height: 28px;
+  display: grid;
+  place-items: center;
+  border-radius: var(--sky-radius-pill);
+  color: var(--sky-muted);
+  background: var(--sky-surface-variant);
+  font-size: 11px;
+}
+
+.store-account__apps {
+  overflow: hidden;
+  border: 1px solid var(--sky-hairline);
+  border-radius: var(--sky-radius-card);
+  background: var(--sky-surface);
+}
+
+.store-account__apps article {
+  min-height: 76px;
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-3);
+  border-bottom: 1px solid var(--sky-hairline);
+  padding: var(--sky-space-3);
+}
+
+.store-account__apps article:last-child {
+  border-bottom: 0;
+}
+
+.store-account__apps article > img {
+  width: 50px;
+  height: 50px;
+  flex: 0 0 50px;
+  border-radius: calc(var(--sky-radius-control) + var(--sky-space-1));
+  object-fit: cover;
+}
+
+.store-account__apps article > div {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+}
+
+.store-account__apps article > div strong,
+.store-account__apps article > div small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.store-account__apps article > div strong {
+  font-size: 13px;
+}
+
+.store-account__apps article > div small {
+  color: var(--sky-muted);
+  font-size: 9px;
+}
+
+.store-account__primary-action {
+  min-width: 66px;
+  min-height: var(--sky-touch-target);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  flex: 0 0 auto;
+  border: 0;
+  border-radius: var(--sky-radius-pill);
+  padding: 0 var(--sky-space-3);
+  color: var(--sky-app-accent);
+  background: var(--sky-surface-muted);
+  font-size: 11px;
+  font-weight: 850;
+}
+
+.store-account__remove {
+  width: var(--sky-touch-target);
+  height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  flex: 0 0 var(--sky-touch-target);
+  border: 0;
+  border-radius: 50%;
+  color: var(--sky-danger);
+  background: var(--sky-danger-soft);
+}
+
+:global(.phone-app--performance) .store-account__identity,
+:global(.phone-app--performance) .store-account__apps {
+  box-shadow: none;
+}
+
 .store-scroll {
   min-height: 0;
   flex: 1 1 auto;
@@ -211,11 +1377,1212 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
   overflow-y: auto;
 }
 
+.store-scroll--detail {
+  margin-top: var(--sky-safe-area-top);
+}
+
+.store-today {
+  display: grid;
+  gap: var(--sky-space-5);
+  padding-bottom: var(--sky-space-6);
+}
+
+.store-today__date {
+  margin: 0;
+  color: var(--sky-muted);
+  font-size: var(--sky-font-caption);
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.store-today__heading {
+  margin: var(--sky-space-2) 0 0;
+  color: var(--sky-text);
+  font-size: var(--sky-font-medium-title);
+  line-height: 1.08;
+}
+
+.store-highlight {
+  position: relative;
+  min-width: 0;
+  overflow: hidden;
+  border-radius: var(--sky-radius-card);
+  color: #fff;
+  background:
+    radial-gradient(
+      circle at 78% 20%,
+      var(--store-highlight-glow),
+      transparent 35%
+    ),
+    linear-gradient(145deg, var(--store-highlight-background), #10141f 125%);
+  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
+  transition:
+    box-shadow 100ms ease,
+    transform 100ms ease;
+}
+
+.store-highlight__detail-link {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  z-index: 3;
+  inset: 0;
+  border: 0;
+  border-radius: inherit;
+  padding: 0;
+  background: transparent;
+  cursor: pointer;
+}
+
+.store-highlight__detail-link:focus-visible {
+  outline: 2px solid rgba(255, 255, 255, 0.9);
+  outline-offset: -3px;
+}
+
+.store-highlight__copy {
+  position: relative;
+  z-index: 2;
+  padding: var(--sky-space-5);
+}
+
+.store-highlight__copy p,
+.store-highlight__copy h2,
+.store-highlight__copy > span {
+  margin: 0;
+}
+
+.store-highlight__copy p {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  color: rgba(255, 255, 255, 0.76);
+  font-size: 11px;
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.store-highlight__copy h2 {
+  max-width: 88%;
+  margin-top: var(--sky-space-2);
+  font-size: 28px;
+  line-height: 1.03;
+}
+
+.store-highlight__copy > span {
+  max-width: 78%;
+  display: block;
+  margin-top: var(--sky-space-2);
+  color: rgba(255, 255, 255, 0.78);
+  font-size: 14px;
+  line-height: 1.3;
+}
+
+.store-highlight__art {
+  position: relative;
+  height: 170px;
+  display: grid;
+  place-items: center;
+}
+
+.store-highlight__orbit {
+  position: absolute;
+  width: 180px;
+  height: 180px;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.12);
+  box-shadow:
+    0 0 0 28px rgba(255, 255, 255, 0.06),
+    0 0 0 58px rgba(255, 255, 255, 0.035);
+}
+
+.store-highlight__art img {
+  position: relative;
+  width: 124px;
+  height: 124px;
+  border-radius: calc(var(--sky-radius-card) - var(--sky-space-1));
+  object-fit: cover;
+  filter: drop-shadow(0 16px 18px rgba(0, 0, 0, 0.34));
+  transform: rotate(-4deg);
+}
+
+.store-highlight__footer {
+  position: relative;
+  z-index: 2;
+  min-height: 76px;
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-3);
+  padding: var(--sky-space-3) var(--sky-space-4);
+  background: rgba(0, 0, 0, 0.2);
+}
+
+.store-highlight__footer > img {
+  width: 46px;
+  height: 46px;
+  flex: 0 0 46px;
+  border-radius: calc(var(--sky-radius-control) + var(--sky-space-1));
+  object-fit: cover;
+}
+
+.store-highlight__footer > div {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+}
+
+.store-highlight__footer strong,
+.store-highlight__footer small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.store-highlight__footer small {
+  color: rgba(255, 255, 255, 0.7);
+}
+
+.store-highlight__footer button {
+  position: relative;
+  z-index: 4;
+  min-width: 68px;
+  min-height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  border: 0;
+  border-radius: var(--sky-radius-pill);
+  padding: 0 var(--sky-space-3);
+  color: var(--sky-app-accent);
+  background: rgba(255, 255, 255, 0.9);
+  font-weight: 800;
+}
+
+.store-highlight--compact .store-highlight__copy {
+  min-height: 116px;
+}
+
+.store-highlight--compact .store-highlight__copy h2 {
+  max-width: 70%;
+  font-size: 24px;
+}
+
+.store-highlight--compact .store-highlight__art {
+  position: absolute;
+  top: 18px;
+  right: 8px;
+  width: 112px;
+  height: 112px;
+}
+
+.store-highlight--compact .store-highlight__orbit {
+  width: 96px;
+  height: 96px;
+  box-shadow: 0 0 0 18px rgba(255, 255, 255, 0.05);
+}
+
+.store-highlight--compact .store-highlight__art img {
+  width: 72px;
+  height: 72px;
+  border-radius: calc(var(--sky-radius-control) + var(--sky-space-2));
+}
+
+.store-today__edition {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: var(--sky-space-3);
+  border-bottom: 1px solid var(--sky-hairline);
+  padding-bottom: var(--sky-space-3);
+}
+
+.store-today__edition > div {
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.store-today__edition strong {
+  overflow: hidden;
+  color: var(--sky-text);
+  text-overflow: ellipsis;
+  text-transform: capitalize;
+  white-space: nowrap;
+  font-size: 14px;
+}
+
+.store-today__edition > div span {
+  color: var(--sky-muted);
+  font-size: var(--sky-font-caption);
+}
+
+.store-today__edition-badge {
+  height: 28px;
+  display: inline-flex;
+  align-items: center;
+  flex: 0 0 auto;
+  gap: 5px;
+  border: 1px solid var(--sky-hairline);
+  border-radius: var(--sky-radius-pill);
+  padding: 0 var(--sky-space-2);
+  color: var(--sky-app-accent);
+  background: var(--sky-surface);
+  font-size: 10px;
+  font-weight: 800;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.store-today__section-heading {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: var(--sky-space-3);
+  margin-top: var(--sky-space-1);
+}
+
+.store-today__section-heading > div {
+  display: flex;
+  flex-direction: column;
+  gap: 3px;
+}
+
+.store-today__section-heading span {
+  color: var(--sky-app-accent);
+  font-size: 10px;
+  font-weight: 800;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.store-today__section-heading h2 {
+  margin: 0;
+  color: var(--sky-text);
+  font-size: var(--sky-font-medium-title);
+  line-height: 1.08;
+}
+
+.store-today__section-heading > svg {
+  margin-bottom: 2px;
+  color: var(--sky-app-accent);
+}
+
+.store-highlight__texture {
+  position: absolute;
+  inset: 0;
+  opacity: 0.42;
+  background-image:
+    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
+    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
+  background-size: 22px 22px;
+  pointer-events: none;
+}
+
+.store-highlight__spark {
+  position: absolute;
+  z-index: 1;
+  width: 7px;
+  height: 7px;
+  border-radius: 50%;
+  background: #fff;
+  box-shadow: 0 0 14px 4px var(--store-highlight-glow);
+}
+
+.store-highlight__spark--one {
+  top: 18px;
+  right: 24%;
+}
+
+.store-highlight__spark--two {
+  bottom: 34px;
+  left: 22%;
+  width: 4px;
+  height: 4px;
+  opacity: 0.7;
+}
+
+.store-highlight--compact .store-highlight__copy {
+  min-height: 132px;
+}
+
+.store-highlight--compact .store-highlight__copy > span {
+  max-width: 62%;
+  font-size: 12px;
+}
+
+.store-highlight__story-number {
+  min-width: 24px;
+  height: 20px;
+  display: inline-grid;
+  place-items: center;
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  border-radius: var(--sky-radius-pill);
+  color: #fff;
+  background: rgba(0, 0, 0, 0.14);
+  font-size: 9px;
+  letter-spacing: 0;
+}
+
+.store-highlight--reverse {
+  background:
+    radial-gradient(
+      circle at 18% 18%,
+      var(--store-highlight-glow),
+      transparent 34%
+    ),
+    linear-gradient(215deg, var(--store-highlight-background), #10141f 125%);
+}
+
+.store-highlight--reverse .store-highlight__copy {
+  display: flex;
+  align-items: flex-end;
+  flex-direction: column;
+  text-align: right;
+}
+
+.store-highlight--reverse .store-highlight__copy p,
+.store-highlight--reverse .store-highlight__copy h2,
+.store-highlight--reverse .store-highlight__copy > span {
+  max-width: 70%;
+}
+
+.store-highlight--reverse .store-highlight__art {
+  right: auto;
+  left: 8px;
+}
+
+.store-ranking {
+  overflow: hidden;
+  border: 1px solid var(--sky-hairline);
+  border-radius: var(--sky-radius-card);
+  background: var(--sky-surface);
+  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.1);
+}
+
+.store-ranking__header {
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-3);
+  border-bottom: 1px solid var(--sky-hairline);
+  padding: var(--sky-space-4);
+  background: var(--sky-surface-muted);
+}
+
+.store-ranking__icon {
+  width: var(--sky-touch-target);
+  height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  flex: 0 0 var(--sky-touch-target);
+  border-radius: 50%;
+  color: #fff;
+  background: linear-gradient(145deg, #ffb21c, #ff7a00);
+  box-shadow: 0 7px 16px rgba(255, 132, 0, 0.28);
+}
+
+.store-ranking__header h2,
+.store-ranking__header p {
+  margin: 0;
+}
+
+.store-ranking__header h2 {
+  color: var(--sky-text);
+  font-size: 20px;
+}
+
+.store-ranking__header p {
+  margin-top: 2px;
+  color: var(--sky-muted);
+  font-size: 12px;
+}
+
+.store-ranking ol {
+  margin: 0;
+  padding: 0 var(--sky-space-4);
+  list-style: none;
+}
+
+.store-ranking li {
+  min-height: 72px;
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-2);
+  border-bottom: 1px solid var(--sky-hairline);
+}
+
+.store-ranking li:last-child {
+  border-bottom: 0;
+}
+
+.store-ranking__position {
+  width: 16px;
+  flex: 0 0 16px;
+  color: var(--sky-muted);
+  text-align: center;
+  font-size: 15px;
+  font-weight: 800;
+}
+
+.store-ranking__detail-link {
+  min-width: 0;
+  min-height: 72px;
+  display: flex;
+  align-items: center;
+  flex: 1;
+  gap: var(--sky-space-2);
+  border: 0;
+  padding: 0;
+  color: inherit;
+  background: transparent;
+  text-align: left;
+  transition: transform 100ms ease;
+}
+
+.store-ranking__detail-link:focus-visible {
+  border-radius: var(--sky-radius-control);
+  outline: 2px solid var(--sky-app-accent);
+  outline-offset: -2px;
+}
+
+.store-ranking__detail-link > img {
+  width: 48px;
+  height: 48px;
+  flex: 0 0 48px;
+  border-radius: calc(var(--sky-radius-control) + var(--sky-space-1));
+  object-fit: cover;
+}
+
+.store-ranking__details {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+}
+
+.store-ranking__details strong,
+.store-ranking__details small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.store-ranking__details small {
+  color: var(--sky-muted);
+  font-size: 11px;
+}
+
+.store-ranking li > button:not(.store-ranking__detail-link),
+.store-final-pick > button:not(.store-highlight__detail-link) {
+  min-width: 62px;
+  min-height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  border: 0;
+  border-radius: var(--sky-radius-pill);
+  padding: 0 var(--sky-space-2);
+  color: var(--sky-app-accent);
+  background: var(--sky-surface-muted);
+  font-size: 12px;
+  font-weight: 800;
+}
+
+.store-final-pick {
+  position: relative;
+  min-height: 150px;
+  display: grid;
+  align-items: center;
+  grid-template-columns: 1fr auto;
+  gap: var(--sky-space-3);
+  overflow: hidden;
+  border-radius: var(--sky-radius-card);
+  padding: var(--sky-space-5);
+  color: #fff;
+  background: linear-gradient(
+    145deg,
+    var(--store-highlight-background),
+    #111826
+  );
+  transition:
+    box-shadow 100ms ease,
+    transform 100ms ease;
+}
+
+.store-final-pick__glow {
+  position: absolute;
+  top: -70px;
+  right: -50px;
+  width: 190px;
+  height: 190px;
+  border-radius: 50%;
+  background: var(--store-highlight-glow);
+  opacity: 0.42;
+  filter: blur(30px);
+}
+
+.store-final-pick__heading {
+  position: relative;
+  z-index: 1;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+}
+
+.store-final-pick__heading span {
+  color: rgba(255, 255, 255, 0.72);
+  font-size: 10px;
+  font-weight: 800;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+}
+
+.store-final-pick__heading strong {
+  margin-top: 6px;
+  font-size: 22px;
+  line-height: 1.05;
+}
+
+.store-final-pick__heading small {
+  margin-top: 7px;
+  color: rgba(255, 255, 255, 0.7);
+  font-size: 12px;
+}
+
+.store-final-pick > img {
+  position: relative;
+  z-index: 1;
+  width: 76px;
+  height: 76px;
+  border-radius: calc(var(--sky-radius-card) - var(--sky-space-2));
+  object-fit: cover;
+  filter: drop-shadow(0 12px 15px rgba(0, 0, 0, 0.32));
+  transform: rotate(4deg);
+}
+
+.store-final-pick > button:not(.store-highlight__detail-link) {
+  position: relative;
+  z-index: 4;
+  grid-column: 1 / -1;
+  color: #fff;
+  background: rgba(255, 255, 255, 0.18);
+}
+
+:global(.phone-app--performance) .store-highlight,
+:global(.phone-app--performance) .store-ranking,
+:global(.phone-app--performance) .store-final-pick {
+  box-shadow: none;
+}
+
+:global(.phone-app--performance) .store-final-pick__glow,
+:global(.phone-app--performance) .store-highlight__texture {
+  display: none;
+}
+
+:global(.phone-app--performance) .store-highlight__art img,
+:global(.phone-app--performance) .store-final-pick > img {
+  filter: none;
+}
+
+@media (hover: hover) and (pointer: fine) {
+  .store-highlight:has(.store-highlight__detail-link:hover),
+  .store-final-pick:has(.store-highlight__detail-link:hover) {
+    box-shadow: 0 17px 32px rgba(0, 0, 0, 0.24);
+    transform: translateY(-1px);
+  }
+}
+
+.store-browse {
+  display: grid;
+  gap: var(--sky-space-4);
+  padding-bottom: var(--sky-space-5);
+}
+
+.store-browse-feature {
+  position: relative;
+  min-height: 354px;
+  overflow: hidden;
+  border-radius: var(--sky-radius-card);
+  color: #fff;
+  background:
+    radial-gradient(
+      circle at 78% 18%,
+      var(--store-highlight-glow),
+      transparent 38%
+    ),
+    linear-gradient(150deg, var(--store-highlight-background), #0e1421 125%);
+  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
+}
+
+.store-browse-feature__texture {
+  position: absolute;
+  inset: 0;
+  opacity: 0.45;
+  background:
+    linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, 0.08)),
+    repeating-linear-gradient(
+      -32deg,
+      transparent 0,
+      transparent 16px,
+      rgba(255, 255, 255, 0.025) 17px,
+      rgba(255, 255, 255, 0.025) 18px
+    );
+  pointer-events: none;
+}
+
+.store-browse-feature__copy {
+  position: relative;
+  z-index: 2;
+  min-height: 112px;
+  padding: var(--sky-space-5) var(--sky-space-5) 0;
+}
+
+.store-browse-feature__copy span {
+  color: #55b6ff;
+  font-size: 10px;
+  font-weight: 850;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.store-browse-feature__copy h2,
+.store-browse-feature__copy p {
+  margin: 0;
+}
+
+.store-browse-feature__copy h2 {
+  max-width: 94%;
+  margin-top: 6px;
+  font-size: 27px;
+  line-height: 1.04;
+}
+
+.store-browse-feature__copy p {
+  margin-top: 6px;
+  color: rgba(255, 255, 255, 0.68);
+  font-size: 12px;
+}
+
+.store-browse-feature__art {
+  position: relative;
+  height: 166px;
+  display: grid;
+  place-items: center;
+}
+
+.store-browse-feature__art > span {
+  position: absolute;
+  width: 210px;
+  height: 125px;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.1);
+  box-shadow:
+    0 0 0 22px rgba(255, 255, 255, 0.04),
+    0 18px 40px rgba(0, 0, 0, 0.22);
+  transform: rotate(-8deg);
+}
+
+.store-browse-feature__art > svg {
+  position: absolute;
+  color: rgba(255, 255, 255, 0.14);
+  transform: translate(58px, -14px) rotate(12deg);
+}
+
+.store-browse-feature__art > img {
+  position: relative;
+  z-index: 1;
+  width: 118px;
+  height: 118px;
+  border-radius: calc(var(--sky-radius-card) - var(--sky-space-1));
+  object-fit: cover;
+  filter: drop-shadow(0 16px 18px rgba(0, 0, 0, 0.36));
+  transform: translateX(-28px) rotate(-5deg);
+}
+
+.store-browse-feature footer {
+  position: relative;
+  z-index: 2;
+  min-height: 76px;
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-3);
+  padding: var(--sky-space-3) var(--sky-space-4);
+  background: rgba(0, 0, 0, 0.25);
+}
+
+.store-browse-feature footer > img {
+  width: 46px;
+  height: 46px;
+  flex: 0 0 46px;
+  border-radius: calc(var(--sky-radius-control) + var(--sky-space-1));
+  object-fit: cover;
+}
+
+.store-browse-feature__details {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  align-items: flex-start;
+  border: 0;
+  padding: 0;
+  color: inherit;
+  background: transparent;
+  text-align: left;
+}
+
+.store-browse-feature footer strong,
+.store-browse-feature footer small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.store-browse-feature__details:focus-visible,
+.store-list__detail-link:focus-visible,
+.store-search__detail-link:focus-visible {
+  outline: 2px solid var(--sky-app-accent);
+  outline-offset: 2px;
+}
+
+.store-browse-feature footer small {
+  color: rgba(255, 255, 255, 0.66);
+  font-size: 10px;
+}
+
+.store-browse-feature footer button:not(.store-browse-feature__details) {
+  min-width: 68px;
+  min-height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  border: 0;
+  border-radius: var(--sky-radius-pill);
+  padding: 0 var(--sky-space-3);
+  color: var(--sky-app-accent);
+  background: rgba(255, 255, 255, 0.92);
+  font-size: 12px;
+  font-weight: 850;
+}
+
+.store-featured-enter-active,
+.store-featured-leave-active {
+  transition:
+    opacity var(--sky-transition-normal) var(--sky-ease-out),
+    transform var(--sky-transition-normal) var(--sky-ease-out);
+}
+
+.store-featured-enter-from {
+  opacity: 0;
+  transform: translateX(16px);
+}
+
+.store-featured-leave-to {
+  opacity: 0;
+  transform: translateX(-16px);
+}
+
+.store-browse__pages {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0;
+  margin: calc(0px - var(--sky-space-4)) 0 calc(0px - var(--sky-space-3));
+}
+
+.store-browse__pages button {
+  position: relative;
+  width: var(--sky-touch-target);
+  height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  border: 0;
+  padding: 0;
+  background: transparent;
+}
+
+.store-browse__pages button::after {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: var(--sky-subtle);
+  content: '';
+  transition:
+    width var(--sky-transition-fast) var(--sky-ease-out),
+    background var(--sky-transition-fast) var(--sky-ease-out);
+}
+
+.store-browse__pages button.is-active::after {
+  width: 18px;
+  border-radius: var(--sky-radius-pill);
+  background: var(--sky-app-accent);
+}
+
+.store-browse__list-heading {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: var(--sky-space-3);
+  margin-top: var(--sky-space-2);
+}
+
+.store-browse__list-heading > div {
+  min-width: 0;
+}
+
+.store-browse__list-heading span {
+  color: var(--sky-app-accent);
+  font-size: 10px;
+  font-weight: 800;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.store-browse__list-heading h2 {
+  margin: 2px 0 0;
+  color: var(--sky-text);
+  font-size: var(--sky-font-medium-title);
+  line-height: 1.08;
+}
+
+.store-browse__list-heading > strong {
+  min-width: 28px;
+  height: 28px;
+  display: grid;
+  place-items: center;
+  border-radius: var(--sky-radius-pill);
+  color: var(--sky-muted);
+  background: var(--sky-surface-variant);
+  font-size: 11px;
+}
+
+.store-list--browse {
+  overflow: hidden;
+  border: 1px solid var(--sky-hairline);
+  border-radius: var(--sky-radius-card);
+  background: var(--sky-surface);
+}
+
+.store-list--browse article {
+  min-height: 76px;
+  padding: var(--sky-space-3) var(--sky-space-4);
+}
+
+.store-list--browse article:last-of-type {
+  border-bottom: 0;
+}
+
+.store-list--browse .store-icon {
+  width: 52px;
+  height: 52px;
+  flex-basis: 52px;
+  border-radius: calc(var(--sky-radius-control) + var(--sky-space-1));
+}
+
+.store-list--browse small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: 11px;
+}
+
+:global(.phone-app--performance) .store-browse-feature {
+  box-shadow: none;
+}
+
+:global(.phone-app--performance) .store-browse-feature__texture {
+  display: none;
+}
+
+:global(.phone-app--performance) .store-browse-feature__art > img {
+  filter: none;
+}
+
+.app-store-navbar :deep(.sky-navbar__subnavbar .sky-searchbar__control) {
+  border-color: var(--sky-hairline);
+  background: var(--sky-surface-variant);
+}
+
+.app-store-navbar :deep(.sky-navbar__subnavbar .sky-searchbar__input) {
+  font-size: 15px;
+  font-weight: 600;
+}
+
+.app-store-navbar :deep(.sky-navbar__subnavbar .sky-searchbar__suffix) {
+  color: var(--sky-text);
+}
+
+.store-search {
+  display: grid;
+  gap: var(--sky-space-6);
+  padding-bottom: var(--sky-space-6);
+}
+
+.store-search__section,
+.store-search__results {
+  min-width: 0;
+}
+
+.store-search__heading {
+  min-height: var(--sky-touch-target);
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-1);
+  color: var(--sky-text);
+}
+
+.store-search__heading h2 {
+  margin: 0;
+  font-size: var(--sky-font-medium-title);
+  line-height: 1.08;
+}
+
+.store-search__heading > div {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--sky-space-3);
+}
+
+.store-search__heading > div > span {
+  min-width: 28px;
+  height: 28px;
+  display: grid;
+  place-items: center;
+  border-radius: var(--sky-radius-pill);
+  color: var(--sky-muted);
+  background: var(--sky-surface-variant);
+  font-size: 11px;
+  font-weight: 800;
+}
+
+.store-search__recommendations {
+  overflow: hidden;
+  border-bottom: 1px solid var(--sky-hairline);
+}
+
+.store-search__recommendations article {
+  min-height: 82px;
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-3);
+  border-top: 1px solid var(--sky-hairline);
+  padding: var(--sky-space-3) 0;
+}
+
+.store-search__recommendations article:first-child {
+  border-top: 0;
+}
+
+.store-search__recommendations article.store-search__recommendation--promoted {
+  margin-bottom: var(--sky-space-2);
+  border: 1px solid rgba(117, 151, 218, 0.22);
+  border-radius: var(--sky-radius-card);
+  padding: var(--sky-space-3);
+  background: linear-gradient(
+    115deg,
+    rgba(90, 121, 181, 0.22),
+    var(--sky-surface)
+  );
+}
+
+.store-search__recommendations img {
+  width: 58px;
+  height: 58px;
+  flex: 0 0 58px;
+  border-radius: calc(var(--sky-radius-control) + var(--sky-space-1));
+  object-fit: cover;
+}
+
+.store-search__detail-link {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  align-items: center;
+  gap: var(--sky-space-3);
+  border: 0;
+  padding: 0;
+  color: inherit;
+  background: transparent;
+  text-align: left;
+}
+
+.store-search__detail-link > span {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.store-search__recommendations strong,
+.store-search__recommendations small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.store-search__recommendations strong {
+  font-size: 15px;
+}
+
+.store-search__recommendations small {
+  color: var(--sky-muted);
+  font-size: 11px;
+}
+
+.store-search__recommendations em {
+  width: max-content;
+  margin-top: 2px;
+  border-radius: 4px;
+  padding: 2px 5px;
+  color: #fff;
+  background: #72aaf5;
+  font-size: 9px;
+  font-weight: 800;
+  font-style: normal;
+}
+
+.store-search__recommendations
+  article
+  > button:not(.store-search__detail-link) {
+  min-width: 68px;
+  min-height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  border: 0;
+  border-radius: var(--sky-radius-pill);
+  padding: 0 var(--sky-space-3);
+  color: var(--sky-app-accent);
+  background: var(--sky-surface-muted);
+  font-size: 12px;
+  font-weight: 850;
+}
+
+.store-search__discover {
+  margin-top: calc(0px - var(--sky-space-2));
+}
+
+.store-search__discover-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: var(--sky-space-3);
+}
+
+.store-search__discover-grid > button {
+  min-width: 0;
+  min-height: 124px;
+  position: relative;
+  display: flex;
+  overflow: hidden;
+  flex-direction: column;
+  justify-content: flex-end;
+  border: 0;
+  border-radius: var(--sky-radius-card);
+  padding: var(--sky-space-4);
+  color: #fff;
+  background:
+    radial-gradient(
+      circle at 80% 18%,
+      rgba(255, 255, 255, 0.36),
+      transparent 34%
+    ),
+    var(--store-search-tile);
+  text-align: left;
+  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
+}
+
+.store-search__discover-grid > button::before {
+  width: 68px;
+  height: 68px;
+  position: absolute;
+  top: -16px;
+  right: -8px;
+  border: 12px solid rgba(255, 255, 255, 0.1);
+  border-radius: 50%;
+  content: '';
+}
+
+.store-search__discover-grid svg {
+  position: absolute;
+  top: var(--sky-space-3);
+  right: var(--sky-space-3);
+  color: rgba(255, 255, 255, 0.5);
+  filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.12));
+}
+
+.store-search__discover-grid span,
+.store-search__discover-grid small {
+  position: relative;
+  z-index: 1;
+}
+
+.store-search__discover-grid span {
+  max-width: 92%;
+  font-size: 18px;
+  font-weight: 800;
+  line-height: 1.05;
+}
+
+.store-search__discover-grid small {
+  margin-top: 5px;
+  overflow: hidden;
+  color: rgba(255, 255, 255, 0.72);
+  font-size: 10px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+:global(.phone-app--performance) .store-search__discover-grid > button {
+  background: var(--store-search-tile);
+  box-shadow: none;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .store-featured-enter-active,
+  .store-featured-leave-active,
+  .store-browse__pages button {
+    transition: none;
+  }
+}
+
 .store-list {
   padding: 0;
 }
 
+.store-list__detail-link {
+  min-width: 0;
+  min-height: 60px;
+  display: flex;
+  align-items: center;
+  flex: 1;
+  gap: var(--sky-space-3);
+  border: 0;
+  padding: 0;
+  color: inherit;
+  background: transparent;
+  text-align: left;
+}
+
+.store-list__detail-link > span {
+  min-width: 0;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+}
+
+.store-list__detail-link strong,
+.store-list__detail-link small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .store-list article {
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-3);
   border-color: var(--sky-hairline);
 }
 
@@ -224,12 +2591,33 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
   color: var(--sky-muted);
 }
 
-.store-list article > button {
+.store-list article > button:not(.store-list__detail-link) {
+  min-width: 68px;
   min-height: var(--sky-touch-target);
+  flex: 0 0 auto;
   color: var(--sky-app-accent);
   background: var(--sky-surface-muted);
 }
 
+.store-highlight__footer :deep(button:has(.app-store-action--icon)),
+.store-ranking li > :deep(button:has(.app-store-action--icon)),
+.store-final-pick > :deep(button:has(.app-store-action--icon)),
+.store-browse-feature footer > :deep(button:has(.app-store-action--icon)),
+.store-search__recommendations
+  article
+  > :deep(button:has(.app-store-action--icon)),
+.store-list
+  article
+  > :deep(button:not(.store-list__detail-link):has(.app-store-action--icon)) {
+  width: var(--sky-touch-target);
+  min-width: var(--sky-touch-target);
+  padding: 0;
+  border-color: transparent;
+  color: var(--sky-app-accent);
+  background: transparent;
+  box-shadow: none;
+}
+
 .store-installing {
   color: var(--sky-app-accent);
 }
@@ -242,4 +2630,38 @@ function handleApp(app: LaunchablePhoneAppDefinition): void {
   gap: 2px;
   line-height: 1;
 }
+
+@media (hover: hover) and (pointer: fine) {
+  .app-store-page
+    :deep(button:not(.store-ranking__detail-link):not(:disabled):hover) {
+    filter: brightness(1.08);
+    transform: translateY(-1px);
+  }
+
+  .app-store-page :deep(button:not(:disabled):active) {
+    filter: brightness(0.98);
+    transform: scale(0.97);
+  }
+
+  .app-store-page :deep(button:has(.app-store-action--icon):hover) {
+    filter: brightness(1.16)
+      drop-shadow(
+        0 3px 7px color-mix(in srgb, var(--sky-app-accent) 28%, transparent)
+      );
+  }
+
+  .store-account__primary-action:not(:disabled):hover {
+    background: var(--sky-app-accent-soft);
+  }
+
+  .store-account__remove:not(:disabled):hover {
+    background: color-mix(in srgb, var(--sky-danger) 22%, transparent);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .app-store-page :deep(button) {
+    transition: none;
+  }
+}
 </style>
diff --git a/frontend/src/views/apps/AppStoreDetail.contract.test.ts b/frontend/src/views/apps/AppStoreDetail.contract.test.ts
new file mode 100644
index 0000000..15f7c43
--- /dev/null
+++ b/frontend/src/views/apps/AppStoreDetail.contract.test.ts
@@ -0,0 +1,51 @@
+import { readFileSync } from 'node:fs'
+import { fileURLToPath } from 'node:url'
+
+import { describe, expect, it } from 'vitest'
+
+const source = readFileSync(
+  fileURLToPath(new URL('./AppStoreDetail.vue', import.meta.url)),
+  'utf8',
+)
+
+describe('AppStoreDetail contract', () => {
+  it('renders an Apple-style product page with metadata and direct action', () => {
+    expect(source).toContain('class="store-detail__toolbar"')
+    expect(source).toContain('class="store-detail__hero"')
+    expect(source).toContain('class="store-detail__facts"')
+    expect(source).toContain('class="store-detail__whats-new"')
+    expect(source).toContain("emit('action')")
+    expect(source).toContain("emit('back')")
+    expect(source).toContain("emit('share')")
+    expect(source).toContain('<AppStoreAction :action="action" />')
+    expect(source).toMatch(
+      /\.store-detail\s*\{[^}]*padding:\s*var\(--sky-space-3\) 0 var\(--sky-space-6\)/s,
+    )
+  })
+
+  it('generates three app-specific preview panels with visible test data', () => {
+    expect(source).toContain('class="store-detail__previews"')
+    expect(source).toContain('store-detail-preview--overview')
+    expect(source).toContain('store-detail-preview--community')
+    expect(source).toContain('store-detail-preview--insights')
+    expect(
+      source.match(/:src="app\.iconImage"/g)?.length,
+    ).toBeGreaterThanOrEqual(4)
+    expect(source).toContain('24')
+    expect(source).toContain('87%')
+    expect(source).toContain('+18%')
+    expect(source).toMatch(
+      /\.store-detail-preview\s*\{[^}]*width:\s*224px[^}]*height:\s*354px/s,
+    )
+  })
+
+  it('provides accessible previous and next controls for the preview gallery', () => {
+    expect(source).toContain('ref="previews"')
+    expect(source).toContain('@scroll.passive="updateActivePreview"')
+    expect(source).toContain('scrollToPreview(activePreviewIndex - 1)')
+    expect(source).toContain('scrollToPreview(activePreviewIndex + 1)')
+    expect(source).toContain('details.previousPreview')
+    expect(source).toContain('details.nextPreview')
+    expect(source).toContain('.store-detail__toolbar button:hover')
+  })
+})
diff --git a/frontend/src/views/apps/AppStoreDetail.vue b/frontend/src/views/apps/AppStoreDetail.vue
new file mode 100644
index 0000000..41318d4
--- /dev/null
+++ b/frontend/src/views/apps/AppStoreDetail.vue
@@ -0,0 +1,760 @@
+<script setup lang="ts">
+import {
+  Activity,
+  BarChart3,
+  ChevronLeft,
+  ChevronRight,
+  Share2,
+  Sparkles,
+  Star,
+  Users,
+} from 'lucide-vue-next'
+import { computed, ref } from 'vue'
+
+import { getPhoneAppLabel, isExternalPhoneApp } from '@/config/apps'
+import { usePhoneStore } from '@/stores/phone'
+import type { LaunchablePhoneAppDefinition } from '@/types/apps'
+
+import AppStoreAction from './AppStoreAction.vue'
+
+const props = defineProps<{
+  action: 'get' | 'installing' | 'open'
+  app: LaunchablePhoneAppDefinition
+}>()
+
+const emit = defineEmits<{
+  action: []
+  back: []
+  share: []
+}>()
+
+const phone = usePhoneStore()
+const previews = ref<HTMLElement | null>(null)
+const activePreviewIndex = ref(0)
+const previewCount = 3
+const appName = computed(() => getPhoneAppLabel(props.app, phone.t))
+const developer = computed(() =>
+  isExternalPhoneApp(props.app)
+    ? props.app.developer
+    : phone.t('Apps.appStore.details.skyStudios'),
+)
+const rating = computed(() => (4.4 + (props.app.gridOrder % 5) / 10).toFixed(1))
+const ratingCount = computed(() =>
+  new Intl.NumberFormat(phone.lang, { notation: 'compact' }).format(
+    12400 + props.app.gridOrder * 1371,
+  ),
+)
+const ageRating = computed(() =>
+  props.app.category === 'games' ? '12+' : '4+',
+)
+const chartRank = computed(() => `#${(props.app.gridOrder % 8) + 1}`)
+const version = computed(
+  () => `1.${(props.app.gridOrder % 9) + 1}.${props.app.gridOrder % 5}`,
+)
+const detailStyle = computed(() => {
+  const palettes = [
+    ['#2365d8', '#69c7ff'],
+    ['#7a42c2', '#d19dff'],
+    ['#0b8a78', '#60e2c0'],
+    ['#cf5b35', '#ffc06b'],
+    ['#4057b3', '#9baaff'],
+  ] as const
+  const palette = palettes[props.app.gridOrder % palettes.length]!
+  return {
+    '--store-detail-accent': palette[0],
+    '--store-detail-glow': palette[1],
+  }
+})
+
+function scrollToPreview(index: number): void {
+  const row = previews.value
+  if (!row) return
+  const cards = Array.from(
+    row.querySelectorAll<HTMLElement>('.store-detail-preview'),
+  )
+  const nextIndex = Math.min(cards.length - 1, Math.max(0, index))
+  const card = cards[nextIndex]
+  if (!card) return
+  activePreviewIndex.value = nextIndex
+  row.scrollTo({
+    behavior: 'smooth',
+    left: card.offsetLeft - row.offsetLeft,
+  })
+}
+
+function updateActivePreview(): void {
+  const row = previews.value
+  if (!row) return
+  const cards = Array.from(
+    row.querySelectorAll<HTMLElement>('.store-detail-preview'),
+  )
+  activePreviewIndex.value = cards.reduce((closestIndex, card, index) => {
+    const closest = cards[closestIndex]
+    if (!closest) return index
+    const distance = Math.abs(card.offsetLeft - row.offsetLeft - row.scrollLeft)
+    const closestDistance = Math.abs(
+      closest.offsetLeft - row.offsetLeft - row.scrollLeft,
+    )
+    return distance < closestDistance ? index : closestIndex
+  }, 0)
+}
+</script>
+
+<template>
+  <section class="store-detail" :style="detailStyle">
+    <header class="store-detail__toolbar">
+      <button
+        type="button"
+        :aria-label="phone.t('Common.back')"
+        @click="emit('back')"
+      >
+        <ChevronLeft :size="26" :stroke-width="2.2" aria-hidden="true" />
+      </button>
+      <button
+        type="button"
+        :aria-label="phone.t('Apps.appStore.details.share')"
+        @click="emit('share')"
+      >
+        <Share2 :size="21" :stroke-width="2" aria-hidden="true" />
+      </button>
+    </header>
+
+    <section class="store-detail__hero">
+      <img :src="app.iconImage" alt="" draggable="false" />
+      <div>
+        <h1>{{ appName }}</h1>
+        <p>{{ developer }}</p>
+        <button
+          type="button"
+          :disabled="action === 'installing'"
+          @click="emit('action')"
+        >
+          <AppStoreAction :action="action" />
+        </button>
+      </div>
+    </section>
+
+    <dl class="store-detail__facts">
+      <div>
+        <dt>
+          {{ phone.t('Apps.appStore.details.ratings', { count: ratingCount }) }}
+        </dt>
+        <dd>{{ rating }}</dd>
+        <span class="store-detail__stars" aria-hidden="true">
+          <Star v-for="star in 5" :key="star" :size="11" fill="currentColor" />
+        </span>
+      </div>
+      <div>
+        <dt>{{ phone.t('Apps.appStore.details.age') }}</dt>
+        <dd>{{ ageRating }}</dd>
+        <span>{{ phone.t('Apps.appStore.details.years') }}</span>
+      </div>
+      <div>
+        <dt>{{ phone.t('Apps.appStore.details.chart') }}</dt>
+        <dd>{{ chartRank }}</dd>
+        <span>{{ phone.t(`Home.groups.${app.category}`) }}</span>
+      </div>
+    </dl>
+
+    <section class="store-detail__whats-new">
+      <header>
+        <h2>{{ phone.t('Apps.appStore.details.whatsNew') }}</h2>
+        <ChevronRight :size="22" :stroke-width="2.4" aria-hidden="true" />
+      </header>
+      <div class="store-detail__version">
+        <span>{{ phone.t('Apps.appStore.details.version', { version }) }}</span>
+        <span>{{ phone.t('Apps.appStore.details.updatedToday') }}</span>
+      </div>
+      <p>
+        {{
+          phone.t('Apps.appStore.details.releaseNotes', {
+            app: appName,
+          })
+        }}
+      </p>
+    </section>
+
+    <section class="store-detail__preview-section">
+      <header>
+        <h2>{{ phone.t('Apps.appStore.details.preview') }}</h2>
+        <div class="store-detail__preview-navigation">
+          <span>{{ activePreviewIndex + 1 }} / {{ previewCount }}</span>
+          <button
+            type="button"
+            :aria-label="phone.t('Apps.appStore.details.previousPreview')"
+            :disabled="activePreviewIndex === 0"
+            @click="scrollToPreview(activePreviewIndex - 1)"
+          >
+            <ChevronLeft :size="17" :stroke-width="2.4" aria-hidden="true" />
+          </button>
+          <button
+            type="button"
+            :aria-label="phone.t('Apps.appStore.details.nextPreview')"
+            :disabled="activePreviewIndex === previewCount - 1"
+            @click="scrollToPreview(activePreviewIndex + 1)"
+          >
+            <ChevronRight :size="17" :stroke-width="2.4" aria-hidden="true" />
+          </button>
+        </div>
+      </header>
+      <div
+        ref="previews"
+        class="store-detail__previews"
+        @scroll.passive="updateActivePreview"
+      >
+        <article class="store-detail-preview store-detail-preview--overview">
+          <div class="store-detail-preview__status">
+            <span>{{ phone.t('Apps.appStore.details.previewLive') }}</span>
+            <Activity :size="14" aria-hidden="true" />
+          </div>
+          <img :src="app.iconImage" alt="" draggable="false" />
+          <strong>{{ appName }}</strong>
+          <small>{{ phone.t('Apps.appStore.details.previewOverview') }}</small>
+          <div class="store-detail-preview__metrics">
+            <span><b>24</b>{{ phone.t('Apps.appStore.details.today') }}</span>
+            <span
+              ><b>87%</b>{{ phone.t('Apps.appStore.details.progress') }}</span
+            >
+          </div>
+          <div class="store-detail-preview__activity">
+            <span></span><span></span><span></span><span></span><span></span>
+          </div>
+        </article>
+
+        <article class="store-detail-preview store-detail-preview--community">
+          <div class="store-detail-preview__status">
+            <span>{{ phone.t('Apps.appStore.details.previewCommunity') }}</span>
+            <Users :size="14" aria-hidden="true" />
+          </div>
+          <div class="store-detail-preview__avatars">
+            <span>AM</span><span>JS</span><span>RK</span>
+          </div>
+          <strong>{{
+            phone.t('Apps.appStore.details.communityTitle', { app: appName })
+          }}</strong>
+          <small>{{ phone.t('Apps.appStore.details.communityBody') }}</small>
+          <div class="store-detail-preview__message">
+            <Sparkles :size="15" aria-hidden="true" />
+            <span>{{ phone.t('Apps.appStore.details.featuredMoment') }}</span>
+          </div>
+          <img :src="app.iconImage" alt="" draggable="false" />
+        </article>
+
+        <article class="store-detail-preview store-detail-preview--insights">
+          <div class="store-detail-preview__status">
+            <span>{{ phone.t('Apps.appStore.details.previewInsights') }}</span>
+            <BarChart3 :size="14" aria-hidden="true" />
+          </div>
+          <strong>{{ phone.t('Apps.appStore.details.weeklyActivity') }}</strong>
+          <div class="store-detail-preview__chart" aria-hidden="true">
+            <span
+              v-for="height in [38, 64, 48, 82, 56, 92, 73]"
+              :key="height"
+              :style="{ height: `${height}%` }"
+            ></span>
+          </div>
+          <div class="store-detail-preview__insight">
+            <b>+18%</b>
+            <span>{{ phone.t('Apps.appStore.details.fromLastWeek') }}</span>
+          </div>
+          <img :src="app.iconImage" alt="" draggable="false" />
+        </article>
+      </div>
+    </section>
+
+    <section class="store-detail__description">
+      <h2>{{ phone.t('Apps.appStore.details.about') }}</h2>
+      <p>
+        {{
+          phone.t('Apps.appStore.details.description', {
+            app: appName,
+            category: phone.t(`Home.groups.${app.category}`),
+          })
+        }}
+      </p>
+    </section>
+  </section>
+</template>
+
+<style scoped>
+.store-detail {
+  width: 100%;
+  min-width: 0;
+  display: grid;
+  overflow-x: hidden;
+  gap: var(--sky-space-5);
+  padding: var(--sky-space-3) 0 var(--sky-space-6);
+  color: var(--sky-text);
+}
+
+.store-detail__preview-section {
+  min-width: 0;
+}
+
+.store-detail__toolbar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.store-detail__toolbar button {
+  width: var(--sky-touch-target);
+  height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  border: 1px solid var(--sky-hairline);
+  border-radius: 50%;
+  color: var(--sky-text);
+  background: var(--sky-surface-variant);
+  transition:
+    background-color 100ms ease,
+    border-color 100ms ease,
+    box-shadow 100ms ease,
+    transform 100ms ease;
+}
+
+.store-detail__toolbar button:active {
+  transform: scale(0.94);
+}
+
+.store-detail__hero {
+  display: grid;
+  grid-template-columns: 116px minmax(0, 1fr);
+  align-items: center;
+  gap: var(--sky-space-4);
+}
+
+.store-detail__hero > img {
+  width: 116px;
+  height: 116px;
+  border-radius: calc(var(--sky-radius-card) + var(--sky-space-1));
+  object-fit: cover;
+  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
+}
+
+.store-detail__hero > div {
+  min-width: 0;
+}
+
+.store-detail__hero h1 {
+  margin: 0;
+  overflow: hidden;
+  color: var(--sky-text);
+  font-size: 24px;
+  line-height: 1.02;
+  text-overflow: ellipsis;
+}
+
+.store-detail__hero p {
+  margin: 6px 0 12px;
+  overflow: hidden;
+  color: var(--sky-muted);
+  font-size: 13px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.store-detail__hero button {
+  min-width: 72px;
+  min-height: var(--sky-touch-target);
+  display: grid;
+  place-items: center;
+  border: 0;
+  border-radius: var(--sky-radius-pill);
+  padding: 0 var(--sky-space-4);
+  color: #fff;
+  background: var(--sky-app-accent);
+  font-size: 12px;
+  font-weight: 850;
+}
+
+.store-detail__hero button:has(.app-store-action--icon) {
+  width: var(--sky-touch-target);
+  min-width: var(--sky-touch-target);
+  padding: 0;
+  color: var(--sky-app-accent);
+  background: transparent;
+}
+
+.store-detail__facts {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  margin: 0;
+  border-top: 1px solid var(--sky-hairline);
+  border-bottom: 1px solid var(--sky-hairline);
+  padding: var(--sky-space-3) 0;
+}
+
+.store-detail__facts > div {
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  border-right: 1px solid var(--sky-hairline);
+  text-align: center;
+}
+
+.store-detail__facts > div:last-child {
+  border-right: 0;
+}
+
+.store-detail__facts dt {
+  overflow: hidden;
+  color: var(--sky-muted);
+  font-size: 9px;
+  font-weight: 800;
+  letter-spacing: 0.04em;
+  text-overflow: ellipsis;
+  text-transform: uppercase;
+  white-space: nowrap;
+}
+
+.store-detail__facts dd {
+  margin: 5px 0 0;
+  color: var(--sky-text);
+  font-size: 24px;
+  font-weight: 700;
+}
+
+.store-detail__facts span {
+  max-width: 100%;
+  overflow: hidden;
+  color: var(--sky-muted);
+  font-size: 10px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.store-detail__facts .store-detail__stars {
+  display: flex;
+  color: var(--sky-muted);
+}
+
+.store-detail__whats-new,
+.store-detail__description {
+  border-bottom: 1px solid var(--sky-hairline);
+  padding-bottom: var(--sky-space-5);
+}
+
+.store-detail__whats-new header,
+.store-detail__preview-section > header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--sky-space-2);
+}
+
+.store-detail__whats-new h2,
+.store-detail__preview-section h2,
+.store-detail__description h2 {
+  margin: 0;
+  font-size: var(--sky-font-medium-title);
+}
+
+.store-detail__version {
+  display: flex;
+  justify-content: space-between;
+  gap: var(--sky-space-3);
+  margin-top: var(--sky-space-3);
+  color: var(--sky-muted);
+  font-size: 11px;
+}
+
+.store-detail__whats-new p,
+.store-detail__description p {
+  margin: var(--sky-space-3) 0 0;
+  color: var(--sky-text);
+  font-size: 13px;
+  line-height: 1.45;
+}
+
+.store-detail__preview-navigation {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+}
+
+.store-detail__preview-navigation > span {
+  min-width: 30px;
+  color: var(--sky-muted);
+  font-size: 9px;
+  font-weight: 700;
+  text-align: center;
+}
+
+.store-detail__preview-navigation button {
+  width: 30px;
+  height: 30px;
+  display: grid;
+  place-items: center;
+  border: 1px solid var(--sky-hairline);
+  border-radius: 50%;
+  padding: 0;
+  color: var(--sky-text);
+  background: var(--sky-surface-variant);
+  transition:
+    background-color 100ms ease,
+    color 100ms ease,
+    transform 100ms ease;
+}
+
+.store-detail__preview-navigation button:disabled {
+  opacity: 0.34;
+}
+
+.store-detail__preview-navigation button:active:not(:disabled) {
+  transform: scale(0.92);
+}
+
+.store-detail__previews {
+  display: flex;
+  gap: var(--sky-space-3);
+  margin-right: calc(0px - var(--sky-page-gutter));
+  overflow-x: auto;
+  padding: var(--sky-space-3) var(--sky-page-gutter) var(--sky-space-2) 0;
+  scroll-snap-type: x mandatory;
+  scrollbar-width: none;
+}
+
+.store-detail__previews::-webkit-scrollbar {
+  display: none;
+}
+
+.store-detail-preview {
+  width: 224px;
+  height: 354px;
+  position: relative;
+  display: flex;
+  overflow: hidden;
+  flex: 0 0 224px;
+  flex-direction: column;
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  border-radius: var(--sky-radius-card);
+  padding: var(--sky-space-4);
+  color: #fff;
+  background:
+    radial-gradient(
+      circle at 78% 12%,
+      var(--store-detail-glow),
+      transparent 32%
+    ),
+    linear-gradient(155deg, var(--store-detail-accent), #101523 118%);
+  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
+  scroll-snap-align: start;
+}
+
+.store-detail-preview::after {
+  position: absolute;
+  inset: 0;
+  background: repeating-linear-gradient(
+    -35deg,
+    transparent 0 20px,
+    rgba(255, 255, 255, 0.025) 21px 22px
+  );
+  content: '';
+  pointer-events: none;
+}
+
+.store-detail-preview__status {
+  position: relative;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  color: rgba(255, 255, 255, 0.72);
+  font-size: 10px;
+  font-weight: 800;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+
+.store-detail-preview--overview > img {
+  width: 90px;
+  height: 90px;
+  z-index: 1;
+  align-self: center;
+  margin: 26px 0 16px;
+  border-radius: 24px;
+  object-fit: cover;
+  box-shadow: 0 14px 24px rgba(0, 0, 0, 0.28);
+  transform: rotate(-4deg);
+}
+
+.store-detail-preview > strong,
+.store-detail-preview > small {
+  position: relative;
+  z-index: 1;
+}
+
+.store-detail-preview > strong {
+  font-size: 20px;
+  line-height: 1.08;
+}
+
+.store-detail-preview > small {
+  margin-top: 5px;
+  color: rgba(255, 255, 255, 0.68);
+  font-size: 11px;
+}
+
+.store-detail-preview__metrics {
+  z-index: 1;
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: var(--sky-space-2);
+  margin-top: auto;
+}
+
+.store-detail-preview__metrics span {
+  display: flex;
+  flex-direction: column;
+  border-radius: var(--sky-radius-control);
+  padding: var(--sky-space-3);
+  background: rgba(255, 255, 255, 0.11);
+  color: rgba(255, 255, 255, 0.7);
+  font-size: 9px;
+}
+
+.store-detail-preview__metrics b {
+  color: #fff;
+  font-size: 17px;
+}
+
+.store-detail-preview__activity {
+  z-index: 1;
+  height: 28px;
+  display: flex;
+  align-items: flex-end;
+  gap: 5px;
+  margin-top: var(--sky-space-3);
+}
+
+.store-detail-preview__activity span {
+  width: 20%;
+  border-radius: var(--sky-radius-pill);
+  background: rgba(255, 255, 255, 0.42);
+}
+
+.store-detail-preview__activity span:nth-child(1) {
+  height: 42%;
+}
+.store-detail-preview__activity span:nth-child(2) {
+  height: 72%;
+}
+.store-detail-preview__activity span:nth-child(3) {
+  height: 55%;
+}
+.store-detail-preview__activity span:nth-child(4) {
+  height: 92%;
+}
+.store-detail-preview__activity span:nth-child(5) {
+  height: 68%;
+}
+
+.store-detail-preview__avatars {
+  z-index: 1;
+  display: flex;
+  margin: 42px 0 22px;
+}
+
+.store-detail-preview__avatars span {
+  width: 54px;
+  height: 54px;
+  display: grid;
+  place-items: center;
+  margin-right: -12px;
+  border: 3px solid rgba(255, 255, 255, 0.82);
+  border-radius: 50%;
+  background: rgba(17, 22, 38, 0.74);
+  font-size: 12px;
+  font-weight: 800;
+}
+
+.store-detail-preview__message {
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  gap: var(--sky-space-2);
+  margin-top: auto;
+  border-radius: var(--sky-radius-control);
+  padding: var(--sky-space-3);
+  background: rgba(255, 255, 255, 0.12);
+  font-size: 10px;
+}
+
+.store-detail-preview--community > img,
+.store-detail-preview--insights > img {
+  width: 42px;
+  height: 42px;
+  z-index: 1;
+  position: absolute;
+  right: var(--sky-space-4);
+  bottom: var(--sky-space-4);
+  border-radius: 12px;
+  object-fit: cover;
+  box-shadow: 0 8px 14px rgba(0, 0, 0, 0.24);
+}
+
+.store-detail-preview--insights > strong {
+  margin-top: 36px;
+}
+
+.store-detail-preview__chart {
+  height: 145px;
+  z-index: 1;
+  display: flex;
+  align-items: flex-end;
+  gap: 7px;
+  margin-top: var(--sky-space-5);
+  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
+  padding: 0 var(--sky-space-2);
+}
+
+.store-detail-preview__chart span {
+  width: 14px;
+  border-radius: 7px 7px 0 0;
+  background: linear-gradient(180deg, #fff, rgba(255, 255, 255, 0.24));
+}
+
+.store-detail-preview__insight {
+  z-index: 1;
+  display: flex;
+  flex-direction: column;
+  margin-top: var(--sky-space-4);
+}
+
+.store-detail-preview__insight b {
+  font-size: 22px;
+}
+
+.store-detail-preview__insight span {
+  color: rgba(255, 255, 255, 0.68);
+  font-size: 10px;
+}
+
+:global(.phone-app--performance) .store-detail-preview,
+:global(.phone-app--performance) .store-detail__hero > img {
+  box-shadow: none;
+}
+
+@media (hover: hover) {
+  .store-detail__toolbar button:hover {
+    border-color: rgba(255, 255, 255, 0.16);
+    background: var(--sky-surface-tint);
+    box-shadow: 0 7px 16px rgba(0, 0, 0, 0.18);
+    transform: translateY(-1px);
+  }
+
+  .store-detail__preview-navigation button:hover:not(:disabled) {
+    color: var(--sky-app-accent);
+    background: var(--sky-surface-tint);
+    transform: translateY(-1px);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .store-detail__previews {
+    scroll-behavior: auto;
+  }
+}
+</style>
diff --git a/frontend/testserver/index.cjs b/frontend/testserver/index.cjs
index cbfe76d..5e9f04c 100644
--- a/frontend/testserver/index.cjs
+++ b/frontend/testserver/index.cjs
@@ -8125,6 +8125,10 @@ app.post('/api/:endpoint', (request, response) => {
         },
         memos: mockMemos,
         notes: mockNotes,
+        player: {
+          firstName: 'Alex',
+          lastName: 'Morgan',
+        },
         security: mockSecurity,
         token: 'development',
       },
diff --git a/sky_phone/config/locales/en.lua b/sky_phone/config/locales/en.lua
index f984c98..152d894 100644
--- a/sky_phone/config/locales/en.lua
+++ b/sky_phone/config/locales/en.lua
@@ -1674,10 +1674,63 @@ Locales["en"] = {
             },
             appStore = {
                 name = "App Store", get = "GET", open = "OPEN", installing = "Installing",
-                searchPlaceholder = "Search apps and games", appsTitle = "Built-in Apps", gamesTitle = "Games",
+                player = "Player", profileLabel = "{name} profile",
+                searchPlaceholder = "Games, apps, stories and more", appsTitle = "Built-in Apps", gamesTitle = "Games",
                 selected = "Apps available for your Sky Phone",
-                tabs = { apps = "Apps", games = "Games", search = "Search" },
-            },
+                  tabs = { today = "Today", apps = "Apps", games = "Games", search = "Search" },
+                  today = {
+                      freshDaily = "A fresh selection every day", dailyEdition = "Daily Edition",
+                      featured = "Featured today",
+                      gameHighlight = "Game highlight", appHighlight = "App highlight",
+                      curatedForYou = "Curated for you", editorsChoice = "Editor's Choice",
+                      discoverTitle = "Discover {app}", playTitle = "Play something new with {app}",
+                      description = "{app} is in the spotlight today on Sky Phone.",
+                      categoryDescription = "{category} · Made for Sky Phone",
+                      moreHighlights = "Today's Highlights", topToday = "Top Today",
+                      topTodayDescription = "Popular picks from today’s edition",
+                      oneMoreThing = "One more thing",
+                  },
+                  filters = {
+                      all = "All", social = "Social", utilities = "Utilities", shopping = "Shopping",
+                      productivity = "Productivity", arcade = "Arcade", puzzle = "Puzzle", classic = "Classics",
+                  },
+                  browse = {
+                      categories = "Store categories", availableNow = "Available now",
+                      featureTitle = "Discover {app}", featuredPages = "Featured apps",
+                      handPicked = "Hand-picked for you", essentialApps = "Essential Apps",
+                      essentialGames = "Essential Games",
+                  },
+                  search = {
+                      recommended = "Recommended", discover = "Discover", results = "Search Results",
+                      noResults = "No matching apps or games found.", ad = "Ad",
+                      topApps = "Top Apps", topGames = "Top Games", bestApps = "Bestselling Apps",
+                      bestGames = "Bestselling Games", productivity = "Productivity", photoVideo = "Photo & Video",
+                  },
+                  account = {
+                      account = "Account", title = "App Management", skyAccount = "Sky Phone Account",
+                      apps = "Installed Apps", games = "Games", library = "Your Library", myApps = "My Apps",
+                      update = "UPDATE", uninstall = "Uninstall", uninstallApp = "Uninstall {app}",
+                      uninstallTitle = "Uninstall this app?",
+                      uninstallBody = "{app} will be removed from this phone. You can download it again from the App Store.",
+                  },
+                  details = {
+                      skyStudios = "Sky Studios", share = "Share app", openDetails = "View {app}",
+                      shareReady = "App information is ready to share.", ratings = "{count} ratings",
+                      shareCopy = "Take a look at {app} in the App Store.",
+                      age = "Age Rating", years = "Years", chart = "Chart", whatsNew = "What's New",
+                      version = "Version {version}", updatedToday = "Today",
+                      releaseNotes = "{app} now includes fresh content, faster loading and several interface improvements.",
+                      preview = "Preview", testData = "Preview data", previewLive = "Live Preview",
+                      previousPreview = "Previous preview", nextPreview = "Next preview",
+                      previewOverview = "Everything important at a glance", previewCommunity = "Community",
+                      previewInsights = "Insights", today = "Today", progress = "Progress",
+                      communityTitle = "Together in {app}",
+                      communityBody = "Discover activity from players around Los Santos.",
+                      featuredMoment = "Featured moment from today", weeklyActivity = "Weekly Activity",
+                      fromLastWeek = "from last week", about = "About this App",
+                      description = "{app} is a detailed {category} experience made for Sky Phone. Explore its features, connect with the city and keep everything close at hand.",
+                  },
+              },
             settings = {
                 name = "Settings", searchPlaceholder = "Search", airplaneMode = "Airplane Mode", streamerMode = "Streamer Mode",
                 wallpaper = "Wallpaper", on = "On", off = "Off", accountName = "Sky Cloud",
diff --git a/sky_phone/source/server/phone.lua b/sky_phone/source/server/phone.lua
index dbfb507..98d9d20 100644
--- a/sky_phone/source/server/phone.lua
+++ b/sky_phone/source/server/phone.lua
@@ -518,6 +518,10 @@ local function bootstrap(source, security, security_loaded)
         } or nil,
         notes = SkyPhoneNotes.List(device.account_id, device.imei),
         memos = SkyPhoneMemos.List(device.account_id, device.imei),
+        player = {
+            firstName = trim(Bridge.Framework.GetFirstname(source)) or "",
+            lastName = trim(Bridge.Framework.GetLastname(source)) or "",
+        },
     }
 end