.craft-mockup{--background: oklch(.98 .003 265);--background-elevated: color-mix(in srgb, var(--foreground) 1.5%, var(--background));--foreground: oklch(.185 .01 270);--foreground-dimmed: color-mix(in srgb, var(--foreground) 80%, var(--background));--foreground-rgb: 38, 36, 42;--user-message-bubble: oklch(from var(--foreground) l c h / .08);--accent: oklch(.62 .13 293);--accent-rgb: 104, 78, 133;--info: oklch(.75 .16 70);--info-rgb: 180, 120, 40;--success: oklch(.55 .17 145);--success-rgb: 34, 120, 60;--warning: oklch(.7 .17 95);--warning-rgb: 148, 118, 12;--destructive: oklch(.58 .24 28);--destructive-rgb: 180, 60, 50;--shadow-border-opacity: .08;--shadow-blur-opacity: .06;--shadow-minimal: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(var(--foreground-rgb), .06) 0px 0px 0px 1px, rgba(0, 0, 0, var(--shadow-blur-opacity)) 0px 1px 1px -.5px, rgba(0, 0, 0, var(--shadow-blur-opacity)) 0px 3px 3px -1.5px;--shadow-minimal-flat: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(var(--foreground-rgb), .06) 0px 0px 0px 1px;--shadow-modal-small: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(var(--foreground-rgb), .06) 0px 0px 0px 1px, rgba(0, 0, 0, calc(var(--shadow-blur-opacity) * .67)) 0px 1px 1px -.5px, rgba(0, 0, 0, calc(var(--shadow-blur-opacity) * .67)) 0px 3px 3px 0px, rgba(0, 0, 0, calc(var(--shadow-blur-opacity) * .33)) 0px 6px 6px 0px, rgba(0, 0, 0, calc(var(--shadow-blur-opacity) * .33)) 0px 12px 12px 0px, rgba(0, 0, 0, calc(var(--shadow-blur-opacity) * .33)) 0px 24px 24px 0px;--shadow-middle: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(var(--foreground-rgb), .06) 0px 0px 0px 1px, rgba(0, 0, 0, var(--shadow-blur-opacity)) 0px 1px 1px -.5px, rgba(0, 0, 0, var(--shadow-blur-opacity)) 0px 3px 3px -1.5px, rgba(0, 0, 0, var(--shadow-blur-opacity)) 0px 6px 6px -3px;--foreground-2: color-mix(in srgb, var(--foreground) 2%, var(--background));--foreground-3: color-mix(in srgb, var(--foreground) 3%, var(--background));--foreground-5: color-mix(in srgb, var(--foreground) 5%, var(--background));--foreground-10: color-mix(in srgb, var(--foreground) 10%, var(--background));--foreground-20: color-mix(in srgb, var(--foreground) 20%, var(--background));--foreground-30: color-mix(in srgb, var(--foreground) 30%, var(--background));--foreground-40: color-mix(in srgb, var(--foreground) 40%, var(--background));--foreground-50: color-mix(in srgb, var(--foreground) 50%, var(--background));--foreground-60: color-mix(in srgb, var(--foreground) 60%, var(--background));--foreground-70: color-mix(in srgb, var(--foreground) 70%, var(--background));--foreground-80: color-mix(in srgb, var(--foreground) 80%, var(--background));--foreground-90: color-mix(in srgb, var(--foreground) 90%, var(--background));--foreground-95: color-mix(in srgb, var(--foreground) 95%, var(--background));--success-text: color-mix(in oklab, var(--success) 50%, var(--foreground));--destructive-text: color-mix(in oklab, var(--destructive) 50%, var(--foreground));--info-text: color-mix(in oklab, var(--info) 50%, var(--foreground));--secondary: oklch(from var(--foreground) l c h / .05);--secondary-foreground: var(--foreground);--muted: oklch(from var(--foreground) l c h / .05);--muted-foreground: var(--foreground-50);--card: var(--background);--card-foreground: var(--foreground);--popover: var(--background);--popover-foreground: var(--foreground);--border: oklch(from var(--foreground) l c h / .05);--input: oklch(from var(--foreground) l c h / .1);--ring: oklch(from var(--foreground) l c h / .25);--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--font-size-base: 15px;font-family:var(--font-sans);font-size:var(--font-size-base);color:var(--foreground);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.craft-mockup.dark{--background: oklch(.2 .005 270);--background-elevated: color-mix(in srgb, var(--foreground) 1.5%, var(--background));--foreground: oklch(.92 .005 270);--foreground-dimmed: color-mix(in srgb, var(--foreground) 80%, var(--background));--foreground-rgb: 227, 226, 229;--user-message-bubble: oklch(from var(--foreground) l c h / .05);--accent: oklch(.68 .13 293);--accent-rgb: 118, 92, 147;--info: oklch(.7 .16 70);--info-rgb: 200, 140, 60;--success: oklch(.6 .17 145);--success-rgb: 50, 140, 80;--warning: oklch(.84 .16 95);--warning-rgb: 185, 150, 25;--destructive: oklch(.7 .19 22);--destructive-rgb: 200, 80, 70;--shadow-border-opacity: .15;--shadow-blur-opacity: .12;--foreground-2: color-mix(in srgb, var(--foreground) 2%, var(--background));--foreground-3: color-mix(in srgb, var(--foreground) 3%, var(--background));--foreground-5: color-mix(in srgb, var(--foreground) 5%, var(--background));--foreground-10: color-mix(in srgb, var(--foreground) 10%, var(--background));--foreground-20: color-mix(in srgb, var(--foreground) 20%, var(--background));--foreground-30: color-mix(in srgb, var(--foreground) 30%, var(--background));--foreground-40: color-mix(in srgb, var(--foreground) 40%, var(--background));--foreground-50: color-mix(in srgb, var(--foreground) 50%, var(--background));--foreground-60: color-mix(in srgb, var(--foreground) 60%, var(--background));--foreground-70: color-mix(in srgb, var(--foreground) 70%, var(--background));--foreground-80: color-mix(in srgb, var(--foreground) 80%, var(--background));--foreground-90: color-mix(in srgb, var(--foreground) 90%, var(--background));--foreground-95: color-mix(in srgb, var(--foreground) 95%, var(--background));--success-text: color-mix(in oklab, var(--success) 50%, var(--foreground));--destructive-text: color-mix(in oklab, var(--destructive) 50%, var(--foreground));--info-text: color-mix(in oklab, var(--info) 50%, var(--foreground));--secondary: oklch(from var(--foreground) l c h / .05);--muted: oklch(from var(--foreground) l c h / .05);--muted-foreground: var(--foreground-50);--border: oklch(from var(--foreground) l c h / .05);--input: oklch(from var(--foreground) l c h / .1);--ring: oklch(from var(--foreground) l c h / .25)}.craft-mockup .shadow-minimal{box-shadow:var(--shadow-minimal)}.craft-mockup .shadow-minimal-flat{box-shadow:var(--shadow-minimal-flat)}.craft-mockup .shadow-modal-small{box-shadow:var(--shadow-modal-small)}.craft-mockup .shadow-middle{box-shadow:var(--shadow-middle)}@theme inline{ --color-background: var(--background); --color-foreground: var(--foreground); --color-accent: var(--accent); --color-info: var(--info); --color-success: var(--success); --color-warning: var(--warning); --color-destructive: var(--destructive); --color-foreground-2: var(--foreground-2); --color-foreground-3: var(--foreground-3); --color-foreground-5: var(--foreground-5); --color-foreground-10: var(--foreground-10); --color-foreground-20: var(--foreground-20); --color-foreground-30: var(--foreground-30); --color-foreground-40: var(--foreground-40); --color-foreground-50: var(--foreground-50); --color-foreground-60: var(--foreground-60); --color-foreground-70: var(--foreground-70); --color-foreground-80: var(--foreground-80); --color-foreground-90: var(--foreground-90); --color-foreground-95: var(--foreground-95); --color-sidebar-hover: oklch(from var(--foreground) l c h / .02); --color-user-message-bubble: var(--user-message-bubble); --color-card: var(--background); --color-card-foreground: var(--foreground); --color-popover: var(--background); --color-popover-foreground: var(--foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-destructive-foreground: var(--background); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --font-sans: var(--font-sans); --font-mono: var(--font-mono); }