/** Theme-agnostic tokens: brand, ink, type, space, radius, elevation, motion. */ export declare const designBaseCSS = "\n /* ---- Brand \u00B7 the Lit flame ---- */\n --lit-devtools-lit-blue: #324fff;\n --lit-devtools-lit-blue-bright: #4d63ff;\n --lit-devtools-lit-indigo: #2a2c9d;\n --lit-devtools-lit-dark-blue: #283198;\n --lit-devtools-lit-cyan: #00ffff;\n --lit-devtools-lit-cyan-soft: #91ffff;\n --lit-devtools-lit-dark-cyan: #00e8ff;\n\n /* Lit blue as an 11-step ramp, 50 = --lit-devtools-lit-blue, hue held at 268. */\n --lit-devtools-lit-blue-95: oklch(0.96 0.02 268);\n --lit-devtools-lit-blue-90: oklch(0.92 0.045 268);\n --lit-devtools-lit-blue-80: oklch(0.84 0.09 268);\n --lit-devtools-lit-blue-70: oklch(0.74 0.15 268);\n --lit-devtools-lit-blue-60: oklch(0.64 0.21 268);\n --lit-devtools-lit-blue-50: var(--lit-devtools-lit-blue);\n --lit-devtools-lit-blue-40: oklch(0.44 0.23 268);\n --lit-devtools-lit-blue-30: oklch(0.36 0.19 268);\n --lit-devtools-lit-blue-20: oklch(0.28 0.13 268);\n --lit-devtools-lit-blue-10: oklch(0.2 0.08 268);\n --lit-devtools-lit-blue-05: oklch(0.15 0.05 268);\n\n /* ---- Neutral ink scale (0 = near-black, 13 = white) ---- */\n --lit-devtools-ink-0: hsl(0 0% 1%);\n --lit-devtools-ink-1: hsl(0 0% 5%);\n --lit-devtools-ink-2: hsl(0 0% 7%);\n --lit-devtools-ink-3: hsl(0 0% 11%);\n --lit-devtools-ink-4: hsl(0 0% 13%);\n --lit-devtools-ink-5: hsl(0 0% 16%);\n --lit-devtools-ink-6: hsl(0 0% 21%);\n --lit-devtools-ink-7: hsl(0 0% 28%);\n --lit-devtools-ink-8: hsl(0 0% 38%);\n --lit-devtools-ink-9: hsl(0 0% 57%);\n --lit-devtools-ink-10: hsl(0 0% 63%);\n --lit-devtools-ink-11: hsl(0 0% 78%);\n --lit-devtools-ink-12: hsl(0 0% 89%);\n --lit-devtools-ink-13: hsl(0 0% 100%);\n\n /* ---- Typography ---- */\n --lit-devtools-font-sans:\n ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;\n --lit-devtools-font-mono:\n 'Lilex Variable', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;\n\n --lit-devtools-weight-regular: 400;\n --lit-devtools-weight-medium: 500;\n --lit-devtools-weight-semibold: 600;\n --lit-devtools-weight-bold: 700;\n --lit-devtools-weight-extrabold: 800;\n\n --lit-devtools-text-2xs: 11px;\n --lit-devtools-text-xs: 12px;\n --lit-devtools-text-sm: 13px;\n --lit-devtools-text-md: 14px;\n --lit-devtools-text-base: 16px;\n --lit-devtools-text-lg: 18px;\n --lit-devtools-text-xl: 22px;\n --lit-devtools-text-2xl: 28px;\n --lit-devtools-text-3xl: 36px;\n --lit-devtools-text-4xl: 48px;\n --lit-devtools-text-5xl: 64px;\n\n --lit-devtools-leading-tight: 1.15;\n --lit-devtools-leading-snug: 1.3;\n --lit-devtools-leading-normal: 1.5;\n --lit-devtools-leading-relaxed: 1.65;\n\n --lit-devtools-tracking-tight: -0.02em;\n --lit-devtools-tracking-snug: -0.01em;\n --lit-devtools-tracking-normal: 0;\n --lit-devtools-tracking-wide: 0.02em;\n --lit-devtools-tracking-caps: 0.06em;\n\n /* ---- Spacing (4px base, fine-grained for dense tooling) ---- */\n --lit-devtools-space-0: 0;\n --lit-devtools-space-1: 2px;\n --lit-devtools-space-2: 4px;\n --lit-devtools-space-3: 6px;\n --lit-devtools-space-4: 8px;\n --lit-devtools-space-5: 12px;\n --lit-devtools-space-6: 16px;\n --lit-devtools-space-7: 20px;\n --lit-devtools-space-8: 24px;\n --lit-devtools-space-9: 32px;\n --lit-devtools-space-10: 40px;\n --lit-devtools-space-11: 48px;\n --lit-devtools-space-12: 64px;\n --lit-devtools-space-14: 80px;\n --lit-devtools-space-16: 96px;\n\n /* ---- Density ---- */\n /* Tree and list rows: WCAG 2.5.8's 24px minimum target, since a row is\n what gets clicked. */\n --lit-devtools-row-height: 24px;\n\n /* ---- Radius \u00B7 square corners; pills are the one round shape ---- */\n --lit-devtools-radius-xs: 0;\n --lit-devtools-radius-sm: 0;\n --lit-devtools-radius-md: 0; /* default control / card */\n --lit-devtools-radius-lg: 0; /* panels, active nav pill */\n --lit-devtools-radius-xl: 0;\n --lit-devtools-radius-2xl: 0; /* DevTools window shell */\n --lit-devtools-radius-pill: 9999px; /* the one round shape: pills and dots */\n\n --lit-devtools-border-width: 1px;\n --lit-devtools-border-width-thick: 2px;\n\n /* ---- Elevation (tuned for dark) ---- */\n --lit-devtools-shadow-xs: 0 1px 2px hsl(0 0% 0% / 0.3);\n --lit-devtools-shadow-sm: 0 1px 5px hsl(0 0% 0% / 0.35);\n --lit-devtools-shadow-md: 0 4px 14px hsl(0 0% 0% / 0.4);\n --lit-devtools-shadow-lg: 0 12px 32px hsl(0 0% 0% / 0.5);\n --lit-devtools-shadow-xl: 0 24px 64px hsl(0 0% 0% / 0.55);\n --lit-devtools-shadow-window:\n 0 24px 80px hsl(0 0% 0% / 0.6), 0 0 0 1px hsl(0 0% 100% / 0.06);\n --lit-devtools-ring: 0 0 0 2px var(--lit-devtools-accent-ring);\n\n /* ---- Motion ---- */\n --lit-devtools-ease-standard: cubic-bezier(0.2, 0, 0, 1);\n --lit-devtools-ease-emphasized: cubic-bezier(0.3, 0, 0, 1);\n --lit-devtools-ease-out: cubic-bezier(0, 0, 0.2, 1);\n --lit-devtools-dur-instant: 80ms;\n --lit-devtools-dur-fast: 140ms;\n --lit-devtools-dur-normal: 220ms;\n --lit-devtools-dur-slow: 360ms;\n"; /** Semantic tokens for the dark scheme (the DevTools theme). */ export declare const designDarkCSS = "\n --lit-devtools-accent: var(--lit-devtools-lit-blue-bright);\n --lit-devtools-accent-hover: #6478ff;\n --lit-devtools-accent-pressed: #3d54f0;\n --lit-devtools-accent-soft: hsla(232 100% 65% / 0.16);\n --lit-devtools-accent-ring: hsla(232 100% 65% / 0.45);\n --lit-devtools-on-accent: #ffffff;\n --lit-devtools-accent-cyan: var(--lit-devtools-lit-dark-cyan);\n\n --lit-devtools-bg: var(--lit-devtools-ink-0);\n --lit-devtools-surface: var(--lit-devtools-ink-2);\n --lit-devtools-surface-low: var(--lit-devtools-ink-1);\n --lit-devtools-surface-container: var(--lit-devtools-ink-4);\n --lit-devtools-surface-container-high: var(--lit-devtools-ink-5);\n --lit-devtools-surface-elevated: var(--lit-devtools-ink-6);\n --lit-devtools-surface-hover: hsl(0 0% 100% / 0.04);\n --lit-devtools-surface-active: hsl(0 0% 100% / 0.07);\n\n --lit-devtools-text: var(--lit-devtools-ink-12);\n --lit-devtools-text-strong: var(--lit-devtools-ink-13);\n /* ink-10 / ink-8 in the design system; one step lighter for 4.5:1. */\n --lit-devtools-text-secondary: var(--lit-devtools-ink-11);\n --lit-devtools-text-muted: var(--lit-devtools-ink-9);\n /* Lighter than the brand blue (4.2:1 on ink-1): 6.5:1, so links read as text. */\n --lit-devtools-text-link: oklch(0.72 0.15 268);\n\n --lit-devtools-border: var(--lit-devtools-ink-6);\n --lit-devtools-border-strong: var(--lit-devtools-ink-7);\n --lit-devtools-border-subtle: hsl(0 0% 100% / 0.06);\n\n --lit-devtools-success: hsl(158 74% 53%);\n --lit-devtools-success-soft: hsl(158 74% 53% / 0.15);\n --lit-devtools-warning: #f4bf4f;\n --lit-devtools-warning-soft: hsl(43 88% 63% / 0.15);\n --lit-devtools-error: #ff6b6b;\n --lit-devtools-error-soft: hsl(0 100% 71% / 0.15);\n --lit-devtools-info: var(--lit-devtools-lit-dark-cyan);\n --lit-devtools-info-soft: hsl(187 100% 47% / 0.15);\n\n --lit-devtools-selection-bg: var(--lit-devtools-accent);\n --lit-devtools-on-selection: #ffffff;\n\n /* Code / value syntax: Material-ish, on dark. */\n --lit-devtools-code-default: #eeffff;\n --lit-devtools-code-keyword: #c792ea;\n --lit-devtools-code-string: #c3e88d;\n --lit-devtools-code-number: #f78c6c;\n --lit-devtools-code-property: #b2ccd6;\n /* Teal, not Material's #89ddff: that sat by --lit-devtools-code-callee's blue, and a\n state row's element ref and function read as one colour. */\n --lit-devtools-code-tag: #7fdbca;\n /* #616161 in the design system: 3:1 on ink-2, too faint for a null. */\n --lit-devtools-code-comment: #8a8a8a;\n --lit-devtools-code-callee: #82aaff;\n"; /** Semantic tokens for the light scheme (the lit.dev website theme). */ export declare const designLightCSS = "\n --lit-devtools-accent: var(--lit-devtools-lit-blue);\n --lit-devtools-accent-hover: #1f3bff;\n --lit-devtools-accent-pressed: #2a2c9d;\n --lit-devtools-accent-soft: hsla(232 100% 60% / 0.12);\n --lit-devtools-accent-ring: hsla(232 100% 60% / 0.4);\n --lit-devtools-on-accent: #ffffff;\n --lit-devtools-accent-cyan: var(--lit-devtools-lit-dark-cyan);\n\n --lit-devtools-bg: #f4f4f4;\n --lit-devtools-surface: #ffffff;\n --lit-devtools-surface-low: #f3f3f3;\n --lit-devtools-surface-container: #ffffff;\n --lit-devtools-surface-container-high: #e8e8e8;\n --lit-devtools-surface-elevated: #ffffff;\n --lit-devtools-surface-hover: hsl(0 0% 0% / 0.04);\n --lit-devtools-surface-active: hsl(0 0% 0% / 0.07);\n\n --lit-devtools-text: #242424;\n --lit-devtools-text-strong: #000000;\n /* #6e6e6e / #949494 in the design system; darkened for 4.5:1 on white. */\n --lit-devtools-text-secondary: #595959;\n --lit-devtools-text-muted: #6f6f6f;\n --lit-devtools-text-link: #005dc7;\n\n --lit-devtools-border: #e2e2e2;\n --lit-devtools-border-strong: #c6c6c6;\n --lit-devtools-border-subtle: hsl(0 0% 0% / 0.07);\n\n --lit-devtools-success: #00865b;\n --lit-devtools-success-soft: hsl(158 100% 26% / 0.1);\n --lit-devtools-warning: #b26a00;\n --lit-devtools-warning-soft: hsl(40 100% 35% / 0.1);\n --lit-devtools-error: #ba1a1a;\n --lit-devtools-error-soft: hsl(0 75% 42% / 0.1);\n --lit-devtools-info: #005dc7;\n --lit-devtools-info-soft: hsl(210 100% 39% / 0.1);\n\n --lit-devtools-selection-bg: var(--lit-devtools-accent);\n --lit-devtools-on-selection: #ffffff;\n\n /* Code / value syntax: the dark hues darkened to hold contrast on white\n (the design system's GitHub-like set for keyword through callee). */\n --lit-devtools-code-default: #24292e;\n --lit-devtools-code-keyword: #8839b5;\n --lit-devtools-code-string: #3c7a0b;\n --lit-devtools-code-number: #b8470f;\n --lit-devtools-code-property: #4a5d68;\n --lit-devtools-code-tag: #007366;\n --lit-devtools-code-comment: #6a737d;\n --lit-devtools-code-callee: #2b56c9;\n"; //# sourceMappingURL=design-tokens.d.ts.map