@kiefer-tek/sophea-design-system 0.15.12 → 0.17.0

package/dist/components/DetailSection/DetailSection.d.ts

@@ -0,0 +1,79 @@
+import { ReactNode } from 'react';
+export interface CopyButtonProps {
+    /** Returns the plain-text payload to copy (computed lazily on click). */
+    getText: () => string;
+    /** Used in the title/aria ("Copy {label}"). */
+    label: string;
+    /** Extra classes on the button root (e.g. a hover-reveal utility). */
+    className?: string;
+}
+/**
+ * Copy-to-clipboard button: a Copy glyph that flips to a Check for ~1.4s after
+ * a successful copy. Visible by default; pass a className to control reveal
+ * (OverviewCard reveals it on the card's hover).
+ */
+export declare function CopyButton({ getText, label, className }: CopyButtonProps): import("react/jsx-runtime").JSX.Element;
+export interface DetailPanelProps {
+    children: ReactNode;
+    /** Fill a height-constrained flex parent so the list scrolls inside via
+     *  DetailScrollRegion while the toolbar stays pinned. Omit for normal flow. */
+    fill?: boolean;
+    className?: string;
+}
+/** Bordered card container for a tab section. */
+export declare function DetailPanel({ children, fill, className }: DetailPanelProps): import("react/jsx-runtime").JSX.Element;
+/** The scrolling body under a fixed toolbar — only meaningful inside a `fill`
+ *  panel. `data-scroll-region` lets a consumer centre an item inside it. */
+export declare function DetailScrollRegion({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export interface DetailToolbarProps {
+    value: string;
+    onChange: (v: string) => void;
+    placeholder: string;
+    ariaLabel?: string;
+    clearLabel?: string;
+    /** Right-aligned action slot (e.g. a Copy button, a Select, an export). */
+    children?: ReactNode;
+}
+/** Search toolbar: a SearchInput on the left + an optional right action slot. */
+export declare function DetailToolbar({ value, onChange, placeholder, ariaLabel, clearLabel, children }: DetailToolbarProps): import("react/jsx-runtime").JSX.Element;
+/** Divided list wrapper for section rows. */
+export declare function DetailList({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export interface DetailRowProps {
+    icon?: ReactNode;
+    children: ReactNode;
+    onClick?: () => void;
+}
+/** A section row: leading icon + content + a reveal chevron on hover (when
+ *  clickable). The clickable hover affordance is a title underline. */
+export declare function DetailRow({ icon, children, onClick }: DetailRowProps): import("react/jsx-runtime").JSX.Element;
+/** Centered italic empty message inside a panel. */
+export declare function DetailEmptyRow({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export interface OverviewCardProps {
+    icon: ReactNode;
+    title: string;
+    count?: number;
+    children: ReactNode;
+    onViewAll?: () => void;
+    viewAllLabel?: string;
+    /** When set, a hover-revealed copy button appears in the header. Returns the
+     *  section's plain-text representation. */
+    copyText?: () => string;
+    copyLabel?: string;
+}
+/** Overview dashboard card: icon + title + count header (with an optional
+ *  hover-revealed copy button), a body of jump rows, and an optional
+ *  full-width "View all" footer. */
+export declare function OverviewCard({ icon, title, count, children, onViewAll, viewAllLabel, copyText, copyLabel, }: OverviewCardProps): import("react/jsx-runtime").JSX.Element;
+export interface OverviewBulletProps {
+    children: ReactNode;
+    onClick?: () => void;
+}
+/** A bullet jump-row inside an OverviewCard. */
+export declare function OverviewBullet({ children, onClick }: OverviewBulletProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DetailSection.d.ts.map

package/dist/components/DetailSection/DetailSection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DetailSection.d.ts","sourceRoot":"","sources":["../../../src/components/DetailSection/DetailSection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AA2DjD,MAAM,WAAW,eAAe;IAC9B,yEAAyE;IACzE,OAAO,EAAE,MAAM,MAAM,CAAC;IACtB,+CAA+C;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,eAAe,2CAmBxE;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB;mFAC+E;IAC/E,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,iDAAiD;AACjD,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,IAAY,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAElF;AAED;4EAC4E;AAC5E,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAMvE;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,iFAAiF;AACjF,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,kBAAkB,2CAelH;AAED,6CAA6C;AAC7C,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAE/D;AAED,MAAM,WAAW,cAAc;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;uEACuE;AACvE,wBAAgB,SAAS,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,cAAc,2CASpE;AAED,oDAAoD;AACpD,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAEnE;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;+CAC2C;IAC3C,QAAQ,CAAC,EAAE,MAAM,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;oCAEoC;AACpC,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,KAAK,EACL,KAAK,EACL,QAAQ,EACR,SAAS,EACT,YAAyB,EACzB,QAAQ,EACR,SAAS,GACV,EAAE,iBAAiB,2CAwBnB;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,gDAAgD;AAChD,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,mBAAmB,2CAcxE"}

package/dist/components/DetailSection/index.d.ts

@@ -0,0 +1,3 @@
+export { DetailPanel, DetailScrollRegion, DetailToolbar, DetailList, DetailRow, DetailEmptyRow, OverviewCard, OverviewBullet, CopyButton, } from './DetailSection';
+export type { DetailPanelProps, DetailToolbarProps, DetailRowProps, OverviewCardProps, OverviewBulletProps, CopyButtonProps, } from './DetailSection';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/DetailSection/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DetailSection/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,kBAAkB,EAClB,aAAa,EACb,UAAU,EACV,SAAS,EACT,cAAc,EACd,YAAY,EACZ,cAAc,EACd,UAAU,GACX,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,gBAAgB,EAChB,kBAAkB,EAClB,cAAc,EACd,iBAAiB,EACjB,mBAAmB,EACnB,eAAe,GAChB,MAAM,iBAAiB,CAAC"}

package/dist/components/index.d.ts

@@ -53,6 +53,7 @@ export * from './AIAnatomy';
 export * from './Citation';
 export * from './EmptyState';
 export * from './Card';
+export * from './DetailSection';
 export * from './AnimatedBorder';
 export * from './VisuallyHidden';
 export * from './SkipLink';

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,WAAW,CAAC;AAC1B,cAAc,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,WAAW,CAAC;AAC1B,cAAc,uBAAuB,CAAC"}

package/dist/index.css

@@ -5820,15 +5820,15 @@ a.sn-Button-module__btn--Fx11X[aria-disabled="true"] {
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
 }
 
-/* Pill — a substantial segmented strip: bordered track, solid brand pill
-   for the active tab with white text (4.6:1 on --theme-primary-05, AA in
-   both themes — replaces the washed-out action-link-02 fill that needed a
-   per-theme text override). */
+/* Pill — a bordered tab track with a brand-gradient fill behind the active tab
+   (white text holds ≥4.5:1; the gradient stops at --theme-primary-05). Radii are
+   moderate (--radius-lg track / --radius-md pills) to match buttons & cards —
+   the old fully-round 9999px read as out of place next to them. */
 
 .sn-Tabs-module__list-pill--B-FxP {
   background: var(--surface-s3);
   border: 1px solid var(--border-02);
-  border-radius: 9999px;
+  border-radius: var(--radius-lg);
   padding: 4px;
   gap: 4px;
 }
@@ -5837,7 +5837,7 @@ a.sn-Button-module__btn--Fx11X[aria-disabled="true"] {
   padding: 7px 16px;
   font-size: 13px;
   color: var(--text-04);
-  border-radius: 9999px;
+  border-radius: var(--radius-md);
   transition: color var(--duration-fast, 120ms) var(--ease-out, ease-out);
 }
 
@@ -5852,11 +5852,13 @@ a.sn-Button-module__btn--Fx11X[aria-disabled="true"] {
 
 .sn-Tabs-module__indicator-pill--ltyFZ {
   /* Inset to sit inside the 4px track padding; no drop shadow — it bled
-     into the bottom inset and made the pill look like it touched the track. */
+     into the bottom inset and made the pill look like it touched the track.
+     Brand-gradient fill (matches the primary-button CTA) — theme-stable; white
+     trigger text holds ≥4.5:1 since the gradient stops at --theme-primary-05. */
   top: 4px;
   height: calc(100% - 8px);
-  background: var(--theme-primary-05);
-  border-radius: 9999px;
+  background-image: var(--sophea-gradient-primary-button);
+  border-radius: var(--radius-md);
 }
 
 @media (prefers-reduced-motion: reduce) {
@@ -6914,6 +6916,375 @@ tbody tr:hover .sn-Table-module__td--jv9tA {
 .dark .sn-Card-module__footer--Mu-JC {
   background: var(--surface-s3);
 }
+/* Detail-section primitives — the shared shell for tabbed detail pages
+   (meeting detail, project detail). Presentational only; each page feeds its
+   own data into the same panels / rows / cards so the surfaces stay identical.
+   Tokens only (no hardcoded colours); see Guidelines / Scrollable list pages
+   (Shape B) for the page frame these sit in. */
+
+/* ── Panel ───────────────────────────────────────────────────────────────── */
+.sn-DetailSection-module__panel--rvOxd {
+  display: flex;
+  flex-direction: column;
+  border-radius: 16px;
+  border: 1px solid var(--border-02);
+  background: var(--surface-s2);
+  padding: 20px;
+}
+/* Fill a height-constrained flex parent; the list scrolls inside via
+   DetailScrollRegion while the toolbar stays pinned. */
+.sn-DetailSection-module__panelFill--UPHdg {
+  min-height: 0;
+  flex: 1 1 0%;
+}
+
+/* ── Scroll region ───────────────────────────────────────────────────────── */
+.sn-DetailSection-module__scrollRegion--wI64N {
+  min-height: 0;
+  flex: 1 1 0%;
+  overflow-y: auto;
+  overflow-x: hidden;
+  padding-right: 4px;
+  padding-bottom: 12px;
+}
+
+/* ── Toolbar ─────────────────────────────────────────────────────────────── */
+.sn-DetailSection-module__toolbar--hlS2f {
+  margin-bottom: 16px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.sn-DetailSection-module__toolbarSearch--KB3Vb {
+  min-width: 0;
+  max-width: 420px;
+  flex: 1 1 0%;
+}
+.sn-DetailSection-module__toolbarActions--OkR79 {
+  margin-left: auto;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+/* ── List + rows ─────────────────────────────────────────────────────────── */
+.sn-DetailSection-module__list--ksAKO {
+  list-style: none;
+  margin: 0 -8px;
+  padding: 0;
+}
+.sn-DetailSection-module__list--ksAKO > li + li {
+  border-top: 1px solid var(--border-01);
+}
+.sn-DetailSection-module__row--aTiRQ {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  border-radius: 6px;
+  padding: 10px 8px;
+}
+.sn-DetailSection-module__rowClickable--E9Dce {
+  cursor: pointer;
+}
+.sn-DetailSection-module__rowIcon--E6msp {
+  margin-top: 2px;
+  flex-shrink: 0;
+  display: flex;
+  color: var(--theme-primary-05);
+}
+.sn-DetailSection-module__rowContent--f0lcw {
+  min-width: 0;
+  flex: 1 1 0%;
+}
+/* Hover affordance is a title underline — the content's first child — not a
+   surface fill. */
+.sn-DetailSection-module__rowClickable--E9Dce:hover .sn-DetailSection-module__rowContent--f0lcw > :first-child {
+  text-decoration: underline;
+  text-underline-offset: 2px;
+}
+.sn-DetailSection-module__rowChevron--mcYhI {
+  margin-top: 2px;
+  width: 16px;
+  height: 16px;
+  flex-shrink: 0;
+  color: var(--text-03);
+  opacity: 0;
+  transition: opacity 0.15s ease;
+}
+.sn-DetailSection-module__rowClickable--E9Dce:hover .sn-DetailSection-module__rowChevron--mcYhI {
+  opacity: 1;
+}
+
+.sn-DetailSection-module__emptyRow--KlqBi {
+  margin: 0;
+  padding: 32px 0;
+  text-align: center;
+  font-size: 14px;
+  font-style: italic;
+  color: var(--text-03);
+}
+
+/* ── Overview card ───────────────────────────────────────────────────────── */
+.sn-DetailSection-module__overviewCard--QIw-m {
+  display: flex;
+  flex-direction: column;
+  border-radius: 16px;
+  border: 1px solid var(--border-02);
+  background: var(--surface-s2);
+  padding: 20px;
+}
+.sn-DetailSection-module__overviewHeader--fUUF1 {
+  margin-bottom: 12px;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+.sn-DetailSection-module__overviewIcon--dFo9r {
+  display: flex;
+  color: var(--theme-primary-05);
+}
+.sn-DetailSection-module__overviewTitle--Q1e1y {
+  margin: 0;
+  font-size: 16px;
+  font-weight: 600;
+  color: var(--text-05);
+}
+.sn-DetailSection-module__overviewCount--dM4fD {
+  margin-left: 4px;
+  font-weight: 400;
+  color: var(--text-03);
+}
+.sn-DetailSection-module__overviewSpacer--C9rb0 {
+  flex: 1 1 0%;
+}
+.sn-DetailSection-module__overviewBody--YPzkN {
+  flex: 1 1 0%;
+}
+.sn-DetailSection-module__viewAll--R-nHE {
+  margin-top: 12px;
+  display: inline-flex;
+  width: 100%;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  border-radius: 10px;
+  border: 1px solid var(--border-02);
+  background: var(--surface-s2);
+  padding: 8px 14px;
+  font-size: 12px;
+  font-weight: 500;
+  color: var(--theme-primary-05);
+  cursor: pointer;
+  transition: background-color 0.15s ease, color 0.15s ease;
+}
+.sn-DetailSection-module__viewAll--R-nHE:hover {
+  background: var(--surface-s3);
+  color: var(--theme-primary-06);
+}
+
+/* Header copy button: hidden at rest, revealed on the card's hover or when the
+   button itself takes keyboard focus. */
+.sn-DetailSection-module__overviewCopy--H-ITM {
+  opacity: 0;
+  transition: opacity 0.15s ease;
+}
+.sn-DetailSection-module__overviewCard--QIw-m:hover .sn-DetailSection-module__overviewCopy--H-ITM,
+.sn-DetailSection-module__overviewCard--QIw-m:focus-within .sn-DetailSection-module__overviewCopy--H-ITM {
+  opacity: 1;
+}
+
+/* ── Overview bullet (jump row) ──────────────────────────────────────────── */
+.sn-DetailSection-module__bullet--ENOxX {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  gap: 10px;
+  border-radius: 6px;
+  padding: 8px 6px;
+  text-align: left;
+  background: transparent;
+  border: 0;
+  color: inherit;
+  font: inherit;
+}
+.sn-DetailSection-module__bulletClickable--E-sdz {
+  cursor: pointer;
+}
+.sn-DetailSection-module__bulletDisabled--U-GZL {
+  cursor: default;
+}
+.sn-DetailSection-module__bulletDot--z0w3u {
+  width: 6px;
+  height: 6px;
+  flex-shrink: 0;
+  border-radius: 9999px;
+  background: var(--theme-primary-05);
+}
+.sn-DetailSection-module__bulletText--qeb-2 {
+  min-width: 0;
+  flex: 1 1 0%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: 14px;
+  color: var(--text-05);
+  text-underline-offset: 2px;
+}
+.sn-DetailSection-module__bulletClickable--E-sdz:hover .sn-DetailSection-module__bulletText--qeb-2 {
+  text-decoration: underline;
+}
+.sn-DetailSection-module__bulletChevron--lvzGx {
+  width: 14px;
+  height: 14px;
+  flex-shrink: 0;
+  color: var(--text-03);
+}
+.sn-SearchInput-module__wrapper--q8GEq {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  font-family: "Geist", ui-sans-serif, system-ui, sans-serif;
+  min-width: 0;
+}
+
+.sn-SearchInput-module__label--4lcBT {
+  font-size: 12px;
+  font-weight: 500;
+  color: var(--text-04);
+  letter-spacing: -0.005em;
+}
+
+.sn-SearchInput-module__field--ONU-p {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 200px;
+  /* Defaults: an elevated field on a page (s3 fill + a >=3:1 border that clears
+     SC 1.4.11 in both themes — --border-04 = #7f8da1/#6b7a90). Both are tunable
+     so a host can soften them where the default reads as a bright floating box
+     — e.g. a search field seated in the app-shell header over a flat-dark /
+     glass surface. */
+  background: var(--search-input-bg, var(--surface-s3));
+  border: 1px solid var(--search-input-border, var(--border-04));
+  border-radius: 10px;
+  padding: 10px 12px;
+  transition:
+    border-color var(--duration-fast, 120ms) var(--ease-out, ease-out),
+    box-shadow var(--duration-fast, 120ms) var(--ease-out, ease-out);
+}
+
+.sn-SearchInput-module__field--ONU-p:focus-within {
+  border-color: var(--theme-primary-06);
+  outline: 3px solid var(--sophea-focus-halo);
+  outline-offset: 0;
+}
+
+.sn-SearchInput-module__field-error--XjiQc {
+  border-color: var(--status-error-05, #dc2626);
+}
+
+.sn-SearchInput-module__field-error--XjiQc:focus-within {
+  outline-color: rgba(220, 38, 38, 0.25);
+}
+
+.sn-SearchInput-module__icon--I9nEG {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: var(--text-03, #6b7a90);
+}
+
+.sn-SearchInput-module__spin--kpH-o {
+  animation: sn-SearchInput-module__sds-search-spin--cmFTn 900ms linear infinite;
+}
+
+.sn-SearchInput-module__input--rhhzi {
+  flex: 1 1 auto;
+  min-width: 0;
+  border: 0;
+  background: transparent;
+  outline: none;
+  font: inherit;
+  font-size: 14px;
+  line-height: 1.4;
+  color: var(--text-05, #0f172a);
+}
+
+/* Strip the WebKit search clear button — we ship our own. */
+.sn-SearchInput-module__input--rhhzi::-webkit-search-cancel-button {
+  appearance: none;
+}
+
+.sn-SearchInput-module__input--rhhzi::placeholder {
+  color: var(--text-04); /* placeholder is text: 4.5:1 AA — text-02 measured 2.0:1 dark / 2.4:1 light */
+}
+
+.sn-SearchInput-module__input--rhhzi:disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
+.sn-SearchInput-module__trailing--ZJbHB {
+  display: inline-flex;
+  align-items: center;
+  flex-shrink: 0;
+  color: var(--text-03, #6b7a90);
+}
+
+.sn-SearchInput-module__clear--r3kgN {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  padding: 2px;
+  margin: -2px;
+  background: transparent;
+  border: 0;
+  border-radius: 999px;
+  color: var(--text-03);
+  cursor: pointer;
+}
+
+.sn-SearchInput-module__clear--r3kgN:hover:not(:disabled) {
+  background: rgba(15, 23, 42, 0.08);
+  color: var(--text-05);
+}
+
+.sn-SearchInput-module__clear--r3kgN:focus-visible {
+  outline: 2px solid var(--sophea-focus-ring);
+  outline-offset: 2px;
+}
+
+.sn-SearchInput-module__clear--r3kgN:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.sn-SearchInput-module__hint--6W4as {
+  font-size: 12px;
+  color: var(--text-04);
+}
+
+.sn-SearchInput-module__error--Ewib2 {
+  font-size: 12px;
+  color: var(--status-error-50, #dc2626);
+}
+
+@keyframes sn-SearchInput-module__sds-search-spin--cmFTn {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .sn-SearchInput-module__field--ONU-p {
+    transition: none;
+  }
+  .sn-SearchInput-module__spin--kpH-o {
+    animation: none;
+  }
+}
 .sn-SkipLink-module__link--bc0O7 {
   /* Off-screen until focused. Stays in the DOM so screen-reader navigation
      still picks it up; only the visual sits out of view. */
@@ -7689,152 +8060,6 @@ tbody tr:hover .sn-Table-module__td--jv9tA {
     transition: none;
   }
 }
-.sn-SearchInput-module__wrapper--q8GEq {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-  font-family: "Geist", ui-sans-serif, system-ui, sans-serif;
-  min-width: 0;
-}
-
-.sn-SearchInput-module__label--4lcBT {
-  font-size: 12px;
-  font-weight: 500;
-  color: var(--text-04);
-  letter-spacing: -0.005em;
-}
-
-.sn-SearchInput-module__field--ONU-p {
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  min-width: 200px;
-  /* Defaults: an elevated field on a page (s3 fill + a >=3:1 border that clears
-     SC 1.4.11 in both themes — --border-04 = #7f8da1/#6b7a90). Both are tunable
-     so a host can soften them where the default reads as a bright floating box
-     — e.g. a search field seated in the app-shell header over a flat-dark /
-     glass surface. */
-  background: var(--search-input-bg, var(--surface-s3));
-  border: 1px solid var(--search-input-border, var(--border-04));
-  border-radius: 10px;
-  padding: 10px 12px;
-  transition:
-    border-color var(--duration-fast, 120ms) var(--ease-out, ease-out),
-    box-shadow var(--duration-fast, 120ms) var(--ease-out, ease-out);
-}
-
-.sn-SearchInput-module__field--ONU-p:focus-within {
-  border-color: var(--theme-primary-06);
-  outline: 3px solid var(--sophea-focus-halo);
-  outline-offset: 0;
-}
-
-.sn-SearchInput-module__field-error--XjiQc {
-  border-color: var(--status-error-05, #dc2626);
-}
-
-.sn-SearchInput-module__field-error--XjiQc:focus-within {
-  outline-color: rgba(220, 38, 38, 0.25);
-}
-
-.sn-SearchInput-module__icon--I9nEG {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  color: var(--text-03, #6b7a90);
-}
-
-.sn-SearchInput-module__spin--kpH-o {
-  animation: sn-SearchInput-module__sds-search-spin--cmFTn 900ms linear infinite;
-}
-
-.sn-SearchInput-module__input--rhhzi {
-  flex: 1 1 auto;
-  min-width: 0;
-  border: 0;
-  background: transparent;
-  outline: none;
-  font: inherit;
-  font-size: 14px;
-  line-height: 1.4;
-  color: var(--text-05, #0f172a);
-}
-
-/* Strip the WebKit search clear button — we ship our own. */
-.sn-SearchInput-module__input--rhhzi::-webkit-search-cancel-button {
-  appearance: none;
-}
-
-.sn-SearchInput-module__input--rhhzi::placeholder {
-  color: var(--text-04); /* placeholder is text: 4.5:1 AA — text-02 measured 2.0:1 dark / 2.4:1 light */
-}
-
-.sn-SearchInput-module__input--rhhzi:disabled {
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.sn-SearchInput-module__trailing--ZJbHB {
-  display: inline-flex;
-  align-items: center;
-  flex-shrink: 0;
-  color: var(--text-03, #6b7a90);
-}
-
-.sn-SearchInput-module__clear--r3kgN {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  padding: 2px;
-  margin: -2px;
-  background: transparent;
-  border: 0;
-  border-radius: 999px;
-  color: var(--text-03);
-  cursor: pointer;
-}
-
-.sn-SearchInput-module__clear--r3kgN:hover:not(:disabled) {
-  background: rgba(15, 23, 42, 0.08);
-  color: var(--text-05);
-}
-
-.sn-SearchInput-module__clear--r3kgN:focus-visible {
-  outline: 2px solid var(--sophea-focus-ring);
-  outline-offset: 2px;
-}
-
-.sn-SearchInput-module__clear--r3kgN:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-.sn-SearchInput-module__hint--6W4as {
-  font-size: 12px;
-  color: var(--text-04);
-}
-
-.sn-SearchInput-module__error--Ewib2 {
-  font-size: 12px;
-  color: var(--status-error-50, #dc2626);
-}
-
-@keyframes sn-SearchInput-module__sds-search-spin--cmFTn {
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .sn-SearchInput-module__field--ONU-p {
-    transition: none;
-  }
-  .sn-SearchInput-module__spin--kpH-o {
-    animation: none;
-  }
-}
 .sn-PinInput-module__wrapper--3WAh7 {
   display: flex;
   flex-direction: column;