feat(storybook): refine Manager LNB, HM Color and Patterns/Layout/LNB

- Manager LNB: 246px width, 16px brand title, 14px/700 menu and section
  titles, depth1 48px / depth2+ 42px rows, 24px section gap
- Foundation: rename Color to HM Color (Story ID foundation-color--all kept),
  remove Company Colors subtitle and the page-title bottom border
- Patterns/Layout/LNB: Storybook-only overrides in lnb.stories.css
  (240px column, 212px min width, 14px menu, 48/42px rows, profile text,
  group dividers); representative board dividers per section
- Sync story inventory and docs (brand-color-steps, lnb); shared package
  defaults and tokens are unchanged

src/patterns/lnb.stories.css

@@ -0,0 +1,113 @@
+/* Storybook presentation only: Patterns/Layout/LNB Stories. Scoped by the decorator wrapper in lnb.stories.tsx, so the shared
+   @hm-design/ui LNB Pattern, its tokens and every other Story keep their values.
+   - min-width 212px: a floor, not a fixed width. The column follows --hm-lnb-width (240px from 1024px, see below) and may be wider.
+   - menu font 14px: --hm-lnb-item-font-size is redefined for this subtree; weight (700) and line height (28px) stay.
+   - row height: depth1 48px, depth2 and deeper 42px. Heights come from min-height + vertical padding (not a fixed height), so a
+     label that wraps grows the row instead of being clipped. Current and hover only change color/background, not the height. */
+.hm-lnb-story {
+  display: contents;
+  --hm-lnb-item-font-size: 14px;
+  /* Existing variable: min-height of every item and group trigger (used by nothing else). */
+  --hm-lnb-item-min-height: 48px;
+  /* Existing variable: bottom padding of [data-slot="lnb-brand"] (22px by default; top 0 and the 30px sides are unchanged). */
+  --hm-lnb-brand-padding-bottom: 8px;
+}
+.hm-lnb-story [data-slot="lnb"] {
+  min-width: 212px;
+}
+/* PC column width 240px through the existing --hm-lnb-width (the column, the Story grid track and the menu row offset all read it).
+   Only from 1024px: the package sets --hm-lnb-width to 0px below that and collapses the column, which must keep working. */
+@media (min-width: 1024px) {
+  .hm-lnb-story {
+    --hm-lnb-width: 240px;
+  }
+}
+
+/* Profile text (PC column): name (strong) 14px, description (p) 12px with no top margin, both 700. The package's existing 1px text
+   stroke on strong/p stays as is; the color and the 1.5 line-height ratio are unchanged (21px + 18px lines in the 48px profile).
+   The sizes use the existing profile variables; the container gets the name size. */
+.hm-lnb-story {
+  --hm-lnb-profile-name-size: 14px;
+  --hm-lnb-profile-description-size: 12px;
+}
+.hm-lnb-story [data-slot="lnb"] [data-slot="lnb-profile-text"] {
+  font-size: 14px;
+}
+.hm-lnb-story [data-slot="lnb"] [data-slot="lnb-profile-text"] :is(strong, p) {
+  font-weight: 700;
+}
+.hm-lnb-story [data-slot="lnb"] [data-slot="lnb-profile-text"] p {
+  margin-top: 0;
+}
+/* Divider lines, same design as the Storybook Manager section divider (manager.css, .sidebar-subheading ::before): a 2px double
+   line (black 30% over white 40%) faded at both ends by a mask. Shared by the profile divider and the group divider below. */
+.hm-lnb-story [data-slot="lnb"] > [data-slot="lnb-profile"]::before,
+.hm-lnb-story .hm-lnb-story-group-divider {
+  height: 2px;
+  background: linear-gradient(var(--hm-lnb-text-stroke-color) 0 50%, color-mix(in srgb, var(--hm-sem-palette-white) 40%, transparent) 50% 100%);
+  mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
+  pointer-events: none;
+}
+/* Above the PC profile, 12px above the block. Like the Manager, it starts after the left inset (--hm-lnb-inset-start, 20px: where
+   the menu rows start) and stops 20px short of the right edge. The profile button is only as wide as its content, so the line is
+   sized from the column width (--hm-lnb-width) and offset back by the button's left margin. It sits in the 22px gap between the
+   menu and the profile, never over the avatar or text. The mobile Sheet profile is not under [data-slot="lnb"]. */
+.hm-lnb-story [data-slot="lnb"] > [data-slot="lnb-profile"] {
+  position: relative;
+}
+.hm-lnb-story [data-slot="lnb"] > [data-slot="lnb-profile"]::before {
+  content: "";
+  position: absolute;
+  top: -12px;
+  left: calc(var(--hm-lnb-inset-start) + 8px - var(--hm-lnb-profile-padding-x));
+  width: calc(var(--hm-lnb-width) - var(--hm-lnb-inset-start) - var(--hm-lnb-inset-end));
+}
+/* Between large menu groups (a role="separator" element, direct child of LNBNav). The package already puts a direct child at the
+   menu rows' x start (margin-left), so only the other margins are set: the line ends 20px short of the column's right edge (the
+   nav is 1px wider than the column), and 12px + 2px + 10px = 24px in total, the Manager's section gap. */
+.hm-lnb-story .hm-lnb-story-group-divider {
+  flex: none; /* keep the 2px in a height-limited (scrolling) menu, where an empty item would otherwise shrink to 0 */
+  margin-top: 12px;
+  margin-right: calc(var(--hm-lnb-inset-end) + 1px);
+  margin-bottom: 10px;
+}
+
+/* Profile in the mobile Sheet (<=1023px): 14px, 700, no text stroke. The Sheet is portaled to body, outside .hm-lnb-story, so the
+   Story marks its LNBProfile with a class instead. The doubled attribute raises specificity above the package's
+   [data-slot="lnb-profile"] strong/p rules. Menu links and the mobile header already have no text stroke. */
+.hm-lnb-story-mobile-profile[data-slot="lnb-profile"] [data-slot="lnb-profile-text"],
+.hm-lnb-story-mobile-profile[data-slot="lnb-profile"] strong {
+  font-size: 14px;
+}
+/* Description: 12px with no top margin, like the PC profile (the line height is unchanged, so the Sheet profile is 4px lower
+   without the old 4px margin: 8 + 20 + 20 + 8 = 56px). */
+.hm-lnb-story-mobile-profile[data-slot="lnb-profile"] p {
+  font-size: 12px;
+  margin-top: 0;
+}
+.hm-lnb-story-mobile-profile[data-slot="lnb-profile"] :is(strong, p) {
+  font-weight: 700;
+  -webkit-text-stroke: 0;
+  paint-order: normal;
+}
+
+/* depth1: nav items and top-level group triggers. The package hard-codes 14px vertical padding (28px line + 28px = 56px). */
+.hm-lnb-story [data-slot="lnb-item"],
+.hm-lnb-story [data-slot="lnb-group-trigger"] {
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+/* depth2: links directly inside a group and nested group triggers (28px line + 14px = 42px). */
+.hm-lnb-story [data-slot="lnb-group-content"] > [data-slot="lnb-item"],
+.hm-lnb-story [data-slot="lnb-group-content"] [data-slot="lnb-group-trigger"] {
+  min-height: 42px;
+  padding-top: 7px;
+  padding-bottom: 7px;
+}
+/* depth3: links in a nested group (24px line + 18px = 42px). --hm-lnb-third-min-height is also the Profile's height, so it is
+   overridden on the row's link instead of through the variable. */
+.hm-lnb-story [data-slot="lnb-group-content"] [data-slot="lnb-third-row"] > [data-slot="lnb-item"] {
+  min-height: 42px;
+  padding-top: 9px;
+  padding-bottom: 9px;
+}