@path58/ui 2.6.0 → 2.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +4 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1119 -890
- package/dist/organisms/ToolSidebar/ToolSidebar.d.ts +60 -0
- package/dist/organisms/ToolSidebar/ToolSidebar.d.ts.map +1 -0
- package/dist/organisms/ToolSidebar/index.d.ts +3 -0
- package/dist/organisms/ToolSidebar/index.d.ts.map +1 -0
- package/dist/organisms/ToolSidebarHost/ToolSidebarHost.d.ts +18 -0
- package/dist/organisms/ToolSidebarHost/ToolSidebarHost.d.ts.map +1 -0
- package/dist/organisms/ToolSidebarHost/index.d.ts +3 -0
- package/dist/organisms/ToolSidebarHost/index.d.ts.map +1 -0
- package/dist/styles.css +1 -1
- package/package.json +3 -2
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './ToolSidebar.css';
|
|
3
|
+
/**
|
|
4
|
+
* DSGN-2.10.2 — ToolSidebar organism
|
|
5
|
+
*
|
|
6
|
+
* Canonical left-rail navigation. 4th chrome organism (joins ToolTopbar +
|
|
7
|
+
* ToolFooter + ToolAuthGate). Consumed by Path58 tool surfaces + the portal
|
|
8
|
+
* launchpad page (DSGN-2.10.3).
|
|
9
|
+
*
|
|
10
|
+
* Design lineage (forks #1-6 locked 2026-06-27, see DSGN-2.10.2-COMPLETION § Decision log):
|
|
11
|
+
* #1 Width: 56px collapsed / 240px expanded
|
|
12
|
+
* #2 Engagement chip: outlined navy pill (matches ToolTopbar canon)
|
|
13
|
+
* #3 Active indicator: 3px navy left-rail + --p58-nav-active-bg
|
|
14
|
+
* #4 Mobile drawer: slide-in 240ms ease-out-expo + backdrop fade
|
|
15
|
+
* #5 Collapse/expand: 240ms simultaneous (single motion vocabulary)
|
|
16
|
+
* #6 Hover/focus: --p58-nav-hover-bg + --p58-ring-focus + tooltip on collapsed
|
|
17
|
+
*
|
|
18
|
+
* Token-only CSS (zero hex; overlay-bound rendering per DESIGN-PER-CLIENT-OVERLAY-LOCK-2026-06-19).
|
|
19
|
+
*/
|
|
20
|
+
export interface ToolSidebarTool {
|
|
21
|
+
/** Canonical tool ID — e.g. "TOOL-002". Matches `__P58_CONFIG__.enabledTools[i]`. */
|
|
22
|
+
id: string;
|
|
23
|
+
/** URL-safe slug — e.g. "revenue-factory-canvas". Used as href fragment + active-match key. */
|
|
24
|
+
slug: string;
|
|
25
|
+
/** Display label rendered in expanded sidebar — e.g. "02 Revenue Factory". */
|
|
26
|
+
displayLabel: string;
|
|
27
|
+
/** Short label rendered in collapsed (56px) state — e.g. "02". Falls back to first 2 chars of displayLabel. */
|
|
28
|
+
shortLabel?: string;
|
|
29
|
+
}
|
|
30
|
+
export interface ToolSidebarProps {
|
|
31
|
+
/** Tools list — typically resolved by consumer from `__P58_CONFIG__.enabledTools` against a local registry. */
|
|
32
|
+
tools: ToolSidebarTool[];
|
|
33
|
+
/** Client engagement name shown in engagement chip — e.g. "Nimble". Required so chip is never empty. */
|
|
34
|
+
clientName: string;
|
|
35
|
+
/** Slug of the currently-active tool. Undefined = no tool active (portal page case). */
|
|
36
|
+
currentToolSlug?: string;
|
|
37
|
+
/** Launchpad URL — anchor link rendered above the tool list. Omit to hide. */
|
|
38
|
+
launchpadUrl?: string;
|
|
39
|
+
/** Launchpad label — defaults to "Launchpad". */
|
|
40
|
+
launchpadLabel?: string;
|
|
41
|
+
/** Navigation handler — consumer wires their router. Called with `slug`. If omitted, falls back to native anchor href. */
|
|
42
|
+
onToolNavigate?: (slug: string) => void;
|
|
43
|
+
/** Launchpad navigation handler — falls back to anchor href if omitted. */
|
|
44
|
+
onLaunchpadNavigate?: () => void;
|
|
45
|
+
/** Default collapsed state when no localStorage value present. Default: false. */
|
|
46
|
+
defaultCollapsed?: boolean;
|
|
47
|
+
/** localStorage key for collapse persistence. Default: "path58.toolSidebar.collapsed". Pass null to disable persistence (Storybook). */
|
|
48
|
+
storageKey?: string | null;
|
|
49
|
+
/** Force collapsed/expanded — controlled mode. When set, internal state + persistence are ignored. */
|
|
50
|
+
collapsed?: boolean;
|
|
51
|
+
/** Controlled-mode change callback. */
|
|
52
|
+
onCollapsedChange?: (collapsed: boolean) => void;
|
|
53
|
+
/** Mobile drawer open state (controlled). When undefined, sidebar renders inline as a desktop rail at all viewport widths. */
|
|
54
|
+
mobileOpen?: boolean;
|
|
55
|
+
/** Mobile drawer state-change handler — fires on backdrop tap + Escape key. */
|
|
56
|
+
onMobileOpenChange?: (open: boolean) => void;
|
|
57
|
+
}
|
|
58
|
+
export declare const ToolSidebar: React.FC<ToolSidebarProps>;
|
|
59
|
+
export default ToolSidebar;
|
|
60
|
+
//# sourceMappingURL=ToolSidebar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToolSidebar.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolSidebar/ToolSidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAC;AAEzE,OAAO,mBAAmB,CAAC;AAE3B;;;;;;;;;;;;;;;;GAgBG;AAEH,MAAM,WAAW,eAAe;IAC9B,qFAAqF;IACrF,EAAE,EAAE,MAAM,CAAC;IACX,+FAA+F;IAC/F,IAAI,EAAE,MAAM,CAAC;IACb,8EAA8E;IAC9E,YAAY,EAAE,MAAM,CAAC;IACrB,+GAA+G;IAC/G,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,gBAAgB;IAC/B,+GAA+G;IAC/G,KAAK,EAAE,eAAe,EAAE,CAAC;IAEzB,wGAAwG;IACxG,UAAU,EAAE,MAAM,CAAC;IAEnB,wFAAwF;IACxF,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,8EAA8E;IAC9E,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,iDAAiD;IACjD,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,0HAA0H;IAC1H,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAExC,2EAA2E;IAC3E,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IAEjC,kFAAkF;IAClF,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,wIAAwI;IACxI,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE3B,sGAAsG;IACtG,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,uCAAuC;IACvC,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAEjD,8HAA8H;IAC9H,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,+EAA+E;IAC/E,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AASD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAsKlD,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolSidebar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ToolSidebarTool } from '../ToolSidebar';
|
|
3
|
+
import './ToolSidebarHost.css';
|
|
4
|
+
export interface ToolSidebarHostProps {
|
|
5
|
+
/** The TOOL-* ID of the host tool — drives the current-tool indicator + which item is highlighted. */
|
|
6
|
+
currentToolId: string;
|
|
7
|
+
/** Override the tools list. Default: derived from `window.__P58_CONFIG__.enabledTools`. */
|
|
8
|
+
tools?: ToolSidebarTool[];
|
|
9
|
+
/** Override the client engagement name. Default: derived from `window.__P58_CONFIG__.displayName`. */
|
|
10
|
+
clientName?: string;
|
|
11
|
+
/** Launchpad URL — anchor in the sidebar. Default: '../portal/' (sibling to each tool folder). Pass empty string to hide. */
|
|
12
|
+
launchpadUrl?: string;
|
|
13
|
+
/** Main content area. */
|
|
14
|
+
children?: React.ReactNode;
|
|
15
|
+
}
|
|
16
|
+
export declare const ToolSidebarHost: React.FC<ToolSidebarHostProps>;
|
|
17
|
+
export default ToolSidebarHost;
|
|
18
|
+
//# sourceMappingURL=ToolSidebarHost.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToolSidebarHost.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolSidebarHost/ToolSidebarHost.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,uBAAuB,CAAC;AAoC/B,MAAM,WAAW,oBAAoB;IACnC,sGAAsG;IACtG,aAAa,EAAE,MAAM,CAAC;IAEtB,2FAA2F;IAC3F,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;IAE1B,sGAAsG;IACtG,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,6HAA6H;IAC7H,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,yBAAyB;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAoD1D,CAAC;AAEF,eAAe,eAAe,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolSidebarHost/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC"}
|
package/dist/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--p58-bg: #0a0a1a;--p58-surface: #0e0e24;--p58-surface-2: #14142e;--p58-surface-3: #1b1b3a;--p58-fg-1: #f5f6fb;--p58-fg-2: #b8bad0;--p58-fg-3: #7b7e9c;--p58-fg-4: #4a4d6b;--p58-border: rgba(255, 255, 255, .08);--p58-border-strong: rgba(255, 255, 255, .14);--p58-border-subtle: rgba(255, 255, 255, .04);--p58-overlay-backdrop: color-mix(in srgb, var(--p58-bg) 65%, transparent);--p58-surface-disabled: color-mix(in srgb, var(--p58-surface-2) 60%, var(--p58-bg) 40%);--p58-teal: #00d4aa;--p58-teal-hover: #1ee5bd;--p58-teal-press: #00b892;--p58-teal-dim: #00d4aa22;--p58-teal-glow: #00d4aa44;--p58-teal-text-on-light: #007a63;--p58-on-accent: #0d1d4d;--p58-accent-fg: var(--p58-teal);--p58-accent: var(--p58-teal);--p58-accent-hover: var(--p58-teal-hover);--p58-accent-press: var(--p58-teal-press);--p58-accent-dim: var(--p58-teal-dim);--p58-accent-glow: var(--p58-teal-glow);--p58-icon-accent-soft: color-mix(in srgb, var(--p58-teal) 70%, transparent);--p58-accent-tint: color-mix(in srgb, var(--p58-teal) 12%, transparent);--p58-primary: var(--p58-teal);--p58-primary-hover: var(--p58-teal-hover);--p58-primary-press: var(--p58-teal-press);--p58-primary-fg: var(--p58-on-accent);--p58-blue-50: #f8f8fa;--p58-blue-100: #eeeff3;--p58-blue-200: #e0e2e8;--p58-blue-300: #c7cbd6;--p58-blue-400: #adb2c2;--p58-blue-500: #9097ad;--p58-blue-600: #6e7794;--p58-blue-700: #4c587b;--p58-blue-800: #2c3a64;--p58-blue-900: #0d1d4d;--p58-lime: #9ab64a;--p58-lime-text-on-light: #5e8a23;--p58-lime-wash: rgba(154, 182, 74, .32);--p58-lime-300: #c7d79b;--p58-lime-700: #6c7f34;--p58-axe-accent: #a78bfa;--p58-axe-accent-hover: #baa5fb;--p58-axe-accent-press: #967de1;--p58-axe-accent-dim: color-mix(in srgb, #a78bfa 13%, transparent);--p58-axe-accent-glow: color-mix(in srgb, #a78bfa 27%, transparent);--p58-success-axe: #4ade80;--p58-success-axe-dim: color-mix(in srgb, #4ade80 14%, transparent);--p58-axe-density-card-padding: 14px 16px;--p58-axe-density-tile-padding: 10px 12px;--p58-axe-density-grid-gap: 8px;--p58-axe-density-section-gap: 14px;--p58-axe-density-row-height: 28px;--p58-axe-density-tile-value-fontsize: 18px;--p58-axe-density-tile-label-fontsize: 10.5px;--p58-axe-density-mono-letter-spacing: .005em;--p58-success: #00d4aa;--p58-success-dim: #00d4aa1a;--p58-warning: #f5a623;--p58-warning-dim: #f5a6231a;--p58-danger: #ff4757;--p58-danger-dim: #ff47571a;--p58-info: #5aa9ff;--p58-info-dim: #5aa9ff1a;--p58-trend-neutral: var(--p58-fg-2);--p58-trend-muted: var(--p58-fg-3);--p58-trend-negative: #ff4757;--p58-trend-positive: var(--p58-accent);--p58-viz-1: #00d4aa;--p58-viz-2: #5aa9ff;--p58-viz-3: #c084fc;--p58-viz-4: #f5a623;--p58-viz-5: #ff4757;--p58-viz-6: #7b7e9c;--p58-font-display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;--p58-font-ui: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;--p58-font-mono: "JetBrains Mono", ui-monospace, "Menlo", "Monaco", monospace;--p58-text-2xs: 10px;--p58-text-xs: 11px;--p58-text-sm: 12px;--p58-text-md: 13px;--p58-text-base:14px;--p58-text-lg: 16px;--p58-text-xl: 20px;--p58-text-2xl: 24px;--p58-text-3xl: 32px;--p58-text-4xl: 40px;--p58-text-5xl: 56px;--p58-text-6xl: 72px;--p58-weight-light: 300;--p58-weight-regular: 400;--p58-weight-medium: 500;--p58-weight-semibold:600;--p58-weight-bold: 700;--p58-leading-tight: 1.15;--p58-leading-snug: 1.3;--p58-leading-normal: 1.5;--p58-leading-loose: 1.7;--p58-tracking-tight: -.02em;--p58-tracking-normal: 0;--p58-tracking-wide: .04em;--p58-tracking-caps: .12em;--p58-space-0: 0;--p58-space-1: 4px;--p58-space-2: 8px;--p58-space-3: 12px;--p58-space-4: 16px;--p58-space-5: 20px;--p58-space-6: 24px;--p58-space-8: 32px;--p58-space-10: 40px;--p58-space-12: 48px;--p58-space-16: 64px;--p58-space-20: 80px;--p58-space-24: 96px;--p58-radius-none: 0;--p58-radius-sm: 2px;--p58-radius-md: 4px;--p58-radius-lg: 6px;--p58-radius-xl: 10px;--p58-radius-full: 999px;--p58-elev-1-bg: #0e0e24;--p58-elev-1-border: rgba(255, 255, 255, .08);--p58-elev-2-bg: #13132f;--p58-elev-2-border: rgba(255, 255, 255, .15);--p58-elev-3-bg: #16163a;--p58-elev-3-border: rgba(255, 255, 255, .22);--p58-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .03);--p58-glow-accent: 0 0 0 1px var(--p58-accent), 0 0 16px var(--p58-accent-glow);--p58-ring-focus: 0 0 0 2px var(--p58-bg), 0 0 0 4px var(--p58-accent);--p58-ease: cubic-bezier(.2, .6, .2, 1);--p58-ease-in: cubic-bezier(.4, 0, 1, 1);--p58-duration-fast: .12s;--p58-duration-base: .18s;--p58-duration-slow: .26s;--p58-z-base: 1;--p58-z-sticky: 10;--p58-z-dropdown:100;--p58-z-modal: 1000;--p58-z-toast: 2000;--p58-brand-3p-react: #61DAFB;--p58-brand-3p-react-hover: #4DD0E1;--p58-brand-3p-html5: #E34F26;--p58-brand-3p-html5-hover: #F06529}html,body{background:var(--p58-bg);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-md);line-height:var(--p58-leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.p58-h1,h1.p58{font-family:var(--p58-font-display);font-size:clamp(28px,2.2vw + 16px,var(--p58-text-5xl));font-weight:var(--p58-weight-semibold);line-height:var(--p58-leading-tight);letter-spacing:var(--p58-tracking-tight);color:var(--p58-fg-1)}.p58-h2,h2.p58{font-family:var(--p58-font-display);font-size:clamp(22px,1.2vw + 16px,var(--p58-text-3xl));font-weight:var(--p58-weight-semibold);line-height:var(--p58-leading-tight);letter-spacing:var(--p58-tracking-tight);color:var(--p58-fg-1)}.p58-h3,h3.p58{font-family:var(--p58-font-display);font-size:clamp(17px,.8vw + 14px,var(--p58-text-2xl));font-weight:var(--p58-weight-medium);line-height:var(--p58-leading-snug);color:var(--p58-fg-1)}.p58-h4,h4.p58{font-family:var(--p58-font-display);font-size:clamp(16px,.5vw + 14px,var(--p58-text-xl));font-weight:var(--p58-weight-medium);line-height:var(--p58-leading-snug);color:var(--p58-fg-1)}.p58-body{font-family:var(--p58-font-ui);font-size:var(--p58-text-md);font-weight:var(--p58-weight-regular);line-height:var(--p58-leading-normal);color:var(--p58-fg-2)}.p58-body-lg{font-family:var(--p58-font-ui);font-size:clamp(15px,.2vw + 13px,var(--p58-text-lg));line-height:var(--p58-leading-normal);color:var(--p58-fg-2)}.p58-small{font-size:var(--p58-text-sm);color:var(--p58-fg-3)}.p58-eyebrow{font-family:var(--p58-font-mono);font-size:var(--p58-text-xs);font-weight:var(--p58-weight-medium);text-transform:uppercase;letter-spacing:var(--p58-tracking-caps);color:var(--p58-fg-3)}.p58-code,code.p58,kbd.p58{font-family:var(--p58-font-mono);font-size:.92em;color:var(--p58-fg-1);background:var(--p58-surface-2);border:1px solid var(--p58-border);border-radius:var(--p58-radius-sm);padding:1px 5px}.p58-metric{font-family:var(--p58-font-mono);font-size:var(--p58-text-4xl);font-weight:var(--p58-weight-medium);line-height:1;letter-spacing:-.01em;color:var(--p58-fg-1);font-variant-numeric:tabular-nums}.p58-metric-sm{font-family:var(--p58-font-mono);font-size:var(--p58-text-xl);font-weight:var(--p58-weight-medium);line-height:1;color:var(--p58-fg-1);font-variant-numeric:tabular-nums}.p58-scroll::-webkit-scrollbar{width:10px;height:10px}.p58-scroll::-webkit-scrollbar-track{background:transparent}.p58-scroll::-webkit-scrollbar-thumb{background:var(--p58-border-strong);border-radius:var(--p58-radius-full);border:2px solid var(--p58-bg)}.p58-scroll::-webkit-scrollbar-thumb:hover{background:var(--p58-fg-4)}::selection{background:var(--p58-accent-dim);color:var(--p58-fg-1)}.p58-trend,.p58-trend-neutral,.p58-trend-negative,.p58-trend-positive{font-family:var(--p58-font-mono);font-size:var(--p58-text-xs);font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;gap:4px;line-height:1}.p58-trend,.p58-trend-neutral{color:var(--p58-trend-neutral)}.p58-trend-negative{color:var(--p58-trend-negative)}.p58-trend-positive{color:var(--p58-trend-positive)}.p58-trend-muted{color:var(--p58-trend-muted);font-family:var(--p58-font-mono);font-size:var(--p58-text-xs)}.p58-trend-baseline{color:var(--p58-trend-muted);font-family:var(--p58-font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;margin-left:2px}.path58-scrollbar{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent);scrollbar-gutter:stable;padding-right:8px}.path58-scrollbar::-webkit-scrollbar{width:8px!important;height:8px!important;-webkit-appearance:none!important;display:block!important}.path58-scrollbar::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;margin:2px 0;-webkit-appearance:none!important}.path58-scrollbar::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-scrollbar::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-scrollbar::-webkit-scrollbar:horizontal{height:8px!important}.path58-scrollbar::-webkit-scrollbar-track:horizontal{margin:0 2px}.path58-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s;outline:none;font-family:inherit}.path58-button:focus-visible{outline:2px solid color-mix(in srgb,var(--p58-primary) 50%,transparent);outline-offset:2px}.path58-button:disabled{opacity:.5;cursor:not-allowed}.path58-button--sm{padding:.375rem .75rem;font-size:.75rem;min-height:28px}.path58-button--md{padding:.5rem 1rem;font-size:.875rem;min-height:36px}.path58-button--lg{padding:.75rem 1.5rem;font-size:1rem;min-height:44px}.path58-button--primary{background:var(--p58-primary);border:1px solid var(--p58-primary);color:var(--p58-primary-fg)}.path58-button--primary:hover:not(:disabled){background:var(--p58-primary-hover);border-color:var(--p58-primary-hover)}.path58-button--primary:active:not(:disabled){background:var(--p58-primary-press);border-color:var(--p58-primary-press)}.path58-button--secondary{background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-2)}.path58-button--secondary:hover:not(:disabled){background:color-mix(in srgb,var(--p58-bg) 40%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 30%,transparent);color:var(--p58-fg-1)}.path58-button--ghost{background:transparent;border:1px solid transparent;color:var(--p58-fg-3)}.path58-button--ghost:hover:not(:disabled){background:color-mix(in srgb,var(--p58-teal) 5%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 10%,transparent);color:var(--p58-fg-2)}.path58-button--danger{background:color-mix(in srgb,var(--p58-danger) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-danger) 30%,transparent);color:var(--p58-danger)}.path58-button--danger:hover:not(:disabled){background:color-mix(in srgb,var(--p58-danger) 25%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 50%,transparent)}.path58-button--with-icon{gap:.5rem}.path58-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.path58-button-text{flex:1;text-align:center}.path58-input{width:100%;padding:.625rem .75rem;background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);border-radius:6px;color:var(--p58-fg-1);font-size:.875rem;outline:none;transition:all .2s;font-family:inherit}.path58-input:focus{border-color:var(--p58-accent-fg);box-shadow:0 0 0 2px color-mix(in srgb,var(--p58-teal) 10%,transparent);background:color-mix(in srgb,var(--p58-bg) 50%,transparent)}.path58-input:disabled{opacity:.5;cursor:not-allowed}.path58-input--search{padding:.625rem 2.5rem .625rem .75rem}.path58-input--error{border-color:color-mix(in srgb,var(--p58-danger) 50%,transparent)}.path58-input--error:focus{border-color:var(--p58-danger);box-shadow:0 0 0 2px color-mix(in srgb,var(--p58-danger) 10%,transparent)}.path58-badge{display:inline-flex;align-items:center;justify-content:center;padding:.375rem .75rem;border-radius:6px;font-size:.75rem;font-weight:400;transition:all .2s;cursor:default}.path58-badge--tag{background:transparent;border:1px solid;color:inherit;cursor:pointer}.path58-badge--tag:hover{opacity:.8;transform:translateY(-1px);box-shadow:0 2px 4px color-mix(in srgb,var(--p58-bg) 20%,transparent)}.path58-badge--tag.path58-badge--active{font-weight:600;box-shadow:0 2px 8px color-mix(in srgb,var(--p58-bg) 30%,transparent)}.path58-badge--filter{display:inline-flex;align-items:center;gap:.25rem;padding:.125rem .5rem;background:color-mix(in srgb,var(--p58-teal) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);border-radius:4px;font-size:.75rem;color:var(--p58-accent-fg)}.path58-badge--default{background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-2)}.path58-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}.path58-icon--html{color:var(--p58-brand-3p-html5)}.path58-icon--html:hover{color:var(--p58-brand-3p-html5-hover)}.path58-icon--tsx{color:var(--p58-brand-3p-react)}.path58-icon--tsx:hover{color:var(--p58-brand-3p-react-hover)}.path58-icon--primary{color:var(--p58-accent-fg)}.path58-icon--default{color:var(--p58-fg-3)}.path58-icon-container{display:flex;align-items:center;justify-content:center;border-radius:6px;flex-shrink:0}.path58-icon-container--sm{width:24px;height:24px}.path58-icon-container--md{width:32px;height:32px}.path58-icon-container--lg{width:40px;height:40px}.path58-icon-container--default{background:color-mix(in srgb,var(--p58-teal) 6%,transparent);color:var(--p58-icon-accent-soft)}.path58-icon-container--primary{background:color-mix(in srgb,var(--p58-teal) 10%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-accent-fg)}.path58-icon-container--html{background:color-mix(in srgb,var(--p58-brand-3p-html5) 15%,transparent);color:var(--p58-brand-3p-html5)}.path58-icon-container--tsx{background:color-mix(in srgb,var(--p58-brand-3p-react) 15%,transparent);color:var(--p58-brand-3p-react)}.path58-label{display:flex;align-items:center;gap:.5rem;font-weight:500}.path58-label--section{font-size:.75rem;font-weight:600;color:var(--p58-fg-3);text-transform:uppercase;letter-spacing:.05em}.path58-label--section .path58-label-icon,.path58-label--section .path58-label-text{color:var(--p58-accent-fg)}.path58-label--card{font-size:.625rem;color:var(--p58-fg-3);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.path58-label--default{font-size:.875rem;color:var(--p58-fg-2)}.path58-label-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.path58-label-text{flex:1}.path58-container{display:flex;flex-direction:column;border-radius:8px}.path58-container--section{padding:.875rem;background:color-mix(in srgb,var(--p58-bg) 40%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);gap:.75rem}.path58-container--card{padding:.875rem 1rem;background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 12%,transparent);min-width:120px;min-height:56px;transition:all .2s}.path58-container--card:hover{border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);background:color-mix(in srgb,var(--p58-bg) 40%,transparent);transform:translateY(-2px);box-shadow:0 4px 12px color-mix(in srgb,var(--p58-teal) 15%,transparent)}.path58-container--default{padding:1rem;background:transparent}.path58-list{display:flex;overflow-y:auto;overflow-x:hidden;min-height:0;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent);scrollbar-gutter:stable}.path58-list::-webkit-scrollbar{width:8px!important;-webkit-appearance:none!important;display:block!important}.path58-list::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;margin:2px 0;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;-webkit-appearance:none!important}.path58-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-list--vertical{flex-direction:column;padding:.5rem}.path58-list--horizontal{flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:.5rem}.path58-list--wrap{flex-wrap:wrap;gap:.375rem;padding:0}.path58-list-item{width:100%;display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;background:transparent;border:1px solid transparent;border-radius:4px;color:var(--p58-fg-2);cursor:pointer;font-size:.8125rem;font-weight:400;text-align:left;transition:all .2s;text-transform:none;letter-spacing:normal}.path58-list-item:hover{background:color-mix(in srgb,var(--p58-teal) 5%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-1)}.path58-list-item--selected{background:color-mix(in srgb,var(--p58-teal) 10%,transparent);border-color:var(--p58-accent-fg);color:var(--p58-accent-fg);font-weight:500}.p58-section{padding-top:72px;padding-bottom:72px}.p58-section--bordered{border-top:1px solid var(--p58-border-subtle)}.p58-section--first{border-top:0}@media (max-width: 768px){.p58-section{padding-top:48px;padding-bottom:48px}}@media (max-width: 600px){.p58-section{padding-top:40px;padding-bottom:40px}}.p58-grid{display:grid;gap:var(--p58-grid-gap, 20px)}.p58-grid--cols-2{grid-template-columns:repeat(2,1fr)}.p58-grid--cols-3{grid-template-columns:repeat(3,1fr)}.p58-grid--cols-4{grid-template-columns:repeat(4,1fr)}.p58-grid--gap-sm{--p58-grid-gap: 12px}.p58-grid--gap-lg{--p58-grid-gap: 32px}@media (max-width: 880px){.p58-grid--cols-3,.p58-grid--cols-4{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.p58-grid--cols-2,.p58-grid--cols-3,.p58-grid--cols-4{grid-template-columns:1fr}}.p58-money-moment{font-family:var(--p58-font-display);font-weight:600;color:var(--p58-fg-1);background-image:linear-gradient(180deg,transparent 65%,var(--p58-lime-wash) 65%);padding:0 4px;font-feature-settings:"tnum" 1,"lnum" 1}.p58-catchphrase{color:var(--p58-fg-3);font-weight:500;letter-spacing:.02em;font-size:12px}.p58-link{color:var(--p58-fg-1);text-decoration:none;border-bottom:1px solid var(--p58-fg-1);padding-bottom:1px;transition:opacity .12s ease}.p58-link:hover{opacity:.7}.p58-link:focus-visible{outline:none;box-shadow:var(--p58-ring-focus);border-radius:var(--p58-radius-sm)}.path58-toast{display:flex;align-items:flex-start;gap:var(--p58-space-3);background:var(--p58-surface-2);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left:4px solid var(--p58-border-strong);border-radius:var(--p58-radius-lg);padding:var(--p58-space-3) var(--p58-space-4);min-width:280px;max-width:420px;animation:path58-toast-slide-in .2s ease-out;pointer-events:auto}.path58-toast__message{flex:1;min-width:0;color:var(--p58-fg-1);font-size:.875rem;line-height:1.5;word-break:break-word}.path58-toast__action{flex-shrink:0}.path58-toast__dismiss{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;min-width:32px;min-height:32px;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-toast__dismiss:hover{color:var(--p58-fg-1)}.path58-toast__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-toast--success{border-left-color:var(--p58-success)}.path58-toast--warning{border-left-color:var(--p58-warning)}.path58-toast--danger{border-left-color:var(--p58-danger)}.path58-toast--info{border-left-color:var(--p58-info)}@keyframes path58-toast-slide-in{0%{opacity:0;transform:translate(8px)}to{opacity:1;transform:translate(0)}}@media (prefers-reduced-motion: reduce){.path58-toast{animation:none}}.path58-banner{display:flex;align-items:flex-start;gap:var(--p58-space-3);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left-width:4px;border-radius:var(--p58-radius-lg);padding:var(--p58-space-4);font-size:.9375rem;line-height:1.5}.path58-banner__icon{flex-shrink:0;display:inline-flex;align-items:center;margin-top:2px}.path58-banner__content{flex:1;min-width:0}.path58-banner__title{font-weight:500;color:var(--p58-fg-1);margin-bottom:var(--p58-space-1)}.path58-banner__message{color:var(--p58-fg-2);word-break:break-word}.path58-banner__action{flex-shrink:0}.path58-banner__dismiss{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:44px;min-height:44px;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-banner__dismiss:hover{color:var(--p58-fg-1)}.path58-banner__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-banner--success{background:color-mix(in srgb,var(--p58-success) 12%,transparent);border-color:color-mix(in srgb,var(--p58-success) 30%,transparent);border-left-color:var(--p58-success)}.path58-banner--success .path58-banner__icon{color:var(--p58-success)}.path58-banner--warning{background:color-mix(in srgb,var(--p58-warning) 12%,transparent);border-color:color-mix(in srgb,var(--p58-warning) 30%,transparent);border-left-color:var(--p58-warning)}.path58-banner--warning .path58-banner__icon{color:var(--p58-warning)}.path58-banner--danger{background:color-mix(in srgb,var(--p58-danger) 12%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 30%,transparent);border-left-color:var(--p58-danger)}.path58-banner--danger .path58-banner__icon{color:var(--p58-danger)}.path58-banner--info{background:color-mix(in srgb,var(--p58-info) 12%,transparent);border-color:color-mix(in srgb,var(--p58-info) 30%,transparent);border-left-color:var(--p58-info)}.path58-banner--info .path58-banner__icon{color:var(--p58-info)}.path58-banner--sticky-top{position:sticky;top:0;z-index:200;border-radius:0}.path58-alert{display:flex;align-items:flex-start;gap:var(--p58-space-2);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left-width:3px;border-radius:var(--p58-radius-md);line-height:1.5}.path58-alert__icon{flex-shrink:0;display:inline-flex;align-items:center}.path58-alert__content{flex:1;min-width:0}.path58-alert__title{font-weight:500;color:var(--p58-fg-1)}.path58-alert__message{color:var(--p58-fg-2);word-break:break-word}.path58-alert__dismiss{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-alert__dismiss:hover{color:var(--p58-fg-1)}.path58-alert__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-alert--md{padding:var(--p58-space-3) var(--p58-space-4);font-size:.875rem;gap:var(--p58-space-3)}.path58-alert--md .path58-alert__icon{margin-top:2px}.path58-alert--md .path58-alert__dismiss{width:24px;height:24px;min-width:32px;min-height:32px}.path58-alert--sm{padding:var(--p58-space-2) var(--p58-space-3);font-size:.8125rem;gap:var(--p58-space-2)}.path58-alert--sm .path58-alert__icon{margin-top:1px}.path58-alert--sm .path58-alert__dismiss{width:20px;height:20px;min-width:28px;min-height:28px}.path58-alert--success{background:color-mix(in srgb,var(--p58-success) 10%,transparent);border-color:color-mix(in srgb,var(--p58-success) 28%,transparent);border-left-color:var(--p58-success)}.path58-alert--success .path58-alert__icon{color:var(--p58-success)}.path58-alert--warning{background:color-mix(in srgb,var(--p58-warning) 10%,transparent);border-color:color-mix(in srgb,var(--p58-warning) 28%,transparent);border-left-color:var(--p58-warning)}.path58-alert--warning .path58-alert__icon{color:var(--p58-warning)}.path58-alert--danger{background:color-mix(in srgb,var(--p58-danger) 10%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 28%,transparent);border-left-color:var(--p58-danger)}.path58-alert--danger .path58-alert__icon{color:var(--p58-danger)}.path58-alert--info{background:color-mix(in srgb,var(--p58-info) 10%,transparent);border-color:color-mix(in srgb,var(--p58-info) 28%,transparent);border-left-color:var(--p58-info)}.path58-alert--info .path58-alert__icon{color:var(--p58-info)}.path58-search-input{position:relative;display:flex;align-items:center;width:100%}.path58-search-input .path58-input{width:100%;padding-right:2.5rem}.path58-search-input-clear{position:absolute;right:.5rem;background:transparent;border:none;color:var(--p58-fg-3);padding:.25rem;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s}.path58-search-input-clear:hover{color:var(--p58-fg-1);background:color-mix(in srgb,var(--p58-fg-1) 10%,transparent)}.path58-info-card{display:flex;align-items:center;gap:.75rem;position:relative;margin-top:.25rem}.path58-info-card-content{display:flex;flex-direction:column;gap:.125rem;min-width:0;flex:1}.path58-info-card-value{font-size:.9375rem;color:var(--p58-fg-2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.path58-info-card-value{display:flex;flex-wrap:wrap;gap:.25rem}.path58-info-card--filters{border-color:color-mix(in srgb,var(--p58-teal) 20%,transparent)}.path58-info-card--selected{border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);background:color-mix(in srgb,var(--p58-teal) 3%,transparent)}.path58-info-card--category{transition:all .2s}.path58-info-card--clickable{cursor:pointer}.path58-category-header{width:100%;display:flex;align-items:center;gap:.5rem;padding:.75rem;background:color-mix(in srgb,var(--p58-teal) 8%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 15%,transparent);color:var(--p58-accent-fg);cursor:pointer;border-radius:6px;font-size:.875rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;transition:all .2s;margin-bottom:.25rem}.path58-category-header svg{color:var(--p58-accent-fg)}.path58-category-header:hover{background:color-mix(in srgb,var(--p58-teal) 12%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);color:var(--p58-accent-fg)}.path58-category-name{flex:1;text-align:left}.path58-category-count{color:var(--p58-fg-3);font-weight:400}.path58-category-chevron{transition:transform .2s}.path58-category-chevron--expanded{transform:rotate(90deg)}.path58-file-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.path58-dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--p58-overlay-backdrop);display:flex;align-items:center;justify-content:center;padding:var(--p58-space-6);z-index:1000;animation:path58-dialog-fade-in .15s ease-out}.path58-dialog-surface{background:var(--p58-surface);color:var(--p58-fg-1);border:1px solid var(--p58-border-strong);border-radius:var(--p58-radius-xl);padding:var(--p58-space-6);max-width:480px;width:100%;max-height:calc(100vh - var(--p58-space-12));overflow-y:auto;animation:path58-dialog-slide-up .2s ease-out}.path58-dialog-surface :focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px;border-radius:var(--p58-radius-sm)}@keyframes path58-dialog-fade-in{0%{opacity:0}to{opacity:1}}@keyframes path58-dialog-slide-up{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion: reduce){.path58-dialog-backdrop,.path58-dialog-surface{animation:none}}.path58-modal{display:flex;flex-direction:column;gap:var(--p58-space-4);margin:calc(var(--p58-space-6) * -1)}.path58-modal__header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--p58-space-3);padding:var(--p58-space-5) var(--p58-space-6);border-bottom:1px solid var(--p58-border)}.path58-modal__header-content{flex:1;min-width:0;color:var(--p58-fg-1);font-size:1rem;font-weight:500;line-height:1.4}.path58-modal__dismiss{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:44px;min-height:44px;background:transparent;border:none;color:var(--p58-fg-2);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out}.path58-modal__dismiss:hover{color:var(--p58-fg-1)}.path58-modal__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-modal__body{padding:0 var(--p58-space-6);color:var(--p58-fg-1);font-size:.9375rem;line-height:1.6}.path58-modal__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--p58-space-2);padding:var(--p58-space-4) var(--p58-space-6);border-top:1px solid var(--p58-border)}.path58-modal--sm{--path58-modal-max-width: 360px}.path58-modal--md{--path58-modal-max-width: 480px}.path58-modal--lg{--path58-modal-max-width: 640px}.path58-dialog-surface:has(.path58-modal--sm){max-width:360px}.path58-dialog-surface:has(.path58-modal--lg){max-width:640px}.path58-confirm-dialog__message{color:var(--p58-fg-2);font-size:.9375rem;line-height:1.6;padding:var(--p58-space-3) 0}.path58-confirm-dialog__spinner{display:inline-block;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:var(--p58-radius-full);margin-right:var(--p58-space-2);animation:path58-confirm-dialog-spin .6s linear infinite}@keyframes path58-confirm-dialog-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.path58-confirm-dialog__spinner{animation-duration:1.5s}}.path58-prompt-dialog__field{display:flex;flex-direction:column;gap:var(--p58-space-2);padding:var(--p58-space-3) 0}.path58-prompt-dialog__label{color:var(--p58-fg-2);font-size:.8125rem;font-weight:500;line-height:1.4}.path58-prompt-dialog__error{color:var(--p58-danger);font-size:.8125rem;line-height:1.4}.path58-search-input-wrapper{position:relative;display:flex;align-items:center;width:100%}.path58-tag-filter{display:flex;flex-direction:column;gap:.5rem;min-width:200px;height:110px;max-height:110px;overflow-y:scroll;overflow-x:hidden;position:relative;padding-right:0}.path58-tag-filter-header{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--p58-accent-fg);flex-shrink:0}.path58-tag-filter-clear{margin-left:auto}.path58-tag-filter-list{flex:1;min-height:0}.path58-tag-filter-scroll-hint{padding:.25rem .5rem;font-size:.625rem;color:var(--p58-fg-3);text-align:center;font-style:italic;border-top:1px solid color-mix(in srgb,var(--p58-teal) 10%,transparent);margin-top:.25rem;flex-shrink:0}.path58-category-group{margin-bottom:.5rem}.path58-category-file-list{display:flex;flex-direction:column;gap:.25rem;padding-left:.5rem}.path58-artifact-list.path58-list{flex:1 1 0!important;min-height:0!important;overflow-y:scroll!important;overflow-x:hidden!important;scrollbar-width:thin!important;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;scrollbar-gutter:stable!important;-webkit-overflow-scrolling:touch;padding:.5rem!important;display:flex!important;flex-direction:column!important;height:100%!important}.path58-artifact-list::-webkit-scrollbar{width:8px!important;-webkit-appearance:none!important;display:block!important}.path58-artifact-list::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;margin:2px 0;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;-webkit-appearance:none!important}.path58-artifact-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-artifact-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-toast-stack{position:fixed;display:flex;flex-direction:column;gap:var(--p58-space-2);z-index:1100;padding:var(--p58-space-4);pointer-events:none;max-width:calc(100vw - var(--p58-space-8))}.path58-toast-stack--top-right{top:0;right:0;align-items:flex-end}.path58-toast-stack--top-left{top:0;left:0;align-items:flex-start}.path58-toast-stack--bottom-right{bottom:0;right:0;align-items:flex-end;flex-direction:column-reverse}.path58-toast-stack--bottom-left{bottom:0;left:0;align-items:flex-start;flex-direction:column-reverse}.path58-tool-topbar{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 var(--p58-space-6);background:var(--p58-surface);border-bottom:1px solid var(--p58-border);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-md);gap:var(--p58-space-4)}.path58-tool-topbar__left{display:flex;align-items:center;gap:var(--p58-space-3);min-width:0}.path58-tool-topbar__right{display:flex;align-items:center;gap:var(--p58-space-3);flex-shrink:0}.path58-tool-topbar__mark{display:block;height:28px;width:auto;max-width:110px;flex-shrink:0}.path58-tool-topbar__wordmark{font-family:var(--p58-font-display, var(--p58-font-ui));font-weight:700;font-size:var(--p58-text-md, 16px);letter-spacing:var(--p58-tracking-tight, -.01em);color:var(--p58-blue-900, var(--p58-primary));line-height:1;flex-shrink:0}.path58-tool-topbar__divider{width:1px;height:18px;background:var(--p58-border-strong)}.path58-tool-topbar__tool-name{font-family:var(--p58-font-ui);font-size:var(--p58-text-md);font-weight:600;color:var(--p58-fg-1);white-space:nowrap}.path58-tool-topbar__engagement-chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;background:transparent;color:var(--p58-blue-900, var(--p58-primary));border:1px solid var(--p58-blue-900, var(--p58-primary));border-radius:var(--p58-radius-md);font-family:var(--p58-font-ui);font-size:var(--p58-text-xs);font-weight:500;letter-spacing:0;white-space:nowrap}.path58-tool-topbar__meta{display:inline-flex;align-items:center;gap:6px;font-family:var(--p58-font-mono);font-size:var(--p58-text-sm);white-space:nowrap;font-variant-numeric:tabular-nums}.path58-tool-topbar__meta-tool-id{color:var(--p58-fg-3);font-weight:500}.path58-tool-topbar__meta-sep{color:var(--p58-fg-4)}.path58-tool-topbar__meta-state{color:var(--p58-fg-2)}.path58-tool-topbar__save-dot{width:6px;height:6px;border-radius:var(--p58-radius-full);flex-shrink:0}.path58-tool-topbar__save-dot--idle{background:var(--p58-fg-4)}.path58-tool-topbar__save-dot--saving{background:var(--p58-warning);animation:path58-tool-topbar-pulse 1.2s ease-in-out infinite}.path58-tool-topbar__save-dot--saved{background:var(--p58-success)}@keyframes path58-tool-topbar-pulse{0%,to{opacity:.6}50%{opacity:1}}.path58-tool-topbar__engagement-chip:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}@media print{.path58-tool-topbar.no-print{display:none}}.path58-tool-footer{background:var(--p58-surface);border-top:1px solid var(--p58-border);color:var(--p58-fg-3);font-family:var(--p58-font-ui);font-size:var(--p58-text-sm)}.path58-tool-footer__inner{display:flex;align-items:center;gap:var(--p58-space-3);padding:12px var(--p58-space-6)}.path58-tool-footer__mark{width:18px;height:18px;flex-shrink:0;opacity:.7}.path58-tool-footer__text{flex:1;color:var(--p58-fg-3);font-size:var(--p58-text-sm);line-height:1.4}.path58-tool-footer__text strong{color:var(--p58-fg-2);font-weight:500}@media print{.path58-tool-footer{background:transparent;border-top-color:#000;color:#000}.path58-tool-footer__text{color:#000}.path58-tool-footer__text strong{color:#000;font-weight:600}.path58-tool-footer .no-print{display:none}}.path58-tool-authgate{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--p58-bg);gap:14px}.path58-tool-authgate__card{background:var(--p58-surface);border:1px solid var(--p58-border);border-radius:var(--p58-radius-lg, 12px);padding:44px;width:400px;display:flex;flex-direction:column;align-items:center;gap:8px}.path58-tool-authgate__brand{display:flex;align-items:center;justify-content:center;margin-bottom:24px;width:100%}.path58-tool-authgate__logo{display:block;height:84px;width:auto;max-width:280px}.path58-tool-authgate__title{margin:0 0 14px;font-size:22px;font-weight:700;color:var(--p58-fg-1);text-align:center;letter-spacing:var(--p58-tracking-tight, -.01em)}.path58-tool-authgate__chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;background:transparent;color:var(--p58-blue-900);border:1px solid var(--p58-blue-900);border-radius:var(--p58-radius-md, 6px);font-family:var(--p58-font-ui);font-size:12px;font-weight:500;letter-spacing:0}.path58-tool-authgate__footer{font-family:var(--p58-font-ui);font-size:12px;color:var(--p58-fg-3);text-align:left;width:400px;line-height:1.5;padding:0 4px}.path58-tool-authgate__form{display:flex;flex-direction:column;gap:10px;margin-top:14px;width:100%}.path58-tool-authgate__label{font-size:13px;font-weight:600;color:var(--p58-fg-2)}.path58-tool-authgate__input{box-sizing:border-box;width:100%;padding:9px 12px;border:1px solid var(--p58-border);border-radius:var(--p58-radius-md, 8px);background:var(--p58-surface-2);color:var(--p58-fg-1);font-size:14px;font-family:inherit}.path58-tool-authgate__input:focus{outline:none;border-color:var(--p58-blue-900);box-shadow:var(--p58-ring-focus)}.path58-tool-authgate__input:disabled{opacity:.55;cursor:not-allowed}.path58-tool-authgate__submit{box-sizing:border-box;width:100%;margin-top:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--p58-blue-900);color:#fff;border:none;border-radius:var(--p58-radius-md, 6px);font-family:inherit;font-weight:600;font-size:14px;padding:10px 18px;cursor:pointer;transition:background var(--p58-duration-fast, .12s) var(--p58-ease, ease)}.path58-tool-authgate__submit:hover{background:var(--p58-blue-700)}.path58-tool-authgate__submit:active{background:var(--p58-blue-900)}.path58-tool-authgate__submit:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}.path58-tool-authgate__submit:disabled{opacity:.55;cursor:not-allowed}.path58-tool-authgate__error{margin:0;font-size:13px;color:var(--p58-danger)}.path58-tool-authgate__sent p{margin:0 0 6px;font-size:14px}.path58-tool-authgate__hint{color:var(--p58-fg-3);font-size:13px}.path58-input-field{display:flex;flex-direction:column;gap:5px;font-family:var(--p58-font-ui)}.path58-input-field--no-label{gap:0}.path58-input__label{font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:500;color:var(--p58-fg-2);display:flex;align-items:baseline;gap:4px}.path58-input__label.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.path58-input__required{color:var(--p58-fg-2);font-weight:500}.path58-input__shell{position:relative;display:block}.path58-input{width:100%;box-sizing:border-box;background:var(--p58-surface-2);border:1px solid var(--p58-border);border-radius:var(--p58-radius-lg);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-base);outline:none;transition:background var(--p58-duration-fast) var(--p58-ease),border-color var(--p58-duration-fast) var(--p58-ease),box-shadow var(--p58-duration-fast) var(--p58-ease)}.path58-input::placeholder{color:var(--p58-fg-4)}.path58-input--sm{padding:7px 12px}.path58-input--md{padding:9px 14px}.path58-input--lg{padding:13px 16px;font-size:var(--p58-text-lg)}.path58-input:hover:not(:disabled):not(.path58-input--invalid){border-color:#0d1d4d66;background:#fafbfd}.path58-input:focus,.path58-input:focus-visible{border-color:var(--p58-blue-900);box-shadow:var(--p58-ring-focus);background:var(--p58-surface-2)}.path58-input--invalid,.path58-input--invalid:hover{border-color:var(--p58-danger);background:var(--p58-surface-2);padding-right:36px}.path58-input--invalid:focus,.path58-input--invalid:focus-visible{border-color:var(--p58-danger);box-shadow:0 0 0 2px var(--p58-bg),0 0 0 4px var(--p58-danger)}.path58-input__invalid-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--p58-danger);pointer-events:none}.path58-input--disabled,.path58-input:disabled{background:var(--p58-surface-disabled);border-color:var(--p58-border-subtle);color:var(--p58-fg-3);cursor:not-allowed}.path58-input--disabled::placeholder,.path58-input:disabled::placeholder{color:var(--p58-fg-4)}.path58-input--mono{font-family:var(--p58-font-mono);font-variant-numeric:tabular-nums}.path58-input--with-prefix.path58-input--sm{padding-left:28px}.path58-input--with-prefix.path58-input--md{padding-left:30px}.path58-input--with-prefix.path58-input--lg{padding-left:32px}.path58-input--with-suffix.path58-input--sm{padding-right:28px}.path58-input--with-suffix.path58-input--md{padding-right:30px}.path58-input--with-suffix.path58-input--lg{padding-right:32px}.path58-input__adornment{position:absolute;top:50%;transform:translateY(-50%);font-family:var(--p58-font-mono);font-size:var(--p58-text-base);font-weight:400;color:var(--p58-fg-3);pointer-events:none;-webkit-user-select:none;user-select:none;font-variant-numeric:tabular-nums}.path58-input__adornment--prefix{left:14px}.path58-input__adornment--suffix{right:14px}.path58-input__hint{margin:4px 0 0;font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:400;color:var(--p58-fg-3);line-height:var(--p58-leading-normal)}.path58-input__error{margin:4px 0 0;font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:400;color:var(--p58-danger);line-height:var(--p58-leading-normal)}
|
|
1
|
+
:root{--p58-bg: #0a0a1a;--p58-surface: #0e0e24;--p58-surface-2: #14142e;--p58-surface-3: #1b1b3a;--p58-fg-1: #f5f6fb;--p58-fg-2: #b8bad0;--p58-fg-3: #7b7e9c;--p58-fg-4: #4a4d6b;--p58-border: rgba(255, 255, 255, .08);--p58-border-strong: rgba(255, 255, 255, .14);--p58-border-subtle: rgba(255, 255, 255, .04);--p58-overlay-backdrop: color-mix(in srgb, var(--p58-bg) 65%, transparent);--p58-surface-disabled: color-mix(in srgb, var(--p58-surface-2) 60%, var(--p58-bg) 40%);--p58-nav-hover-bg: color-mix(in srgb, var(--p58-blue-900) 3%, transparent);--p58-nav-active-bg: color-mix(in srgb, var(--p58-blue-900) 5%, transparent);--p58-nav-active-accent: var(--p58-blue-900);--p58-teal: #00d4aa;--p58-teal-hover: #1ee5bd;--p58-teal-press: #00b892;--p58-teal-dim: #00d4aa22;--p58-teal-glow: #00d4aa44;--p58-teal-text-on-light: #007a63;--p58-on-accent: #0d1d4d;--p58-accent-fg: var(--p58-teal);--p58-accent: var(--p58-teal);--p58-accent-hover: var(--p58-teal-hover);--p58-accent-press: var(--p58-teal-press);--p58-accent-dim: var(--p58-teal-dim);--p58-accent-glow: var(--p58-teal-glow);--p58-icon-accent-soft: color-mix(in srgb, var(--p58-teal) 70%, transparent);--p58-accent-tint: color-mix(in srgb, var(--p58-teal) 12%, transparent);--p58-primary: var(--p58-teal);--p58-primary-hover: var(--p58-teal-hover);--p58-primary-press: var(--p58-teal-press);--p58-primary-fg: var(--p58-on-accent);--p58-blue-50: #f8f8fa;--p58-blue-100: #eeeff3;--p58-blue-200: #e0e2e8;--p58-blue-300: #c7cbd6;--p58-blue-400: #adb2c2;--p58-blue-500: #9097ad;--p58-blue-600: #6e7794;--p58-blue-700: #4c587b;--p58-blue-800: #2c3a64;--p58-blue-900: #0d1d4d;--p58-lime: #9ab64a;--p58-lime-text-on-light: #5e8a23;--p58-lime-wash: rgba(154, 182, 74, .32);--p58-lime-300: #c7d79b;--p58-lime-700: #6c7f34;--p58-axe-accent: #a78bfa;--p58-axe-accent-hover: #baa5fb;--p58-axe-accent-press: #967de1;--p58-axe-accent-dim: color-mix(in srgb, #a78bfa 13%, transparent);--p58-axe-accent-glow: color-mix(in srgb, #a78bfa 27%, transparent);--p58-success-axe: #4ade80;--p58-success-axe-dim: color-mix(in srgb, #4ade80 14%, transparent);--p58-axe-density-card-padding: 14px 16px;--p58-axe-density-tile-padding: 10px 12px;--p58-axe-density-grid-gap: 8px;--p58-axe-density-section-gap: 14px;--p58-axe-density-row-height: 28px;--p58-axe-density-tile-value-fontsize: 18px;--p58-axe-density-tile-label-fontsize: 10.5px;--p58-axe-density-mono-letter-spacing: .005em;--p58-success: #00d4aa;--p58-success-dim: #00d4aa1a;--p58-warning: #f5a623;--p58-warning-dim: #f5a6231a;--p58-danger: #ff4757;--p58-danger-dim: #ff47571a;--p58-info: #5aa9ff;--p58-info-dim: #5aa9ff1a;--p58-trend-neutral: var(--p58-fg-2);--p58-trend-muted: var(--p58-fg-3);--p58-trend-negative: #ff4757;--p58-trend-positive: var(--p58-accent);--p58-viz-1: #00d4aa;--p58-viz-2: #5aa9ff;--p58-viz-3: #c084fc;--p58-viz-4: #f5a623;--p58-viz-5: #ff4757;--p58-viz-6: #7b7e9c;--p58-font-display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;--p58-font-ui: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;--p58-font-mono: "JetBrains Mono", ui-monospace, "Menlo", "Monaco", monospace;--p58-text-2xs: 10px;--p58-text-xs: 11px;--p58-text-sm: 12px;--p58-text-md: 13px;--p58-text-base:14px;--p58-text-lg: 16px;--p58-text-xl: 20px;--p58-text-2xl: 24px;--p58-text-3xl: 32px;--p58-text-4xl: 40px;--p58-text-5xl: 56px;--p58-text-6xl: 72px;--p58-weight-light: 300;--p58-weight-regular: 400;--p58-weight-medium: 500;--p58-weight-semibold:600;--p58-weight-bold: 700;--p58-leading-tight: 1.15;--p58-leading-snug: 1.3;--p58-leading-normal: 1.5;--p58-leading-loose: 1.7;--p58-tracking-tight: -.02em;--p58-tracking-normal: 0;--p58-tracking-wide: .04em;--p58-tracking-caps: .12em;--p58-space-0: 0;--p58-space-1: 4px;--p58-space-2: 8px;--p58-space-3: 12px;--p58-space-4: 16px;--p58-space-5: 20px;--p58-space-6: 24px;--p58-space-8: 32px;--p58-space-10: 40px;--p58-space-12: 48px;--p58-space-16: 64px;--p58-space-20: 80px;--p58-space-24: 96px;--p58-radius-none: 0;--p58-radius-sm: 2px;--p58-radius-md: 4px;--p58-radius-lg: 6px;--p58-radius-xl: 10px;--p58-radius-full: 999px;--p58-elev-1-bg: #0e0e24;--p58-elev-1-border: rgba(255, 255, 255, .08);--p58-elev-2-bg: #13132f;--p58-elev-2-border: rgba(255, 255, 255, .15);--p58-elev-3-bg: #16163a;--p58-elev-3-border: rgba(255, 255, 255, .22);--p58-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .03);--p58-glow-accent: 0 0 0 1px var(--p58-accent), 0 0 16px var(--p58-accent-glow);--p58-ring-focus: 0 0 0 2px var(--p58-bg), 0 0 0 4px var(--p58-accent);--p58-ease: cubic-bezier(.2, .6, .2, 1);--p58-ease-in: cubic-bezier(.4, 0, 1, 1);--p58-duration-fast: .12s;--p58-duration-base: .18s;--p58-duration-slow: .26s;--p58-z-base: 1;--p58-z-sticky: 10;--p58-z-dropdown:100;--p58-z-modal: 1000;--p58-z-toast: 2000;--p58-brand-3p-react: #61DAFB;--p58-brand-3p-react-hover: #4DD0E1;--p58-brand-3p-html5: #E34F26;--p58-brand-3p-html5-hover: #F06529}html,body{background:var(--p58-bg);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-md);line-height:var(--p58-leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.p58-h1,h1.p58{font-family:var(--p58-font-display);font-size:clamp(28px,2.2vw + 16px,var(--p58-text-5xl));font-weight:var(--p58-weight-semibold);line-height:var(--p58-leading-tight);letter-spacing:var(--p58-tracking-tight);color:var(--p58-fg-1)}.p58-h2,h2.p58{font-family:var(--p58-font-display);font-size:clamp(22px,1.2vw + 16px,var(--p58-text-3xl));font-weight:var(--p58-weight-semibold);line-height:var(--p58-leading-tight);letter-spacing:var(--p58-tracking-tight);color:var(--p58-fg-1)}.p58-h3,h3.p58{font-family:var(--p58-font-display);font-size:clamp(17px,.8vw + 14px,var(--p58-text-2xl));font-weight:var(--p58-weight-medium);line-height:var(--p58-leading-snug);color:var(--p58-fg-1)}.p58-h4,h4.p58{font-family:var(--p58-font-display);font-size:clamp(16px,.5vw + 14px,var(--p58-text-xl));font-weight:var(--p58-weight-medium);line-height:var(--p58-leading-snug);color:var(--p58-fg-1)}.p58-body{font-family:var(--p58-font-ui);font-size:var(--p58-text-md);font-weight:var(--p58-weight-regular);line-height:var(--p58-leading-normal);color:var(--p58-fg-2)}.p58-body-lg{font-family:var(--p58-font-ui);font-size:clamp(15px,.2vw + 13px,var(--p58-text-lg));line-height:var(--p58-leading-normal);color:var(--p58-fg-2)}.p58-small{font-size:var(--p58-text-sm);color:var(--p58-fg-3)}.p58-eyebrow{font-family:var(--p58-font-mono);font-size:var(--p58-text-xs);font-weight:var(--p58-weight-medium);text-transform:uppercase;letter-spacing:var(--p58-tracking-caps);color:var(--p58-fg-3)}.p58-code,code.p58,kbd.p58{font-family:var(--p58-font-mono);font-size:.92em;color:var(--p58-fg-1);background:var(--p58-surface-2);border:1px solid var(--p58-border);border-radius:var(--p58-radius-sm);padding:1px 5px}.p58-metric{font-family:var(--p58-font-mono);font-size:var(--p58-text-4xl);font-weight:var(--p58-weight-medium);line-height:1;letter-spacing:-.01em;color:var(--p58-fg-1);font-variant-numeric:tabular-nums}.p58-metric-sm{font-family:var(--p58-font-mono);font-size:var(--p58-text-xl);font-weight:var(--p58-weight-medium);line-height:1;color:var(--p58-fg-1);font-variant-numeric:tabular-nums}.p58-scroll::-webkit-scrollbar{width:10px;height:10px}.p58-scroll::-webkit-scrollbar-track{background:transparent}.p58-scroll::-webkit-scrollbar-thumb{background:var(--p58-border-strong);border-radius:var(--p58-radius-full);border:2px solid var(--p58-bg)}.p58-scroll::-webkit-scrollbar-thumb:hover{background:var(--p58-fg-4)}::selection{background:var(--p58-accent-dim);color:var(--p58-fg-1)}.p58-trend,.p58-trend-neutral,.p58-trend-negative,.p58-trend-positive{font-family:var(--p58-font-mono);font-size:var(--p58-text-xs);font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;gap:4px;line-height:1}.p58-trend,.p58-trend-neutral{color:var(--p58-trend-neutral)}.p58-trend-negative{color:var(--p58-trend-negative)}.p58-trend-positive{color:var(--p58-trend-positive)}.p58-trend-muted{color:var(--p58-trend-muted);font-family:var(--p58-font-mono);font-size:var(--p58-text-xs)}.p58-trend-baseline{color:var(--p58-trend-muted);font-family:var(--p58-font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;margin-left:2px}.path58-scrollbar{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent);scrollbar-gutter:stable;padding-right:8px}.path58-scrollbar::-webkit-scrollbar{width:8px!important;height:8px!important;-webkit-appearance:none!important;display:block!important}.path58-scrollbar::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;margin:2px 0;-webkit-appearance:none!important}.path58-scrollbar::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-scrollbar::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-scrollbar::-webkit-scrollbar:horizontal{height:8px!important}.path58-scrollbar::-webkit-scrollbar-track:horizontal{margin:0 2px}.path58-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s;outline:none;font-family:inherit}.path58-button:focus-visible{outline:2px solid color-mix(in srgb,var(--p58-primary) 50%,transparent);outline-offset:2px}.path58-button:disabled{opacity:.5;cursor:not-allowed}.path58-button--sm{padding:.375rem .75rem;font-size:.75rem;min-height:28px}.path58-button--md{padding:.5rem 1rem;font-size:.875rem;min-height:36px}.path58-button--lg{padding:.75rem 1.5rem;font-size:1rem;min-height:44px}.path58-button--primary{background:var(--p58-primary);border:1px solid var(--p58-primary);color:var(--p58-primary-fg)}.path58-button--primary:hover:not(:disabled){background:var(--p58-primary-hover);border-color:var(--p58-primary-hover)}.path58-button--primary:active:not(:disabled){background:var(--p58-primary-press);border-color:var(--p58-primary-press)}.path58-button--secondary{background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-2)}.path58-button--secondary:hover:not(:disabled){background:color-mix(in srgb,var(--p58-bg) 40%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 30%,transparent);color:var(--p58-fg-1)}.path58-button--ghost{background:transparent;border:1px solid transparent;color:var(--p58-fg-3)}.path58-button--ghost:hover:not(:disabled){background:color-mix(in srgb,var(--p58-teal) 5%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 10%,transparent);color:var(--p58-fg-2)}.path58-button--danger{background:color-mix(in srgb,var(--p58-danger) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-danger) 30%,transparent);color:var(--p58-danger)}.path58-button--danger:hover:not(:disabled){background:color-mix(in srgb,var(--p58-danger) 25%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 50%,transparent)}.path58-button--with-icon{gap:.5rem}.path58-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.path58-button-text{flex:1;text-align:center}.path58-input{width:100%;padding:.625rem .75rem;background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);border-radius:6px;color:var(--p58-fg-1);font-size:.875rem;outline:none;transition:all .2s;font-family:inherit}.path58-input:focus{border-color:var(--p58-accent-fg);box-shadow:0 0 0 2px color-mix(in srgb,var(--p58-teal) 10%,transparent);background:color-mix(in srgb,var(--p58-bg) 50%,transparent)}.path58-input:disabled{opacity:.5;cursor:not-allowed}.path58-input--search{padding:.625rem 2.5rem .625rem .75rem}.path58-input--error{border-color:color-mix(in srgb,var(--p58-danger) 50%,transparent)}.path58-input--error:focus{border-color:var(--p58-danger);box-shadow:0 0 0 2px color-mix(in srgb,var(--p58-danger) 10%,transparent)}.path58-badge{display:inline-flex;align-items:center;justify-content:center;padding:.375rem .75rem;border-radius:6px;font-size:.75rem;font-weight:400;transition:all .2s;cursor:default}.path58-badge--tag{background:transparent;border:1px solid;color:inherit;cursor:pointer}.path58-badge--tag:hover{opacity:.8;transform:translateY(-1px);box-shadow:0 2px 4px color-mix(in srgb,var(--p58-bg) 20%,transparent)}.path58-badge--tag.path58-badge--active{font-weight:600;box-shadow:0 2px 8px color-mix(in srgb,var(--p58-bg) 30%,transparent)}.path58-badge--filter{display:inline-flex;align-items:center;gap:.25rem;padding:.125rem .5rem;background:color-mix(in srgb,var(--p58-teal) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);border-radius:4px;font-size:.75rem;color:var(--p58-accent-fg)}.path58-badge--default{background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-2)}.path58-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}.path58-icon--html{color:var(--p58-brand-3p-html5)}.path58-icon--html:hover{color:var(--p58-brand-3p-html5-hover)}.path58-icon--tsx{color:var(--p58-brand-3p-react)}.path58-icon--tsx:hover{color:var(--p58-brand-3p-react-hover)}.path58-icon--primary{color:var(--p58-accent-fg)}.path58-icon--default{color:var(--p58-fg-3)}.path58-icon-container{display:flex;align-items:center;justify-content:center;border-radius:6px;flex-shrink:0}.path58-icon-container--sm{width:24px;height:24px}.path58-icon-container--md{width:32px;height:32px}.path58-icon-container--lg{width:40px;height:40px}.path58-icon-container--default{background:color-mix(in srgb,var(--p58-teal) 6%,transparent);color:var(--p58-icon-accent-soft)}.path58-icon-container--primary{background:color-mix(in srgb,var(--p58-teal) 10%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-accent-fg)}.path58-icon-container--html{background:color-mix(in srgb,var(--p58-brand-3p-html5) 15%,transparent);color:var(--p58-brand-3p-html5)}.path58-icon-container--tsx{background:color-mix(in srgb,var(--p58-brand-3p-react) 15%,transparent);color:var(--p58-brand-3p-react)}.path58-label{display:flex;align-items:center;gap:.5rem;font-weight:500}.path58-label--section{font-size:.75rem;font-weight:600;color:var(--p58-fg-3);text-transform:uppercase;letter-spacing:.05em}.path58-label--section .path58-label-icon,.path58-label--section .path58-label-text{color:var(--p58-accent-fg)}.path58-label--card{font-size:.625rem;color:var(--p58-fg-3);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.path58-label--default{font-size:.875rem;color:var(--p58-fg-2)}.path58-label-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.path58-label-text{flex:1}.path58-container{display:flex;flex-direction:column;border-radius:8px}.path58-container--section{padding:.875rem;background:color-mix(in srgb,var(--p58-bg) 40%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);gap:.75rem}.path58-container--card{padding:.875rem 1rem;background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 12%,transparent);min-width:120px;min-height:56px;transition:all .2s}.path58-container--card:hover{border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);background:color-mix(in srgb,var(--p58-bg) 40%,transparent);transform:translateY(-2px);box-shadow:0 4px 12px color-mix(in srgb,var(--p58-teal) 15%,transparent)}.path58-container--default{padding:1rem;background:transparent}.path58-list{display:flex;overflow-y:auto;overflow-x:hidden;min-height:0;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent);scrollbar-gutter:stable}.path58-list::-webkit-scrollbar{width:8px!important;-webkit-appearance:none!important;display:block!important}.path58-list::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;margin:2px 0;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;-webkit-appearance:none!important}.path58-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-list--vertical{flex-direction:column;padding:.5rem}.path58-list--horizontal{flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:.5rem}.path58-list--wrap{flex-wrap:wrap;gap:.375rem;padding:0}.path58-list-item{width:100%;display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;background:transparent;border:1px solid transparent;border-radius:4px;color:var(--p58-fg-2);cursor:pointer;font-size:.8125rem;font-weight:400;text-align:left;transition:all .2s;text-transform:none;letter-spacing:normal}.path58-list-item:hover{background:color-mix(in srgb,var(--p58-teal) 5%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-1)}.path58-list-item--selected{background:color-mix(in srgb,var(--p58-teal) 10%,transparent);border-color:var(--p58-accent-fg);color:var(--p58-accent-fg);font-weight:500}.p58-section{padding-top:72px;padding-bottom:72px}.p58-section--bordered{border-top:1px solid var(--p58-border-subtle)}.p58-section--first{border-top:0}@media (max-width: 768px){.p58-section{padding-top:48px;padding-bottom:48px}}@media (max-width: 600px){.p58-section{padding-top:40px;padding-bottom:40px}}.p58-grid{display:grid;gap:var(--p58-grid-gap, 20px)}.p58-grid--cols-2{grid-template-columns:repeat(2,1fr)}.p58-grid--cols-3{grid-template-columns:repeat(3,1fr)}.p58-grid--cols-4{grid-template-columns:repeat(4,1fr)}.p58-grid--gap-sm{--p58-grid-gap: 12px}.p58-grid--gap-lg{--p58-grid-gap: 32px}@media (max-width: 880px){.p58-grid--cols-3,.p58-grid--cols-4{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.p58-grid--cols-2,.p58-grid--cols-3,.p58-grid--cols-4{grid-template-columns:1fr}}.p58-money-moment{font-family:var(--p58-font-display);font-weight:600;color:var(--p58-fg-1);background-image:linear-gradient(180deg,transparent 65%,var(--p58-lime-wash) 65%);padding:0 4px;font-feature-settings:"tnum" 1,"lnum" 1}.p58-catchphrase{color:var(--p58-fg-3);font-weight:500;letter-spacing:.02em;font-size:12px}.p58-link{color:var(--p58-fg-1);text-decoration:none;border-bottom:1px solid var(--p58-fg-1);padding-bottom:1px;transition:opacity .12s ease}.p58-link:hover{opacity:.7}.p58-link:focus-visible{outline:none;box-shadow:var(--p58-ring-focus);border-radius:var(--p58-radius-sm)}.path58-toast{display:flex;align-items:flex-start;gap:var(--p58-space-3);background:var(--p58-surface-2);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left:4px solid var(--p58-border-strong);border-radius:var(--p58-radius-lg);padding:var(--p58-space-3) var(--p58-space-4);min-width:280px;max-width:420px;animation:path58-toast-slide-in .2s ease-out;pointer-events:auto}.path58-toast__message{flex:1;min-width:0;color:var(--p58-fg-1);font-size:.875rem;line-height:1.5;word-break:break-word}.path58-toast__action{flex-shrink:0}.path58-toast__dismiss{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;min-width:32px;min-height:32px;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-toast__dismiss:hover{color:var(--p58-fg-1)}.path58-toast__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-toast--success{border-left-color:var(--p58-success)}.path58-toast--warning{border-left-color:var(--p58-warning)}.path58-toast--danger{border-left-color:var(--p58-danger)}.path58-toast--info{border-left-color:var(--p58-info)}@keyframes path58-toast-slide-in{0%{opacity:0;transform:translate(8px)}to{opacity:1;transform:translate(0)}}@media (prefers-reduced-motion: reduce){.path58-toast{animation:none}}.path58-banner{display:flex;align-items:flex-start;gap:var(--p58-space-3);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left-width:4px;border-radius:var(--p58-radius-lg);padding:var(--p58-space-4);font-size:.9375rem;line-height:1.5}.path58-banner__icon{flex-shrink:0;display:inline-flex;align-items:center;margin-top:2px}.path58-banner__content{flex:1;min-width:0}.path58-banner__title{font-weight:500;color:var(--p58-fg-1);margin-bottom:var(--p58-space-1)}.path58-banner__message{color:var(--p58-fg-2);word-break:break-word}.path58-banner__action{flex-shrink:0}.path58-banner__dismiss{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:44px;min-height:44px;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-banner__dismiss:hover{color:var(--p58-fg-1)}.path58-banner__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-banner--success{background:color-mix(in srgb,var(--p58-success) 12%,transparent);border-color:color-mix(in srgb,var(--p58-success) 30%,transparent);border-left-color:var(--p58-success)}.path58-banner--success .path58-banner__icon{color:var(--p58-success)}.path58-banner--warning{background:color-mix(in srgb,var(--p58-warning) 12%,transparent);border-color:color-mix(in srgb,var(--p58-warning) 30%,transparent);border-left-color:var(--p58-warning)}.path58-banner--warning .path58-banner__icon{color:var(--p58-warning)}.path58-banner--danger{background:color-mix(in srgb,var(--p58-danger) 12%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 30%,transparent);border-left-color:var(--p58-danger)}.path58-banner--danger .path58-banner__icon{color:var(--p58-danger)}.path58-banner--info{background:color-mix(in srgb,var(--p58-info) 12%,transparent);border-color:color-mix(in srgb,var(--p58-info) 30%,transparent);border-left-color:var(--p58-info)}.path58-banner--info .path58-banner__icon{color:var(--p58-info)}.path58-banner--sticky-top{position:sticky;top:0;z-index:200;border-radius:0}.path58-alert{display:flex;align-items:flex-start;gap:var(--p58-space-2);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left-width:3px;border-radius:var(--p58-radius-md);line-height:1.5}.path58-alert__icon{flex-shrink:0;display:inline-flex;align-items:center}.path58-alert__content{flex:1;min-width:0}.path58-alert__title{font-weight:500;color:var(--p58-fg-1)}.path58-alert__message{color:var(--p58-fg-2);word-break:break-word}.path58-alert__dismiss{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-alert__dismiss:hover{color:var(--p58-fg-1)}.path58-alert__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-alert--md{padding:var(--p58-space-3) var(--p58-space-4);font-size:.875rem;gap:var(--p58-space-3)}.path58-alert--md .path58-alert__icon{margin-top:2px}.path58-alert--md .path58-alert__dismiss{width:24px;height:24px;min-width:32px;min-height:32px}.path58-alert--sm{padding:var(--p58-space-2) var(--p58-space-3);font-size:.8125rem;gap:var(--p58-space-2)}.path58-alert--sm .path58-alert__icon{margin-top:1px}.path58-alert--sm .path58-alert__dismiss{width:20px;height:20px;min-width:28px;min-height:28px}.path58-alert--success{background:color-mix(in srgb,var(--p58-success) 10%,transparent);border-color:color-mix(in srgb,var(--p58-success) 28%,transparent);border-left-color:var(--p58-success)}.path58-alert--success .path58-alert__icon{color:var(--p58-success)}.path58-alert--warning{background:color-mix(in srgb,var(--p58-warning) 10%,transparent);border-color:color-mix(in srgb,var(--p58-warning) 28%,transparent);border-left-color:var(--p58-warning)}.path58-alert--warning .path58-alert__icon{color:var(--p58-warning)}.path58-alert--danger{background:color-mix(in srgb,var(--p58-danger) 10%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 28%,transparent);border-left-color:var(--p58-danger)}.path58-alert--danger .path58-alert__icon{color:var(--p58-danger)}.path58-alert--info{background:color-mix(in srgb,var(--p58-info) 10%,transparent);border-color:color-mix(in srgb,var(--p58-info) 28%,transparent);border-left-color:var(--p58-info)}.path58-alert--info .path58-alert__icon{color:var(--p58-info)}.path58-search-input{position:relative;display:flex;align-items:center;width:100%}.path58-search-input .path58-input{width:100%;padding-right:2.5rem}.path58-search-input-clear{position:absolute;right:.5rem;background:transparent;border:none;color:var(--p58-fg-3);padding:.25rem;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s}.path58-search-input-clear:hover{color:var(--p58-fg-1);background:color-mix(in srgb,var(--p58-fg-1) 10%,transparent)}.path58-info-card{display:flex;align-items:center;gap:.75rem;position:relative;margin-top:.25rem}.path58-info-card-content{display:flex;flex-direction:column;gap:.125rem;min-width:0;flex:1}.path58-info-card-value{font-size:.9375rem;color:var(--p58-fg-2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.path58-info-card-value{display:flex;flex-wrap:wrap;gap:.25rem}.path58-info-card--filters{border-color:color-mix(in srgb,var(--p58-teal) 20%,transparent)}.path58-info-card--selected{border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);background:color-mix(in srgb,var(--p58-teal) 3%,transparent)}.path58-info-card--category{transition:all .2s}.path58-info-card--clickable{cursor:pointer}.path58-category-header{width:100%;display:flex;align-items:center;gap:.5rem;padding:.75rem;background:color-mix(in srgb,var(--p58-teal) 8%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 15%,transparent);color:var(--p58-accent-fg);cursor:pointer;border-radius:6px;font-size:.875rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;transition:all .2s;margin-bottom:.25rem}.path58-category-header svg{color:var(--p58-accent-fg)}.path58-category-header:hover{background:color-mix(in srgb,var(--p58-teal) 12%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);color:var(--p58-accent-fg)}.path58-category-name{flex:1;text-align:left}.path58-category-count{color:var(--p58-fg-3);font-weight:400}.path58-category-chevron{transition:transform .2s}.path58-category-chevron--expanded{transform:rotate(90deg)}.path58-file-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.path58-dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--p58-overlay-backdrop);display:flex;align-items:center;justify-content:center;padding:var(--p58-space-6);z-index:1000;animation:path58-dialog-fade-in .15s ease-out}.path58-dialog-surface{background:var(--p58-surface);color:var(--p58-fg-1);border:1px solid var(--p58-border-strong);border-radius:var(--p58-radius-xl);padding:var(--p58-space-6);max-width:480px;width:100%;max-height:calc(100vh - var(--p58-space-12));overflow-y:auto;animation:path58-dialog-slide-up .2s ease-out}.path58-dialog-surface :focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px;border-radius:var(--p58-radius-sm)}@keyframes path58-dialog-fade-in{0%{opacity:0}to{opacity:1}}@keyframes path58-dialog-slide-up{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion: reduce){.path58-dialog-backdrop,.path58-dialog-surface{animation:none}}.path58-modal{display:flex;flex-direction:column;gap:var(--p58-space-4);margin:calc(var(--p58-space-6) * -1)}.path58-modal__header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--p58-space-3);padding:var(--p58-space-5) var(--p58-space-6);border-bottom:1px solid var(--p58-border)}.path58-modal__header-content{flex:1;min-width:0;color:var(--p58-fg-1);font-size:1rem;font-weight:500;line-height:1.4}.path58-modal__dismiss{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:44px;min-height:44px;background:transparent;border:none;color:var(--p58-fg-2);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out}.path58-modal__dismiss:hover{color:var(--p58-fg-1)}.path58-modal__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-modal__body{padding:0 var(--p58-space-6);color:var(--p58-fg-1);font-size:.9375rem;line-height:1.6}.path58-modal__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--p58-space-2);padding:var(--p58-space-4) var(--p58-space-6);border-top:1px solid var(--p58-border)}.path58-modal--sm{--path58-modal-max-width: 360px}.path58-modal--md{--path58-modal-max-width: 480px}.path58-modal--lg{--path58-modal-max-width: 640px}.path58-dialog-surface:has(.path58-modal--sm){max-width:360px}.path58-dialog-surface:has(.path58-modal--lg){max-width:640px}.path58-confirm-dialog__message{color:var(--p58-fg-2);font-size:.9375rem;line-height:1.6;padding:var(--p58-space-3) 0}.path58-confirm-dialog__spinner{display:inline-block;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:var(--p58-radius-full);margin-right:var(--p58-space-2);animation:path58-confirm-dialog-spin .6s linear infinite}@keyframes path58-confirm-dialog-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.path58-confirm-dialog__spinner{animation-duration:1.5s}}.path58-prompt-dialog__field{display:flex;flex-direction:column;gap:var(--p58-space-2);padding:var(--p58-space-3) 0}.path58-prompt-dialog__label{color:var(--p58-fg-2);font-size:.8125rem;font-weight:500;line-height:1.4}.path58-prompt-dialog__error{color:var(--p58-danger);font-size:.8125rem;line-height:1.4}.path58-search-input-wrapper{position:relative;display:flex;align-items:center;width:100%}.path58-tag-filter{display:flex;flex-direction:column;gap:.5rem;min-width:200px;height:110px;max-height:110px;overflow-y:scroll;overflow-x:hidden;position:relative;padding-right:0}.path58-tag-filter-header{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--p58-accent-fg);flex-shrink:0}.path58-tag-filter-clear{margin-left:auto}.path58-tag-filter-list{flex:1;min-height:0}.path58-tag-filter-scroll-hint{padding:.25rem .5rem;font-size:.625rem;color:var(--p58-fg-3);text-align:center;font-style:italic;border-top:1px solid color-mix(in srgb,var(--p58-teal) 10%,transparent);margin-top:.25rem;flex-shrink:0}.path58-category-group{margin-bottom:.5rem}.path58-category-file-list{display:flex;flex-direction:column;gap:.25rem;padding-left:.5rem}.path58-artifact-list.path58-list{flex:1 1 0!important;min-height:0!important;overflow-y:scroll!important;overflow-x:hidden!important;scrollbar-width:thin!important;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;scrollbar-gutter:stable!important;-webkit-overflow-scrolling:touch;padding:.5rem!important;display:flex!important;flex-direction:column!important;height:100%!important}.path58-artifact-list::-webkit-scrollbar{width:8px!important;-webkit-appearance:none!important;display:block!important}.path58-artifact-list::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;margin:2px 0;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;-webkit-appearance:none!important}.path58-artifact-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-artifact-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-toast-stack{position:fixed;display:flex;flex-direction:column;gap:var(--p58-space-2);z-index:1100;padding:var(--p58-space-4);pointer-events:none;max-width:calc(100vw - var(--p58-space-8))}.path58-toast-stack--top-right{top:0;right:0;align-items:flex-end}.path58-toast-stack--top-left{top:0;left:0;align-items:flex-start}.path58-toast-stack--bottom-right{bottom:0;right:0;align-items:flex-end;flex-direction:column-reverse}.path58-toast-stack--bottom-left{bottom:0;left:0;align-items:flex-start;flex-direction:column-reverse}.path58-tool-topbar{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 var(--p58-space-6);background:var(--p58-surface);border-bottom:1px solid var(--p58-border);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-md);gap:var(--p58-space-4)}.path58-tool-topbar__left{display:flex;align-items:center;gap:var(--p58-space-3);min-width:0}.path58-tool-topbar__right{display:flex;align-items:center;gap:var(--p58-space-3);flex-shrink:0}.path58-tool-topbar__mark{display:block;height:28px;width:auto;max-width:110px;flex-shrink:0}.path58-tool-topbar__wordmark{font-family:var(--p58-font-display, var(--p58-font-ui));font-weight:700;font-size:var(--p58-text-md, 16px);letter-spacing:var(--p58-tracking-tight, -.01em);color:var(--p58-blue-900, var(--p58-primary));line-height:1;flex-shrink:0}.path58-tool-topbar__divider{width:1px;height:18px;background:var(--p58-border-strong)}.path58-tool-topbar__tool-name{font-family:var(--p58-font-ui);font-size:var(--p58-text-md);font-weight:600;color:var(--p58-fg-1);white-space:nowrap}.path58-tool-topbar__engagement-chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;background:transparent;color:var(--p58-blue-900, var(--p58-primary));border:1px solid var(--p58-blue-900, var(--p58-primary));border-radius:var(--p58-radius-md);font-family:var(--p58-font-ui);font-size:var(--p58-text-xs);font-weight:500;letter-spacing:0;white-space:nowrap}.path58-tool-topbar__meta{display:inline-flex;align-items:center;gap:6px;font-family:var(--p58-font-mono);font-size:var(--p58-text-sm);white-space:nowrap;font-variant-numeric:tabular-nums}.path58-tool-topbar__meta-tool-id{color:var(--p58-fg-3);font-weight:500}.path58-tool-topbar__meta-sep{color:var(--p58-fg-4)}.path58-tool-topbar__meta-state{color:var(--p58-fg-2)}.path58-tool-topbar__save-dot{width:6px;height:6px;border-radius:var(--p58-radius-full);flex-shrink:0}.path58-tool-topbar__save-dot--idle{background:var(--p58-fg-4)}.path58-tool-topbar__save-dot--saving{background:var(--p58-warning);animation:path58-tool-topbar-pulse 1.2s ease-in-out infinite}.path58-tool-topbar__save-dot--saved{background:var(--p58-success)}@keyframes path58-tool-topbar-pulse{0%,to{opacity:.6}50%{opacity:1}}.path58-tool-topbar__engagement-chip:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}@media print{.path58-tool-topbar.no-print{display:none}}.path58-tool-footer{background:var(--p58-surface);border-top:1px solid var(--p58-border);color:var(--p58-fg-3);font-family:var(--p58-font-ui);font-size:var(--p58-text-sm)}.path58-tool-footer__inner{display:flex;align-items:center;gap:var(--p58-space-3);padding:12px var(--p58-space-6)}.path58-tool-footer__mark{width:18px;height:18px;flex-shrink:0;opacity:.7}.path58-tool-footer__text{flex:1;color:var(--p58-fg-3);font-size:var(--p58-text-sm);line-height:1.4}.path58-tool-footer__text strong{color:var(--p58-fg-2);font-weight:500}@media print{.path58-tool-footer{background:transparent;border-top-color:#000;color:#000}.path58-tool-footer__text{color:#000}.path58-tool-footer__text strong{color:#000;font-weight:600}.path58-tool-footer .no-print{display:none}}.path58-tool-authgate{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--p58-bg);gap:14px}.path58-tool-authgate__card{background:var(--p58-surface);border:1px solid var(--p58-border);border-radius:var(--p58-radius-lg, 12px);padding:44px;width:400px;display:flex;flex-direction:column;align-items:center;gap:8px}.path58-tool-authgate__brand{display:flex;align-items:center;justify-content:center;margin-bottom:24px;width:100%}.path58-tool-authgate__logo{display:block;height:84px;width:auto;max-width:280px}.path58-tool-authgate__title{margin:0 0 14px;font-size:22px;font-weight:700;color:var(--p58-fg-1);text-align:center;letter-spacing:var(--p58-tracking-tight, -.01em)}.path58-tool-authgate__chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;background:transparent;color:var(--p58-blue-900);border:1px solid var(--p58-blue-900);border-radius:var(--p58-radius-md, 6px);font-family:var(--p58-font-ui);font-size:12px;font-weight:500;letter-spacing:0}.path58-tool-authgate__footer{font-family:var(--p58-font-ui);font-size:12px;color:var(--p58-fg-3);text-align:left;width:400px;line-height:1.5;padding:0 4px}.path58-tool-authgate__form{display:flex;flex-direction:column;gap:10px;margin-top:14px;width:100%}.path58-tool-authgate__label{font-size:13px;font-weight:600;color:var(--p58-fg-2)}.path58-tool-authgate__input{box-sizing:border-box;width:100%;padding:9px 12px;border:1px solid var(--p58-border);border-radius:var(--p58-radius-md, 8px);background:var(--p58-surface-2);color:var(--p58-fg-1);font-size:14px;font-family:inherit}.path58-tool-authgate__input:focus{outline:none;border-color:var(--p58-blue-900);box-shadow:var(--p58-ring-focus)}.path58-tool-authgate__input:disabled{opacity:.55;cursor:not-allowed}.path58-tool-authgate__submit{box-sizing:border-box;width:100%;margin-top:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--p58-blue-900);color:#fff;border:none;border-radius:var(--p58-radius-md, 6px);font-family:inherit;font-weight:600;font-size:14px;padding:10px 18px;cursor:pointer;transition:background var(--p58-duration-fast, .12s) var(--p58-ease, ease)}.path58-tool-authgate__submit:hover{background:var(--p58-blue-700)}.path58-tool-authgate__submit:active{background:var(--p58-blue-900)}.path58-tool-authgate__submit:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}.path58-tool-authgate__submit:disabled{opacity:.55;cursor:not-allowed}.path58-tool-authgate__error{margin:0;font-size:13px;color:var(--p58-danger)}.path58-tool-authgate__sent p{margin:0 0 6px;font-size:14px}.path58-tool-authgate__hint{color:var(--p58-fg-3);font-size:13px}.path58-tool-sidebar{display:flex;flex-direction:column;width:240px;height:100%;background:var(--p58-surface);border-right:1px solid var(--p58-border, var(--p58-elev-1-border));color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-md);overflow-y:auto;overflow-x:hidden;transition:width var(--p58-duration-slow, .26s) var(--p58-ease, cubic-bezier(.2, .6, .2, 1))}.path58-tool-sidebar--collapsed{width:56px}@media (prefers-reduced-motion: reduce){.path58-tool-sidebar,.path58-tool-sidebar *{transition:none!important;animation:none!important}}.path58-tool-sidebar__header{display:flex;flex-direction:column;align-items:flex-start;gap:var(--p58-space-2);padding:var(--p58-space-3) var(--p58-space-3);flex-shrink:0}.path58-tool-sidebar--collapsed .path58-tool-sidebar__header{align-items:center}.path58-tool-sidebar__mark{display:block;height:24px;width:auto;max-width:110px;flex-shrink:0}.path58-tool-sidebar--collapsed .path58-tool-sidebar__mark{max-width:32px;height:20px}.path58-tool-sidebar__wordmark{font-family:var(--p58-font-display, var(--p58-font-ui));font-weight:700;font-size:var(--p58-text-md);letter-spacing:var(--p58-tracking-tight, -.01em);color:var(--p58-blue-900, var(--p58-primary));line-height:1}.path58-tool-sidebar__engagement-chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;background:transparent;color:var(--p58-blue-900, var(--p58-primary));border:1px solid var(--p58-blue-900, var(--p58-primary));border-radius:var(--p58-radius-md);font-family:var(--p58-font-ui);font-size:var(--p58-text-xs);font-weight:500;white-space:nowrap;transition:opacity var(--p58-duration-slow, .26s) var(--p58-ease, cubic-bezier(.2, .6, .2, 1))}.path58-tool-sidebar__engagement-chip:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}.path58-tool-sidebar__divider{height:1px;background:var(--p58-border, var(--p58-elev-1-border));margin:0 var(--p58-space-3);flex-shrink:0}.path58-tool-sidebar__launchpad{display:flex;align-items:center;gap:var(--p58-space-2);padding:var(--p58-space-2) var(--p58-space-3);color:var(--p58-fg-2);text-decoration:none;font-size:var(--p58-text-sm);font-weight:500;border-radius:var(--p58-radius-sm);margin:var(--p58-space-2) var(--p58-space-2);transition:background var(--p58-duration-fast, .12s) var(--p58-ease, cubic-bezier(.2, .6, .2, 1))}.path58-tool-sidebar--collapsed .path58-tool-sidebar__launchpad{justify-content:center}.path58-tool-sidebar__launchpad:hover{background:var(--p58-nav-hover-bg);color:var(--p58-fg-1)}.path58-tool-sidebar__launchpad:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}.path58-tool-sidebar__launchpad-arrow{font-size:var(--p58-text-md);line-height:1}.path58-tool-sidebar__tools{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}.path58-tool-sidebar__tool-item{margin:0}.path58-tool-sidebar__tool-link{display:flex;align-items:center;padding:var(--p58-space-2) var(--p58-space-3);min-height:32px;color:var(--p58-fg-2);text-decoration:none;font-size:var(--p58-text-sm);font-weight:500;position:relative;transition:background var(--p58-duration-fast, .12s) var(--p58-ease, cubic-bezier(.2, .6, .2, 1)),color var(--p58-duration-fast, .12s) var(--p58-ease, cubic-bezier(.2, .6, .2, 1))}.path58-tool-sidebar--collapsed .path58-tool-sidebar__tool-link{justify-content:center;padding:var(--p58-space-2) 0}.path58-tool-sidebar__tool-link:hover{background:var(--p58-nav-hover-bg);color:var(--p58-fg-1)}.path58-tool-sidebar__tool-link:focus-visible{outline:none;box-shadow:var(--p58-ring-focus);position:relative;z-index:1}.path58-tool-sidebar__tool-link--active{background:var(--p58-nav-active-bg);color:var(--p58-fg-1);font-weight:600}.path58-tool-sidebar__tool-link--active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--p58-nav-active-accent)}.path58-tool-sidebar__tool-link--active:hover{background:var(--p58-nav-active-bg)}.path58-tool-sidebar__tool-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--p58-font-ui)}.path58-tool-sidebar__tool-short{font-family:var(--p58-font-mono, var(--p58-font-ui));font-size:var(--p58-text-sm);font-variant-numeric:tabular-nums}.path58-tool-sidebar__spacer{flex:1 1 auto;min-height:var(--p58-space-3)}.path58-tool-sidebar__toggle{display:flex;align-items:center;justify-content:center;height:32px;width:100%;background:transparent;border:none;border-top:1px solid var(--p58-border, var(--p58-elev-1-border));color:var(--p58-fg-3);font-size:var(--p58-text-lg);cursor:pointer;font-family:var(--p58-font-ui);transition:background var(--p58-duration-fast, .12s) var(--p58-ease, cubic-bezier(.2, .6, .2, 1))}.path58-tool-sidebar__toggle:hover{background:var(--p58-nav-hover-bg);color:var(--p58-fg-1)}.path58-tool-sidebar__toggle:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}@media (max-width: 767px){.path58-tool-sidebar{position:fixed;top:0;left:0;bottom:0;z-index:var(--p58-z-modal, 100);width:240px;transform:translate(-100%);transition:transform var(--p58-duration-slow, .26s) var(--p58-ease, cubic-bezier(.2, .6, .2, 1))}.path58-tool-sidebar--collapsed{width:56px}.path58-tool-sidebar.path58-tool-sidebar--mobile-open{transform:translate(0)}}.path58-tool-sidebar__backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--p58-overlay-backdrop, rgba(0, 0, 0, .5));z-index:calc(var(--p58-z-modal, 100) - 1);animation:path58-tool-sidebar-backdrop-fade-in var(--p58-duration-slow, .26s) var(--p58-ease, cubic-bezier(.2, .6, .2, 1)) both;display:none}@media (max-width: 767px){.path58-tool-sidebar__backdrop{display:block}}@keyframes path58-tool-sidebar-backdrop-fade-in{0%{opacity:0}to{opacity:1}}@media print{.path58-tool-sidebar.no-print,.path58-tool-sidebar__backdrop{display:none}}.path58-tool-sidebar-host{display:flex;flex:1 1 auto;min-height:0;width:100%}.path58-tool-sidebar-host__main{flex:1 1 auto;min-width:0;min-height:0;overflow:auto;background:var(--p58-bg)}.path58-tool-sidebar-host__mobile-trigger{display:none}@media (max-width: 767px){.path58-tool-sidebar-host__mobile-trigger{display:flex;position:fixed;top:12px;right:12px;z-index:50;width:40px;height:40px;align-items:center;justify-content:center;background:var(--p58-surface);color:var(--p58-fg-1);border:1px solid var(--p58-border, var(--p58-elev-1-border));border-radius:var(--p58-radius-md);font-size:var(--p58-text-lg);cursor:pointer}.path58-tool-sidebar-host__mobile-trigger:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}.path58-tool-sidebar-host>.path58-tool-sidebar:not(.path58-tool-sidebar--mobile){display:none}}.path58-input-field{display:flex;flex-direction:column;gap:5px;font-family:var(--p58-font-ui)}.path58-input-field--no-label{gap:0}.path58-input__label{font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:500;color:var(--p58-fg-2);display:flex;align-items:baseline;gap:4px}.path58-input__label.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.path58-input__required{color:var(--p58-fg-2);font-weight:500}.path58-input__shell{position:relative;display:block}.path58-input{width:100%;box-sizing:border-box;background:var(--p58-surface-2);border:1px solid var(--p58-border);border-radius:var(--p58-radius-lg);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-base);outline:none;transition:background var(--p58-duration-fast) var(--p58-ease),border-color var(--p58-duration-fast) var(--p58-ease),box-shadow var(--p58-duration-fast) var(--p58-ease)}.path58-input::placeholder{color:var(--p58-fg-4)}.path58-input--sm{padding:7px 12px}.path58-input--md{padding:9px 14px}.path58-input--lg{padding:13px 16px;font-size:var(--p58-text-lg)}.path58-input:hover:not(:disabled):not(.path58-input--invalid){border-color:#0d1d4d66;background:#fafbfd}.path58-input:focus,.path58-input:focus-visible{border-color:var(--p58-blue-900);box-shadow:var(--p58-ring-focus);background:var(--p58-surface-2)}.path58-input--invalid,.path58-input--invalid:hover{border-color:var(--p58-danger);background:var(--p58-surface-2);padding-right:36px}.path58-input--invalid:focus,.path58-input--invalid:focus-visible{border-color:var(--p58-danger);box-shadow:0 0 0 2px var(--p58-bg),0 0 0 4px var(--p58-danger)}.path58-input__invalid-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--p58-danger);pointer-events:none}.path58-input--disabled,.path58-input:disabled{background:var(--p58-surface-disabled);border-color:var(--p58-border-subtle);color:var(--p58-fg-3);cursor:not-allowed}.path58-input--disabled::placeholder,.path58-input:disabled::placeholder{color:var(--p58-fg-4)}.path58-input--mono{font-family:var(--p58-font-mono);font-variant-numeric:tabular-nums}.path58-input--with-prefix.path58-input--sm{padding-left:28px}.path58-input--with-prefix.path58-input--md{padding-left:30px}.path58-input--with-prefix.path58-input--lg{padding-left:32px}.path58-input--with-suffix.path58-input--sm{padding-right:28px}.path58-input--with-suffix.path58-input--md{padding-right:30px}.path58-input--with-suffix.path58-input--lg{padding-right:32px}.path58-input__adornment{position:absolute;top:50%;transform:translateY(-50%);font-family:var(--p58-font-mono);font-size:var(--p58-text-base);font-weight:400;color:var(--p58-fg-3);pointer-events:none;-webkit-user-select:none;user-select:none;font-variant-numeric:tabular-nums}.path58-input__adornment--prefix{left:14px}.path58-input__adornment--suffix{right:14px}.path58-input__hint{margin:4px 0 0;font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:400;color:var(--p58-fg-3);line-height:var(--p58-leading-normal)}.path58-input__error{margin:4px 0 0;font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:400;color:var(--p58-danger);line-height:var(--p58-leading-normal)}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@path58/ui",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.7.2",
|
|
4
4
|
"description": "Path58 UI — React component library (atoms, molecules, organisms, primitives). Consumes @path58/tokens at runtime via CSS variables.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -37,7 +37,8 @@
|
|
|
37
37
|
"focus-trap-react": "^12.0.2",
|
|
38
38
|
"lucide-react": "^0.294.0",
|
|
39
39
|
"react-icons": "^5.5.0",
|
|
40
|
-
"@path58/tokens": "^1.
|
|
40
|
+
"@path58/tokens": "^1.2.0",
|
|
41
|
+
"@path58/tool-registry": "^0.1.0"
|
|
41
42
|
},
|
|
42
43
|
"devDependencies": {
|
|
43
44
|
"@storybook/addon-a11y": "8.6.14",
|