@elevasis/ui 2.9.0 → 2.10.0

package/dist/provider/index.js

@@ -1,15 +1,19 @@
-export { ElevasisUIProvider, createTestFeaturesProvider } from '../chunk-YCHZ4U5V.js';
-import '../chunk-47YILFON.js';
-import '../chunk-CYXZHBP4.js';
-export { ElevasisCoreProvider, ElevasisFeaturesProvider, FeatureShell, NotificationProvider, useElevasisFeatures, useNotificationAdapter, useOptionalElevasisFeatures } from '../chunk-OPT74SGF.js';
+export { createTestFeaturesProvider } from '../chunk-P5VHGY5P.js';
+export { ElevasisUIProvider } from '../chunk-5VBR74ZS.js';
+import '../chunk-OS5GFW2O.js';
+import '../chunk-F4TPY6YL.js';
+export { ElevasisFeaturesProvider, FeatureShell, useElevasisFeatures, useOptionalElevasisFeatures } from '../chunk-USVBMGMP.js';
 import '../chunk-RX4UWZZR.js';
-import '../chunk-Y3D3WFJG.js';
+import '../chunk-SQQGLGHW.js';
 import '../chunk-3KMDHCAR.js';
 import '../chunk-NYBEU5TE.js';
+export { ElevasisCoreProvider, NotificationProvider, useNotificationAdapter } from '../chunk-R7WLWGPO.js';
+import '../chunk-SZHARWKU.js';
 import '../chunk-NVOCKXUQ.js';
 import '../chunk-2IFYDILW.js';
 import '../chunk-ELJIFLCB.js';
-import '../chunk-W4VYXIN7.js';
+import '../chunk-L4XXM55J.js';
+import '../chunk-V7XHGJQZ.js';
 export { AppearanceProvider, useAppearance } from '../chunk-QJ2KCHKX.js';
 import '../chunk-DT3QYZVU.js';
 import '../chunk-SLVC5OJ2.js';

package/dist/provider/published.d.ts

@@ -44,7 +44,7 @@ interface ThemePreset {
      */
     loader?: ReactNode;
 }
-type PresetName = 'default' | 'tactical' | 'regal' | 'cyber-volt' | 'aurora' | 'rose-gold' | 'midnight' | 'ember' | 'canopy' | 'slate' | 'cyber-strike' | 'cyber-chrome' | 'cyber-void' | 'nirvana' | 'wave' | 'synapse' | 'cortex' | 'helios' | 'graphite' | 'quarry';
+type PresetName = 'default' | 'tactical' | 'regal' | 'cyber-volt' | 'aurora' | 'rose-gold' | 'midnight' | 'titanium' | 'canopy' | 'slate' | 'cyber-strike' | 'cyber-chrome' | 'cyber-void' | 'nirvana' | 'wave' | 'synapse' | 'cortex' | 'helios' | 'graphite' | 'quarry';
 
 interface ApiErrorDetails {
     method: string;
@@ -277,24 +277,6 @@ declare function ElevasisCoreProvider({ auth, queryClient, apiUrl, onError, noti
  */
 type TimeRange = '1h' | '24h' | '7d' | '30d';
 
-declare const SemanticDomainSchema = DisplayMetadataSchema.extend({
-  id: ModelIdSchema,
-  entityIds: ReferenceIdsSchema,
-  surfaceIds: ReferenceIdsSchema,
-  resourceIds: ReferenceIdsSchema,
-  capabilityIds: ReferenceIdsSchema
-})
-
-declare const FeatureKeySchema = z.enum([
-  'acquisition',
-  'delivery',
-  'operations',
-  'monitoring',
-  'settings',
-  'seo',
-  'calibration'
-])
-
 declare const SurfaceDefinitionSchema = z.object({
   id: ModelIdSchema,
   label: LabelSchema,
@@ -302,8 +284,8 @@ declare const SurfaceDefinitionSchema = z.object({
   surfaceType: SurfaceTypeSchema,
   description: DescriptionSchema.optional(),
   icon: IconNameSchema.optional(),
-  featureKey: FeatureKeySchema.optional(),
-  domainIds: ReferenceIdsSchema,
+  featureId: ModelIdSchema.optional(),
+  featureIds: ReferenceIdsSchema,
   entityIds: ReferenceIdsSchema,
   resourceIds: ReferenceIdsSchema,
   capabilityIds: ReferenceIdsSchema,
@@ -311,7 +293,7 @@ declare const SurfaceDefinitionSchema = z.object({
 })
 
 declare const OrganizationModelSchema = OrganizationModelSchemaBase.superRefine((model, ctx) => {
-  const domainsById = collectIds(model.domains, ctx, ['domains'], 'Domain')
+  const featuresById = collectIds(model.features, ctx, ['features'], 'Feature')
   const surfacesById = collectIds(model.navigation.surfaces, ctx, ['navigation', 'surfaces'], 'Surface')
   collectIds(model.navigation.groups, ctx, ['navigation', 'groups'], 'Navigation group')
   collectIds(model.resourceMappings, ctx, ['resourceMappings'], 'Resource mapping')
@@ -350,48 +332,51 @@ declare const OrganizationModelSchema = OrganizationModelSchemaBase.superRefine(
     })
   })
 
-  model.domains.forEach((domain, domainIndex) => {
-    domain.surfaceIds.forEach((surfaceId, surfaceIndex) => {
+  // Feature -> Surface bidirectional validation
+  model.features.forEach((feature, featureIndex) => {
+    feature.surfaceIds.forEach((surfaceId, surfaceIndex) => {
       const surface = surfacesById.get(surfaceId)
       if (!surface) {
         addIssue(
           ctx,
-          ['domains', domainIndex, 'surfaceIds', surfaceIndex],
-          `Domain "${domain.id}" references unknown surface "${surfaceId}"`
+          ['features', featureIndex, 'surfaceIds', surfaceIndex],
+          `Feature "${feature.id}" references unknown surface "${surfaceId}"`
         )
         return
       }
 
-      if (!surface.domainIds.includes(domain.id)) {
+      if (!surface.featureIds.includes(feature.id)) {
         addIssue(
           ctx,
-          ['domains', domainIndex, 'surfaceIds', surfaceIndex],
-          `Domain "${domain.id}" references surface "${surfaceId}" but that surface does not include domain "${domain.id}"`
+          ['features', featureIndex, 'surfaceIds', surfaceIndex],
+          `Feature "${feature.id}" references surface "${surfaceId}" but that surface does not include feature "${feature.id}"`
         )
       }
     })
 
-    domain.resourceIds.forEach((resourceId, resourceIndex) => {
+    // Feature -> Resource bidirectional validation
+    feature.resourceIds.forEach((resourceId, resourceIndex) => {
       const resourceMapping = resourceMappingsByResourceId.get(resourceId)
       if (!resourceMapping) {
         addIssue(
           ctx,
-          ['domains', domainIndex, 'resourceIds', resourceIndex],
-          `Domain "${domain.id}" references unknown resource "${resourceId}"`
+          ['features', featureIndex, 'resourceIds', resourceIndex],
+          `Feature "${feature.id}" references unknown resource "${resourceId}"`
         )
         return
       }
 
-      if (!resourceMapping.domainIds.includes(domain.id)) {
+      if (!resourceMapping.featureIds.includes(feature.id)) {
         addIssue(
           ctx,
-          ['domains', domainIndex, 'resourceIds', resourceIndex],
-          `Domain "${domain.id}" references resource "${resourceId}" but that resource mapping does not include domain "${domain.id}"`
+          ['features', featureIndex, 'resourceIds', resourceIndex],
+          `Feature "${feature.id}" references resource "${resourceId}" but that resource mapping does not include feature "${feature.id}"`
         )
       }
     })
   })
 
+  // Surface -> Feature bidirectional validation and other surface refs
   model.navigation.surfaces.forEach((surface, surfaceIndex) => {
     if (surface.parentId && !surfacesById.has(surface.parentId)) {
       addIssue(
@@ -401,26 +386,27 @@ declare const OrganizationModelSchema = OrganizationModelSchemaBase.superRefine(
       )
     }
 
-    surface.domainIds.forEach((domainId, domainIndex) => {
-      const domain = domainsById.get(domainId)
-      if (!domain) {
+    surface.featureIds.forEach((featureId, featureIndex) => {
+      const feature = featuresById.get(featureId)
+      if (!feature) {
         addIssue(
           ctx,
-          ['navigation', 'surfaces', surfaceIndex, 'domainIds', domainIndex],
-          `Surface "${surface.id}" references unknown domain "${domainId}"`
+          ['navigation', 'surfaces', surfaceIndex, 'featureIds', featureIndex],
+          `Surface "${surface.id}" references unknown feature "${featureId}"`
         )
         return
       }
 
-      if (!domain.surfaceIds.includes(surface.id)) {
+      if (!feature.surfaceIds.includes(surface.id)) {
         addIssue(
           ctx,
-          ['navigation', 'surfaces', surfaceIndex, 'domainIds', domainIndex],
-          `Surface "${surface.id}" references domain "${domainId}" but that domain does not include surface "${surface.id}"`
+          ['navigation', 'surfaces', surfaceIndex, 'featureIds', featureIndex],
+          `Surface "${surface.id}" references feature "${featureId}" but that feature does not include surface "${surface.id}"`
         )
       }
     })
 
+    // Surface -> Resource bidirectional validation
     surface.resourceIds.forEach((resourceId, resourceIndex) => {
       const resourceMapping = resourceMappingsByResourceId.get(resourceId)
       if (!resourceMapping) {
@@ -442,23 +428,24 @@ declare const OrganizationModelSchema = OrganizationModelSchemaBase.superRefine(
     })
   })
 
+  // ResourceMapping -> Feature and Surface bidirectional validation
   model.resourceMappings.forEach((resourceMapping, resourceIndex) => {
-    resourceMapping.domainIds.forEach((domainId, domainIndex) => {
-      const domain = domainsById.get(domainId)
-      if (!domain) {
+    resourceMapping.featureIds.forEach((featureId, featureIndex) => {
+      const feature = featuresById.get(featureId)
+      if (!feature) {
         addIssue(
           ctx,
-          ['resourceMappings', resourceIndex, 'domainIds', domainIndex],
-          `Resource mapping "${resourceMapping.id}" references unknown domain "${domainId}"`
+          ['resourceMappings', resourceIndex, 'featureIds', featureIndex],
+          `Resource mapping "${resourceMapping.id}" references unknown feature "${featureId}"`
         )
         return
       }
 
-      if (!domain.resourceIds.includes(resourceMapping.resourceId)) {
+      if (!feature.resourceIds.includes(resourceMapping.resourceId)) {
         addIssue(
           ctx,
-          ['resourceMappings', resourceIndex, 'domainIds', domainIndex],
-          `Resource mapping "${resourceMapping.id}" references domain "${domainId}" but that domain does not include resource "${resourceMapping.resourceId}"`
+          ['resourceMappings', resourceIndex, 'featureIds', featureIndex],
+          `Resource mapping "${resourceMapping.id}" references feature "${featureId}" but that feature does not include resource "${resourceMapping.resourceId}"`
         )
       }
     })
@@ -486,9 +473,7 @@ declare const OrganizationModelSchema = OrganizationModelSchemaBase.superRefine(
 })
 
 type OrganizationModel = z.infer<typeof OrganizationModelSchema>
-type OrganizationModelFeatureKey = z.infer<typeof FeatureKeySchema>
 type OrganizationModelSurface = z.infer<typeof SurfaceDefinitionSchema>
-type OrganizationModelSemanticDomain = z.infer<typeof SemanticDomainSchema>
 
 interface EventSourceMessage {
     id: string;
@@ -537,15 +522,10 @@ interface FeatureNavEntry {
 }
 type FeatureSidebarComponent = ComponentType;
 interface FeatureModule {
-    /** Unique stable identifier for this feature (e.g. `'crm'`, `'delivery'`). */
+    /** Unique stable identifier for this feature (e.g. `'crm'`, `'projects'`). */
     key: string;
-    /** Feature key used for access-flag gating in the organization model. */
-    accessFeatureKey: OrganizationModelFeatureKey;
-    /**
-     * Semantic domain identifiers contributed by this feature.
-     * Merged with surface-derived domain IDs during resolution.
-     */
-    domainIds?: OrganizationModelSemanticDomain['id'][];
+    /** Feature ID used for access-flag gating — must match the `id` of a feature in the organization model. */
+    featureId: string;
     /**
      * Capability identifiers contributed by this feature.
      * Merged into `ResolvedFeatureSemantics.capabilityIds` at resolution time.
@@ -567,11 +547,10 @@ interface FeatureModule {
     organizationGraph?: OrganizationGraphFeatureBridge;
 }
 interface ResolvedFeatureAccess {
-    featureKey: string;
+    featureId: string;
     enabled: boolean;
 }
 interface ResolvedFeatureSemantics {
-    domainIds: OrganizationModelSemanticDomain['id'][];
     capabilityIds: string[];
     surfaceIds: string[];
     surfaces: OrganizationModelSurface[];
@@ -585,7 +564,7 @@ type ShellNavSource = 'app' | 'feature';
 interface ResolvedShellNavItem extends FeatureNavEntry {
     placement: ShellNavPlacement;
     source: ShellNavSource;
-    accessFeatureKey?: string;
+    featureId?: string;
 }
 interface ResolvedShellModel {
     navItems: ResolvedShellNavItem[];
@@ -613,7 +592,7 @@ interface OrganizationGraphContextValue {
     surfaceId?: string;
     surfacePath?: string;
     surfaceType?: OrganizationModelSurface['surfaceType'];
-    featureKey?: OrganizationModelFeatureKey;
+    featureId?: string;
 }
 interface ElevasisFeaturesProviderProps {
     features: FeatureModule[];

package/dist/provider/published.js

@@ -1,12 +1,15 @@
-export { ElevasisCoreProvider, ElevasisFeaturesProvider, FeatureShell, NotificationProvider, useElevasisFeatures, useNotificationAdapter, useOptionalElevasisFeatures } from '../chunk-OPT74SGF.js';
+export { ElevasisFeaturesProvider, FeatureShell, useElevasisFeatures, useOptionalElevasisFeatures } from '../chunk-USVBMGMP.js';
 import '../chunk-RX4UWZZR.js';
-import '../chunk-Y3D3WFJG.js';
+import '../chunk-SQQGLGHW.js';
 import '../chunk-3KMDHCAR.js';
 import '../chunk-NYBEU5TE.js';
+export { ElevasisCoreProvider, NotificationProvider, useNotificationAdapter } from '../chunk-R7WLWGPO.js';
+import '../chunk-SZHARWKU.js';
 import '../chunk-NVOCKXUQ.js';
 import '../chunk-2IFYDILW.js';
 import '../chunk-ELJIFLCB.js';
-import '../chunk-W4VYXIN7.js';
+import '../chunk-L4XXM55J.js';
+import '../chunk-V7XHGJQZ.js';
 export { AppearanceProvider, useAppearance } from '../chunk-QJ2KCHKX.js';
 import '../chunk-DT3QYZVU.js';
 import '../chunk-SLVC5OJ2.js';

package/dist/supabase/index.d.ts

@@ -1112,113 +1112,6 @@ type Database = {
                     }
                 ];
             };
-            calibration_projects: {
-                Row: {
-                    created_at: string | null;
-                    description: string | null;
-                    id: string;
-                    name: string;
-                    organization_id: string;
-                    resource_id: string;
-                    resource_type: string;
-                    updated_at: string | null;
-                };
-                Insert: {
-                    created_at?: string | null;
-                    description?: string | null;
-                    id?: string;
-                    name: string;
-                    organization_id: string;
-                    resource_id: string;
-                    resource_type: string;
-                    updated_at?: string | null;
-                };
-                Update: {
-                    created_at?: string | null;
-                    description?: string | null;
-                    id?: string;
-                    name?: string;
-                    organization_id?: string;
-                    resource_id?: string;
-                    resource_type?: string;
-                    updated_at?: string | null;
-                };
-                Relationships: [
-                    {
-                        foreignKeyName: "calibration_projects_organization_id_fkey";
-                        columns: ["organization_id"];
-                        isOneToOne: false;
-                        referencedRelation: "organizations";
-                        referencedColumns: ["id"];
-                    }
-                ];
-            };
-            calibration_runs: {
-                Row: {
-                    completed_at: string | null;
-                    config_variants: Json;
-                    created_at: string | null;
-                    description: string | null;
-                    execution_mode: string;
-                    grader_model: string | null;
-                    grading_rubric: Json | null;
-                    id: string;
-                    name: string;
-                    organization_id: string;
-                    project_id: string;
-                    results: Json;
-                    status: string;
-                    test_inputs: Json;
-                };
-                Insert: {
-                    completed_at?: string | null;
-                    config_variants: Json;
-                    created_at?: string | null;
-                    description?: string | null;
-                    execution_mode?: string;
-                    grader_model?: string | null;
-                    grading_rubric?: Json | null;
-                    id?: string;
-                    name: string;
-                    organization_id: string;
-                    project_id: string;
-                    results?: Json;
-                    status?: string;
-                    test_inputs: Json;
-                };
-                Update: {
-                    completed_at?: string | null;
-                    config_variants?: Json;
-                    created_at?: string | null;
-                    description?: string | null;
-                    execution_mode?: string;
-                    grader_model?: string | null;
-                    grading_rubric?: Json | null;
-                    id?: string;
-                    name?: string;
-                    organization_id?: string;
-                    project_id?: string;
-                    results?: Json;
-                    status?: string;
-                    test_inputs?: Json;
-                };
-                Relationships: [
-                    {
-                        foreignKeyName: "calibration_runs_organization_id_fkey";
-                        columns: ["organization_id"];
-                        isOneToOne: false;
-                        referencedRelation: "organizations";
-                        referencedColumns: ["id"];
-                    },
-                    {
-                        foreignKeyName: "calibration_runs_project_id_fkey";
-                        columns: ["project_id"];
-                        isOneToOne: false;
-                        referencedRelation: "calibration_projects";
-                        referencedColumns: ["id"];
-                    }
-                ];
-            };
             command_queue: {
                 Row: {
                     action_payload: Json | null;
@@ -3654,108 +3547,6 @@ declare const useSupabase: () => SupabaseClient<Database, "public", "public", {
                 referencedColumns: ["id"];
             }];
         };
-        calibration_projects: {
-            Row: {
-                created_at: string | null;
-                description: string | null;
-                id: string;
-                name: string;
-                organization_id: string;
-                resource_id: string;
-                resource_type: string;
-                updated_at: string | null;
-            };
-            Insert: {
-                created_at?: string | null;
-                description?: string | null;
-                id?: string;
-                name: string;
-                organization_id: string;
-                resource_id: string;
-                resource_type: string;
-                updated_at?: string | null;
-            };
-            Update: {
-                created_at?: string | null;
-                description?: string | null;
-                id?: string;
-                name?: string;
-                organization_id?: string;
-                resource_id?: string;
-                resource_type?: string;
-                updated_at?: string | null;
-            };
-            Relationships: [{
-                foreignKeyName: "calibration_projects_organization_id_fkey";
-                columns: ["organization_id"];
-                isOneToOne: false;
-                referencedRelation: "organizations";
-                referencedColumns: ["id"];
-            }];
-        };
-        calibration_runs: {
-            Row: {
-                completed_at: string | null;
-                config_variants: Json;
-                created_at: string | null;
-                description: string | null;
-                execution_mode: string;
-                grader_model: string | null;
-                grading_rubric: Json | null;
-                id: string;
-                name: string;
-                organization_id: string;
-                project_id: string;
-                results: Json;
-                status: string;
-                test_inputs: Json;
-            };
-            Insert: {
-                completed_at?: string | null;
-                config_variants: Json;
-                created_at?: string | null;
-                description?: string | null;
-                execution_mode?: string;
-                grader_model?: string | null;
-                grading_rubric?: Json | null;
-                id?: string;
-                name: string;
-                organization_id: string;
-                project_id: string;
-                results?: Json;
-                status?: string;
-                test_inputs: Json;
-            };
-            Update: {
-                completed_at?: string | null;
-                config_variants?: Json;
-                created_at?: string | null;
-                description?: string | null;
-                execution_mode?: string;
-                grader_model?: string | null;
-                grading_rubric?: Json | null;
-                id?: string;
-                name?: string;
-                organization_id?: string;
-                project_id?: string;
-                results?: Json;
-                status?: string;
-                test_inputs?: Json;
-            };
-            Relationships: [{
-                foreignKeyName: "calibration_runs_organization_id_fkey";
-                columns: ["organization_id"];
-                isOneToOne: false;
-                referencedRelation: "organizations";
-                referencedColumns: ["id"];
-            }, {
-                foreignKeyName: "calibration_runs_project_id_fkey";
-                columns: ["project_id"];
-                isOneToOne: false;
-                referencedRelation: "calibration_projects";
-                referencedColumns: ["id"];
-            }];
-        };
         command_queue: {
             Row: {
                 action_payload: Json | null;

package/dist/theme/index.d.ts

@@ -100,7 +100,7 @@ interface ThemePreset {
      */
     loader?: ReactNode;
 }
-type PresetName = 'default' | 'tactical' | 'regal' | 'cyber-volt' | 'aurora' | 'rose-gold' | 'midnight' | 'ember' | 'canopy' | 'slate' | 'cyber-strike' | 'cyber-chrome' | 'cyber-void' | 'nirvana' | 'wave' | 'synapse' | 'cortex' | 'helios' | 'graphite' | 'quarry';
+type PresetName = 'default' | 'tactical' | 'regal' | 'cyber-volt' | 'aurora' | 'rose-gold' | 'midnight' | 'titanium' | 'canopy' | 'slate' | 'cyber-strike' | 'cyber-chrome' | 'cyber-void' | 'nirvana' | 'wave' | 'synapse' | 'cortex' | 'helios' | 'graphite' | 'quarry';
 
 /** 10-shade color tuple (light → dark), compatible with Mantine's color format. */
 type ColorShadesTuple = [string, string, string, string, string, string, string, string, string, string];

package/dist/theme/index.js

@@ -1,3 +1,3 @@
-export { useAvailablePresets } from '../chunk-VNUOQQNY.js';
-export { PresetsProvider, TOKEN_VAR_MAP, componentThemes, createCssVariablesResolver, generateShades, getPreset, mantineThemeOverride, PRESETS as presets, usePresetsContext } from '../chunk-47YILFON.js';
-import '../chunk-CYXZHBP4.js';
+export { useAvailablePresets } from '../chunk-Z3OWD3A4.js';
+export { PresetsProvider, TOKEN_VAR_MAP, componentThemes, createCssVariablesResolver, generateShades, getPreset, mantineThemeOverride, PRESETS as presets, usePresetsContext } from '../chunk-OS5GFW2O.js';
+import '../chunk-F4TPY6YL.js';

package/dist/typeform/index.js

@@ -1213,7 +1213,7 @@ function TypeformArrayField({
         withBorder: true,
         padding: "md",
         style: {
-          backgroundColor: "rgba(32, 32, 35, 0.45)",
+          backgroundColor: "var(--color-surface)",
           borderColor: "rgba(255, 255, 255, 0.12)",
           borderRadius: 12
         },
@@ -1240,11 +1240,11 @@ function TypeformArrayField({
             {
               p: "sm",
               style: {
-                backgroundColor: "rgba(255, 255, 255, 0.03)",
+                backgroundColor: "var(--glass-background)",
                 borderRadius: 8
               },
               children: summaryLines.length > 0 ? /* @__PURE__ */ jsxs(Stack, { gap: 4, children: [
-                summaryLines[0] && /* @__PURE__ */ jsx(Text, { size: "sm", style: { color: "#fff" }, children: summaryLines[0].value }),
+                summaryLines[0] && /* @__PURE__ */ jsx(Text, { size: "sm", style: { color: "var(--color-text)" }, children: summaryLines[0].value }),
                 summaryLines.length > 1 && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: summaryLines.slice(1).map((line) => line.value).join(" \xB7 ") })
               ] }) : /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", fs: "italic", children: "No data" })
             }
@@ -1261,7 +1261,7 @@ function TypeformArrayField({
         withBorder: true,
         padding: "md",
         style: {
-          backgroundColor: "rgba(32, 32, 35, 0.45)",
+          backgroundColor: "var(--color-surface)",
           borderColor: "rgba(0, 153, 255, 0.3)",
           borderRadius: 12
         },
@@ -1336,7 +1336,7 @@ function TypeformSurvey({ config, className, styles, hideProgress }) {
               component: "span",
               fw: 700,
               style: {
-                color: "#fff"
+                color: "var(--color-text)"
               },
               children: part.slice(2, -2)
             },
@@ -1360,7 +1360,7 @@ function TypeformSurvey({ config, className, styles, hideProgress }) {
           {
             p: "lg",
             style: {
-              backgroundColor: "rgba(32, 32, 35, 0.45)",
+              backgroundColor: "var(--color-surface)",
               border: "1px solid rgba(255, 255, 255, 0.07)",
               borderRadius: 12,
               backdropFilter: "blur(24px)",
@@ -1391,7 +1391,7 @@ function TypeformSurvey({ config, className, styles, hideProgress }) {
           {
             p: "lg",
             style: {
-              backgroundColor: "rgba(32, 32, 35, 0.45)",
+              backgroundColor: "var(--color-surface)",
               border: "1px solid rgba(255, 255, 255, 0.07)",
               borderRadius: 12,
               backdropFilter: "blur(24px)",
@@ -1407,7 +1407,7 @@ function TypeformSurvey({ config, className, styles, hideProgress }) {
           {
             p: "md",
             style: {
-              backgroundColor: "rgba(249, 115, 22, 0.1)",
+              backgroundColor: "color-mix(in srgb, var(--color-warning) 10%, transparent)",
               border: "1px solid rgba(249, 115, 22, 0.2)",
               borderRadius: 12
             },
@@ -1422,13 +1422,13 @@ function TypeformSurvey({ config, className, styles, hideProgress }) {
                   children: "Note"
                 }
               ),
-              /* @__PURE__ */ jsx(Text, { size: "sm", style: { lineHeight: 1.6, color: "#fff" }, children: parseMarkdown(content) })
+              /* @__PURE__ */ jsx(Text, { size: "sm", style: { lineHeight: 1.6, color: "var(--color-text)" }, children: parseMarkdown(content) })
             ]
           },
           question.id
         );
       default:
-        return /* @__PURE__ */ jsx(Text, { style: { color: "#fff" }, children: parseMarkdown(content) }, question.id);
+        return /* @__PURE__ */ jsx(Text, { style: { color: "var(--color-text)" }, children: parseMarkdown(content) }, question.id);
     }
   };
   const renderField = (question) => {