@usememos/ui 26.11.5 → 26.11.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3 +1,3 @@
1
1
  'use client';
2
- import{mergeProps as d}from"@base-ui/react/merge-props";import{useRender as i}from"@base-ui/react/use-render";import{forwardRef as u}from"react";import{cx as g}from"../../internal/class-name.js";import{Fragment as f,jsxs as c}from"react/jsx-runtime";function l({tone:e="neutral"}={}){return g("mu-badge",`mu-badge-${e}`,"mu-base","mu-s-xs")}var b=u(function({tone:r="neutral",icon:n,color:o,render:t,children:s,...a},p){let m=o?{"--mu-badge-color":o}:void 0;return i({defaultTagName:"span",render:t,ref:p,props:d({className:l({tone:r}),style:m,children:c(f,{children:[n,s]})},a)})});export{b as Badge,l as badgeClasses};
2
+ import{mergeProps as d}from"@base-ui/react/merge-props";import{useRender as i}from"@base-ui/react/use-render";import{forwardRef as l}from"react";import{cx as u}from"../../internal/class-name.js";import{Fragment as f,jsx as c,jsxs as b}from"react/jsx-runtime";function g({tone:e="neutral"}={}){return u("mu-badge",`mu-badge-${e}`,"mu-base","mu-s-xs","mu-caption-xs")}var y=l(function({tone:s="neutral",icon:r,color:o,render:a,children:n,...t},p){let m=o?{"--mu-badge-color":o}:void 0;return i({defaultTagName:"span",render:a,ref:p,props:d({className:g({tone:s}),style:m,children:b(f,{children:[r,n!=null&&c("span",{className:"mu-badge-label",children:n})]})},t)})});export{y as Badge,g as badgeClasses};
3
3
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/badge/index.tsx"],
4
- "sourcesContent": ["import { mergeProps } from '@base-ui/react/merge-props';\nimport { useRender } from '@base-ui/react/use-render';\nimport { forwardRef, type CSSProperties } from 'react';\nimport { cx } from '../../internal/class-name';\nimport type { IconElement, Tone } from '../../types';\n\nexport interface BadgeProps extends useRender.ComponentProps<'span'> {\n /** A status tone, `outline` for a quiet label such as visibility, or `primary` (ink) for the one label that should stand out, such as New. */\n tone?: Tone | 'outline' | 'primary';\n /** A Lucide element before the text, drawn at 12px. */\n icon?: IconElement;\n /**\n * A color the user gave this tag, as any CSS color. It tints the fill;\n * the text and icon stay ink. `neutral` tone only. Sets `--mu-badge-color`.\n */\n color?: string;\n}\n\nexport interface BadgeClassesOptions {\n tone?: BadgeProps['tone'];\n}\n\n/**\n * The classes that make an element look like a Badge. Use them on an app's\n * own label, such as a tag that is also a link:\n * `<a className={badgeClasses()} href=\"/tags/work\">work</a>`.\n */\nexport function badgeClasses({ tone = 'neutral' }: BadgeClassesOptions = {}) {\n return cx('mu-badge', `mu-badge-${tone}`, 'mu-base', 'mu-s-xs');\n}\n\n/** A tag or status label: one or two words. */\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(function Badge({ tone = 'neutral', icon, color, render, children, ...props }, ref) {\n const style = color ? ({ '--mu-badge-color': color } as CSSProperties) : undefined;\n return useRender({\n defaultTagName: 'span',\n render,\n ref,\n props: mergeProps<'span'>({ className: badgeClasses({ tone }), style, children: (\n <>\n {icon}\n {children}\n </>\n ) }, props),\n });\n});\n"],
5
- "mappings": ";AAAA,OAAS,cAAAA,MAAkB,6BAC3B,OAAS,aAAAC,MAAiB,4BAC1B,OAAS,cAAAC,MAAsC,QAC/C,OAAS,MAAAC,MAAU,+BAoCT,mBAAAC,EAAA,QAAAC,MAAA,oBAZH,SAASC,EAAa,CAAE,KAAAC,EAAO,SAAU,EAAyB,CAAC,EAAG,CAC3E,OAAOJ,EAAG,WAAY,YAAYI,CAAI,GAAI,UAAW,SAAS,CAChE,CAGO,IAAMC,EAAQN,EAAwC,SAAe,CAAE,KAAAK,EAAO,UAAW,KAAAE,EAAM,MAAAC,EAAO,OAAAC,EAAQ,SAAAC,EAAU,GAAGC,CAAM,EAAGC,EAAK,CAC9I,IAAMC,EAAQL,EAAS,CAAE,mBAAoBA,CAAM,EAAsB,OACzE,OAAOT,EAAU,CACf,eAAgB,OAChB,OAAAU,EACA,IAAAG,EACA,MAAOd,EAAmB,CAAE,UAAWM,EAAa,CAAE,KAAAC,CAAK,CAAC,EAAG,MAAAQ,EAAO,SAChEV,EAAAD,EAAA,CACG,UAAAK,EACAG,GACH,CACA,EAAGC,CAAK,CAChB,CAAC,CACH,CAAC",
6
- "names": ["mergeProps", "useRender", "forwardRef", "cx", "Fragment", "jsxs", "badgeClasses", "tone", "Badge", "icon", "color", "render", "children", "props", "ref", "style"]
4
+ "sourcesContent": ["import { mergeProps } from '@base-ui/react/merge-props';\nimport { useRender } from '@base-ui/react/use-render';\nimport { forwardRef, type CSSProperties } from 'react';\nimport { cx } from '../../internal/class-name';\nimport type { IconElement, Tone } from '../../types';\n\nexport interface BadgeProps extends useRender.ComponentProps<'span'> {\n /** A status tone, `outline` for a quiet label such as visibility, or `primary` (ink) for the one label that should stand out, such as New. */\n tone?: Tone | 'outline' | 'primary';\n /** A Lucide element before the text, drawn at 12px. */\n icon?: IconElement;\n /**\n * A color the user gave this tag, as any CSS color. It tints the fill;\n * the text and icon stay ink. `neutral` tone only. Sets `--mu-badge-color`.\n */\n color?: string;\n}\n\nexport interface BadgeClassesOptions {\n tone?: BadgeProps['tone'];\n}\n\n/**\n * The classes that make an element look like a Badge. Use them on an app's\n * own label, such as a tag that is also a link:\n * `<a className={badgeClasses()} href=\"/tags/work\">work</a>`.\n */\nexport function badgeClasses({ tone = 'neutral' }: BadgeClassesOptions = {}) {\n return cx('mu-badge', `mu-badge-${tone}`, 'mu-base', 'mu-s-xs', 'mu-caption-xs');\n}\n\n/** A tag or status label: one or two words, in a pill. A label wider than its container ends in an ellipsis. */\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(function Badge({ tone = 'neutral', icon, color, render, children, ...props }, ref) {\n const style = color ? ({ '--mu-badge-color': color } as CSSProperties) : undefined;\n return useRender({\n defaultTagName: 'span',\n render,\n ref,\n props: mergeProps<'span'>({ className: badgeClasses({ tone }), style, children: (\n <>\n {icon}\n {children != null && <span className=\"mu-badge-label\">{children}</span>}\n </>\n ) }, props),\n });\n});\n"],
5
+ "mappings": ";AAAA,OAAS,cAAAA,MAAkB,6BAC3B,OAAS,aAAAC,MAAiB,4BAC1B,OAAS,cAAAC,MAAsC,QAC/C,OAAS,MAAAC,MAAU,+BAoCT,mBAAAC,EAEuB,OAAAC,EAFvB,QAAAC,MAAA,oBAZH,SAASC,EAAa,CAAE,KAAAC,EAAO,SAAU,EAAyB,CAAC,EAAG,CAC3E,OAAOL,EAAG,WAAY,YAAYK,CAAI,GAAI,UAAW,UAAW,eAAe,CACjF,CAGO,IAAMC,EAAQP,EAAwC,SAAe,CAAE,KAAAM,EAAO,UAAW,KAAAE,EAAM,MAAAC,EAAO,OAAAC,EAAQ,SAAAC,EAAU,GAAGC,CAAM,EAAGC,EAAK,CAC9I,IAAMC,EAAQL,EAAS,CAAE,mBAAoBA,CAAM,EAAsB,OACzE,OAAOV,EAAU,CACf,eAAgB,OAChB,OAAAW,EACA,IAAAG,EACA,MAAOf,EAAmB,CAAE,UAAWO,EAAa,CAAE,KAAAC,CAAK,CAAC,EAAG,MAAAQ,EAAO,SAChEV,EAAAF,EAAA,CACG,UAAAM,EACAG,GAAY,MAAQR,EAAC,QAAK,UAAU,iBAAkB,SAAAQ,EAAS,GAClE,CACA,EAAGC,CAAK,CAChB,CAAC,CACH,CAAC",
6
+ "names": ["mergeProps", "useRender", "forwardRef", "cx", "Fragment", "jsx", "jsxs", "badgeClasses", "tone", "Badge", "icon", "color", "render", "children", "props", "ref", "style"]
7
7
  }
@@ -1,3 +1,3 @@
1
1
  'use client';
2
- import{Menu as t}from"@base-ui/react/menu";import{Check as b,ChevronRight as h}from"lucide-react";import{forwardRef as c,useId as T}from"react";import{cx as M,withClass as m}from"../../internal/class-name.js";import{splitPositioner as B}from"../../internal/popup.js";import{SizeContext as N,useRowSize as g}from"../../internal/size.js";import{menuClasses as R}from"./classes.js";import{Fragment as S,jsx as n,jsxs as f}from"react/jsx-runtime";var u=R();function D({size:a,...o}){let e=g(a);return n(N.Provider,{value:e,children:n(t.Root,{...o})})}var H=c(function({className:o,...e},r){return n(t.Trigger,{ref:r,...e,className:m("mu-menu-trigger",o)})}),y=c(function({container:o,className:e,...r},s){let i=g(),[p,l]=B(r);return n(t.Portal,{container:o,children:n(t.Positioner,{sideOffset:4,...p,className:"mu-positioner",children:n(t.Popup,{ref:s,...l,className:m(R({size:i}).popup,e)})})})});function x({icon:a,shortcut:o,description:e,children:r}){let s=T(),i=e!=null&&e!==!1,p=n("span",{className:u.label,id:i?`${s}-label`:void 0,children:r}),l=f(S,{children:[a,i?f("span",{className:u.text,children:[p,n("span",{className:u.description,id:`${s}-description`,children:e})]}):p,o!==void 0?n("span",{className:u.shortcut,children:o}):null]}),d=i?{"aria-labelledby":`${s}-label`,"aria-describedby":`${s}-description`}:null;return[l,d]}var z=c(function({icon:o,shortcut:e,description:r,danger:s=!1,className:i,children:p,...l},d){let[P,I]=x({icon:o,shortcut:e,description:r,children:p});return n(t.Item,{ref:d,...I,...l,className:m(s?u.dangerItem:u.item,i),children:P})}),$=c(function({icon:o,shortcut:e,description:r,className:s,children:i,...p},l){let[d,P]=x({icon:o,shortcut:e,description:r,children:i});return f(t.CheckboxItem,{ref:l,...P,...p,className:m(M(u.item,"mu-menu-checkbox-item"),s),children:[d,n("span",{className:"mu-menu-indicator",children:n(t.CheckboxItemIndicator,{render:n(b,{"aria-hidden":!0})})})]})}),A=c(function({className:o,...e},r){return n(t.RadioGroup,{ref:r,...e,className:m("mu-menu-radio-group",o)})}),O=c(function({icon:o,shortcut:e,description:r,className:s,children:i,...p},l){let[d,P]=x({icon:o,shortcut:e,description:r,children:i});return f(t.RadioItem,{ref:l,...P,...p,className:m(M(u.item,"mu-menu-radio-item"),s),children:[d,n("span",{className:"mu-menu-indicator",children:n(t.RadioItemIndicator,{render:n(b,{"aria-hidden":!0})})})]})}),q=c(function({className:o,...e},r){return n(t.Group,{ref:r,...e,className:m("mu-menu-group",o)})}),F=c(function({className:o,...e},r){return n(t.GroupLabel,{ref:r,...e,className:m(u.groupLabel,o)})}),J=c(function({className:o,...e},r){return n(t.Separator,{ref:r,...e,className:m(u.separator,o)})}),K=t.SubmenuRoot,Q=c(function({icon:o,className:e,children:r,...s},i){let[p]=x({icon:o,children:r});return f(t.SubmenuTrigger,{ref:i,...s,className:m(M(u.item,"mu-menu-submenu-trigger"),e),children:[p,n(h,{className:"mu-menu-chevron","aria-hidden":!0})]})});export{$ as CheckboxItem,q as Group,F as GroupLabel,z as Item,y as Popup,A as RadioGroup,O as RadioItem,D as Root,J as Separator,K as SubmenuRoot,Q as SubmenuTrigger,H as Trigger};
2
+ import{Menu as s}from"@base-ui/react/menu";import{Check as S,ChevronRight as B}from"lucide-react";import{createContext as N,forwardRef as m,useCallback as I,useContext as C,useId as L,useRef as G}from"react";import{cx as g,withClass as l}from"../../internal/class-name.js";import{splitPositioner as E}from"../../internal/popup.js";import{SizeContext as k,useRowSize as T}from"../../internal/size.js";import{menuClasses as h}from"./classes.js";import{Fragment as w,jsx as r,jsxs as x}from"react/jsx-runtime";var p=h(),R=N(!1);function F({size:a,...o}){let e=T(a);return r(k.Provider,{value:e,children:r(R.Provider,{value:!1,children:r(s.Root,{...o})})})}var q=m(function({className:o,...e},n){return r(s.Trigger,{ref:n,...e,className:l("mu-menu-trigger",o)})}),J=m(function({container:o,className:e,...n},t){let u=T(),i=C(R),c=G(null),d=I(f=>{c.current=f,typeof t=="function"?t(f):t&&(t.current=f)},[t]),P=I(()=>{let f=c.current;return f&&-parseFloat(getComputedStyle(f).paddingTop)||0},[]),[b,v]=E(n);return r(s.Portal,{container:o,children:r(s.Positioner,{sideOffset:4,alignOffset:i?P:0,...b,className:"mu-positioner",children:r(s.Popup,{ref:d,...v,className:l(h({size:u}).popup,e)})})})});function M({icon:a,shortcut:o,description:e,children:n}){let t=L(),u=e!=null&&e!==!1,i=r("span",{className:p.label,id:u?`${t}-label`:void 0,children:n}),c=x(w,{children:[a,u?x("span",{className:p.text,children:[i,r("span",{className:p.description,id:`${t}-description`,children:e})]}):i,o!==void 0?r("span",{className:p.shortcut,children:o}):null]}),d=u?{"aria-labelledby":`${t}-label`,"aria-describedby":`${t}-description`}:null;return[c,d]}var K=m(function({icon:o,shortcut:e,description:n,danger:t=!1,className:u,children:i,...c},d){let[P,b]=M({icon:o,shortcut:e,description:n,children:i});return r(s.Item,{ref:d,...b,...c,className:l(t?p.dangerItem:p.item,u),children:P})}),Q=m(function({icon:o,shortcut:e,description:n,className:t,children:u,...i},c){let[d,P]=M({icon:o,shortcut:e,description:n,children:u});return x(s.CheckboxItem,{ref:c,...P,...i,className:l(g(p.item,"mu-menu-checkbox-item"),t),children:[d,r("span",{className:"mu-menu-indicator",children:r(s.CheckboxItemIndicator,{render:r(S,{"aria-hidden":!0})})})]})}),U=m(function({className:o,...e},n){return r(s.RadioGroup,{ref:n,...e,className:l("mu-menu-radio-group",o)})}),V=m(function({icon:o,shortcut:e,description:n,className:t,children:u,...i},c){let[d,P]=M({icon:o,shortcut:e,description:n,children:u});return x(s.RadioItem,{ref:c,...P,...i,className:l(g(p.item,"mu-menu-radio-item"),t),children:[d,r("span",{className:"mu-menu-indicator",children:r(s.RadioItemIndicator,{render:r(S,{"aria-hidden":!0})})})]})}),W=m(function({className:o,...e},n){return r(s.Group,{ref:n,...e,className:l("mu-menu-group",o)})}),X=m(function({className:o,...e},n){return r(s.GroupLabel,{ref:n,...e,className:l(p.groupLabel,o)})}),Y=m(function({className:o,...e},n){return r(s.Separator,{ref:n,...e,className:l(p.separator,o)})});function Z(a){return r(R.Provider,{value:!0,children:r(s.SubmenuRoot,{...a})})}var _=m(function({icon:o,className:e,children:n,...t},u){let[i]=M({icon:o,children:n});return x(s.SubmenuTrigger,{ref:u,...t,className:l(g(p.item,"mu-menu-submenu-trigger"),e),children:[i,r(B,{className:"mu-menu-chevron","aria-hidden":!0})]})});export{Q as CheckboxItem,W as Group,X as GroupLabel,K as Item,J as Popup,U as RadioGroup,V as RadioItem,F as Root,Y as Separator,Z as SubmenuRoot,_ as SubmenuTrigger,q as Trigger};
3
3
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/menu/index.tsx"],
4
- "sourcesContent": ["import { Menu as BaseMenu } from '@base-ui/react/menu';\nimport { Check, ChevronRight } from 'lucide-react';\nimport { forwardRef, useId, type ReactNode } from 'react';\nimport { cx, withClass } from '../../internal/class-name';\nimport { splitPositioner } from '../../internal/popup';\nimport { SizeContext, useRowSize } from '../../internal/size';\nimport type { IconElement, Size } from '../../types';\nimport { menuClasses } from './classes';\n\nconst classes = /* @__PURE__ */ menuClasses();\n\nexport interface RootProps extends BaseMenu.Root.Props {\n /** Row height of every item: 24, 32 or 40px. */\n size?: Exclude<Size, 'xs'>;\n}\n\n/** Groups a trigger and its menu. */\nexport function Root({ size, ...props }: RootProps) {\n const resolved = useRowSize(size);\n return (\n <SizeContext.Provider value={resolved}>\n <BaseMenu.Root {...props} />\n </SizeContext.Provider>\n );\n}\n\nexport interface TriggerProps extends BaseMenu.Trigger.Props {}\n\n/** Opens the menu. Usually `render={<Button variant=\"ghost\" icon={<Ellipsis />} aria-label=\"More actions\" />}`. */\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(function MenuTrigger({ className, ...props }, ref) {\n return <BaseMenu.Trigger ref={ref} {...props} className={withClass('mu-menu-trigger', className)} />;\n});\n\ntype PositionerProps = Pick<\n BaseMenu.Positioner.Props,\n 'side' | 'align' | 'collisionAvoidance' | 'collisionBoundary' | 'sticky' | 'anchor' | 'positionMethod' | 'disableAnchorTracking'\n>;\n\nexport interface PopupProps extends BaseMenu.Popup.Props, PositionerProps {\n /** Where the menu is portaled to. Default `document.body`. */\n container?: BaseMenu.Portal.Props['container'];\n}\n\n/** The list of items. Also the popup of a submenu, inside `SubmenuRoot`. */\nexport const Popup = forwardRef<HTMLDivElement, PopupProps>(function MenuPopup({ container, className, ...props }, ref) {\n const size = useRowSize();\n const [positioner, rest] = splitPositioner(props);\n return (\n <BaseMenu.Portal container={container}>\n <BaseMenu.Positioner sideOffset={4} {...positioner} className=\"mu-positioner\">\n <BaseMenu.Popup ref={ref} {...rest} className={withClass(menuClasses({ size }).popup, className)} />\n </BaseMenu.Positioner>\n </BaseMenu.Portal>\n );\n});\n\ninterface RowProps {\n /** A Lucide element before the label. */\n icon?: IconElement;\n /** A keyboard shortcut at the end of the row, such as \"\u2318 D\". */\n shortcut?: ReactNode;\n /** A line of `ink-muted` text under the label, which makes the row two lines tall. Screen readers read it as the item's description. */\n description?: ReactNode;\n children?: ReactNode;\n}\n\n/**\n * The shared inside of every row: icon, label, shortcut. With a description,\n * the label and description stack, and the item is named by the label and\n * described by the description.\n */\nfunction useRow({ icon, shortcut, description, children }: RowProps) {\n const id = useId();\n const hasDescription = description !== undefined && description !== null && description !== false;\n const label = <span className={classes.label} id={hasDescription ? `${id}-label` : undefined}>{children}</span>;\n const content = (\n <>\n {icon}\n {hasDescription ? (\n <span className={classes.text}>\n {label}\n <span className={classes.description} id={`${id}-description`}>{description}</span>\n </span>\n ) : (\n label\n )}\n {shortcut !== undefined ? <span className={classes.shortcut}>{shortcut}</span> : null}\n </>\n );\n const aria = hasDescription ? { 'aria-labelledby': `${id}-label`, 'aria-describedby': `${id}-description` } : null;\n return [content, aria] as const;\n}\n\nexport interface ItemProps extends BaseMenu.Item.Props, RowProps {\n /** A destructive action: red text. Put it last, after a Separator. */\n danger?: boolean;\n}\n\n/** One action. */\nexport const Item = forwardRef<HTMLDivElement, ItemProps>(function MenuItem({ icon, shortcut, description, danger = false, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.Item ref={ref} {...aria} {...props} className={withClass(danger ? classes.dangerItem : classes.item, className)}>\n {row}\n </BaseMenu.Item>\n );\n});\n\nexport interface CheckboxItemProps extends BaseMenu.CheckboxItem.Props, RowProps {}\n\n/** An option that turns on or off, with a check at the end. Stays open on click. */\nexport const CheckboxItem = forwardRef<HTMLDivElement, CheckboxItemProps>(function MenuCheckboxItem({ icon, shortcut, description, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.CheckboxItem ref={ref} {...aria} {...props} className={withClass(cx(classes.item, 'mu-menu-checkbox-item'), className)}>\n {row}\n <span className=\"mu-menu-indicator\">\n <BaseMenu.CheckboxItemIndicator render={<Check aria-hidden />} />\n </span>\n </BaseMenu.CheckboxItem>\n );\n});\n\nexport interface RadioGroupProps extends BaseMenu.RadioGroup.Props {}\n\n/** Groups RadioItems: exactly one is chosen. */\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(function MenuRadioGroup({ className, ...props }, ref) {\n return <BaseMenu.RadioGroup ref={ref} {...props} className={withClass('mu-menu-radio-group', className)} />;\n});\n\nexport interface RadioItemProps extends BaseMenu.RadioItem.Props, RowProps {}\n\n/** One choice in a RadioGroup, with a check at the end when chosen. Stays open on click. */\nexport const RadioItem = forwardRef<HTMLDivElement, RadioItemProps>(function MenuRadioItem({ icon, shortcut, description, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.RadioItem ref={ref} {...aria} {...props} className={withClass(cx(classes.item, 'mu-menu-radio-item'), className)}>\n {row}\n <span className=\"mu-menu-indicator\">\n <BaseMenu.RadioItemIndicator render={<Check aria-hidden />} />\n </span>\n </BaseMenu.RadioItem>\n );\n});\n\nexport interface GroupProps extends BaseMenu.Group.Props {}\n\n/** A labeled set of items. */\nexport const Group = forwardRef<HTMLDivElement, GroupProps>(function MenuGroup({ className, ...props }, ref) {\n return <BaseMenu.Group ref={ref} {...props} className={withClass('mu-menu-group', className)} />;\n});\n\nexport interface GroupLabelProps extends BaseMenu.GroupLabel.Props {}\n\n/** The name of a Group or RadioGroup. */\nexport const GroupLabel = forwardRef<HTMLDivElement, GroupLabelProps>(function MenuGroupLabel({ className, ...props }, ref) {\n return <BaseMenu.GroupLabel ref={ref} {...props} className={withClass(classes.groupLabel, className)} />;\n});\n\nexport interface SeparatorProps extends BaseMenu.Separator.Props {}\n\n/** A line between groups of items. */\nexport const Separator = forwardRef<HTMLDivElement, SeparatorProps>(function MenuSeparator({ className, ...props }, ref) {\n return <BaseMenu.Separator ref={ref} {...props} className={withClass(classes.separator, className)} />;\n});\n\nexport type SubmenuRootProps = BaseMenu.SubmenuRoot.Props;\n\n/** Holds a SubmenuTrigger and its own Popup. */\nexport const SubmenuRoot = BaseMenu.SubmenuRoot;\n\nexport interface SubmenuTriggerProps extends BaseMenu.SubmenuTrigger.Props {\n icon?: IconElement;\n children?: ReactNode;\n}\n\n/** The row that opens a submenu, with a chevron at the end. */\nexport const SubmenuTrigger = forwardRef<HTMLDivElement, SubmenuTriggerProps>(function MenuSubmenuTrigger({ icon, className, children, ...props }, ref) {\n const [row] = useRow({ icon, children });\n return (\n <BaseMenu.SubmenuTrigger ref={ref} {...props} className={withClass(cx(classes.item, 'mu-menu-submenu-trigger'), className)}>\n {row}\n <ChevronRight className=\"mu-menu-chevron\" aria-hidden />\n </BaseMenu.SubmenuTrigger>\n );\n});\n"],
5
- "mappings": "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",
6
- "names": ["BaseMenu", "Check", "ChevronRight", "forwardRef", "useId", "cx", "withClass", "splitPositioner", "SizeContext", "useRowSize", "menuClasses", "Fragment", "jsx", "jsxs", "classes", "Root", "size", "props", "resolved", "Trigger", "className", "ref", "Popup", "container", "positioner", "rest", "useRow", "icon", "shortcut", "description", "children", "id", "hasDescription", "label", "content", "aria", "Item", "danger", "row", "CheckboxItem", "RadioGroup", "RadioItem", "Group", "GroupLabel", "Separator", "SubmenuRoot", "SubmenuTrigger"]
4
+ "sourcesContent": ["import { Menu as BaseMenu } from '@base-ui/react/menu';\nimport { Check, ChevronRight } from 'lucide-react';\nimport { createContext, forwardRef, useCallback, useContext, useId, useRef, type ReactNode } from 'react';\nimport { cx, withClass } from '../../internal/class-name';\nimport { splitPositioner } from '../../internal/popup';\nimport { SizeContext, useRowSize } from '../../internal/size';\nimport type { IconElement, Size } from '../../types';\nimport { menuClasses } from './classes';\n\nconst classes = /* @__PURE__ */ menuClasses();\n\nexport interface RootProps extends BaseMenu.Root.Props {\n /** Row height of every item: 24, 32 or 40px. */\n size?: Exclude<Size, 'xs'>;\n}\n\n/** True inside a SubmenuRoot, so its Popup lines up with the trigger row. */\nconst SubmenuContext = /* @__PURE__ */ createContext(false);\n\n/** Groups a trigger and its menu. */\nexport function Root({ size, ...props }: RootProps) {\n const resolved = useRowSize(size);\n return (\n <SizeContext.Provider value={resolved}>\n <SubmenuContext.Provider value={false}>\n <BaseMenu.Root {...props} />\n </SubmenuContext.Provider>\n </SizeContext.Provider>\n );\n}\n\nexport interface TriggerProps extends BaseMenu.Trigger.Props {}\n\n/** Opens the menu. Usually `render={<Button variant=\"ghost\" icon={<Ellipsis />} aria-label=\"More actions\" />}`. */\nexport const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(function MenuTrigger({ className, ...props }, ref) {\n return <BaseMenu.Trigger ref={ref} {...props} className={withClass('mu-menu-trigger', className)} />;\n});\n\ntype PositionerProps = Pick<\n BaseMenu.Positioner.Props,\n 'side' | 'align' | 'collisionAvoidance' | 'collisionBoundary' | 'sticky' | 'anchor' | 'positionMethod' | 'disableAnchorTracking'\n>;\n\nexport interface PopupProps extends BaseMenu.Popup.Props, PositionerProps {\n /** Where the menu is portaled to. Default `document.body`. */\n container?: BaseMenu.Portal.Props['container'];\n}\n\n/**\n * The list of items. Also the popup of a submenu, inside `SubmenuRoot`: there\n * it moves along the trigger by its own top padding (read when it is placed,\n * so it follows `space-1`), which lines its first row up with the trigger row,\n * or its last row when it opens upward.\n */\nexport const Popup = forwardRef<HTMLDivElement, PopupProps>(function MenuPopup({ container, className, ...props }, ref) {\n const size = useRowSize();\n const submenu = useContext(SubmenuContext);\n const popupRef = useRef<HTMLDivElement | null>(null);\n const setRef = useCallback(\n (node: HTMLDivElement | null) => {\n popupRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n },\n [ref],\n );\n // Base UI reverses the sign when the submenu aligns to the trigger's end, so one value serves both.\n const alignOffset = useCallback(() => {\n const popup = popupRef.current;\n return popup ? -parseFloat(getComputedStyle(popup).paddingTop) || 0 : 0;\n }, []);\n const [positioner, rest] = splitPositioner(props);\n return (\n <BaseMenu.Portal container={container}>\n <BaseMenu.Positioner sideOffset={4} alignOffset={submenu ? alignOffset : 0} {...positioner} className=\"mu-positioner\">\n <BaseMenu.Popup ref={setRef} {...rest} className={withClass(menuClasses({ size }).popup, className)} />\n </BaseMenu.Positioner>\n </BaseMenu.Portal>\n );\n});\n\ninterface RowProps {\n /** A Lucide element before the label. */\n icon?: IconElement;\n /** A keyboard shortcut at the end of the row, such as \"\u2318 D\". */\n shortcut?: ReactNode;\n /** A line of `ink-muted` text under the label, which makes the row two lines tall. Screen readers read it as the item's description. */\n description?: ReactNode;\n children?: ReactNode;\n}\n\n/**\n * The shared inside of every row: icon, label, shortcut. With a description,\n * the label and description stack, and the item is named by the label and\n * described by the description.\n */\nfunction useRow({ icon, shortcut, description, children }: RowProps) {\n const id = useId();\n const hasDescription = description !== undefined && description !== null && description !== false;\n const label = <span className={classes.label} id={hasDescription ? `${id}-label` : undefined}>{children}</span>;\n const content = (\n <>\n {icon}\n {hasDescription ? (\n <span className={classes.text}>\n {label}\n <span className={classes.description} id={`${id}-description`}>{description}</span>\n </span>\n ) : (\n label\n )}\n {shortcut !== undefined ? <span className={classes.shortcut}>{shortcut}</span> : null}\n </>\n );\n const aria = hasDescription ? { 'aria-labelledby': `${id}-label`, 'aria-describedby': `${id}-description` } : null;\n return [content, aria] as const;\n}\n\nexport interface ItemProps extends BaseMenu.Item.Props, RowProps {\n /** A destructive action: red text. Put it last, after a Separator. */\n danger?: boolean;\n}\n\n/** One action. */\nexport const Item = forwardRef<HTMLDivElement, ItemProps>(function MenuItem({ icon, shortcut, description, danger = false, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.Item ref={ref} {...aria} {...props} className={withClass(danger ? classes.dangerItem : classes.item, className)}>\n {row}\n </BaseMenu.Item>\n );\n});\n\nexport interface CheckboxItemProps extends BaseMenu.CheckboxItem.Props, RowProps {}\n\n/** An option that turns on or off, with a check at the end. Stays open on click. */\nexport const CheckboxItem = forwardRef<HTMLDivElement, CheckboxItemProps>(function MenuCheckboxItem({ icon, shortcut, description, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.CheckboxItem ref={ref} {...aria} {...props} className={withClass(cx(classes.item, 'mu-menu-checkbox-item'), className)}>\n {row}\n <span className=\"mu-menu-indicator\">\n <BaseMenu.CheckboxItemIndicator render={<Check aria-hidden />} />\n </span>\n </BaseMenu.CheckboxItem>\n );\n});\n\nexport interface RadioGroupProps extends BaseMenu.RadioGroup.Props {}\n\n/** Groups RadioItems: exactly one is chosen. */\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(function MenuRadioGroup({ className, ...props }, ref) {\n return <BaseMenu.RadioGroup ref={ref} {...props} className={withClass('mu-menu-radio-group', className)} />;\n});\n\nexport interface RadioItemProps extends BaseMenu.RadioItem.Props, RowProps {}\n\n/** One choice in a RadioGroup, with a check at the end when chosen. Stays open on click. */\nexport const RadioItem = forwardRef<HTMLDivElement, RadioItemProps>(function MenuRadioItem({ icon, shortcut, description, className, children, ...props }, ref) {\n const [row, aria] = useRow({ icon, shortcut, description, children });\n return (\n <BaseMenu.RadioItem ref={ref} {...aria} {...props} className={withClass(cx(classes.item, 'mu-menu-radio-item'), className)}>\n {row}\n <span className=\"mu-menu-indicator\">\n <BaseMenu.RadioItemIndicator render={<Check aria-hidden />} />\n </span>\n </BaseMenu.RadioItem>\n );\n});\n\nexport interface GroupProps extends BaseMenu.Group.Props {}\n\n/** A labeled set of items. */\nexport const Group = forwardRef<HTMLDivElement, GroupProps>(function MenuGroup({ className, ...props }, ref) {\n return <BaseMenu.Group ref={ref} {...props} className={withClass('mu-menu-group', className)} />;\n});\n\nexport interface GroupLabelProps extends BaseMenu.GroupLabel.Props {}\n\n/** The name of a Group or RadioGroup. */\nexport const GroupLabel = forwardRef<HTMLDivElement, GroupLabelProps>(function MenuGroupLabel({ className, ...props }, ref) {\n return <BaseMenu.GroupLabel ref={ref} {...props} className={withClass(classes.groupLabel, className)} />;\n});\n\nexport interface SeparatorProps extends BaseMenu.Separator.Props {}\n\n/** A line between groups of items. */\nexport const Separator = forwardRef<HTMLDivElement, SeparatorProps>(function MenuSeparator({ className, ...props }, ref) {\n return <BaseMenu.Separator ref={ref} {...props} className={withClass(classes.separator, className)} />;\n});\n\nexport type SubmenuRootProps = BaseMenu.SubmenuRoot.Props;\n\n/** Holds a SubmenuTrigger and its own Popup. */\nexport function SubmenuRoot(props: SubmenuRootProps) {\n return (\n <SubmenuContext.Provider value={true}>\n <BaseMenu.SubmenuRoot {...props} />\n </SubmenuContext.Provider>\n );\n}\n\nexport interface SubmenuTriggerProps extends BaseMenu.SubmenuTrigger.Props {\n icon?: IconElement;\n children?: ReactNode;\n}\n\n/** The row that opens a submenu, with a chevron at the end. */\nexport const SubmenuTrigger = forwardRef<HTMLDivElement, SubmenuTriggerProps>(function MenuSubmenuTrigger({ icon, className, children, ...props }, ref) {\n const [row] = useRow({ icon, children });\n return (\n <BaseMenu.SubmenuTrigger ref={ref} {...props} className={withClass(cx(classes.item, 'mu-menu-submenu-trigger'), className)}>\n {row}\n <ChevronRight className=\"mu-menu-chevron\" aria-hidden />\n </BaseMenu.SubmenuTrigger>\n );\n});\n"],
5
+ "mappings": "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",
6
+ "names": ["BaseMenu", "Check", "ChevronRight", "createContext", "forwardRef", "useCallback", "useContext", "useId", "useRef", "cx", "withClass", "splitPositioner", "SizeContext", "useRowSize", "menuClasses", "Fragment", "jsx", "jsxs", "classes", "SubmenuContext", "Root", "size", "props", "resolved", "Trigger", "className", "ref", "Popup", "container", "submenu", "popupRef", "setRef", "node", "alignOffset", "popup", "positioner", "rest", "useRow", "icon", "shortcut", "description", "children", "id", "hasDescription", "label", "content", "aria", "Item", "danger", "row", "CheckboxItem", "RadioGroup", "RadioItem", "Group", "GroupLabel", "Separator", "SubmenuRoot", "SubmenuTrigger"]
7
7
  }
package/dist/styles.css CHANGED
@@ -1 +1 @@
1
- @layer mu{@font-face{font-family:"Segoe UI (mu)";font-weight:400;src:local("Segoe UI"),local("SegoeUI")}@font-face{font-family:"Segoe UI (mu)";font-weight:400;font-style:italic;src:local("Segoe UI Italic"),local("SegoeUI-Italic")}@font-face{font-family:"Segoe UI (mu)";font-weight:500 600;src:local("Segoe UI Semibold"),local("SegoeUI-Semibold")}@font-face{font-family:"Segoe UI (mu)";font-weight:500 600;font-style:italic;src:local("Segoe UI Semibold Italic"),local("SegoeUI-SemiboldItalic")}@font-face{font-family:"Segoe UI (mu)";font-weight:700;src:local("Segoe UI Bold"),local("SegoeUI-Bold")}@font-face{font-family:"Segoe UI (mu)";font-weight:700;font-style:italic;src:local("Segoe UI Bold Italic"),local("SegoeUI-BoldItalic")}.mu-s-xs{--mu-row-height: var(--mu-control-xs);--mu-row-padding: 6px;--mu-row-padding-icon: var(--mu-space-1);--mu-row-font-size: 12px;--mu-row-line-height: 16px;--mu-row-field-font-size: 12px;--mu-row-field-line-height: 16px;--mu-row-radius: var(--mu-radius-sm);--mu-row-gap: var(--mu-space-1);--mu-row-icon: var(--mu-icon-xs);--mu-row-icon-stroke: var(--mu-icon-stroke);--mu-row-check-box: 14px}.mu-s-sm{--mu-row-height: var(--mu-control-sm);--mu-row-padding: var(--mu-space-2);--mu-row-padding-icon: 6px;--mu-row-font-size: 13px;--mu-row-line-height: 18px;--mu-row-field-font-size: 13px;--mu-row-field-line-height: 18px;--mu-row-radius: var(--mu-radius-sm);--mu-row-gap: var(--mu-space-1);--mu-row-icon: var(--mu-icon-sm);--mu-row-icon-stroke: var(--mu-icon-stroke);--mu-row-check-box: 16px}.mu-s-md{--mu-row-height: var(--mu-control-md);--mu-row-padding: var(--mu-space-3);--mu-row-padding-icon: 10px;--mu-row-font-size: 14px;--mu-row-line-height: 20px;--mu-row-field-font-size: 14px;--mu-row-field-line-height: 20px;--mu-row-radius: var(--mu-radius-md);--mu-row-gap: 6px;--mu-row-icon: var(--mu-icon-md);--mu-row-icon-stroke: var(--mu-icon-stroke);--mu-row-check-box: 18px}@media(pointer:coarse){.mu-s-xs,.mu-s-sm,.mu-s-md{--mu-row-field-font-size: 16px;--mu-row-field-line-height: 20px}}.mu-compact{--mu-control-md: var(--mu-control-compact)}.mu-recessed{background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track)}.mu-raised{background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),rgba(255,255,255,0) 60%);box-shadow:var(--mu-shadow-raised)}.mu-key{background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),rgba(255,255,255,0) 60%);box-shadow:var(--mu-shadow-key)}.mu-popup{background:var(--mu-surface);box-shadow:var(--mu-shadow-pop);border-radius:var(--mu-radius-xl)}.mu-positioner{z-index:var(--mu-layer-popup);outline:0}.mu-popup-motion{transition:opacity var(--mu-duration-fade) var(--mu-ease-out),translate var(--mu-duration-fade) var(--mu-ease-out)}.mu-popup-motion[data-starting-style],.mu-popup-motion[data-ending-style]{opacity:0;translate:0 var(--mu-space-1)}.mu-popup-motion[data-instant]{transition:none}@media(prefers-reduced-motion:reduce){.mu-popup-motion[data-starting-style],.mu-popup-motion[data-ending-style]{translate:none}}.mu-base{font-family:var(--mu-font-sans);font-size:var(--mu-row-font-size, 14px);line-height:var(--mu-row-line-height, 20px);font-weight:500;letter-spacing:0;color:var(--mu-ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent}.mu-base ::selection,.mu-base::selection{background:var(--mu-selection)}.mu-visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.mu-focus:focus-visible{outline:var(--mu-focus-width) solid var(--mu-focus);outline-offset:var(--mu-focus-offset)}.mu-hit{position:relative}@media(pointer:coarse){.mu-hit:after{content:"";position:absolute;left:50%;top:50%;width:max(100%,var(--mu-hit-area));height:max(100%,var(--mu-hit-area));transform:translate(-50%,-50%)}}.mu-icon,.mu-icon-xs,.mu-icon-sm,.mu-icon-md,.mu-base svg.lucide,.mu-prose svg.lucide{width:var(--mu-row-icon, 16px);height:var(--mu-row-icon, 16px);flex:none;display:block;stroke-width:var(--mu-row-icon-stroke, var(--mu-icon-stroke))}.mu-icon *,.mu-icon-xs *,.mu-icon-sm *,.mu-icon-md *,.mu-base svg.lucide *,.mu-prose svg.lucide *{vector-effect:non-scaling-stroke}.mu-icon-xs{--mu-row-icon: var(--mu-icon-xs);--mu-row-icon-stroke: var(--mu-icon-stroke)}.mu-icon-sm{--mu-row-icon: var(--mu-icon-sm);--mu-row-icon-stroke: var(--mu-icon-stroke)}.mu-icon-md{--mu-row-icon: var(--mu-icon-md);--mu-row-icon-stroke: var(--mu-icon-stroke)}.mu-label-xs{font-family:var(--mu-font-sans);font-size:12px;line-height:16px;font-weight:500}.mu-caption{font-family:var(--mu-font-sans);font-size:13px;line-height:18px;font-weight:400}.mu-label-sm{font-family:var(--mu-font-sans);font-size:13px;line-height:18px;font-weight:500}.mu-body{font-family:var(--mu-font-sans);font-size:14px;line-height:20px;font-weight:400}.mu-label{font-family:var(--mu-font-sans);font-size:14px;line-height:20px;font-weight:500}.mu-title{font-family:var(--mu-font-display);font-size:16px;line-height:24px;font-weight:500;text-wrap:balance}.mu-heading{font-family:var(--mu-font-display);font-size:20px;line-height:28px;font-weight:500;text-wrap:balance}.mu-display{font-family:var(--mu-font-display);font-size:32px;line-height:40px;font-weight:500;letter-spacing:-.02em;text-wrap:balance}.mu-prose{--prose-fs: 16px;--prose-lh: 24px;--prose-h1: 24px;--prose-h1-lh: 32px;--prose-h2: 20px;--prose-h2-lh: 28px;--prose-h3: 16px;--prose-h3-lh: 24px;--prose-head: 13px;--prose-head-lh: 18px}.mu-prose-sm{--prose-fs: 14px;--prose-lh: 22px;--prose-h1: 16px;--prose-h1-lh: 24px;--prose-h2: 14px;--prose-h2-lh: 22px;--prose-h3: 14px;--prose-h3-lh: 22px}}@layer mu{.mu-spinner{display:inline-block;flex:none;box-sizing:border-box;width:var(--mu-row-icon);height:var(--mu-row-icon);border:var(--mu-row-icon-stroke) solid currentColor;border-top-color:transparent;border-radius:var(--mu-radius-full);animation:mu-spin var(--mu-duration-spin) linear infinite}@keyframes mu-spin{to{rotate:1turn}}}@layer mu{.mu-button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--mu-row-gap);box-sizing:border-box;height:var(--mu-row-height);margin:0;padding:0 var(--mu-row-padding);border:0;border-radius:var(--mu-row-radius);color:var(--mu-ink);background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),transparent 60%);box-shadow:var(--mu-shadow-raised);white-space:nowrap;text-decoration:none;cursor:pointer;user-select:none;transition-property:background-color,box-shadow,color,translate;transition-duration:var(--mu-duration-press);transition-timing-function:var(--mu-ease-out)}.mu-button:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-button:where(:has(>.mu-button-label+svg)){padding-inline-end:var(--mu-row-padding-icon)}.mu-button.mu-button-icon{width:var(--mu-row-height);padding:0}.mu-button-label{min-width:0;overflow:hidden;text-overflow:ellipsis}@media(hover:hover){.mu-button:hover:not([data-disabled]){background-color:var(--mu-key-hover)}.mu-button-primary:hover:not([data-disabled]){background-color:var(--mu-primary-hover)}.mu-button-danger:hover:not([data-disabled]){background-color:var(--mu-danger-key);filter:brightness(1.08)}.mu-button-ghost:hover:not([data-disabled]){background-color:var(--mu-hover);color:var(--mu-ink)}}.mu-button:active:not([data-disabled]){translate:0 .5px;box-shadow:var(--mu-shadow-pressed)}.mu-button-primary{color:var(--mu-on-primary);background-color:var(--mu-primary)}.mu-button-danger{color:var(--mu-on-danger);background-color:var(--mu-danger-key)}.mu-button-ghost{color:var(--mu-ink-muted);background-color:transparent;background-image:none;box-shadow:none}.mu-button-ghost[data-popup-open]{background-color:var(--mu-hover);color:var(--mu-ink)}.mu-button-ghost:active:not([data-disabled]){translate:none;background-color:var(--mu-well);box-shadow:var(--mu-shadow-track)}.mu-button[data-disabled]:not([data-loading]){opacity:.45;cursor:not-allowed}.mu-button[data-loading]{cursor:progress}.mu-button[data-loading]>:not(.mu-spinner){opacity:0}.mu-button>.mu-spinner{position:absolute;inset:0;margin:auto}@media(prefers-reduced-motion:reduce){.mu-button:active:not([data-disabled]){translate:none}}}@layer mu{.mu-kbd{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:var(--mu-control-xs);height:var(--mu-control-xs);padding:0 var(--mu-space-1);border-radius:var(--mu-radius-sm);color:var(--mu-ink-muted);background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),transparent 60%);box-shadow:var(--mu-shadow-raised);white-space:nowrap}}@layer mu{.mu-separator{flex:none;align-self:stretch;margin:0;border:0;background-color:var(--mu-line)}.mu-separator[data-orientation=horizontal]{height:1px}.mu-separator[data-orientation=vertical]{width:1px}}@layer mu{.mu-badge{display:inline-flex;align-items:center;gap:var(--mu-space-1);box-sizing:border-box;height:var(--mu-control-xs);padding:0 var(--mu-row-padding);border-radius:var(--mu-radius-sm);white-space:nowrap;vertical-align:middle}.mu-badge-neutral{--mu-badge-tint: oklch(from var(--mu-badge-color) clamp(.5, l, .75) c h / 18%);color:var(--mu-ink);background-color:var(--mu-badge-tint, var(--mu-well))}@supports not (color: oklch(from red l c h)){.mu-badge-neutral{--mu-badge-tint: color-mix(in srgb, var(--mu-badge-color) 18%, transparent)}}.mu-badge-primary{color:var(--mu-on-primary);background-color:var(--mu-primary)}.mu-badge-outline{color:var(--mu-ink-muted);box-shadow:inset 0 0 0 1px var(--mu-edge)}.mu-badge-success{color:var(--mu-success);background-color:var(--mu-success-soft)}.mu-badge-warning{color:var(--mu-warning);background-color:var(--mu-warning-soft)}.mu-badge-danger{color:var(--mu-danger);background-color:var(--mu-danger-soft)}}@layer mu{.mu-avatar-root{display:inline-flex;flex:none;align-items:center;justify-content:center;overflow:hidden;box-sizing:border-box;width:var(--mu-row-height);height:var(--mu-row-height);border-radius:var(--mu-radius-full);color:var(--mu-ink-muted);background-color:var(--mu-well);vertical-align:middle;user-select:none}.mu-avatar-image{width:100%;height:100%;object-fit:cover}.mu-avatar-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%}}@layer mu{.mu-link{color:var(--mu-accent);text-decoration:none;text-underline-offset:.2em;border-radius:var(--mu-radius-xs);cursor:pointer}.mu-link:hover,.mu-link:focus-visible,.mu-link-underline{text-decoration:underline}.mu-link-muted{color:var(--mu-ink-muted)}.mu-link-muted:hover{color:var(--mu-ink)}.mu-link>.mu-icon{display:inline-block;width:.85em;height:.85em;margin-inline-start:.1em;vertical-align:-.05em}}@layer mu{.mu-skeleton{box-sizing:border-box;width:100%;height:var(--mu-row-line-height);border-radius:var(--mu-radius-sm);background-color:var(--mu-well);background-image:linear-gradient(90deg,transparent 0%,var(--mu-hover) 50%,transparent 100%);background-size:200% 100%;background-repeat:no-repeat;animation:mu-shimmer var(--mu-duration-shimmer) ease-in-out infinite}.mu-skeleton-round{width:var(--mu-row-height);height:var(--mu-row-height);border-radius:var(--mu-radius-full)}@keyframes mu-shimmer{0%{background-position:150% 0}to{background-position:-50% 0}}@media(prefers-reduced-motion:reduce){.mu-skeleton{animation:none;background-image:none}}}@layer mu{.mu-field-root{display:flex;flex-direction:column;gap:var(--mu-space-1);min-width:0}.mu-field-label{color:var(--mu-ink)}.mu-field-item{display:flex}.mu-field-label:where(:has(>.mu-checkbox,>.mu-switch,>.mu-radio)){display:inline-flex;align-items:center;gap:var(--mu-space-2);font-weight:400;cursor:pointer}.mu-field-label[data-disabled]{opacity:.45;cursor:not-allowed}.mu-field-description{margin:0;color:var(--mu-ink-muted)}.mu-field-root[data-invalid]>.mu-field-description{display:none}.mu-field-horizontal{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:var(--mu-space-4);row-gap:0}.mu-field-horizontal>*{grid-column:2;grid-row:1;justify-self:end}.mu-field-horizontal:where(:has(>.mu-field-description))>*{grid-row:1 / span 2}.mu-field-horizontal>.mu-field-label{grid-column:1;grid-row:1;justify-self:stretch;font-weight:400}.mu-field-horizontal>.mu-field-description{grid-column:1;grid-row:2;justify-self:stretch;margin-top:var(--mu-space-1)}.mu-field-horizontal>.mu-field-error{grid-column:1 / -1;grid-row:3;justify-self:stretch;margin-top:var(--mu-space-1)}.mu-field-error{display:flex;align-items:flex-start;gap:var(--mu-space-1);color:var(--mu-danger)}.mu-field-error>.mu-icon{--mu-row-icon: var(--mu-icon-sm);margin-block:calc((1lh - var(--mu-icon-sm)) / 2)}.mu-fieldset-root{display:flex;flex-direction:column;gap:var(--mu-space-3);min-width:0;margin:0;padding:0;border:0}.mu-fieldset-legend{margin-bottom:var(--mu-space-1);padding:0;color:var(--mu-ink)}}@layer mu{.mu-input-root{display:flex;align-items:center;gap:var(--mu-row-gap);box-sizing:border-box;width:100%;min-width:0;height:var(--mu-row-height);padding:0 var(--mu-row-padding);border-radius:var(--mu-row-radius);color:var(--mu-ink);background-color:var(--mu-surface);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:text;transition:box-shadow var(--mu-duration-fade) var(--mu-ease-out)}.mu-input-root:where(:has(>.mu-input-prefix)){padding-inline-start:var(--mu-row-padding-icon)}.mu-input-root:where(:has(>.mu-input-suffix)){padding-inline-end:var(--mu-row-padding-icon)}@media(hover:hover){.mu-input-root:hover:not([data-disabled],[aria-disabled=true],:has(>[data-disabled]),:focus-within){box-shadow:inset 0 0 0 1px var(--mu-ink-muted),var(--mu-shadow-track)}}.mu-input-root:where(:has(>.mu-input:focus)),.mu-input-root:where(:not(:has(>.mu-input))):focus-within{box-shadow:inset 0 0 0 var(--mu-focus-edge-width) var(--mu-focus-edge),var(--mu-shadow-track);outline:var(--mu-focus-width) solid transparent;outline-offset:calc(-1 * var(--mu-focus-width))}.mu-input-root:is([data-invalid],[aria-invalid=true],:has(>[data-invalid])){box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-input-root:is([data-invalid],[aria-invalid=true],:has(>[data-invalid])):where(:has(>.mu-input:focus),:not(:has(>.mu-input)):focus-within){box-shadow:inset 0 0 0 var(--mu-focus-edge-width) var(--mu-danger),var(--mu-shadow-track)}.mu-input-root:is([data-disabled],[aria-disabled=true],:has(>[data-disabled])){opacity:.45;cursor:not-allowed}.mu-input{flex:1;min-width:0;height:100%;margin:0;padding:0;border:0;outline:none;color:inherit;background:none;font:inherit;font-size:var(--mu-row-field-font-size);font-weight:400}.mu-input-root:where(:not(:has(>.mu-input))) :where(input:not([type=checkbox],[type=radio],[type=range],[type=color],[type=file]),textarea){font-size:var(--mu-row-field-font-size)}.mu-input::placeholder{color:var(--mu-ink-muted);opacity:1}.mu-input[data-disabled]{cursor:not-allowed}.mu-input-prefix,.mu-input-suffix{display:flex;flex:none;align-items:center;gap:var(--mu-space-1);color:var(--mu-ink-muted)}}@layer mu{.mu-textarea{display:block;box-sizing:border-box;width:100%;min-height:var(--mu-row-height);margin:0;padding:calc((var(--mu-row-height) - var(--mu-row-field-line-height)) / 2) var(--mu-row-padding);border:0;border-radius:var(--mu-row-radius);color:var(--mu-ink);background-color:var(--mu-surface);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);font-size:var(--mu-row-field-font-size);line-height:var(--mu-row-field-line-height);font-weight:400;resize:vertical;transition:box-shadow var(--mu-duration-fade) var(--mu-ease-out)}.mu-textarea::placeholder{color:var(--mu-ink-muted);opacity:1}@media(hover:hover){.mu-textarea:hover:not([data-disabled],[aria-disabled=true],:focus-within){box-shadow:inset 0 0 0 1px var(--mu-ink-muted),var(--mu-shadow-track)}}.mu-textarea:focus-within{box-shadow:inset 0 0 0 var(--mu-focus-edge-width) var(--mu-focus-edge),var(--mu-shadow-track);outline:var(--mu-focus-width) solid transparent;outline-offset:calc(-1 * var(--mu-focus-width))}.mu-textarea:is([data-invalid],[aria-invalid=true]){box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-textarea:is([data-invalid],[aria-invalid=true]):focus-within{box-shadow:inset 0 0 0 var(--mu-focus-edge-width) var(--mu-danger),var(--mu-shadow-track)}.mu-textarea:is([data-disabled],[aria-disabled=true]){opacity:.45;cursor:not-allowed}}@layer mu{.mu-checkbox{display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;width:var(--mu-row-check-box);height:var(--mu-row-check-box);border-radius:var(--mu-radius-sm);color:var(--mu-on-primary);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:pointer;transition-property:background-color,box-shadow,scale;transition-duration:var(--mu-duration-press);transition-timing-function:var(--mu-ease-out)}.mu-checkbox[data-checked],.mu-checkbox[data-indeterminate]{background-color:var(--mu-primary);box-shadow:none}.mu-checkbox[data-invalid]{box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-checkbox:active:not([data-disabled],[data-readonly]){scale:.94}.mu-checkbox[data-disabled]{opacity:.45;cursor:not-allowed}.mu-checkbox-indicator{display:flex;transition:opacity var(--mu-duration-fade) var(--mu-ease-out) var(--mu-duration-press),scale var(--mu-duration-fade) var(--mu-ease-out) var(--mu-duration-press)}.mu-checkbox-indicator[data-starting-style],.mu-checkbox-indicator[data-ending-style]{opacity:0;scale:.6}.mu-checkbox-indicator>svg{width:calc(var(--mu-row-check-box) - 2 * var(--mu-inset));height:calc(var(--mu-row-check-box) - 2 * var(--mu-inset));stroke-width:2}.mu-checkbox-indicator>svg *{vector-effect:non-scaling-stroke}@media(prefers-reduced-motion:reduce){.mu-checkbox:active:not([data-disabled],[data-readonly]){scale:none}.mu-checkbox-indicator[data-starting-style],.mu-checkbox-indicator[data-ending-style]{scale:none}}}@layer mu{.mu-switch{--switch-h: calc(var(--mu-row-check-box) + var(--mu-inset));--switch-w: calc(var(--switch-h) * 1.7);--knob: calc(var(--switch-h) - 2 * var(--mu-inset));position:relative;display:inline-flex;flex:none;align-items:center;box-sizing:border-box;width:var(--switch-w);height:var(--switch-h);padding:var(--mu-inset);border-radius:var(--mu-radius-full);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:pointer;transition:background-color var(--mu-duration-settle) var(--mu-ease-settle),box-shadow var(--mu-duration-settle) var(--mu-ease-settle)}.mu-switch[data-checked]{background-color:var(--mu-primary);box-shadow:inset 0 0 0 1px var(--mu-primary)}.mu-switch[data-invalid]{box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-switch[data-disabled]{opacity:.45;cursor:not-allowed}.mu-switch-thumb{display:block;width:var(--knob);height:var(--knob);border-radius:var(--mu-radius-full);background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),transparent 60%);box-shadow:var(--mu-shadow-key);transition:translate var(--mu-duration-settle) var(--mu-ease-settle),scale var(--mu-duration-press) var(--mu-ease-out),background-color var(--mu-duration-settle) var(--mu-ease-settle)}.mu-switch-thumb[data-checked]{translate:calc(var(--switch-w) - var(--switch-h)) 0;background-color:var(--mu-on-primary)}.mu-switch:active:not([data-disabled],[data-readonly])>.mu-switch-thumb{scale:1.1}@media(prefers-reduced-motion:reduce){.mu-switch-thumb{transition-property:background-color}.mu-switch:active:not([data-disabled],[data-readonly])>.mu-switch-thumb{scale:none}}}@layer mu{.mu-radio-group{display:flex;flex-direction:column;align-items:flex-start;gap:var(--mu-space-3)}.mu-radio-group[data-orientation=horizontal]{flex-direction:row;flex-wrap:wrap;gap:var(--mu-space-3) var(--mu-space-4)}.mu-radio-group[data-orientation=horizontal]>.mu-fieldset-legend{flex-basis:100%}.mu-radio{display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;width:var(--mu-row-check-box);height:var(--mu-row-check-box);border-radius:var(--mu-radius-full);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:pointer;transition-property:background-color,box-shadow,scale;transition-duration:var(--mu-duration-press);transition-timing-function:var(--mu-ease-out)}.mu-radio[data-checked]{background-color:var(--mu-primary);box-shadow:none}.mu-radio[data-invalid]{box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-radio:active:not([data-disabled],[data-readonly]){scale:.94}.mu-radio[data-disabled]{opacity:.45;cursor:not-allowed}.mu-radio-indicator{width:calc(var(--mu-row-check-box) / 2.5);height:calc(var(--mu-row-check-box) / 2.5);border-radius:var(--mu-radius-full);background-color:var(--mu-on-primary);transition:opacity var(--mu-duration-fade) var(--mu-ease-out) var(--mu-duration-press),scale var(--mu-duration-fade) var(--mu-ease-out) var(--mu-duration-press)}.mu-radio-indicator[data-starting-style],.mu-radio-indicator[data-ending-style]{opacity:0;scale:.4}@media(prefers-reduced-motion:reduce){.mu-radio:active:not([data-disabled],[data-readonly]){scale:none}.mu-radio-indicator[data-starting-style],.mu-radio-indicator[data-ending-style]{scale:none}}}@layer mu{.mu-toggle{position:relative;display:inline-flex;flex:0 1 auto;align-items:center;justify-content:center;gap:var(--mu-row-gap);box-sizing:border-box;min-width:0;height:var(--mu-row-height);margin:0;padding:0 var(--mu-row-padding);border:0;border-radius:var(--mu-row-radius);color:var(--mu-ink-muted);background-color:transparent;white-space:nowrap;cursor:pointer;user-select:none;transition-property:background-color,box-shadow,color;transition-duration:var(--mu-duration-press);transition-timing-function:var(--mu-ease-out)}.mu-toggle:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-toggle.mu-toggle-icon{flex:none;width:var(--mu-row-height);padding:0}.mu-toggle-label{min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-toggle>svg{flex:none}@media(hover:hover){.mu-toggle:hover:not([data-disabled]){color:var(--mu-ink);background-color:var(--mu-hover)}}.mu-toggle[data-pressed],.mu-toggle:active:not([data-disabled]){color:var(--mu-ink);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track)}.mu-toggle[data-disabled]{opacity:.45;cursor:not-allowed}}@layer mu{.mu-segmented{position:relative;display:inline-flex;align-items:stretch;gap:0;box-sizing:border-box;height:var(--mu-row-height);padding:var(--mu-inset);border-radius:var(--mu-row-radius);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track)}.mu-segmented-key{position:absolute;top:var(--mu-inset);left:0;width:var(--key-width);height:calc(var(--mu-row-height) - 2 * var(--mu-inset));translate:var(--key-left) 0;border-radius:calc(var(--mu-row-radius) - var(--mu-inset));background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),transparent 60%);box-shadow:var(--mu-shadow-key);transition:translate var(--mu-duration-settle) var(--mu-ease-settle),width var(--mu-duration-settle) var(--mu-ease-settle)}.mu-toggle-group.mu-segmented:not([data-keyed])>.mu-segmented-key{display:none}.mu-tabs-indicator{--key-left: var(--active-tab-left);--key-width: var(--active-tab-width)}.mu-segmented-item,.mu-segmented>.mu-toggle{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--mu-row-gap);box-sizing:border-box;height:100%;margin:0;padding:0 calc(var(--mu-row-padding) - var(--mu-inset));border:0;border-radius:calc(var(--mu-row-radius) - var(--mu-inset));color:var(--mu-ink-muted);background:none;box-shadow:none;font:inherit;white-space:nowrap;cursor:pointer;user-select:none;transition:color var(--mu-duration-fade) var(--mu-ease-out)}.mu-segmented>.mu-toggle.mu-toggle-icon{width:calc(var(--mu-row-height) - 2 * var(--mu-inset));padding:0}@media(hover:hover){.mu-segmented-item:hover:not([data-disabled]),.mu-segmented>.mu-toggle:hover:not([data-disabled]){color:var(--mu-ink);background:none}}.mu-segmented-item[data-active],.mu-segmented>.mu-toggle[data-pressed],.mu-segmented>.mu-toggle:active:not([data-disabled]){color:var(--mu-ink);background:none;box-shadow:none}.mu-segmented-item[data-disabled]{opacity:.45;cursor:not-allowed}.mu-tabs-root{display:flex;flex-direction:column;gap:var(--mu-space-4)}.mu-tabs-list{align-self:flex-start}.mu-tabs-panel{border-radius:var(--mu-radius-sm)}@media(prefers-reduced-motion:reduce){.mu-segmented-key{transition:none}}}@layer mu{.mu-toggle-group{display:inline-flex;align-items:center;gap:var(--mu-inset);box-sizing:border-box;min-width:0;max-width:100%}.mu-toggle-group>.mu-separator{align-self:center;height:max(var(--mu-space-2),calc(var(--mu-row-height) - 2 * var(--mu-space-2)));margin-inline:var(--mu-space-1)}.mu-toggle-group.mu-toggle-group-full{display:flex;width:100%}.mu-toggle-group-full>.mu-toggle:not(.mu-toggle-icon){flex:1 1 auto}}@layer mu{.mu-tooltip-popup{display:flex;align-items:center;gap:var(--mu-space-2);box-sizing:border-box;max-width:var(--mu-tooltip-width);padding:var(--mu-space-1) var(--mu-space-2);border-radius:var(--mu-radius-md);color:var(--mu-on-primary);background-color:var(--mu-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.mu-tooltip-shortcut{opacity:.65}}@layer mu{.mu-popover-popup{display:flex;flex-direction:column;gap:var(--mu-space-3);box-sizing:border-box;width:var(--mu-popover-width);max-width:var(--available-width);padding:var(--mu-space-4);outline:0}.mu-popover-title{margin:0;color:var(--mu-ink)}.mu-popover-description{margin:calc(-1 * var(--mu-space-2)) 0 0;color:var(--mu-ink-muted)}.mu-popover-list{gap:0;padding:var(--mu-space-1)}.mu-popover-list>.mu-popover-title{padding:var(--mu-space-2) var(--mu-row-padding) 0}.mu-popover-list>.mu-popover-description{margin:0;padding:0 var(--mu-row-padding) var(--mu-space-2)}}@layer mu{.mu-menu-popup{box-sizing:border-box;min-width:var(--mu-menu-width);max-height:var(--available-height);overflow-y:auto;padding:var(--mu-space-1);outline:0}.mu-menu-item{display:flex;align-items:center;gap:var(--mu-space-2);box-sizing:border-box;width:100%;height:var(--mu-row-height);margin:0;padding:0 var(--mu-row-padding);border:0;border-radius:calc(var(--mu-radius-xl) - var(--mu-space-1));color:var(--mu-ink);background-color:transparent;font:inherit;font-weight:400;text-align:start;text-decoration:none;white-space:nowrap;cursor:default;user-select:none;outline:0}.mu-menu-item:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-menu-item>svg{color:var(--mu-ink-muted)}.mu-menu-item[data-highlighted],.mu-menu-submenu-trigger[data-popup-open]{background-color:var(--mu-hover)}.mu-menu-item[data-disabled]{opacity:.45}.mu-menu-item-danger,.mu-menu-item-danger>svg{color:var(--mu-danger)}.mu-menu-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-menu-item:where(:has(>.mu-menu-text)){align-items:flex-start;height:auto;min-height:var(--mu-row-height);padding-block:calc((var(--mu-row-height) - var(--mu-row-line-height)) / 2)}.mu-menu-item:where(:has(>.mu-menu-text))>svg,.mu-menu-item:where(:has(>.mu-menu-text))>.mu-menu-indicator{margin-block:calc((var(--mu-row-line-height) - var(--mu-row-icon)) / 2)}.mu-menu-text{display:flex;flex:1;flex-direction:column;min-width:0}.mu-menu-text>.mu-menu-label{flex:none}.mu-menu-description{color:var(--mu-ink-muted);white-space:normal}.mu-menu-shortcut{margin-inline-start:var(--mu-space-4);color:var(--mu-ink-muted)}.mu-menu-indicator{display:grid;flex:none;place-items:center;width:var(--mu-row-icon);height:var(--mu-row-icon);margin-inline-start:var(--mu-space-2)}.mu-menu-indicator>svg{color:var(--mu-ink)}.mu-menu-chevron{margin-inline-end:calc(var(--mu-row-padding-icon) - var(--mu-row-padding));color:var(--mu-ink-muted)}.mu-menu-group-label{padding:var(--mu-space-2) var(--mu-row-padding) var(--mu-space-1);color:var(--mu-ink-muted)}.mu-menu-separator{height:1px;margin:var(--mu-space-1) calc(-1 * var(--mu-space-1));background-color:var(--mu-line)}}@layer mu{.mu-select-trigger{justify-content:space-between;min-width:0;padding-inline-end:var(--mu-row-padding-icon);text-align:start}.mu-select-value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mu-select-value[data-placeholder]{color:var(--mu-ink-muted);font-weight:400}.mu-select-icon{display:flex;flex:none;color:var(--mu-ink-muted)}.mu-select-trigger.mu-button-ghost:not([data-disabled]){color:var(--mu-ink)}.mu-select-trigger[data-invalid]{box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-key)}.mu-select-positioner{outline:0}.mu-select-popup{box-sizing:border-box;min-width:max(var(--mu-menu-width),var(--anchor-width));max-height:var(--available-height);padding:var(--mu-space-1);outline:0}.mu-select-list{overflow-y:auto;max-height:var(--available-height);scroll-padding-block:var(--mu-space-1);outline:0}.mu-select-item{display:flex;align-items:center;gap:var(--mu-space-2);box-sizing:border-box;height:var(--mu-row-height);padding:0 var(--mu-row-padding);border-radius:calc(var(--mu-radius-xl) - var(--mu-space-1));color:var(--mu-ink);font-weight:400;white-space:nowrap;cursor:default;user-select:none;outline:0}.mu-select-item:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-select-item>svg{color:var(--mu-ink-muted)}.mu-select-item[data-highlighted]{background-color:var(--mu-hover)}.mu-select-item[data-disabled]{opacity:.45}.mu-select-item-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-select-indicator{display:grid;flex:none;place-items:center;width:var(--mu-row-icon);height:var(--mu-row-icon);margin-inline-start:var(--mu-space-2);color:var(--mu-ink)}.mu-select-group-label{padding:var(--mu-space-2) var(--mu-row-padding) var(--mu-space-1);color:var(--mu-ink-muted)}.mu-select-separator{height:1px;margin:var(--mu-space-1) calc(-1 * var(--mu-space-1));background-color:var(--mu-line)}.mu-select-scroll-arrow{display:grid;place-items:center;height:var(--mu-space-4);color:var(--mu-ink-muted)}}@layer mu{.mu-dialog-backdrop{position:fixed;inset:0;z-index:var(--mu-layer-overlay);background-color:var(--mu-overlay);transition:opacity var(--mu-duration-settle) var(--mu-ease-out)}.mu-dialog-backdrop[data-starting-style],.mu-dialog-backdrop[data-ending-style]{opacity:0}.mu-dialog-viewport{position:fixed;inset:0;z-index:var(--mu-layer-overlay);display:grid;place-items:safe center;box-sizing:border-box;padding:var(--mu-space-6) var(--mu-space-4);overflow-y:auto}.mu-dialog-popup{position:relative;display:flex;flex-direction:column;gap:var(--mu-space-4);box-sizing:border-box;width:var(--mu-dialog-width);max-width:100%;padding:var(--mu-space-5);border-radius:var(--mu-radius-2xl);outline:0;transition:opacity var(--mu-duration-settle) var(--mu-ease-out),translate var(--mu-duration-settle) var(--mu-ease-out)}.mu-dialog-popup[data-starting-style],.mu-dialog-popup[data-ending-style]{opacity:0;translate:0 var(--mu-space-1)}.mu-dialog-popup:where(:has(>.mu-dialog-x))>.mu-dialog-title{padding-inline-end:var(--mu-space-6)}.mu-dialog-popup.mu-dialog-bare{gap:0;padding:0;overflow:hidden}.mu-dialog-full{place-items:stretch;padding:0}.mu-dialog-full>.mu-dialog-popup{width:100%;height:100%;border-radius:0}.mu-dialog-title{margin:0;color:var(--mu-ink)}.mu-dialog-description{margin:calc(-1 * var(--mu-space-2)) 0 0;color:var(--mu-ink-muted)}.mu-dialog-x{position:absolute;top:var(--mu-space-4);right:var(--mu-space-4)}.mu-dialog-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--mu-space-2);margin-top:var(--mu-space-2)}@media(max-width:639.98px){.mu-dialog-sheet{place-items:end stretch;padding:var(--mu-space-6) 0 0}.mu-dialog-sheet>.mu-dialog-popup{width:100%;padding-bottom:max(var(--mu-space-5),env(safe-area-inset-bottom));border-end-start-radius:0;border-end-end-radius:0}.mu-dialog-sheet>.mu-dialog-popup[data-starting-style],.mu-dialog-sheet>.mu-dialog-popup[data-ending-style]{translate:0 var(--mu-space-6)}.mu-dialog-sheet>.mu-dialog-popup.mu-dialog-bare{padding-bottom:env(safe-area-inset-bottom)}.mu-dialog-sheet .mu-dialog-footer{flex-direction:column-reverse}.mu-dialog-sheet .mu-dialog-footer>*{width:100%}}@media(prefers-reduced-motion:reduce){.mu-dialog-popup[data-starting-style],.mu-dialog-popup[data-ending-style],.mu-dialog-sheet>.mu-dialog-popup[data-starting-style],.mu-dialog-sheet>.mu-dialog-popup[data-ending-style]{translate:none}}}@layer mu{.mu-drawer-backdrop{position:fixed;inset:0;z-index:var(--mu-layer-overlay);background-color:var(--mu-overlay);opacity:calc(1 - var(--drawer-swipe-progress, 0));transition:opacity var(--mu-duration-settle) var(--mu-ease-out)}.mu-drawer-backdrop[data-starting-style],.mu-drawer-backdrop[data-ending-style]{opacity:0}.mu-drawer-viewport{position:fixed;inset:0;z-index:var(--mu-layer-overlay);display:flex}.mu-drawer-left{justify-content:flex-start}.mu-drawer-right{justify-content:flex-end}.mu-drawer-bottom{align-items:flex-end}.mu-drawer-popup{--drawer-hidden: 0 0;position:relative;box-sizing:border-box;width:var(--mu-drawer-width);max-width:calc(100% - var(--mu-space-12));height:100%;overflow-y:auto;overscroll-behavior:contain;background-color:var(--mu-surface);box-shadow:var(--mu-shadow-pop);outline:0;translate:var(--drawer-swipe-movement-x, 0) var(--drawer-swipe-movement-y, 0);transition:translate var(--mu-duration-settle) var(--mu-ease-settle),opacity var(--mu-duration-settle) var(--mu-ease-out)}.mu-drawer-bottom>.mu-drawer-popup{width:100%;max-width:none;height:auto;max-height:calc(100% - var(--mu-space-6));padding-bottom:env(safe-area-inset-bottom);border-start-start-radius:var(--mu-radius-2xl);border-start-end-radius:var(--mu-radius-2xl)}.mu-drawer-left>.mu-drawer-popup{--drawer-hidden: -100% 0;border-right:1px solid var(--mu-line)}.mu-drawer-right>.mu-drawer-popup{--drawer-hidden: 100% 0;border-left:1px solid var(--mu-line)}.mu-drawer-bottom>.mu-drawer-popup{--drawer-hidden: 0 100%}.mu-drawer-popup[data-starting-style],.mu-drawer-popup[data-ending-style]{translate:var(--drawer-hidden)}.mu-drawer-popup[data-swiping]{transition:none;user-select:none}.mu-drawer-content{display:flex;flex-direction:column;gap:var(--mu-space-4);box-sizing:border-box;min-height:100%;padding:var(--mu-space-5)}.mu-drawer-bare>.mu-drawer-content{gap:0;height:100%;min-height:0;padding:0}.mu-drawer-popup:where(:has(>.mu-drawer-x))>.mu-drawer-content>.mu-drawer-title{padding-inline-end:var(--mu-space-6)}.mu-drawer-title{margin:0;color:var(--mu-ink)}.mu-drawer-description{margin:calc(-1 * var(--mu-space-2)) 0 0;color:var(--mu-ink-muted)}.mu-drawer-x{position:absolute;top:var(--mu-space-4);inset-inline-end:var(--mu-space-4)}@media(prefers-reduced-motion:reduce){.mu-drawer-popup[data-starting-style],.mu-drawer-popup[data-ending-style]{translate:none;opacity:0}}}@layer mu{.mu-toast-viewport{position:fixed;top:var(--mu-space-6);right:var(--mu-space-6);z-index:var(--mu-layer-toast);width:var(--mu-toast-width);outline:0}@media(max-width:639.98px){.mu-toast-viewport{top:max(var(--mu-space-4),env(safe-area-inset-top));right:var(--mu-space-4);left:var(--mu-space-4);width:auto}}.mu-toast{--mu-row-gap: var(--mu-space-3);--peek: var(--mu-space-2);--scale: max(0, 1 - var(--toast-index) * .05);--shrink: calc(1 - var(--scale));--height: var(--toast-frontmost-height, var(--toast-height));--offset-y: calc(var(--toast-offset-y) + var(--toast-index) * var(--mu-row-gap) + var(--toast-swipe-movement-y));position:absolute;top:0;right:0;z-index:calc(var(--mu-layer-toast) - var(--toast-index));box-sizing:border-box;width:100%;height:var(--height);transform-origin:top center;translate:var(--toast-swipe-movement-x) calc(var(--toast-swipe-movement-y) + var(--toast-index) * var(--peek) + var(--shrink) * var(--height));scale:var(--scale);user-select:none;outline:0;transition:translate var(--mu-duration-settle) var(--mu-ease-settle),scale var(--mu-duration-settle) var(--mu-ease-settle),opacity var(--mu-duration-settle) var(--mu-ease-out),height var(--mu-duration-fade) var(--mu-ease-out)}.mu-toast[data-expanded]{height:var(--toast-height);translate:var(--toast-swipe-movement-x) var(--offset-y);scale:1}.mu-toast[data-starting-style],.mu-toast[data-ending-style]{translate:0 -150%}.mu-toast[data-ending-style]{opacity:0}.mu-toast[data-ending-style][data-swipe-direction=up]{translate:0 calc(var(--toast-swipe-movement-y) - 150%)}.mu-toast[data-ending-style][data-swipe-direction=down]{translate:0 calc(var(--toast-swipe-movement-y) + 150%)}.mu-toast[data-ending-style][data-swipe-direction=left]{translate:calc(var(--toast-swipe-movement-x) - 150%) var(--offset-y)}.mu-toast[data-ending-style][data-swipe-direction=right]{translate:calc(var(--toast-swipe-movement-x) + 150%) var(--offset-y)}.mu-toast[data-limited]{opacity:0}.mu-toast:focus-visible{outline:var(--mu-focus-width) solid var(--mu-focus);outline-offset:var(--mu-focus-offset)}.mu-toast:after{content:"";position:absolute;bottom:100%;left:0;width:100%;height:calc(var(--mu-row-gap) + 1px)}.mu-toast-content{display:flex;align-items:flex-start;gap:var(--mu-space-3);box-sizing:border-box;height:100%;padding:var(--mu-space-3) var(--mu-space-3) var(--mu-space-3) var(--mu-space-4);overflow:hidden;transition:opacity var(--mu-duration-settle) var(--mu-ease-out)}.mu-toast-content[data-behind]{opacity:0}.mu-toast-content[data-expanded]{opacity:1}.mu-toast-icon{margin-block:calc((var(--mu-row-height) - var(--mu-row-icon)) / 2);color:var(--mu-ink-muted)}.mu-toast-success .mu-toast-icon{color:var(--mu-success)}.mu-toast-warning .mu-toast-icon{color:var(--mu-warning)}.mu-toast-danger .mu-toast-icon{color:var(--mu-danger)}.mu-toast-text{display:flex;flex:1;flex-direction:column;min-width:0;padding-block:calc((var(--mu-row-height) - var(--mu-row-line-height)) / 2)}.mu-toast-title{margin:0;color:var(--mu-ink)}.mu-toast-description{margin:0;color:var(--mu-ink-muted)}.mu-toast-action,.mu-toast-close{margin-block:calc((var(--mu-control-md) - var(--mu-control-sm)) / 2)}@media(prefers-reduced-motion:reduce){.mu-toast{transition-property:opacity,height}.mu-toast[data-starting-style],.mu-toast[data-ending-style]{translate:var(--toast-swipe-movement-x) var(--offset-y)}}}@layer mu{.mu-input-root.mu-combobox-input-root{padding-inline-end:calc(var(--mu-row-padding-icon) - var(--mu-space-1))}.mu-combobox-trigger{display:grid;place-items:center;width:calc(var(--mu-row-icon) + var(--mu-space-2));height:calc(var(--mu-row-icon) + var(--mu-space-2));margin:0;padding:0;border:0;border-radius:var(--mu-radius-sm);color:var(--mu-ink-muted);background:none;cursor:pointer}.mu-combobox-trigger:hover:not([data-disabled]){color:var(--mu-ink)}.mu-combobox-trigger[data-disabled]{cursor:not-allowed}.mu-combobox-popup{box-sizing:border-box;width:var(--anchor-width);min-width:var(--mu-menu-width);max-width:var(--available-width);outline:0}.mu-combobox-list{box-sizing:border-box;max-height:min(var(--mu-list-height),var(--available-height));overflow-y:auto;overscroll-behavior:contain;padding:var(--mu-space-1);scroll-padding-block:var(--mu-space-1);outline:0}.mu-combobox-list[data-empty]{padding:0}.mu-combobox-item{display:flex;align-items:center;gap:var(--mu-space-2);box-sizing:border-box;height:var(--mu-row-height);padding:0 var(--mu-row-padding);border-radius:calc(var(--mu-radius-xl) - var(--mu-space-1));color:var(--mu-ink);font-weight:400;white-space:nowrap;cursor:default;user-select:none;outline:0}.mu-combobox-item:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-combobox-item>svg{color:var(--mu-ink-muted)}.mu-combobox-item[data-highlighted]{background-color:var(--mu-hover)}.mu-combobox-item[data-disabled]{opacity:.45}.mu-combobox-item-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-combobox-indicator{display:grid;flex:none;place-items:center;width:var(--mu-row-icon);height:var(--mu-row-icon);margin-inline-start:var(--mu-space-2);color:var(--mu-ink)}.mu-combobox-row{display:flex;gap:var(--mu-inset)}.mu-combobox-row+.mu-combobox-row{margin-top:var(--mu-inset)}.mu-combobox-row>.mu-combobox-item{flex:none;justify-content:center;width:var(--mu-row-height);padding:0;border-radius:var(--mu-row-radius)}.mu-combobox-row>.mu-combobox-item>.mu-combobox-item-text{flex:none;overflow:visible}.mu-combobox-row>.mu-combobox-item>.mu-combobox-indicator{display:none}.mu-combobox-row>.mu-combobox-item[data-selected]{background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track)}.mu-combobox-empty:not(:empty){padding:var(--mu-space-3) var(--mu-space-4);color:var(--mu-ink-muted)}.mu-combobox-group-label{padding:var(--mu-space-2) var(--mu-row-padding) var(--mu-space-1);color:var(--mu-ink-muted)}.mu-combobox-separator{height:1px;margin:var(--mu-space-1) calc(-1 * var(--mu-space-1));background-color:var(--mu-line)}}@layer mu{.mu-button.mu-collapsible-trigger{margin-inline-start:calc(-1 * var(--mu-row-padding));padding-inline-end:var(--mu-row-padding-icon)}.mu-collapsible-chevron{color:var(--mu-ink-muted);transition:rotate var(--mu-duration-settle) var(--mu-ease-settle)}.mu-collapsible-trigger[data-panel-open]>.mu-collapsible-chevron{rotate:180deg}.mu-collapsible-panel{transition:opacity var(--mu-duration-fade) var(--mu-ease-out),translate var(--mu-duration-fade) var(--mu-ease-out)}.mu-collapsible-panel[data-starting-style],.mu-collapsible-panel[data-ending-style]{opacity:0;translate:0 var(--mu-space-1)}@media(prefers-reduced-motion:reduce){.mu-collapsible-chevron{transition:none}.mu-collapsible-panel[data-starting-style],.mu-collapsible-panel[data-ending-style]{translate:none}}}@layer mu{.mu-table-scroll{overflow-x:auto;max-width:100%}.mu-table-bordered{box-sizing:border-box;border:1px solid var(--mu-line);border-radius:var(--mu-radius-lg);background-color:var(--mu-surface)}.mu-table{width:100%;border-collapse:collapse;color:var(--mu-ink);font-variant-numeric:tabular-nums;text-align:start}.mu-table-head,.mu-table-cell{padding:0 var(--mu-row-padding);text-align:start;vertical-align:middle}.mu-table-head{height:var(--mu-row-height);color:var(--mu-ink-muted);white-space:nowrap;border-bottom:1px solid var(--mu-line)}.mu-table-cell{padding-block:calc((var(--mu-row-height) - var(--mu-row-line-height)) / 2 + var(--mu-space-1))}.mu-table-body>.mu-table-row+.mu-table-row>.mu-table-cell{border-top:1px solid var(--mu-line)}.mu-table-body>.mu-table-row:hover>.mu-table-cell{background-color:var(--mu-hover)}.mu-table-actions{display:inline-flex;align-items:center;gap:var(--mu-space-1);vertical-align:top}.mu-table-cell>:is(.mu-button,.mu-table-actions){margin-block:calc((var(--mu-row-line-height) - var(--mu-row-height)) / 2);vertical-align:top}.mu-table-num{text-align:end}.mu-table-muted{color:var(--mu-ink-muted)}.mu-table-caption{caption-side:bottom;padding:var(--mu-space-2) var(--mu-row-padding) 0;color:var(--mu-ink-muted);text-align:start}.mu-table-bordered .mu-table-caption{padding-bottom:var(--mu-space-2);border-top:1px solid var(--mu-line)}.mu-table-bordered .mu-table-head{background-color:var(--mu-canvas)}.mu-table-bordered :is(.mu-table-head,.mu-table-cell):first-child,.mu-table-bordered .mu-table-caption{padding-inline-start:calc(var(--mu-row-padding) + var(--mu-space-1))}.mu-table-bordered :is(.mu-table-head,.mu-table-cell):last-child{padding-inline-end:calc(var(--mu-row-padding) + var(--mu-space-1))}}@layer mu{.mu-list{box-sizing:border-box;margin:0;padding:0;border:1px solid var(--mu-line);border-radius:var(--mu-radius-lg);color:var(--mu-ink);background-color:var(--mu-surface);list-style:none}.mu-list{--list-pad-block: var(--mu-space-3);--list-pad-inline: var(--mu-space-4)}.mu-list.mu-s-sm{--list-pad-block: var(--mu-space-2);--list-pad-inline: var(--mu-space-3)}.mu-list-item{box-sizing:border-box;min-width:0;padding:var(--list-pad-block) var(--list-pad-inline)}.mu-list-item+.mu-list-item{border-top:1px solid var(--mu-line)}.mu-list-item-button{display:flex;align-items:center;gap:var(--mu-space-3);box-sizing:border-box;width:calc(100% + 2 * var(--list-pad-inline));margin:calc(-1 * var(--list-pad-block)) calc(-1 * var(--list-pad-inline));padding:var(--list-pad-block) var(--list-pad-inline);border:0;border-radius:0;color:inherit;background-color:transparent;font:inherit;text-align:start;text-decoration:none;cursor:pointer;transition:background-color var(--mu-duration-press) var(--mu-ease-out)}.mu-list-item:first-child>.mu-list-item-button{border-start-start-radius:calc(var(--mu-radius-lg) - 1px);border-start-end-radius:calc(var(--mu-radius-lg) - 1px)}.mu-list-item:last-child>.mu-list-item-button{border-end-start-radius:calc(var(--mu-radius-lg) - 1px);border-end-end-radius:calc(var(--mu-radius-lg) - 1px)}@media(hover:hover){.mu-list-item-button:hover:not(:disabled){background-color:var(--mu-hover)}}.mu-list-item-button:active:not(:disabled){background-color:var(--mu-hover)}.mu-list-item-button:disabled{opacity:.45;cursor:not-allowed}@media(prefers-reduced-motion:reduce){.mu-list-item-button{transition:none}}}@layer mu{.mu-form{display:flex;flex-direction:column;gap:var(--mu-space-4);box-sizing:border-box;min-width:0;margin:0;color:var(--mu-ink)}.mu-form-title{margin:0;color:var(--mu-ink)}.mu-form-description{margin:calc(-1 * var(--mu-space-3)) 0 0;color:var(--mu-ink-muted)}.mu-form-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--mu-space-2)}.mu-form-bordered{padding:var(--mu-space-4);border:1px solid var(--mu-line);border-radius:var(--mu-radius-lg);background-color:var(--mu-surface)}.mu-form-bordered>.mu-form-footer{margin:0 calc(-1 * var(--mu-space-4)) calc(-1 * var(--mu-space-4));padding:var(--mu-space-3) var(--mu-space-4);border-top:1px solid var(--mu-line);border-end-start-radius:calc(var(--mu-radius-lg) - 1px);border-end-end-radius:calc(var(--mu-radius-lg) - 1px);background-color:var(--mu-canvas)}}@layer mu{.mu-prose{color:var(--mu-ink);font-family:var(--mu-font-sans);font-size:var(--prose-fs);line-height:var(--prose-lh);font-weight:400;overflow-wrap:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.mu-prose ::selection{background:var(--mu-selection)}.mu-prose :where(p,ul,ol,pre,blockquote,table,figure,img,video,hr){margin:0 0 var(--mu-space-3)}.mu-prose :where(h1,h2,h3,h4,h5,h6){margin:var(--mu-space-5) 0 var(--mu-space-2);font-family:var(--mu-font-display);font-weight:600;letter-spacing:0;text-wrap:balance}.mu-prose :where(p,li){text-wrap:pretty}.mu-prose>:first-child{margin-top:0}.mu-prose>:last-child{margin-bottom:0}.mu-prose h1{font-size:var(--prose-h1);line-height:var(--prose-h1-lh)}.mu-prose h2{font-size:var(--prose-h2);line-height:var(--prose-h2-lh)}.mu-prose :where(h3,h4,h5,h6){font-size:var(--prose-h3);line-height:var(--prose-h3-lh)}.mu-prose :where(strong,b){font-weight:600}.mu-prose del{color:var(--mu-ink-muted)}.mu-prose a{color:var(--mu-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;border-radius:var(--mu-radius-xs)}.mu-prose a:focus-visible{outline:var(--mu-focus-width) solid var(--mu-focus);outline-offset:var(--mu-focus-offset)}.mu-prose :where(ul,ol){padding-inline-start:var(--mu-space-6)}.mu-prose li+li{margin-top:var(--mu-space-1)}.mu-prose li>:where(ul,ol){margin:var(--mu-space-1) 0 0}.mu-prose li>p{margin:0}.mu-prose li::marker{color:var(--mu-ink-muted)}.mu-prose li:where(:has(>input[type=checkbox]:first-child)){position:relative;list-style:none}.mu-prose li>input[type=checkbox]:first-child{appearance:none;position:absolute;inset-inline-start:calc(-1 * (var(--mu-space-4) + var(--mu-space-2)));top:calc((var(--prose-lh) - var(--mu-space-4)) / 2);box-sizing:border-box;width:var(--mu-space-4);height:var(--mu-space-4);margin:0;border-radius:var(--mu-radius-sm);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:pointer}.mu-prose li>input[type=checkbox]:first-child:disabled{cursor:default}.mu-prose li>input[type=checkbox]:first-child:focus-visible{outline:var(--mu-focus-width) solid var(--mu-focus);outline-offset:var(--mu-focus-offset)}.mu-prose li>input[type=checkbox]:first-child:checked{background-color:var(--mu-primary);box-shadow:none}.mu-prose li>input[type=checkbox]:first-child:checked:after{content:"";position:absolute;inset:var(--mu-inset);background-color:var(--mu-on-primary);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat}.mu-prose li:where(:has(>input[type=checkbox]:first-child:checked)){color:var(--mu-ink-muted);text-decoration:line-through}.mu-prose :where(code,kbd,samp,pre){font-family:var(--mu-font-mono);font-size:.875em}.mu-prose :not(pre)>code{padding:.1em .3em;border-radius:var(--mu-radius-xs);background-color:var(--mu-well)}.mu-prose pre{overflow-x:auto;padding:var(--mu-space-3) var(--mu-space-4);border-radius:var(--mu-radius-md);background-color:var(--mu-well);line-height:1.6}.mu-prose pre>code{font-size:inherit}.mu-prose blockquote{margin-inline:0;padding-inline-start:var(--mu-space-4);border-inline-start:var(--mu-inset) solid var(--mu-edge);color:var(--mu-ink-muted)}.mu-prose hr{height:1px;margin-block:var(--mu-space-5);border:0;background-color:var(--mu-line)}.mu-prose :where(img,video){display:block;max-width:100%;height:auto;border-radius:var(--mu-radius-lg)}.mu-prose table{display:block;width:max-content;max-width:100%;overflow-x:auto;border-collapse:collapse;font-variant-numeric:tabular-nums}.mu-prose :where(th,td){padding:var(--mu-space-2) var(--mu-space-3);text-align:start;vertical-align:top}.mu-prose th{color:var(--mu-ink-muted);font-size:var(--prose-head);line-height:var(--prose-head-lh);font-weight:500;white-space:nowrap;border-bottom:1px solid var(--mu-line)}.mu-prose tr+tr>td{border-top:1px solid var(--mu-line)}.mu-prose-tag{padding:0 .25em;border-radius:var(--mu-radius-xs);color:var(--mu-ink-muted);background-color:var(--mu-well)}}
1
+ @layer mu{@font-face{font-family:"Segoe UI (mu)";font-weight:400;src:local("Segoe UI"),local("SegoeUI")}@font-face{font-family:"Segoe UI (mu)";font-weight:400;font-style:italic;src:local("Segoe UI Italic"),local("SegoeUI-Italic")}@font-face{font-family:"Segoe UI (mu)";font-weight:500 600;src:local("Segoe UI Semibold"),local("SegoeUI-Semibold")}@font-face{font-family:"Segoe UI (mu)";font-weight:500 600;font-style:italic;src:local("Segoe UI Semibold Italic"),local("SegoeUI-SemiboldItalic")}@font-face{font-family:"Segoe UI (mu)";font-weight:700;src:local("Segoe UI Bold"),local("SegoeUI-Bold")}@font-face{font-family:"Segoe UI (mu)";font-weight:700;font-style:italic;src:local("Segoe UI Bold Italic"),local("SegoeUI-BoldItalic")}.mu-s-xs{--mu-row-height: var(--mu-control-xs);--mu-row-padding: 6px;--mu-row-padding-icon: var(--mu-space-1);--mu-row-font-size: 12px;--mu-row-line-height: 16px;--mu-row-field-font-size: 12px;--mu-row-field-line-height: 16px;--mu-row-radius: var(--mu-radius-sm);--mu-row-gap: var(--mu-space-1);--mu-row-icon: var(--mu-icon-xs);--mu-row-icon-stroke: var(--mu-icon-stroke);--mu-row-check-box: 14px}.mu-s-sm{--mu-row-height: var(--mu-control-sm);--mu-row-padding: var(--mu-space-2);--mu-row-padding-icon: 6px;--mu-row-font-size: 13px;--mu-row-line-height: 18px;--mu-row-field-font-size: 13px;--mu-row-field-line-height: 18px;--mu-row-radius: var(--mu-radius-sm);--mu-row-gap: var(--mu-space-1);--mu-row-icon: var(--mu-icon-sm);--mu-row-icon-stroke: var(--mu-icon-stroke);--mu-row-check-box: 16px}.mu-s-md{--mu-row-height: var(--mu-control-md);--mu-row-padding: var(--mu-space-3);--mu-row-padding-icon: 10px;--mu-row-font-size: 14px;--mu-row-line-height: 20px;--mu-row-field-font-size: 14px;--mu-row-field-line-height: 20px;--mu-row-radius: var(--mu-radius-md);--mu-row-gap: 6px;--mu-row-icon: var(--mu-icon-md);--mu-row-icon-stroke: var(--mu-icon-stroke);--mu-row-check-box: 18px}@media(pointer:coarse){.mu-s-xs,.mu-s-sm,.mu-s-md{--mu-row-field-font-size: 16px;--mu-row-field-line-height: 20px}}.mu-compact{--mu-control-md: var(--mu-control-compact)}.mu-recessed{background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track)}.mu-raised{background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),rgba(255,255,255,0) 60%);box-shadow:var(--mu-shadow-raised)}.mu-key{background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),rgba(255,255,255,0) 60%);box-shadow:var(--mu-shadow-key)}.mu-popup{background:var(--mu-surface);box-shadow:var(--mu-shadow-pop);border-radius:var(--mu-radius-xl)}.mu-positioner{z-index:var(--mu-layer-popup);outline:0}.mu-popup-motion{transition:opacity var(--mu-duration-fade) var(--mu-ease-out),translate var(--mu-duration-fade) var(--mu-ease-out)}.mu-popup-motion[data-starting-style],.mu-popup-motion[data-ending-style]{opacity:0;translate:0 var(--mu-space-1)}.mu-popup-motion[data-instant]{transition:none}@media(prefers-reduced-motion:reduce){.mu-popup-motion[data-starting-style],.mu-popup-motion[data-ending-style]{translate:none}}.mu-base{font-family:var(--mu-font-sans);font-size:var(--mu-row-font-size, 14px);line-height:var(--mu-row-line-height, 20px);font-weight:500;letter-spacing:0;color:var(--mu-ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent}.mu-base ::selection,.mu-base::selection{background:var(--mu-selection)}.mu-visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.mu-focus:focus-visible{outline:var(--mu-focus-width) solid var(--mu-focus);outline-offset:var(--mu-focus-offset)}.mu-hit{position:relative}@media(pointer:coarse){.mu-hit:after{content:"";position:absolute;left:50%;top:50%;width:max(100%,var(--mu-hit-area));height:max(100%,var(--mu-hit-area));transform:translate(-50%,-50%)}}.mu-icon,.mu-icon-xs,.mu-icon-sm,.mu-icon-md,.mu-base svg.lucide,.mu-prose svg.lucide{width:var(--mu-row-icon, 16px);height:var(--mu-row-icon, 16px);flex:none;display:block;stroke-width:var(--mu-row-icon-stroke, var(--mu-icon-stroke))}.mu-icon *,.mu-icon-xs *,.mu-icon-sm *,.mu-icon-md *,.mu-base svg.lucide *,.mu-prose svg.lucide *{vector-effect:non-scaling-stroke}.mu-icon-xs{--mu-row-icon: var(--mu-icon-xs);--mu-row-icon-stroke: var(--mu-icon-stroke)}.mu-icon-sm{--mu-row-icon: var(--mu-icon-sm);--mu-row-icon-stroke: var(--mu-icon-stroke)}.mu-icon-md{--mu-row-icon: var(--mu-icon-md);--mu-row-icon-stroke: var(--mu-icon-stroke)}.mu-label-xs{font-family:var(--mu-font-sans);font-size:12px;line-height:16px;font-weight:500}.mu-caption-xs{font-family:var(--mu-font-sans);font-size:12px;line-height:16px;font-weight:400}.mu-caption{font-family:var(--mu-font-sans);font-size:13px;line-height:18px;font-weight:400}.mu-label-sm{font-family:var(--mu-font-sans);font-size:13px;line-height:18px;font-weight:500}.mu-body{font-family:var(--mu-font-sans);font-size:14px;line-height:20px;font-weight:400}.mu-label{font-family:var(--mu-font-sans);font-size:14px;line-height:20px;font-weight:500}.mu-title{font-family:var(--mu-font-display);font-size:16px;line-height:24px;font-weight:500;text-wrap:balance}.mu-heading{font-family:var(--mu-font-display);font-size:20px;line-height:28px;font-weight:500;text-wrap:balance}.mu-display{font-family:var(--mu-font-display);font-size:32px;line-height:40px;font-weight:500;letter-spacing:-.02em;text-wrap:balance}.mu-prose{--prose-fs: 16px;--prose-lh: 24px;--prose-h1: 24px;--prose-h1-lh: 32px;--prose-h2: 20px;--prose-h2-lh: 28px;--prose-h3: 16px;--prose-h3-lh: 24px;--prose-head: 13px;--prose-head-lh: 18px}.mu-prose-sm{--prose-fs: 14px;--prose-lh: 22px;--prose-h1: 16px;--prose-h1-lh: 24px;--prose-h2: 14px;--prose-h2-lh: 22px;--prose-h3: 14px;--prose-h3-lh: 22px}}@layer mu{.mu-spinner{display:inline-block;flex:none;box-sizing:border-box;width:var(--mu-row-icon);height:var(--mu-row-icon);border:var(--mu-row-icon-stroke) solid currentColor;border-top-color:transparent;border-radius:var(--mu-radius-full);animation:mu-spin var(--mu-duration-spin) linear infinite}@keyframes mu-spin{to{rotate:1turn}}}@layer mu{.mu-button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--mu-row-gap);box-sizing:border-box;height:var(--mu-row-height);margin:0;padding:0 var(--mu-row-padding);border:0;border-radius:var(--mu-row-radius);color:var(--mu-ink);background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),transparent 60%);box-shadow:var(--mu-shadow-raised);white-space:nowrap;text-decoration:none;cursor:pointer;user-select:none;transition-property:background-color,box-shadow,color,translate;transition-duration:var(--mu-duration-press);transition-timing-function:var(--mu-ease-out)}.mu-button:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-button:where(:has(>.mu-button-label+svg)){padding-inline-end:var(--mu-row-padding-icon)}.mu-button.mu-button-icon{width:var(--mu-row-height);padding:0}.mu-button-label{min-width:0;overflow:hidden;text-overflow:ellipsis}@media(hover:hover){.mu-button:hover:not([data-disabled]){background-color:var(--mu-key-hover)}.mu-button-primary:hover:not([data-disabled]){background-color:var(--mu-primary-hover)}.mu-button-danger:hover:not([data-disabled]){background-color:var(--mu-danger-key);filter:brightness(1.08)}.mu-button-ghost:hover:not([data-disabled]){background-color:var(--mu-hover);color:var(--mu-ink)}}.mu-button:active:not([data-disabled]){translate:0 .5px;box-shadow:var(--mu-shadow-pressed)}.mu-button-primary{color:var(--mu-on-primary);background-color:var(--mu-primary)}.mu-button-danger{color:var(--mu-on-danger);background-color:var(--mu-danger-key)}.mu-button-ghost{color:var(--mu-ink-muted);background-color:transparent;background-image:none;box-shadow:none}.mu-button-ghost[data-popup-open]{background-color:var(--mu-hover);color:var(--mu-ink)}.mu-button-ghost:active:not([data-disabled]){translate:none;background-color:var(--mu-well);box-shadow:var(--mu-shadow-track)}.mu-button[data-disabled]:not([data-loading]){opacity:.45;cursor:not-allowed}.mu-button[data-loading]{cursor:progress}.mu-button[data-loading]>:not(.mu-spinner){opacity:0}.mu-button>.mu-spinner{position:absolute;inset:0;margin:auto}@media(prefers-reduced-motion:reduce){.mu-button:active:not([data-disabled]){translate:none}}}@layer mu{.mu-kbd{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:var(--mu-control-xs);height:var(--mu-control-xs);padding:0 var(--mu-space-1);border-radius:var(--mu-radius-sm);color:var(--mu-ink-muted);background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),transparent 60%);box-shadow:var(--mu-shadow-raised);white-space:nowrap}}@layer mu{.mu-separator{flex:none;align-self:stretch;margin:0;border:0;background-color:var(--mu-line)}.mu-separator[data-orientation=horizontal]{height:1px}.mu-separator[data-orientation=vertical]{width:1px}}@layer mu{.mu-badge{display:inline-flex;align-items:center;gap:var(--mu-space-1);box-sizing:border-box;max-width:100%;height:var(--mu-control-xs);padding:0 calc(var(--mu-row-padding) + var(--mu-space-1) / 2);border-radius:var(--mu-radius-full);white-space:nowrap;vertical-align:middle}.mu-badge-label{min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-badge-neutral{--mu-badge-tint: oklch(from var(--mu-badge-color) clamp(.5, l, .75) c h / 18%);color:var(--mu-ink);background-color:var(--mu-badge-tint, var(--mu-well))}@supports not (color: oklch(from red l c h)){.mu-badge-neutral{--mu-badge-tint: color-mix(in srgb, var(--mu-badge-color) 18%, transparent)}}.mu-badge-primary{color:var(--mu-on-primary);background-color:var(--mu-primary)}.mu-badge-outline{color:var(--mu-ink-muted);box-shadow:inset 0 0 0 1px var(--mu-edge)}.mu-badge-success{color:var(--mu-success);background-color:var(--mu-success-soft)}.mu-badge-warning{color:var(--mu-warning);background-color:var(--mu-warning-soft)}.mu-badge-danger{color:var(--mu-danger);background-color:var(--mu-danger-soft)}}@layer mu{.mu-avatar-root{display:inline-flex;flex:none;align-items:center;justify-content:center;overflow:hidden;box-sizing:border-box;width:var(--mu-row-height);height:var(--mu-row-height);border-radius:var(--mu-radius-full);color:var(--mu-ink-muted);background-color:var(--mu-well);vertical-align:middle;user-select:none}.mu-avatar-image{width:100%;height:100%;object-fit:cover}.mu-avatar-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%}}@layer mu{.mu-link{color:var(--mu-accent);text-decoration:none;text-underline-offset:.2em;border-radius:var(--mu-radius-xs);cursor:pointer}.mu-link:hover,.mu-link:focus-visible,.mu-link-underline{text-decoration:underline}.mu-link-muted{color:var(--mu-ink-muted)}.mu-link-muted:hover{color:var(--mu-ink)}.mu-link>.mu-icon{display:inline-block;width:.85em;height:.85em;margin-inline-start:.1em;vertical-align:-.05em}}@layer mu{.mu-skeleton{box-sizing:border-box;width:100%;height:var(--mu-row-line-height);border-radius:var(--mu-radius-sm);background-color:var(--mu-well);background-image:linear-gradient(90deg,transparent 0%,var(--mu-hover) 50%,transparent 100%);background-size:200% 100%;background-repeat:no-repeat;animation:mu-shimmer var(--mu-duration-shimmer) ease-in-out infinite}.mu-skeleton-round{width:var(--mu-row-height);height:var(--mu-row-height);border-radius:var(--mu-radius-full)}@keyframes mu-shimmer{0%{background-position:150% 0}to{background-position:-50% 0}}@media(prefers-reduced-motion:reduce){.mu-skeleton{animation:none;background-image:none}}}@layer mu{.mu-field-root{display:flex;flex-direction:column;gap:var(--mu-space-1);min-width:0}.mu-field-label{color:var(--mu-ink)}.mu-field-item{display:flex}.mu-field-label:where(:has(>.mu-checkbox,>.mu-switch,>.mu-radio)){display:inline-flex;align-items:center;gap:var(--mu-space-2);font-weight:400;cursor:pointer}.mu-field-label[data-disabled]{opacity:.45;cursor:not-allowed}.mu-field-description{margin:0;color:var(--mu-ink-muted)}.mu-field-root[data-invalid]>.mu-field-description{display:none}.mu-field-horizontal{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:var(--mu-space-4);row-gap:0}.mu-field-horizontal>*{grid-column:2;grid-row:1;justify-self:end}.mu-field-horizontal:where(:has(>.mu-field-description))>*{grid-row:1 / span 2}.mu-field-horizontal>.mu-field-label{grid-column:1;grid-row:1;justify-self:stretch;font-weight:400}.mu-field-horizontal>.mu-field-description{grid-column:1;grid-row:2;justify-self:stretch;margin-top:var(--mu-space-1)}.mu-field-horizontal>.mu-field-error{grid-column:1 / -1;grid-row:3;justify-self:stretch;margin-top:var(--mu-space-1)}.mu-field-error{display:flex;align-items:flex-start;gap:var(--mu-space-1);color:var(--mu-danger)}.mu-field-error>.mu-icon{--mu-row-icon: var(--mu-icon-sm);margin-block:calc((1lh - var(--mu-icon-sm)) / 2)}.mu-fieldset-root{display:flex;flex-direction:column;gap:var(--mu-space-3);min-width:0;margin:0;padding:0;border:0}.mu-fieldset-legend{margin-bottom:var(--mu-space-1);padding:0;color:var(--mu-ink)}}@layer mu{.mu-input-root{display:flex;align-items:center;gap:var(--mu-row-gap);box-sizing:border-box;width:100%;min-width:0;height:var(--mu-row-height);padding:0 var(--mu-row-padding);border-radius:var(--mu-row-radius);color:var(--mu-ink);background-color:var(--mu-surface);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:text;transition:box-shadow var(--mu-duration-fade) var(--mu-ease-out)}.mu-input-root:where(:has(>.mu-input-prefix)){padding-inline-start:var(--mu-row-padding-icon)}.mu-input-root:where(:has(>.mu-input-suffix)){padding-inline-end:var(--mu-row-padding-icon)}@media(hover:hover){.mu-input-root:hover:not([data-disabled],[aria-disabled=true],:has(>[data-disabled]),:focus-within){box-shadow:inset 0 0 0 1px var(--mu-ink-muted),var(--mu-shadow-track)}}.mu-input-root:where(:has(>.mu-input:focus)),.mu-input-root:where(:not(:has(>.mu-input))):focus-within{box-shadow:inset 0 0 0 var(--mu-focus-edge-width) var(--mu-focus-edge),var(--mu-shadow-track);outline:var(--mu-focus-width) solid transparent;outline-offset:calc(-1 * var(--mu-focus-width))}.mu-input-root:is([data-invalid],[aria-invalid=true],:has(>[data-invalid])){box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-input-root:is([data-invalid],[aria-invalid=true],:has(>[data-invalid])):where(:has(>.mu-input:focus),:not(:has(>.mu-input)):focus-within){box-shadow:inset 0 0 0 var(--mu-focus-edge-width) var(--mu-danger),var(--mu-shadow-track)}.mu-input-root:is([data-disabled],[aria-disabled=true],:has(>[data-disabled])){opacity:.45;cursor:not-allowed}.mu-input{flex:1;min-width:0;height:100%;margin:0;padding:0;border:0;outline:none;color:inherit;background:none;font:inherit;font-size:var(--mu-row-field-font-size);font-weight:400}.mu-input-root:where(:not(:has(>.mu-input))) :where(input:not([type=checkbox],[type=radio],[type=range],[type=color],[type=file]),textarea){font-size:var(--mu-row-field-font-size)}.mu-input::placeholder{color:var(--mu-ink-muted);opacity:1}.mu-input[data-disabled]{cursor:not-allowed}.mu-input-prefix,.mu-input-suffix{display:flex;flex:none;align-items:center;gap:var(--mu-space-1);color:var(--mu-ink-muted)}}@layer mu{.mu-textarea{display:block;box-sizing:border-box;width:100%;min-height:var(--mu-row-height);margin:0;padding:calc((var(--mu-row-height) - var(--mu-row-field-line-height)) / 2) var(--mu-row-padding);border:0;border-radius:var(--mu-row-radius);color:var(--mu-ink);background-color:var(--mu-surface);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);font-size:var(--mu-row-field-font-size);line-height:var(--mu-row-field-line-height);font-weight:400;resize:vertical;transition:box-shadow var(--mu-duration-fade) var(--mu-ease-out)}.mu-textarea::placeholder{color:var(--mu-ink-muted);opacity:1}@media(hover:hover){.mu-textarea:hover:not([data-disabled],[aria-disabled=true],:focus-within){box-shadow:inset 0 0 0 1px var(--mu-ink-muted),var(--mu-shadow-track)}}.mu-textarea:focus-within{box-shadow:inset 0 0 0 var(--mu-focus-edge-width) var(--mu-focus-edge),var(--mu-shadow-track);outline:var(--mu-focus-width) solid transparent;outline-offset:calc(-1 * var(--mu-focus-width))}.mu-textarea:is([data-invalid],[aria-invalid=true]){box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-textarea:is([data-invalid],[aria-invalid=true]):focus-within{box-shadow:inset 0 0 0 var(--mu-focus-edge-width) var(--mu-danger),var(--mu-shadow-track)}.mu-textarea:is([data-disabled],[aria-disabled=true]){opacity:.45;cursor:not-allowed}}@layer mu{.mu-checkbox{display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;width:var(--mu-row-check-box);height:var(--mu-row-check-box);border-radius:var(--mu-radius-sm);color:var(--mu-on-primary);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:pointer;transition-property:background-color,box-shadow,scale;transition-duration:var(--mu-duration-press);transition-timing-function:var(--mu-ease-out)}.mu-checkbox[data-checked],.mu-checkbox[data-indeterminate]{background-color:var(--mu-primary);box-shadow:none}.mu-checkbox[data-invalid]{box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-checkbox:active:not([data-disabled],[data-readonly]){scale:.94}.mu-checkbox[data-disabled]{opacity:.45;cursor:not-allowed}.mu-checkbox-indicator{display:flex;transition:opacity var(--mu-duration-fade) var(--mu-ease-out) var(--mu-duration-press),scale var(--mu-duration-fade) var(--mu-ease-out) var(--mu-duration-press)}.mu-checkbox-indicator[data-starting-style],.mu-checkbox-indicator[data-ending-style]{opacity:0;scale:.6}.mu-checkbox-indicator>svg{width:calc(var(--mu-row-check-box) - 2 * var(--mu-inset));height:calc(var(--mu-row-check-box) - 2 * var(--mu-inset));stroke-width:2}.mu-checkbox-indicator>svg *{vector-effect:non-scaling-stroke}@media(prefers-reduced-motion:reduce){.mu-checkbox:active:not([data-disabled],[data-readonly]){scale:none}.mu-checkbox-indicator[data-starting-style],.mu-checkbox-indicator[data-ending-style]{scale:none}}}@layer mu{.mu-switch{--switch-h: calc(var(--mu-row-check-box) + var(--mu-inset));--switch-w: calc(var(--switch-h) * 1.7);--knob: calc(var(--switch-h) - 2 * var(--mu-inset));position:relative;display:inline-flex;flex:none;align-items:center;box-sizing:border-box;width:var(--switch-w);height:var(--switch-h);padding:var(--mu-inset);border-radius:var(--mu-radius-full);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:pointer;transition:background-color var(--mu-duration-settle) var(--mu-ease-settle),box-shadow var(--mu-duration-settle) var(--mu-ease-settle)}.mu-switch[data-checked]{background-color:var(--mu-primary);box-shadow:inset 0 0 0 1px var(--mu-primary)}.mu-switch[data-invalid]{box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-switch[data-disabled]{opacity:.45;cursor:not-allowed}.mu-switch-thumb{display:block;width:var(--knob);height:var(--knob);border-radius:var(--mu-radius-full);background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),transparent 60%);box-shadow:var(--mu-shadow-key);transition:translate var(--mu-duration-settle) var(--mu-ease-settle),scale var(--mu-duration-press) var(--mu-ease-out),background-color var(--mu-duration-settle) var(--mu-ease-settle)}.mu-switch-thumb[data-checked]{translate:calc(var(--switch-w) - var(--switch-h)) 0;background-color:var(--mu-on-primary)}.mu-switch:active:not([data-disabled],[data-readonly])>.mu-switch-thumb{scale:1.1}@media(prefers-reduced-motion:reduce){.mu-switch-thumb{transition-property:background-color}.mu-switch:active:not([data-disabled],[data-readonly])>.mu-switch-thumb{scale:none}}}@layer mu{.mu-radio-group{display:flex;flex-direction:column;align-items:flex-start;gap:var(--mu-space-3)}.mu-radio-group[data-orientation=horizontal]{flex-direction:row;flex-wrap:wrap;gap:var(--mu-space-3) var(--mu-space-4)}.mu-radio-group[data-orientation=horizontal]>.mu-fieldset-legend{flex-basis:100%}.mu-radio{display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;width:var(--mu-row-check-box);height:var(--mu-row-check-box);border-radius:var(--mu-radius-full);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:pointer;transition-property:background-color,box-shadow,scale;transition-duration:var(--mu-duration-press);transition-timing-function:var(--mu-ease-out)}.mu-radio[data-checked]{background-color:var(--mu-primary);box-shadow:none}.mu-radio[data-invalid]{box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-track)}.mu-radio:active:not([data-disabled],[data-readonly]){scale:.94}.mu-radio[data-disabled]{opacity:.45;cursor:not-allowed}.mu-radio-indicator{width:calc(var(--mu-row-check-box) / 2.5);height:calc(var(--mu-row-check-box) / 2.5);border-radius:var(--mu-radius-full);background-color:var(--mu-on-primary);transition:opacity var(--mu-duration-fade) var(--mu-ease-out) var(--mu-duration-press),scale var(--mu-duration-fade) var(--mu-ease-out) var(--mu-duration-press)}.mu-radio-indicator[data-starting-style],.mu-radio-indicator[data-ending-style]{opacity:0;scale:.4}@media(prefers-reduced-motion:reduce){.mu-radio:active:not([data-disabled],[data-readonly]){scale:none}.mu-radio-indicator[data-starting-style],.mu-radio-indicator[data-ending-style]{scale:none}}}@layer mu{.mu-toggle{position:relative;display:inline-flex;flex:0 1 auto;align-items:center;justify-content:center;gap:var(--mu-row-gap);box-sizing:border-box;min-width:0;height:var(--mu-row-height);margin:0;padding:0 var(--mu-row-padding);border:0;border-radius:var(--mu-row-radius);color:var(--mu-ink-muted);background-color:transparent;white-space:nowrap;cursor:pointer;user-select:none;transition-property:background-color,box-shadow,color;transition-duration:var(--mu-duration-press);transition-timing-function:var(--mu-ease-out)}.mu-toggle:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-toggle.mu-toggle-icon{flex:none;width:var(--mu-row-height);padding:0}.mu-toggle-label{min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-toggle>svg{flex:none}@media(hover:hover){.mu-toggle:hover:not([data-disabled]){color:var(--mu-ink);background-color:var(--mu-hover)}}.mu-toggle[data-pressed],.mu-toggle:active:not([data-disabled]){color:var(--mu-ink);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track)}.mu-toggle[data-disabled]{opacity:.45;cursor:not-allowed}}@layer mu{.mu-segmented{position:relative;display:inline-flex;align-items:stretch;gap:0;box-sizing:border-box;height:var(--mu-row-height);padding:var(--mu-inset);border-radius:var(--mu-row-radius);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track)}.mu-segmented-key{position:absolute;top:var(--mu-inset);left:0;width:var(--key-width);height:calc(var(--mu-row-height) - 2 * var(--mu-inset));translate:var(--key-left) 0;border-radius:calc(var(--mu-row-radius) - var(--mu-inset));background-color:var(--mu-key);background-image:linear-gradient(180deg,var(--mu-key-sheen),transparent 60%);box-shadow:var(--mu-shadow-key);transition:translate var(--mu-duration-settle) var(--mu-ease-settle),width var(--mu-duration-settle) var(--mu-ease-settle)}.mu-toggle-group.mu-segmented:not([data-keyed])>.mu-segmented-key{display:none}.mu-tabs-indicator{--key-left: var(--active-tab-left);--key-width: var(--active-tab-width)}.mu-segmented-item,.mu-segmented>.mu-toggle{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--mu-row-gap);box-sizing:border-box;height:100%;margin:0;padding:0 calc(var(--mu-row-padding) - var(--mu-inset));border:0;border-radius:calc(var(--mu-row-radius) - var(--mu-inset));color:var(--mu-ink-muted);background:none;box-shadow:none;font:inherit;white-space:nowrap;cursor:pointer;user-select:none;transition:color var(--mu-duration-fade) var(--mu-ease-out)}.mu-segmented>.mu-toggle.mu-toggle-icon{width:calc(var(--mu-row-height) - 2 * var(--mu-inset));padding:0}@media(hover:hover){.mu-segmented-item:hover:not([data-disabled]),.mu-segmented>.mu-toggle:hover:not([data-disabled]){color:var(--mu-ink);background:none}}.mu-segmented-item[data-active],.mu-segmented>.mu-toggle[data-pressed],.mu-segmented>.mu-toggle:active:not([data-disabled]){color:var(--mu-ink);background:none;box-shadow:none}.mu-segmented-item[data-disabled]{opacity:.45;cursor:not-allowed}.mu-tabs-root{display:flex;flex-direction:column;gap:var(--mu-space-4)}.mu-tabs-list{align-self:flex-start}.mu-tabs-panel{border-radius:var(--mu-radius-sm)}@media(prefers-reduced-motion:reduce){.mu-segmented-key{transition:none}}}@layer mu{.mu-toggle-group{display:inline-flex;align-items:center;gap:var(--mu-inset);box-sizing:border-box;min-width:0;max-width:100%}.mu-toggle-group>.mu-separator{align-self:center;height:max(var(--mu-space-2),calc(var(--mu-row-height) - 2 * var(--mu-space-2)));margin-inline:var(--mu-space-1)}.mu-toggle-group.mu-toggle-group-full{display:flex;width:100%}.mu-toggle-group-full>.mu-toggle:not(.mu-toggle-icon){flex:1 1 auto}}@layer mu{.mu-tooltip-popup{display:flex;align-items:center;gap:var(--mu-space-2);box-sizing:border-box;max-width:var(--mu-tooltip-width);padding:var(--mu-space-1) var(--mu-space-2);border-radius:var(--mu-radius-md);color:var(--mu-on-primary);background-color:var(--mu-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.mu-tooltip-shortcut{opacity:.65}}@layer mu{.mu-popover-popup{display:flex;flex-direction:column;gap:var(--mu-space-3);box-sizing:border-box;width:var(--mu-popover-width);max-width:var(--available-width);padding:var(--mu-space-4);outline:0}.mu-popover-title{margin:0;color:var(--mu-ink)}.mu-popover-description{margin:calc(-1 * var(--mu-space-2)) 0 0;color:var(--mu-ink-muted)}.mu-popover-list{gap:0;padding:var(--mu-space-1)}.mu-popover-list>.mu-popover-title{padding:var(--mu-space-2) var(--mu-row-padding) 0}.mu-popover-list>.mu-popover-description{margin:0;padding:0 var(--mu-row-padding) var(--mu-space-2)}}@layer mu{.mu-menu-popup{box-sizing:border-box;min-width:var(--mu-menu-width);max-height:var(--available-height);overflow-y:auto;padding:var(--mu-space-1);outline:0}.mu-menu-item{display:flex;align-items:center;gap:var(--mu-space-2);box-sizing:border-box;width:100%;height:var(--mu-row-height);margin:0;padding:0 var(--mu-row-padding);border:0;border-radius:calc(var(--mu-radius-xl) - var(--mu-space-1));color:var(--mu-ink);background-color:transparent;font:inherit;font-weight:400;text-align:start;text-decoration:none;white-space:nowrap;cursor:default;user-select:none;outline:0}.mu-menu-item:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-menu-item>svg{color:var(--mu-ink-muted)}.mu-menu-item[data-highlighted],.mu-menu-submenu-trigger[data-popup-open]{background-color:var(--mu-hover)}.mu-menu-item[data-disabled]{opacity:.45}.mu-menu-item-danger,.mu-menu-item-danger>svg{color:var(--mu-danger)}.mu-menu-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-menu-item:where(:has(>.mu-menu-text)){align-items:flex-start;height:auto;min-height:var(--mu-row-height);padding-block:calc((var(--mu-row-height) - var(--mu-row-line-height)) / 2)}.mu-menu-item:where(:has(>.mu-menu-text))>svg,.mu-menu-item:where(:has(>.mu-menu-text))>.mu-menu-indicator{margin-block:calc((var(--mu-row-line-height) - var(--mu-row-icon)) / 2)}.mu-menu-text{display:flex;flex:1;flex-direction:column;min-width:0}.mu-menu-text>.mu-menu-label{flex:none}.mu-menu-description{color:var(--mu-ink-muted);white-space:normal}.mu-menu-shortcut{margin-inline-start:var(--mu-space-4);color:var(--mu-ink-muted)}.mu-menu-indicator{display:grid;flex:none;place-items:center;width:var(--mu-row-icon);height:var(--mu-row-icon);margin-inline-start:var(--mu-space-2)}.mu-menu-indicator>svg{color:var(--mu-ink)}.mu-menu-chevron{margin-inline-end:calc(var(--mu-row-padding-icon) - var(--mu-row-padding));color:var(--mu-ink-muted)}.mu-menu-group-label{padding:var(--mu-space-2) var(--mu-row-padding) var(--mu-space-1);color:var(--mu-ink-muted)}.mu-menu-separator{height:1px;margin:var(--mu-space-1) calc(-1 * var(--mu-space-1));background-color:var(--mu-line)}}@layer mu{.mu-select-trigger{justify-content:space-between;min-width:0;padding-inline-end:var(--mu-row-padding-icon);text-align:start}.mu-select-value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mu-select-value[data-placeholder]{color:var(--mu-ink-muted);font-weight:400}.mu-select-icon{display:flex;flex:none;color:var(--mu-ink-muted)}.mu-select-trigger.mu-button-ghost:not([data-disabled]){color:var(--mu-ink)}.mu-select-trigger[data-invalid]{box-shadow:inset 0 0 0 1px var(--mu-danger),var(--mu-shadow-key)}.mu-select-positioner{outline:0}.mu-select-popup{box-sizing:border-box;min-width:max(var(--mu-menu-width),var(--anchor-width));max-height:var(--available-height);padding:var(--mu-space-1);outline:0}.mu-select-list{overflow-y:auto;max-height:var(--available-height);scroll-padding-block:var(--mu-space-1);outline:0}.mu-select-item{display:flex;align-items:center;gap:var(--mu-space-2);box-sizing:border-box;height:var(--mu-row-height);padding:0 var(--mu-row-padding);border-radius:calc(var(--mu-radius-xl) - var(--mu-space-1));color:var(--mu-ink);font-weight:400;white-space:nowrap;cursor:default;user-select:none;outline:0}.mu-select-item:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-select-item>svg{color:var(--mu-ink-muted)}.mu-select-item[data-highlighted]{background-color:var(--mu-hover)}.mu-select-item[data-disabled]{opacity:.45}.mu-select-item-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-select-indicator{display:grid;flex:none;place-items:center;width:var(--mu-row-icon);height:var(--mu-row-icon);margin-inline-start:var(--mu-space-2);color:var(--mu-ink)}.mu-select-group-label{padding:var(--mu-space-2) var(--mu-row-padding) var(--mu-space-1);color:var(--mu-ink-muted)}.mu-select-separator{height:1px;margin:var(--mu-space-1) calc(-1 * var(--mu-space-1));background-color:var(--mu-line)}.mu-select-scroll-arrow{display:grid;place-items:center;height:var(--mu-space-4);color:var(--mu-ink-muted)}}@layer mu{.mu-dialog-backdrop{position:fixed;inset:0;z-index:var(--mu-layer-overlay);background-color:var(--mu-overlay);transition:opacity var(--mu-duration-settle) var(--mu-ease-out)}.mu-dialog-backdrop[data-starting-style],.mu-dialog-backdrop[data-ending-style]{opacity:0}.mu-dialog-viewport{position:fixed;inset:0;z-index:var(--mu-layer-overlay);display:grid;place-items:safe center;box-sizing:border-box;padding:var(--mu-space-6) var(--mu-space-4);overflow-y:auto}.mu-dialog-popup{position:relative;display:flex;flex-direction:column;gap:var(--mu-space-4);box-sizing:border-box;width:var(--mu-dialog-width);max-width:100%;padding:var(--mu-space-5);border-radius:var(--mu-radius-2xl);outline:0;transition:opacity var(--mu-duration-settle) var(--mu-ease-out),translate var(--mu-duration-settle) var(--mu-ease-out)}.mu-dialog-popup[data-starting-style],.mu-dialog-popup[data-ending-style]{opacity:0;translate:0 var(--mu-space-1)}.mu-dialog-popup:where(:has(>.mu-dialog-x))>.mu-dialog-title{padding-inline-end:var(--mu-space-6)}.mu-dialog-popup.mu-dialog-bare{gap:0;padding:0;overflow:hidden}.mu-dialog-full{place-items:stretch;padding:0}.mu-dialog-full>.mu-dialog-popup{width:100%;height:100%;border-radius:0}.mu-dialog-title{margin:0;color:var(--mu-ink)}.mu-dialog-description{margin:calc(-1 * var(--mu-space-2)) 0 0;color:var(--mu-ink-muted)}.mu-dialog-x{position:absolute;top:var(--mu-space-4);right:var(--mu-space-4)}.mu-dialog-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--mu-space-2);margin-top:var(--mu-space-2)}@media(max-width:639.98px){.mu-dialog-sheet{place-items:end stretch;padding:var(--mu-space-6) 0 0}.mu-dialog-sheet>.mu-dialog-popup{width:100%;padding-bottom:max(var(--mu-space-5),env(safe-area-inset-bottom));border-end-start-radius:0;border-end-end-radius:0}.mu-dialog-sheet>.mu-dialog-popup[data-starting-style],.mu-dialog-sheet>.mu-dialog-popup[data-ending-style]{translate:0 var(--mu-space-6)}.mu-dialog-sheet>.mu-dialog-popup.mu-dialog-bare{padding-bottom:env(safe-area-inset-bottom)}.mu-dialog-sheet .mu-dialog-footer{flex-direction:column-reverse}.mu-dialog-sheet .mu-dialog-footer>*{width:100%}}@media(prefers-reduced-motion:reduce){.mu-dialog-popup[data-starting-style],.mu-dialog-popup[data-ending-style],.mu-dialog-sheet>.mu-dialog-popup[data-starting-style],.mu-dialog-sheet>.mu-dialog-popup[data-ending-style]{translate:none}}}@layer mu{.mu-drawer-backdrop{position:fixed;inset:0;z-index:var(--mu-layer-overlay);background-color:var(--mu-overlay);opacity:calc(1 - var(--drawer-swipe-progress, 0));transition:opacity var(--mu-duration-settle) var(--mu-ease-out)}.mu-drawer-backdrop[data-starting-style],.mu-drawer-backdrop[data-ending-style]{opacity:0}.mu-drawer-viewport{position:fixed;inset:0;z-index:var(--mu-layer-overlay);display:flex}.mu-drawer-left{justify-content:flex-start}.mu-drawer-right{justify-content:flex-end}.mu-drawer-bottom{align-items:flex-end}.mu-drawer-popup{--drawer-hidden: 0 0;position:relative;box-sizing:border-box;width:var(--mu-drawer-width);max-width:calc(100% - var(--mu-space-12));height:100%;overflow-y:auto;overscroll-behavior:contain;background-color:var(--mu-surface);box-shadow:var(--mu-shadow-pop);outline:0;translate:var(--drawer-swipe-movement-x, 0) var(--drawer-swipe-movement-y, 0);transition:translate var(--mu-duration-settle) var(--mu-ease-settle),opacity var(--mu-duration-settle) var(--mu-ease-out)}.mu-drawer-bottom>.mu-drawer-popup{width:100%;max-width:none;height:auto;max-height:calc(100% - var(--mu-space-6));padding-bottom:env(safe-area-inset-bottom);border-start-start-radius:var(--mu-radius-2xl);border-start-end-radius:var(--mu-radius-2xl)}.mu-drawer-left>.mu-drawer-popup{--drawer-hidden: -100% 0;border-right:1px solid var(--mu-line)}.mu-drawer-right>.mu-drawer-popup{--drawer-hidden: 100% 0;border-left:1px solid var(--mu-line)}.mu-drawer-bottom>.mu-drawer-popup{--drawer-hidden: 0 100%}.mu-drawer-popup[data-starting-style],.mu-drawer-popup[data-ending-style]{translate:var(--drawer-hidden)}.mu-drawer-popup[data-swiping]{transition:none;user-select:none}.mu-drawer-content{display:flex;flex-direction:column;gap:var(--mu-space-4);box-sizing:border-box;min-height:100%;padding:var(--mu-space-5)}.mu-drawer-bare>.mu-drawer-content{gap:0;height:100%;min-height:0;padding:0}.mu-drawer-popup:where(:has(>.mu-drawer-x))>.mu-drawer-content>.mu-drawer-title{padding-inline-end:var(--mu-space-6)}.mu-drawer-title{margin:0;color:var(--mu-ink)}.mu-drawer-description{margin:calc(-1 * var(--mu-space-2)) 0 0;color:var(--mu-ink-muted)}.mu-drawer-x{position:absolute;top:var(--mu-space-4);inset-inline-end:var(--mu-space-4)}@media(prefers-reduced-motion:reduce){.mu-drawer-popup[data-starting-style],.mu-drawer-popup[data-ending-style]{translate:none;opacity:0}}}@layer mu{.mu-toast-viewport{position:fixed;top:var(--mu-space-6);right:var(--mu-space-6);z-index:var(--mu-layer-toast);width:var(--mu-toast-width);outline:0}@media(max-width:639.98px){.mu-toast-viewport{top:max(var(--mu-space-4),env(safe-area-inset-top));right:var(--mu-space-4);left:var(--mu-space-4);width:auto}}.mu-toast{--mu-row-gap: var(--mu-space-3);--peek: var(--mu-space-2);--scale: max(0, 1 - var(--toast-index) * .05);--shrink: calc(1 - var(--scale));--height: var(--toast-frontmost-height, var(--toast-height));--offset-y: calc(var(--toast-offset-y) + var(--toast-index) * var(--mu-row-gap) + var(--toast-swipe-movement-y));position:absolute;top:0;right:0;z-index:calc(var(--mu-layer-toast) - var(--toast-index));box-sizing:border-box;width:100%;height:var(--height);transform-origin:top center;translate:var(--toast-swipe-movement-x) calc(var(--toast-swipe-movement-y) + var(--toast-index) * var(--peek) + var(--shrink) * var(--height));scale:var(--scale);user-select:none;outline:0;transition:translate var(--mu-duration-settle) var(--mu-ease-settle),scale var(--mu-duration-settle) var(--mu-ease-settle),opacity var(--mu-duration-settle) var(--mu-ease-out),height var(--mu-duration-fade) var(--mu-ease-out)}.mu-toast[data-expanded]{height:var(--toast-height);translate:var(--toast-swipe-movement-x) var(--offset-y);scale:1}.mu-toast[data-starting-style],.mu-toast[data-ending-style]{translate:0 -150%}.mu-toast[data-ending-style]{opacity:0}.mu-toast[data-ending-style][data-swipe-direction=up]{translate:0 calc(var(--toast-swipe-movement-y) - 150%)}.mu-toast[data-ending-style][data-swipe-direction=down]{translate:0 calc(var(--toast-swipe-movement-y) + 150%)}.mu-toast[data-ending-style][data-swipe-direction=left]{translate:calc(var(--toast-swipe-movement-x) - 150%) var(--offset-y)}.mu-toast[data-ending-style][data-swipe-direction=right]{translate:calc(var(--toast-swipe-movement-x) + 150%) var(--offset-y)}.mu-toast[data-limited]{opacity:0}.mu-toast:focus-visible{outline:var(--mu-focus-width) solid var(--mu-focus);outline-offset:var(--mu-focus-offset)}.mu-toast:after{content:"";position:absolute;bottom:100%;left:0;width:100%;height:calc(var(--mu-row-gap) + 1px)}.mu-toast-content{display:flex;align-items:flex-start;gap:var(--mu-space-3);box-sizing:border-box;height:100%;padding:var(--mu-space-3) var(--mu-space-3) var(--mu-space-3) var(--mu-space-4);overflow:hidden;transition:opacity var(--mu-duration-settle) var(--mu-ease-out)}.mu-toast-content[data-behind]{opacity:0}.mu-toast-content[data-expanded]{opacity:1}.mu-toast-icon{margin-block:calc((var(--mu-row-height) - var(--mu-row-icon)) / 2);color:var(--mu-ink-muted)}.mu-toast-success .mu-toast-icon{color:var(--mu-success)}.mu-toast-warning .mu-toast-icon{color:var(--mu-warning)}.mu-toast-danger .mu-toast-icon{color:var(--mu-danger)}.mu-toast-text{display:flex;flex:1;flex-direction:column;min-width:0;padding-block:calc((var(--mu-row-height) - var(--mu-row-line-height)) / 2)}.mu-toast-title{margin:0;color:var(--mu-ink)}.mu-toast-description{margin:0;color:var(--mu-ink-muted)}.mu-toast-action,.mu-toast-close{margin-block:calc((var(--mu-control-md) - var(--mu-control-sm)) / 2)}@media(prefers-reduced-motion:reduce){.mu-toast{transition-property:opacity,height}.mu-toast[data-starting-style],.mu-toast[data-ending-style]{translate:var(--toast-swipe-movement-x) var(--offset-y)}}}@layer mu{.mu-input-root.mu-combobox-input-root{padding-inline-end:calc(var(--mu-row-padding-icon) - var(--mu-space-1))}.mu-combobox-trigger{display:grid;place-items:center;width:calc(var(--mu-row-icon) + var(--mu-space-2));height:calc(var(--mu-row-icon) + var(--mu-space-2));margin:0;padding:0;border:0;border-radius:var(--mu-radius-sm);color:var(--mu-ink-muted);background:none;cursor:pointer}.mu-combobox-trigger:hover:not([data-disabled]){color:var(--mu-ink)}.mu-combobox-trigger[data-disabled]{cursor:not-allowed}.mu-combobox-popup{box-sizing:border-box;width:var(--anchor-width);min-width:var(--mu-menu-width);max-width:var(--available-width);outline:0}.mu-combobox-list{box-sizing:border-box;max-height:min(var(--mu-list-height),var(--available-height));overflow-y:auto;overscroll-behavior:contain;padding:var(--mu-space-1);scroll-padding-block:var(--mu-space-1);outline:0}.mu-combobox-list[data-empty]{padding:0}.mu-combobox-item{display:flex;align-items:center;gap:var(--mu-space-2);box-sizing:border-box;height:var(--mu-row-height);padding:0 var(--mu-row-padding);border-radius:calc(var(--mu-radius-xl) - var(--mu-space-1));color:var(--mu-ink);font-weight:400;white-space:nowrap;cursor:default;user-select:none;outline:0}.mu-combobox-item:where(:has(>svg:first-child)){padding-inline-start:var(--mu-row-padding-icon)}.mu-combobox-item>svg{color:var(--mu-ink-muted)}.mu-combobox-item[data-highlighted]{background-color:var(--mu-hover)}.mu-combobox-item[data-disabled]{opacity:.45}.mu-combobox-item-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.mu-combobox-indicator{display:grid;flex:none;place-items:center;width:var(--mu-row-icon);height:var(--mu-row-icon);margin-inline-start:var(--mu-space-2);color:var(--mu-ink)}.mu-combobox-row{display:flex;gap:var(--mu-inset)}.mu-combobox-row+.mu-combobox-row{margin-top:var(--mu-inset)}.mu-combobox-row>.mu-combobox-item{flex:none;justify-content:center;width:var(--mu-row-height);padding:0;border-radius:var(--mu-row-radius)}.mu-combobox-row>.mu-combobox-item>.mu-combobox-item-text{flex:none;overflow:visible}.mu-combobox-row>.mu-combobox-item>.mu-combobox-indicator{display:none}.mu-combobox-row>.mu-combobox-item[data-selected]{background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track)}.mu-combobox-empty:not(:empty){padding:var(--mu-space-3) var(--mu-space-4);color:var(--mu-ink-muted)}.mu-combobox-group-label{padding:var(--mu-space-2) var(--mu-row-padding) var(--mu-space-1);color:var(--mu-ink-muted)}.mu-combobox-separator{height:1px;margin:var(--mu-space-1) calc(-1 * var(--mu-space-1));background-color:var(--mu-line)}}@layer mu{.mu-button.mu-collapsible-trigger{margin-inline-start:calc(-1 * var(--mu-row-padding));padding-inline-end:var(--mu-row-padding-icon)}.mu-collapsible-chevron{color:var(--mu-ink-muted);transition:rotate var(--mu-duration-settle) var(--mu-ease-settle)}.mu-collapsible-trigger[data-panel-open]>.mu-collapsible-chevron{rotate:180deg}.mu-collapsible-panel{transition:opacity var(--mu-duration-fade) var(--mu-ease-out),translate var(--mu-duration-fade) var(--mu-ease-out)}.mu-collapsible-panel[data-starting-style],.mu-collapsible-panel[data-ending-style]{opacity:0;translate:0 var(--mu-space-1)}@media(prefers-reduced-motion:reduce){.mu-collapsible-chevron{transition:none}.mu-collapsible-panel[data-starting-style],.mu-collapsible-panel[data-ending-style]{translate:none}}}@layer mu{.mu-table-scroll{overflow-x:auto;max-width:100%}.mu-table-bordered{box-sizing:border-box;border:1px solid var(--mu-line);border-radius:var(--mu-radius-lg);background-color:var(--mu-surface)}.mu-table{width:100%;border-collapse:collapse;color:var(--mu-ink);font-variant-numeric:tabular-nums;text-align:start}.mu-table-head,.mu-table-cell{padding:0 var(--mu-row-padding);text-align:start;vertical-align:middle}.mu-table-head{height:var(--mu-row-height);color:var(--mu-ink-muted);white-space:nowrap;border-bottom:1px solid var(--mu-line)}.mu-table-cell{padding-block:calc((var(--mu-row-height) - var(--mu-row-line-height)) / 2 + var(--mu-space-1))}.mu-table-body>.mu-table-row+.mu-table-row>.mu-table-cell{border-top:1px solid var(--mu-line)}.mu-table-body>.mu-table-row:hover>.mu-table-cell{background-color:var(--mu-hover)}.mu-table-actions{display:inline-flex;align-items:center;gap:var(--mu-space-1);vertical-align:top}.mu-table-cell>:is(.mu-button,.mu-table-actions){margin-block:calc((var(--mu-row-line-height) - var(--mu-row-height)) / 2);vertical-align:top}.mu-table-num{text-align:end}.mu-table-muted{color:var(--mu-ink-muted)}.mu-table-caption{caption-side:bottom;padding:var(--mu-space-2) var(--mu-row-padding) 0;color:var(--mu-ink-muted);text-align:start}.mu-table-bordered .mu-table-caption{padding-bottom:var(--mu-space-2);border-top:1px solid var(--mu-line)}.mu-table-bordered .mu-table-head{background-color:var(--mu-canvas)}.mu-table-bordered :is(.mu-table-head,.mu-table-cell):first-child,.mu-table-bordered .mu-table-caption{padding-inline-start:calc(var(--mu-row-padding) + var(--mu-space-1))}.mu-table-bordered :is(.mu-table-head,.mu-table-cell):last-child{padding-inline-end:calc(var(--mu-row-padding) + var(--mu-space-1))}}@layer mu{.mu-list{box-sizing:border-box;margin:0;padding:0;border:1px solid var(--mu-line);border-radius:var(--mu-radius-lg);color:var(--mu-ink);background-color:var(--mu-surface);list-style:none}.mu-list{--list-pad-block: var(--mu-space-3);--list-pad-inline: var(--mu-space-4)}.mu-list.mu-s-sm{--list-pad-block: var(--mu-space-2);--list-pad-inline: var(--mu-space-3)}.mu-list-item{box-sizing:border-box;min-width:0;padding:var(--list-pad-block) var(--list-pad-inline)}.mu-list-item+.mu-list-item{border-top:1px solid var(--mu-line)}.mu-list-item-button{display:flex;align-items:center;gap:var(--mu-space-3);box-sizing:border-box;width:calc(100% + 2 * var(--list-pad-inline));margin:calc(-1 * var(--list-pad-block)) calc(-1 * var(--list-pad-inline));padding:var(--list-pad-block) var(--list-pad-inline);border:0;border-radius:0;color:inherit;background-color:transparent;font:inherit;text-align:start;text-decoration:none;cursor:pointer;transition:background-color var(--mu-duration-press) var(--mu-ease-out)}.mu-list-item:first-child>.mu-list-item-button{border-start-start-radius:calc(var(--mu-radius-lg) - 1px);border-start-end-radius:calc(var(--mu-radius-lg) - 1px)}.mu-list-item:last-child>.mu-list-item-button{border-end-start-radius:calc(var(--mu-radius-lg) - 1px);border-end-end-radius:calc(var(--mu-radius-lg) - 1px)}@media(hover:hover){.mu-list-item-button:hover:not(:disabled){background-color:var(--mu-hover)}}.mu-list-item-button:active:not(:disabled){background-color:var(--mu-hover)}.mu-list-item-button:disabled{opacity:.45;cursor:not-allowed}@media(prefers-reduced-motion:reduce){.mu-list-item-button{transition:none}}}@layer mu{.mu-form{display:flex;flex-direction:column;gap:var(--mu-space-4);box-sizing:border-box;min-width:0;margin:0;color:var(--mu-ink)}.mu-form-title{margin:0;color:var(--mu-ink)}.mu-form-description{margin:calc(-1 * var(--mu-space-3)) 0 0;color:var(--mu-ink-muted)}.mu-form-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--mu-space-2)}.mu-form-bordered{padding:var(--mu-space-4);border:1px solid var(--mu-line);border-radius:var(--mu-radius-lg);background-color:var(--mu-surface)}.mu-form-bordered>.mu-form-footer{margin:0 calc(-1 * var(--mu-space-4)) calc(-1 * var(--mu-space-4));padding:var(--mu-space-3) var(--mu-space-4);border-top:1px solid var(--mu-line);border-end-start-radius:calc(var(--mu-radius-lg) - 1px);border-end-end-radius:calc(var(--mu-radius-lg) - 1px);background-color:var(--mu-canvas)}}@layer mu{.mu-prose{color:var(--mu-ink);font-family:var(--mu-font-sans);font-size:var(--prose-fs);line-height:var(--prose-lh);font-weight:400;overflow-wrap:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.mu-prose ::selection{background:var(--mu-selection)}.mu-prose :where(p,ul,ol,pre,blockquote,table,figure,img,video,hr){margin:0 0 var(--mu-space-3)}.mu-prose :where(h1,h2,h3,h4,h5,h6){margin:var(--mu-space-5) 0 var(--mu-space-2);font-family:var(--mu-font-display);font-weight:600;letter-spacing:0;text-wrap:balance}.mu-prose :where(p,li){text-wrap:pretty}.mu-prose>:first-child{margin-top:0}.mu-prose>:last-child{margin-bottom:0}.mu-prose h1{font-size:var(--prose-h1);line-height:var(--prose-h1-lh)}.mu-prose h2{font-size:var(--prose-h2);line-height:var(--prose-h2-lh)}.mu-prose :where(h3,h4,h5,h6){font-size:var(--prose-h3);line-height:var(--prose-h3-lh)}.mu-prose :where(strong,b){font-weight:600}.mu-prose del{color:var(--mu-ink-muted)}.mu-prose a{color:var(--mu-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;border-radius:var(--mu-radius-xs)}.mu-prose a:focus-visible{outline:var(--mu-focus-width) solid var(--mu-focus);outline-offset:var(--mu-focus-offset)}.mu-prose :where(ul,ol){padding-inline-start:var(--mu-space-6)}.mu-prose li+li{margin-top:var(--mu-space-1)}.mu-prose li>:where(ul,ol){margin:var(--mu-space-1) 0 0}.mu-prose li>p{margin:0}.mu-prose li::marker{color:var(--mu-ink-muted)}.mu-prose li:where(:has(>input[type=checkbox]:first-child)){position:relative;list-style:none}.mu-prose li>input[type=checkbox]:first-child{appearance:none;position:absolute;inset-inline-start:calc(-1 * (var(--mu-space-4) + var(--mu-space-2)));top:calc((var(--prose-lh) - var(--mu-space-4)) / 2);box-sizing:border-box;width:var(--mu-space-4);height:var(--mu-space-4);margin:0;border-radius:var(--mu-radius-sm);background-color:var(--mu-well);box-shadow:inset 0 0 0 1px var(--mu-edge),var(--mu-shadow-track);cursor:pointer}.mu-prose li>input[type=checkbox]:first-child:disabled{cursor:default}.mu-prose li>input[type=checkbox]:first-child:focus-visible{outline:var(--mu-focus-width) solid var(--mu-focus);outline-offset:var(--mu-focus-offset)}.mu-prose li>input[type=checkbox]:first-child:checked{background-color:var(--mu-primary);box-shadow:none}.mu-prose li>input[type=checkbox]:first-child:checked:after{content:"";position:absolute;inset:var(--mu-inset);background-color:var(--mu-on-primary);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat}.mu-prose li:where(:has(>input[type=checkbox]:first-child:checked)){color:var(--mu-ink-muted);text-decoration:line-through}.mu-prose :where(code,kbd,samp,pre){font-family:var(--mu-font-mono);font-size:.875em}.mu-prose :not(pre)>code{padding:.1em .3em;border-radius:var(--mu-radius-xs);background-color:var(--mu-well)}.mu-prose pre{overflow-x:auto;padding:var(--mu-space-3) var(--mu-space-4);border-radius:var(--mu-radius-md);background-color:var(--mu-well);line-height:1.6}.mu-prose pre>code{font-size:inherit}.mu-prose blockquote{margin-inline:0;padding-inline-start:var(--mu-space-4);border-inline-start:var(--mu-inset) solid var(--mu-edge);color:var(--mu-ink-muted)}.mu-prose hr{height:1px;margin-block:var(--mu-space-5);border:0;background-color:var(--mu-line)}.mu-prose :where(img,video){display:block;max-width:100%;height:auto;border-radius:var(--mu-radius-lg)}.mu-prose table{display:block;width:max-content;max-width:100%;overflow-x:auto;border-collapse:collapse;font-variant-numeric:tabular-nums}.mu-prose :where(th,td){padding:var(--mu-space-2) var(--mu-space-3);text-align:start;vertical-align:top}.mu-prose th{color:var(--mu-ink-muted);font-size:var(--prose-head);line-height:var(--prose-head-lh);font-weight:500;white-space:nowrap;border-bottom:1px solid var(--mu-line)}.mu-prose tr+tr>td{border-top:1px solid var(--mu-line)}.mu-prose-tag{padding:0 .25em;border-radius:var(--mu-radius-xs);color:var(--mu-ink-muted);background-color:var(--mu-well)}}
@@ -20,5 +20,5 @@ export interface BadgeClassesOptions {
20
20
  * `<a className={badgeClasses()} href="/tags/work">work</a>`.
21
21
  */
22
22
  export declare function badgeClasses({ tone }?: BadgeClassesOptions): string;
23
- /** A tag or status label: one or two words. */
23
+ /** A tag or status label: one or two words, in a pill. A label wider than its container ends in an ellipsis. */
24
24
  export declare const Badge: import("react").ForwardRefExoticComponent<Omit<BadgeProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
@@ -16,7 +16,12 @@ export interface PopupProps extends BaseMenu.Popup.Props, PositionerProps {
16
16
  /** Where the menu is portaled to. Default `document.body`. */
17
17
  container?: BaseMenu.Portal.Props['container'];
18
18
  }
19
- /** The list of items. Also the popup of a submenu, inside `SubmenuRoot`. */
19
+ /**
20
+ * The list of items. Also the popup of a submenu, inside `SubmenuRoot`: there
21
+ * it moves along the trigger by its own top padding (read when it is placed,
22
+ * so it follows `space-1`), which lines its first row up with the trigger row,
23
+ * or its last row when it opens upward.
24
+ */
20
25
  export declare const Popup: import("react").ForwardRefExoticComponent<Omit<PopupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
21
26
  interface RowProps {
22
27
  /** A Lucide element before the label. */
@@ -59,7 +64,7 @@ export interface SeparatorProps extends BaseMenu.Separator.Props {
59
64
  export declare const Separator: import("react").ForwardRefExoticComponent<Omit<SeparatorProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
60
65
  export type SubmenuRootProps = BaseMenu.SubmenuRoot.Props;
61
66
  /** Holds a SubmenuTrigger and its own Popup. */
62
- export declare const SubmenuRoot: typeof BaseMenu.SubmenuRoot;
67
+ export declare function SubmenuRoot(props: SubmenuRootProps): import("react/jsx-runtime").JSX.Element;
63
68
  export interface SubmenuTriggerProps extends BaseMenu.SubmenuTrigger.Props {
64
69
  icon?: IconElement;
65
70
  children?: ReactNode;
package/llms-full.txt CHANGED
@@ -72,7 +72,7 @@ It is not a general-purpose UI library for outside developers. Components are ge
72
72
  - A brand hue on controls, or blue anywhere at rest except links.
73
73
  - Cards and boxes around content. Group with spacing, a heading and a `Separator`. The exceptions are rows of settings or records: a [List](components/list.md), or a [Table](components/table.md) with `bordered`.
74
74
  - Textures, glass or blur behind text, and neumorphism.
75
- - Pills for buttons, inputs or badges.
75
+ - Pills for buttons or inputs.
76
76
  - Color as the only signal. Status colors always come with a word or an icon.
77
77
  - Illustrations in empty states.
78
78
 
@@ -266,11 +266,11 @@ Each depth class applies a whole role in one class. Use them for new parts befor
266
266
 
267
267
  ## Rules
268
268
 
269
- - Use few sizes and few weights. App text uses four sizes (13, 14, 16 and 20px) and two weights (400 and 500); 12px is only for the labels of 20px parts (see `label-xs`). Hierarchy comes from text color, spacing and grouping first, then from weight, and from size last.
270
- - Weight 400 is for running text and values people typed or chose. Weight 500 is for labels, controls, titles and headings. The UI uses no 600 or 700. The one exception is [Prose](components/prose.md): bold text and headings that people wrote are 600, because 500 does not read as bold in system fonts.
269
+ - Use few sizes and few weights. App text uses four sizes (13, 14, 16 and 20px) and two weights (400 and 500); 12px is only for the text of 20px parts (see `label-xs` and `caption-xs`). Hierarchy comes from text color, spacing and grouping first, then from weight, and from size last.
270
+ - Weight 400 is for running text, values people typed or chose, and badge text (a badge's tone and fill carry its weight). Weight 500 is for labels, controls, titles and headings. The UI uses no 600 or 700. The one exception is [Prose](components/prose.md): bold text and headings that people wrote are 600, because 500 does not read as bold in system fonts.
271
271
  - 20px (`heading`) is for the page title only, once per page. 32px (`display`) is for the hero headline on a website only, once per page. Nothing else in the UI is larger than 16px, and 16px is only for `title` and Prose text. Headings that people write inside Prose have their own sizes (see [Prose](#prose)).
272
272
  - A section title inside a page or panel is `label` (14px, 500), set apart by space above it, not by a larger size. See [Page](patterns.md#page).
273
- - Secondary text (descriptions, helper text, metadata) is `caption` (13px) in `ink-muted`. No text is smaller than 13px, except `label-xs` inside 20px parts.
273
+ - Secondary text (descriptions, helper text, metadata) is `caption` (13px) in `ink-muted`. No text is smaller than 13px, except `label-xs` and `caption-xs` inside 20px parts.
274
274
  - Control text scales with the control size: 12px at xs, 13px at sm, 14px at md.
275
275
  - Reading text (`Prose`) is 16px on a 24px line. `sm` prose is 14px on a 22px line, for dense lists.
276
276
  - Letter spacing is 0, except −0.02em for `display`.
@@ -293,13 +293,14 @@ The package ships no font files and loads no remote font: text uses the system U
293
293
 
294
294
  ## Scale
295
295
 
296
- Eight styles over six sizes. 13 and 14px each have a 400 style for text and a 500 style for labels; 12px has only a label style; the three headings are 500. Body text on a website is `body`, or `Prose` for long-form copy.
296
+ Nine styles over six sizes. 12, 13 and 14px each have a 400 style for text and a 500 style for labels; the three headings are 500. Body text on a website is `body`, or `Prose` for long-form copy.
297
297
 
298
298
  ### Text (`--mu-font-sans`)
299
299
 
300
300
  | Style | Size / line | Weight | Usage |
301
301
  | --- | --- | --- | --- |
302
- | `label-xs` | 12 / 16px | 500 | Labels inside xs controls, badges and kbd: the parts that are 20px tall. Never for running or secondary text. The reason for the size: xs controls must read as tiny, and at 13px they read as sm controls with less padding |
302
+ | `label-xs` | 12 / 16px | 500 | Labels inside xs controls and kbd: 20px parts you press. Never for running or secondary text. The reason for the size: xs controls must read as tiny, and at 13px they read as sm controls with less padding |
303
+ | `caption-xs` | 12 / 16px | 400 | Text inside badges: 20px labels. Never for running or secondary text. The reason for the style: a badge is a label, not a heading, and at 500 every tag and status read heavier than the 13px `caption` metadata around it. Badges get their hierarchy from tone and fill |
303
304
  | `caption` | 13 / 18px | 400 | Secondary text: field descriptions and errors, metadata, timestamps, toast and popover descriptions, table captions, sm table cells. Usually in `ink-muted` |
304
305
  | `label-sm` | 13 / 18px | 500 | Labels inside sm controls, tooltips, group labels in menus and lists, table heads |
305
306
  | `body` | 14 / 20px | 400 | Default running text in app UI; dialog descriptions; the names in rows people scan: Menu and Select items, settings row names, sidebar navigation rows |
@@ -383,14 +384,14 @@ Inner radius = outer radius − `inset`, so nested corners stay concentric.
383
384
  | Token | Value | Usage |
384
385
  | --- | --- | --- |
385
386
  | `radius-xs` | 2px | Keys inside sm wells (`radius-sm` minus the 2px inset); inline code |
386
- | `radius-sm` | 4px | sm controls; badges |
387
+ | `radius-sm` | 4px | sm controls |
387
388
  | `radius-md` | 6px | md controls, the default |
388
389
  | `radius-lg` | 8px | Images in Prose |
389
390
  | `radius-xl` | 12px | Menus, select lists, popovers and toasts |
390
391
  | `radius-2xl` | 16px | Dialogs and sheets |
391
- | `radius-full` | 9999px | Avatars, radios, switches and their knobs only |
392
+ | `radius-full` | 9999px | Avatars, radios, switches and their knobs, and badges only |
392
393
 
393
- Buttons, inputs and badges are never pills.
394
+ Buttons and inputs are never pills; badges always are, so a label is never mistaken for a control.
394
395
 
395
396
  ## Sizes
396
397
 
@@ -875,6 +876,7 @@ Base UI's props pass through: `open`, `defaultOpen`, `onOpenChange`, `modal` on
875
876
  - The highlighted row uses `hover`. Disabled rows fade to 45%. `danger` rows use `danger`.
876
877
  - A ghost trigger keeps its `hover` background while the menu is open.
877
878
  - Fades in and rises `space-1` over `duration-fade`; no rise under reduced motion.
879
+ - A submenu opens beside its trigger row, 4px from the row. The row sits `space-1` inside the parent menu, so the submenu's edge touches the parent's edge. The submenu moves up by its own top padding (`space-1`, read when it is placed), so its first row lines up with the trigger row. With no room below, it opens upward instead and its last row lines up with the trigger row.
878
880
 
879
881
  <!-- docs/components/link.md -->
880
882
 
@@ -1984,11 +1986,15 @@ function badgeClasses(options?: { tone?: Tone | "outline" | "primary" }): string
1984
1986
  - When people can give a tag a color, pass it as `color`. The color tints the fill; the text and the icon stay `ink`, so every color the user can pick stays readable in both themes. Never set the text or the icon in the user's color: on its own tint it falls below 4.5:1 for most colors in one theme or the other. A tag without a color keeps `well`.
1985
1987
  - `color` is for colors people choose. The package's own meanings use tones: status is `success`, `warning` or `danger`, emphasis is `primary`.
1986
1988
  - A badge is not a button. A clickable tag filter is a [Toggle](toggle.md).
1989
+ - A badge is round and a control is square. Kbd and Toggle stay square.
1990
+ - A label wider than its container ends in an ellipsis. Keep tags short; give a cut tag its full text in `title`.
1987
1991
  - An app's own element that should look like a badge, such as a tag that is also a link, takes `badgeClasses()`. See [Class functions](../custom-components.md#class-functions).
1988
1992
 
1989
1993
  ## Style
1990
1994
 
1991
- - `control-xs` (20px) tall, `radius-sm` (never a pill), `label-xs` text (12px, 500), optional `icon-xs` (12px) icon at a 1.25px stroke. It lines up with xs controls.
1995
+ - `control-xs` (20px) tall, `radius-full` (a pill: round marks a label, square marks a control), `caption-xs` text (12px, 400), optional `icon-xs` (12px) icon at a 1.25px stroke. It lines up with xs controls.
1996
+ - Inline padding is the xs row's `--mu-row-padding` plus 2px (half of `space-1`) on each side, so the text clears the round ends. The gap between icon and text is `space-1`.
1997
+ - Regular weight, because a badge is a label, not a heading: hierarchy among badges comes from tone and fill, not weight. `outline` text is `ink-muted`, 5.1:1 or more on `canvas`, `surface` and `well` in both themes.
1992
1998
  - `neutral`: `ink` on `well`. With `color`, the fill is an 18% tint of that color over the background, the same amount in both themes, and the text and icon stay `ink`. The color's lightness is first kept between 50% and 75% (OKLCH), so an ink-like color (black in Dark, white in Light) still gives a visible gray chip instead of vanishing into the background; hues in that range are unchanged. The prop sets `--mu-badge-color` on the badge; an app's own element with `badgeClasses()` sets that variable itself (see [Class functions](../custom-components.md#class-functions)). `primary`: `on-primary` on `primary`, the colors of a primary Button. Status tones: their `-soft` background with full-strength text.
1993
1999
 
1994
2000
  <!-- docs/components/kbd.md -->
@@ -3152,7 +3158,8 @@ Apply these classes to an app's own elements. Don't override their rules: the pr
3152
3158
  | `mu-icon-sm` | A 14px icon with a 1.25px stroke | A Lucide icon beside 13px or 14px text, outside a control |
3153
3159
  | `mu-icon-md` | A 16px icon with a 1.25px stroke | A Lucide icon beside 14px or 16px text, outside a control |
3154
3160
  | `mu-visually-hidden` | Hidden on screen, read by screen readers | Text for screen readers only |
3155
- | `mu-label-xs` | 12 / 16px, 500 | Labels of 20px parts |
3161
+ | `mu-label-xs` | 12 / 16px, 500 | Labels of 20px controls and kbd |
3162
+ | `mu-caption-xs` | 12 / 16px, 400 | Text of 20px labels (badges) |
3156
3163
  | `mu-caption` | 13 / 18px, 400 | Secondary text |
3157
3164
  | `mu-label-sm` | 13 / 18px, 500 | Small labels |
3158
3165
  | `mu-body` | 14 / 20px, 400 | Body text |
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@usememos/ui",
3
- "version": "26.11.5",
3
+ "version": "26.11.7",
4
4
  "description": "The Memos UI design system: tokens, foundation styles and React components for usememos products.",
5
5
  "keywords": [
6
6
  "react",