@naeil/ui 0.8.0 → 0.10.0

package/dist/source/components/naeil-standalone-messages.d.ts

@@ -0,0 +1,11 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+import { NaeilHeaderLocale } from './naeil-header-data.js';
+
+/** Only the standalone compatibility entry includes all three small dictionaries. */
+declare function NaeilStandaloneMessages({ locale, children }: {
+    locale: NaeilHeaderLocale;
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+export { NaeilStandaloneMessages };

package/dist/source/components/naeil-standalone-messages.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import en from "../naeil-locale/messages/en.json";
+import ko from "../naeil-locale/messages/ko.json";
+import ja from "../naeil-locale/messages/ja.json";
+import { NaeilMessagesProvider } from "./naeil-messages-context.js";
+const messages = { en: en.naeil, ko: ko.naeil, ja: ja.naeil };
+function NaeilStandaloneMessages({ locale, children }) {
+  return /* @__PURE__ */ jsx(NaeilMessagesProvider, { locale, messages: messages[locale], children });
+}
+export {
+  NaeilStandaloneMessages
+};

package/dist/source/i18n/routing.d.ts

@@ -1,5 +1,5 @@
 import * as next_dist_shared_lib_app_router_context_shared_runtime from 'next/dist/shared/lib/app-router-context.shared-runtime';
-import * as next_navigation from 'next/navigation';
+import * as next_dist_client_components_redirect_error from 'next/dist/client/components/redirect-error';
 import * as next_intl_navigation from 'next-intl/navigation';
 import * as url from 'url';
 import * as react from 'react';
@@ -31,8 +31,6 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     style?: react.CSSProperties | undefined;
     title?: string | undefined | undefined;
     locale?: string | undefined;
-    onError?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
-    children?: react.ReactNode;
     ref?: react.Ref<HTMLAnchorElement> | undefined;
     prefix?: string | undefined | undefined;
     key?: react.Key | null | undefined;
@@ -42,12 +40,10 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     passHref?: boolean | undefined;
     prefetch?: boolean | "auto" | null | undefined;
     legacyBehavior?: boolean | undefined;
-    onMouseEnter?: React.MouseEventHandler<HTMLAnchorElement> | undefined;
-    onTouchStart?: React.TouchEventHandler<HTMLAnchorElement> | undefined;
-    onClick?: React.MouseEventHandler<HTMLAnchorElement> | undefined;
     onNavigate?: ((event: {
         preventDefault: () => void;
     }) => void) | undefined;
+    transitionTypes?: string[] | undefined;
     download?: any;
     hrefLang?: string | undefined | undefined;
     media?: string | undefined | undefined;
@@ -104,7 +100,6 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     is?: string | undefined | undefined;
     exportparts?: string | undefined | undefined;
     part?: string | undefined | undefined;
-    tw?: string | undefined;
     "aria-activedescendant"?: string | undefined | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
     "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
@@ -158,6 +153,8 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     "aria-valuemin"?: number | undefined | undefined;
     "aria-valuenow"?: number | undefined | undefined;
     "aria-valuetext"?: string | undefined | undefined;
+    href: string | url.UrlObject;
+    children?: react.ReactNode;
     dangerouslySetInnerHTML?: {
         __html: string | TrustedHTML;
     } | undefined | undefined;
@@ -177,20 +174,21 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     onFocusCapture?: react.FocusEventHandler<HTMLAnchorElement> | undefined;
     onBlur?: react.FocusEventHandler<HTMLAnchorElement> | undefined;
     onBlurCapture?: react.FocusEventHandler<HTMLAnchorElement> | undefined;
-    onChange?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onChangeCapture?: react.FormEventHandler<HTMLAnchorElement> | undefined;
+    onChange?: react.ChangeEventHandler<HTMLAnchorElement, Element> | undefined;
+    onChangeCapture?: react.ChangeEventHandler<HTMLAnchorElement, Element> | undefined;
     onBeforeInput?: react.InputEventHandler<HTMLAnchorElement> | undefined;
-    onBeforeInputCapture?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onInput?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onInputCapture?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onReset?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onResetCapture?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onSubmit?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onSubmitCapture?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onInvalid?: react.FormEventHandler<HTMLAnchorElement> | undefined;
-    onInvalidCapture?: react.FormEventHandler<HTMLAnchorElement> | undefined;
+    onBeforeInputCapture?: react.InputEventHandler<HTMLAnchorElement> | undefined;
+    onInput?: react.InputEventHandler<HTMLAnchorElement> | undefined;
+    onInputCapture?: react.InputEventHandler<HTMLAnchorElement> | undefined;
+    onReset?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
+    onResetCapture?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
+    onSubmit?: react.SubmitEventHandler<HTMLAnchorElement> | undefined;
+    onSubmitCapture?: react.SubmitEventHandler<HTMLAnchorElement> | undefined;
+    onInvalid?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
+    onInvalidCapture?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
     onLoad?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
     onLoadCapture?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
+    onError?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
     onErrorCapture?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
     onKeyDown?: react.KeyboardEventHandler<HTMLAnchorElement> | undefined;
     onKeyDownCapture?: react.KeyboardEventHandler<HTMLAnchorElement> | undefined;
@@ -244,6 +242,7 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     onWaitingCapture?: react.ReactEventHandler<HTMLAnchorElement> | undefined;
     onAuxClick?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
     onAuxClickCapture?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
+    onClick?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
     onClickCapture?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
     onContextMenu?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
     onContextMenuCapture?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
@@ -267,6 +266,7 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     onDropCapture?: react.DragEventHandler<HTMLAnchorElement> | undefined;
     onMouseDown?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
     onMouseDownCapture?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
+    onMouseEnter?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
     onMouseLeave?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
     onMouseMove?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
     onMouseMoveCapture?: react.MouseEventHandler<HTMLAnchorElement> | undefined;
@@ -284,6 +284,7 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     onTouchEndCapture?: react.TouchEventHandler<HTMLAnchorElement> | undefined;
     onTouchMove?: react.TouchEventHandler<HTMLAnchorElement> | undefined;
     onTouchMoveCapture?: react.TouchEventHandler<HTMLAnchorElement> | undefined;
+    onTouchStart?: react.TouchEventHandler<HTMLAnchorElement> | undefined;
     onTouchStartCapture?: react.TouchEventHandler<HTMLAnchorElement> | undefined;
     onPointerDown?: react.PointerEventHandler<HTMLAnchorElement> | undefined;
     onPointerDownCapture?: react.PointerEventHandler<HTMLAnchorElement> | undefined;
@@ -325,7 +326,6 @@ declare const Link: react.ForwardRefExoticComponent<Omit<{
     onTransitionRunCapture?: react.TransitionEventHandler<HTMLAnchorElement> | undefined;
     onTransitionStart?: react.TransitionEventHandler<HTMLAnchorElement> | undefined;
     onTransitionStartCapture?: react.TransitionEventHandler<HTMLAnchorElement> | undefined;
-    href: string | url.UrlObject;
 }, "ref"> & react.RefAttributes<HTMLAnchorElement>>;
 declare const redirect: (args: {
     href: string | {
@@ -334,7 +334,7 @@ declare const redirect: (args: {
     };
     locale: string;
     forcePrefix?: boolean;
-}, type?: next_navigation.RedirectType | undefined) => never;
+}, type?: next_dist_client_components_redirect_error.RedirectType | undefined) => never;
 declare const usePathname: () => string;
 declare const useRouter: () => {
     push: (href: string | {
@@ -358,6 +358,8 @@ declare const useRouter: () => {
     back(): void;
     forward(): void;
     refresh(): void;
+    experimental_gesturePush?(href: string, options?: next_dist_shared_lib_app_router_context_shared_runtime.NavigateOptions): void;
+    bfcacheId: string;
 };
 declare const getPathname: (args: {
     href: string | {

package/dist/source/lib/ui-release.d.ts

@@ -1,5 +1,5 @@
 declare const uiRelease: {
-    readonly version: "0.8.0";
+    readonly version: "0.10.0";
     readonly contractVersion: "1";
 };
 

package/dist/source/lib/ui-release.js

@@ -1,4 +1,4 @@
-const uiRelease = { version: "0.8.0", contractVersion: "1" };
+const uiRelease = { version: "0.10.0", contractVersion: "1" };
 export {
   uiRelease
 };

package/dist/source/naeil-locale/messages/en.json

@@ -0,0 +1,78 @@
+{
+  "naeil": {
+    "header": {
+      "nav": {
+        "home": "Home",
+        "projects": "Projects",
+        "blog": "Blog",
+        "navigation": "Main navigation",
+        "menu": "Menu",
+        "closeMenu": "Close menu"
+      },
+      "theme": {
+        "switchToLight": "Switch to light theme",
+        "switchToDark": "Switch to dark theme"
+      },
+      "locale": {
+        "switchLabel": "Language"
+      },
+      "projects": {
+        "cc": {
+          "name": "Content Collector",
+          "description": "Automated content collection from RSS, YouTube, Reddit + AI summarization"
+        },
+        "pkm": {
+          "name": "PKM",
+          "description": "Personal knowledge management — document parsing, embeddings, semantic search"
+        },
+        "naeilUi": {
+          "name": "naeil-ui",
+          "description": "Minimal design system — OKLCH tokens, Tailwind v4, shadcn"
+        },
+        "sa": {
+          "name": "Sustainability Analyzer",
+          "description": "AI-powered ESG report analysis — PDF parsing, qualitative assessment, comparison tables"
+        },
+        "babyAgent": {
+          "name": "Baby Agent",
+          "description": "Parenting AI agent — LINE-based Q&A, records, reminders"
+        },
+        "status": {
+          "active": "Active",
+          "coming": "Coming Soon"
+        }
+      }
+    },
+    "account": {
+      "menu": "Account menu",
+      "account": "Account",
+      "login": "Log in",
+      "logout": "Log out",
+      "busy": "Logging out…"
+    },
+    "footer": {
+      "navigation": "Navigation",
+      "projects": "Projects",
+      "blog": "Blog",
+      "social": "Social",
+      "description": "Tomorrow starts here."
+    },
+    "locale": {
+      "names": {
+        "en": "English",
+        "ko": "한국어",
+        "ja": "日本語"
+      },
+      "pending": "Changing language…",
+      "failed": "The language could not be changed. Your work is still here.",
+      "retry": "Try again",
+      "errors": {
+        "badRequest": "This address is not valid.",
+        "notFound": "Page not found.",
+        "unauthenticated": "Sign in to continue.",
+        "forbidden": "You do not have access to this page.",
+        "unavailable": "The service is temporarily unavailable. Please try again."
+      }
+    }
+  }
+}

package/dist/source/naeil-locale/messages/ja.json

@@ -0,0 +1,78 @@
+{
+  "naeil": {
+    "header": {
+      "nav": {
+        "home": "ホーム",
+        "projects": "プロジェクト",
+        "blog": "ブログ",
+        "navigation": "メインナビゲーション",
+        "menu": "メニュー",
+        "closeMenu": "メニューを閉じる"
+      },
+      "theme": {
+        "switchToLight": "ライトテーマに切り替える",
+        "switchToDark": "ダークテーマに切り替える"
+      },
+      "locale": {
+        "switchLabel": "言語"
+      },
+      "projects": {
+        "cc": {
+          "name": "Content Collector",
+          "description": "RSS、YouTube、Redditの自動収集 + AI要約"
+        },
+        "pkm": {
+          "name": "PKM",
+          "description": "個人ナレッジ管理 — ドキュメント解析、埋め込み、セマンティック検索"
+        },
+        "naeilUi": {
+          "name": "naeil-ui",
+          "description": "ミニマルデザインシステム — OKLCHトークン、Tailwind v4、shadcn"
+        },
+        "sa": {
+          "name": "Sustainability Analyzer",
+          "description": "ESGレポートAI分析 — PDF解析、定性評価、比較表の自動生成"
+        },
+        "babyAgent": {
+          "name": "Baby Agent",
+          "description": "育児AIエージェント — LINE Q&A、記録、リマインダー"
+        },
+        "status": {
+          "active": "アクティブ",
+          "coming": "準備中"
+        }
+      }
+    },
+    "account": {
+      "menu": "アカウントメニュー",
+      "account": "アカウント",
+      "login": "ログイン",
+      "logout": "ログアウト",
+      "busy": "ログアウト中…"
+    },
+    "footer": {
+      "navigation": "ナビゲーション",
+      "projects": "プロジェクト",
+      "blog": "ブログ",
+      "social": "ソーシャル",
+      "description": "Tomorrow starts here."
+    },
+    "locale": {
+      "names": {
+        "en": "English",
+        "ko": "한국어",
+        "ja": "日本語"
+      },
+      "pending": "言語を変更しています…",
+      "failed": "言語を変更できませんでした。作業内容は保持されています。",
+      "retry": "再試行",
+      "errors": {
+        "badRequest": "このアドレスは無効です。",
+        "notFound": "ページが見つかりません。",
+        "unauthenticated": "続けるにはログインしてください。",
+        "forbidden": "このページへのアクセス権限がありません。",
+        "unavailable": "サービスを一時的に利用できません。もう一度お試しください。"
+      }
+    }
+  }
+}

package/dist/source/naeil-locale/messages/ko.json

@@ -0,0 +1,78 @@
+{
+  "naeil": {
+    "header": {
+      "nav": {
+        "home": "홈",
+        "projects": "프로젝트",
+        "blog": "블로그",
+        "navigation": "주요 메뉴",
+        "menu": "메뉴",
+        "closeMenu": "메뉴 닫기"
+      },
+      "theme": {
+        "switchToLight": "밝은 테마로 전환",
+        "switchToDark": "어두운 테마로 전환"
+      },
+      "locale": {
+        "switchLabel": "언어"
+      },
+      "projects": {
+        "cc": {
+          "name": "Content Collector",
+          "description": "RSS, YouTube, Reddit 자동 수집 + AI 요약"
+        },
+        "pkm": {
+          "name": "PKM",
+          "description": "개인 지식 관리 — 문서 파싱, 임베딩, 시맨틱 검색"
+        },
+        "naeilUi": {
+          "name": "naeil-ui",
+          "description": "미니멀 디자인 시스템 — OKLCH 토큰, Tailwind v4, shadcn"
+        },
+        "sa": {
+          "name": "Sustainability Analyzer",
+          "description": "ESG 리포트 AI 분석 — PDF 파싱, 정성평가, 비교표 자동 생성"
+        },
+        "babyAgent": {
+          "name": "Baby Agent",
+          "description": "육아 AI 에이전트 — LINE 기반 Q&A, 기록, 리마인더"
+        },
+        "status": {
+          "active": "활성",
+          "coming": "준비 중"
+        }
+      }
+    },
+    "account": {
+      "menu": "계정 메뉴",
+      "account": "계정",
+      "login": "로그인",
+      "logout": "로그아웃",
+      "busy": "로그아웃 중…"
+    },
+    "footer": {
+      "navigation": "네비게이션",
+      "projects": "프로젝트",
+      "blog": "블로그",
+      "social": "소셜",
+      "description": "Tomorrow starts here."
+    },
+    "locale": {
+      "names": {
+        "en": "English",
+        "ko": "한국어",
+        "ja": "日本語"
+      },
+      "pending": "언어를 변경하는 중…",
+      "failed": "언어를 변경하지 못했습니다. 작업 내용은 유지됩니다.",
+      "retry": "다시 시도",
+      "errors": {
+        "badRequest": "올바르지 않은 주소입니다.",
+        "notFound": "페이지를 찾을 수 없습니다.",
+        "unauthenticated": "계속하려면 로그인하세요.",
+        "forbidden": "이 페이지에 접근할 권한이 없습니다.",
+        "unavailable": "일시적으로 서비스를 이용할 수 없습니다. 다시 시도하세요."
+      }
+    }
+  }
+}

package/docs/components/README.md

@@ -1,6 +1,6 @@
 # Component usage guides
 
-These maintained guides cover **published and registry-verified @naeil/ui 0.7.1**: canonical footer and release identity from the unpublished 0.7.0 candidate, plus shared account presentation. The current published baseline is 0.7.1; see [release policy and identities](../package-release.md#publication-and-deployment). [Setup, themes, fonts and shared responsibilities](common.md). Run `pnpm storybook` for the current 17 Docs pages (15 UI and 2 Brand) and choose Docs or Usage. The [hosted Storybook](https://naeil-dev.github.io/naeil-ui/) has recorded [0.5.0 verification](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.5.0); each subsequent deployment requires its own receipt. Select chooses a value; DropdownMenu chooses an action.
+These maintained guides cover published exact **@naeil/ui 0.8.0** and the unpublished **0.9.0 frame candidate**. On 2026-10-29 registry tags were latest=0.7.2 and next=0.8.0; see [release policy and identities](../package-release.md#publication-and-deployment). [Setup, themes, fonts and shared responsibilities](common.md). Run `pnpm storybook` for the current 17 Docs pages (15 UI and 2 Brand) and choose Docs or Usage. The [hosted Storybook](https://naeil-dev.github.io/naeil-ui/) has recorded [0.5.0 verification](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.5.0); each subsequent deployment requires its own receipt. Select chooses a value; DropdownMenu chooses an action.
 
 Start application layouts with the [shared navigation/footer selection and frame guide](application-layout.md). It includes a starter, the 1600px frame contract and instructions to place in consumer repositories so agents reuse the shared implementation.
 

package/docs/components/application-layout.md

@@ -1,6 +1,6 @@
 # Application frame and shared navigation/footer
 
-The published registry baseline is **@naeil/ui 0.7.2**; the new Home profile is an **unpublished 0.8.0 candidate**. Install exact `@naeil/ui@0.7.2` for published consumers; hosted Docs and service activation have separate receipts. See [release identities and status](../package-release.md#publication-and-deployment) and [consumer setup](../design/v2-migration.md) for CSS, Tailwind sources and fonts.
+Exact **@naeil/ui 0.8.0 is published** (`next` tag; `latest` remains 0.7.2 at the 2026-10-29 verification). The **0.9.0 candidate** adds shared root reservation. Install exact `@naeil/ui@0.8.0` for the published Home APIs; hosted Docs and service activation have separate receipts. See [release identities and status](../package-release.md#publication-and-deployment) and [consumer setup](../design/v2-migration.md) for CSS, Tailwind sources and fonts.
 
 ## Choose the shared composition first
 
@@ -8,7 +8,7 @@ The published registry baseline is **@naeil/ui 0.7.2**; the new Home profile is
 | --- | --- |
 | The actual naeil.dev brand, project catalog and controls | `NaeilHeader` from `@naeil/ui/naeil-header` |
 | Owned-service login/account/logout presentation | `NaeilHeaderAccountControl` from `@naeil/ui/naeil-header` in `authSlot` |
-| Owned naeil service with product menu data (0.8.0 candidate) | Complete `NaeilHeader`, with `appNavigation`, catalog/blog hidden, optional `brandSuffix` and `statusSlot` |
+| Owned naeil service with product menu data (0.8.0) | Complete `NaeilHeader`, with `appNavigation`, catalog/blog hidden, optional `brandSuffix` and `statusSlot` |
 | A different product menu without canonical naeil chrome | `Navigation` from `@naeil/ui/ui` |
 | Owned naeil service footer | `NaeilFooter` from `@naeil/ui/naeil-footer` |
 | Different product footer or explicit content override | `SiteFooter` from `@naeil/ui/ui` |
@@ -29,13 +29,30 @@ Choose one header per application frame. Supply menu data, links, route guards,
 
 Use `.ui-app-frame` on main. Shared header/footer already apply the frame internally; **do not wrap them in another padded frame**. Put purpose-specific sections inside main. At 1920px the default frame has 1520px available after its 40px gutters. Small screens shrink the frame and reduce gutters to at least 16px. A narrow form must not constrain or move navigation.
 
-Reserve a consistent scrollbar gutter in the consumer's global CSS when routes can alternate between short and tall content:
+The **0.9.0 candidate** supplies `html { scrollbar-gutter: stable }` once in `components.css`, reached by `globals.css` or `theme.css + components.css`. Classic mode reserves one browser-sized gutter on short and long pages; overlay mode reserves none. The shared lock correction removes duplicate Radix body right-margin/gap compensation and retains its scroll prevention, focus and nested cleanup. Keep header/main/footer and their ordinary content horizontally stable. Compare matching root policies and measure before any fullPage capture. See the [adopted acceptance contract](https://github.com/naeil-dev/naeil-ui/blob/434b7d07235316097ca3a55265ee02c1422b0cfd/docs/superpowers/specs/2026-10-29-page-root-scrollbar-gutter.md).
+
+For a different document policy, declare this on the root **before first paint**:
+
+```html
+<html data-naeil-scrollbar-gutter="auto">
+```
+
+This sets `scrollbar-gutter: auto` and disables the shared lock correction together. Apply custom root/scroller CSS only after opting out; changing only gutter CSS leaves an unsupported compensation combination. The default full-page profile has zero body margin/outer padding; no new body reset is supplied. Nonzero body edge spacing, custom scroll locks and react-remove-scroll-bar helper classes need consumer integration or opt-out. Theme-only and JS-only imports do not set root policy. Unsupported engines keep Radix's original compensation.
+
+Import `globals.css`, or the split `theme.css` and `components.css`, without an enclosing named layer (`@import "@naeil/ui/components.css";`, not `@import "@naeil/ui/components.css" layer(ui);`). The package already declares its own layers. Wrapping the import in a named layer lets the dependency's unlayered `--removed-body-scroll-bar-size` win: it can remain 15px in classic mode even though the important margin correction still wins. Elements using that variable can then shift.
+
+After opting out, a plain `@layer base { html { scrollbar-gutter: stable; } }` loses to the package's more specific root attribute selector in the same layer. Write the custom rule outside any layer, for example:
 
 ```css
-html { scrollbar-gutter: stable; }
+/* The root has data-naeil-scrollbar-gutter="auto"; this policy owns its lock integration. */
+html[data-naeil-scrollbar-gutter="auto"] { scrollbar-gutter: stable; }
 ```
 
-This keeps a centered frame from shifting when a classic scrollbar appears. The document scroll policy belongs to the application; the shared components do not set it implicitly. In a 1920px Chromium viewport with a 15px scrollbar, the frame starts at 152.5px with this policy in both short and tall states. Without it, the start changes from 160px to 152.5px. Overlay-scrollbar platforms may reserve no extra space.
+Alternatively, use that attribute selector in `@layer base` after the package import, so equal specificity resolves to the later consumer rule. The shared lock correction stays disabled in either case; the consumer owns matching compensation.
+
+In classic mode, a fixed modal scrim covers the page's available width, leaving the reserved gutter strip undimmed (15px in the measured macOS Chromium profile). This is expected with a reserved root; 0.9.0 leaves the scrim styles unchanged. Overlay mode has no reserved strip. A full-viewport scrim redesign is outside this release.
+
+Frame and control tokens stay unchanged. At 1920px with a 15px classic gutter the centered 1600px frame starts at 152.5px on both short and long pages (overlay: 160px). Japanese signed-out canonical login content at width 320 has 257px inside the 305px classic sheet; its 261px toolbar wraps to 104px. Overlay remains 44px. Preserve all labels, 44px targets and keyboard access. Home Workspace/account and LoginGate/no-login-slot retain their 44px toolbars; this specific F3 profile difference is documented, not a new Home chrome exception.
 
 ## Canonical naeil application starter
 
@@ -79,7 +96,7 @@ export function ApplicationLayout({ children, locale, Link, currentHref,
 
 `NaeilHeader` is fixed; reserve its 65px height and account for it in sticky areas and focus/anchor scroll margins. Default destinations are official naeil.dev URLs. Preserve routing/unsaved-change guards using the [header contract](naeil-header.md) and [footer interception contract](naeil-footer.md); a Link adapter must handle absolute official and GitHub destinations as well as local routes. Only pass `onLocaleChange` when the application supports its complete language set.
 
-For owned naeil product navigation, keep the whole header and pass menu data through `appNavigation`; see the [Home profile and host conditions](naeil-header.md#host-typography-and-mobile-handoff-080-candidate). `mobileOpen`/`onMobileOpenChange` can coordinate the sheet with a consumer confirmation, while busy state and request locking remain above the header. For a different product menu without canonical chrome, use the [generic Navigation composition](navigation.md) with the same main/footer structure. Generic Navigation is in document flow by default and needs no fixed-header clearance. The [standalone React example](https://github.com/naeil-dev/naeil-ui/tree/main/examples/react) exercises the installed header, narrow form and SiteFooter together.
+For owned naeil product navigation, keep the whole header and pass menu data through `appNavigation`; see the [Home profile and host conditions](naeil-header.md#host-typography-and-mobile-handoff-080). `mobileOpen`/`onMobileOpenChange` can coordinate the sheet with a consumer confirmation, while busy state and request locking remain above the header. For a different product menu without canonical chrome, use the [generic Navigation composition](navigation.md) with the same main/footer structure. Generic Navigation is in document flow by default and needs no fixed-header clearance. The [standalone React example](https://github.com/naeil-dev/naeil-ui/tree/main/examples/react) exercises the installed header, narrow form and SiteFooter together.
 
 An empty desktop menu preserves B1's limitation: resizing alone leaves the sheet open; Escape/close/overlay/route change dismiss it. Controlled-mobile account callbacks wait for both closing layers and their focus handoff; desktop and uncontrolled-mobile account callbacks retain B1's selection-time behavior. A consumer confirmation owns cancellation focus, including a visible desktop account fallback after resize.
 
@@ -109,6 +126,7 @@ Put this in the **consumer application's** `AGENTS.md` (or equivalent repository
 - Use @naeil/ui/naeil-header for the canonical naeil header; use Navigation from @naeil/ui/ui for a different product menu. Use NaeilFooter from @naeil/ui/naeil-footer for owned service footers; SiteFooter remains the generic primitive. Keep existing Next Nav/Footer compatibility adapters when applicable.
 - Put NaeilHeaderAccountControl from @naeil/ui/naeil-header in authSlot for owned apps. Supply real session state, the busy flag and guarded logout callback. Keep pending state and the request lock above the header so desktop/mobile copies share them; do not copy account/avatar/menu markup.
 - Local wrappers supply menu data, routing/guards, locale, auth and slots. Do not copy the menu, mobile sheet, controls or footer implementation. Extend the shared component for reusable missing behavior.
+- The 0.9.0 candidate CSS reserves a stable root gutter through globals or theme+components; opt out on html with data-naeil-scrollbar-gutter="auto" before first paint to disable both root reservation and lock correction. Compare classic/overlay and short/long body content through menus/dialogs; measure before fullPage screenshots.
 - Use ui-app-frame on main; navigation/footer own their internal frames. Keep reading/settings/short-form sections inside that frame. Apply frame overrides consistently across routes.
 - Check the installed package version and CSS before creating a replacement for an apparently missing component.
 - Verify actual shared navigation/footer rendering and stable anchors across routes, themes and supported sizes, including signed-out, signed-in, menu, busy, cancellation/failure and retry states. An import or anonymous-only check is not adoption evidence. Record intentional route exceptions.

package/docs/components/common.md

@@ -1,12 +1,12 @@
 # Shared usage contract
 
-These guides target the **@naeil/ui 0.6.0**; release identities and publication evidence are recorded in the [release record](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.6.0). The [hosted Docs](https://naeil-dev.github.io/naeil-ui/) were last verified for [0.5.0 on 2026-10-15](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.5.0), while `pnpm storybook` shows this checkout. Start with the [consumer setup and migration](../design/v2-migration.md). Primitives and generic Navigation/SiteFooter are exported from `@naeil/ui/ui`; the actual branded whole header uses the opt-in [NaeilHeader](naeil-header.md) entry `@naeil/ui/naeil-header`. Both are React-only. The legacy root needs the optional Next/next-intl peers. Examples import real wrappers; product state, validation and network requests belong to consumers.
+These maintained guides cover published exact **@naeil/ui 0.8.0** and the unpublished **0.9.0 frame candidate**; see [release identities and status](../package-release.md#publication-and-deployment). The [hosted Docs](https://naeil-dev.github.io/naeil-ui/) were last verified for [0.5.0 on 2026-10-15](https://github.com/naeil-dev/naeil-ui/releases/tag/v0.5.0), while `pnpm storybook` shows this checkout. Start with the [consumer setup and migration](../design/v2-migration.md). Primitives and generic Navigation/SiteFooter are exported from `@naeil/ui/ui`; the actual branded whole header uses the opt-in [NaeilHeader](naeil-header.md) entry `@naeil/ui/naeil-header`. Both are React-only. The legacy root needs the optional Next/next-intl peers. Examples import real wrappers; product state, validation and network requests belong to consumers.
 
 ## Styling, themes and overrides
 
 Import `@naeil/ui/globals.css` once and register `@source` for the installed package's `dist` in your Tailwind 4 build. Alternatively load both theme.css and components.css alongside your existing Tailwind setup. Deliver Pretendard and, for Japanese, Noto Sans JP locally through your app's font pipeline; the package does not fetch fonts. Keep font OFL notices with redistributed binaries. The independent React example demonstrates consumer-owned delivery.
 
-Use `.light`/`.dark` on the document root to override OS theme. Root `data-ui-density="compact"` changes spacing, not text size: default controls are 40px, compact 36px, small screens/coarse pointers at least 44px. Portals use document-level styles/density, so a locally themed subtree alone does not theme portaled content. Header, main and footer share a 1600px maximum outer frame and `clamp(16px, 2.4vw, 40px)` gutters. Use `ui-app-frame` on main; shared header/footer components apply that frame internally. Reading/settings sections remain capped at 640px, short forms at 480px, and lists at 1600px within the available frame space. Product root token overrides and explicit component classes remain supported. The [application layout guide](application-layout.md) explains composition, adoption and consistent overrides.
+Use `.light`/`.dark` on the document root to override OS theme. Root `data-ui-density="compact"` changes spacing, not text size: default controls are 40px, compact 36px, small screens/coarse pointers at least 44px. Portals use document-level styles/density, so a locally themed subtree alone does not theme portaled content. Header, main and footer share a 1600px maximum outer frame and `clamp(16px, 2.4vw, 40px)` gutters. Use `ui-app-frame` on main; shared header/footer components apply that frame internally. Reading/settings sections remain capped at 640px, short forms at 480px, and lists at 1600px within the available frame space. Product root token overrides and explicit component classes remain supported. The [application layout guide](application-layout.md) explains composition, adoption and consistent overrides, including the 0.9.0 default stable root gutter, the coupled html opt-out and unchanged classic/overlay toolbar tokens. Theme-only/JS-only imports do not set document policy.
 
 `className` is merged by `cn` (clsx + tailwind-merge). Consumer classes and primitive props remain available. Recheck specificity, text/control/focus contrast, mobile targets and portaled content after overriding. Override semantic color companions together; do not replace only an action hue or remove focus outlines. Reduced-motion rules remove shared transitions/animations. Custom consumer animation still needs its own reduced-motion treatment.
 

package/docs/components/naeil-header.md

@@ -1,6 +1,6 @@
 # NaeilHeader — branded whole-header composition
 
-The published registry baseline is **@naeil/ui 0.7.2**. This guide also describes the **unpublished 0.8.0 candidate** APIs below. Install exact `@naeil/ui@0.7.2` for the published API; the new Home props require the reviewed 0.8.0 archive. Hosted Docs and service activation have separate receipts. See [release identities and publication status](../package-release.md#publication-and-deployment). Import this opt-in React-only entry when an application inherits the actual naeil.dev header. Generic `Navigation` from `/ui` remains available for different product menus.
+Exact **@naeil/ui 0.8.0 is published** (registry `next`; `latest=0.7.2` verified 2026-10-29). These Home APIs are available in that exact version. The **0.9.0 candidate** adds shared root reservation and remains unpublished. Hosted Docs and service activation have separate receipts. See [release identities](../package-release.md#publication-and-deployment).
 
 ```tsx
 import { NaeilHeader, NaeilHeaderAccountControl } from '@naeil/ui/naeil-header';
@@ -71,16 +71,16 @@ This entry requires no Next.js, next-intl, site session/auth backend, full appli
 
 Verify actual packed consumption, Storybook behavior and rendered comparisons at matching viewport/language/theme. Source imports alone do not prove visual parity. Native Safari, devices, assistive technology, full OAuth and unresolved accessibility observations retain the [documented support limits](../design/public-ui-support.md).
 
-Pair owned-service headers with [NaeilFooter](naeil-footer.md). The 0.7.2 source is `40a3928e24cd2f0141be3e605eed0a75260938fd`. Both 0.7.2 and the 0.8.0 candidate emit package version and chrome contract `1`; archive identities, maintained guidance and hosted Docs remain separate evidence.
+Pair owned-service headers with [NaeilFooter](naeil-footer.md). The 0.7.2 source is `40a3928e24cd2f0141be3e605eed0a75260938fd`. Both 0.7.2 and 0.8.0 emit package version and chrome contract `1`; archive identities, maintained guidance and hosted Docs remain separate evidence.
 
 
-## Host typography and mobile handoff (0.8.0 candidate)
+## Host typography and mobile handoff (0.8.0)
 
 Import either `globals.css` or `theme.css` plus `components.css`, and register the installed `dist` with Tailwind `@source`. Header/footer roots and the actual navigation popover, sheet, account menu and locale menu Content elements carry `data-naeil-chrome` and `lang=locale`; the locale Select Content also carries `data-naeil-locale-menu`. Generic Navigation/Select/DropdownMenu do not acquire these markers. Do not identify chrome by option text or by the presence of a Japanese body option.
 
 Marker-and-language-scoped final typography uses a package-local font stack and explicit sizes, weights, line heights, letter spacing and smoothing. It supports a host `@theme` / `@theme inline` with different text tokens/font stacks and unlayered element/role rules at Home's specificity, including `(0,3,0)` `:root[attr] [role="menuitem"]` and Home's `[role="dialog"] p` rules. Host rules can load before or after either supported package CSS entry; owned text declarations outrank them. Rules with `!important` or IDs aimed at chrome are outside this guarantee. Ordinary body Select/menu/dialog typography remains host-owned; custom slot content remains consumer-owned. Font files are still consumer-supplied; Japanese chrome and portals use Noto Sans JP even when the document language differs.
 
-A controlled mobile sheet defers its shared account action until the account menu and sheet finish closing and restore a surviving header control. The consumer still owns dirty state, confirmation, logout, busy state and the request lock; `onLogout` must tolerate this asynchronous handoff. When a confirmation saves its opener, its restoration policy must also handle a viewport change hiding that opener. Verify normal and reduced motion, cancellation after a desktop transition, pending requests, reopen and retry in the actual application; the candidate's unresolved acceptance gates are not a production guarantee.
+A controlled mobile sheet defers its shared account action until the account menu and sheet finish closing and restore a surviving header control. The consumer still owns dirty state, confirmation, logout, busy state and the request lock; `onLogout` must tolerate this asynchronous handoff. When a confirmation saves its opener, its restoration policy must also handle a viewport change hiding that opener. Verify normal and reduced motion, cancellation after a desktop transition, pending requests, reopen and retry in the actual application; package verification does not replace actual product acceptance.
 
 The empty-menu desktop exception is intentional B1 compatibility: a zero-width desktop navigation cannot signal the crossing, so the sheet stays open. Escape, its close button, the overlay or a `currentHref` change still close it. Home owns the confirmation's desktop cancel fallback to the visible row account trigger; the package supplies a visible, focusable control and does not implement the confirmation's restoration policy.
 
@@ -94,3 +94,9 @@ The empty-menu desktop exception is intentional B1 compatibility: a zero-width d
 ```
 
 Keep the default theme/locale/separator/account toolbar for this profile; `toolbarSlot` is a compatibility override, not the Home migration path. Omitting all new props preserves the 0.7.2 canonical profile, apart from markers, language correction, release identity and Radix-generated IDs. SVG/Logo IDs and consumer-supplied IDs are not normalized away. See the `docs/superpowers/specs/2026-10-28-canonical-home-chrome.md` acceptance contract for gates and the four allowed Home differences.
+
+## Page-root frame policy (0.9.0 candidate)
+
+Both supported CSS paths obtain the stable root rule and scoped Radix duplicate-compensation correction from `components.css`. Theme-only and JS-only imports do not set document scrolling. Declare `<html data-naeil-scrollbar-gutter="auto">` before first paint to disable both pieces for a custom policy. See [application layout](application-layout.md) for custom-body/scroller/helper-class limits, fallback and the [adopted contract](https://github.com/naeil-dev/naeil-ui/blob/434b7d07235316097ca3a55265ee02c1422b0cfd/docs/superpowers/specs/2026-10-29-page-root-scrollbar-gutter.md) for required probes and capture ordering.
+
+Keep frame/toolbar tokens unchanged. The Japanese signed-out canonical login toolbar at 320px is 104px tall under a 15px classic reservation and 44px with overlay. The owner's F3 decision accepts this wrap on naeil.dev itself. Home Workspace uses the shared account control/full footer; its signed-out LoginGate omits the auth slot/separator and footer (F1/F2). Neither Home profile is required to wrap. D1–D4 and the exact F3 auth-composition boundary remain; compare matching roots and auth-slot compositions before applying tolerances.

package/docs/components/naeil-locale.md

@@ -0,0 +1,46 @@
+# Owned-service language runtime
+
+The opt-in `@naeil/ui/naeil-locale` entries support the registered naeil Next applications. English uses `/`, Korean `/ko`, and Japanese `/ja`, including deep routes. The URL determines the language. Cookie and browser preferences never redirect or overwrite it. The existing public `i18n/routing`, `Nav` and `Footer` APIs retain their previous behavior.
+
+Use exact `next-intl@4.14.8` with the shared server/client entries. Next and React remain external peers. Standalone header/footer imports do not require Next or next-intl.
+
+## Entries and ownership
+
+| Import | Responsibility |
+| --- | --- |
+| `@naeil/ui/naeil-locale` | Supported locales, strict service/route registry, `localePath`, `localeHref`, legacy receiving aliases and logical-route comparison |
+| `/naeil-locale/server` | `createNaeilLocaleProxy`, `createNaeilRequestConfig`, request access markers and `localeMetadata` |
+| `/naeil-locale/client` | Root `NaeilLocaleController`, locale `NaeilLocaleProvider`, `useLocaleController`, `useLocaleBeforeUnload` |
+| `/naeil-locale/messages` | Selected common/application JSON loading and namespace merge |
+| `/naeil-locale/checker` | Three-language key, nonempty value, ICU syntax and argument compatibility checks |
+| `/naeil-locale/chrome` | Existing header/account/footer presentation using the provider's selected common dictionary |
+
+Place the controller and app-owned session/business store in `app/layout.tsx`, above `[locale]`. Place the shared provider in `app/[locale]/layout.tsx` using the validated locale and server-loaded messages. Keep raw input, dialogs, undo, save/run controllers, stream readers and document-departure guards in the root lifetime. Locale remounts must not save, abort, reset, or seed a retained draft from older server props. Translate message keys at the rendering boundary, not inside persistent business state.
+
+The shared config sets `localePrefix: "as-needed"`, `localeDetection: false`, `localeCookie: false`, and `alternateLinks: false`. Consumers set Next's `skipProxyUrlNormalize: true` and `skipTrailingSlashRedirect: true`; normalization follows the existing protocol/auth checks. A trusted ingress consumer may pass `requestOrigin: request => existingValidatedRequestUrl(request).origin` to the proxy. This keeps alias redirects and internal rewrites on the validated authority, including local127.0.0.1 deployments. Never derive it from an unvalidated forwarded host.
+
+```tsx
+// app/layout.tsx — inside the existing html/body
+<NaeilLocaleController service="estimate" preferenceWritesEnabled={false}>
+  <BusinessStateProvider>{children}</BusinessStateProvider>
+</NaeilLocaleController>
+
+// app/[locale]/layout.tsx — validate locale and setRequestLocale on the server
+<NaeilLocaleProvider locale={locale} messages={await getMessages()}>
+  {children}
+</NaeilLocaleProvider>
+```
+
+Use `createNaeilRequestConfig({namespace: "estimate", messages: {en: () => import("../../messages/en.json"), ko: () => import("../../messages/ko.json"), ja: () => import("../../messages/ja.json")}})` in the next-intl request config. Every app JSON has exactly its own namespace. The package owns `naeil`; do not copy it into an app. The shared checker is a required build gate. The loader imports only the selected app dictionary and shared dictionary; an observable English recovery handles unexpected runtime omissions. Such omissions still fail acceptance.
+
+Render complete paths with `localePath` for same-service navigation and `localeHref` for owned service links. Pass those paths to base Next Link/router or anchors without another locale option. The controller performs `router.replace(href, {scroll: false})`, serializes requests and waits for the matching provider arrival. It restores a stable `data-naeil-focus-id`, input `name`, or `id`. Only a successful explicit selection may write preference; history, prefetch and direct visits do not. Storage failure cannot block a path change.
+
+The canonical chrome can be imported from `/naeil-locale/chrome` under the shared provider. Existing `/naeil-header` and `/naeil-footer` remain standalone compatibility adapters and include the small three-language common dictionary. Consumer Link, auth, save guards, frame overrides, desktop/mobile account locks and project data remain consumer-owned.
+
+## Security and rollout
+
+The proxy runs exact existing protocol boundaries first, strips external private markers, strictly classifies UI paths, applies the existing app authorizer, and then runs next-intl. Protected entries without an authorizer fail closed. A marker is only a rendering hint: every protected server data read must independently authorize. RSC denial renders a valid localized access boundary and retains the root draft; it must not send login HTML or redirect an in-progress editor to another document. Keep the root beforeunload guard active during RSC failure and access recovery.
+
+`localePath` is not an auth-return validator. Keep existing exact return/invite/callback/relay origin and envelope validation. Protocol paths stay outside `[locale]`; localized protocol aliases are rejected. Public metadata advertises only available translations. Protected/auth/error UI is noindex without SEO alternates.
+
+Receiver deployment and sending are separate gates. `preferenceWritesEnabled` defaults to false. Before first exposure, validate a separate receiver-compatible fallback or the previous build's safe rejection of new paths. After all required receiver and auth receipts pass, enable the reviewed cross-service links and explicit preference writes. Keep package, source, hosted Docs, app identities, activation times and rollback receipts separate. Home and Baby are outside this migration.