@duro-app/tokens 5.5.0 → 5.6.0

package/dist/index.js

@@ -10,7 +10,7 @@ const e = {
   md: 768,
   lg: 1024,
   xl: 1280
-}, t = {
+}, a = {
   bg: "var(--bg-xqkwqtp)",
   bgCard: "var(--bgCard-xj2l5r)",
   bgCardHover: "var(--bgCardHover-xlxk7vw)",
@@ -53,7 +53,7 @@ const e = {
   onContrastSurface: "var(--onContrastSurface-x1dm0pi1)",
   contrastBorder: "var(--contrastBorder-x1g9he7g)",
   __varGroupHash__: "xjvd03b"
-}, a = {
+}, t = {
   xs: "var(--xs-xxfyjsd)",
   sm: "var(--sm-xbh8y7f)",
   ms: "var(--ms-x13y09zs)",
@@ -172,10 +172,12 @@ const e = {
 }, s = {
   raised: "var(--raised-xnqqeg)",
   floating: "var(--floating-x1bmxuyp)",
+  floatingRaised: "var(--floatingRaised-x1eg1u0w)",
   overlay: "var(--overlay-x1pg5hea)",
   modal: "var(--modal-x10p0ok)",
   modalRaised: "var(--modalRaised-x1j0jssi)",
   popover: "var(--popover-x13dty8z)",
+  popoverRaised: "var(--popoverRaised-x1pp3rn0)",
   popupBackdrop: "var(--popupBackdrop-x17sujb4)",
   popup: "var(--popup-xgi3yzv)",
   toast: "var(--toast-xt0zgmc)",
@@ -393,7 +395,7 @@ export {
   x as borders,
   e as breakpoints,
   r as breakpointsPx,
-  t as colors,
+  a as colors,
   f as duration,
   d as easing,
   v as effects,
@@ -407,7 +409,7 @@ export {
   n as radii,
   h as shadows,
   o as sizes,
-  a as spacing,
+  t as spacing,
   p as typePresets,
   g as typeScale,
   c as typography

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/tokens/breakpoints.css.ts","../src/tokens/colors.css.ts","../src/tokens/spacing.css.ts","../src/tokens/sizes.css.ts","../src/tokens/borders.css.ts","../src/tokens/layers.css.ts","../src/tokens/effects.css.ts","../src/tokens/layout-spacing.css.ts","../src/tokens/typography.css.ts","../src/tokens/type-presets.css.ts","../src/tokens/shadows.css.ts","../src/tokens/motion.css.ts","../src/themes/light.css.ts","../src/themes/high-contrast.css.ts"],"sourcesContent":["import {css} from 'react-strict-dom'\n\n// Breakpoint scale — the widths at which responsive layouts change.\n//\n// These use `css.defineConsts` rather than `css.defineVars` because CSS media\n// and container queries cannot read custom properties: a query threshold has\n// to be a literal. `defineConsts` values are inlined into the query text at\n// build time by the StyleX babel plugin (that's their whole reason to exist),\n// so `@container (max-width: ${breakpoints.sm})` compiles to a real `640px`.\n//\n// For runtime JS comparisons (`containerWidth < breakpointsPx.sm`) use the\n// plain-number mirror below — defineConsts values are query strings, not\n// numbers. Keep the two in sync. Values follow the common Tailwind-aligned scale.\nexport const breakpoints = css.defineConsts({\n  /** Phones — dense tables card up below here. */\n  xs: '480px',\n  /** Large phone / small tablet. The default \"go to the mobile layout\" line. */\n  sm: '640px',\n  /** Tablet portrait. */\n  md: '768px',\n  /** Tablet landscape / small laptop. */\n  lg: '1024px',\n  /** Desktop. */\n  xl: '1280px',\n})\n\nexport const breakpointsPx = {\n  xs: 480,\n  sm: 640,\n  md: 768,\n  lg: 1024,\n  xl: 1280,\n} as const\n\nexport type Breakpoint = keyof typeof breakpointsPx\n","import {css} from 'react-strict-dom'\n\nexport const colors = css.defineVars({\n  // Backgrounds\n  bg: '#0f0f0f',\n  bgCard: '#1a1a1a',\n  bgCardHover: '#242424',\n\n  // Text\n  text: '#e5e5e5',\n  textMuted: '#b0b0b0',\n\n  // Accent\n  accent: '#6aaffc',\n  accentHover: '#93c5fd',\n  accentContrast: '#000000',\n\n  // Border\n  border: '#333333',\n\n  // Semantic — Error\n  error: '#f87171',\n  errorHover: '#fca5a5',\n  errorBg: 'rgba(248, 113, 113, 0.1)',\n  errorBorder: 'rgba(248, 113, 113, 0.3)',\n  errorText: '#fca5a5',\n  errorContrast: '#000000',\n\n  // Semantic — Success\n  success: '#22c55e',\n  successBg: 'rgba(34, 197, 94, 0.1)',\n  successBorder: 'rgba(34, 197, 94, 0.3)',\n  successText: '#86efac',\n\n  // Semantic — Warning\n  warning: '#fbbf24',\n  warningBg: 'rgba(251, 191, 36, 0.1)',\n  warningBorder: 'rgba(251, 191, 36, 0.3)',\n  warningText: '#fde68a',\n\n  // Semantic — Info (uses accent)\n  info: '#6aaffc',\n  infoBg: 'rgba(106, 175, 252, 0.1)',\n  infoBorder: 'rgba(106, 175, 252, 0.3)',\n  infoText: '#93c5fd',\n\n  // Highlight — a non-status accent (a category, an intent); no status meaning.\n  highlight: '#c084fc',\n  highlightBg: 'rgba(192, 132, 252, 0.1)',\n  highlightBorder: 'rgba(192, 132, 252, 0.3)',\n  highlightText: '#d8b4fe',\n\n  // Fixed overlays — the same in every theme (a scrim darkens whatever is\n  // under it; the inverse overlays sit on an accent surface).\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  // A light that does not follow the theme (the Switch knob).\n  fixedLight: '#ffffff',\n  // A fixed translucent white over content (the light counterpart of scrim).\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  // The opposite tone of the theme: a surface that stands out from the page\n  // (toasts, coach marks), with its own text colour. Not the fixed inverse*\n  // overlays above, which sit on an accent fill.\n  contrastSurface: '#f5f5f5',\n  onContrastSurface: '#1a1a1a',\n  // A border on contrastSurface, at least 3:1 against it (non-text).\n  contrastBorder: 'rgba(0, 0, 0, 0.42)',\n})\n","import {css} from 'react-strict-dom'\n\nexport const spacing = css.defineVars({\n  xs: '4px',\n  sm: '8px',\n  ms: '12px',\n  md: '16px',\n  lg: '24px',\n  xl: '32px',\n  xxl: '48px',\n  xxxl: '64px',\n})\n\n// Optical micro-steps below and between the spacing scale: a 1-6px nudge that\n// aligns a glyph or tightens a dense control. Not a layout choice, so not part\n// of SpacingToken (no `gap=\"px2\"`); prefer the scale.\nexport const microSpacing = css.defineVars({\n  px1: '1px',\n  px2: '2px',\n  px3: '3px',\n  px5: '5px',\n  px6: '6px',\n})\n\nexport const radii = css.defineVars({\n  xs: '4px',\n  px6: '6px',\n  sm: '8px',\n  md: '12px',\n  lg: '16px',\n  full: '9999px',\n})\n","import {css} from 'react-strict-dom'\n\nexport const sizes = css.defineVars({\n  touchTarget: '44px',\n  controlSm: '28px',\n  controlMd: '39px',\n  controlLg: '40px',\n  indicator: '18px',\n  indicatorDot: '8px',\n  checkMarkW: '5px',\n  checkMarkH: '9px',\n  switchTrackW: '36px',\n  switchTrackH: '20px',\n  switchThumb: '16px',\n  iconButton: '32px',\n  iconButtonSm: '28px',\n  spinnerSm: '16px',\n  spinnerMd: '24px',\n  spinnerLg: '40px',\n  glyphXs: '10px',\n  glyphSm: '12px',\n  glyphMd: '16px',\n  iconSm: '16px',\n  iconMd: '18px',\n  iconLg: '24px',\n  iconXl: '36px',\n  iconXxl: '48px',\n  navMarkerW: '3px',\n  navMarkerH: '18px',\n  divider: '1px',\n  tabIndicator: '2px',\n  edgeFade: '32px',\n  scrollbar: '8px',\n  swatchW: '44px',\n  swatchH: '34px',\n  labelMinW: '120px',\n  popupMinW: '160px',\n  listMaxH: '280px',\n  listMaxHSm: '200px',\n  dialogSm: '400px',\n  dialogMd: '520px',\n  dialogLg: '680px',\n  panelSm: '360px',\n  panelMd: '480px',\n  panelLg: '640px',\n  toastMaxW: '440px',\n  gridColSm: '240px',\n  gridColMd: '280px',\n  pageSm: '600px',\n  pageMd: '800px',\n  pageLg: '1200px',\n  sidebarW: '240px',\n  pageXs: '480px',\n  pageXl: '1440px',\n  asideW: '320px',\n  gridColXs: '200px',\n  fieldMinWSm: '80px',\n  fieldMinW: '160px',\n  popoverWSm: '240px',\n  popoverW: '320px',\n  popupMaxW: '280px',\n  meterH: '6px',\n  skeletonChipW: '96px',\n  dropZoneMinH: '128px',\n  canvasMinH: '480px',\n  editorMinH: '160px',\n  toolbarH: '36px',\n  embedW: '550px',\n  colorPickerW: '196px',\n  colorAreaH: '150px',\n  colorTrackH: '12px',\n  colorSwatch: '20px',\n  colorPreviewH: '22px',\n  handle: '16px',\n  chip: '24px',\n  placeholderMinH: '80px',\n  previewMaxH: '320px',\n  barH: '4px',\n  readoutW: '40px',\n  sliderW: '96px',\n  paletteMinW: '96px',\n  deviceBarW: '96px',\n  // Calendar grids: the time-label column and the day-header row.\n  timeGutterW: '64px',\n  dayHeaderH: '46px',\n})\n","import {css} from 'react-strict-dom'\n\nexport const borders = css.defineVars({\n  hairline: '1px',\n  strong: '2px',\n  accent: '3px',\n  focusRing: '2px',\n  focusOffset: '2px',\n  focusOffsetSm: '1px',\n})\n","import {css} from 'react-strict-dom'\nimport type {LayerToken} from '../keys'\n\n// The z-index scale. Values are unitless strings so `--duro-layer-*` exists\n// for plain CSS; React Native takes a number, so a native overlay reads the\n// numeric LAYERS map from `@duro-app/tokens/keys` instead.\n//\n// They only compete inside one stacking context. Dialog, Drawer, the popups\n// and the toast region all portal into the ThemeProvider mount (`portal`),\n// and this is the order they keep there.\n// StyleX types a var by its literal, so string values would type every layer\n// as a string, which `zIndex` (a number) refuses. Typing the literals as CSS\n// integers makes `zIndex: layers.popup` a number to TypeScript; the cast has\n// no runtime effect (StyleX and the drift check read straight through it).\ntype LayerValue = ReturnType<typeof css.types.integer<number>>\n\nexport const layers = css.defineVars({\n  // A focused or sticky part above its siblings (a joined group's focus ring,\n  // a scrollbar, a sticky table header).\n  raised: '1',\n  // Floating chrome over the page: Tooltip, ActionBar.\n  floating: '50',\n  // A modal's backdrop.\n  overlay: '1000',\n  // A modal's panel (Dialog, Drawer).\n  modal: '1001',\n  // Chrome that sits on a modal-level surface, above that surface's own\n  // parts: a sheet's toolbar over its bottom bar. Still below a Popover.\n  modalRaised: '1002',\n  // A Popover inside a Dialog or Drawer: above that modal, below the popups\n  // (a Select, a Menu) and the Select click-catcher opened from inside it.\n  // Outside a modal a Popover is `floating`, so a modal opened later covers it.\n  popover: '1040',\n  // A popup's click-catcher, under the popup itself.\n  popupBackdrop: '1049',\n  // Popups: Select, Listbox, Menu — above a modal or Popover they open from.\n  popup: '1050',\n  // The toast region: above popups and modals.\n  toast: '1060',\n  // The ThemeProvider portal mount that holds all of the above.\n  portal: '1100',\n} as unknown as Readonly<Record<LayerToken, LayerValue>>)\n","import {css} from 'react-strict-dom'\n\n// Visual effects. Not themed.\n//\n// overlayBlur: the blur behind a modal's backdrop (a command palette, a\n// lightbox). Apply it ONLY on the backdrop element itself: a backdropFilter\n// (or filter) on an ancestor becomes the containing block for every fixed\n// descendant, so a Dialog or Drawer opened inside it is positioned against\n// that ancestor instead of the viewport.\n//\n// surfaceBlur: a frosted surface over imagery (a pill or a chip on a photo).\n// The same warning holds: put it ONLY on that surface element itself, never on\n// a wrapper that holds a Dialog, a Drawer or any fixed descendant.\nexport const effects = css.defineVars({\n  overlayBlur: 'blur(2px)',\n  surfaceBlur: 'blur(6px)',\n})\n","import {css} from 'react-strict-dom'\n\nexport const layoutSpacing = css.defineVars({\n  // Vertical rhythm (stack gaps)\n  stackXs: '4px',\n  stackSm: '8px',\n  stackMd: '16px',\n  stackLg: '24px',\n  stackXl: '48px',\n\n  // Horizontal rhythm (inline gaps)\n  inlineXs: '4px',\n  inlineSm: '8px',\n  inlineMd: '16px',\n  inlineLg: '24px',\n\n  // Container insets\n  containerSm: '16px',\n  containerMd: '24px',\n  containerLg: '32px',\n})\n","import {css} from 'react-strict-dom'\n\nexport const typography = css.defineVars({\n  fontFamily:\n    '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif',\n  fontFamilyMono: '\"SF Mono\", \"Fira Code\", \"Fira Mono\", \"Roboto Mono\", \"Courier New\", monospace',\n  fontSizeXs: '0.75rem',\n  fontSizeSm: '0.875rem',\n  fontSizeMd: '1rem',\n  fontSizeLg: '1.125rem',\n  fontSizeXl: '1.25rem',\n  fontSizeHeading: '1.5rem',\n  fontWeightNormal: '400',\n  fontWeightMedium: '500',\n  fontWeightSemibold: '600',\n  fontWeightBold: '700',\n  lineHeight: '1.5',\n})\n\nexport const typeScale = css.defineVars({\n  // 9-step font size scale\n  fontSize1: '0.75rem', // 12px — captions, badges\n  fontSize2: '0.8125rem', // 13px — small UI\n  fontSize3: '0.875rem', // 14px — default UI (buttons, inputs)\n  fontSize4: '1rem', // 16px — body text\n  fontSize5: '1.125rem', // 18px — body-lg\n  fontSize6: '1.25rem', // 20px — subheading\n  fontSize7: '1.5rem', // 24px — heading-sm\n  fontSize8: '1.875rem', // 30px — heading-md\n  fontSize9: '2.25rem', // 36px — heading-lg\n\n  // Matched line-heights\n  lineHeight1: '1rem', // 16px\n  lineHeight2: '1.25rem', // 20px\n  lineHeight3: '1.25rem', // 20px\n  lineHeight4: '1.5rem', // 24px\n  lineHeight5: '1.5rem', // 24px\n  lineHeight6: '1.75rem', // 28px\n  lineHeight7: '2rem', // 32px\n  lineHeight8: '2.25rem', // 36px\n  lineHeight9: '2.75rem', // 44px\n\n  // Fluid display sizes\n  displaySm: 'clamp(2.25rem, 1.5rem + 2vw, 3rem)', // 36–48px\n  displayMd: 'clamp(2.75rem, 1.75rem + 2.5vw, 3.75rem)', // 44–60px\n  displayLg: 'clamp(3.5rem, 2rem + 3.5vw, 4.5rem)', // 56–72px\n\n  // Letter-spacing\n  letterSpacingTight: '-0.02em',\n  letterSpacingNormal: '0',\n  letterSpacingWide: '0.04em',\n})\n","import {css} from 'react-strict-dom'\nimport {typography, typeScale} from './typography.css'\n\nexport const typePresets = css.create({\n  // Body\n  bodySm: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize3,\n    lineHeight: typeScale.lineHeight3,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n  bodyMd: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize4,\n    lineHeight: typeScale.lineHeight4,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n  bodyLg: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize5,\n    lineHeight: typeScale.lineHeight5,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n\n  // UI\n  caption: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize1,\n    lineHeight: typeScale.lineHeight1,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingWide,\n  },\n  label: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize3,\n    lineHeight: typeScale.lineHeight3,\n    fontWeight: typography.fontWeightMedium,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n  code: {\n    fontFamily: typography.fontFamilyMono,\n    fontSize: typeScale.fontSize3,\n    lineHeight: typeScale.lineHeight3,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n  overline: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize1,\n    lineHeight: typeScale.lineHeight1,\n    fontWeight: typography.fontWeightSemibold,\n    letterSpacing: typeScale.letterSpacingWide,\n    textTransform: 'uppercase' as const,\n  },\n\n  // Heading\n  headingSm: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize6,\n    lineHeight: typeScale.lineHeight6,\n    fontWeight: typography.fontWeightSemibold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  headingMd: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize7,\n    lineHeight: typeScale.lineHeight7,\n    fontWeight: typography.fontWeightSemibold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  headingLg: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize8,\n    lineHeight: typeScale.lineHeight8,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  headingXl: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize9,\n    lineHeight: typeScale.lineHeight9,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n\n  // Display (fluid)\n  displaySm: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.displaySm,\n    lineHeight: 1.2,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  displayMd: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.displayMd,\n    lineHeight: 1.15,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  displayLg: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.displayLg,\n    lineHeight: 1.1,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n})\n","import {css} from 'react-strict-dom'\n\nexport const shadows = css.defineVars({\n  sm: '0 2px 4px rgba(0, 0, 0, 0.3)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.4)',\n  lg: '0 8px 24px rgba(0, 0, 0, 0.5)',\n  // DragDrop's drop-target rings: borders.hairline in colors.border on every\n  // zone that can receive, borders.strong in colors.accent on the one under the\n  // pointer. Literal per theme (StyleX needs inline literals); the drift check\n  // rebuilds each from the palette. Not focus: focus stays on outlines.\n  dropReady: 'inset 0 0 0 1px #333333',\n  dropOver: 'inset 0 0 0 2px #6aaffc',\n})\n","import {css} from 'react-strict-dom'\n\n/**\n * Motion timing tokens.\n *\n * Values are harvested from what the system already uses — nothing invented:\n * - durations: 150ms is the de-facto transition (Button, Card, and ~30 other\n *   spots), 200ms the common overlay enter (Drawer), 280ms the larger panel\n *   enter (DetailPanel). `instant` is for explicit no-motion.\n *   `quick` (List hover, sort indicator) and `brisk` (Toast enter) are the\n *   two other values components used; `minimal` is the 1ms reduced-motion\n *   duration that still fires animationend.\n * - easings: `standard` is the default `ease` used throughout; `easeOut` /\n *   `easeIn` are the \"Apple ease\" curves already defined for DetailPanel.\n *   `linear` is the Spinner's constant rotation.\n *\n * Reduced motion is handled globally (the `@media (prefers-reduced-motion)`\n * rule in the reset neutralizes timing) plus per-component transform guards, so\n * these stay as plain timing values.\n */\nexport const duration = css.defineVars({\n  instant: '0ms',\n  // Non-zero so animationend still fires under reduced motion.\n  minimal: '1ms',\n  quick: '120ms',\n  fast: '150ms',\n  brisk: '160ms',\n  base: '200ms',\n  slow: '280ms',\n})\n\nexport const easing = css.defineVars({\n  standard: 'ease',\n  linear: 'linear',\n  easeOut: 'cubic-bezier(0.32, 0.72, 0, 1)',\n  easeIn: 'cubic-bezier(0.72, 0, 0.68, 0.28)',\n})\n","import {css} from 'react-strict-dom'\nimport {colors} from '../tokens/colors.css'\nimport {shadows} from '../tokens/shadows.css'\n\nexport const lightTheme = css.createTheme(colors, {\n  bg: '#ffffff',\n  bgCard: '#f5f5f5',\n  bgCardHover: '#ebebeb',\n  text: '#1a1a1a',\n  textMuted: '#4a4a4a',\n  accent: '#1e40af',\n  accentHover: '#1a3799',\n  accentContrast: '#ffffff',\n  border: '#d4d4d4',\n  error: '#991b1b',\n  errorHover: '#7f1d1d',\n  errorBg: 'rgba(153, 27, 27, 0.08)',\n  errorBorder: 'rgba(153, 27, 27, 0.3)',\n  errorText: '#7f1d1d',\n  errorContrast: '#ffffff',\n  success: '#166534',\n  successBg: 'rgba(22, 101, 52, 0.08)',\n  successBorder: 'rgba(22, 101, 52, 0.3)',\n  successText: '#14532d',\n  warning: '#92400e',\n  warningBg: 'rgba(146, 64, 14, 0.08)',\n  warningBorder: 'rgba(146, 64, 14, 0.3)',\n  warningText: '#78350f',\n  info: '#1e40af',\n  infoBg: 'rgba(30, 64, 175, 0.08)',\n  infoBorder: 'rgba(30, 64, 175, 0.3)',\n  infoText: '#1e40af',\n\n  // Highlight — a non-status accent (a category, an intent); no status meaning.\n  highlight: '#6b21a8',\n  highlightBg: 'rgba(107, 33, 168, 0.08)',\n  highlightBorder: 'rgba(107, 33, 168, 0.3)',\n  highlightText: '#581c87',\n  // Fixed overlays — the same in every theme (a scrim darkens whatever is\n  // under it; the inverse overlays sit on an accent surface).\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  // A light that does not follow the theme (the Switch knob).\n  fixedLight: '#ffffff',\n  // A fixed translucent white over content (the light counterpart of scrim).\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  // The opposite tone of the theme: a surface that stands out from the page\n  // (toasts, coach marks), with its own text colour. Not the fixed inverse*\n  // overlays above, which sit on an accent fill.\n  contrastSurface: '#1a1a1a',\n  onContrastSurface: '#e5e5e5',\n  // A border on contrastSurface, at least 3:1 against it (non-text).\n  contrastBorder: 'rgba(255, 255, 255, 0.33)',\n})\n\nexport const lightShadows = css.createTheme(shadows, {\n  sm: '0 2px 4px rgba(0, 0, 0, 0.08)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.12)',\n  lg: '0 8px 24px rgba(0, 0, 0, 0.16)',\n  dropReady: 'inset 0 0 0 1px #d4d4d4',\n  dropOver: 'inset 0 0 0 2px #1e40af',\n})\n","import {css} from 'react-strict-dom'\nimport {colors} from '../tokens/colors.css'\nimport {shadows} from '../tokens/shadows.css'\n\nexport const highContrastTheme = css.createTheme(colors, {\n  bg: '#000000',\n  bgCard: '#111111',\n  bgCardHover: '#1a1a1a',\n  text: '#ffffff',\n  textMuted: '#b0b0b0',\n  accent: '#60a5fa',\n  accentHover: '#93c5fd',\n  accentContrast: '#000000',\n  border: '#555555',\n  error: '#f87171',\n  errorHover: '#fca5a5',\n  errorBg: 'rgba(248, 113, 113, 0.15)',\n  errorBorder: 'rgba(248, 113, 113, 0.5)',\n  errorText: '#fca5a5',\n  errorContrast: '#000000',\n  success: '#4ade80',\n  successBg: 'rgba(74, 222, 128, 0.15)',\n  successBorder: 'rgba(74, 222, 128, 0.5)',\n  successText: '#86efac',\n  warning: '#fcd34d',\n  warningBg: 'rgba(252, 211, 77, 0.15)',\n  warningBorder: 'rgba(252, 211, 77, 0.5)',\n  warningText: '#fef08a',\n  info: '#60a5fa',\n  infoBg: 'rgba(96, 165, 250, 0.15)',\n  infoBorder: 'rgba(96, 165, 250, 0.5)',\n  infoText: '#bfdbfe',\n\n  // Highlight — a non-status accent (a category, an intent); no status meaning.\n  highlight: '#d8b4fe',\n  highlightBg: 'rgba(216, 180, 254, 0.15)',\n  highlightBorder: 'rgba(216, 180, 254, 0.5)',\n  highlightText: '#e9d5ff',\n  // Fixed overlays — the same in every theme (a scrim darkens whatever is\n  // under it; the inverse overlays sit on an accent surface).\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  // A light that does not follow the theme (the Switch knob).\n  fixedLight: '#ffffff',\n  // A fixed translucent white over content (the light counterpart of scrim).\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  // The opposite tone of the theme: a surface that stands out from the page\n  // (toasts, coach marks), with its own text colour. Not the fixed inverse*\n  // overlays above, which sit on an accent fill.\n  contrastSurface: '#ffffff',\n  onContrastSurface: '#000000',\n  // A border on contrastSurface, at least 3:1 against it (non-text).\n  contrastBorder: 'rgba(0, 0, 0, 0.42)',\n})\n\nexport const highContrastShadows = css.createTheme(shadows, {\n  sm: '0 2px 4px rgba(0, 0, 0, 0.6)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.7)',\n  lg: '0 8px 24px rgba(0, 0, 0, 0.8)',\n  dropReady: 'inset 0 0 0 1px #555555',\n  dropOver: 'inset 0 0 0 2px #60a5fa',\n})\n"],"names":["breakpoints","breakpointsPx","colors","spacing","microSpacing","radii","sizes","borders","layers","effects","layoutSpacing","typography","typeScale","typePresets","shadows","duration","easing","lightTheme","lightShadows","highContrastTheme","highContrastShadows"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/tokens/breakpoints.css.ts","../src/tokens/colors.css.ts","../src/tokens/spacing.css.ts","../src/tokens/sizes.css.ts","../src/tokens/borders.css.ts","../src/tokens/layers.css.ts","../src/tokens/effects.css.ts","../src/tokens/layout-spacing.css.ts","../src/tokens/typography.css.ts","../src/tokens/type-presets.css.ts","../src/tokens/shadows.css.ts","../src/tokens/motion.css.ts","../src/themes/light.css.ts","../src/themes/high-contrast.css.ts"],"sourcesContent":["import {css} from 'react-strict-dom'\n\n// Breakpoint scale — the widths at which responsive layouts change.\n//\n// These use `css.defineConsts` rather than `css.defineVars` because CSS media\n// and container queries cannot read custom properties: a query threshold has\n// to be a literal. `defineConsts` values are inlined into the query text at\n// build time by the StyleX babel plugin (that's their whole reason to exist),\n// so `@container (max-width: ${breakpoints.sm})` compiles to a real `640px`.\n//\n// For runtime JS comparisons (`containerWidth < breakpointsPx.sm`) use the\n// plain-number mirror below — defineConsts values are query strings, not\n// numbers. Keep the two in sync. Values follow the common Tailwind-aligned scale.\nexport const breakpoints = css.defineConsts({\n  /** Phones — dense tables card up below here. */\n  xs: '480px',\n  /** Large phone / small tablet. The default \"go to the mobile layout\" line. */\n  sm: '640px',\n  /** Tablet portrait. */\n  md: '768px',\n  /** Tablet landscape / small laptop. */\n  lg: '1024px',\n  /** Desktop. */\n  xl: '1280px',\n})\n\nexport const breakpointsPx = {\n  xs: 480,\n  sm: 640,\n  md: 768,\n  lg: 1024,\n  xl: 1280,\n} as const\n\nexport type Breakpoint = keyof typeof breakpointsPx\n","import {css} from 'react-strict-dom'\n\nexport const colors = css.defineVars({\n  // Backgrounds\n  bg: '#0f0f0f',\n  bgCard: '#1a1a1a',\n  bgCardHover: '#242424',\n\n  // Text\n  text: '#e5e5e5',\n  textMuted: '#b0b0b0',\n\n  // Accent\n  accent: '#6aaffc',\n  accentHover: '#93c5fd',\n  accentContrast: '#000000',\n\n  // Border\n  border: '#333333',\n\n  // Semantic — Error\n  error: '#f87171',\n  errorHover: '#fca5a5',\n  errorBg: 'rgba(248, 113, 113, 0.1)',\n  errorBorder: 'rgba(248, 113, 113, 0.3)',\n  errorText: '#fca5a5',\n  errorContrast: '#000000',\n\n  // Semantic — Success\n  success: '#22c55e',\n  successBg: 'rgba(34, 197, 94, 0.1)',\n  successBorder: 'rgba(34, 197, 94, 0.3)',\n  successText: '#86efac',\n\n  // Semantic — Warning\n  warning: '#fbbf24',\n  warningBg: 'rgba(251, 191, 36, 0.1)',\n  warningBorder: 'rgba(251, 191, 36, 0.3)',\n  warningText: '#fde68a',\n\n  // Semantic — Info (uses accent)\n  info: '#6aaffc',\n  infoBg: 'rgba(106, 175, 252, 0.1)',\n  infoBorder: 'rgba(106, 175, 252, 0.3)',\n  infoText: '#93c5fd',\n\n  // Highlight — a non-status accent (a category, an intent); no status meaning.\n  highlight: '#c084fc',\n  highlightBg: 'rgba(192, 132, 252, 0.1)',\n  highlightBorder: 'rgba(192, 132, 252, 0.3)',\n  highlightText: '#d8b4fe',\n\n  // Fixed overlays — the same in every theme (a scrim darkens whatever is\n  // under it; the inverse overlays sit on an accent surface).\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  // A light that does not follow the theme (the Switch knob).\n  fixedLight: '#ffffff',\n  // A fixed translucent white over content (the light counterpart of scrim).\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  // The opposite tone of the theme: a surface that stands out from the page\n  // (toasts, coach marks), with its own text colour. Not the fixed inverse*\n  // overlays above, which sit on an accent fill.\n  contrastSurface: '#f5f5f5',\n  onContrastSurface: '#1a1a1a',\n  // A border on contrastSurface, at least 3:1 against it (non-text).\n  contrastBorder: 'rgba(0, 0, 0, 0.42)',\n})\n","import {css} from 'react-strict-dom'\n\nexport const spacing = css.defineVars({\n  xs: '4px',\n  sm: '8px',\n  ms: '12px',\n  md: '16px',\n  lg: '24px',\n  xl: '32px',\n  xxl: '48px',\n  xxxl: '64px',\n})\n\n// Optical micro-steps below and between the spacing scale: a 1-6px nudge that\n// aligns a glyph or tightens a dense control. Not a layout choice, so not part\n// of SpacingToken (no `gap=\"px2\"`); prefer the scale.\nexport const microSpacing = css.defineVars({\n  px1: '1px',\n  px2: '2px',\n  px3: '3px',\n  px5: '5px',\n  px6: '6px',\n})\n\nexport const radii = css.defineVars({\n  xs: '4px',\n  px6: '6px',\n  sm: '8px',\n  md: '12px',\n  lg: '16px',\n  full: '9999px',\n})\n","import {css} from 'react-strict-dom'\n\nexport const sizes = css.defineVars({\n  touchTarget: '44px',\n  controlSm: '28px',\n  controlMd: '39px',\n  controlLg: '40px',\n  indicator: '18px',\n  indicatorDot: '8px',\n  checkMarkW: '5px',\n  checkMarkH: '9px',\n  switchTrackW: '36px',\n  switchTrackH: '20px',\n  switchThumb: '16px',\n  iconButton: '32px',\n  iconButtonSm: '28px',\n  spinnerSm: '16px',\n  spinnerMd: '24px',\n  spinnerLg: '40px',\n  glyphXs: '10px',\n  glyphSm: '12px',\n  glyphMd: '16px',\n  iconSm: '16px',\n  iconMd: '18px',\n  iconLg: '24px',\n  iconXl: '36px',\n  iconXxl: '48px',\n  navMarkerW: '3px',\n  navMarkerH: '18px',\n  divider: '1px',\n  tabIndicator: '2px',\n  edgeFade: '32px',\n  scrollbar: '8px',\n  swatchW: '44px',\n  swatchH: '34px',\n  labelMinW: '120px',\n  popupMinW: '160px',\n  listMaxH: '280px',\n  listMaxHSm: '200px',\n  dialogSm: '400px',\n  dialogMd: '520px',\n  dialogLg: '680px',\n  panelSm: '360px',\n  panelMd: '480px',\n  panelLg: '640px',\n  toastMaxW: '440px',\n  gridColSm: '240px',\n  gridColMd: '280px',\n  pageSm: '600px',\n  pageMd: '800px',\n  pageLg: '1200px',\n  sidebarW: '240px',\n  pageXs: '480px',\n  pageXl: '1440px',\n  asideW: '320px',\n  gridColXs: '200px',\n  fieldMinWSm: '80px',\n  fieldMinW: '160px',\n  popoverWSm: '240px',\n  popoverW: '320px',\n  popupMaxW: '280px',\n  meterH: '6px',\n  skeletonChipW: '96px',\n  dropZoneMinH: '128px',\n  canvasMinH: '480px',\n  editorMinH: '160px',\n  toolbarH: '36px',\n  embedW: '550px',\n  colorPickerW: '196px',\n  colorAreaH: '150px',\n  colorTrackH: '12px',\n  colorSwatch: '20px',\n  colorPreviewH: '22px',\n  handle: '16px',\n  chip: '24px',\n  placeholderMinH: '80px',\n  previewMaxH: '320px',\n  barH: '4px',\n  readoutW: '40px',\n  sliderW: '96px',\n  paletteMinW: '96px',\n  deviceBarW: '96px',\n  // Calendar grids: the time-label column and the day-header row.\n  timeGutterW: '64px',\n  dayHeaderH: '46px',\n})\n","import {css} from 'react-strict-dom'\n\nexport const borders = css.defineVars({\n  hairline: '1px',\n  strong: '2px',\n  accent: '3px',\n  focusRing: '2px',\n  focusOffset: '2px',\n  focusOffsetSm: '1px',\n})\n","import {css} from 'react-strict-dom'\nimport type {LayerToken} from '../keys'\n\n// The z-index scale. Values are unitless strings so `--duro-layer-*` exists\n// for plain CSS; React Native takes a number, so a native overlay reads the\n// numeric LAYERS map from `@duro-app/tokens/keys` instead.\n//\n// They only compete inside one stacking context. Dialog, Drawer, the popups\n// and the toast region all portal into the ThemeProvider mount (`portal`),\n// and this is the order they keep there.\n// StyleX types a var by its literal, so string values would type every layer\n// as a string, which `zIndex` (a number) refuses. Typing the literals as CSS\n// integers makes `zIndex: layers.popup` a number to TypeScript; the cast has\n// no runtime effect (StyleX and the drift check read straight through it).\ntype LayerValue = ReturnType<typeof css.types.integer<number>>\n\nexport const layers = css.defineVars({\n  // A focused or sticky part above its siblings (a joined group's focus ring,\n  // a scrollbar, a sticky table header).\n  raised: '1',\n  // Floating chrome over the page: Tooltip, ActionBar.\n  floating: '50',\n  // A floating surface that must cover another floating one, outside a modal:\n  // a link editor over a selection format bar. Pair it with `popoverRaised`\n  // and pick by `useInModal()` (a Popover does it with `raised`). It covers a\n  // sibling floating surface, never a modal.\n  floatingRaised: '60',\n  // A modal's backdrop.\n  overlay: '1000',\n  // A modal's panel (Dialog, Drawer).\n  modal: '1001',\n  // Chrome that sits on a modal-level surface, above that surface's own\n  // parts: a sheet's toolbar over its bottom bar. Still below a Popover.\n  modalRaised: '1002',\n  // A Popover inside a Dialog or Drawer: above that modal, below the popups\n  // (a Select, a Menu) and the Select click-catcher opened from inside it.\n  // Outside a modal a Popover is `floating`, so a modal opened later covers it.\n  popover: '1040',\n  // `floatingRaised` inside a Dialog or Drawer: over a Popover there, under\n  // a popup's click-catcher and the popup itself.\n  popoverRaised: '1041',\n  // A popup's click-catcher, under the popup itself.\n  popupBackdrop: '1049',\n  // Popups: Select, Listbox, Menu — above a modal or Popover they open from.\n  popup: '1050',\n  // The toast region: above popups and modals.\n  toast: '1060',\n  // The ThemeProvider portal mount that holds all of the above.\n  portal: '1100',\n} as unknown as Readonly<Record<LayerToken, LayerValue>>)\n","import {css} from 'react-strict-dom'\n\n// Visual effects. Not themed.\n//\n// overlayBlur: the blur behind a modal's backdrop (a command palette, a\n// lightbox). Apply it ONLY on the backdrop element itself: a backdropFilter\n// (or filter) on an ancestor becomes the containing block for every fixed\n// descendant, so a Dialog or Drawer opened inside it is positioned against\n// that ancestor instead of the viewport.\n//\n// surfaceBlur: a frosted surface over imagery (a pill or a chip on a photo).\n// The same warning holds: put it ONLY on that surface element itself, never on\n// a wrapper that holds a Dialog, a Drawer or any fixed descendant.\nexport const effects = css.defineVars({\n  overlayBlur: 'blur(2px)',\n  surfaceBlur: 'blur(6px)',\n})\n","import {css} from 'react-strict-dom'\n\nexport const layoutSpacing = css.defineVars({\n  // Vertical rhythm (stack gaps)\n  stackXs: '4px',\n  stackSm: '8px',\n  stackMd: '16px',\n  stackLg: '24px',\n  stackXl: '48px',\n\n  // Horizontal rhythm (inline gaps)\n  inlineXs: '4px',\n  inlineSm: '8px',\n  inlineMd: '16px',\n  inlineLg: '24px',\n\n  // Container insets\n  containerSm: '16px',\n  containerMd: '24px',\n  containerLg: '32px',\n})\n","import {css} from 'react-strict-dom'\n\nexport const typography = css.defineVars({\n  fontFamily:\n    '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif',\n  fontFamilyMono: '\"SF Mono\", \"Fira Code\", \"Fira Mono\", \"Roboto Mono\", \"Courier New\", monospace',\n  fontSizeXs: '0.75rem',\n  fontSizeSm: '0.875rem',\n  fontSizeMd: '1rem',\n  fontSizeLg: '1.125rem',\n  fontSizeXl: '1.25rem',\n  fontSizeHeading: '1.5rem',\n  fontWeightNormal: '400',\n  fontWeightMedium: '500',\n  fontWeightSemibold: '600',\n  fontWeightBold: '700',\n  lineHeight: '1.5',\n})\n\nexport const typeScale = css.defineVars({\n  // 9-step font size scale\n  fontSize1: '0.75rem', // 12px — captions, badges\n  fontSize2: '0.8125rem', // 13px — small UI\n  fontSize3: '0.875rem', // 14px — default UI (buttons, inputs)\n  fontSize4: '1rem', // 16px — body text\n  fontSize5: '1.125rem', // 18px — body-lg\n  fontSize6: '1.25rem', // 20px — subheading\n  fontSize7: '1.5rem', // 24px — heading-sm\n  fontSize8: '1.875rem', // 30px — heading-md\n  fontSize9: '2.25rem', // 36px — heading-lg\n\n  // Matched line-heights\n  lineHeight1: '1rem', // 16px\n  lineHeight2: '1.25rem', // 20px\n  lineHeight3: '1.25rem', // 20px\n  lineHeight4: '1.5rem', // 24px\n  lineHeight5: '1.5rem', // 24px\n  lineHeight6: '1.75rem', // 28px\n  lineHeight7: '2rem', // 32px\n  lineHeight8: '2.25rem', // 36px\n  lineHeight9: '2.75rem', // 44px\n\n  // Fluid display sizes\n  displaySm: 'clamp(2.25rem, 1.5rem + 2vw, 3rem)', // 36–48px\n  displayMd: 'clamp(2.75rem, 1.75rem + 2.5vw, 3.75rem)', // 44–60px\n  displayLg: 'clamp(3.5rem, 2rem + 3.5vw, 4.5rem)', // 56–72px\n\n  // Letter-spacing\n  letterSpacingTight: '-0.02em',\n  letterSpacingNormal: '0',\n  letterSpacingWide: '0.04em',\n})\n","import {css} from 'react-strict-dom'\nimport {typography, typeScale} from './typography.css'\n\nexport const typePresets = css.create({\n  // Body\n  bodySm: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize3,\n    lineHeight: typeScale.lineHeight3,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n  bodyMd: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize4,\n    lineHeight: typeScale.lineHeight4,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n  bodyLg: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize5,\n    lineHeight: typeScale.lineHeight5,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n\n  // UI\n  caption: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize1,\n    lineHeight: typeScale.lineHeight1,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingWide,\n  },\n  label: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize3,\n    lineHeight: typeScale.lineHeight3,\n    fontWeight: typography.fontWeightMedium,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n  code: {\n    fontFamily: typography.fontFamilyMono,\n    fontSize: typeScale.fontSize3,\n    lineHeight: typeScale.lineHeight3,\n    fontWeight: typography.fontWeightNormal,\n    letterSpacing: typeScale.letterSpacingNormal,\n  },\n  overline: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize1,\n    lineHeight: typeScale.lineHeight1,\n    fontWeight: typography.fontWeightSemibold,\n    letterSpacing: typeScale.letterSpacingWide,\n    textTransform: 'uppercase' as const,\n  },\n\n  // Heading\n  headingSm: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize6,\n    lineHeight: typeScale.lineHeight6,\n    fontWeight: typography.fontWeightSemibold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  headingMd: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize7,\n    lineHeight: typeScale.lineHeight7,\n    fontWeight: typography.fontWeightSemibold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  headingLg: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize8,\n    lineHeight: typeScale.lineHeight8,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  headingXl: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.fontSize9,\n    lineHeight: typeScale.lineHeight9,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n\n  // Display (fluid)\n  displaySm: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.displaySm,\n    lineHeight: 1.2,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  displayMd: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.displayMd,\n    lineHeight: 1.15,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n  displayLg: {\n    fontFamily: typography.fontFamily,\n    fontSize: typeScale.displayLg,\n    lineHeight: 1.1,\n    fontWeight: typography.fontWeightBold,\n    letterSpacing: typeScale.letterSpacingTight,\n  },\n})\n","import {css} from 'react-strict-dom'\n\nexport const shadows = css.defineVars({\n  sm: '0 2px 4px rgba(0, 0, 0, 0.3)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.4)',\n  lg: '0 8px 24px rgba(0, 0, 0, 0.5)',\n  // DragDrop's drop-target rings: borders.hairline in colors.border on every\n  // zone that can receive, borders.strong in colors.accent on the one under the\n  // pointer. Literal per theme (StyleX needs inline literals); the drift check\n  // rebuilds each from the palette. Not focus: focus stays on outlines.\n  dropReady: 'inset 0 0 0 1px #333333',\n  dropOver: 'inset 0 0 0 2px #6aaffc',\n})\n","import {css} from 'react-strict-dom'\n\n/**\n * Motion timing tokens.\n *\n * Values are harvested from what the system already uses — nothing invented:\n * - durations: 150ms is the de-facto transition (Button, Card, and ~30 other\n *   spots), 200ms the common overlay enter (Drawer), 280ms the larger panel\n *   enter (DetailPanel). `instant` is for explicit no-motion.\n *   `quick` (List hover, sort indicator) and `brisk` (Toast enter) are the\n *   two other values components used; `minimal` is the 1ms reduced-motion\n *   duration that still fires animationend.\n * - easings: `standard` is the default `ease` used throughout; `easeOut` /\n *   `easeIn` are the \"Apple ease\" curves already defined for DetailPanel.\n *   `linear` is the Spinner's constant rotation.\n *\n * Reduced motion is handled globally (the `@media (prefers-reduced-motion)`\n * rule in the reset neutralizes timing) plus per-component transform guards, so\n * these stay as plain timing values.\n */\nexport const duration = css.defineVars({\n  instant: '0ms',\n  // Non-zero so animationend still fires under reduced motion.\n  minimal: '1ms',\n  quick: '120ms',\n  fast: '150ms',\n  brisk: '160ms',\n  base: '200ms',\n  slow: '280ms',\n})\n\nexport const easing = css.defineVars({\n  standard: 'ease',\n  linear: 'linear',\n  easeOut: 'cubic-bezier(0.32, 0.72, 0, 1)',\n  easeIn: 'cubic-bezier(0.72, 0, 0.68, 0.28)',\n})\n","import {css} from 'react-strict-dom'\nimport {colors} from '../tokens/colors.css'\nimport {shadows} from '../tokens/shadows.css'\n\nexport const lightTheme = css.createTheme(colors, {\n  bg: '#ffffff',\n  bgCard: '#f5f5f5',\n  bgCardHover: '#ebebeb',\n  text: '#1a1a1a',\n  textMuted: '#4a4a4a',\n  accent: '#1e40af',\n  accentHover: '#1a3799',\n  accentContrast: '#ffffff',\n  border: '#d4d4d4',\n  error: '#991b1b',\n  errorHover: '#7f1d1d',\n  errorBg: 'rgba(153, 27, 27, 0.08)',\n  errorBorder: 'rgba(153, 27, 27, 0.3)',\n  errorText: '#7f1d1d',\n  errorContrast: '#ffffff',\n  success: '#166534',\n  successBg: 'rgba(22, 101, 52, 0.08)',\n  successBorder: 'rgba(22, 101, 52, 0.3)',\n  successText: '#14532d',\n  warning: '#92400e',\n  warningBg: 'rgba(146, 64, 14, 0.08)',\n  warningBorder: 'rgba(146, 64, 14, 0.3)',\n  warningText: '#78350f',\n  info: '#1e40af',\n  infoBg: 'rgba(30, 64, 175, 0.08)',\n  infoBorder: 'rgba(30, 64, 175, 0.3)',\n  infoText: '#1e40af',\n\n  // Highlight — a non-status accent (a category, an intent); no status meaning.\n  highlight: '#6b21a8',\n  highlightBg: 'rgba(107, 33, 168, 0.08)',\n  highlightBorder: 'rgba(107, 33, 168, 0.3)',\n  highlightText: '#581c87',\n  // Fixed overlays — the same in every theme (a scrim darkens whatever is\n  // under it; the inverse overlays sit on an accent surface).\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  // A light that does not follow the theme (the Switch knob).\n  fixedLight: '#ffffff',\n  // A fixed translucent white over content (the light counterpart of scrim).\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  // The opposite tone of the theme: a surface that stands out from the page\n  // (toasts, coach marks), with its own text colour. Not the fixed inverse*\n  // overlays above, which sit on an accent fill.\n  contrastSurface: '#1a1a1a',\n  onContrastSurface: '#e5e5e5',\n  // A border on contrastSurface, at least 3:1 against it (non-text).\n  contrastBorder: 'rgba(255, 255, 255, 0.33)',\n})\n\nexport const lightShadows = css.createTheme(shadows, {\n  sm: '0 2px 4px rgba(0, 0, 0, 0.08)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.12)',\n  lg: '0 8px 24px rgba(0, 0, 0, 0.16)',\n  dropReady: 'inset 0 0 0 1px #d4d4d4',\n  dropOver: 'inset 0 0 0 2px #1e40af',\n})\n","import {css} from 'react-strict-dom'\nimport {colors} from '../tokens/colors.css'\nimport {shadows} from '../tokens/shadows.css'\n\nexport const highContrastTheme = css.createTheme(colors, {\n  bg: '#000000',\n  bgCard: '#111111',\n  bgCardHover: '#1a1a1a',\n  text: '#ffffff',\n  textMuted: '#b0b0b0',\n  accent: '#60a5fa',\n  accentHover: '#93c5fd',\n  accentContrast: '#000000',\n  border: '#555555',\n  error: '#f87171',\n  errorHover: '#fca5a5',\n  errorBg: 'rgba(248, 113, 113, 0.15)',\n  errorBorder: 'rgba(248, 113, 113, 0.5)',\n  errorText: '#fca5a5',\n  errorContrast: '#000000',\n  success: '#4ade80',\n  successBg: 'rgba(74, 222, 128, 0.15)',\n  successBorder: 'rgba(74, 222, 128, 0.5)',\n  successText: '#86efac',\n  warning: '#fcd34d',\n  warningBg: 'rgba(252, 211, 77, 0.15)',\n  warningBorder: 'rgba(252, 211, 77, 0.5)',\n  warningText: '#fef08a',\n  info: '#60a5fa',\n  infoBg: 'rgba(96, 165, 250, 0.15)',\n  infoBorder: 'rgba(96, 165, 250, 0.5)',\n  infoText: '#bfdbfe',\n\n  // Highlight — a non-status accent (a category, an intent); no status meaning.\n  highlight: '#d8b4fe',\n  highlightBg: 'rgba(216, 180, 254, 0.15)',\n  highlightBorder: 'rgba(216, 180, 254, 0.5)',\n  highlightText: '#e9d5ff',\n  // Fixed overlays — the same in every theme (a scrim darkens whatever is\n  // under it; the inverse overlays sit on an accent surface).\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  // A light that does not follow the theme (the Switch knob).\n  fixedLight: '#ffffff',\n  // A fixed translucent white over content (the light counterpart of scrim).\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  // The opposite tone of the theme: a surface that stands out from the page\n  // (toasts, coach marks), with its own text colour. Not the fixed inverse*\n  // overlays above, which sit on an accent fill.\n  contrastSurface: '#ffffff',\n  onContrastSurface: '#000000',\n  // A border on contrastSurface, at least 3:1 against it (non-text).\n  contrastBorder: 'rgba(0, 0, 0, 0.42)',\n})\n\nexport const highContrastShadows = css.createTheme(shadows, {\n  sm: '0 2px 4px rgba(0, 0, 0, 0.6)',\n  md: '0 4px 12px rgba(0, 0, 0, 0.7)',\n  lg: '0 8px 24px rgba(0, 0, 0, 0.8)',\n  dropReady: 'inset 0 0 0 1px #555555',\n  dropOver: 'inset 0 0 0 2px #60a5fa',\n})\n"],"names":["breakpoints","breakpointsPx","colors","spacing","microSpacing","radii","sizes","borders","layers","effects","layoutSpacing","typography","typeScale","typePresets","shadows","duration","easing","lightTheme","lightShadows","highContrastTheme","highContrastShadows"],"mappings":"AAcO,MAAMA,IAAc;AAAA,EACzB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GACaC,IAAgB;AAAA,EAC3B,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GCzBaC,IAAS;AAAA,EACpB,IAAI;AAAA,EACJ,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,MAAM;AAAA,EACN,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,aAAa;AAAA,EACb,WAAW;AAAA,EACX,eAAe;AAAA,EACf,SAAS;AAAA,EACT,WAAW;AAAA,EACX,eAAe;AAAA,EACf,aAAa;AAAA,EACb,SAAS;AAAA,EACT,WAAW;AAAA,EACX,eAAe;AAAA,EACf,aAAa;AAAA,EACb,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,OAAO;AAAA,EACP,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,kBAAkB;AACpB,GC3CaC,IAAU;AAAA,EACrB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,MAAM;AAAA,EACN,kBAAkB;AACpB,GAKaC,IAAe;AAAA,EAC1B,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,kBAAkB;AACpB,GACaC,IAAQ;AAAA,EACnB,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,kBAAkB;AACpB,GC/BaC,IAAQ;AAAA,EACnB,aAAa;AAAA,EACb,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,cAAc;AAAA,EACd,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,cAAc;AAAA,EACd,UAAU;AAAA,EACV,WAAW;AAAA,EACX,SAAS;AAAA,EACT,SAAS;AAAA,EACT,WAAW;AAAA,EACX,WAAW;AAAA,EACX,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,aAAa;AAAA,EACb,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,aAAa;AAAA,EACb,eAAe;AAAA,EACf,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,MAAM;AAAA,EACN,UAAU;AAAA,EACV,SAAS;AAAA,EACT,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,kBAAkB;AACpB,GCnFaC,IAAU;AAAA,EACrB,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,aAAa;AAAA,EACb,eAAe;AAAA,EACf,kBAAkB;AACpB,GCMaC,IAAS;AAAA,EACpB,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,aAAa;AAAA,EACb,SAAS;AAAA,EACT,eAAe;AAAA,EACf,eAAe;AAAA,EACf,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,kBAAkB;AACpB,GChBaC,IAAU;AAAA,EACrB,aAAa;AAAA,EACb,aAAa;AAAA,EACb,kBAAkB;AACpB,GChBaC,IAAgB;AAAA,EAC3B,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,UAAU;AAAA,EACV,UAAU;AAAA,EACV,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,kBAAkB;AACpB,GCdaC,IAAa;AAAA,EACxB,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,kBAAkB;AACpB,GACaC,IAAY;AAAA,EACvB,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,aAAa;AAAA,EACb,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,oBAAoB;AAAA,EACpB,qBAAqB;AAAA,EACrB,mBAAmB;AAAA,EACnB,kBAAkB;AACpB,GCzCaC,IAAc;AAAA,EACzB,QAAQ;AAAA,IACN,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,QAAQ;AAAA,IACN,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,QAAQ;AAAA,IACN,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,SAAS;AAAA,IACP,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,OAAO;AAAA,IACL,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,MAAM;AAAA,IACJ,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,UAAU;AAAA,IACR,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,WAAW;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,WAAW;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,WAAW;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,WAAW;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,WAAW;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,WAAW;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAAA,EAET,WAAW;AAAA,IACT,qBAAqB;AAAA,IACrB,mBAAmB;AAAA,IACnB,qBAAqB;AAAA,IACrB,qBAAqB;AAAA,IACrB,wBAAwB;AAAA,IACxB,OAAO;AAAA,EAAA;AAEX,GCnHaC,IAAU;AAAA,EACrB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,WAAW;AAAA,EACX,UAAU;AAAA,EACV,kBAAkB;AACpB,GCYaC,IAAW;AAAA,EACtB,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AAAA,EACP,MAAM;AAAA,EACN,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,kBAAkB;AACpB,GACaC,IAAS;AAAA,EACpB,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,kBAAkB;AACpB,GCjCaC,IAAa;AAAA,EACxB,SAAS;AAAA,EACT,OAAO;AACT,GACaC,IAAe;AAAA,EAC1B,UAAU;AAAA,EACV,OAAO;AACT,GCPaC,IAAoB;AAAA,EAC/B,SAAS;AAAA,EACT,OAAO;AACT,GACaC,IAAsB;AAAA,EACjC,UAAU;AAAA,EACV,OAAO;AACT;"}

package/dist/keys.d.ts

@@ -137,15 +137,17 @@ export declare const BORDERS_PX: {
     readonly focusOffset: 2;
     readonly focusOffsetSm: 1;
 };
-export declare const LAYER_KEYS: readonly ["raised", "floating", "overlay", "modal", "modalRaised", "popover", "popupBackdrop", "popup", "toast", "portal"];
+export declare const LAYER_KEYS: readonly ["raised", "floating", "floatingRaised", "overlay", "modal", "modalRaised", "popover", "popoverRaised", "popupBackdrop", "popup", "toast", "portal"];
 export type LayerToken = (typeof LAYER_KEYS)[number];
 export declare const LAYERS: {
     readonly raised: 1;
     readonly floating: 50;
+    readonly floatingRaised: 60;
     readonly overlay: 1000;
     readonly modal: 1001;
     readonly modalRaised: 1002;
     readonly popover: 1040;
+    readonly popoverRaised: 1041;
     readonly popupBackdrop: 1049;
     readonly popup: 1050;
     readonly toast: 1060;

package/dist/keys.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"keys.d.ts","sourceRoot":"","sources":["../src/keys.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,UAAU,CAAA;AAEvC,eAAO,MAAM,YAAY,8DAA+D,CAAA;AACxF,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,MAAM,CAAC,CAAA;AAGxD,eAAO,MAAM,UAAU;;;;;;;;;CASb,CAAA;AAGV,eAAO,MAAM,kBAAkB,8CAA+C,CAAA;AAC9E,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAA;AACnE,eAAO,MAAM,gBAAgB;;;;;;CAMnB,CAAA;AAEV,eAAO,MAAM,WAAW,kDAAmD,CAAA;AAC3E,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;AAGtD,eAAO,MAAM,QAAQ;;;;;;;CAOX,CAAA;AAEV,eAAO,MAAM,WAAW,sDAAuD,CAAA;AAC/E,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;AAGtD,eAAO,MAAM,WAAW;;;;;;;;CAQd,CAAA;AACV,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,WAAW,CAAA;AAEpD,eAAO,MAAM,SAAS,uhCAkFZ,CAAA;AACV,MAAM,MAAM,SAAS,GAAG,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,CAAC,CAAA;AAGlD,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkFX,CAAA;AAEV,eAAO,MAAM,WAAW,wFAOd,CAAA;AACV,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;AAGtD,eAAO,MAAM,UAAU;;;;;;;CAOb,CAAA;AAEV,eAAO,MAAM,UAAU,4HAWb,CAAA;AACV,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAA;AAIpD,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAA;AAEV,eAAO,MAAM,WAAW,yCAA0C,CAAA;AAClE,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;AAGtD,eAAO,MAAM,OAAO;;;CAGV,CAAA;AAKV,eAAO,MAAM,UAAU;;;;;;CAMb,CAAA;AACV,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,UAAU,CAAA;AAK9C,eAAO,MAAM,eAAe,yCAA0C,CAAA;AACtE,eAAO,MAAM,cAAc;;;;;;CAMjB,CAAA;AAGV,eAAO,MAAM,aAAa;;;;;;;CAOhB,CAAA;AAGV,eAAO,MAAM,YAAY;;;;;CAKf,CAAA;AAGV,eAAO,MAAM,wBAAwB;;;;;;;;;;CAU3B,CAAA;AAGV,eAAO,MAAM,OAAO;;;;;;CAMV,CAAA;AAGV,eAAO,MAAM,OAAO;;;;;CAKV,CAAA;AAEV,MAAM,MAAM,UAAU,GAAG,MAAM,SAAS,CAAA;AAExC,YAAY,EAAC,UAAU,EAAC,MAAM,6BAA6B,CAAA"}
+{"version":3,"file":"keys.d.ts","sourceRoot":"","sources":["../src/keys.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,UAAU,CAAA;AAEvC,eAAO,MAAM,YAAY,8DAA+D,CAAA;AACxF,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,MAAM,CAAC,CAAA;AAGxD,eAAO,MAAM,UAAU;;;;;;;;;CASb,CAAA;AAGV,eAAO,MAAM,kBAAkB,8CAA+C,CAAA;AAC9E,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAA;AACnE,eAAO,MAAM,gBAAgB;;;;;;CAMnB,CAAA;AAEV,eAAO,MAAM,WAAW,kDAAmD,CAAA;AAC3E,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;AAGtD,eAAO,MAAM,QAAQ;;;;;;;CAOX,CAAA;AAEV,eAAO,MAAM,WAAW,sDAAuD,CAAA;AAC/E,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;AAGtD,eAAO,MAAM,WAAW;;;;;;;;CAQd,CAAA;AACV,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,WAAW,CAAA;AAEpD,eAAO,MAAM,SAAS,uhCAkFZ,CAAA;AACV,MAAM,MAAM,SAAS,GAAG,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,CAAC,CAAA;AAGlD,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkFX,CAAA;AAEV,eAAO,MAAM,WAAW,wFAOd,CAAA;AACV,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;AAGtD,eAAO,MAAM,UAAU;;;;;;;CAOb,CAAA;AAEV,eAAO,MAAM,UAAU,+JAab,CAAA;AACV,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAA;AAIpD,eAAO,MAAM,MAAM;;;;;;;;;;;;;CAaT,CAAA;AAEV,eAAO,MAAM,WAAW,yCAA0C,CAAA;AAClE,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAA;AAGtD,eAAO,MAAM,OAAO;;;CAGV,CAAA;AAKV,eAAO,MAAM,UAAU;;;;;;CAMb,CAAA;AACV,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,UAAU,CAAA;AAK9C,eAAO,MAAM,eAAe,yCAA0C,CAAA;AACtE,eAAO,MAAM,cAAc;;;;;;CAMjB,CAAA;AAGV,eAAO,MAAM,aAAa;;;;;;;CAOhB,CAAA;AAGV,eAAO,MAAM,YAAY;;;;;CAKf,CAAA;AAGV,eAAO,MAAM,wBAAwB;;;;;;;;;;CAU3B,CAAA;AAGV,eAAO,MAAM,OAAO;;;;;;CAMV,CAAA;AAGV,eAAO,MAAM,OAAO;;;;;CAKV,CAAA;AAEV,MAAM,MAAM,UAAU,GAAG,MAAM,SAAS,CAAA;AAExC,YAAY,EAAC,UAAU,EAAC,MAAM,6BAA6B,CAAA"}

package/dist/mockup.css

@@ -172,10 +172,12 @@
   --duro-border-strong: 2px;
   /* layers */
   --duro-layer-floating: 50;
+  --duro-layer-floating-raised: 60;
   --duro-layer-modal: 1001;
   --duro-layer-modal-raised: 1002;
   --duro-layer-overlay: 1000;
   --duro-layer-popover: 1040;
+  --duro-layer-popover-raised: 1041;
   --duro-layer-popup: 1050;
   --duro-layer-popup-backdrop: 1049;
   --duro-layer-portal: 1100;

package/dist/raw.d.ts

@@ -78,10 +78,12 @@ export declare const BORDERS_PX: {
 export declare const LAYERS: {
     readonly raised: 1;
     readonly floating: 50;
+    readonly floatingRaised: 60;
     readonly overlay: 1000;
     readonly modal: 1001;
     readonly modalRaised: 1002;
     readonly popover: 1040;
+    readonly popoverRaised: 1041;
     readonly popupBackdrop: 1049;
     readonly popup: 1050;
     readonly toast: 1060;

package/dist/raw.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"raw.d.ts","sourceRoot":"","sources":["../src/raw.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,SAAS,GAAG;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAA;IACd,WAAW,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;IACd,WAAW,EAAE,MAAM,CAAA;IACnB,cAAc,EAAE,MAAM,CAAA;IACtB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;IAClB,OAAO,EAAE,MAAM,CAAA;IACf,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,EAAE,MAAM,CAAA;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,gBAAgB,EAAE,MAAM,CAAA;IACxB,aAAa,EAAE,MAAM,CAAA;IACrB,kBAAkB,EAAE,MAAM,CAAA;IAC1B,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,MAAM,CAAA;IACvB,iBAAiB,EAAE,MAAM,CAAA;IACzB,cAAc,EAAE,MAAM,CAAA;CACvB,CAAA;AAKD,eAAO,MAAM,UAAU;;;;;;;;;CASb,CAAA;AAEV,eAAO,MAAM,QAAQ;;;;;;;CAOX,CAAA;AAEV,eAAO,MAAM,aAAa;;;;;;;CAOhB,CAAA;AAEV,eAAO,MAAM,UAAU;;;;;;;CAOb,CAAA;AAEV,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAA;AAGV,eAAO,MAAM,OAAO;;;CAGV,CAAA;AAEV,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkFX,CAAA;AAIV,eAAO,MAAM,QAAQ;;;CAA+C,CAAA;AAGpE,eAAO,MAAM,UAAU,EAAE,SA0CxB,CAAA;AAGD,eAAO,MAAM,WAAW,EAAE,SA0CzB,CAAA;AAGD,eAAO,MAAM,kBAAkB,EAAE,SA0ChC,CAAA"}
+{"version":3,"file":"raw.d.ts","sourceRoot":"","sources":["../src/raw.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,SAAS,GAAG;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAA;IACd,WAAW,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,MAAM,CAAA;IACd,WAAW,EAAE,MAAM,CAAA;IACnB,cAAc,EAAE,MAAM,CAAA;IACtB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;IAClB,OAAO,EAAE,MAAM,CAAA;IACf,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,EAAE,MAAM,CAAA;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,gBAAgB,EAAE,MAAM,CAAA;IACxB,aAAa,EAAE,MAAM,CAAA;IACrB,kBAAkB,EAAE,MAAM,CAAA;IAC1B,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,MAAM,CAAA;IACvB,iBAAiB,EAAE,MAAM,CAAA;IACzB,cAAc,EAAE,MAAM,CAAA;CACvB,CAAA;AAKD,eAAO,MAAM,UAAU;;;;;;;;;CASb,CAAA;AAEV,eAAO,MAAM,QAAQ;;;;;;;CAOX,CAAA;AAEV,eAAO,MAAM,aAAa;;;;;;;CAOhB,CAAA;AAEV,eAAO,MAAM,UAAU;;;;;;;CAOb,CAAA;AAEV,eAAO,MAAM,MAAM;;;;;;;;;;;;;CAaT,CAAA;AAGV,eAAO,MAAM,OAAO;;;CAGV,CAAA;AAEV,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkFX,CAAA;AAIV,eAAO,MAAM,QAAQ;;;CAA+C,CAAA;AAGpE,eAAO,MAAM,UAAU,EAAE,SA0CxB,CAAA;AAGD,eAAO,MAAM,WAAW,EAAE,SA0CzB,CAAA;AAGD,eAAO,MAAM,kBAAkB,EAAE,SA0ChC,CAAA"}

package/dist/raw.js

@@ -31,10 +31,12 @@ const r = {
 }, t = {
   raised: 1,
   floating: 50,
+  floatingRaised: 60,
   overlay: 1e3,
   modal: 1001,
   modalRaised: 1002,
   popover: 1040,
+  popoverRaised: 1041,
   popupBackdrop: 1049,
   popup: 1050,
   toast: 1060,

package/dist/raw.js.map

@@ -1 +1 @@
-{"version":3,"file":"raw.js","sources":["../src/raw.ts"],"sourcesContent":["// Plain hex values for non-`react-strict-dom` consumers (e.g. an MUI\n// `createTheme` palette). These mirror the literals defined in\n// `tokens/colors.css.ts`, `themes/light.css.ts`, and `themes/high-contrast.css.ts`.\n//\n// We can't make the css.ts files import from here: StyleX (the babel plugin\n// behind RSD's `css.defineVars` / `css.createTheme` on web) requires the\n// argument to be an inline object literal. So values live in two places.\n//\n// `scripts/check-token-drift.mjs` runs in `prebuild` and fails the build if\n// the literal in any css.ts file diverges from the corresponding export here.\n\nexport type RawColors = {\n  bg: string\n  bgCard: string\n  bgCardHover: string\n  text: string\n  textMuted: string\n  accent: string\n  accentHover: string\n  accentContrast: string\n  border: string\n  error: string\n  errorHover: string\n  errorBg: string\n  errorBorder: string\n  errorText: string\n  errorContrast: string\n  success: string\n  successBg: string\n  successBorder: string\n  successText: string\n  warning: string\n  warningBg: string\n  warningBorder: string\n  warningText: string\n  info: string\n  infoBg: string\n  infoBorder: string\n  infoText: string\n  highlight: string\n  highlightBg: string\n  highlightBorder: string\n  highlightText: string\n  scrim: string\n  inverseFill: string\n  inverseFillHover: string\n  inverseBorder: string\n  inverseBorderHover: string\n  fixedLight: string\n  overlayLight: string\n  contrastSurface: string\n  onContrastSurface: string\n  contrastBorder: string\n}\n\n// Numeric maps for consumers that load only the compiled `/raw` entry (e.g.\n// ui-email, which cannot read CSS variables or the TypeScript `/keys` source).\n// Copies of the keys.ts maps; check-token-drift.mjs fails if they diverge.\nexport const SPACING_PX = {\n  xs: 4,\n  sm: 8,\n  ms: 12,\n  md: 16,\n  lg: 24,\n  xl: 32,\n  xxl: 48,\n  xxxl: 64,\n} as const\n\nexport const RADII_PX = {\n  xs: 4,\n  px6: 6,\n  sm: 8,\n  md: 12,\n  lg: 16,\n  full: 9999,\n} as const\n\nexport const FONT_SIZE_REM = {\n  fontSizeXs: 0.75,\n  fontSizeSm: 0.875,\n  fontSizeMd: 1,\n  fontSizeLg: 1.125,\n  fontSizeXl: 1.25,\n  fontSizeHeading: 1.5,\n} as const\n\nexport const BORDERS_PX = {\n  hairline: 1,\n  strong: 2,\n  accent: 3,\n  focusRing: 2,\n  focusOffset: 2,\n  focusOffsetSm: 1,\n} as const\n\nexport const LAYERS = {\n  raised: 1,\n  floating: 50,\n  overlay: 1000,\n  modal: 1001,\n  modalRaised: 1002,\n  popover: 1040,\n  popupBackdrop: 1049,\n  popup: 1050,\n  toast: 1060,\n  portal: 1100,\n} as const\n\n// Copy of keys.ts EFFECTS (CSS filter strings, not a numeric map).\nexport const EFFECTS = {\n  overlayBlur: 'blur(2px)',\n  surfaceBlur: 'blur(6px)',\n} as const\n\nexport const SIZES_PX = {\n  touchTarget: 44,\n  controlSm: 28,\n  controlMd: 39,\n  controlLg: 40,\n  indicator: 18,\n  indicatorDot: 8,\n  checkMarkW: 5,\n  checkMarkH: 9,\n  switchTrackW: 36,\n  switchTrackH: 20,\n  switchThumb: 16,\n  iconButton: 32,\n  iconButtonSm: 28,\n  spinnerSm: 16,\n  spinnerMd: 24,\n  spinnerLg: 40,\n  glyphXs: 10,\n  glyphSm: 12,\n  glyphMd: 16,\n  iconSm: 16,\n  iconMd: 18,\n  iconLg: 24,\n  iconXl: 36,\n  iconXxl: 48,\n  navMarkerW: 3,\n  navMarkerH: 18,\n  divider: 1,\n  tabIndicator: 2,\n  edgeFade: 32,\n  scrollbar: 8,\n  swatchW: 44,\n  swatchH: 34,\n  labelMinW: 120,\n  popupMinW: 160,\n  listMaxH: 280,\n  listMaxHSm: 200,\n  dialogSm: 400,\n  dialogMd: 520,\n  dialogLg: 680,\n  panelSm: 360,\n  panelMd: 480,\n  panelLg: 640,\n  toastMaxW: 440,\n  gridColSm: 240,\n  gridColMd: 280,\n  pageSm: 600,\n  pageMd: 800,\n  pageLg: 1200,\n  sidebarW: 240,\n  pageXs: 480,\n  pageXl: 1440,\n  asideW: 320,\n  gridColXs: 200,\n  fieldMinWSm: 80,\n  fieldMinW: 160,\n  popoverWSm: 240,\n  popoverW: 320,\n  popupMaxW: 280,\n  meterH: 6,\n  skeletonChipW: 96,\n  dropZoneMinH: 128,\n  canvasMinH: 480,\n  editorMinH: 160,\n  toolbarH: 36,\n  embedW: 550,\n  colorPickerW: 196,\n  colorAreaH: 150,\n  colorTrackH: 12,\n  colorSwatch: 20,\n  colorPreviewH: 22,\n  handle: 16,\n  chip: 24,\n  placeholderMinH: 80,\n  previewMaxH: 320,\n  barH: 4,\n  readoutW: 40,\n  sliderW: 96,\n  paletteMinW: 96,\n  deviceBarW: 96,\n  timeGutterW: 64,\n  dayHeaderH: 46,\n} as const\n\n// Email-only measures: no CSS variable (mail clients cannot read them) and not\n// a lint candidate, so it is deliberately absent from keys.ts.\nexport const EMAIL_PX = {emailCardW: 520, trackingPixel: 1} as const\n\n// Dark theme — matches the defaults in `tokens/colors.css.ts`.\nexport const darkColors: RawColors = {\n  bg: '#0f0f0f',\n  bgCard: '#1a1a1a',\n  bgCardHover: '#242424',\n  text: '#e5e5e5',\n  textMuted: '#b0b0b0',\n  accent: '#6aaffc',\n  accentHover: '#93c5fd',\n  accentContrast: '#000000',\n  border: '#333333',\n  error: '#f87171',\n  errorHover: '#fca5a5',\n  errorBg: 'rgba(248, 113, 113, 0.1)',\n  errorBorder: 'rgba(248, 113, 113, 0.3)',\n  errorText: '#fca5a5',\n  errorContrast: '#000000',\n  success: '#22c55e',\n  successBg: 'rgba(34, 197, 94, 0.1)',\n  successBorder: 'rgba(34, 197, 94, 0.3)',\n  successText: '#86efac',\n  warning: '#fbbf24',\n  warningBg: 'rgba(251, 191, 36, 0.1)',\n  warningBorder: 'rgba(251, 191, 36, 0.3)',\n  warningText: '#fde68a',\n  info: '#6aaffc',\n  infoBg: 'rgba(106, 175, 252, 0.1)',\n  infoBorder: 'rgba(106, 175, 252, 0.3)',\n  infoText: '#93c5fd',\n  highlight: '#c084fc',\n  highlightBg: 'rgba(192, 132, 252, 0.1)',\n  highlightBorder: 'rgba(192, 132, 252, 0.3)',\n  highlightText: '#d8b4fe',\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  fixedLight: '#ffffff',\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  contrastSurface: '#f5f5f5',\n  onContrastSurface: '#1a1a1a',\n  contrastBorder: 'rgba(0, 0, 0, 0.42)',\n}\n\n// Light theme — matches the overrides in `themes/light.css.ts`.\nexport const lightColors: RawColors = {\n  bg: '#ffffff',\n  bgCard: '#f5f5f5',\n  bgCardHover: '#ebebeb',\n  text: '#1a1a1a',\n  textMuted: '#4a4a4a',\n  accent: '#1e40af',\n  accentHover: '#1a3799',\n  accentContrast: '#ffffff',\n  border: '#d4d4d4',\n  error: '#991b1b',\n  errorHover: '#7f1d1d',\n  errorBg: 'rgba(153, 27, 27, 0.08)',\n  errorBorder: 'rgba(153, 27, 27, 0.3)',\n  errorText: '#7f1d1d',\n  errorContrast: '#ffffff',\n  success: '#166534',\n  successBg: 'rgba(22, 101, 52, 0.08)',\n  successBorder: 'rgba(22, 101, 52, 0.3)',\n  successText: '#14532d',\n  warning: '#92400e',\n  warningBg: 'rgba(146, 64, 14, 0.08)',\n  warningBorder: 'rgba(146, 64, 14, 0.3)',\n  warningText: '#78350f',\n  info: '#1e40af',\n  infoBg: 'rgba(30, 64, 175, 0.08)',\n  infoBorder: 'rgba(30, 64, 175, 0.3)',\n  infoText: '#1e40af',\n  highlight: '#6b21a8',\n  highlightBg: 'rgba(107, 33, 168, 0.08)',\n  highlightBorder: 'rgba(107, 33, 168, 0.3)',\n  highlightText: '#581c87',\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  fixedLight: '#ffffff',\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  contrastSurface: '#1a1a1a',\n  onContrastSurface: '#e5e5e5',\n  contrastBorder: 'rgba(255, 255, 255, 0.33)',\n}\n\n// High-contrast theme — matches the overrides in `themes/high-contrast.css.ts`.\nexport const highContrastColors: RawColors = {\n  bg: '#000000',\n  bgCard: '#111111',\n  bgCardHover: '#1a1a1a',\n  text: '#ffffff',\n  textMuted: '#b0b0b0',\n  accent: '#60a5fa',\n  accentHover: '#93c5fd',\n  accentContrast: '#000000',\n  border: '#555555',\n  error: '#f87171',\n  errorHover: '#fca5a5',\n  errorBg: 'rgba(248, 113, 113, 0.15)',\n  errorBorder: 'rgba(248, 113, 113, 0.5)',\n  errorText: '#fca5a5',\n  errorContrast: '#000000',\n  success: '#4ade80',\n  successBg: 'rgba(74, 222, 128, 0.15)',\n  successBorder: 'rgba(74, 222, 128, 0.5)',\n  successText: '#86efac',\n  warning: '#fcd34d',\n  warningBg: 'rgba(252, 211, 77, 0.15)',\n  warningBorder: 'rgba(252, 211, 77, 0.5)',\n  warningText: '#fef08a',\n  info: '#60a5fa',\n  infoBg: 'rgba(96, 165, 250, 0.15)',\n  infoBorder: 'rgba(96, 165, 250, 0.5)',\n  infoText: '#bfdbfe',\n  highlight: '#d8b4fe',\n  highlightBg: 'rgba(216, 180, 254, 0.15)',\n  highlightBorder: 'rgba(216, 180, 254, 0.5)',\n  highlightText: '#e9d5ff',\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  fixedLight: '#ffffff',\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  contrastSurface: '#ffffff',\n  onContrastSurface: '#000000',\n  contrastBorder: 'rgba(0, 0, 0, 0.42)',\n}\n"],"names":["SPACING_PX","RADII_PX","FONT_SIZE_REM","BORDERS_PX","LAYERS","EFFECTS","SIZES_PX","EMAIL_PX","darkColors","lightColors","highContrastColors"],"mappings":"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"}
+{"version":3,"file":"raw.js","sources":["../src/raw.ts"],"sourcesContent":["// Plain hex values for non-`react-strict-dom` consumers (e.g. an MUI\n// `createTheme` palette). These mirror the literals defined in\n// `tokens/colors.css.ts`, `themes/light.css.ts`, and `themes/high-contrast.css.ts`.\n//\n// We can't make the css.ts files import from here: StyleX (the babel plugin\n// behind RSD's `css.defineVars` / `css.createTheme` on web) requires the\n// argument to be an inline object literal. So values live in two places.\n//\n// `scripts/check-token-drift.mjs` runs in `prebuild` and fails the build if\n// the literal in any css.ts file diverges from the corresponding export here.\n\nexport type RawColors = {\n  bg: string\n  bgCard: string\n  bgCardHover: string\n  text: string\n  textMuted: string\n  accent: string\n  accentHover: string\n  accentContrast: string\n  border: string\n  error: string\n  errorHover: string\n  errorBg: string\n  errorBorder: string\n  errorText: string\n  errorContrast: string\n  success: string\n  successBg: string\n  successBorder: string\n  successText: string\n  warning: string\n  warningBg: string\n  warningBorder: string\n  warningText: string\n  info: string\n  infoBg: string\n  infoBorder: string\n  infoText: string\n  highlight: string\n  highlightBg: string\n  highlightBorder: string\n  highlightText: string\n  scrim: string\n  inverseFill: string\n  inverseFillHover: string\n  inverseBorder: string\n  inverseBorderHover: string\n  fixedLight: string\n  overlayLight: string\n  contrastSurface: string\n  onContrastSurface: string\n  contrastBorder: string\n}\n\n// Numeric maps for consumers that load only the compiled `/raw` entry (e.g.\n// ui-email, which cannot read CSS variables or the TypeScript `/keys` source).\n// Copies of the keys.ts maps; check-token-drift.mjs fails if they diverge.\nexport const SPACING_PX = {\n  xs: 4,\n  sm: 8,\n  ms: 12,\n  md: 16,\n  lg: 24,\n  xl: 32,\n  xxl: 48,\n  xxxl: 64,\n} as const\n\nexport const RADII_PX = {\n  xs: 4,\n  px6: 6,\n  sm: 8,\n  md: 12,\n  lg: 16,\n  full: 9999,\n} as const\n\nexport const FONT_SIZE_REM = {\n  fontSizeXs: 0.75,\n  fontSizeSm: 0.875,\n  fontSizeMd: 1,\n  fontSizeLg: 1.125,\n  fontSizeXl: 1.25,\n  fontSizeHeading: 1.5,\n} as const\n\nexport const BORDERS_PX = {\n  hairline: 1,\n  strong: 2,\n  accent: 3,\n  focusRing: 2,\n  focusOffset: 2,\n  focusOffsetSm: 1,\n} as const\n\nexport const LAYERS = {\n  raised: 1,\n  floating: 50,\n  floatingRaised: 60,\n  overlay: 1000,\n  modal: 1001,\n  modalRaised: 1002,\n  popover: 1040,\n  popoverRaised: 1041,\n  popupBackdrop: 1049,\n  popup: 1050,\n  toast: 1060,\n  portal: 1100,\n} as const\n\n// Copy of keys.ts EFFECTS (CSS filter strings, not a numeric map).\nexport const EFFECTS = {\n  overlayBlur: 'blur(2px)',\n  surfaceBlur: 'blur(6px)',\n} as const\n\nexport const SIZES_PX = {\n  touchTarget: 44,\n  controlSm: 28,\n  controlMd: 39,\n  controlLg: 40,\n  indicator: 18,\n  indicatorDot: 8,\n  checkMarkW: 5,\n  checkMarkH: 9,\n  switchTrackW: 36,\n  switchTrackH: 20,\n  switchThumb: 16,\n  iconButton: 32,\n  iconButtonSm: 28,\n  spinnerSm: 16,\n  spinnerMd: 24,\n  spinnerLg: 40,\n  glyphXs: 10,\n  glyphSm: 12,\n  glyphMd: 16,\n  iconSm: 16,\n  iconMd: 18,\n  iconLg: 24,\n  iconXl: 36,\n  iconXxl: 48,\n  navMarkerW: 3,\n  navMarkerH: 18,\n  divider: 1,\n  tabIndicator: 2,\n  edgeFade: 32,\n  scrollbar: 8,\n  swatchW: 44,\n  swatchH: 34,\n  labelMinW: 120,\n  popupMinW: 160,\n  listMaxH: 280,\n  listMaxHSm: 200,\n  dialogSm: 400,\n  dialogMd: 520,\n  dialogLg: 680,\n  panelSm: 360,\n  panelMd: 480,\n  panelLg: 640,\n  toastMaxW: 440,\n  gridColSm: 240,\n  gridColMd: 280,\n  pageSm: 600,\n  pageMd: 800,\n  pageLg: 1200,\n  sidebarW: 240,\n  pageXs: 480,\n  pageXl: 1440,\n  asideW: 320,\n  gridColXs: 200,\n  fieldMinWSm: 80,\n  fieldMinW: 160,\n  popoverWSm: 240,\n  popoverW: 320,\n  popupMaxW: 280,\n  meterH: 6,\n  skeletonChipW: 96,\n  dropZoneMinH: 128,\n  canvasMinH: 480,\n  editorMinH: 160,\n  toolbarH: 36,\n  embedW: 550,\n  colorPickerW: 196,\n  colorAreaH: 150,\n  colorTrackH: 12,\n  colorSwatch: 20,\n  colorPreviewH: 22,\n  handle: 16,\n  chip: 24,\n  placeholderMinH: 80,\n  previewMaxH: 320,\n  barH: 4,\n  readoutW: 40,\n  sliderW: 96,\n  paletteMinW: 96,\n  deviceBarW: 96,\n  timeGutterW: 64,\n  dayHeaderH: 46,\n} as const\n\n// Email-only measures: no CSS variable (mail clients cannot read them) and not\n// a lint candidate, so it is deliberately absent from keys.ts.\nexport const EMAIL_PX = {emailCardW: 520, trackingPixel: 1} as const\n\n// Dark theme — matches the defaults in `tokens/colors.css.ts`.\nexport const darkColors: RawColors = {\n  bg: '#0f0f0f',\n  bgCard: '#1a1a1a',\n  bgCardHover: '#242424',\n  text: '#e5e5e5',\n  textMuted: '#b0b0b0',\n  accent: '#6aaffc',\n  accentHover: '#93c5fd',\n  accentContrast: '#000000',\n  border: '#333333',\n  error: '#f87171',\n  errorHover: '#fca5a5',\n  errorBg: 'rgba(248, 113, 113, 0.1)',\n  errorBorder: 'rgba(248, 113, 113, 0.3)',\n  errorText: '#fca5a5',\n  errorContrast: '#000000',\n  success: '#22c55e',\n  successBg: 'rgba(34, 197, 94, 0.1)',\n  successBorder: 'rgba(34, 197, 94, 0.3)',\n  successText: '#86efac',\n  warning: '#fbbf24',\n  warningBg: 'rgba(251, 191, 36, 0.1)',\n  warningBorder: 'rgba(251, 191, 36, 0.3)',\n  warningText: '#fde68a',\n  info: '#6aaffc',\n  infoBg: 'rgba(106, 175, 252, 0.1)',\n  infoBorder: 'rgba(106, 175, 252, 0.3)',\n  infoText: '#93c5fd',\n  highlight: '#c084fc',\n  highlightBg: 'rgba(192, 132, 252, 0.1)',\n  highlightBorder: 'rgba(192, 132, 252, 0.3)',\n  highlightText: '#d8b4fe',\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  fixedLight: '#ffffff',\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  contrastSurface: '#f5f5f5',\n  onContrastSurface: '#1a1a1a',\n  contrastBorder: 'rgba(0, 0, 0, 0.42)',\n}\n\n// Light theme — matches the overrides in `themes/light.css.ts`.\nexport const lightColors: RawColors = {\n  bg: '#ffffff',\n  bgCard: '#f5f5f5',\n  bgCardHover: '#ebebeb',\n  text: '#1a1a1a',\n  textMuted: '#4a4a4a',\n  accent: '#1e40af',\n  accentHover: '#1a3799',\n  accentContrast: '#ffffff',\n  border: '#d4d4d4',\n  error: '#991b1b',\n  errorHover: '#7f1d1d',\n  errorBg: 'rgba(153, 27, 27, 0.08)',\n  errorBorder: 'rgba(153, 27, 27, 0.3)',\n  errorText: '#7f1d1d',\n  errorContrast: '#ffffff',\n  success: '#166534',\n  successBg: 'rgba(22, 101, 52, 0.08)',\n  successBorder: 'rgba(22, 101, 52, 0.3)',\n  successText: '#14532d',\n  warning: '#92400e',\n  warningBg: 'rgba(146, 64, 14, 0.08)',\n  warningBorder: 'rgba(146, 64, 14, 0.3)',\n  warningText: '#78350f',\n  info: '#1e40af',\n  infoBg: 'rgba(30, 64, 175, 0.08)',\n  infoBorder: 'rgba(30, 64, 175, 0.3)',\n  infoText: '#1e40af',\n  highlight: '#6b21a8',\n  highlightBg: 'rgba(107, 33, 168, 0.08)',\n  highlightBorder: 'rgba(107, 33, 168, 0.3)',\n  highlightText: '#581c87',\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  fixedLight: '#ffffff',\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  contrastSurface: '#1a1a1a',\n  onContrastSurface: '#e5e5e5',\n  contrastBorder: 'rgba(255, 255, 255, 0.33)',\n}\n\n// High-contrast theme — matches the overrides in `themes/high-contrast.css.ts`.\nexport const highContrastColors: RawColors = {\n  bg: '#000000',\n  bgCard: '#111111',\n  bgCardHover: '#1a1a1a',\n  text: '#ffffff',\n  textMuted: '#b0b0b0',\n  accent: '#60a5fa',\n  accentHover: '#93c5fd',\n  accentContrast: '#000000',\n  border: '#555555',\n  error: '#f87171',\n  errorHover: '#fca5a5',\n  errorBg: 'rgba(248, 113, 113, 0.15)',\n  errorBorder: 'rgba(248, 113, 113, 0.5)',\n  errorText: '#fca5a5',\n  errorContrast: '#000000',\n  success: '#4ade80',\n  successBg: 'rgba(74, 222, 128, 0.15)',\n  successBorder: 'rgba(74, 222, 128, 0.5)',\n  successText: '#86efac',\n  warning: '#fcd34d',\n  warningBg: 'rgba(252, 211, 77, 0.15)',\n  warningBorder: 'rgba(252, 211, 77, 0.5)',\n  warningText: '#fef08a',\n  info: '#60a5fa',\n  infoBg: 'rgba(96, 165, 250, 0.15)',\n  infoBorder: 'rgba(96, 165, 250, 0.5)',\n  infoText: '#bfdbfe',\n  highlight: '#d8b4fe',\n  highlightBg: 'rgba(216, 180, 254, 0.15)',\n  highlightBorder: 'rgba(216, 180, 254, 0.5)',\n  highlightText: '#e9d5ff',\n  scrim: 'rgba(0, 0, 0, 0.4)',\n  inverseFill: 'rgba(0, 0, 0, 0.10)',\n  inverseFillHover: 'rgba(0, 0, 0, 0.18)',\n  inverseBorder: 'rgba(0, 0, 0, 0.55)',\n  inverseBorderHover: 'rgba(0, 0, 0, 0.70)',\n  fixedLight: '#ffffff',\n  overlayLight: 'rgba(255, 255, 255, 0.78)',\n  contrastSurface: '#ffffff',\n  onContrastSurface: '#000000',\n  contrastBorder: 'rgba(0, 0, 0, 0.42)',\n}\n"],"names":["SPACING_PX","RADII_PX","FONT_SIZE_REM","BORDERS_PX","LAYERS","EFFECTS","SIZES_PX","EMAIL_PX","darkColors","lightColors","highContrastColors"],"mappings":"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"}

package/dist/tokens/layers.css.d.ts

@@ -2,10 +2,12 @@ import { css } from 'react-strict-dom';
 export declare const layers: css.VarGroup<Readonly<{
     readonly raised: css.Types.Integer<number>;
     readonly floating: css.Types.Integer<number>;
+    readonly floatingRaised: css.Types.Integer<number>;
     readonly overlay: css.Types.Integer<number>;
     readonly modal: css.Types.Integer<number>;
     readonly modalRaised: css.Types.Integer<number>;
     readonly popover: css.Types.Integer<number>;
+    readonly popoverRaised: css.Types.Integer<number>;
     readonly popupBackdrop: css.Types.Integer<number>;
     readonly popup: css.Types.Integer<number>;
     readonly toast: css.Types.Integer<number>;

package/dist/tokens/layers.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layers.css.d.ts","sourceRoot":"","sources":["../../src/tokens/layers.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,kBAAkB,CAAA;AAgBpC,eAAO,MAAM,MAAM;;;;;;;;;;;WAyBsC,CAAA"}
+{"version":3,"file":"layers.css.d.ts","sourceRoot":"","sources":["../../src/tokens/layers.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,kBAAkB,CAAA;AAgBpC,eAAO,MAAM,MAAM;;;;;;;;;;;;;WAiCsC,CAAA"}

package/dist/vars.css

@@ -173,10 +173,12 @@
   --duro-border-strong: var(--strong-x1otbxzr);
   /* layers */
   --duro-layer-floating: var(--floating-x1bmxuyp);
+  --duro-layer-floating-raised: var(--floatingRaised-x1eg1u0w);
   --duro-layer-modal: var(--modal-x10p0ok);
   --duro-layer-modal-raised: var(--modalRaised-x1j0jssi);
   --duro-layer-overlay: var(--overlay-x1pg5hea);
   --duro-layer-popover: var(--popover-x13dty8z);
+  --duro-layer-popover-raised: var(--popoverRaised-x1pp3rn0);
   --duro-layer-popup: var(--popup-xgi3yzv);
   --duro-layer-popup-backdrop: var(--popupBackdrop-x17sujb4);
   --duro-layer-portal: var(--portal-xmizwb3);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@duro-app/tokens",
-  "version": "5.5.0",
+  "version": "5.6.0",
   "type": "module",
   "license": "MIT",
   "repository": {

package/src/keys.ts

@@ -263,10 +263,12 @@ export const BORDERS_PX = {
 export const LAYER_KEYS = [
   'raised',
   'floating',
+  'floatingRaised',
   'overlay',
   'modal',
   'modalRaised',
   'popover',
+  'popoverRaised',
   'popupBackdrop',
   'popup',
   'toast',
@@ -279,10 +281,12 @@ export type LayerToken = (typeof LAYER_KEYS)[number]
 export const LAYERS = {
   raised: 1,
   floating: 50,
+  floatingRaised: 60,
   overlay: 1000,
   modal: 1001,
   modalRaised: 1002,
   popover: 1040,
+  popoverRaised: 1041,
   popupBackdrop: 1049,
   popup: 1050,
   toast: 1060,

package/src/raw.ts

@@ -97,10 +97,12 @@ export const BORDERS_PX = {
 export const LAYERS = {
   raised: 1,
   floating: 50,
+  floatingRaised: 60,
   overlay: 1000,
   modal: 1001,
   modalRaised: 1002,
   popover: 1040,
+  popoverRaised: 1041,
   popupBackdrop: 1049,
   popup: 1050,
   toast: 1060,

package/src/tokens/layers.css.ts

@@ -20,6 +20,11 @@ export const layers = css.defineVars({
   raised: '1',
   // Floating chrome over the page: Tooltip, ActionBar.
   floating: '50',
+  // A floating surface that must cover another floating one, outside a modal:
+  // a link editor over a selection format bar. Pair it with `popoverRaised`
+  // and pick by `useInModal()` (a Popover does it with `raised`). It covers a
+  // sibling floating surface, never a modal.
+  floatingRaised: '60',
   // A modal's backdrop.
   overlay: '1000',
   // A modal's panel (Dialog, Drawer).
@@ -31,6 +36,9 @@ export const layers = css.defineVars({
   // (a Select, a Menu) and the Select click-catcher opened from inside it.
   // Outside a modal a Popover is `floating`, so a modal opened later covers it.
   popover: '1040',
+  // `floatingRaised` inside a Dialog or Drawer: over a Popover there, under
+  // a popup's click-catcher and the popup itself.
+  popoverRaised: '1041',
   // A popup's click-catcher, under the popup itself.
   popupBackdrop: '1049',
   // Popups: Select, Listbox, Menu — above a modal or Popover they open from.