@cratis/event-models 0.133.0 → 0.135.0

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/README.md CHANGED
@@ -38,6 +38,50 @@ export const Board = () => (
38
38
  - The board fills its parent, so give the parent a height.
39
39
  - `readOnly` draws the board without any editing gestures. Leave it off and pass `editor` to receive the board's edits as callbacks. The package never persists anything by itself.
40
40
 
41
+ ## Edit artifact properties
42
+
43
+ Supply any of these optional `BoardEditing` callbacks through `editor.editing`:
44
+
45
+ ```tsx
46
+ <EventModelBoard document={model} editor={{ editing: {
47
+ onCommandPropertiesChanged: (sliceId, commandId, schema) => keepCommandSchema(sliceId, commandId, schema),
48
+ onReadModelPropertiesChanged: (sliceId, readModelId, schema) => keepReadModelSchema(sliceId, readModelId, schema),
49
+ onEventPropertiesChanged: (sliceId, eventId, schema) => keepEventSchema(sliceId, eventId, schema),
50
+ } }} />
51
+ ```
52
+
53
+ Each callback receives the **complete `JsonSchema`**, from `@cratis/components/SchemaEditor`, after every edit. Despite the callback names, this is not a `Property[]`. The host owns persistence, errors and batching. Update your local board document in the callback and persist separately, so delayed server snapshots cannot overwrite an edit. The package does not cache an unacknowledged schema across card mounts or mask authoritative host updates. Studio retains its existing optimistic state and command save-on-close policy in its host adapters.
54
+
55
+ Clicking a card opens its properties-only editor only when its callback exists and its slice and board are editable. Existing `BoardActions` card `onActivate` callbacks take precedence, allowing a host to open its advanced editor instead. No rules, concurrency, projection or constraint editors are included by default.
56
+
57
+ The shared tree supports adding, renaming, retyping and removing properties, nested objects and arrays, and concepts. `id` remains protected. Command schemas offer an identifier; command and event schemas offer required flags. Read models offer neither. The `PropertiesOnly` board story demonstrates all three callbacks without Studio.
58
+
59
+ ### Reusable editor components
60
+
61
+ `PropertySchemaCard` and `PropertySchemaDialog` are exported from the package root. Import the package stylesheet as for the board. A host can reuse these within its existing editor without copying property UI.
62
+
63
+ | `PropertySchemaCard` prop | Purpose |
64
+ | --- | --- |
65
+ | `name`, `kind` | Accessible/display name and `ArtifactCardKind` (`command`, `readModel`, `event`) |
66
+ | `editor` | Components `SchemaEditorProps` except `layout` and `aria-label`; tree layout and the artifact's accessible name are package-owned |
67
+ | `targetLabel` | Localized panel heading; defaults to `Target` |
68
+ | `headerLeading`, `headerActions` | Host connector and header-action slots |
69
+ | `headerStyle`, `onHeaderClick`, `rootDropTarget` | Mapping highlight, root selection and root drop marker |
70
+ | `beforeProperties`, `afterCard` | Host validation panel and dismissing backdrop slots |
71
+
72
+ The `editor` slots can attach rule rows, mapping connectors, rename/delete cleanup and validation while the shared component retains its property controls. Controlled `properties` mode and all its callbacks remain available for mapping editors; `schema`/`onChange` provide schema-managed mode. Host policies may override required/key availability.
73
+
74
+ | `PropertySchemaDialog` prop | Purpose |
75
+ | --- | --- |
76
+ | `name`, `kind`, `schema?` | Artifact and initial/current schema; omitted schema starts as an empty object |
77
+ | `sourceRect` | Viewport origin offered to custom dialog chrome |
78
+ | `onSchemaChange`, `onClose` | Complete-schema edits and dismissal; dismissal never emits another edit |
79
+ | `labels`, `targetLabel` | Components property-control labels and panel heading |
80
+ | `frame` | Optional `ComponentType<PropertySchemaDialogFrameProps>`; receives `name`, `kind`, `sourceRect`, `onClose`, `children` |
81
+ | `renderContent` | Optional host-owned advanced content; receives the schema-change callback |
82
+
83
+ The default frame is a dismissable Components `Dialog`, 440px wide, with content-focused initial focus and no confirm footer. Studio supplies its existing flying dialog through `frame`, and attaches advanced content through the card's slots. `EventModelMessages.propertyEditor` optionally provides `target` and `labels` to built-in board editors. `propertySchemaChangeHandler(editing, kind, sliceId?, artifactId?)` binds the matching callback to both identities, or returns `undefined` when editing is unavailable.
84
+
41
85
  ## Open the screen editor from the board
42
86
 
43
87
  The board reports when someone selects a slice's screen preview. `@cratis/event-models/screen-editor` is the editor that opens over it, so a host outside Cratis Studio can let people design a screen without any Studio code. It is a separate entry, and a host that only draws the board installs none of what it needs.
@@ -1,4 +1,5 @@
1
1
  import type { Guid } from '@cratis/fundamentals';
2
+ import type { JsonSchema } from '@cratis/components/SchemaEditor';
2
3
  import type { EventItem, SliceStatus, SliceType, TranslationDirection } from '../Model';
3
4
  import type { TriggerKind } from '../Rows/System/TriggerKind';
4
5
  import type { SpecificationEditing } from '../Specifications/SpecificationEditing';
@@ -9,11 +10,17 @@ export interface BoardEditing extends SpecificationEditing, StickyNoteChanges {
9
10
  onSliceStatusChanged?: (sliceId: Guid, status: SliceStatus) => Promise<boolean | void> | void;
10
11
  onTranslationDirectionChanged?: (sliceId: Guid, direction: TranslationDirection) => Promise<boolean | void> | void;
11
12
  onSliceAdded?: (afterSliceId: Guid, sliceType: SliceType) => void;
13
+ onFeatureAdded?: (moduleId: Guid) => void;
14
+ onSubFeatureAdded?: (featureId: Guid) => void;
15
+ onSliceAddedToFeature?: (featureId: Guid, sliceType: SliceType) => void;
12
16
  onEventAdded?: (sliceId: Guid) => void;
13
17
  onEventReferenced?: (sliceId: Guid, source: EventItem) => void;
14
18
  onEventRenamed?: (sliceId: Guid, eventId: Guid, name: string) => string | void;
15
19
  onCommandRenamed?: (sliceId: Guid, commandId: Guid, name: string) => void;
16
20
  onReadModelRenamed?: (sliceId: Guid, readModelId: Guid, name: string) => void;
21
+ onCommandPropertiesChanged?: (sliceId: Guid, commandId: Guid, properties: JsonSchema) => void;
22
+ onReadModelPropertiesChanged?: (sliceId: Guid, readModelId: Guid, properties: JsonSchema) => void;
23
+ onEventPropertiesChanged?: (sliceId: Guid, eventId: Guid, properties: JsonSchema) => void;
17
24
  onReadModelAdded?: (sliceId: Guid, host: DOMRect) => void;
18
25
  onTriggerKindChosen?: (sliceId: Guid, kind: TriggerKind) => void;
19
26
  onTriggerOpened?: (sliceId: Guid) => void;
@@ -1,5 +1,7 @@
1
1
  import type { Position } from '../Model';
2
+ import type { EventModelImageExportOptions } from './EventModelImageExportOptions';
2
3
  export interface EventModelBoardHandle {
3
4
  addCollection(x: number, y: number): Promise<void>;
4
5
  addStickyNote(center: Position): void;
6
+ exportImage(options?: EventModelImageExportOptions): Promise<Blob>;
5
7
  }
@@ -0,0 +1,5 @@
1
+ export interface EventModelImageExportOptions {
2
+ scale?: number;
3
+ background?: string;
4
+ padding?: number;
5
+ }
@@ -0,0 +1,11 @@
1
+ import type { ReactElement } from 'react';
2
+ export declare const EXPORT_EXCLUDE_ATTRIBUTE = "data-event-model-export-exclude";
3
+ export interface BoardImageCaptureEnvironment {
4
+ createContainer: (width: number, height: number, padding: number) => HTMLElement;
5
+ removeContainer: (container: HTMLElement) => void;
6
+ mount: (container: HTMLElement, element: ReactElement) => () => void;
7
+ waitForLayoutToSettle: () => Promise<void>;
8
+ captureBlob: (container: HTMLElement, pixelRatio: number, backgroundColor: string) => Promise<Blob | null>;
9
+ }
10
+ export declare const defaultBoardImageCaptureEnvironment: BoardImageCaptureEnvironment;
11
+ export declare function captureBoardImage(element: ReactElement, width: number, height: number, padding: number, pixelRatio: number, backgroundColor: string, environment?: BoardImageCaptureEnvironment): Promise<Blob>;
@@ -0,0 +1,13 @@
1
+ import type { Position } from '../Model';
2
+ export interface ContentBoundingBox {
3
+ left: number;
4
+ top: number;
5
+ width: number;
6
+ height: number;
7
+ }
8
+ export declare function contentBoundingBox<T extends {
9
+ position: Position;
10
+ }>(collections: readonly T[], estimateSize: (collection: T) => {
11
+ width: number;
12
+ height: number;
13
+ }): ContentBoundingBox;
@@ -0,0 +1,17 @@
1
+ import type { Guid } from '@cratis/fundamentals';
2
+ import type { CollectionSizeEstimate } from '../Collections';
3
+ import type { ModuleCollectionLink, StickyNote } from '../Model';
4
+ import type { BoardCollection, BoardCollections } from './BoardCollections';
5
+ import { captureBoardImage } from './captureBoardImage';
6
+ import type { EventModelImageExportOptions } from './EventModelImageExportOptions';
7
+ export interface ExportBoardImageParams<T extends BoardCollection> {
8
+ documentId: Guid;
9
+ collections: readonly T[];
10
+ estimateSize: (collection: T) => CollectionSizeEstimate;
11
+ countSlices: (collection: T) => number;
12
+ renderCollection: BoardCollections<T>['renderCollection'];
13
+ links: ModuleCollectionLink[];
14
+ stickyNotes: readonly StickyNote[];
15
+ options?: EventModelImageExportOptions;
16
+ }
17
+ export declare function exportBoardImage<T extends BoardCollection>(params: ExportBoardImageParams<T>, capture?: typeof captureBoardImage): Promise<Blob>;
@@ -0,0 +1,9 @@
1
+ import type { Position } from '../Model';
2
+ import type { ContentBoundingBox } from './contentBoundingBox';
3
+ export interface ExportImageLayout {
4
+ canvasWidth: number;
5
+ canvasHeight: number;
6
+ canvasInitialZoom: number;
7
+ canvasInitialPan: Position;
8
+ }
9
+ export declare function exportImageLayout(boundingBox: ContentBoundingBox): ExportImageLayout;
@@ -12,6 +12,11 @@ export * from './EventModelBoard';
12
12
  export * from './EventModelBoardEditor';
13
13
  export * from './EventModelBoardHandle';
14
14
  export * from './BoardCollections';
15
+ export * from './captureBoardImage';
16
+ export * from './contentBoundingBox';
17
+ export * from './EventModelImageExportOptions';
18
+ export * from './exportBoardImage';
19
+ export * from './exportImageLayout';
15
20
  export * from './HostedEventModelBoard';
16
21
  export * from './boardMinimap';
17
22
  export * from './isLargeBoard';
@@ -21,3 +26,4 @@ export * from './BoardViewOptions';
21
26
  export * from './BoardOverlay';
22
27
  export * from './EditToolbar';
23
28
  export * from './nextModulePosition';
29
+ export * from './structuralAddCallbacks';
@@ -0,0 +1,8 @@
1
+ import type { Guid } from '@cratis/fundamentals';
2
+ import type { SliceType } from '../Model';
3
+ import type { BoardEditing } from './BoardEditing';
4
+ export declare const featureAddCallback: (moduleId: Guid, supplied: (() => void) | undefined, editing: BoardEditing) => (() => void) | undefined;
5
+ export declare const featureStructuralAddCallbacks: (featureId: Guid, onAddSubFeature: (() => void) | undefined, onAddSlice: ((sliceType: SliceType) => void) | undefined, editing: BoardEditing) => {
6
+ onAddSubFeature: (() => void) | undefined;
7
+ onAddSlice: ((sliceType: SliceType) => void) | undefined;
8
+ };
@@ -1,3 +1,4 @@
1
+ import type { SchemaEditorLabels } from '@cratis/components/SchemaEditor';
1
2
  import type { SpecificationValueMessages } from './SpecificationValueMessages';
2
3
  import type { ViewOptionsMessages } from './ViewOptionsMessages';
3
4
  export interface EventModelMessages {
@@ -34,6 +35,10 @@ export interface EventModelMessages {
34
35
  properties: {
35
36
  none: string;
36
37
  };
38
+ propertyEditor?: {
39
+ target?: string;
40
+ labels?: Partial<SchemaEditorLabels>;
41
+ };
37
42
  references: {
38
43
  navigateToOriginal: string;
39
44
  removeExternalEvent: string;
@@ -0,0 +1,17 @@
1
+ import type { CSSProperties, ReactNode } from 'react';
2
+ import { type SchemaEditorProps } from '@cratis/components/SchemaEditor';
3
+ import { ArtifactCardKind } from '../Cards/ArtifactCardKind';
4
+ export interface PropertySchemaCardProps {
5
+ name: string;
6
+ kind: ArtifactCardKind;
7
+ editor: Omit<SchemaEditorProps, 'layout' | 'aria-label'>;
8
+ targetLabel?: string;
9
+ headerLeading?: ReactNode;
10
+ headerActions?: ReactNode;
11
+ headerStyle?: CSSProperties;
12
+ onHeaderClick?: () => void;
13
+ rootDropTarget?: boolean;
14
+ beforeProperties?: ReactNode;
15
+ afterCard?: ReactNode;
16
+ }
17
+ export declare const PropertySchemaCard: ({ name, kind, editor, targetLabel, headerLeading, headerActions, headerStyle, onHeaderClick, rootDropTarget, beforeProperties, afterCard }: PropertySchemaCardProps) => import("react").JSX.Element;
@@ -0,0 +1,19 @@
1
+ import { type ComponentType, type ReactNode } from 'react';
2
+ import type { JsonSchema, SchemaEditorLabels } from '@cratis/components/SchemaEditor';
3
+ import { ArtifactCardKind } from '../Cards/ArtifactCardKind';
4
+ export interface PropertySchemaDialogFrameProps {
5
+ name: string;
6
+ kind: ArtifactCardKind;
7
+ sourceRect: DOMRect;
8
+ onClose: () => void;
9
+ children: ReactNode;
10
+ }
11
+ export interface PropertySchemaDialogProps extends Omit<PropertySchemaDialogFrameProps, 'children'> {
12
+ schema?: JsonSchema;
13
+ onSchemaChange: (schema: JsonSchema) => void;
14
+ labels?: Partial<SchemaEditorLabels>;
15
+ targetLabel?: string;
16
+ frame?: ComponentType<PropertySchemaDialogFrameProps>;
17
+ renderContent?: (onChange: (schema: JsonSchema) => void) => ReactNode;
18
+ }
19
+ export declare const PropertySchemaDialog: ({ name, kind, schema, sourceRect, onSchemaChange, onClose, labels, targetLabel, frame: Frame, renderContent }: PropertySchemaDialogProps) => import("react").JSX.Element;
@@ -1,3 +1,6 @@
1
+ export * from './PropertySchemaCard';
2
+ export * from './PropertySchemaDialog';
3
+ export * from './propertySchemaChangeHandler';
1
4
  export * from './TypeBadge';
2
5
  export * from './schemaProperties';
3
6
  export * from './SchemaTooltipProperties';
@@ -0,0 +1,5 @@
1
+ import type { Guid } from '@cratis/fundamentals';
2
+ import type { JsonSchema } from '@cratis/components/SchemaEditor';
3
+ import type { BoardEditing } from '../Board/BoardEditing';
4
+ import { ArtifactCardKind } from '../Cards/ArtifactCardKind';
5
+ export declare const propertySchemaChangeHandler: (editing: BoardEditing, kind: ArtifactCardKind, sliceId?: Guid, artifactId?: Guid) => ((schema: JsonSchema) => void) | undefined;
@@ -3,4 +3,5 @@ export interface SchemaProperty {
3
3
  name: string;
4
4
  type: string;
5
5
  }
6
+ export declare const parsePropertySchema: (schema?: string | JsonSchema) => JsonSchema | undefined;
6
7
  export declare const topLevelSchemaProperties: (schema?: string | JsonSchema) => SchemaProperty[];
@@ -0,0 +1,8 @@
1
+ import type { Guid } from '@cratis/fundamentals';
2
+ import type { JsonSchema } from '@cratis/components/SchemaEditor';
3
+ import type { ArtifactCardKind } from '../Cards/ArtifactCardKind';
4
+ export declare const useArtifactPropertyEditing: (kind: ArtifactCardKind, artifactId: Guid | undefined, name: string, schema: string | JsonSchema | undefined) => {
5
+ schema: string | JsonSchema | undefined;
6
+ onActivate: ((_: Guid, host: DOMRect) => void) | undefined;
7
+ overlay: import("react").JSX.Element | undefined;
8
+ };
@@ -1,2 +1,2 @@
1
- .event-modeling-grid-add-button{border:1.5px solid var(--surface-300);width:28px;height:28px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border-radius:50%;flex-shrink:0;justify-content:center;align-self:center;align-items:center;font-size:18px;line-height:1;transition:border-color .15s,color .15s;display:flex}.event-modeling-grid-add-button:hover{border-color:var(--text-color);color:var(--text-color)}.event-modeling-grid-add-button--small{border:1px solid var(--surface-200);width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border-radius:50%;justify-content:center;align-items:center;font-size:14px;line-height:1;transition:border-color .15s,color .15s;display:flex}.event-modeling-grid-add-button--small:hover{border-color:var(--surface-300);color:var(--text-color)}.event-modeling-grid-add-button--no-circle,.event-modeling-grid-add-button--small.event-modeling-grid-add-button--no-circle{border:none;border-radius:4px}.event-modeling-grid-add-button--no-circle:hover,.event-modeling-grid-add-button--small.event-modeling-grid-add-button--no-circle:hover{border-color:#0000}.event-modeling-translation-direction--readonly{width:20px;height:20px;color:var(--text-color-secondary);justify-content:center;align-items:center;display:flex}.grid-tooltip-root{display:inline-flex}.grid-tooltip-bubble{pointer-events:none;background:var(--surface-100);color:var(--text-color);white-space:normal;opacity:0;border-radius:5px;width:max-content;max-width:320px;padding:6px 8px;font-family:system-ui,sans-serif;font-size:11px;animation:.15s .2s forwards grid-tooltip-appear;display:block;box-shadow:0 2px 8px #00000040}@keyframes grid-tooltip-appear{to{opacity:1}}.collection-drag-handle{cursor:grab;z-index:10;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:6px;justify-content:center;align-items:center;width:40px;height:40px;transition:background .15s,border-color .15s;display:flex;position:absolute;left:8px}.collection-drag-handle:hover{background:#ffffff14;border-color:#ffffff26}.collection-drag-handle--dragging{cursor:grabbing}.collection-drag-handle i{color:#fff9;font-size:16px}.event-model-collection-placeholder{box-sizing:border-box;align-items:flex-start;gap:8px;padding-left:56px;display:flex}.event-model-collection-placeholder-module{flex-direction:column;gap:4px;display:flex}.event-model-collection-placeholder-pill{background:color-mix(in srgb, var(--cratis-text-color) 5%, transparent);border:1px solid color-mix(in srgb, var(--cratis-text-color) 10%, transparent);box-sizing:border-box;height:44px}.event-model-collection-placeholder-body{border:2px dashed color-mix(in srgb, var(--cratis-text-color) 14%, transparent);background:color-mix(in srgb, var(--cratis-text-color) 4%, transparent);box-sizing:border-box;border-radius:10px}.event-modeling-grid-row-labels{flex-direction:column;flex-shrink:0;display:flex}.event-modeling-grid-row-label{box-sizing:border-box;flex-direction:column;gap:4px;padding:4px;display:flex}.event-modeling-grid-row-label-pill{background:var(--surface-50);border:1px solid var(--surface-200);border-radius:40px;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:0;display:flex;position:relative;overflow:visible}.event-modeling-grid-row-label-title{flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:0;padding:22px 0;display:flex}.event-modeling-grid-row-label-text,.event-modeling-grid-row-label .event-modeling-grid-editable-label,.event-modeling-grid-row-label .event-modeling-grid-editable-label-input{white-space:nowrap;color:var(--text-color-secondary);text-transform:uppercase;letter-spacing:.05em;-webkit-user-select:none;user-select:none;font-size:11px;font-weight:600;transform:rotate(-90deg)}.event-modeling-grid-row-label .event-modeling-grid-editable-label-input{text-align:center;background:0 0;border:none;outline:none;align-self:center;width:5rem;min-width:0;height:auto;margin:0;padding:0}.event-modeling-grid-row-label-info{justify-content:center;align-items:center;padding:4px 0 0;display:flex;position:absolute;top:0;left:0;right:0}.event-modeling-grid-row-label-info-btn{color:#ffffff59;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;padding:0;font-size:11px;line-height:1;transition:color .15s;display:flex}.event-modeling-grid-row-label-info-btn:hover{color:#ffffffd9}.event-modeling-grid-row-label-add-role{justify-content:center;align-items:center;padding:0 0 4px;display:flex;position:absolute;bottom:0;left:0;right:0}.event-modeling-grid-row-label-add-role-btn{color:#ffffff59;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;font-size:12px;line-height:1;transition:border-color .15s,color .15s;display:flex}.event-modeling-grid-row-label-add-role-btn:hover{color:#ffffffd9;border-color:#fff9}.event-modeling-grid-row-role-menu{z-index:300;white-space:nowrap;background:#27272a;border:1px solid #ffffff1f;border-radius:8px;flex-direction:column;gap:2px;min-width:140px;padding:4px;display:flex;position:absolute;bottom:0;left:calc(100% + 8px);box-shadow:0 4px 16px #0006}.event-modeling-grid-row-role-menu-option{cursor:pointer;text-align:left;color:#ffffffbf;background:0 0;border:none;border-radius:5px;align-items:center;gap:8px;width:100%;padding:6px 10px;font-size:12px;font-weight:500;transition:background .1s;display:flex}.event-modeling-grid-row-role-menu-option:hover{background:#ffffff12}.event-modeling-grid-row-role-menu-option--danger{color:var(--red-400);border-top:1px solid #ffffff14;margin-top:2px;padding-top:8px}.event-modeling-grid-row-role-menu-option--danger:hover{background:#ef44441f}.event-modeling-grid-collapse-btn{cursor:pointer;color:var(--text-color-secondary);background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;padding:3px;transition:color .15s,background .15s;display:flex}.event-modeling-grid-collapse-btn:hover{color:var(--text-color);background:var(--surface-100)}.event-modeling-grid-editable-label{cursor:inherit;-webkit-user-select:none;user-select:none}.event-modeling-grid-editable-label-placeholder{color:var(--text-color-secondary)}.event-modeling-grid-editable-label-input{background:0 0;border:none;outline:none;width:100%}.event-modeling-grid-editable-label-input--error{border-radius:3px;outline:2px solid #f87171}.entity-error-indicator{color:var(--red-500);cursor:default;justify-content:center;align-items:center;font-size:14px;display:inline-flex}.errored-entity{box-sizing:border-box;color:var(--text-color-secondary);text-align:center;cursor:default;background:#ef444414;border:1.5px dashed #ef44448c;border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:6px;padding:12px 8px;display:flex}.errored-entity--slice{width:220px;min-height:160px}.errored-entity--feature{min-width:220px;min-height:200px}.errored-entity--module{min-width:260px;min-height:240px}.errored-entity__mark{color:var(--red-500);font-size:22px}.errored-entity__label{max-width:100%;color:var(--text-color);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:600;overflow:hidden}.errored-entity__hint{font-size:11px}.errored-entity__retry{border:1px solid var(--surface-border);background:var(--surface-card);color:var(--text-color);cursor:pointer;border-radius:4px;padding:2px 10px;font-size:11px}.event-modeling-grid-pill{white-space:nowrap;box-sizing:border-box;border-radius:40px;grid-template-columns:1fr auto 1fr;align-items:center;width:100%;min-width:min-content;padding:0 8px;font-size:12px;font-weight:600;line-height:16px;display:grid;position:relative}.event-modeling-grid-pill--module{color:#ffffff8c}.event-modeling-grid-pill--feature{color:#ffffff73}.event-modeling-grid-pill-left{justify-self:start;align-items:center;gap:4px;display:flex}.event-modeling-grid-pill-right{justify-self:end;align-items:center;gap:4px;display:flex}.event-modeling-grid-pill--collapsed{gap:4px;width:auto;padding:0 6px;display:flex}.event-modeling-grid-pill--draggable{cursor:grab;touch-action:none}.event-modeling-grid-pill--draggable:active{cursor:grabbing}.event-modeling-grid-slice-ghost{opacity:.5;filter:drop-shadow(0 12px 24px #00000073)}.event-modeling-grid-slice-ghost--invalid{filter:drop-shadow(0 12px 24px #00000073)grayscale(.6)sepia()saturate(6)hue-rotate(-35deg)}.event-modeling-grid-slice-ghost-fallback{color:var(--text-color);background:#503ca0a6;border:1.5px dashed #b4a5ffbf;border-radius:8px;justify-content:center;align-items:center;gap:6px;font-size:11px;font-weight:500;display:flex}.event-modeling-grid-slice-ghost-fallback--invalid{background:#be2d2db8;border:1.5px solid #ff7878e6}.event-modeling-grid-slice-ghost-reason{color:#ffebebf2;background:#781414eb;border:1px solid #ff787899;border-radius:6px;margin-top:4px;padding:4px 8px;font-size:10px;line-height:1.3}.event-modeling-grid-slice-drop-indicator{background:#b4a5fff2;border-radius:3px;flex-shrink:0;align-self:stretch;width:6px;animation:1.1s ease-in-out infinite event-modeling-grid-slice-drop-indicator-pulse;box-shadow:0 0 0 1px #ffffff40,0 0 14px 3px #9682ffa6}.event-modeling-grid-slice-drop-indicator--invalid{background:#ff7878f2;box-shadow:0 0 0 1px #ffffff40,0 0 14px 3px #ff505099}@keyframes event-modeling-grid-slice-drop-indicator-pulse{50%{opacity:.55}}@media (prefers-reduced-motion:reduce){.event-modeling-grid-slice-drop-indicator{animation:none}}.event-modeling-grid-slice-drop-target--active{outline-offset:3px;background:#9682ff14;border-radius:10px;outline:1.5px dashed #b4a5ff73}.event-modeling-grid-drop-indicator{background:#b4a5fff2;border-radius:3px;flex-shrink:0;align-self:stretch;width:6px;animation:1.1s ease-in-out infinite event-modeling-grid-slice-drop-indicator-pulse;box-shadow:0 0 0 1px #ffffff40,0 0 14px 3px #9682ffa6}@media (prefers-reduced-motion:reduce){.event-modeling-grid-drop-indicator{animation:none}}.event-modeling-grid-icon-btn{cursor:pointer;width:20px;height:20px;color:var(--text-color-secondary);background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;line-height:1;transition:color .15s;display:flex;position:relative}.event-modeling-grid-icon-btn:hover{color:var(--text-color)}.event-modeling-grid-icon-btn-dot{background:#f59e0b;border:1px solid #fff;border-radius:50%;width:5px;height:5px;position:absolute;top:2px;right:2px}.event-modeling-grid-header-ghost{opacity:.85;filter:drop-shadow(0 12px 24px #00000073)}.event-modeling-slice-status-icon{cursor:pointer;background:0 0;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;padding:0;transition:background .12s;display:flex}.event-modeling-slice-status-icon:hover{background:#ffffff14}.event-modeling-slice-status-icon svg{pointer-events:none}.event-modeling-slice-status-icon--readonly{cursor:default;pointer-events:none}.event-modeling-slice-status-icon--notStarted{color:#ffffff4d}.event-modeling-slice-status-icon--draft{color:#9333ea;background:#9333ea26}.event-modeling-slice-status-icon--analysis{color:#6366f1;background:#6366f126}.event-modeling-slice-status-icon--readyForImplementation{color:#06b6d4;background:#06b6d426}.event-modeling-slice-status-icon--inProgress{color:#3b82f6;background:#3b82f626}.event-modeling-slice-status-icon--readyForReview{color:#f59e0b;background:#f59e0b26}.event-modeling-slice-status-icon--done{color:#10b981;background:#10b98126}.event-modeling-menu-dropdown{align-items:center;display:flex;position:relative}.event-modeling-menu-dropdown-trigger{align-items:center;display:flex}.event-modeling-menu-dropdown-menu{z-index:1300;background:#27272a;border:1px solid #ffffff1f;border-radius:10px;flex-direction:column;gap:2px;min-width:220px;padding:6px;display:flex;position:relative;box-shadow:0 8px 24px #00000080}.event-modeling-menu-dropdown-item-wrapper{position:relative}.event-modeling-menu-dropdown-option{cursor:pointer;text-align:left;background:0 0;border:none;border-radius:6px;align-items:center;gap:10px;width:100%;padding:8px 10px;transition:background .12s;display:flex}.event-modeling-menu-dropdown-option:hover:not(:disabled){background:#ffffff12}.event-modeling-menu-dropdown-option:disabled{opacity:.45;cursor:default}.event-modeling-menu-dropdown-option--has-submenu{justify-content:space-between}.event-modeling-menu-dropdown-option-icon{color:#fff9;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.event-modeling-menu-dropdown-option-text{flex-direction:column;flex:1;gap:1px;display:flex}.event-modeling-menu-dropdown-option-label{color:#ffffffd9;font-size:13px;font-weight:600}.event-modeling-menu-dropdown-option-desc{color:#fff6;font-size:11px;line-height:1.3}.event-modeling-menu-dropdown-option-arrow{color:#fff6;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;transition:transform .12s,color .12s;display:flex}.event-modeling-menu-dropdown-option-arrow--open{color:#fff9;transform:rotate(90deg)}.event-modeling-menu-dropdown-separator{background:#ffffff14;height:1px;margin:4px 0}.event-modeling-menu-dropdown-header{text-transform:uppercase;letter-spacing:.04em;color:#fff6;padding:6px 10px 2px;font-size:11px;font-weight:600}.event-modeling-menu-dropdown-option-check{color:#ffffffbf;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;display:flex}.event-modeling-menu-dropdown-submenu{background:#27272a;border:1px solid #ffffff1f;border-radius:10px;flex-direction:column;gap:2px;min-width:220px;padding:6px;display:flex;position:absolute;top:0;left:calc(100% + 8px);box-shadow:0 8px 24px #00000080}.event-modeling-menu-dropdown-submenu--left{left:auto;right:calc(100% + 8px)}.prediction-ghost{border:1px dashed var(--cratis-surface-border);border-radius:var(--cratis-border-radius);max-width:12rem;color:var(--cratis-text-color-secondary);opacity:.65;background:0 0;align-items:center;gap:.25rem;padding:0 .25rem;font-size:10px;line-height:1.6;transition:opacity .12s ease-in-out,border-color .12s ease-in-out;display:inline-flex}.prediction-ghost:hover,.prediction-ghost:focus-within{opacity:1;border-color:var(--cratis-primary-color)}.prediction-ghost__accept{max-width:10rem;color:inherit;font:inherit;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;background:0 0;border:none;align-items:center;gap:.25rem;display:inline-flex;overflow:hidden}.prediction-ghost__accept:disabled{cursor:progress}.prediction-ghost__discard{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;line-height:1}.prediction-ghost__discard:hover{color:var(--cratis-danger-text)}.event-modeling-grid-header-cell-wrapper{flex-direction:column;flex-shrink:0;justify-content:stretch;display:flex}.event-modeling-grid-header-cell-wrapper--feature-collapsed{overflow:hidden}.event-modeling-grid-header-cell-wrapper--module-collapsed{width:max-content;min-width:max-content}.event-modeling-module-placeholder{gap:8px;display:flex}.event-modeling-module-placeholder__feature{border:2px dashed color-mix(in srgb, var(--cratis-text-color) 14%, transparent);background:color-mix(in srgb, var(--cratis-text-color) 4%, transparent);box-sizing:border-box;border-radius:10px}.event-modeling-grid-flow-triangle{pointer-events:none;z-index:2;width:0;height:0;position:absolute;top:0;left:50%}.event-modeling-grid-flow-triangle--down{border-left:8px solid #0000;border-right:8px solid #0000;border-top:9px solid var(--surface-200);transform:translate(-50%,-50%)}.event-modeling-grid-flow-triangle--up{border-left:8px solid #0000;border-right:8px solid #0000;border-bottom:9px solid var(--surface-200);transform:translate(-50%,-50%)}.event-modeling-grid-connections{pointer-events:none;position:absolute;inset:0;overflow:visible}.event-modeling-grid-connections__svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.event-modeling-grid-connections__line{fill:none;stroke:var(--surface-300);stroke-width:2px;stroke-linecap:round}.event-modeling-grid-connections__arrow{fill:var(--surface-300)}.event-modeling-board--highlight-slices .event-modeling-grid-slice-column,.event-modeling-board--highlight-slices .event-modeling-grid-specification-wrapper{opacity:.25;transition:opacity .2s}.event-modeling-board--highlight-slices .event-modeling-grid-slice-column--connection-highlighted{opacity:1}.event-modeling-feature-grid-slices--row-collapsed{max-height:0;overflow:hidden}.event-modeling-feature-grid-slices--header-visible{padding-top:4px}.event-modeling-features-area{flex-direction:column;row-gap:4px;margin-top:4px;display:flex}.event-modeling-features-area__headers,.event-modeling-features-area__columns{grid-auto-columns:auto;grid-auto-flow:column;display:grid}.event-modeling-features-area__columns{grid-template-rows:auto auto}.event-modeling-features-area__column{display:contents}.event-modeling-grid-slice-type-explanation{margin-top:2px;display:block}:where(.event-modeling-grid-pill--feature) .event-modeling-grid-add-button--small{border:1px solid var(--cratis-surface-border);width:20px;height:20px;color:var(--cratis-text-color-secondary);cursor:pointer;background:0 0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;line-height:1;display:flex}:where(.event-modeling-grid-pill--feature) .event-modeling-grid-add-button--no-circle{border:none;border-radius:4px}:where(.event-modeling-grid-pill--feature) .event-modeling-grid-add-button--small:hover{color:var(--cratis-text-color)}.event-modeling-grid-pill--feature .event-modeling-grid-icon-btn{cursor:pointer;width:20px;height:20px;color:var(--cratis-text-color-secondary);background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;line-height:1;display:flex;position:relative}.event-modeling-grid-pill--feature .event-modeling-grid-icon-btn:hover{color:var(--cratis-text-color)}.event-modeling-feature-chat-dot{background:#f59e0b;border:1px solid #fff;border-radius:50%;width:5px;height:5px;position:absolute;top:2px;right:2px}.spec-run-button{width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.spec-run-button i{font-size:11px}.spec-run-button:hover{color:var(--text-color)}.spec-run-button--running{color:var(--primary-color)}.spec-run-button--passed{color:var(--green-500)}.spec-run-button--passed:hover{color:var(--green-600)}.spec-run-button--failed{color:var(--red-500)}.spec-run-button--failed:hover{color:var(--red-600)}.spec-run-button--inconclusive{color:var(--yellow-500)}.spec-run-button--inconclusive:hover{color:var(--yellow-600)}.spec-run-button--couldNotRun{color:var(--text-color-secondary)}.spec-status{background:0 0;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;line-height:1;display:inline-flex}.spec-status i{pointer-events:none;font-size:12px}.spec-status--idle{color:var(--text-color-secondary)}.spec-status--running{color:var(--primary-color)}.spec-status--passed{color:var(--green-500)}.spec-status--failed{color:var(--red-500)}.spec-status--inconclusive{color:var(--yellow-500)}.spec-status--couldNotRun{color:var(--text-color-secondary)}.spec-status--has-error{cursor:pointer;width:24px;height:24px}.spec-status--has-error i{font-size:14px}.spec-status--has-error:hover{color:var(--red-600);transform:scale(1.1)}.spec-status--has-error:focus{outline:2px solid var(--red-500);outline-offset:2px;border-radius:50%}.event-modeling-grid-specification-wrapper{pointer-events:none;flex-direction:column;flex-shrink:0;margin-top:4px;margin-left:-56px;display:flex}.event-modeling-grid-specification-wrapper--running .event-modeling-grid-specification-box{background:#3b82f60f;border-color:#3b82f659}.event-modeling-grid-specification-wrapper--passed .event-modeling-grid-specification-box{background:#10b9810f;border-color:#10b98159}.event-modeling-grid-specification-wrapper--failed .event-modeling-grid-specification-box{background:#ef44440f;border-color:#ef444459}.event-modeling-grid-specification-wrapper--inconclusive .event-modeling-grid-specification-box{background:#f59e0b0f;border-color:#f59e0b59}.event-modeling-grid-specification-wrapper--couldNotRun .event-modeling-grid-specification-box{border-style:dashed}.event-modeling-grid-specification-outer-row{pointer-events:none;flex-direction:row;align-items:stretch;display:flex}.event-modeling-grid-specification-box{pointer-events:auto}.event-modeling-grid-specification-label-gutter{pointer-events:none}.event-modeling-grid-specification-label-gutter button{pointer-events:auto}.event-modeling-grid-specification-box{border-left:2px dashed var(--surface-200);border-right:2px dashed var(--surface-200);box-sizing:border-box;background:#ffffff0a;overflow:visible}.event-modeling-grid-specification-box--header{border-top:2px dashed var(--surface-200);border-radius:10px 10px 0 0}.event-modeling-grid-specification-box--section{border-top:1px dashed var(--surface-100)}.event-modeling-grid-specification-box--last{border-bottom:2px dashed var(--surface-200);border-radius:0 0 10px 10px}.event-modeling-grid-specification-box--header.event-modeling-grid-specification-box--last{border-radius:10px}.event-modeling-grid-specification-header{box-sizing:border-box;border-bottom:1px solid var(--surface-200);background:#a08ce61a;flex-shrink:0;align-items:center;gap:4px;height:44px;padding:0 4px;display:flex}.event-modeling-grid-specification-box--header.event-modeling-grid-specification-box--last .event-modeling-grid-specification-header{border-bottom:none}.event-modeling-grid-specification-header-label{flex:1;justify-content:center;align-items:center;min-width:0;display:flex;overflow:hidden}.event-modeling-grid-specification-header-label .event-modeling-grid-editable-label,.event-modeling-grid-specification-header-label .event-modeling-grid-editable-label-input{text-align:center;text-overflow:ellipsis;white-space:nowrap;color:#ffffffb3;width:100%;font-size:11px;font-weight:600;overflow:hidden}.event-modeling-grid-specification-section{box-sizing:border-box;flex-direction:column;width:100%;padding:8px;display:flex}.event-modeling-grid-specification-section-content{flex-flow:wrap;flex:1;justify-content:center;align-items:center;gap:8px;padding:4px 0;display:flex}.event-modeling-grid-specification-section-actions{justify-content:flex-end;align-items:center;min-height:24px;padding-top:4px;display:flex}.event-modeling-grid-specification-section-headline{color:var(--text-color-secondary);text-transform:uppercase;letter-spacing:.05em;opacity:.7;-webkit-user-select:none;user-select:none;align-self:flex-start;padding:0 4px 4px;font-size:12px;font-weight:600}.spec-run-all-button .pi{font-size:11px}.spec-delete-button{width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.spec-delete-button i{font-size:11px}.spec-delete-button:hover{color:var(--red-500)}.spec-header-message{max-width:100%;color:var(--red-600);text-align:center;white-space:nowrap;text-overflow:ellipsis;background:#ef44441a;border-top:1px solid #ef444433;padding:4px 8px;font-size:10px;font-weight:500;line-height:1.4;overflow:hidden}.spec-header-execution{text-align:center;color:var(--text-color-secondary);padding:2px 8px;font-size:10px}.spec-header-message--could-not-run{color:var(--text-color-secondary);background:var(--surface-100);border-top:1px dashed var(--surface-300)}.event-modeling-grid-specification-add-area{flex-shrink:0;justify-content:center;padding:8px 0 4px;display:flex}button.event-modeling-card{cursor:pointer;border-radius:var(--card-radius);z-index:1;text-align:left;background:0 0;border:none;padding:0;transition:transform .1s,box-shadow .1s;display:block;position:relative}button.event-modeling-card:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 4px 12px #00000026}button.event-modeling-card:disabled{cursor:default;opacity:1}div.event-modeling-card{border-radius:var(--card-radius);display:block;position:relative}.event-modeling-card__face{width:var(--card-width);min-height:var(--card-min-height);padding:var(--card-padding-y) var(--card-padding-x);border-radius:var(--card-radius);font-size:var(--card-font-size);-webkit-user-select:none;user-select:none;box-sizing:border-box;text-align:center;flex-direction:column;justify-content:center;font-family:Inter,Helvetica,Arial,sans-serif;display:flex;box-shadow:0 1px 4px #0000002e}.event-modeling-card__title{text-overflow:ellipsis;white-space:nowrap;line-height:var(--card-line-height);display:block;overflow:hidden}.event-modeling-card__title-line{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.event-modeling-card__face .schema-tooltip-properties{text-align:left;margin-top:6px}.event-modeling-card__face .schema-tooltip-properties__title{display:none}.event-modeling-card__face .schema-tooltip-properties__row{background:#00000024}.event-modeling-read-model,.event-modeling-event,.event-modeling-command{display:inline-block;position:relative}@keyframes event-modeling-navigate-glow{0%,to{box-shadow:0 1px 4px #0000002e}50%{box-shadow:0 0 12px 4px #f0a05099,0 0 30px 8px #f0a05040}}.event-modeling-card--navigate-highlight{transition:none!important;animation:.65s ease-in-out 3 event-modeling-navigate-glow!important}[data-artifact-kind=command]{--card-action-background:#0a3a52d9;--card-action-background-strong:#0a3a52;--card-action-color:var(--card-command-bg);--card-action-border:#7ec8f066;--card-action-border-strong:#7ec8f0cc}[data-artifact-kind=readModel]{--card-action-background:#2a3a00d9;--card-action-background-strong:#2a3a00;--card-action-color:var(--card-readmodel-bg);--card-action-border:#b8d63b66;--card-action-border-strong:#b8d63bcc}[data-artifact-kind=event]{--card-action-background:#502800d9;--card-action-background-strong:#502800;--card-action-color:#e08030;--card-action-border:#e0803066;--card-action-border-strong:#e08030cc}.event-modeling-card-action{background:var(--card-action-background);width:20px;height:20px;color:var(--card-action-color);border:1px solid var(--card-action-border);cursor:pointer;z-index:10;opacity:0;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:9px;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;box-shadow:0 1px 4px #0000004d}[data-artifact-kind]:hover .event-modeling-card-action{opacity:1}.event-modeling-card-action--active{opacity:1;background:var(--card-action-background-strong);border-color:var(--card-action-border-strong)}.event-modeling-card-action:hover{background:var(--card-action-background-strong);transform:scale(1.15)}.event-modeling-card-action:focus-visible{outline:2px solid var(--card-action-color);outline-offset:2px;opacity:1}.event-modeling-card-action--disabled{cursor:not-allowed;opacity:0;color:#c8c8c899;background:#50505099;border-color:#a0a0a04d}[data-artifact-kind]:hover .event-modeling-card-action--disabled{opacity:.7}.event-modeling-card-action--disabled:hover{background:#505050b3;transform:none}.type-badge{letter-spacing:0;-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:default;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;min-width:22px;height:16px;padding:0 4px;font-family:system-ui,monospace,sans-serif;font-size:9px;font-weight:700;line-height:1;display:inline-flex}.type-badge svg{flex-shrink:0;display:block}.type-badge--concept{letter-spacing:.2px;text-overflow:ellipsis;text-align:center;max-width:120px;font-weight:600;line-height:16px;display:inline-block;overflow:hidden}.schema-tooltip-properties{flex-direction:column;gap:6px;min-width:180px;display:flex}.schema-tooltip-properties--compact{width:100%;min-width:0}.schema-tooltip-properties__title{color:var(--text-color);font-size:11px;line-height:1.35}.schema-tooltip-properties__list{flex-direction:column;gap:3px;display:flex}.schema-tooltip-properties__row{background:color-mix(in srgb, var(--surface-0) 82%, transparent);border-radius:4px;align-items:center;gap:6px;padding:2px 4px;display:flex}.schema-tooltip-properties--compact .schema-tooltip-properties__row{background:0 0}.schema-tooltip-properties__name{color:var(--text-color);font-family:system-ui,sans-serif;font-size:11px;line-height:1.2}.schema-tooltip-properties--compact .schema-tooltip-properties__name{color:inherit}.schema-tooltip-properties__empty{color:var(--text-color-secondary);font-size:10px}.schema-tooltip-properties--compact .schema-tooltip-properties__empty{color:inherit;text-align:center;width:100%}.event-modeling-event-tags{flex-wrap:wrap;gap:.25rem;margin-top:.25rem;display:flex}.event-modeling-event-tag{background:color-mix(in srgb, var(--surface-0) 35%, transparent);max-width:100%;color:inherit;text-overflow:ellipsis;white-space:nowrap;border-radius:.625rem;padding:0 .375rem;font-size:.625rem;line-height:1rem;overflow:hidden}.event-modeling-grid-optional-event-reference{display:inline-flex;position:relative}.event-modeling-grid-optional-event-reference__card{width:var(--card-width);min-height:var(--card-min-height);padding:var(--card-padding-y) var(--card-padding-x);border-radius:var(--card-radius);color:#ffd6aaa6;box-sizing:border-box;font-size:var(--card-font-size);line-height:var(--card-line-height);-webkit-user-select:none;user-select:none;background:#f0a0501f;border:1px dashed #f0a05099;justify-content:center;align-items:center;font-family:Inter,Helvetica,Arial,sans-serif;display:flex}.event-modeling-grid-optional-event-reference__define-btn{width:20px;height:20px;color:var(--card-event-bg);cursor:pointer;z-index:10;opacity:0;background:#3a1a00d9;border:1px solid #f0a05066;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:9px;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 4px #0000004d}.event-modeling-grid-optional-event-reference:hover .event-modeling-grid-optional-event-reference__define-btn{opacity:1}.event-modeling-grid-optional-event-reference__define-btn:hover{background:#3a1a00;transform:scale(1.15)}.event-modeling-grid-optional-event-reference__define-btn:focus-visible{outline:2px solid var(--card-event-bg);outline-offset:2px;opacity:1}.event-modeling-grid-event-picker{align-items:center;display:inline-flex}.event-modeling-grid-event-picker-dropdown{background:var(--surface-card);border:1px solid var(--surface-border);z-index:9999;border-radius:8px;flex-direction:column;min-width:180px;max-width:260px;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 16px #0006}.event-modeling-grid-event-picker-search{box-sizing:border-box;background:var(--surface-ground);border:none;border-bottom:1px solid var(--surface-border);width:100%;color:var(--text-color);outline:none;padding:6px 10px;font-size:12px}.event-modeling-grid-event-picker-list{max-height:180px;margin:0;padding:4px 0;list-style:none;overflow-y:auto}.event-modeling-grid-event-picker-item{width:100%;color:var(--text-color);text-align:left;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;border-left:3px solid;padding:6px 10px;font-size:12px;display:block;overflow:hidden}.event-modeling-grid-event-picker-item:hover{background:var(--surface-hover)}.event-modeling-grid-event-picker-empty{color:var(--text-color-secondary);-webkit-user-select:none;user-select:none;padding:6px 10px;font-size:12px;font-style:italic}.event-modeling-grid-event-picker-separator{background:var(--surface-border);height:1px;margin:4px 0}.event-modeling-spec-values__item{cursor:pointer}.event-modeling-spec-values__item:focus-within{outline:1px solid var(--primary-color,currentColor)}.event-modeling-spec-values__toggle{all:unset;overflow:inherit;text-overflow:inherit;white-space:inherit;overflow-wrap:inherit;cursor:pointer;display:block}.event-modeling-spec-values__item[data-expanded=true] dd{white-space:normal;overflow-wrap:anywhere}.event-modeling-spec-values{max-width:180px;color:var(--text-color-secondary);margin-top:4px;font-size:10px;line-height:1.3}.event-modeling-spec-values__summary{cursor:pointer}.event-modeling-spec-values__list{margin:0}.event-modeling-spec-values__item{gap:4px;min-width:0;display:flex}.event-modeling-spec-values__item dt{flex-shrink:0;font-weight:600}.event-modeling-spec-values__item dt:after{content:":"}.event-modeling-spec-values__item dd{text-overflow:ellipsis;white-space:nowrap;min-width:0;margin:0;overflow:hidden}.event-modeling-spec-error{flex-direction:column;align-items:flex-start;display:flex}.spec-item-removable{position:relative}.spec-item-remove-button{color:#ffffffd9;cursor:pointer;z-index:10;opacity:0;background:#1e1e1ed9;border:1px solid #ffffff59;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;padding:0;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 4px #0000004d}.spec-item-remove-button i{font-size:8px}.spec-item-removable:hover .spec-item-remove-button,.spec-item-remove-button:focus-visible{opacity:1}.spec-item-remove-button:hover{color:var(--red-500,#ef4444);transform:scale(1.15)}.event-modeling-collection-grid-template{-webkit-user-select:none;user-select:none;flex-direction:column;margin-top:4px;display:flex}.event-modeling-collection-grid-template__bar{background:var(--cratis-warning-background);height:36px;color:var(--cratis-warning-text);border-radius:22px;justify-content:center;align-items:center;gap:8px;padding:0 8px;font-size:14px;font-weight:600;display:flex}.event-modeling-collection-grid-template__name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.event-modeling-grid-container{-webkit-user-select:none;user-select:none;background:0 0;flex-direction:column;animation:.12s ease-out event-modeling-grid-body-fade-in;display:inline-flex;position:relative}:where(.event-modeling-collection-grid .event-modeling-module-empty-placeholder){border:1.5px dashed var(--cratis-surface-border);border-radius:var(--cratis-border-radius);min-width:220px;min-height:120px;color:var(--cratis-text-color-secondary);justify-content:center;align-items:center;margin-top:4px;font-size:12px;display:flex}.event-modeling-grid-content-row,.event-modeling-grid-slices-area{flex-direction:row;align-items:flex-start;display:flex}.event-model-board{width:100%;height:100%;position:relative}.event-model-board__logo{width:7.5rem;height:auto;color:var(--event-model-board-logo-color,var(--text-color,currentColor));opacity:.85;pointer-events:none;z-index:10;position:absolute;top:1rem;left:1rem}.event-model-board__toolbar{z-index:10;gap:.5rem;display:flex;position:absolute;top:1rem;right:1rem}.event-model-board__toolbar-surface{border-radius:999px;display:inline-flex;position:relative}.event-model-board__toolbar-surface--plain{background:color-mix(in srgb, var(--surface-card) 78%, transparent);-webkit-backdrop-filter:blur(12px);border:1px solid var(--surface-border)}.event-model-board__toolbar-surface .toolbar{z-index:1;box-shadow:none;background:0 0;border:1px solid #0000;border-radius:999px;padding-block:.375rem;padding-inline:.5rem;position:relative}.event-modeling-grid-cogwheel-icon{color:var(--surface-400);flex-shrink:0;display:inline-flex}.event-modeling-grid-cogwheel-wrapper{justify-content:center;align-items:center;display:inline-flex}.module-collection-link-layer{pointer-events:none;width:0;height:0;position:absolute;top:0;left:0}.module-collection-link-layer__svg{pointer-events:none;position:absolute;overflow:visible}.module-collection-link-layer__arrow{fill:none;stroke:var(--primary-color);stroke-width:2px;stroke-linecap:round;opacity:.75}.module-collection-link-layer__preview{fill:none;stroke:var(--primary-color);stroke-width:2px;stroke-dasharray:6 5;stroke-linecap:round;opacity:.9}.module-collection-link-layer__arrow-head{fill:var(--primary-color)}.module-collection-link-layer__handle{background:var(--primary-color);border:2px solid var(--surface-0);cursor:crosshair;opacity:.55;pointer-events:auto;touch-action:none;border-radius:50%;width:14px;height:14px;transition:opacity .12s,transform .12s;position:absolute;transform:translate(-50%,-50%);box-shadow:0 1px 3px #00000059}.module-collection-link-layer__handle:hover{opacity:1;transform:translate(-50%,-50%)scale(1.25)}.module-collection-link-layer__delete{background:var(--surface-card);border:1px solid var(--surface-border);width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;opacity:.35;pointer-events:auto;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:opacity .12s,color .12s,border-color .12s;display:flex;position:absolute;transform:translate(-50%,-50%)}.module-collection-link-layer__delete:hover{opacity:1;color:var(--red-500);border-color:var(--red-500)}.module-collection-link-layer__delete .pi{font-size:.7rem}.module-collection-link-layer__drop-target{border:2px solid var(--primary-color);background:color-mix(in srgb, var(--primary-color) 12%, transparent);pointer-events:none;border-radius:6px;position:absolute}.event-model-sticky-notes{display:contents}.event-model-sticky-note--busy{pointer-events:none;opacity:.7;position:relative}.event-model-sticky-note__progress{color:var(--cratis-text-color);position:absolute;top:.25rem;right:.25rem}.event-model-sticky-note__spinner{width:1rem;height:1rem}.event-modeling-grid-slice-column-header{box-sizing:border-box;background:var(--highlight-bg);border-bottom:1px solid var(--surface-200);border-radius:8px 8px 0 0;flex-shrink:0;align-items:center;gap:2px;min-width:0;padding:0 4px;display:flex;position:relative}.event-modeling-grid-slice-column-header-left{flex-shrink:0;align-items:center;gap:1px;display:flex}.event-modeling-grid-slice-column-header-center{flex:1;justify-content:center;align-items:center;min-width:0;display:flex;overflow:hidden}.event-modeling-grid-slice-column-header-center>.grid-tooltip-root{flex:1;min-width:0}.event-modeling-grid-slice-column-header-center .event-modeling-grid-editable-label,.event-modeling-grid-slice-column-header-center .event-modeling-grid-editable-label-input{text-align:center;text-overflow:ellipsis;white-space:nowrap;color:#ffffffb3;width:100%;font-size:12px;font-weight:600;line-height:16px;overflow:hidden}.event-modeling-grid-slice-column-header-right{flex-shrink:0;align-items:center;gap:1px;display:flex}.event-modeling-grid-slice-column--collapsed>.event-modeling-grid-slice-column-header{border-bottom:1px solid #ffffff14;border-radius:8px 8px 0 0;justify-content:center}.event-modeling-grid-slice-column{border:2px dashed var(--surface-200);box-sizing:border-box;content-visibility:auto;contain-intrinsic-size:auto 400px auto 900px;background:#ffffff0a;border-radius:10px;flex-direction:column;flex-shrink:0;display:flex;position:relative;overflow:visible}.event-modeling-grid-slice-column--inProgress{background:#3b82f60f;border-color:#3b82f659}.event-modeling-grid-slice-column--readyForReview{background:#f59e0b0f;border-color:#f59e0b59}.event-modeling-grid-slice-column--done{background:#10b9810f;border-color:#10b98159}.event-modeling-grid-slice-column>.event-modeling-grid-slice-cell+.event-modeling-grid-slice-cell{border-top:1px dashed var(--surface-100)}@keyframes event-modeling-grid-body-fade-in{0%{opacity:0}to{opacity:1}}.event-modeling-grid-slice-column>.event-modeling-grid-slice-cell{animation:.12s ease-out event-modeling-grid-body-fade-in}[data-slice-drop-target][aria-busy=true]{cursor:progress}.event-modeling-slices-empty{color:#ffffff2e;border:1.5px dashed #a08ce62e;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;min-height:80px;font-size:11px;display:flex}.event-modeling-grid-slice-cell{box-sizing:border-box;flex-direction:column;align-content:flex-start;gap:6px;width:100%;padding:8px;display:flex;position:relative}.event-modeling-grid-slice-cell--centered{justify-content:center;align-items:center}.event-modeling-grid-slice-cell-items{z-index:1;flex-wrap:wrap;justify-content:center;gap:6px;display:flex;position:relative}.event-modeling-grid-slice-cell-cards{flex-flow:wrap;justify-content:center;align-items:flex-start;gap:8px;display:flex}.event-modeling-grid-slice-cell-cards--row{flex-direction:row;align-items:center}.event-modeling-grid-slice-cell--translator{flex-direction:row;align-items:stretch;padding:0}.event-modeling-grid-slice-cell--translator-external,.event-modeling-grid-slice-cell--translator-regular{box-sizing:border-box;flex-direction:column;flex:0 0 50%;justify-content:center;align-items:center;gap:6px;min-width:0;padding:8px;display:flex;position:relative}.event-modeling-grid-slice-cell--translator-external{border-right:1px dashed var(--surface-300)}.event-modeling-grid-mini-card{border-radius:4px;flex-shrink:0;width:24px;height:24px}.event-modeling-grid-mini-card--command{background:var(--card-command-bg)}.event-modeling-grid-mini-card--readmodel{background:var(--card-readmodel-bg)}.event-modeling-grid-mini-card--event{background:var(--card-event-bg)}.event-modeling-grid-slice-placeholder-row{justify-content:center;align-items:center}.event-modeling-grid-slice-placeholder-card{border-radius:8px;flex-shrink:0;width:140px;height:40px}.event-modeling-grid-slice-placeholder-chips{flex-direction:row;justify-content:center;gap:8px;display:flex}.event-modeling-grid-slice-placeholder-chip{border-radius:6px;flex-shrink:0;width:96px;height:32px}.event-modeling-grid-slice-cell-add-corner{gap:4px;display:flex;position:absolute;bottom:6px;right:6px}.event-modeling-grid-slice-cell-action-corner{gap:4px;display:flex;position:absolute;right:6px}.event-modeling-grid-slice-cell-action-corner--top{top:6px}.system-row-cell__trigger-wrapper{position:absolute;bottom:6px;right:6px}.system-row-cell__trigger-btn{border:1px solid var(--surface-200);width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:12px;line-height:1;transition:border-color .15s,color .15s;display:flex}.system-row-cell__trigger-btn .pi{font-size:11px}.system-row-cell__trigger-btn:hover{border-color:var(--surface-300);color:var(--text-color)}.system-row-cell__trigger-btn--active{border-color:var(--primary-color);color:var(--primary-color)}.system-row-cell__trigger-btn--active:hover{border-color:var(--primary-color);color:var(--primary-color);opacity:.8}.system-row-cell__trigger-btn--readonly,.system-row-cell__trigger-btn--readonly:hover{cursor:default;opacity:1}.event-modeling-grid-slice-cell--system.event-modeling-grid-slice-cell--collapsed .event-modeling-grid-cogwheel-icon{transform-origin:50%;transform:scale(.52)}.event-modeling-grid-slice-cell--system.event-modeling-grid-slice-cell--collapsed .event-modeling-grid-cogwheel-icon svg{width:22px;height:22px}.system-row-cell__cogwheel{display:inline-flex}.system-row-cell__trigger-menu{background:var(--surface-overlay);border:1px solid var(--surface-border);z-index:100;border-radius:4px;min-width:300px;position:absolute;bottom:calc(100% + 4px);right:0;overflow:hidden;box-shadow:0 4px 12px #0000004d}.system-row-cell__trigger-menu-item{color:var(--text-color);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:normal;padding:6px 12px;font-size:13px}.system-row-cell__trigger-menu-item:hover{background:var(--highlight-bg)}.system-row-cell__trigger-menu-item-title{font-weight:500}.system-row-cell__trigger-menu-item-description{opacity:.85;margin-top:2px;font-size:11px}.event-modeling-grid-ui-preview{border:1px solid var(--surface-200);border-radius:4px;width:fit-content;max-width:100%;line-height:0;overflow:hidden}.event-modeling-grid-ui-preview--clickable{cursor:pointer}.event-modeling-grid-event-wrapper{flex-direction:column;align-items:center;display:inline-flex;position:relative}.event-modeling-public-event{background:color-mix(in srgb, var(--surface-0) 55%, transparent);color:inherit;letter-spacing:.02em;text-transform:uppercase;border-radius:.625rem;align-items:center;gap:.25rem;margin-top:.25rem;padding:0 .375rem;font-size:.625rem;font-weight:600;line-height:1rem;display:inline-flex}.event-modeling-public-event .pi{font-size:.625rem}.event-modeling-visibility-rule-break{background:var(--orange-500,#f59e0b);color:#fff;text-align:center;cursor:help;pointer-events:auto;z-index:11;border:0;border-radius:50%;width:16px;height:16px;padding:0;font-size:11px;font-weight:700;line-height:16px;position:absolute;top:-6px;left:-6px}.event-modeling-visibility-rule-break:focus-visible{outline:2px solid var(--orange-500,#f59e0b);outline-offset:2px}.event-modeling-grid-event-wrapper--rule-break .event-modeling-card__face{border:1.5px solid var(--orange-500,#f59e0b)}.event-modeling-event-reference{position:relative}.event-modeling-event-reference .event-modeling-card__face{border:1.5px dashed var(--surface-400,#ffffff8c);opacity:.7}.event-modeling-event-reference--out-of-order .event-modeling-card__face{border-color:var(--orange-500,#f59e0b);opacity:1}.event-modeling-event-reference__warning{background:var(--orange-500,#f59e0b);color:#fff;text-align:center;pointer-events:none;border-radius:50%;width:16px;height:16px;font-size:11px;font-weight:700;line-height:16px;position:absolute;top:-6px;left:-6px}.event-modeling-grid-event-wrapper--reference{position:relative}.event-modeling-grid-event-navigate-button{color:#e08030;cursor:pointer;z-index:10;pointer-events:all;opacity:0;background:#502800d9;border:1px solid #e0803066;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;padding:0;font-size:9px;line-height:1;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;left:-6px;box-shadow:0 1px 4px #0000004d}.event-modeling-grid-event-wrapper--reference:hover .event-modeling-grid-event-navigate-button{opacity:1}.event-modeling-grid-event-navigate-button:hover{background:#502800;transform:scale(1.15)}.event-modeling-grid-event-navigate-button:focus-visible{outline-offset:2px;opacity:1;outline:2px solid #e08030}.event-modeling-grid-event-remove-button{color:#e08030;cursor:pointer;z-index:10;pointer-events:all;opacity:0;background:#502800d9;border:1px solid #e0803066;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;padding:0;font-size:9px;line-height:1;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 4px #0000004d}.event-modeling-grid-event-wrapper--reference:hover .event-modeling-grid-event-remove-button{opacity:1}.event-modeling-grid-event-remove-button:disabled{cursor:wait;opacity:1}.event-modeling-grid-event-remove-button:hover:not(:disabled){background:#502800;transform:scale(1.15)}.event-modeling-grid-event-remove-button:focus-visible{outline-offset:2px;opacity:1;outline:2px solid #e08030}.event-modeling-board--dim-others .event-modeling-card,.event-modeling-board--dim-others .event-modeling-grid-sticky-note,.event-modeling-board--dim-others .event-modeling-grid-ui-preview{opacity:.15;transition:opacity .2s}.event-modeling-board--dim-others .event-modeling-event--undimmed,.event-modeling-board--dim-others .event-modeling-event--undimmed .event-modeling-card{opacity:1!important}.event-modeling-grid-optional-read-model{display:inline-flex;position:relative}.event-modeling-grid-optional-read-model__card{width:var(--card-width);min-height:var(--card-min-height);padding:var(--card-padding-y) var(--card-padding-x);border-radius:var(--card-radius);color:#d4e7938c;box-sizing:border-box;font-size:var(--card-font-size);line-height:var(--card-line-height);-webkit-user-select:none;user-select:none;background:#7e93241f;border:1px dashed #adc95099;justify-content:center;align-items:center;font-family:Inter,Helvetica,Arial,sans-serif;display:flex}.event-modeling-grid-optional-read-model__define-btn{width:20px;height:20px;color:var(--card-readmodel-bg);cursor:pointer;z-index:10;opacity:0;background:#2a3a00d9;border:1px solid #b8d63b66;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:9px;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 4px #0000004d}.event-modeling-grid-optional-read-model:hover .event-modeling-grid-optional-read-model__define-btn{opacity:1}.event-modeling-grid-optional-read-model__define-btn:hover{background:#2a3a00;transform:scale(1.15)}.event-modeling-grid-optional-read-model__define-btn:focus-visible{outline:2px solid var(--card-readmodel-bg);outline-offset:2px;opacity:1}
1
+ .event-modeling-grid-add-button{border:1.5px solid var(--surface-300);width:28px;height:28px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border-radius:50%;flex-shrink:0;justify-content:center;align-self:center;align-items:center;font-size:18px;line-height:1;transition:border-color .15s,color .15s;display:flex}.event-modeling-grid-add-button:hover{border-color:var(--text-color);color:var(--text-color)}.event-modeling-grid-add-button--small{border:1px solid var(--surface-200);width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border-radius:50%;justify-content:center;align-items:center;font-size:14px;line-height:1;transition:border-color .15s,color .15s;display:flex}.event-modeling-grid-add-button--small:hover{border-color:var(--surface-300);color:var(--text-color)}.event-modeling-grid-add-button--no-circle,.event-modeling-grid-add-button--small.event-modeling-grid-add-button--no-circle{border:none;border-radius:4px}.event-modeling-grid-add-button--no-circle:hover,.event-modeling-grid-add-button--small.event-modeling-grid-add-button--no-circle:hover{border-color:#0000}.event-modeling-translation-direction--readonly{width:20px;height:20px;color:var(--text-color-secondary);justify-content:center;align-items:center;display:flex}.grid-tooltip-root{display:inline-flex}.grid-tooltip-bubble{pointer-events:none;background:var(--surface-100);color:var(--text-color);white-space:normal;opacity:0;border-radius:5px;width:max-content;max-width:320px;padding:6px 8px;font-family:system-ui,sans-serif;font-size:11px;animation:.15s .2s forwards grid-tooltip-appear;display:block;box-shadow:0 2px 8px #00000040}@keyframes grid-tooltip-appear{to{opacity:1}}.collection-drag-handle{cursor:grab;z-index:10;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:6px;justify-content:center;align-items:center;width:40px;height:40px;transition:background .15s,border-color .15s;display:flex;position:absolute;left:8px}.collection-drag-handle:hover{background:#ffffff14;border-color:#ffffff26}.collection-drag-handle--dragging{cursor:grabbing}.collection-drag-handle i{color:#fff9;font-size:16px}.event-model-collection-placeholder{box-sizing:border-box;align-items:flex-start;gap:8px;padding-left:56px;display:flex}.event-model-collection-placeholder-module{flex-direction:column;gap:4px;display:flex}.event-model-collection-placeholder-pill{background:color-mix(in srgb, var(--cratis-text-color) 5%, transparent);border:1px solid color-mix(in srgb, var(--cratis-text-color) 10%, transparent);box-sizing:border-box;height:44px}.event-model-collection-placeholder-body{border:2px dashed color-mix(in srgb, var(--cratis-text-color) 14%, transparent);background:color-mix(in srgb, var(--cratis-text-color) 4%, transparent);box-sizing:border-box;border-radius:10px}.event-modeling-grid-row-labels{flex-direction:column;flex-shrink:0;display:flex}.event-modeling-grid-row-label{box-sizing:border-box;flex-direction:column;gap:4px;padding:4px;display:flex}.event-modeling-grid-row-label-pill{background:var(--surface-50);border:1px solid var(--surface-200);border-radius:40px;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:0;display:flex;position:relative;overflow:visible}.event-modeling-grid-row-label-title{flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:0;padding:22px 0;display:flex}.event-modeling-grid-row-label-text,.event-modeling-grid-row-label .event-modeling-grid-editable-label,.event-modeling-grid-row-label .event-modeling-grid-editable-label-input{white-space:nowrap;color:var(--text-color-secondary);text-transform:uppercase;letter-spacing:.05em;-webkit-user-select:none;user-select:none;font-size:11px;font-weight:600;transform:rotate(-90deg)}.event-modeling-grid-row-label .event-modeling-grid-editable-label-input{text-align:center;background:0 0;border:none;outline:none;align-self:center;width:5rem;min-width:0;height:auto;margin:0;padding:0}.event-modeling-grid-row-label-info{justify-content:center;align-items:center;padding:4px 0 0;display:flex;position:absolute;top:0;left:0;right:0}.event-modeling-grid-row-label-info-btn{color:#ffffff59;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;padding:0;font-size:11px;line-height:1;transition:color .15s;display:flex}.event-modeling-grid-row-label-info-btn:hover{color:#ffffffd9}.event-modeling-grid-row-label-add-role{justify-content:center;align-items:center;padding:0 0 4px;display:flex;position:absolute;bottom:0;left:0;right:0}.event-modeling-grid-row-label-add-role-btn{color:#ffffff59;cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;font-size:12px;line-height:1;transition:border-color .15s,color .15s;display:flex}.event-modeling-grid-row-label-add-role-btn:hover{color:#ffffffd9;border-color:#fff9}.event-modeling-grid-row-role-menu{z-index:300;white-space:nowrap;background:#27272a;border:1px solid #ffffff1f;border-radius:8px;flex-direction:column;gap:2px;min-width:140px;padding:4px;display:flex;position:absolute;bottom:0;left:calc(100% + 8px);box-shadow:0 4px 16px #0006}.event-modeling-grid-row-role-menu-option{cursor:pointer;text-align:left;color:#ffffffbf;background:0 0;border:none;border-radius:5px;align-items:center;gap:8px;width:100%;padding:6px 10px;font-size:12px;font-weight:500;transition:background .1s;display:flex}.event-modeling-grid-row-role-menu-option:hover{background:#ffffff12}.event-modeling-grid-row-role-menu-option--danger{color:var(--red-400);border-top:1px solid #ffffff14;margin-top:2px;padding-top:8px}.event-modeling-grid-row-role-menu-option--danger:hover{background:#ef44441f}.event-modeling-grid-collapse-btn{cursor:pointer;color:var(--text-color-secondary);background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;padding:3px;transition:color .15s,background .15s;display:flex}.event-modeling-grid-collapse-btn:hover{color:var(--text-color);background:var(--surface-100)}.event-modeling-grid-editable-label{cursor:inherit;-webkit-user-select:none;user-select:none}.event-modeling-grid-editable-label-placeholder{color:var(--text-color-secondary)}.event-modeling-grid-editable-label-input{background:0 0;border:none;outline:none;width:100%}.event-modeling-grid-editable-label-input--error{border-radius:3px;outline:2px solid #f87171}.entity-error-indicator{color:var(--red-500);cursor:default;justify-content:center;align-items:center;font-size:14px;display:inline-flex}.errored-entity{box-sizing:border-box;color:var(--text-color-secondary);text-align:center;cursor:default;background:#ef444414;border:1.5px dashed #ef44448c;border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:6px;padding:12px 8px;display:flex}.errored-entity--slice{width:220px;min-height:160px}.errored-entity--feature{min-width:220px;min-height:200px}.errored-entity--module{min-width:260px;min-height:240px}.errored-entity__mark{color:var(--red-500);font-size:22px}.errored-entity__label{max-width:100%;color:var(--text-color);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:600;overflow:hidden}.errored-entity__hint{font-size:11px}.errored-entity__retry{border:1px solid var(--surface-border);background:var(--surface-card);color:var(--text-color);cursor:pointer;border-radius:4px;padding:2px 10px;font-size:11px}.event-modeling-grid-pill{white-space:nowrap;box-sizing:border-box;border-radius:40px;grid-template-columns:1fr auto 1fr;align-items:center;width:100%;min-width:min-content;padding:0 8px;font-size:12px;font-weight:600;line-height:16px;display:grid;position:relative}.event-modeling-grid-pill--module{color:#ffffff8c}.event-modeling-grid-pill--feature{color:#ffffff73}.event-modeling-grid-pill-left{justify-self:start;align-items:center;gap:4px;display:flex}.event-modeling-grid-pill-right{justify-self:end;align-items:center;gap:4px;display:flex}.event-modeling-grid-pill--collapsed{gap:4px;width:auto;padding:0 6px;display:flex}.event-modeling-grid-pill--draggable{cursor:grab;touch-action:none}.event-modeling-grid-pill--draggable:active{cursor:grabbing}.event-modeling-grid-slice-ghost{opacity:.5;filter:drop-shadow(0 12px 24px #00000073)}.event-modeling-grid-slice-ghost--invalid{filter:drop-shadow(0 12px 24px #00000073)grayscale(.6)sepia()saturate(6)hue-rotate(-35deg)}.event-modeling-grid-slice-ghost-fallback{color:var(--text-color);background:#503ca0a6;border:1.5px dashed #b4a5ffbf;border-radius:8px;justify-content:center;align-items:center;gap:6px;font-size:11px;font-weight:500;display:flex}.event-modeling-grid-slice-ghost-fallback--invalid{background:#be2d2db8;border:1.5px solid #ff7878e6}.event-modeling-grid-slice-ghost-reason{color:#ffebebf2;background:#781414eb;border:1px solid #ff787899;border-radius:6px;margin-top:4px;padding:4px 8px;font-size:10px;line-height:1.3}.event-modeling-grid-slice-drop-indicator{background:#b4a5fff2;border-radius:3px;flex-shrink:0;align-self:stretch;width:6px;animation:1.1s ease-in-out infinite event-modeling-grid-slice-drop-indicator-pulse;box-shadow:0 0 0 1px #ffffff40,0 0 14px 3px #9682ffa6}.event-modeling-grid-slice-drop-indicator--invalid{background:#ff7878f2;box-shadow:0 0 0 1px #ffffff40,0 0 14px 3px #ff505099}@keyframes event-modeling-grid-slice-drop-indicator-pulse{50%{opacity:.55}}@media (prefers-reduced-motion:reduce){.event-modeling-grid-slice-drop-indicator{animation:none}}.event-modeling-grid-slice-drop-target--active{outline-offset:3px;background:#9682ff14;border-radius:10px;outline:1.5px dashed #b4a5ff73}.event-modeling-grid-drop-indicator{background:#b4a5fff2;border-radius:3px;flex-shrink:0;align-self:stretch;width:6px;animation:1.1s ease-in-out infinite event-modeling-grid-slice-drop-indicator-pulse;box-shadow:0 0 0 1px #ffffff40,0 0 14px 3px #9682ffa6}@media (prefers-reduced-motion:reduce){.event-modeling-grid-drop-indicator{animation:none}}.event-modeling-grid-icon-btn{cursor:pointer;width:20px;height:20px;color:var(--text-color-secondary);background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;line-height:1;transition:color .15s;display:flex;position:relative}.event-modeling-grid-icon-btn:hover{color:var(--text-color)}.event-modeling-grid-icon-btn-dot{background:#f59e0b;border:1px solid #fff;border-radius:50%;width:5px;height:5px;position:absolute;top:2px;right:2px}.event-modeling-grid-header-ghost{opacity:.85;filter:drop-shadow(0 12px 24px #00000073)}.event-modeling-slice-status-icon{cursor:pointer;background:0 0;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;padding:0;transition:background .12s;display:flex}.event-modeling-slice-status-icon:hover{background:#ffffff14}.event-modeling-slice-status-icon svg{pointer-events:none}.event-modeling-slice-status-icon--readonly{cursor:default;pointer-events:none}.event-modeling-slice-status-icon--notStarted{color:#ffffff4d}.event-modeling-slice-status-icon--draft{color:#9333ea;background:#9333ea26}.event-modeling-slice-status-icon--analysis{color:#6366f1;background:#6366f126}.event-modeling-slice-status-icon--readyForImplementation{color:#06b6d4;background:#06b6d426}.event-modeling-slice-status-icon--inProgress{color:#3b82f6;background:#3b82f626}.event-modeling-slice-status-icon--readyForReview{color:#f59e0b;background:#f59e0b26}.event-modeling-slice-status-icon--done{color:#10b981;background:#10b98126}.event-modeling-menu-dropdown{align-items:center;display:flex;position:relative}.event-modeling-menu-dropdown-trigger{align-items:center;display:flex}.event-modeling-menu-dropdown-menu{z-index:1300;background:#27272a;border:1px solid #ffffff1f;border-radius:10px;flex-direction:column;gap:2px;min-width:220px;padding:6px;display:flex;position:relative;box-shadow:0 8px 24px #00000080}.event-modeling-menu-dropdown-item-wrapper{position:relative}.event-modeling-menu-dropdown-option{cursor:pointer;text-align:left;background:0 0;border:none;border-radius:6px;align-items:center;gap:10px;width:100%;padding:8px 10px;transition:background .12s;display:flex}.event-modeling-menu-dropdown-option:hover:not(:disabled){background:#ffffff12}.event-modeling-menu-dropdown-option:disabled{opacity:.45;cursor:default}.event-modeling-menu-dropdown-option--has-submenu{justify-content:space-between}.event-modeling-menu-dropdown-option-icon{color:#fff9;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.event-modeling-menu-dropdown-option-text{flex-direction:column;flex:1;gap:1px;display:flex}.event-modeling-menu-dropdown-option-label{color:#ffffffd9;font-size:13px;font-weight:600}.event-modeling-menu-dropdown-option-desc{color:#fff6;font-size:11px;line-height:1.3}.event-modeling-menu-dropdown-option-arrow{color:#fff6;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;transition:transform .12s,color .12s;display:flex}.event-modeling-menu-dropdown-option-arrow--open{color:#fff9;transform:rotate(90deg)}.event-modeling-menu-dropdown-separator{background:#ffffff14;height:1px;margin:4px 0}.event-modeling-menu-dropdown-header{text-transform:uppercase;letter-spacing:.04em;color:#fff6;padding:6px 10px 2px;font-size:11px;font-weight:600}.event-modeling-menu-dropdown-option-check{color:#ffffffbf;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;display:flex}.event-modeling-menu-dropdown-submenu{background:#27272a;border:1px solid #ffffff1f;border-radius:10px;flex-direction:column;gap:2px;min-width:220px;padding:6px;display:flex;position:absolute;top:0;left:calc(100% + 8px);box-shadow:0 8px 24px #00000080}.event-modeling-menu-dropdown-submenu--left{left:auto;right:calc(100% + 8px)}.prediction-ghost{border:1px dashed var(--cratis-surface-border);border-radius:var(--cratis-border-radius);max-width:12rem;color:var(--cratis-text-color-secondary);opacity:.65;background:0 0;align-items:center;gap:.25rem;padding:0 .25rem;font-size:10px;line-height:1.6;transition:opacity .12s ease-in-out,border-color .12s ease-in-out;display:inline-flex}.prediction-ghost:hover,.prediction-ghost:focus-within{opacity:1;border-color:var(--cratis-primary-color)}.prediction-ghost__accept{max-width:10rem;color:inherit;font:inherit;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;background:0 0;border:none;align-items:center;gap:.25rem;display:inline-flex;overflow:hidden}.prediction-ghost__accept:disabled{cursor:progress}.prediction-ghost__discard{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;line-height:1}.prediction-ghost__discard:hover{color:var(--cratis-danger-text)}.event-modeling-grid-header-cell-wrapper{flex-direction:column;flex-shrink:0;justify-content:stretch;display:flex}.event-modeling-grid-header-cell-wrapper--feature-collapsed{overflow:hidden}.event-modeling-grid-header-cell-wrapper--module-collapsed{width:max-content;min-width:max-content}.event-modeling-module-placeholder{gap:8px;display:flex}.event-modeling-module-placeholder__feature{border:2px dashed color-mix(in srgb, var(--cratis-text-color) 14%, transparent);background:color-mix(in srgb, var(--cratis-text-color) 4%, transparent);box-sizing:border-box;border-radius:10px}.event-modeling-grid-flow-triangle{pointer-events:none;z-index:2;width:0;height:0;position:absolute;top:0;left:50%}.event-modeling-grid-flow-triangle--down{border-left:8px solid #0000;border-right:8px solid #0000;border-top:9px solid var(--surface-200);transform:translate(-50%,-50%)}.event-modeling-grid-flow-triangle--up{border-left:8px solid #0000;border-right:8px solid #0000;border-bottom:9px solid var(--surface-200);transform:translate(-50%,-50%)}.event-modeling-grid-connections{pointer-events:none;position:absolute;inset:0;overflow:visible}.event-modeling-grid-connections__svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.event-modeling-grid-connections__line{fill:none;stroke:var(--surface-300);stroke-width:2px;stroke-linecap:round}.event-modeling-grid-connections__arrow{fill:var(--surface-300)}.event-modeling-board--highlight-slices .event-modeling-grid-slice-column,.event-modeling-board--highlight-slices .event-modeling-grid-specification-wrapper{opacity:.25;transition:opacity .2s}.event-modeling-board--highlight-slices .event-modeling-grid-slice-column--connection-highlighted{opacity:1}.event-modeling-feature-grid-slices--row-collapsed{max-height:0;overflow:hidden}.event-modeling-feature-grid-slices--header-visible{padding-top:4px}.event-modeling-features-area{flex-direction:column;row-gap:4px;margin-top:4px;display:flex}.event-modeling-features-area__headers,.event-modeling-features-area__columns{grid-auto-columns:auto;grid-auto-flow:column;display:grid}.event-modeling-features-area__columns{grid-template-rows:auto auto}.event-modeling-features-area__column{display:contents}.event-modeling-grid-slice-type-explanation{margin-top:2px;display:block}:where(.event-modeling-grid-pill--feature) .event-modeling-grid-add-button--small{border:1px solid var(--cratis-surface-border);width:20px;height:20px;color:var(--cratis-text-color-secondary);cursor:pointer;background:0 0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;line-height:1;display:flex}:where(.event-modeling-grid-pill--feature) .event-modeling-grid-add-button--no-circle{border:none;border-radius:4px}:where(.event-modeling-grid-pill--feature) .event-modeling-grid-add-button--small:hover{color:var(--cratis-text-color)}.event-modeling-grid-pill--feature .event-modeling-grid-icon-btn{cursor:pointer;width:20px;height:20px;color:var(--cratis-text-color-secondary);background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;line-height:1;display:flex;position:relative}.event-modeling-grid-pill--feature .event-modeling-grid-icon-btn:hover{color:var(--cratis-text-color)}.event-modeling-feature-chat-dot{background:#f59e0b;border:1px solid #fff;border-radius:50%;width:5px;height:5px;position:absolute;top:2px;right:2px}.spec-run-button{width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.spec-run-button i{font-size:11px}.spec-run-button:hover{color:var(--text-color)}.spec-run-button--running{color:var(--primary-color)}.spec-run-button--passed{color:var(--green-500)}.spec-run-button--passed:hover{color:var(--green-600)}.spec-run-button--failed{color:var(--red-500)}.spec-run-button--failed:hover{color:var(--red-600)}.spec-run-button--inconclusive{color:var(--yellow-500)}.spec-run-button--inconclusive:hover{color:var(--yellow-600)}.spec-run-button--couldNotRun{color:var(--text-color-secondary)}.spec-status{background:0 0;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;line-height:1;display:inline-flex}.spec-status i{pointer-events:none;font-size:12px}.spec-status--idle{color:var(--text-color-secondary)}.spec-status--running{color:var(--primary-color)}.spec-status--passed{color:var(--green-500)}.spec-status--failed{color:var(--red-500)}.spec-status--inconclusive{color:var(--yellow-500)}.spec-status--couldNotRun{color:var(--text-color-secondary)}.spec-status--has-error{cursor:pointer;width:24px;height:24px}.spec-status--has-error i{font-size:14px}.spec-status--has-error:hover{color:var(--red-600);transform:scale(1.1)}.spec-status--has-error:focus{outline:2px solid var(--red-500);outline-offset:2px;border-radius:50%}.event-modeling-grid-specification-wrapper{pointer-events:none;flex-direction:column;flex-shrink:0;margin-top:4px;margin-left:-56px;display:flex}.event-modeling-grid-specification-wrapper--running .event-modeling-grid-specification-box{background:#3b82f60f;border-color:#3b82f659}.event-modeling-grid-specification-wrapper--passed .event-modeling-grid-specification-box{background:#10b9810f;border-color:#10b98159}.event-modeling-grid-specification-wrapper--failed .event-modeling-grid-specification-box{background:#ef44440f;border-color:#ef444459}.event-modeling-grid-specification-wrapper--inconclusive .event-modeling-grid-specification-box{background:#f59e0b0f;border-color:#f59e0b59}.event-modeling-grid-specification-wrapper--couldNotRun .event-modeling-grid-specification-box{border-style:dashed}.event-modeling-grid-specification-outer-row{pointer-events:none;flex-direction:row;align-items:stretch;display:flex}.event-modeling-grid-specification-box{pointer-events:auto}.event-modeling-grid-specification-label-gutter{pointer-events:none}.event-modeling-grid-specification-label-gutter button{pointer-events:auto}.event-modeling-grid-specification-box{border-left:2px dashed var(--surface-200);border-right:2px dashed var(--surface-200);box-sizing:border-box;background:#ffffff0a;overflow:visible}.event-modeling-grid-specification-box--header{border-top:2px dashed var(--surface-200);border-radius:10px 10px 0 0}.event-modeling-grid-specification-box--section{border-top:1px dashed var(--surface-100)}.event-modeling-grid-specification-box--last{border-bottom:2px dashed var(--surface-200);border-radius:0 0 10px 10px}.event-modeling-grid-specification-box--header.event-modeling-grid-specification-box--last{border-radius:10px}.event-modeling-grid-specification-header{box-sizing:border-box;border-bottom:1px solid var(--surface-200);background:#a08ce61a;flex-shrink:0;align-items:center;gap:4px;height:44px;padding:0 4px;display:flex}.event-modeling-grid-specification-box--header.event-modeling-grid-specification-box--last .event-modeling-grid-specification-header{border-bottom:none}.event-modeling-grid-specification-header-label{flex:1;justify-content:center;align-items:center;min-width:0;display:flex;overflow:hidden}.event-modeling-grid-specification-header-label .event-modeling-grid-editable-label,.event-modeling-grid-specification-header-label .event-modeling-grid-editable-label-input{text-align:center;text-overflow:ellipsis;white-space:nowrap;color:#ffffffb3;width:100%;font-size:11px;font-weight:600;overflow:hidden}.event-modeling-grid-specification-section{box-sizing:border-box;flex-direction:column;width:100%;padding:8px;display:flex}.event-modeling-grid-specification-section-content{flex-flow:wrap;flex:1;justify-content:center;align-items:center;gap:8px;padding:4px 0;display:flex}.event-modeling-grid-specification-section-actions{justify-content:flex-end;align-items:center;min-height:24px;padding-top:4px;display:flex}.event-modeling-grid-specification-section-headline{color:var(--text-color-secondary);text-transform:uppercase;letter-spacing:.05em;opacity:.7;-webkit-user-select:none;user-select:none;align-self:flex-start;padding:0 4px 4px;font-size:12px;font-weight:600}.spec-run-all-button .pi{font-size:11px}.spec-delete-button{width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.spec-delete-button i{font-size:11px}.spec-delete-button:hover{color:var(--red-500)}.spec-header-message{max-width:100%;color:var(--red-600);text-align:center;white-space:nowrap;text-overflow:ellipsis;background:#ef44441a;border-top:1px solid #ef444433;padding:4px 8px;font-size:10px;font-weight:500;line-height:1.4;overflow:hidden}.spec-header-execution{text-align:center;color:var(--text-color-secondary);padding:2px 8px;font-size:10px}.spec-header-message--could-not-run{color:var(--text-color-secondary);background:var(--surface-100);border-top:1px dashed var(--surface-300)}.event-modeling-grid-specification-add-area{flex-shrink:0;justify-content:center;padding:8px 0 4px;display:flex}button.event-modeling-card{cursor:pointer;border-radius:var(--card-radius);z-index:1;text-align:left;background:0 0;border:none;padding:0;transition:transform .1s,box-shadow .1s;display:block;position:relative}button.event-modeling-card:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 4px 12px #00000026}button.event-modeling-card:disabled{cursor:default;opacity:1}div.event-modeling-card{border-radius:var(--card-radius);display:block;position:relative}.event-modeling-card__face{width:var(--card-width);min-height:var(--card-min-height);padding:var(--card-padding-y) var(--card-padding-x);border-radius:var(--card-radius);font-size:var(--card-font-size);-webkit-user-select:none;user-select:none;box-sizing:border-box;text-align:center;flex-direction:column;justify-content:center;font-family:Inter,Helvetica,Arial,sans-serif;display:flex;box-shadow:0 1px 4px #0000002e}.event-modeling-card__title{text-overflow:ellipsis;white-space:nowrap;line-height:var(--card-line-height);display:block;overflow:hidden}.event-modeling-card__title-line{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.event-modeling-card__face .schema-tooltip-properties{text-align:left;margin-top:6px}.event-modeling-card__face .schema-tooltip-properties__title{display:none}.event-modeling-card__face .schema-tooltip-properties__row{background:#00000024}.event-modeling-read-model,.event-modeling-event,.event-modeling-command{display:inline-block;position:relative}@keyframes event-modeling-navigate-glow{0%,to{box-shadow:0 1px 4px #0000002e}50%{box-shadow:0 0 12px 4px #f0a05099,0 0 30px 8px #f0a05040}}.event-modeling-card--navigate-highlight{transition:none!important;animation:.65s ease-in-out 3 event-modeling-navigate-glow!important}[data-artifact-kind=command]{--card-action-background:#0a3a52d9;--card-action-background-strong:#0a3a52;--card-action-color:var(--card-command-bg);--card-action-border:#7ec8f066;--card-action-border-strong:#7ec8f0cc}[data-artifact-kind=readModel]{--card-action-background:#2a3a00d9;--card-action-background-strong:#2a3a00;--card-action-color:var(--card-readmodel-bg);--card-action-border:#b8d63b66;--card-action-border-strong:#b8d63bcc}[data-artifact-kind=event]{--card-action-background:#502800d9;--card-action-background-strong:#502800;--card-action-color:#e08030;--card-action-border:#e0803066;--card-action-border-strong:#e08030cc}.event-modeling-card-action{background:var(--card-action-background);width:20px;height:20px;color:var(--card-action-color);border:1px solid var(--card-action-border);cursor:pointer;z-index:10;opacity:0;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:9px;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;box-shadow:0 1px 4px #0000004d}[data-artifact-kind]:hover .event-modeling-card-action{opacity:1}.event-modeling-card-action--active{opacity:1;background:var(--card-action-background-strong);border-color:var(--card-action-border-strong)}.event-modeling-card-action:hover{background:var(--card-action-background-strong);transform:scale(1.15)}.event-modeling-card-action:focus-visible{outline:2px solid var(--card-action-color);outline-offset:2px;opacity:1}.event-modeling-card-action--disabled{cursor:not-allowed;opacity:0;color:#c8c8c899;background:#50505099;border-color:#a0a0a04d}[data-artifact-kind]:hover .event-modeling-card-action--disabled{opacity:.7}.event-modeling-card-action--disabled:hover{background:#505050b3;transform:none}:where(:root){--cratis-schema-readmodel-border:#8aac1e;--cratis-schema-command-border:#4aa8d0;--cratis-schema-event-border:#d07830;--cratis-schema-connector:#6a9a10;--cratis-schema-connector-border:white}.read-model-panel{box-sizing:border-box;flex-direction:column;width:100%;height:100%;display:flex;overflow-y:auto}.read-model-panel__title{text-transform:uppercase;letter-spacing:.07em;color:var(--text-color-secondary);margin:0 0 4px;padding:0 4px;font-family:system-ui,sans-serif;font-size:11px;font-weight:700}.read-model-card{border:1.5px solid var(--cratis-schema-readmodel-border);background:var(--surface-card);border-radius:8px;flex-direction:column;flex:1;min-height:0;display:flex;overflow:visible}.read-model-card__header{background:var(--card-readmodel-bg);border-radius:6px 6px 0 0;align-items:center;gap:8px;padding:7px 10px;display:flex}.read-model-card__connector{background:var(--cratis-schema-connector);border:1.5px solid var(--cratis-schema-connector-border);cursor:default;border-radius:50%;flex-shrink:0;width:10px;height:10px;transition:transform .1s}.read-model-card__connector--active{background:var(--primary-color);transform:scale(1.25)}.read-model-card__name{color:var(--card-readmodel-text);flex:1;font-family:system-ui,sans-serif;font-size:13px;font-weight:700}.read-model-card__properties{flex-direction:column;flex:1;gap:4px;padding:8px;display:flex;overflow-y:auto}.property-schema-card--command{border-color:var(--cratis-schema-command-border)}.property-schema-card--event{border-color:var(--cratis-schema-event-border)}.property-schema-dialog [data-cratis-part=content]{height:480px}.type-badge{letter-spacing:0;-webkit-user-select:none;user-select:none;white-space:nowrap;cursor:default;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;min-width:22px;height:16px;padding:0 4px;font-family:system-ui,monospace,sans-serif;font-size:9px;font-weight:700;line-height:1;display:inline-flex}.type-badge svg{flex-shrink:0;display:block}.type-badge--concept{letter-spacing:.2px;text-overflow:ellipsis;text-align:center;max-width:120px;font-weight:600;line-height:16px;display:inline-block;overflow:hidden}.schema-tooltip-properties{flex-direction:column;gap:6px;min-width:180px;display:flex}.schema-tooltip-properties--compact{width:100%;min-width:0}.schema-tooltip-properties__title{color:var(--text-color);font-size:11px;line-height:1.35}.schema-tooltip-properties__list{flex-direction:column;gap:3px;display:flex}.schema-tooltip-properties__row{background:color-mix(in srgb, var(--surface-0) 82%, transparent);border-radius:4px;align-items:center;gap:6px;padding:2px 4px;display:flex}.schema-tooltip-properties--compact .schema-tooltip-properties__row{background:0 0}.schema-tooltip-properties__name{color:var(--text-color);font-family:system-ui,sans-serif;font-size:11px;line-height:1.2}.schema-tooltip-properties--compact .schema-tooltip-properties__name{color:inherit}.schema-tooltip-properties__empty{color:var(--text-color-secondary);font-size:10px}.schema-tooltip-properties--compact .schema-tooltip-properties__empty{color:inherit;text-align:center;width:100%}.event-modeling-event-tags{flex-wrap:wrap;gap:.25rem;margin-top:.25rem;display:flex}.event-modeling-event-tag{background:color-mix(in srgb, var(--surface-0) 35%, transparent);max-width:100%;color:inherit;text-overflow:ellipsis;white-space:nowrap;border-radius:.625rem;padding:0 .375rem;font-size:.625rem;line-height:1rem;overflow:hidden}.event-modeling-grid-optional-event-reference{display:inline-flex;position:relative}.event-modeling-grid-optional-event-reference__card{width:var(--card-width);min-height:var(--card-min-height);padding:var(--card-padding-y) var(--card-padding-x);border-radius:var(--card-radius);color:#ffd6aaa6;box-sizing:border-box;font-size:var(--card-font-size);line-height:var(--card-line-height);-webkit-user-select:none;user-select:none;background:#f0a0501f;border:1px dashed #f0a05099;justify-content:center;align-items:center;font-family:Inter,Helvetica,Arial,sans-serif;display:flex}.event-modeling-grid-optional-event-reference__define-btn{width:20px;height:20px;color:var(--card-event-bg);cursor:pointer;z-index:10;opacity:0;background:#3a1a00d9;border:1px solid #f0a05066;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:9px;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 4px #0000004d}.event-modeling-grid-optional-event-reference:hover .event-modeling-grid-optional-event-reference__define-btn{opacity:1}.event-modeling-grid-optional-event-reference__define-btn:hover{background:#3a1a00;transform:scale(1.15)}.event-modeling-grid-optional-event-reference__define-btn:focus-visible{outline:2px solid var(--card-event-bg);outline-offset:2px;opacity:1}.event-modeling-grid-event-picker{align-items:center;display:inline-flex}.event-modeling-grid-event-picker-dropdown{background:var(--surface-card);border:1px solid var(--surface-border);z-index:9999;border-radius:8px;flex-direction:column;min-width:180px;max-width:260px;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 16px #0006}.event-modeling-grid-event-picker-search{box-sizing:border-box;background:var(--surface-ground);border:none;border-bottom:1px solid var(--surface-border);width:100%;color:var(--text-color);outline:none;padding:6px 10px;font-size:12px}.event-modeling-grid-event-picker-list{max-height:180px;margin:0;padding:4px 0;list-style:none;overflow-y:auto}.event-modeling-grid-event-picker-item{width:100%;color:var(--text-color);text-align:left;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;border-left:3px solid;padding:6px 10px;font-size:12px;display:block;overflow:hidden}.event-modeling-grid-event-picker-item:hover{background:var(--surface-hover)}.event-modeling-grid-event-picker-empty{color:var(--text-color-secondary);-webkit-user-select:none;user-select:none;padding:6px 10px;font-size:12px;font-style:italic}.event-modeling-grid-event-picker-separator{background:var(--surface-border);height:1px;margin:4px 0}.event-modeling-spec-values__item{cursor:pointer}.event-modeling-spec-values__item:focus-within{outline:1px solid var(--primary-color,currentColor)}.event-modeling-spec-values__toggle{all:unset;overflow:inherit;text-overflow:inherit;white-space:inherit;overflow-wrap:inherit;cursor:pointer;display:block}.event-modeling-spec-values__item[data-expanded=true] dd{white-space:normal;overflow-wrap:anywhere}.event-modeling-spec-values{max-width:180px;color:var(--text-color-secondary);margin-top:4px;font-size:10px;line-height:1.3}.event-modeling-spec-values__summary{cursor:pointer}.event-modeling-spec-values__list{margin:0}.event-modeling-spec-values__item{gap:4px;min-width:0;display:flex}.event-modeling-spec-values__item dt{flex-shrink:0;font-weight:600}.event-modeling-spec-values__item dt:after{content:":"}.event-modeling-spec-values__item dd{text-overflow:ellipsis;white-space:nowrap;min-width:0;margin:0;overflow:hidden}.event-modeling-spec-error{flex-direction:column;align-items:flex-start;display:flex}.spec-item-removable{position:relative}.spec-item-remove-button{color:#ffffffd9;cursor:pointer;z-index:10;opacity:0;background:#1e1e1ed9;border:1px solid #ffffff59;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;padding:0;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 4px #0000004d}.spec-item-remove-button i{font-size:8px}.spec-item-removable:hover .spec-item-remove-button,.spec-item-remove-button:focus-visible{opacity:1}.spec-item-remove-button:hover{color:var(--red-500,#ef4444);transform:scale(1.15)}.event-modeling-collection-grid-template{-webkit-user-select:none;user-select:none;flex-direction:column;margin-top:4px;display:flex}.event-modeling-collection-grid-template__bar{background:var(--cratis-warning-background);height:36px;color:var(--cratis-warning-text);border-radius:22px;justify-content:center;align-items:center;gap:8px;padding:0 8px;font-size:14px;font-weight:600;display:flex}.event-modeling-collection-grid-template__name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.event-modeling-grid-container{-webkit-user-select:none;user-select:none;background:0 0;flex-direction:column;animation:.12s ease-out event-modeling-grid-body-fade-in;display:inline-flex;position:relative}:where(.event-modeling-collection-grid .event-modeling-module-empty-placeholder){border:1.5px dashed var(--cratis-surface-border);border-radius:var(--cratis-border-radius);min-width:220px;min-height:120px;color:var(--cratis-text-color-secondary);justify-content:center;align-items:center;margin-top:4px;font-size:12px;display:flex}.event-modeling-grid-content-row,.event-modeling-grid-slices-area{flex-direction:row;align-items:flex-start;display:flex}.event-model-board{width:100%;height:100%;position:relative}.event-model-board__logo{width:7.5rem;height:auto;color:var(--event-model-board-logo-color,var(--text-color,currentColor));opacity:.85;pointer-events:none;z-index:10;position:absolute;top:1rem;left:1rem}.event-model-board__toolbar{z-index:10;gap:.5rem;display:flex;position:absolute;top:1rem;right:1rem}.event-model-board__toolbar-surface{border-radius:999px;display:inline-flex;position:relative}.event-model-board__toolbar-surface--plain{background:color-mix(in srgb, var(--surface-card) 78%, transparent);-webkit-backdrop-filter:blur(12px);border:1px solid var(--surface-border)}.event-model-board__toolbar-surface .toolbar{z-index:1;box-shadow:none;background:0 0;border:1px solid #0000;border-radius:999px;padding-block:.375rem;padding-inline:.5rem;position:relative}.event-modeling-grid-cogwheel-icon{color:var(--surface-400);flex-shrink:0;display:inline-flex}.event-modeling-grid-cogwheel-wrapper{justify-content:center;align-items:center;display:inline-flex}.module-collection-link-layer{pointer-events:none;width:0;height:0;position:absolute;top:0;left:0}.module-collection-link-layer__svg{pointer-events:none;position:absolute;overflow:visible}.module-collection-link-layer__arrow{fill:none;stroke:var(--primary-color);stroke-width:2px;stroke-linecap:round;opacity:.75}.module-collection-link-layer__preview{fill:none;stroke:var(--primary-color);stroke-width:2px;stroke-dasharray:6 5;stroke-linecap:round;opacity:.9}.module-collection-link-layer__arrow-head{fill:var(--primary-color)}.module-collection-link-layer__handle{background:var(--primary-color);border:2px solid var(--surface-0);cursor:crosshair;opacity:.55;pointer-events:auto;touch-action:none;border-radius:50%;width:14px;height:14px;transition:opacity .12s,transform .12s;position:absolute;transform:translate(-50%,-50%);box-shadow:0 1px 3px #00000059}.module-collection-link-layer__handle:hover{opacity:1;transform:translate(-50%,-50%)scale(1.25)}.module-collection-link-layer__delete{background:var(--surface-card);border:1px solid var(--surface-border);width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;opacity:.35;pointer-events:auto;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:opacity .12s,color .12s,border-color .12s;display:flex;position:absolute;transform:translate(-50%,-50%)}.module-collection-link-layer__delete:hover{opacity:1;color:var(--red-500);border-color:var(--red-500)}.module-collection-link-layer__delete .pi{font-size:.7rem}.module-collection-link-layer__drop-target{border:2px solid var(--primary-color);background:color-mix(in srgb, var(--primary-color) 12%, transparent);pointer-events:none;border-radius:6px;position:absolute}.event-model-sticky-notes{display:contents}.event-model-sticky-note--busy{pointer-events:none;opacity:.7;position:relative}.event-model-sticky-note__progress{color:var(--cratis-text-color);position:absolute;top:.25rem;right:.25rem}.event-model-sticky-note__spinner{width:1rem;height:1rem}.event-modeling-grid-slice-column-header{box-sizing:border-box;background:var(--highlight-bg);border-bottom:1px solid var(--surface-200);border-radius:8px 8px 0 0;flex-shrink:0;align-items:center;gap:2px;min-width:0;padding:0 4px;display:flex;position:relative}.event-modeling-grid-slice-column-header-left{flex-shrink:0;align-items:center;gap:1px;display:flex}.event-modeling-grid-slice-column-header-center{flex:1;justify-content:center;align-items:center;min-width:0;display:flex;overflow:hidden}.event-modeling-grid-slice-column-header-center>.grid-tooltip-root{flex:1;min-width:0}.event-modeling-grid-slice-column-header-center .event-modeling-grid-editable-label,.event-modeling-grid-slice-column-header-center .event-modeling-grid-editable-label-input{text-align:center;text-overflow:ellipsis;white-space:nowrap;color:#ffffffb3;width:100%;font-size:12px;font-weight:600;line-height:16px;overflow:hidden}.event-modeling-grid-slice-column-header-right{flex-shrink:0;align-items:center;gap:1px;display:flex}.event-modeling-grid-slice-column--collapsed>.event-modeling-grid-slice-column-header{border-bottom:1px solid #ffffff14;border-radius:8px 8px 0 0;justify-content:center}.event-modeling-grid-slice-column{border:2px dashed var(--surface-200);box-sizing:border-box;content-visibility:auto;contain-intrinsic-size:auto 400px auto 900px;background:#ffffff0a;border-radius:10px;flex-direction:column;flex-shrink:0;display:flex;position:relative;overflow:visible}.event-modeling-grid-slice-column--inProgress{background:#3b82f60f;border-color:#3b82f659}.event-modeling-grid-slice-column--readyForReview{background:#f59e0b0f;border-color:#f59e0b59}.event-modeling-grid-slice-column--done{background:#10b9810f;border-color:#10b98159}.event-modeling-grid-slice-column>.event-modeling-grid-slice-cell+.event-modeling-grid-slice-cell{border-top:1px dashed var(--surface-100)}@keyframes event-modeling-grid-body-fade-in{0%{opacity:0}to{opacity:1}}.event-modeling-grid-slice-column>.event-modeling-grid-slice-cell{animation:.12s ease-out event-modeling-grid-body-fade-in}[data-slice-drop-target][aria-busy=true]{cursor:progress}.event-modeling-slices-empty{color:#ffffff2e;border:1.5px dashed #a08ce62e;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;min-height:80px;font-size:11px;display:flex}.event-modeling-grid-slice-cell{box-sizing:border-box;flex-direction:column;align-content:flex-start;gap:6px;width:100%;padding:8px;display:flex;position:relative}.event-modeling-grid-slice-cell--centered{justify-content:center;align-items:center}.event-modeling-grid-slice-cell-items{z-index:1;flex-wrap:wrap;justify-content:center;gap:6px;display:flex;position:relative}.event-modeling-grid-slice-cell-cards{flex-flow:wrap;justify-content:center;align-items:flex-start;gap:8px;display:flex}.event-modeling-grid-slice-cell-cards--row{flex-direction:row;align-items:center}.event-modeling-grid-slice-cell--translator{flex-direction:row;align-items:stretch;padding:0}.event-modeling-grid-slice-cell--translator-external,.event-modeling-grid-slice-cell--translator-regular{box-sizing:border-box;flex-direction:column;flex:0 0 50%;justify-content:center;align-items:center;gap:6px;min-width:0;padding:8px;display:flex;position:relative}.event-modeling-grid-slice-cell--translator-external{border-right:1px dashed var(--surface-300)}.event-modeling-grid-mini-card{border-radius:4px;flex-shrink:0;width:24px;height:24px}.event-modeling-grid-mini-card--command{background:var(--card-command-bg)}.event-modeling-grid-mini-card--readmodel{background:var(--card-readmodel-bg)}.event-modeling-grid-mini-card--event{background:var(--card-event-bg)}.event-modeling-grid-slice-placeholder-row{justify-content:center;align-items:center}.event-modeling-grid-slice-placeholder-card{border-radius:8px;flex-shrink:0;width:140px;height:40px}.event-modeling-grid-slice-placeholder-chips{flex-direction:row;justify-content:center;gap:8px;display:flex}.event-modeling-grid-slice-placeholder-chip{border-radius:6px;flex-shrink:0;width:96px;height:32px}.event-modeling-grid-slice-cell-add-corner{gap:4px;display:flex;position:absolute;bottom:6px;right:6px}.event-modeling-grid-slice-cell-action-corner{gap:4px;display:flex;position:absolute;right:6px}.event-modeling-grid-slice-cell-action-corner--top{top:6px}.system-row-cell__trigger-wrapper{position:absolute;bottom:6px;right:6px}.system-row-cell__trigger-btn{border:1px solid var(--surface-200);width:20px;height:20px;color:var(--text-color-secondary);cursor:pointer;background:0 0;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:12px;line-height:1;transition:border-color .15s,color .15s;display:flex}.system-row-cell__trigger-btn .pi{font-size:11px}.system-row-cell__trigger-btn:hover{border-color:var(--surface-300);color:var(--text-color)}.system-row-cell__trigger-btn--active{border-color:var(--primary-color);color:var(--primary-color)}.system-row-cell__trigger-btn--active:hover{border-color:var(--primary-color);color:var(--primary-color);opacity:.8}.system-row-cell__trigger-btn--readonly,.system-row-cell__trigger-btn--readonly:hover{cursor:default;opacity:1}.event-modeling-grid-slice-cell--system.event-modeling-grid-slice-cell--collapsed .event-modeling-grid-cogwheel-icon{transform-origin:50%;transform:scale(.52)}.event-modeling-grid-slice-cell--system.event-modeling-grid-slice-cell--collapsed .event-modeling-grid-cogwheel-icon svg{width:22px;height:22px}.system-row-cell__cogwheel{display:inline-flex}.system-row-cell__trigger-menu{background:var(--surface-overlay);border:1px solid var(--surface-border);z-index:100;border-radius:4px;min-width:300px;position:absolute;bottom:calc(100% + 4px);right:0;overflow:hidden;box-shadow:0 4px 12px #0000004d}.system-row-cell__trigger-menu-item{color:var(--text-color);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:normal;padding:6px 12px;font-size:13px}.system-row-cell__trigger-menu-item:hover{background:var(--highlight-bg)}.system-row-cell__trigger-menu-item-title{font-weight:500}.system-row-cell__trigger-menu-item-description{opacity:.85;margin-top:2px;font-size:11px}.event-modeling-grid-ui-preview{border:1px solid var(--surface-200);border-radius:4px;width:fit-content;max-width:100%;line-height:0;overflow:hidden}.event-modeling-grid-ui-preview--clickable{cursor:pointer}.event-modeling-grid-event-wrapper{flex-direction:column;align-items:center;display:inline-flex;position:relative}.event-modeling-public-event{background:color-mix(in srgb, var(--surface-0) 55%, transparent);color:inherit;letter-spacing:.02em;text-transform:uppercase;border-radius:.625rem;align-items:center;gap:.25rem;margin-top:.25rem;padding:0 .375rem;font-size:.625rem;font-weight:600;line-height:1rem;display:inline-flex}.event-modeling-public-event .pi{font-size:.625rem}.event-modeling-visibility-rule-break{background:var(--orange-500,#f59e0b);color:#fff;text-align:center;cursor:help;pointer-events:auto;z-index:11;border:0;border-radius:50%;width:16px;height:16px;padding:0;font-size:11px;font-weight:700;line-height:16px;position:absolute;top:-6px;left:-6px}.event-modeling-visibility-rule-break:focus-visible{outline:2px solid var(--orange-500,#f59e0b);outline-offset:2px}.event-modeling-grid-event-wrapper--rule-break .event-modeling-card__face{border:1.5px solid var(--orange-500,#f59e0b)}.event-modeling-event-reference{position:relative}.event-modeling-event-reference .event-modeling-card__face{border:1.5px dashed var(--surface-400,#ffffff8c);opacity:.7}.event-modeling-event-reference--out-of-order .event-modeling-card__face{border-color:var(--orange-500,#f59e0b);opacity:1}.event-modeling-event-reference__warning{background:var(--orange-500,#f59e0b);color:#fff;text-align:center;pointer-events:none;border-radius:50%;width:16px;height:16px;font-size:11px;font-weight:700;line-height:16px;position:absolute;top:-6px;left:-6px}.event-modeling-grid-event-wrapper--reference{position:relative}.event-modeling-grid-event-navigate-button{color:#e08030;cursor:pointer;z-index:10;pointer-events:all;opacity:0;background:#502800d9;border:1px solid #e0803066;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;padding:0;font-size:9px;line-height:1;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;left:-6px;box-shadow:0 1px 4px #0000004d}.event-modeling-grid-event-wrapper--reference:hover .event-modeling-grid-event-navigate-button{opacity:1}.event-modeling-grid-event-navigate-button:hover{background:#502800;transform:scale(1.15)}.event-modeling-grid-event-navigate-button:focus-visible{outline-offset:2px;opacity:1;outline:2px solid #e08030}.event-modeling-grid-event-remove-button{color:#e08030;cursor:pointer;z-index:10;pointer-events:all;opacity:0;background:#502800d9;border:1px solid #e0803066;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;padding:0;font-size:9px;line-height:1;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 4px #0000004d}.event-modeling-grid-event-wrapper--reference:hover .event-modeling-grid-event-remove-button{opacity:1}.event-modeling-grid-event-remove-button:disabled{cursor:wait;opacity:1}.event-modeling-grid-event-remove-button:hover:not(:disabled){background:#502800;transform:scale(1.15)}.event-modeling-grid-event-remove-button:focus-visible{outline-offset:2px;opacity:1;outline:2px solid #e08030}.event-modeling-board--dim-others .event-modeling-card,.event-modeling-board--dim-others .event-modeling-grid-sticky-note,.event-modeling-board--dim-others .event-modeling-grid-ui-preview{opacity:.15;transition:opacity .2s}.event-modeling-board--dim-others .event-modeling-event--undimmed,.event-modeling-board--dim-others .event-modeling-event--undimmed .event-modeling-card{opacity:1!important}.event-modeling-grid-optional-read-model{display:inline-flex;position:relative}.event-modeling-grid-optional-read-model__card{width:var(--card-width);min-height:var(--card-min-height);padding:var(--card-padding-y) var(--card-padding-x);border-radius:var(--card-radius);color:#d4e7938c;box-sizing:border-box;font-size:var(--card-font-size);line-height:var(--card-line-height);-webkit-user-select:none;user-select:none;background:#7e93241f;border:1px dashed #adc95099;justify-content:center;align-items:center;font-family:Inter,Helvetica,Arial,sans-serif;display:flex}.event-modeling-grid-optional-read-model__define-btn{width:20px;height:20px;color:var(--card-readmodel-bg);cursor:pointer;z-index:10;opacity:0;background:#2a3a00d9;border:1px solid #b8d63b66;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:9px;transition:opacity .15s,transform .1s;display:flex;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 4px #0000004d}.event-modeling-grid-optional-read-model:hover .event-modeling-grid-optional-read-model__define-btn{opacity:1}.event-modeling-grid-optional-read-model__define-btn:hover{background:#2a3a00;transform:scale(1.15)}.event-modeling-grid-optional-read-model__define-btn:focus-visible{outline:2px solid var(--card-readmodel-bg);outline-offset:2px;opacity:1}
2
2
  /*$vite$:1*/