@flowstack-ui/brick 0.1.12 → 0.2.0

package/dist/styles/code-block.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,+cAcA,4HAKA,uCACE,sFAKF,8BACE,qIAMF,iIAUA,mIE1CA,0tEAwDA,iEAIA,yJAKA,+JAKA,wMAKA,gGAIA,iGAMA,qKAKA,gHAKA,mFAKA,wDAKA,wCAIA,yGAIA,yCAIA,4FAOA,uHAKA,gDAIA,wDAIA,8EAIA,6SASA,0SASA,8SASA,0SASA,wzBAyBA,gqBAaA,0oBAaA,2qBAaA,2qBAaA,gqBAaA,4VAQA,kUAQA,4SAQA,wCACE,0JAKA,sMAKA,gGAKF,uCACE,sCAKF,8BACE,6EAMA,oDAIA,6EDpUF,ixCA8BA,kKAOA,oEACA,gKAIA,gKAKA,8BACE,oHEhDF,06CA8BA,oQAMA,4GAIA,8mBAYA,+mBAYA,iJASA,sGAKA,mJAIA,wxBAyBA,6HACA,wGACA,2KACA,wFAEA,qWAWA,4XAaA,gFACA,kGAEA,qIAMA,qJACA,uJACA,qMAEA,4IAIA,6IACA,gJACA,6DACA,yKAKA,uFACA,wFACA,mGACA,oGAEA,uCACE,6CACA,qDAGF,8BACE,wFACA,0HACA,4CACA,kEC/KF,2KAQA,6OAUA,4EACA,8EACA,iEAEA,qGACA,8HACA,gIACA,wHACA,8HACA,iNAIA,gLAKA,8BACE,uIAEA,mECvCF,y/DAsCA,iKAKA,+GAKA,wrBAYA,gPASA,qSASA,8NAKA,4GAOA,mDAEA,2LAOA,0KAQA,uZAaA,8HAMA,0FAMA,kRASA,qKAMA,+NAQA,iDACA,sGACA,8FACA,uKAIA,6KAKA,qHAKA,6FAKA,6KAEA,iDACA,mDAEA,yNAQA,6IAKA,6SAOA,6EAEA,8BACE,mlBN9MJ","sources":["home/runner/work/brick/brick/.brick-cache/production/code-block.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-spinner/action-spinner.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code/code.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/button/button.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/collapsible/collapsible.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/scroll-area/scroll-area.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code-block/code-block.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-spinner/action-spinner.css\";\n@import \"../../src/components/button/button.css\";\n@import \"../../src/components/code/code.css\";\n@import \"../../src/components/collapsible/collapsible.css\";\n@import \"../../src/components/scroll-area/scroll-area.css\";\n@import \"../../src/components/code-block/code-block.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  :where(.brick-button, .brick-icon-button)[data-loading]::after {\n    position: absolute;\n    inset-block-start: 50%;\n    inset-inline-start: 50%;\n    inline-size: var(--brick-action-spinner-size);\n    block-size: var(--brick-action-spinner-size);\n    border: 0.125rem solid transparent;\n    border-block-start-color: var(--brick-action-spinner-color);\n    border-inline-end-color: var(--brick-action-spinner-color);\n    border-radius: var(--brick-radius-full);\n    content: \"\";\n    animation: brick-action-spinner-spin 700ms linear infinite;\n  }\n\n  :where([dir=\"rtl\"])\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n    animation-name: brick-action-spinner-spin-rtl;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n      animation-duration: 1400ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n      border-block-start-color: ButtonText;\n      border-inline-end-color: ButtonText;\n    }\n  }\n\n  @keyframes brick-action-spinner-spin {\n    from {\n      transform: translate(-50%, -50%) rotate(0deg);\n    }\n\n    to {\n      transform: translate(-50%, -50%) rotate(360deg);\n    }\n  }\n\n  @keyframes brick-action-spinner-spin-rtl {\n    from {\n      transform: translate(50%, -50%) rotate(0deg);\n    }\n\n    to {\n      transform: translate(50%, -50%) rotate(360deg);\n    }\n  }\n}\n","@layer brick.components {\n  .brick-code {\n    --brick-code-foreground: var(--brick-color-text-primary);\n    --brick-code-background: var(--brick-color-surface-subtle);\n    --brick-code-border-color: var(--brick-color-border-subtle);\n    --brick-code-border-width: var(--brick-border-width);\n    --brick-code-radius: var(--brick-radius-subtle);\n    --brick-code-padding-block: 0.0625em;\n    --brick-code-padding-inline: 0.3em;\n    --brick-code-font-family: var(--brick-typography-code-inline-font-family);\n    --brick-code-font-size: var(--brick-typography-code-inline-font-size);\n    --brick-code-font-weight: var(--brick-typography-code-inline-font-weight);\n    --brick-code-line-height: var(--brick-typography-code-inline-line-height);\n    --brick-code-letter-spacing: var(--brick-typography-code-inline-letter-spacing);\n\n    box-decoration-break: clone;\n    padding: var(--brick-code-padding-block) var(--brick-code-padding-inline);\n    border: var(--brick-code-border-width) solid var(--brick-code-border-color);\n    border-radius: var(--brick-code-radius);\n    background: var(--brick-code-background);\n    color: var(--brick-code-foreground);\n    font-family: var(--brick-code-font-family);\n    font-size: var(--brick-code-font-size);\n    font-weight: var(--brick-code-font-weight);\n    letter-spacing: var(--brick-code-letter-spacing);\n    line-height: var(--brick-code-line-height);\n    overflow-wrap: anywhere;\n    white-space: normal;\n    -webkit-box-decoration-break: clone;\n  }\n\n  .brick-code[data-variant=\"plain\"] {\n    --brick-code-background: transparent;\n    --brick-code-border-width: 0rem;\n    --brick-code-padding-block: 0em;\n    --brick-code-padding-inline: 0em;\n  }\n\n  .brick-code[data-tone=\"inherit\"] { --brick-code-foreground: currentColor; }\n  .brick-code[data-size=\"sm\"] {\n    --brick-code-font-size: var(--brick-typography-body-sm-font-size);\n    --brick-code-line-height: var(--brick-typography-body-sm-line-height);\n  }\n  .brick-code[data-size=\"md\"] {\n    --brick-code-font-size: var(--brick-typography-body-md-font-size);\n    --brick-code-line-height: var(--brick-typography-body-md-line-height);\n  }\n\n  @media (forced-colors: active) {\n    .brick-code {\n      --brick-code-foreground: CanvasText;\n      --brick-code-background: Canvas;\n      --brick-code-border-color: CanvasText;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-button {\n    --brick-button-background: var(--brick-button-tone-solid);\n    --brick-button-background-hover: var(--brick-button-tone-solid-hover);\n    --brick-button-background-pressed: var(--brick-button-tone-solid-pressed);\n    --brick-button-foreground: var(--brick-button-tone-on-solid);\n    --brick-button-border-color: var(--brick-button-background);\n    --brick-button-focus-ring: var(--brick-color-focus-ring);\n    --brick-button-min-block-size: var(--brick-control-min-block-size-md);\n    --brick-button-padding-block: 0.5rem;\n    --brick-button-padding-inline: 1rem;\n    --brick-button-gap: 0.5rem;\n    --brick-button-radius: var(--brick-radius-control);\n    --brick-button-font-family: var(--brick-typography-control-md-font-family);\n    --brick-button-font-size: var(--brick-typography-control-md-font-size);\n    --brick-button-font-weight: var(--brick-typography-control-md-font-weight);\n    --brick-button-line-height: var(--brick-typography-control-md-line-height);\n    --brick-button-letter-spacing: var(--brick-typography-control-md-letter-spacing);\n    --brick-button-icon-size: 1.125rem;\n    --brick-action-spinner-size: 1em;\n    --brick-action-spinner-color: var(\n      --brick-button-spinner-color,\n      var(--brick-button-foreground)\n    );\n\n    position: relative;\n    display: inline-flex;\n    box-sizing: border-box;\n    min-inline-size: 0;\n    max-inline-size: 100%;\n    min-block-size: var(--brick-button-min-block-size);\n    align-items: center;\n    justify-content: center;\n    gap: var(--brick-button-gap);\n    padding-block: var(--brick-button-padding-block);\n    padding-inline: var(--brick-button-padding-inline);\n    border: var(--brick-border-width) solid var(--brick-button-border-color);\n    border-radius: var(--brick-button-radius);\n    appearance: none;\n    background: var(--brick-button-background);\n    color: var(--brick-button-foreground);\n    font-family: var(--brick-button-font-family);\n    font-size: var(--brick-button-font-size);\n    font-weight: var(--brick-button-font-weight);\n    letter-spacing: var(--brick-button-letter-spacing);\n    line-height: var(--brick-button-line-height);\n    text-align: center;\n    text-decoration: none;\n    overflow-wrap: anywhere;\n    user-select: none;\n    vertical-align: middle;\n    transition:\n      background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n  }\n\n  .brick-button:not([data-disabled], [data-loading]) {\n    cursor: pointer;\n  }\n\n  .brick-button:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-button-focus-ring);\n    outline-offset: var(--brick-border-focus-offset);\n  }\n\n  .brick-button:not([data-disabled], [data-loading]):active {\n    background: var(--brick-button-background-pressed);\n    border-color: var(--brick-button-background-pressed);\n  }\n\n  .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):active,\n  .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):active {\n    border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):active {\n    border-color: transparent;\n  }\n\n  .brick-button[data-disabled] {\n    color: var(--brick-color-text-disabled);\n    cursor: not-allowed;\n    opacity: 1;\n  }\n\n  .brick-button[data-disabled]:is([data-variant=\"solid\"], [data-variant=\"soft\"]) {\n    border-color: var(--brick-color-border-subtle);\n    background: var(--brick-color-surface-subtle);\n  }\n\n  .brick-button[data-disabled][data-variant=\"outline\"] {\n    border-color: var(--brick-color-border-subtle);\n    background: transparent;\n  }\n\n  .brick-button[data-disabled][data-variant=\"ghost\"] {\n    border-color: transparent;\n    background: transparent;\n  }\n\n  .brick-button[data-loading] {\n    cursor: progress;\n    color: transparent;\n  }\n\n  .brick-button[data-loading] > * {\n    opacity: 0;\n  }\n\n  .brick-button[data-disabled][data-loading] {\n    --brick-button-spinner-color: var(--brick-color-text-disabled);\n  }\n\n  .brick-button__content {\n    min-inline-size: 0;\n  }\n\n  .brick-button__icon {\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    justify-content: center;\n  }\n\n  .brick-button__icon > :where(svg, img) {\n    inline-size: var(--brick-button-icon-size);\n    block-size: var(--brick-button-icon-size);\n  }\n\n  .brick-button[data-full-width] {\n    inline-size: 100%;\n  }\n\n  .brick-button[data-shape=\"sharp\"] {\n    --brick-button-radius: 0;\n  }\n\n  .brick-button[data-shape=\"pill\"] {\n    --brick-button-radius: var(--brick-radius-full);\n  }\n\n  .brick-button[data-size=\"xs\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-xs);\n    --brick-button-padding-block: 0.25rem;\n    --brick-button-padding-inline: 0.625rem;\n    --brick-button-gap: 0.375rem;\n    --brick-button-font-size: var(--brick-typography-control-xs-font-size);\n    --brick-button-icon-size: 0.875rem;\n  }\n\n  .brick-button[data-size=\"sm\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-sm);\n    --brick-button-padding-block: 0.375rem;\n    --brick-button-padding-inline: 0.75rem;\n    --brick-button-gap: 0.375rem;\n    --brick-button-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-button-icon-size: 1rem;\n  }\n\n  .brick-button[data-size=\"lg\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-lg);\n    --brick-button-padding-block: 0.625rem;\n    --brick-button-padding-inline: 1.25rem;\n    --brick-button-gap: 0.625rem;\n    --brick-button-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-button-icon-size: 1.25rem;\n  }\n\n  .brick-button[data-size=\"xl\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-xl);\n    --brick-button-padding-block: 0.75rem;\n    --brick-button-padding-inline: 1.5rem;\n    --brick-button-gap: 0.75rem;\n    --brick-button-font-size: var(--brick-typography-control-xl-font-size);\n    --brick-button-icon-size: 1.5rem;\n  }\n\n  .brick-button[data-tone=\"neutral\"] {\n    --brick-button-tone-solid: color-mix(\n      in srgb,\n      var(--brick-color-surface-subtle),\n      var(--brick-color-text-primary) 16%\n    );\n    --brick-button-tone-solid-hover: color-mix(\n      in srgb,\n      var(--brick-color-surface-subtle),\n      var(--brick-color-text-primary) 22%\n    );\n    --brick-button-tone-solid-pressed: color-mix(\n      in srgb,\n      var(--brick-color-surface-subtle),\n      var(--brick-color-text-primary) 28%\n    );\n    --brick-button-tone-on-solid: var(--brick-color-text-primary);\n    --brick-button-tone-soft: var(--brick-color-surface-subtle);\n    --brick-button-tone-soft-hover: var(--brick-color-surface-base);\n    --brick-button-tone-soft-pressed: var(--brick-color-border-subtle);\n    --brick-button-tone-on-soft: var(--brick-color-text-primary);\n    --brick-button-tone-border: var(--brick-color-border-strong);\n    --brick-button-tone-text: var(--brick-color-text-primary);\n  }\n\n  .brick-button[data-tone=\"accent\"] {\n    --brick-button-tone-solid: var(--brick-color-accent-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-accent-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-accent-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-accent-on-solid);\n    --brick-button-tone-soft: var(--brick-color-accent-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-accent-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-accent-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-accent-on-soft);\n    --brick-button-tone-border: var(--brick-color-accent-border);\n    --brick-button-tone-text: var(--brick-color-accent-text);\n  }\n\n  .brick-button[data-tone=\"info\"] {\n    --brick-button-tone-solid: var(--brick-color-info-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-info-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-info-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-info-on-solid);\n    --brick-button-tone-soft: var(--brick-color-info-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-info-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-info-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-info-on-soft);\n    --brick-button-tone-border: var(--brick-color-info-border);\n    --brick-button-tone-text: var(--brick-color-info-text);\n  }\n\n  .brick-button[data-tone=\"success\"] {\n    --brick-button-tone-solid: var(--brick-color-success-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-success-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-success-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-success-on-solid);\n    --brick-button-tone-soft: var(--brick-color-success-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-success-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-success-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-success-on-soft);\n    --brick-button-tone-border: var(--brick-color-success-border);\n    --brick-button-tone-text: var(--brick-color-success-text);\n  }\n\n  .brick-button[data-tone=\"warning\"] {\n    --brick-button-tone-solid: var(--brick-color-warning-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-warning-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-warning-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-warning-on-solid);\n    --brick-button-tone-soft: var(--brick-color-warning-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-warning-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-warning-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-warning-on-soft);\n    --brick-button-tone-border: var(--brick-color-warning-border);\n    --brick-button-tone-text: var(--brick-color-warning-text);\n  }\n\n  .brick-button[data-tone=\"danger\"] {\n    --brick-button-tone-solid: var(--brick-color-danger-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-danger-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-danger-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-danger-on-solid);\n    --brick-button-tone-soft: var(--brick-color-danger-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-danger-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-danger-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-danger-on-soft);\n    --brick-button-tone-border: var(--brick-color-danger-border);\n    --brick-button-tone-text: var(--brick-color-danger-text);\n  }\n\n  .brick-button[data-variant=\"soft\"] {\n    --brick-button-background: var(--brick-button-tone-soft);\n    --brick-button-background-hover: var(--brick-button-tone-soft-hover);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-pressed);\n    --brick-button-foreground: var(--brick-button-tone-on-soft);\n    --brick-button-border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"outline\"] {\n    --brick-button-background: transparent;\n    --brick-button-background-hover: var(--brick-button-tone-soft);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n    --brick-button-foreground: var(--brick-button-tone-text);\n    --brick-button-border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"ghost\"] {\n    --brick-button-background: transparent;\n    --brick-button-background-hover: var(--brick-button-tone-soft);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n    --brick-button-foreground: var(--brick-button-tone-text);\n    --brick-button-border-color: transparent;\n  }\n\n  @media (hover: hover) and (pointer: fine) {\n    .brick-button:not([data-disabled], [data-loading]):hover {\n      background: var(--brick-button-background-hover);\n      border-color: var(--brick-button-background-hover);\n    }\n\n    .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):hover,\n    .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):hover {\n      border-color: var(--brick-button-tone-border);\n    }\n\n    .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):hover {\n      border-color: transparent;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .brick-button {\n      transition-duration: 0ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .brick-button {\n      border-color: ButtonText;\n      background: ButtonFace;\n      color: ButtonText;\n    }\n\n    .brick-button:focus-visible {\n      outline-color: Highlight;\n    }\n\n    .brick-button[data-disabled] {\n      border-color: GrayText;\n      color: GrayText;\n      opacity: 1;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-collapsible {\n    --brick-collapsible-background: transparent;\n    --brick-collapsible-border-color: transparent;\n    --brick-collapsible-trigger-background: transparent;\n    --brick-collapsible-trigger-hover-background: var(--brick-color-surface-subtle);\n    --brick-collapsible-trigger-open-background: var(--brick-color-surface-subtle);\n    --brick-collapsible-foreground: var(--brick-color-text-primary);\n    --brick-collapsible-content-foreground: var(--brick-color-text-secondary);\n    --brick-collapsible-focus-ring: var(--brick-color-focus-ring);\n    --brick-collapsible-radius: var(--brick-radius-control);\n    --brick-collapsible-trigger-height: 2.75rem;\n    --brick-collapsible-trigger-padding-inline: var(--brick-space-3);\n    --brick-collapsible-trigger-gap: var(--brick-space-2);\n    --brick-collapsible-content-padding-block: var(--brick-space-3);\n    --brick-collapsible-content-padding-inline: var(--brick-space-3);\n    --brick-collapsible-indicator-size: 1rem;\n    --brick-collapsible-font-family: var(--brick-typography-control-md-font-family);\n    --brick-collapsible-font-size: var(--brick-typography-control-md-font-size);\n    --brick-collapsible-font-weight: var(--brick-typography-control-md-font-weight);\n    --brick-collapsible-line-height: var(--brick-typography-control-md-line-height);\n\n    box-sizing: border-box;\n    inline-size: 100%;\n    min-inline-size: 0;\n    overflow: visible;\n    border: var(--brick-border-width) solid var(--brick-collapsible-border-color);\n    border-radius: var(--brick-collapsible-radius);\n    background: var(--brick-collapsible-background);\n  }\n\n  .brick-collapsible[data-variant=\"soft\"] {\n    --brick-collapsible-background: var(--brick-color-surface-subtle);\n    --brick-collapsible-trigger-hover-background: var(--brick-color-surface-raised);\n    --brick-collapsible-trigger-open-background: var(--brick-color-surface-raised);\n  }\n\n  .brick-collapsible[data-variant=\"outline\"] {\n    --brick-collapsible-border-color: var(--brick-color-border-default);\n  }\n\n  .brick-collapsible[data-size=\"sm\"] {\n    --brick-collapsible-trigger-height: 2.25rem;\n    --brick-collapsible-trigger-padding-inline: var(--brick-space-2);\n    --brick-collapsible-content-padding-block: var(--brick-space-2);\n    --brick-collapsible-content-padding-inline: var(--brick-space-2);\n    --brick-collapsible-indicator-size: 0.875rem;\n    --brick-collapsible-font-family: var(--brick-typography-control-sm-font-family);\n    --brick-collapsible-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-collapsible-font-weight: var(--brick-typography-control-sm-font-weight);\n    --brick-collapsible-line-height: var(--brick-typography-control-sm-line-height);\n  }\n\n  .brick-collapsible[data-size=\"lg\"] {\n    --brick-collapsible-trigger-height: 3.25rem;\n    --brick-collapsible-trigger-padding-inline: var(--brick-space-4);\n    --brick-collapsible-content-padding-block: var(--brick-space-4);\n    --brick-collapsible-content-padding-inline: var(--brick-space-4);\n    --brick-collapsible-indicator-size: 1.125rem;\n    --brick-collapsible-font-family: var(--brick-typography-control-lg-font-family);\n    --brick-collapsible-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-collapsible-font-weight: var(--brick-typography-control-lg-font-weight);\n    --brick-collapsible-line-height: var(--brick-typography-control-lg-line-height);\n  }\n\n  .brick-collapsible[data-orientation=\"horizontal\"] {\n    display: flex;\n    inline-size: max-content;\n    max-inline-size: 100%;\n    align-items: stretch;\n    overflow-x: auto;\n    overflow-y: clip;\n  }\n\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-trigger {\n    inline-size: auto;\n    flex: 0 0 auto;\n  }\n\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-trigger:focus-visible {\n    outline-offset: calc(-1 * var(--brick-border-focus-width));\n  }\n\n  .brick-collapsible-trigger {\n    display: flex;\n    box-sizing: border-box;\n    inline-size: 100%;\n    min-inline-size: 0;\n    min-block-size: var(--brick-collapsible-trigger-height);\n    align-items: center;\n    justify-content: flex-start;\n    gap: var(--brick-collapsible-trigger-gap);\n    padding-block: var(--brick-space-2);\n    padding-inline: var(--brick-collapsible-trigger-padding-inline);\n    border: 0;\n    border-radius: calc(var(--brick-collapsible-radius) - var(--brick-border-width));\n    background: var(--brick-collapsible-trigger-background);\n    color: var(--brick-collapsible-foreground);\n    font-family: var(--brick-collapsible-font-family);\n    font-size: var(--brick-collapsible-font-size);\n    font-weight: var(--brick-collapsible-font-weight);\n    line-height: var(--brick-collapsible-line-height);\n    text-align: start;\n    white-space: normal;\n    cursor: pointer;\n    touch-action: manipulation;\n  }\n\n  .brick-collapsible-trigger:hover:not(:disabled, [data-disabled]) { background: var(--brick-collapsible-trigger-hover-background); }\n  .brick-collapsible-trigger[data-state=\"open\"] { background: var(--brick-collapsible-trigger-open-background); }\n  .brick-collapsible-trigger:focus-visible { outline: var(--brick-border-focus-width) solid var(--brick-collapsible-focus-ring); outline-offset: var(--brick-border-focus-offset); }\n  .brick-collapsible-trigger:is(:disabled, [data-disabled]) { opacity: 0.55; cursor: not-allowed; }\n\n  .brick-collapsible-trigger[data-icon-only] {\n    inline-size: var(--brick-collapsible-trigger-height);\n    min-inline-size: var(--brick-collapsible-trigger-height);\n    block-size: var(--brick-collapsible-trigger-height);\n    min-block-size: var(--brick-collapsible-trigger-height);\n    flex: 0 0 var(--brick-collapsible-trigger-height);\n    justify-content: center;\n    padding: 0;\n    text-align: center;\n  }\n\n  .brick-collapsible-indicator {\n    display: inline-flex;\n    inline-size: var(--brick-collapsible-indicator-size);\n    block-size: var(--brick-collapsible-indicator-size);\n    flex: 0 0 auto;\n    align-items: center;\n    justify-content: center;\n    margin-inline-start: auto;\n    color: currentColor;\n    transform: rotate(0deg);\n    transform-origin: center;\n    transition: transform var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n  }\n  .brick-collapsible-indicator > svg { display: block; inline-size: 100%; block-size: 100%; }\n  .brick-collapsible-trigger[data-state=\"open\"] .brick-collapsible-indicator { transform: rotate(180deg); }\n\n  .brick-collapsible-content {\n    box-sizing: border-box;\n    min-inline-size: 0;\n    overflow: hidden;\n    color: var(--brick-collapsible-content-foreground);\n  }\n  .brick-collapsible-content[data-state=\"open\"] { animation: brick-collapsible-open var(--brick-motion-duration-fast) var(--brick-motion-easing-enter) both; }\n  .brick-collapsible-content[data-state=\"closed\"] { animation: brick-collapsible-close var(--brick-motion-duration-fast) var(--brick-motion-easing-exit) both; }\n  .brick-collapsible-content-inner { box-sizing: border-box; min-inline-size: 0; padding-block: var(--brick-collapsible-content-padding-block); padding-inline: var(--brick-collapsible-content-padding-inline); }\n\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content {\n    flex: 0 0 auto;\n    min-block-size: var(--brick-collapsible-trigger-height);\n  }\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content[data-state=\"open\"] { animation-name: brick-collapsible-open-horizontal; }\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content[data-state=\"closed\"] { animation-name: brick-collapsible-close-horizontal; }\n  .brick-collapsible-content[data-initial-open] { animation: none; }\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content-inner {\n    inline-size: var(--content-width);\n    min-block-size: var(--brick-collapsible-trigger-height);\n  }\n\n  @keyframes brick-collapsible-open { from { block-size: 0; } to { block-size: var(--content-height); } }\n  @keyframes brick-collapsible-close { from { block-size: var(--content-height); } to { block-size: 0; } }\n  @keyframes brick-collapsible-open-horizontal { from { inline-size: 0; } to { inline-size: var(--content-width); } }\n  @keyframes brick-collapsible-close-horizontal { from { inline-size: var(--content-width); } to { inline-size: 0; } }\n\n  @media (prefers-reduced-motion: reduce) {\n    .brick-collapsible-indicator { transition: none; }\n    .brick-collapsible-content { animation: none !important; }\n  }\n\n  @media (forced-colors: active) {\n    .brick-collapsible { --brick-collapsible-border-color: CanvasText; forced-color-adjust: auto; }\n    .brick-collapsible[data-variant=\"plain\"], .brick-collapsible[data-variant=\"soft\"] { --brick-collapsible-border-color: transparent; }\n    .brick-collapsible-trigger { color: ButtonText; }\n    .brick-collapsible-trigger:focus-visible { outline-color: Highlight; }\n  }\n}\n","@layer brick.components {\n  .brick-scroll-area {\n    --brick-scroll-area-scrollbar-thumb: var(--brick-color-border-strong);\n    --brick-scroll-area-scrollbar-track: transparent;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n  }\n\n  .brick-scroll-area-viewport {\n    box-sizing: border-box;\n    inline-size: 100%;\n    block-size: 100%;\n    min-inline-size: 0;\n    min-block-size: 0;\n    scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n    scrollbar-width: auto;\n  }\n\n  .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-x: hidden; overflow-y: auto; }\n  .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: auto; overflow-y: hidden; }\n  .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: auto; }\n\n  .brick-scroll-area[data-scrollbar-gutter=\"stable\"] > .brick-scroll-area-viewport { scrollbar-gutter: stable; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-y: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: transparent transparent; }\n  .brick-scroll-area[data-scrollbar-visibility=\"interaction\"]:is(:hover, :focus-within) > .brick-scroll-area-viewport {\n    scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n  }\n\n  .brick-scroll-area-viewport:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n    outline-offset: calc(-1 * var(--brick-border-focus-width));\n  }\n\n  @media (forced-colors: active) {\n    .brick-scroll-area-viewport,\n    .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: auto; }\n    .brick-scroll-area-viewport:focus-visible { outline-color: Highlight; }\n  }\n}\n","@layer brick.components {\n  .brick-code-block {\n    --brick-code-block-background: var(--brick-color-surface-subtle);\n    --brick-code-block-foreground: var(--brick-color-text-primary);\n    --brick-code-block-border-color: var(--brick-color-border-subtle);\n    --brick-code-block-border-width: 0rem;\n    --brick-code-block-radius: var(--brick-radius-surface);\n    --brick-code-block-header-padding: var(--brick-space-3) var(--brick-space-4);\n    --brick-code-block-content-padding: var(--brick-space-4);\n    --brick-code-block-content-padding-block: var(--brick-space-4);\n    --brick-code-block-content-padding-inline: var(--brick-space-4);\n    --brick-code-block-gap: var(--brick-space-2);\n    --brick-code-block-font-family: var(--brick-typography-code-block-md-font-family);\n    --brick-code-block-font-size: var(--brick-typography-code-block-md-font-size);\n    --brick-code-block-font-weight: var(--brick-typography-code-block-md-font-weight);\n    --brick-code-block-line-height: var(--brick-typography-code-block-md-line-height);\n    --brick-code-block-letter-spacing: var(--brick-typography-code-block-md-letter-spacing);\n    --brick-code-block-selection-background: var(--brick-color-accent-soft);\n    --brick-code-block-selection-foreground: var(--brick-color-accent-text);\n    --brick-code-block-line-number-foreground: var(--brick-color-text-secondary);\n    --brick-code-block-line-number-width: 3ch;\n    --brick-code-block-line-highlight-background: var(--brick-color-accent-soft);\n    --brick-code-block-line-focus-background: var(--brick-color-surface-raised);\n    --brick-code-block-line-added-background: var(--brick-color-success-soft);\n    --brick-code-block-line-added-border: var(--brick-color-success-border);\n    --brick-code-block-line-removed-background: var(--brick-color-danger-soft);\n    --brick-code-block-line-removed-border: var(--brick-color-danger-border);\n    --brick-code-block-max-block-size: none;\n\n    box-sizing: border-box;\n    min-inline-size: 0;\n    max-inline-size: 100%;\n    overflow: clip;\n    border: var(--brick-code-block-border-width) solid var(--brick-code-block-border-color);\n    border-radius: var(--brick-code-block-radius);\n    background: var(--brick-code-block-background);\n    color: var(--brick-code-block-foreground);\n  }\n\n  .brick-code-block[data-variant=\"bordered\"] {\n    --brick-code-block-background: var(--brick-color-surface-base);\n    --brick-code-block-border-width: var(--brick-border-width);\n  }\n\n  .brick-code-block[data-variant=\"plain\"] {\n    --brick-code-block-background: transparent;\n    --brick-code-block-radius: 0rem;\n  }\n\n  .brick-code-block[data-size=\"sm\"] {\n    --brick-code-block-header-padding: var(--brick-space-2) var(--brick-space-3);\n    --brick-code-block-content-padding: var(--brick-space-3);\n    --brick-code-block-content-padding-block: var(--brick-space-3);\n    --brick-code-block-content-padding-inline: var(--brick-space-3);\n    --brick-code-block-font-family: var(--brick-typography-code-block-sm-font-family);\n    --brick-code-block-font-size: var(--brick-typography-code-block-sm-font-size);\n    --brick-code-block-font-weight: var(--brick-typography-code-block-sm-font-weight);\n    --brick-code-block-line-height: var(--brick-typography-code-block-sm-line-height);\n    --brick-code-block-letter-spacing: var(--brick-typography-code-block-sm-letter-spacing);\n  }\n\n  .brick-code-block-header {\n    display: flex;\n    align-items: center;\n    min-inline-size: 0;\n    gap: var(--brick-code-block-gap);\n    padding: var(--brick-code-block-header-padding);\n    border-block-end: var(--brick-border-width) solid var(--brick-code-block-border-color);\n  }\n\n  .brick-code-block-title {\n    min-inline-size: 0;\n    overflow: hidden;\n    color: var(--brick-color-text-primary);\n    font: var(--brick-font-weight-medium) var(--brick-typography-body-sm-font-size) / var(--brick-typography-body-sm-line-height) var(--brick-font-family-body);\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .brick-code-block-language {\n    color: var(--brick-color-text-secondary);\n    font: var(--brick-font-weight-medium) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-font-family-mono);\n  }\n\n  .brick-code-block-actions {\n    display: flex;\n    align-items: center;\n    gap: var(--brick-space-1);\n    margin-inline-start: auto;\n  }\n\n  .brick-code-block-scroll-area { max-inline-size: 100%; }\n\n  .brick-code-block-content {\n    max-inline-size: 100%;\n    padding: var(--brick-code-block-content-padding);\n    font-size: var(--brick-code-block-font-size);\n    line-height: var(--brick-code-block-line-height);\n  }\n\n  .brick-code-block-content[data-max-lines] {\n    max-block-size: calc(\n      var(--brick-code-block-max-block-size) +\n      2 * var(--brick-code-block-content-padding-block)\n    );\n    overflow-y: auto;\n  }\n\n  .brick-code-block-pre {\n    min-inline-size: max-content;\n    margin: 0;\n    text-size-adjust: none;\n    font-family: var(--brick-code-block-font-family);\n    font-size: var(--brick-code-block-font-size);\n    font-weight: var(--brick-code-block-font-weight);\n    letter-spacing: var(--brick-code-block-letter-spacing);\n    line-height: var(--brick-code-block-line-height);\n    tab-size: 2;\n    white-space: pre;\n  }\n\n  .brick-code-block-content[data-wrap=\"wrap\"] .brick-code-block-pre {\n    min-inline-size: 0;\n    white-space: pre-wrap;\n    overflow-wrap: anywhere;\n  }\n\n  .brick-code-block-pre > .brick-code {\n    font: inherit;\n    letter-spacing: inherit;\n    white-space: inherit;\n  }\n\n  .brick-code-block-line {\n    display: block;\n    position: relative;\n    min-inline-size: 100%;\n    padding-inline: var(--brick-code-block-content-padding-inline);\n    margin-inline: calc(-1 * var(--brick-code-block-content-padding-inline));\n    border-inline-start: var(--brick-border-width) solid transparent;\n  }\n\n  .brick-code-block-line[data-line-number] {\n    display: grid;\n    grid-template-columns: var(--brick-code-block-line-number-width) minmax(0, 1fr);\n    column-gap: var(--brick-space-3);\n  }\n\n  .brick-code-block-line[data-line-number]::before {\n    content: attr(data-line-number);\n    color: var(--brick-code-block-line-number-foreground);\n    font-variant-numeric: tabular-nums;\n    text-align: end;\n    user-select: none;\n  }\n\n  .brick-code-block-line-content { min-inline-size: 0; }\n  .brick-code-block-line[data-highlighted] { background: var(--brick-code-block-line-highlight-background); }\n  .brick-code-block-line[data-focused] { background: var(--brick-code-block-line-focus-background); }\n  .brick-code-block-line[data-change=\"added\"] {\n    border-inline-start-color: var(--brick-code-block-line-added-border);\n    background: var(--brick-code-block-line-added-background);\n  }\n  .brick-code-block-line[data-change=\"removed\"] {\n    border-inline-start-color: var(--brick-code-block-line-removed-border);\n    background: var(--brick-code-block-line-removed-background);\n  }\n\n  .brick-code-block-content[data-wrap=\"wrap\"] .brick-code-block-line-content {\n    overflow-wrap: anywhere;\n    white-space: pre-wrap;\n  }\n\n  .brick-code-block-collapse-preview\n    .brick-code-block-content[data-max-lines] {\n    overflow-y: clip;\n  }\n\n  .brick-code-block-collapse[data-state=\"open\"] .brick-code-block-collapse-preview { display: none; }\n  .brick-code-block-collapse[data-state=\"closed\"] .brick-code-block-collapse-content { display: none; }\n  .brick-code-block-collapse-content { color: inherit; }\n  .brick-code-block-collapse-content-inner { padding: 0; }\n\n  .brick-code-block-collapse-trigger {\n    justify-content: center;\n    border-block-start: var(--brick-border-width) solid var(--brick-code-block-border-color);\n    border-radius: 0;\n    background: transparent;\n    color: var(--brick-color-text-secondary);\n  }\n\n  .brick-code-block-pre ::selection {\n    background: var(--brick-code-block-selection-background);\n    color: var(--brick-code-block-selection-foreground);\n  }\n\n  .brick-code-block-copy-status {\n    display: block;\n    padding-inline: var(--brick-space-4);\n    color: var(--brick-color-text-secondary);\n    font: var(--brick-typography-caption-font-weight) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-typography-caption-font-family);\n  }\n\n  .brick-code-block-copy-status:not(:empty) { padding-block: var(--brick-space-2); }\n\n  @media (forced-colors: active) {\n    .brick-code-block {\n      --brick-code-block-background: Canvas;\n      --brick-code-block-foreground: CanvasText;\n      --brick-code-block-border-color: CanvasText;\n      --brick-code-block-border-width: var(--brick-border-width);\n      --brick-code-block-selection-background: Highlight;\n      --brick-code-block-selection-foreground: HighlightText;\n      --brick-code-block-line-highlight-background: Mark;\n      --brick-code-block-line-focus-background: Canvas;\n      --brick-code-block-line-added-background: Canvas;\n      --brick-code-block-line-added-border: Highlight;\n      --brick-code-block-line-removed-background: Canvas;\n      --brick-code-block-line-removed-border: Highlight;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,+cAcA,4HAKA,uCACE,sFAKF,8BACE,qIAMF,iIAUA,mIC1CA,0tEAwDA,iEAIA,yJAKA,+JAKA,wMAKA,gGAIA,iGAMA,qKAKA,gHAKA,mFAKA,wDAKA,wCAIA,yGAIA,yCAIA,4FAOA,uHAKA,gDAIA,wDAIA,8EAIA,6SASA,0SASA,8SASA,0SASA,wzBAyBA,gqBAaA,0oBAaA,2qBAaA,2qBAaA,gqBAaA,4VAQA,kUAQA,4SAQA,wCACE,0JAKA,sMAKA,gGAKF,uCACE,sCAKF,8BACE,6EAMA,oDAIA,6ECpUF,ixCA8BA,kKAOA,oEACA,gKAIA,gKAKA,8BACE,oHEhDF,06CA8BA,oQAMA,4GAIA,8mBAYA,+mBAYA,iJASA,sGAKA,mJAIA,wxBAyBA,6HACA,wGACA,2KACA,wFAEA,qWAWA,4XAaA,gFACA,kGAEA,qIAMA,qJACA,uJACA,qMAEA,4IAIA,6IACA,gJACA,6DACA,yKAKA,uFACA,wFACA,mGACA,oGAEA,uCACE,6CACA,qDAGF,8BACE,wFACA,0HACA,4CACA,kED/KF,2KAQA,6OAUA,4EACA,8EACA,iEAEA,qGACA,8HACA,gIACA,wHACA,8HACA,iNAIA,gLAKA,8BACE,uIAEA,mEEvCF,y/DA2CA,iKAKA,+GAKA,wrBAYA,gPAUA,qSAWA,8NAOA,4GAOA,mDAIA,iNAQA,uLAQA,uZAaA,8HAMA,0FAMA,kRASA,qKASA,+NAQA,iDAGA,sGAGA,8FAGA,uKAIA,6KAKA,qHAKA,6FAIA,8FAKA,oFAKA,oFAMA,iDAKA,yFAOA,qHAKA,8FAIA,iDAGA,mDAIA,yNASA,6IAKA,6SAUA,6EAIA,8BACE,mlBNhRJ","sources":["home/runner/work/brick/brick/.brick-cache/production/code-block.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-spinner/action-spinner.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/button/button.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code/code.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/collapsible/collapsible.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/scroll-area/scroll-area.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code-block/code-block.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-spinner/action-spinner.css\";\n@import \"../../src/components/button/button.css\";\n@import \"../../src/components/code/code.css\";\n@import \"../../src/components/collapsible/collapsible.css\";\n@import \"../../src/components/scroll-area/scroll-area.css\";\n@import \"../../src/components/code-block/code-block.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  :where(.brick-button, .brick-icon-button)[data-loading]::after {\n    position: absolute;\n    inset-block-start: 50%;\n    inset-inline-start: 50%;\n    inline-size: var(--brick-action-spinner-size);\n    block-size: var(--brick-action-spinner-size);\n    border: 0.125rem solid transparent;\n    border-block-start-color: var(--brick-action-spinner-color);\n    border-inline-end-color: var(--brick-action-spinner-color);\n    border-radius: var(--brick-radius-full);\n    content: \"\";\n    animation: brick-action-spinner-spin 700ms linear infinite;\n  }\n\n  :where([dir=\"rtl\"])\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n    animation-name: brick-action-spinner-spin-rtl;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n      animation-duration: 1400ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n      border-block-start-color: ButtonText;\n      border-inline-end-color: ButtonText;\n    }\n  }\n\n  @keyframes brick-action-spinner-spin {\n    from {\n      transform: translate(-50%, -50%) rotate(0deg);\n    }\n\n    to {\n      transform: translate(-50%, -50%) rotate(360deg);\n    }\n  }\n\n  @keyframes brick-action-spinner-spin-rtl {\n    from {\n      transform: translate(50%, -50%) rotate(0deg);\n    }\n\n    to {\n      transform: translate(50%, -50%) rotate(360deg);\n    }\n  }\n}\n","@layer brick.components {\n  .brick-button {\n    --brick-button-background: var(--brick-button-tone-solid);\n    --brick-button-background-hover: var(--brick-button-tone-solid-hover);\n    --brick-button-background-pressed: var(--brick-button-tone-solid-pressed);\n    --brick-button-foreground: var(--brick-button-tone-on-solid);\n    --brick-button-border-color: var(--brick-button-background);\n    --brick-button-focus-ring: var(--brick-color-focus-ring);\n    --brick-button-min-block-size: var(--brick-control-min-block-size-md);\n    --brick-button-padding-block: 0.5rem;\n    --brick-button-padding-inline: 1rem;\n    --brick-button-gap: 0.5rem;\n    --brick-button-radius: var(--brick-radius-control);\n    --brick-button-font-family: var(--brick-typography-control-md-font-family);\n    --brick-button-font-size: var(--brick-typography-control-md-font-size);\n    --brick-button-font-weight: var(--brick-typography-control-md-font-weight);\n    --brick-button-line-height: var(--brick-typography-control-md-line-height);\n    --brick-button-letter-spacing: var(--brick-typography-control-md-letter-spacing);\n    --brick-button-icon-size: 1.125rem;\n    --brick-action-spinner-size: 1em;\n    --brick-action-spinner-color: var(\n      --brick-button-spinner-color,\n      var(--brick-button-foreground)\n    );\n\n    position: relative;\n    display: inline-flex;\n    box-sizing: border-box;\n    min-inline-size: 0;\n    max-inline-size: 100%;\n    min-block-size: var(--brick-button-min-block-size);\n    align-items: center;\n    justify-content: center;\n    gap: var(--brick-button-gap);\n    padding-block: var(--brick-button-padding-block);\n    padding-inline: var(--brick-button-padding-inline);\n    border: var(--brick-border-width) solid var(--brick-button-border-color);\n    border-radius: var(--brick-button-radius);\n    appearance: none;\n    background: var(--brick-button-background);\n    color: var(--brick-button-foreground);\n    font-family: var(--brick-button-font-family);\n    font-size: var(--brick-button-font-size);\n    font-weight: var(--brick-button-font-weight);\n    letter-spacing: var(--brick-button-letter-spacing);\n    line-height: var(--brick-button-line-height);\n    text-align: center;\n    text-decoration: none;\n    overflow-wrap: anywhere;\n    user-select: none;\n    vertical-align: middle;\n    transition:\n      background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n  }\n\n  .brick-button:not([data-disabled], [data-loading]) {\n    cursor: pointer;\n  }\n\n  .brick-button:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-button-focus-ring);\n    outline-offset: var(--brick-border-focus-offset);\n  }\n\n  .brick-button:not([data-disabled], [data-loading]):active {\n    background: var(--brick-button-background-pressed);\n    border-color: var(--brick-button-background-pressed);\n  }\n\n  .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):active,\n  .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):active {\n    border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):active {\n    border-color: transparent;\n  }\n\n  .brick-button[data-disabled] {\n    color: var(--brick-color-text-disabled);\n    cursor: not-allowed;\n    opacity: 1;\n  }\n\n  .brick-button[data-disabled]:is([data-variant=\"solid\"], [data-variant=\"soft\"]) {\n    border-color: var(--brick-color-border-subtle);\n    background: var(--brick-color-surface-subtle);\n  }\n\n  .brick-button[data-disabled][data-variant=\"outline\"] {\n    border-color: var(--brick-color-border-subtle);\n    background: transparent;\n  }\n\n  .brick-button[data-disabled][data-variant=\"ghost\"] {\n    border-color: transparent;\n    background: transparent;\n  }\n\n  .brick-button[data-loading] {\n    cursor: progress;\n    color: transparent;\n  }\n\n  .brick-button[data-loading] > * {\n    opacity: 0;\n  }\n\n  .brick-button[data-disabled][data-loading] {\n    --brick-button-spinner-color: var(--brick-color-text-disabled);\n  }\n\n  .brick-button__content {\n    min-inline-size: 0;\n  }\n\n  .brick-button__icon {\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    justify-content: center;\n  }\n\n  .brick-button__icon > :where(svg, img) {\n    inline-size: var(--brick-button-icon-size);\n    block-size: var(--brick-button-icon-size);\n  }\n\n  .brick-button[data-full-width] {\n    inline-size: 100%;\n  }\n\n  .brick-button[data-shape=\"sharp\"] {\n    --brick-button-radius: 0;\n  }\n\n  .brick-button[data-shape=\"pill\"] {\n    --brick-button-radius: var(--brick-radius-full);\n  }\n\n  .brick-button[data-size=\"xs\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-xs);\n    --brick-button-padding-block: 0.25rem;\n    --brick-button-padding-inline: 0.625rem;\n    --brick-button-gap: 0.375rem;\n    --brick-button-font-size: var(--brick-typography-control-xs-font-size);\n    --brick-button-icon-size: 0.875rem;\n  }\n\n  .brick-button[data-size=\"sm\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-sm);\n    --brick-button-padding-block: 0.375rem;\n    --brick-button-padding-inline: 0.75rem;\n    --brick-button-gap: 0.375rem;\n    --brick-button-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-button-icon-size: 1rem;\n  }\n\n  .brick-button[data-size=\"lg\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-lg);\n    --brick-button-padding-block: 0.625rem;\n    --brick-button-padding-inline: 1.25rem;\n    --brick-button-gap: 0.625rem;\n    --brick-button-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-button-icon-size: 1.25rem;\n  }\n\n  .brick-button[data-size=\"xl\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-xl);\n    --brick-button-padding-block: 0.75rem;\n    --brick-button-padding-inline: 1.5rem;\n    --brick-button-gap: 0.75rem;\n    --brick-button-font-size: var(--brick-typography-control-xl-font-size);\n    --brick-button-icon-size: 1.5rem;\n  }\n\n  .brick-button[data-tone=\"neutral\"] {\n    --brick-button-tone-solid: color-mix(\n      in srgb,\n      var(--brick-color-surface-subtle),\n      var(--brick-color-text-primary) 16%\n    );\n    --brick-button-tone-solid-hover: color-mix(\n      in srgb,\n      var(--brick-color-surface-subtle),\n      var(--brick-color-text-primary) 22%\n    );\n    --brick-button-tone-solid-pressed: color-mix(\n      in srgb,\n      var(--brick-color-surface-subtle),\n      var(--brick-color-text-primary) 28%\n    );\n    --brick-button-tone-on-solid: var(--brick-color-text-primary);\n    --brick-button-tone-soft: var(--brick-color-surface-subtle);\n    --brick-button-tone-soft-hover: var(--brick-color-surface-base);\n    --brick-button-tone-soft-pressed: var(--brick-color-border-subtle);\n    --brick-button-tone-on-soft: var(--brick-color-text-primary);\n    --brick-button-tone-border: var(--brick-color-border-strong);\n    --brick-button-tone-text: var(--brick-color-text-primary);\n  }\n\n  .brick-button[data-tone=\"accent\"] {\n    --brick-button-tone-solid: var(--brick-color-accent-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-accent-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-accent-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-accent-on-solid);\n    --brick-button-tone-soft: var(--brick-color-accent-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-accent-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-accent-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-accent-on-soft);\n    --brick-button-tone-border: var(--brick-color-accent-border);\n    --brick-button-tone-text: var(--brick-color-accent-text);\n  }\n\n  .brick-button[data-tone=\"info\"] {\n    --brick-button-tone-solid: var(--brick-color-info-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-info-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-info-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-info-on-solid);\n    --brick-button-tone-soft: var(--brick-color-info-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-info-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-info-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-info-on-soft);\n    --brick-button-tone-border: var(--brick-color-info-border);\n    --brick-button-tone-text: var(--brick-color-info-text);\n  }\n\n  .brick-button[data-tone=\"success\"] {\n    --brick-button-tone-solid: var(--brick-color-success-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-success-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-success-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-success-on-solid);\n    --brick-button-tone-soft: var(--brick-color-success-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-success-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-success-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-success-on-soft);\n    --brick-button-tone-border: var(--brick-color-success-border);\n    --brick-button-tone-text: var(--brick-color-success-text);\n  }\n\n  .brick-button[data-tone=\"warning\"] {\n    --brick-button-tone-solid: var(--brick-color-warning-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-warning-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-warning-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-warning-on-solid);\n    --brick-button-tone-soft: var(--brick-color-warning-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-warning-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-warning-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-warning-on-soft);\n    --brick-button-tone-border: var(--brick-color-warning-border);\n    --brick-button-tone-text: var(--brick-color-warning-text);\n  }\n\n  .brick-button[data-tone=\"danger\"] {\n    --brick-button-tone-solid: var(--brick-color-danger-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-danger-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-danger-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-danger-on-solid);\n    --brick-button-tone-soft: var(--brick-color-danger-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-danger-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-danger-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-danger-on-soft);\n    --brick-button-tone-border: var(--brick-color-danger-border);\n    --brick-button-tone-text: var(--brick-color-danger-text);\n  }\n\n  .brick-button[data-variant=\"soft\"] {\n    --brick-button-background: var(--brick-button-tone-soft);\n    --brick-button-background-hover: var(--brick-button-tone-soft-hover);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-pressed);\n    --brick-button-foreground: var(--brick-button-tone-on-soft);\n    --brick-button-border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"outline\"] {\n    --brick-button-background: transparent;\n    --brick-button-background-hover: var(--brick-button-tone-soft);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n    --brick-button-foreground: var(--brick-button-tone-text);\n    --brick-button-border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"ghost\"] {\n    --brick-button-background: transparent;\n    --brick-button-background-hover: var(--brick-button-tone-soft);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n    --brick-button-foreground: var(--brick-button-tone-text);\n    --brick-button-border-color: transparent;\n  }\n\n  @media (hover: hover) and (pointer: fine) {\n    .brick-button:not([data-disabled], [data-loading]):hover {\n      background: var(--brick-button-background-hover);\n      border-color: var(--brick-button-background-hover);\n    }\n\n    .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):hover,\n    .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):hover {\n      border-color: var(--brick-button-tone-border);\n    }\n\n    .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):hover {\n      border-color: transparent;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .brick-button {\n      transition-duration: 0ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .brick-button {\n      border-color: ButtonText;\n      background: ButtonFace;\n      color: ButtonText;\n    }\n\n    .brick-button:focus-visible {\n      outline-color: Highlight;\n    }\n\n    .brick-button[data-disabled] {\n      border-color: GrayText;\n      color: GrayText;\n      opacity: 1;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-code {\n    --brick-code-foreground: var(--brick-color-text-primary);\n    --brick-code-background: var(--brick-color-surface-subtle);\n    --brick-code-border-color: var(--brick-color-border-subtle);\n    --brick-code-border-width: var(--brick-border-width);\n    --brick-code-radius: var(--brick-radius-subtle);\n    --brick-code-padding-block: 0.0625em;\n    --brick-code-padding-inline: 0.3em;\n    --brick-code-font-family: var(--brick-typography-code-inline-font-family);\n    --brick-code-font-size: var(--brick-typography-code-inline-font-size);\n    --brick-code-font-weight: var(--brick-typography-code-inline-font-weight);\n    --brick-code-line-height: var(--brick-typography-code-inline-line-height);\n    --brick-code-letter-spacing: var(--brick-typography-code-inline-letter-spacing);\n\n    box-decoration-break: clone;\n    padding: var(--brick-code-padding-block) var(--brick-code-padding-inline);\n    border: var(--brick-code-border-width) solid var(--brick-code-border-color);\n    border-radius: var(--brick-code-radius);\n    background: var(--brick-code-background);\n    color: var(--brick-code-foreground);\n    font-family: var(--brick-code-font-family);\n    font-size: var(--brick-code-font-size);\n    font-weight: var(--brick-code-font-weight);\n    letter-spacing: var(--brick-code-letter-spacing);\n    line-height: var(--brick-code-line-height);\n    overflow-wrap: anywhere;\n    white-space: normal;\n    -webkit-box-decoration-break: clone;\n  }\n\n  .brick-code[data-variant=\"plain\"] {\n    --brick-code-background: transparent;\n    --brick-code-border-width: 0rem;\n    --brick-code-padding-block: 0em;\n    --brick-code-padding-inline: 0em;\n  }\n\n  .brick-code[data-tone=\"inherit\"] { --brick-code-foreground: currentColor; }\n  .brick-code[data-size=\"sm\"] {\n    --brick-code-font-size: var(--brick-typography-body-sm-font-size);\n    --brick-code-line-height: var(--brick-typography-body-sm-line-height);\n  }\n  .brick-code[data-size=\"md\"] {\n    --brick-code-font-size: var(--brick-typography-body-md-font-size);\n    --brick-code-line-height: var(--brick-typography-body-md-line-height);\n  }\n\n  @media (forced-colors: active) {\n    .brick-code {\n      --brick-code-foreground: CanvasText;\n      --brick-code-background: Canvas;\n      --brick-code-border-color: CanvasText;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-collapsible {\n    --brick-collapsible-background: transparent;\n    --brick-collapsible-border-color: transparent;\n    --brick-collapsible-trigger-background: transparent;\n    --brick-collapsible-trigger-hover-background: var(--brick-color-surface-subtle);\n    --brick-collapsible-trigger-open-background: var(--brick-color-surface-subtle);\n    --brick-collapsible-foreground: var(--brick-color-text-primary);\n    --brick-collapsible-content-foreground: var(--brick-color-text-secondary);\n    --brick-collapsible-focus-ring: var(--brick-color-focus-ring);\n    --brick-collapsible-radius: var(--brick-radius-control);\n    --brick-collapsible-trigger-height: 2.75rem;\n    --brick-collapsible-trigger-padding-inline: var(--brick-space-3);\n    --brick-collapsible-trigger-gap: var(--brick-space-2);\n    --brick-collapsible-content-padding-block: var(--brick-space-3);\n    --brick-collapsible-content-padding-inline: var(--brick-space-3);\n    --brick-collapsible-indicator-size: 1rem;\n    --brick-collapsible-font-family: var(--brick-typography-control-md-font-family);\n    --brick-collapsible-font-size: var(--brick-typography-control-md-font-size);\n    --brick-collapsible-font-weight: var(--brick-typography-control-md-font-weight);\n    --brick-collapsible-line-height: var(--brick-typography-control-md-line-height);\n\n    box-sizing: border-box;\n    inline-size: 100%;\n    min-inline-size: 0;\n    overflow: visible;\n    border: var(--brick-border-width) solid var(--brick-collapsible-border-color);\n    border-radius: var(--brick-collapsible-radius);\n    background: var(--brick-collapsible-background);\n  }\n\n  .brick-collapsible[data-variant=\"soft\"] {\n    --brick-collapsible-background: var(--brick-color-surface-subtle);\n    --brick-collapsible-trigger-hover-background: var(--brick-color-surface-raised);\n    --brick-collapsible-trigger-open-background: var(--brick-color-surface-raised);\n  }\n\n  .brick-collapsible[data-variant=\"outline\"] {\n    --brick-collapsible-border-color: var(--brick-color-border-default);\n  }\n\n  .brick-collapsible[data-size=\"sm\"] {\n    --brick-collapsible-trigger-height: 2.25rem;\n    --brick-collapsible-trigger-padding-inline: var(--brick-space-2);\n    --brick-collapsible-content-padding-block: var(--brick-space-2);\n    --brick-collapsible-content-padding-inline: var(--brick-space-2);\n    --brick-collapsible-indicator-size: 0.875rem;\n    --brick-collapsible-font-family: var(--brick-typography-control-sm-font-family);\n    --brick-collapsible-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-collapsible-font-weight: var(--brick-typography-control-sm-font-weight);\n    --brick-collapsible-line-height: var(--brick-typography-control-sm-line-height);\n  }\n\n  .brick-collapsible[data-size=\"lg\"] {\n    --brick-collapsible-trigger-height: 3.25rem;\n    --brick-collapsible-trigger-padding-inline: var(--brick-space-4);\n    --brick-collapsible-content-padding-block: var(--brick-space-4);\n    --brick-collapsible-content-padding-inline: var(--brick-space-4);\n    --brick-collapsible-indicator-size: 1.125rem;\n    --brick-collapsible-font-family: var(--brick-typography-control-lg-font-family);\n    --brick-collapsible-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-collapsible-font-weight: var(--brick-typography-control-lg-font-weight);\n    --brick-collapsible-line-height: var(--brick-typography-control-lg-line-height);\n  }\n\n  .brick-collapsible[data-orientation=\"horizontal\"] {\n    display: flex;\n    inline-size: max-content;\n    max-inline-size: 100%;\n    align-items: stretch;\n    overflow-x: auto;\n    overflow-y: clip;\n  }\n\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-trigger {\n    inline-size: auto;\n    flex: 0 0 auto;\n  }\n\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-trigger:focus-visible {\n    outline-offset: calc(-1 * var(--brick-border-focus-width));\n  }\n\n  .brick-collapsible-trigger {\n    display: flex;\n    box-sizing: border-box;\n    inline-size: 100%;\n    min-inline-size: 0;\n    min-block-size: var(--brick-collapsible-trigger-height);\n    align-items: center;\n    justify-content: flex-start;\n    gap: var(--brick-collapsible-trigger-gap);\n    padding-block: var(--brick-space-2);\n    padding-inline: var(--brick-collapsible-trigger-padding-inline);\n    border: 0;\n    border-radius: calc(var(--brick-collapsible-radius) - var(--brick-border-width));\n    background: var(--brick-collapsible-trigger-background);\n    color: var(--brick-collapsible-foreground);\n    font-family: var(--brick-collapsible-font-family);\n    font-size: var(--brick-collapsible-font-size);\n    font-weight: var(--brick-collapsible-font-weight);\n    line-height: var(--brick-collapsible-line-height);\n    text-align: start;\n    white-space: normal;\n    cursor: pointer;\n    touch-action: manipulation;\n  }\n\n  .brick-collapsible-trigger:hover:not(:disabled, [data-disabled]) { background: var(--brick-collapsible-trigger-hover-background); }\n  .brick-collapsible-trigger[data-state=\"open\"] { background: var(--brick-collapsible-trigger-open-background); }\n  .brick-collapsible-trigger:focus-visible { outline: var(--brick-border-focus-width) solid var(--brick-collapsible-focus-ring); outline-offset: var(--brick-border-focus-offset); }\n  .brick-collapsible-trigger:is(:disabled, [data-disabled]) { opacity: 0.55; cursor: not-allowed; }\n\n  .brick-collapsible-trigger[data-icon-only] {\n    inline-size: var(--brick-collapsible-trigger-height);\n    min-inline-size: var(--brick-collapsible-trigger-height);\n    block-size: var(--brick-collapsible-trigger-height);\n    min-block-size: var(--brick-collapsible-trigger-height);\n    flex: 0 0 var(--brick-collapsible-trigger-height);\n    justify-content: center;\n    padding: 0;\n    text-align: center;\n  }\n\n  .brick-collapsible-indicator {\n    display: inline-flex;\n    inline-size: var(--brick-collapsible-indicator-size);\n    block-size: var(--brick-collapsible-indicator-size);\n    flex: 0 0 auto;\n    align-items: center;\n    justify-content: center;\n    margin-inline-start: auto;\n    color: currentColor;\n    transform: rotate(0deg);\n    transform-origin: center;\n    transition: transform var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n  }\n  .brick-collapsible-indicator > svg { display: block; inline-size: 100%; block-size: 100%; }\n  .brick-collapsible-trigger[data-state=\"open\"] .brick-collapsible-indicator { transform: rotate(180deg); }\n\n  .brick-collapsible-content {\n    box-sizing: border-box;\n    min-inline-size: 0;\n    overflow: hidden;\n    color: var(--brick-collapsible-content-foreground);\n  }\n  .brick-collapsible-content[data-state=\"open\"] { animation: brick-collapsible-open var(--brick-motion-duration-fast) var(--brick-motion-easing-enter) both; }\n  .brick-collapsible-content[data-state=\"closed\"] { animation: brick-collapsible-close var(--brick-motion-duration-fast) var(--brick-motion-easing-exit) both; }\n  .brick-collapsible-content-inner { box-sizing: border-box; min-inline-size: 0; padding-block: var(--brick-collapsible-content-padding-block); padding-inline: var(--brick-collapsible-content-padding-inline); }\n\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content {\n    flex: 0 0 auto;\n    min-block-size: var(--brick-collapsible-trigger-height);\n  }\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content[data-state=\"open\"] { animation-name: brick-collapsible-open-horizontal; }\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content[data-state=\"closed\"] { animation-name: brick-collapsible-close-horizontal; }\n  .brick-collapsible-content[data-initial-open] { animation: none; }\n  .brick-collapsible[data-orientation=\"horizontal\"] .brick-collapsible-content-inner {\n    inline-size: var(--content-width);\n    min-block-size: var(--brick-collapsible-trigger-height);\n  }\n\n  @keyframes brick-collapsible-open { from { block-size: 0; } to { block-size: var(--content-height); } }\n  @keyframes brick-collapsible-close { from { block-size: var(--content-height); } to { block-size: 0; } }\n  @keyframes brick-collapsible-open-horizontal { from { inline-size: 0; } to { inline-size: var(--content-width); } }\n  @keyframes brick-collapsible-close-horizontal { from { inline-size: var(--content-width); } to { inline-size: 0; } }\n\n  @media (prefers-reduced-motion: reduce) {\n    .brick-collapsible-indicator { transition: none; }\n    .brick-collapsible-content { animation: none !important; }\n  }\n\n  @media (forced-colors: active) {\n    .brick-collapsible { --brick-collapsible-border-color: CanvasText; forced-color-adjust: auto; }\n    .brick-collapsible[data-variant=\"plain\"], .brick-collapsible[data-variant=\"soft\"] { --brick-collapsible-border-color: transparent; }\n    .brick-collapsible-trigger { color: ButtonText; }\n    .brick-collapsible-trigger:focus-visible { outline-color: Highlight; }\n  }\n}\n","@layer brick.components {\n  .brick-scroll-area {\n    --brick-scroll-area-scrollbar-thumb: var(--brick-color-border-strong);\n    --brick-scroll-area-scrollbar-track: transparent;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n  }\n\n  .brick-scroll-area-viewport {\n    box-sizing: border-box;\n    inline-size: 100%;\n    block-size: 100%;\n    min-inline-size: 0;\n    min-block-size: 0;\n    scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n    scrollbar-width: auto;\n  }\n\n  .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-x: hidden; overflow-y: auto; }\n  .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: auto; overflow-y: hidden; }\n  .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: auto; }\n\n  .brick-scroll-area[data-scrollbar-gutter=\"stable\"] > .brick-scroll-area-viewport { scrollbar-gutter: stable; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-y: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: transparent transparent; }\n  .brick-scroll-area[data-scrollbar-visibility=\"interaction\"]:is(:hover, :focus-within) > .brick-scroll-area-viewport {\n    scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n  }\n\n  .brick-scroll-area-viewport:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n    outline-offset: calc(-1 * var(--brick-border-focus-width));\n  }\n\n  @media (forced-colors: active) {\n    .brick-scroll-area-viewport,\n    .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: auto; }\n    .brick-scroll-area-viewport:focus-visible { outline-color: Highlight; }\n  }\n}\n","@layer brick.components {\n  .brick-code-block {\n    --brick-code-block-background: var(--brick-color-surface-subtle);\n    --brick-code-block-foreground: var(--brick-color-text-primary);\n    --brick-code-block-border-color: var(--brick-color-border-subtle);\n    --brick-code-block-border-width: 0rem;\n    --brick-code-block-radius: var(--brick-radius-surface);\n    --brick-code-block-header-padding: var(--brick-space-3) var(--brick-space-4);\n    --brick-code-block-content-padding: var(--brick-space-4);\n    --brick-code-block-content-padding-block: var(--brick-space-4);\n    --brick-code-block-content-padding-inline: var(--brick-space-4);\n    --brick-code-block-gap: var(--brick-space-2);\n    --brick-code-block-font-family: var(--brick-typography-code-block-md-font-family);\n    --brick-code-block-font-size: var(--brick-typography-code-block-md-font-size);\n    --brick-code-block-font-weight: var(--brick-typography-code-block-md-font-weight);\n    --brick-code-block-line-height: var(--brick-typography-code-block-md-line-height);\n    --brick-code-block-letter-spacing: var(--brick-typography-code-block-md-letter-spacing);\n    --brick-code-block-selection-background: var(--brick-color-accent-soft);\n    --brick-code-block-selection-foreground: var(--brick-color-accent-text);\n    --brick-code-block-line-number-foreground: var(\n      --brick-color-text-secondary\n    );\n    --brick-code-block-line-number-width: 3ch;\n    --brick-code-block-line-highlight-background: var(\n      --brick-color-accent-soft\n    );\n    --brick-code-block-line-focus-background: var(--brick-color-surface-raised);\n    --brick-code-block-line-added-background: var(--brick-color-success-soft);\n    --brick-code-block-line-added-border: var(--brick-color-success-border);\n    --brick-code-block-line-removed-background: var(--brick-color-danger-soft);\n    --brick-code-block-line-removed-border: var(--brick-color-danger-border);\n    --brick-code-block-max-block-size: none;\n\n    box-sizing: border-box;\n    min-inline-size: 0;\n    max-inline-size: 100%;\n    overflow: clip;\n    border: var(--brick-code-block-border-width) solid\n      var(--brick-code-block-border-color);\n    border-radius: var(--brick-code-block-radius);\n    background: var(--brick-code-block-background);\n    color: var(--brick-code-block-foreground);\n  }\n\n  .brick-code-block[data-variant=\"bordered\"] {\n    --brick-code-block-background: var(--brick-color-surface-base);\n    --brick-code-block-border-width: var(--brick-border-width);\n  }\n\n  .brick-code-block[data-variant=\"plain\"] {\n    --brick-code-block-background: transparent;\n    --brick-code-block-radius: 0rem;\n  }\n\n  .brick-code-block[data-size=\"sm\"] {\n    --brick-code-block-header-padding: var(--brick-space-2) var(--brick-space-3);\n    --brick-code-block-content-padding: var(--brick-space-3);\n    --brick-code-block-content-padding-block: var(--brick-space-3);\n    --brick-code-block-content-padding-inline: var(--brick-space-3);\n    --brick-code-block-font-family: var(--brick-typography-code-block-sm-font-family);\n    --brick-code-block-font-size: var(--brick-typography-code-block-sm-font-size);\n    --brick-code-block-font-weight: var(--brick-typography-code-block-sm-font-weight);\n    --brick-code-block-line-height: var(--brick-typography-code-block-sm-line-height);\n    --brick-code-block-letter-spacing: var(--brick-typography-code-block-sm-letter-spacing);\n  }\n\n  .brick-code-block-header {\n    display: flex;\n    align-items: center;\n    min-inline-size: 0;\n    gap: var(--brick-code-block-gap);\n    padding: var(--brick-code-block-header-padding);\n    border-block-end: var(--brick-border-width) solid\n      var(--brick-code-block-border-color);\n  }\n\n  .brick-code-block-title {\n    min-inline-size: 0;\n    overflow: hidden;\n    color: var(--brick-color-text-primary);\n    font: var(--brick-font-weight-medium)\n      var(--brick-typography-body-sm-font-size) /\n      var(--brick-typography-body-sm-line-height) var(--brick-font-family-body);\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .brick-code-block-language {\n    color: var(--brick-color-text-secondary);\n    font: var(--brick-font-weight-medium)\n      var(--brick-typography-caption-font-size) /\n      var(--brick-typography-caption-line-height) var(--brick-font-family-mono);\n  }\n\n  .brick-code-block-actions {\n    display: flex;\n    align-items: center;\n    gap: var(--brick-space-1);\n    margin-inline-start: auto;\n  }\n\n  .brick-code-block-scroll-area {\n    max-inline-size: 100%;\n  }\n\n  .brick-code-block-content {\n    box-sizing: border-box;\n    max-inline-size: 100%;\n    padding: var(--brick-code-block-content-padding);\n    font-size: var(--brick-code-block-font-size);\n    line-height: var(--brick-code-block-line-height);\n  }\n\n  .brick-code-block-content[data-max-lines] {\n    max-block-size: calc(\n      var(--brick-code-block-max-block-size) + 2 *\n        var(--brick-code-block-content-padding-block) - 0.5lh - 1px\n    );\n    overflow-y: auto;\n  }\n\n  .brick-code-block-pre {\n    min-inline-size: max-content;\n    margin: 0;\n    text-size-adjust: none;\n    font-family: var(--brick-code-block-font-family);\n    font-size: var(--brick-code-block-font-size);\n    font-weight: var(--brick-code-block-font-weight);\n    letter-spacing: var(--brick-code-block-letter-spacing);\n    line-height: var(--brick-code-block-line-height);\n    tab-size: 2;\n    white-space: pre;\n  }\n\n  .brick-code-block-content[data-wrap=\"wrap\"] .brick-code-block-pre {\n    min-inline-size: 0;\n    white-space: pre-wrap;\n    overflow-wrap: anywhere;\n  }\n\n  .brick-code-block-pre > .brick-code {\n    font: inherit;\n    letter-spacing: inherit;\n    white-space: inherit;\n  }\n\n  .brick-code-block-line {\n    display: block;\n    position: relative;\n    min-inline-size: 100%;\n    padding-inline: var(--brick-code-block-content-padding-inline);\n    margin-inline: calc(-1 * var(--brick-code-block-content-padding-inline));\n    border-inline-start: var(--brick-border-width) solid transparent;\n  }\n\n  .brick-code-block-line[data-line-number] {\n    display: grid;\n    grid-template-columns: var(--brick-code-block-line-number-width) minmax(\n        0,\n        1fr\n      );\n    column-gap: var(--brick-space-3);\n  }\n\n  .brick-code-block-line[data-line-number]::before {\n    content: attr(data-line-number);\n    color: var(--brick-code-block-line-number-foreground);\n    font-variant-numeric: tabular-nums;\n    text-align: end;\n    user-select: none;\n  }\n\n  .brick-code-block-line-content {\n    min-inline-size: 0;\n  }\n  .brick-code-block-line[data-highlighted] {\n    background: var(--brick-code-block-line-highlight-background);\n  }\n  .brick-code-block-line[data-focused] {\n    background: var(--brick-code-block-line-focus-background);\n  }\n  .brick-code-block-line[data-change=\"added\"] {\n    border-inline-start-color: var(--brick-code-block-line-added-border);\n    background: var(--brick-code-block-line-added-background);\n  }\n  .brick-code-block-line[data-change=\"removed\"] {\n    border-inline-start-color: var(--brick-code-block-line-removed-border);\n    background: var(--brick-code-block-line-removed-background);\n  }\n\n  .brick-code-block-content[data-wrap=\"wrap\"] .brick-code-block-line-content {\n    overflow-wrap: anywhere;\n    white-space: pre-wrap;\n  }\n\n  .brick-code-block-collapse-preview .brick-code-block-content[data-max-lines] {\n    overflow-y: clip;\n  }\n\n  .brick-code-block-collapse > .brick-code-block {\n    display: grid;\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  .brick-code-block-collapse > .brick-code-block > .brick-code-block-header {\n    grid-column: 1;\n    grid-row: 1;\n  }\n\n  .brick-code-block-collapse-preview,\n  .brick-code-block-collapse-content {\n    grid-column: 1;\n    grid-row: 2;\n  }\n\n  .brick-code-block-collapse-trigger {\n    grid-column: 1;\n    grid-row: 3;\n  }\n\n  .brick-code-block-collapse\n    > .brick-code-block\n    > .brick-code-block-copy-status {\n    grid-column: 1;\n    grid-row: 4;\n  }\n\n  .brick-code-block-collapse[data-state=\"open\"]\n    .brick-code-block-collapse-preview {\n    visibility: hidden;\n    pointer-events: none;\n  }\n  .brick-code-block-collapse[data-state=\"closed\"]\n    .brick-code-block-collapse-content {\n    display: none;\n  }\n  .brick-code-block-collapse-content {\n    color: inherit;\n  }\n  .brick-code-block-collapse-content-inner {\n    padding: 0;\n  }\n\n  .brick-code-block-collapse-trigger {\n    justify-content: center;\n    border-block-start: var(--brick-border-width) solid\n      var(--brick-code-block-border-color);\n    border-radius: 0;\n    background: transparent;\n    color: var(--brick-color-text-secondary);\n  }\n\n  .brick-code-block-pre ::selection {\n    background: var(--brick-code-block-selection-background);\n    color: var(--brick-code-block-selection-foreground);\n  }\n\n  .brick-code-block-copy-status {\n    display: block;\n    padding-inline: var(--brick-space-4);\n    color: var(--brick-color-text-secondary);\n    font: var(--brick-typography-caption-font-weight)\n      var(--brick-typography-caption-font-size) /\n      var(--brick-typography-caption-line-height)\n      var(--brick-typography-caption-font-family);\n  }\n\n  .brick-code-block-copy-status:not(:empty) {\n    padding-block: var(--brick-space-2);\n  }\n\n  @media (forced-colors: active) {\n    .brick-code-block {\n      --brick-code-block-background: Canvas;\n      --brick-code-block-foreground: CanvasText;\n      --brick-code-block-border-color: CanvasText;\n      --brick-code-block-border-width: var(--brick-border-width);\n      --brick-code-block-selection-background: Highlight;\n      --brick-code-block-selection-foreground: HighlightText;\n      --brick-code-block-line-highlight-background: Mark;\n      --brick-code-block-line-focus-background: Canvas;\n      --brick-code-block-line-added-background: Canvas;\n      --brick-code-block-line-added-border: Highlight;\n      --brick-code-block-line-removed-background: Canvas;\n      --brick-code-block-line-removed-border: Highlight;\n    }\n  }\n}\n"],"names":[]}

package/dist/styles/color-picker.css

@@ -1,2 +1,2 @@
-@layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-color-swatch{--brick-color-swatch-size:1.5rem;--brick-color-swatch-value:transparent;--brick-color-swatch-border-color:var(--brick-color-border-default);--brick-color-swatch-radius:var(--brick-radius-subtle);box-sizing:border-box;inline-size:var(--brick-color-swatch-size);block-size:var(--brick-color-swatch-size);border:var(--brick-border-width) solid var(--brick-color-swatch-border-color);border-radius:var(--brick-color-swatch-radius);background-color:var(--brick-color-surface-base);background-image:repeating-conic-gradient(var(--brick-color-surface-subtle) 0 25%, var(--brick-color-surface-raised) 0 50%);vertical-align:middle;background-position:0 0;background-size:.5rem .5rem;flex:none;display:inline-block;position:relative;overflow:hidden}.brick-color-swatch:after{background:var(--brick-color-swatch-value);content:"";position:absolute;inset:0}.brick-color-swatch[data-size=sm]{--brick-color-swatch-size:1rem}.brick-color-swatch[data-size=lg]{--brick-color-swatch-size:2rem}@media (forced-colors:active){.brick-color-swatch{forced-color-adjust:none;border-color:canvastext}}.brick-color-picker{--brick-color-picker-control-size:2.5rem;--brick-color-picker-gap:var(--brick-space-2);--brick-color-picker-background:transparent;--brick-color-picker-border-color:var(--brick-color-border-default);--brick-color-picker-focus-ring:var(--brick-color-focus-ring);--brick-color-picker-content-background:var(--brick-color-surface-overlay);--brick-color-picker-content-border-color:var(--brick-color-border-default);--brick-color-picker-content-radius:var(--brick-radius-overlay);--brick-color-picker-content-shadow:var(--brick-shadow-floating);gap:var(--brick-space-2);min-inline-size:0;color:var(--brick-color-text-primary);display:grid}.brick-color-picker[data-size=sm]{--brick-color-picker-control-size:2rem}.brick-color-picker[data-size=lg]{--brick-color-picker-control-size:3rem}.brick-color-picker[data-variant=soft]{--brick-color-picker-background:var(--brick-color-surface-subtle)}.brick-color-picker__label{inline-size:fit-content;color:var(--brick-color-text-primary);font-family:var(--brick-typography-label-md-font-family);font-size:var(--brick-typography-label-md-font-size);font-weight:var(--brick-typography-label-md-font-weight);letter-spacing:var(--brick-typography-label-md-letter-spacing);line-height:var(--brick-typography-label-md-line-height)}.brick-color-picker__control{align-items:stretch;gap:var(--brick-color-picker-gap);min-inline-size:0;display:flex}.brick-color-picker__input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__swatch-trigger{box-sizing:border-box;min-block-size:var(--brick-color-picker-control-size);border:var(--brick-border-width) solid var(--brick-color-picker-border-color);border-radius:var(--brick-radius-control);background:var(--brick-color-picker-background);color:var(--brick-color-text-primary);transition:border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard)}.brick-color-picker__input{inline-size:9rem;min-inline-size:0;padding-inline:var(--brick-space-3);font:inherit;font-variant-numeric:tabular-nums}.brick-color-picker__native-input{inline-size:var(--brick-color-picker-control-size);padding:var(--brick-space-1);cursor:pointer;flex:none}.brick-color-picker__trigger{min-inline-size:var(--brick-color-picker-control-size);justify-content:center;align-items:center;gap:var(--brick-space-2);padding-inline:var(--brick-space-2);cursor:pointer;font:inherit;display:inline-flex}.brick-color-picker__swatch-trigger{min-inline-size:var(--brick-color-picker-control-size);justify-content:flex-start;align-items:center;gap:var(--brick-space-2);padding:var(--brick-space-2);cursor:pointer;font:inherit;display:inline-flex}.brick-color-picker__input:hover,.brick-color-picker__native-input:hover,.brick-color-picker__trigger:hover,.brick-color-picker__swatch-trigger:hover{border-color:var(--brick-color-border-strong);background-color:var(--brick-color-surface-hover,var(--brick-color-surface-subtle))}.brick-color-picker__input:focus-visible,.brick-color-picker__native-input:focus-visible,.brick-color-picker__trigger:focus-visible,.brick-color-picker__swatch-trigger:focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-color-picker-focus-ring);outline-offset:var(--brick-border-focus-offset)}.brick-color-picker[data-invalid]{--brick-color-picker-border-color:var(--brick-color-danger-border);--brick-color-picker-focus-ring:var(--brick-color-danger-text)}.brick-color-picker[data-disabled] :where(.brick-color-picker__input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__swatch-trigger){cursor:not-allowed;color:var(--brick-color-text-disabled);opacity:.72}.brick-color-picker[data-readonly] :where(.brick-color-picker__input,.brick-color-picker__native-input,.brick-color-picker__swatch-trigger){cursor:not-allowed;background:var(--brick-color-surface-subtle)}.brick-color-picker__swatch-trigger[aria-pressed=true]{border-color:var(--brick-color-accent-border);box-shadow:inset 0 0 0 var(--brick-border-width) var(--brick-color-accent-border)}.brick-color-picker__content{z-index:calc(var(--brick-layer-overlay) - 1);box-sizing:border-box;inline-size:max-content;max-inline-size:min(22rem, calc(100dvi - 2rem - env(safe-area-inset-left) - env(safe-area-inset-right)));color:var(--brick-color-text-primary)}.brick-color-picker__content>[data-slot=popover-viewport]{gap:var(--brick-space-3);max-block-size:min(28rem,100dvb - 2rem);min-inline-size:min(18rem,100dvi - 2rem);padding:var(--brick-space-3);border:var(--brick-border-width) solid var(--brick-color-picker-content-border-color);border-radius:var(--brick-color-picker-content-radius);background:var(--brick-color-picker-content-background);box-shadow:var(--brick-color-picker-content-shadow);overscroll-behavior:contain;display:grid;overflow:auto}@supports not (height:100dvb){.brick-color-picker__content>[data-slot=popover-viewport]{max-block-size:min(28rem,100vh - 2rem)}}@media (prefers-reduced-motion:reduce){.brick-color-picker :where(.brick-color-picker__input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__swatch-trigger){transition-duration:1ms}}@media (forced-colors:active){.brick-color-picker{--brick-color-picker-background:Canvas;--brick-color-picker-border-color:CanvasText;--brick-color-picker-content-background:Canvas;--brick-color-picker-content-border-color:CanvasText;--brick-color-picker-content-shadow:none}.brick-color-picker__swatch-trigger[aria-pressed=true]{box-shadow:none;border-width:2px}}}@layer brick.utilities,brick.effects;
+@layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-color-swatch{--brick-color-swatch-size:1.5rem;--brick-color-swatch-value:transparent;--brick-color-swatch-border-color:var(--brick-color-border-default);--brick-color-swatch-radius:var(--brick-radius-subtle);box-sizing:border-box;inline-size:var(--brick-color-swatch-size);block-size:var(--brick-color-swatch-size);border:var(--brick-border-width) solid var(--brick-color-swatch-border-color);border-radius:var(--brick-color-swatch-radius);background-color:var(--brick-color-surface-base);background-image:repeating-conic-gradient(var(--brick-color-surface-subtle) 0 25%, var(--brick-color-surface-raised) 0 50%);vertical-align:middle;background-position:0 0;background-size:.5rem .5rem;flex:none;display:inline-block;position:relative;overflow:hidden}.brick-color-swatch:after{background:var(--brick-color-swatch-value);content:"";position:absolute;inset:0}.brick-color-swatch[data-size=sm]{--brick-color-swatch-size:1rem}.brick-color-swatch[data-size=lg]{--brick-color-swatch-size:2rem}.brick-color-swatch[data-shape=sharp]{--brick-color-swatch-radius:0}.brick-color-swatch[data-shape=circle]{--brick-color-swatch-radius:var(--brick-radius-full)}@media (forced-colors:active){.brick-color-swatch{forced-color-adjust:none;border-color:canvastext}}.brick-color-picker{--brick-color-picker-control-size:2.5rem;--brick-color-picker-gap:var(--brick-space-2);--brick-color-picker-input-width:9rem;--brick-color-picker-area-block-size:11rem;--brick-color-picker-slider-block-size:.75rem;--brick-color-picker-thumb-size:1.125rem;--brick-color-picker-swatch-size:2rem;--brick-color-picker-swatch-gap:var(--brick-space-2);--brick-color-picker-swatch-radius:var(--brick-radius-full);--brick-color-picker-checker-size:.5rem;--brick-color-picker-background:transparent;--brick-color-picker-border-color:var(--brick-color-border-default);--brick-color-picker-focus-ring:var(--brick-color-focus-ring);--brick-color-picker-content-background:var(--brick-color-surface-overlay);--brick-color-picker-content-border-color:var(--brick-color-border-default);--brick-color-picker-content-radius:var(--brick-radius-overlay);--brick-color-picker-content-shadow:var(--brick-shadow-floating);--brick-color-picker-indicator-color:white;--brick-color-picker-indicator-shadow:#000000b3;gap:var(--brick-space-2);min-inline-size:0;color:var(--brick-color-text-primary);display:grid}.brick-color-picker[data-size=sm]{--brick-color-picker-control-size:2rem;--brick-color-picker-area-block-size:8rem;--brick-color-picker-thumb-size:1rem;--brick-color-picker-swatch-size:1.75rem}.brick-color-picker[data-size=lg]{--brick-color-picker-control-size:3rem;--brick-color-picker-area-block-size:14rem;--brick-color-picker-thumb-size:1.25rem;--brick-color-picker-swatch-size:2.5rem}.brick-color-picker[data-variant=soft]{--brick-color-picker-background:var(--brick-color-surface-subtle)}.brick-color-picker__label,.brick-color-picker__channel-slider-label{inline-size:fit-content;color:var(--brick-color-text-primary);font-family:var(--brick-typography-label-md-font-family);font-size:var(--brick-typography-label-md-font-size);font-weight:var(--brick-typography-label-md-font-weight);letter-spacing:var(--brick-typography-label-md-letter-spacing);line-height:var(--brick-typography-label-md-line-height)}.brick-color-picker__control{align-items:stretch;gap:var(--brick-color-picker-gap);min-inline-size:0;display:flex}:where(.brick-color-picker__input,.brick-color-picker__channel-input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__eye-dropper-trigger,.brick-color-picker__format-trigger,.brick-color-picker__format-select){box-sizing:border-box;min-block-size:var(--brick-color-picker-control-size);border:var(--brick-border-width) solid var(--brick-color-picker-border-color);border-radius:var(--brick-radius-control);background:var(--brick-color-picker-background);color:var(--brick-color-text-primary);font:inherit;transition:border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard), background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard)}.brick-color-picker__input{inline-size:var(--brick-color-picker-input-width);flex:1 1 var(--brick-color-picker-input-width);min-inline-size:0;padding-inline:var(--brick-space-3);font-variant-numeric:tabular-nums}.brick-color-picker__channel-input{inline-size:4.5rem;min-inline-size:0;padding-inline:var(--brick-space-2);text-align:center;font-variant-numeric:tabular-nums}.brick-color-picker__native-input{inline-size:var(--brick-color-picker-control-size);padding:var(--brick-space-1);cursor:pointer;flex:none}:where(.brick-color-picker__trigger,.brick-color-picker__eye-dropper-trigger,.brick-color-picker__format-trigger){min-inline-size:var(--brick-color-picker-control-size);justify-content:center;align-items:center;gap:var(--brick-space-2);padding-inline:var(--brick-space-2);cursor:pointer;flex:none;display:inline-flex}.brick-color-picker__format-select{padding-inline:var(--brick-space-2);cursor:pointer}:where(.brick-color-picker__input,.brick-color-picker__channel-input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__eye-dropper-trigger,.brick-color-picker__format-trigger,.brick-color-picker__format-select):hover{border-color:var(--brick-color-border-strong);background-color:var(--brick-color-surface-hover,var(--brick-color-surface-subtle))}:where(.brick-color-picker__input,.brick-color-picker__channel-input,.brick-color-picker__native-input,.brick-color-picker__trigger,.brick-color-picker__eye-dropper-trigger,.brick-color-picker__format-trigger,.brick-color-picker__format-select,.brick-color-picker__swatch-trigger,.brick-color-picker__area,.brick-color-picker__channel-slider):focus-visible{outline:var(--brick-border-focus-width) solid var(--brick-color-picker-focus-ring);outline-offset:var(--brick-border-focus-offset)}.brick-color-picker__value-text,.brick-color-picker__channel-slider-value{color:var(--brick-color-text-secondary);font-variant-numeric:tabular-nums}.brick-color-picker__value-swatch,.brick-color-picker__swatch{box-sizing:border-box;inline-size:var(--brick-color-picker-swatch-size);block-size:var(--brick-color-picker-swatch-size);border:var(--brick-border-width) solid var(--brick-color-border-default);border-radius:var(--brick-color-picker-swatch-radius);background-color:var(--brick-color-surface-base);background-image:repeating-conic-gradient(var(--brick-color-surface-subtle) 0 25%, var(--brick-color-surface-raised) 0 50%);background-size:var(--brick-color-picker-checker-size) var(--brick-color-picker-checker-size);place-items:center;display:inline-grid;position:relative;overflow:hidden}.brick-color-picker__area{box-sizing:border-box;inline-size:100%;block-size:var(--brick-color-picker-area-block-size);border:var(--brick-border-width) solid var(--brick-color-border-default);border-radius:var(--brick-radius-surface);touch-action:none;position:relative;overflow:hidden}.brick-color-picker__area-background{inset:0;position:absolute!important}.brick-color-picker__area-thumb,.brick-color-picker__channel-slider-thumb{box-sizing:border-box;inline-size:var(--brick-color-picker-thumb-size);block-size:var(--brick-color-picker-thumb-size);border-radius:var(--brick-radius-full);box-shadow:0 0 0 1px #0006, var(--brick-shadow-floating);background:currentColor;border:2px solid #fff}.brick-color-picker__channel-slider{align-items:center;gap:var(--brick-space-1) var(--brick-space-2);touch-action:none;grid-template-columns:1fr auto;min-inline-size:0;display:grid;position:relative}.brick-color-picker__channel-slider-track{block-size:var(--brick-color-picker-slider-block-size);border:var(--brick-border-width) solid var(--brick-color-border-default);border-radius:var(--brick-radius-full);grid-column:1/-1;position:relative;overflow:hidden}.brick-color-picker__transparency-grid{border-radius:inherit;position:absolute;inset:0}.brick-color-picker__positioner{z-index:calc(var(--brick-layer-overlay) - 1)}.brick-color-picker__content{box-sizing:border-box;inline-size:min(21rem, calc(100dvi - 2rem - env(safe-area-inset-left) - env(safe-area-inset-right)));gap:var(--brick-space-3);max-block-size:min(32rem,100dvb - 2rem);padding:var(--brick-space-3);border:var(--brick-border-width) solid var(--brick-color-picker-content-border-color);border-radius:var(--brick-color-picker-content-radius);background:var(--brick-color-picker-content-background);box-shadow:var(--brick-color-picker-content-shadow);color:var(--brick-color-text-primary);overscroll-behavior:contain;display:grid;overflow:auto}.brick-color-picker>.brick-color-picker__content{inline-size:min(21rem,100%)}.brick-color-picker__view:not([hidden]){gap:var(--brick-space-2);display:grid}.brick-color-picker__swatch-group{gap:var(--brick-color-picker-swatch-gap);flex-wrap:wrap;display:flex}.brick-color-picker__swatch-trigger{box-sizing:border-box;min-inline-size:var(--brick-color-picker-control-size);min-block-size:var(--brick-color-picker-control-size);padding:var(--brick-space-1);border:var(--brick-border-width) solid transparent;border-radius:var(--brick-radius-full);color:var(--brick-color-text-primary);cursor:pointer;background:0 0;place-items:center;display:inline-grid;position:relative}.brick-color-picker__swatch-trigger:hover{border-color:var(--brick-color-border-strong);background:var(--brick-color-surface-hover,var(--brick-color-surface-subtle))}.brick-color-picker__swatch-trigger[data-state=checked],.brick-color-picker__swatch-trigger[aria-pressed=true]{border-color:var(--brick-color-accent-border)}.brick-color-picker__swatch-indicator{z-index:1;block-size:1rem;inline-size:1rem;color:var(--brick-color-picker-indicator-color);filter:drop-shadow(0 1px 1px var(--brick-color-picker-indicator-shadow));place-items:center;display:inline-grid;position:relative}.brick-color-picker__swatch-indicator:before{font-size:var(--brick-typography-control-sm-font-size);font-weight:var(--brick-typography-control-sm-font-weight);line-height:var(--brick-typography-control-sm-line-height);content:"✓"}.brick-color-picker[data-invalid]{--brick-color-picker-border-color:var(--brick-color-danger-border);--brick-color-picker-focus-ring:var(--brick-color-danger-text)}.brick-color-picker[data-disabled] :where(input,button,select){cursor:not-allowed;color:var(--brick-color-text-disabled);opacity:.72}.brick-color-picker[data-readonly] :where(input,select,.brick-color-picker__swatch-trigger){cursor:not-allowed;background:var(--brick-color-surface-subtle)}@supports not (height:100dvb){.brick-color-picker__content{max-block-size:min(32rem,100vh - 2rem)}}@media (width<=30rem){.brick-color-picker__control{flex-wrap:wrap}.brick-color-picker__input{flex-basis:100%;inline-size:100%}.brick-color-picker__content{inline-size:min(21rem,100dvi - 1rem)}.brick-color-picker__swatch-trigger{min-block-size:2.75rem;min-inline-size:2.75rem}}@media (prefers-reduced-motion:reduce){.brick-color-picker :where(input,button,select){transition-duration:1ms}}@media (forced-colors:active){.brick-color-picker{--brick-color-picker-background:Canvas;--brick-color-picker-border-color:CanvasText;--brick-color-picker-content-background:Canvas;--brick-color-picker-content-border-color:CanvasText;--brick-color-picker-content-shadow:none;--brick-color-picker-indicator-color:CanvasText;--brick-color-picker-indicator-shadow:transparent}:where(.brick-color-picker__area,.brick-color-picker__channel-slider-track,.brick-color-picker__value-swatch,.brick-color-picker__swatch){forced-color-adjust:none;border-color:canvastext}.brick-color-picker__swatch-trigger[data-state=checked],.brick-color-picker__swatch-trigger[aria-pressed=true]{border-width:2px}}}@layer brick.utilities,brick.effects;
 /*# sourceMappingURL=color-picker.css.map */

package/dist/styles/color-picker.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,uvBAyBA,0GAOA,iEACA,iEAEA,8BACE,sECpCF,+oBAiBA,yEACA,yEACA,yGAEA,wXAUA,kHAOA,gqBAgBA,iJAQA,2IAOA,2OAWA,+OAWA,wRAQA,yTAQA,oKAKA,+OAMA,4MAKA,uLAKA,uQAQA,ifAcA,8BACE,kGAGF,uCACE,mLAGF,8BACE,qPAQA,0FFxKJ","sources":["home/runner/work/brick/brick/.brick-cache/production/color-picker.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-swatch/color-swatch.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-picker/color-picker.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/color-swatch/color-swatch.css\";\n@import \"../../src/components/color-picker/color-picker.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  .brick-color-swatch {\n    --brick-color-swatch-size: 1.5rem;\n    --brick-color-swatch-value: transparent;\n    --brick-color-swatch-border-color: var(--brick-color-border-default);\n    --brick-color-swatch-radius: var(--brick-radius-subtle);\n\n    position: relative;\n    display: inline-block;\n    box-sizing: border-box;\n    inline-size: var(--brick-color-swatch-size);\n    block-size: var(--brick-color-swatch-size);\n    flex: none;\n    overflow: hidden;\n    border: var(--brick-border-width) solid var(--brick-color-swatch-border-color);\n    border-radius: var(--brick-color-swatch-radius);\n    background-color: var(--brick-color-surface-base);\n    background-image: repeating-conic-gradient(\n      var(--brick-color-surface-subtle) 0 25%,\n      var(--brick-color-surface-raised) 0 50%\n    );\n    background-position: 0 0;\n    background-size: 0.5rem 0.5rem;\n    vertical-align: middle;\n  }\n\n  .brick-color-swatch::after {\n    position: absolute;\n    inset: 0;\n    background: var(--brick-color-swatch-value);\n    content: \"\";\n  }\n\n  .brick-color-swatch[data-size=\"sm\"] { --brick-color-swatch-size: 1rem; }\n  .brick-color-swatch[data-size=\"lg\"] { --brick-color-swatch-size: 2rem; }\n\n  @media (forced-colors: active) {\n    .brick-color-swatch {\n      border-color: CanvasText;\n      forced-color-adjust: none;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-color-picker {\n    --brick-color-picker-control-size: 2.5rem;\n    --brick-color-picker-gap: var(--brick-space-2);\n    --brick-color-picker-background: transparent;\n    --brick-color-picker-border-color: var(--brick-color-border-default);\n    --brick-color-picker-focus-ring: var(--brick-color-focus-ring);\n    --brick-color-picker-content-background: var(--brick-color-surface-overlay);\n    --brick-color-picker-content-border-color: var(--brick-color-border-default);\n    --brick-color-picker-content-radius: var(--brick-radius-overlay);\n    --brick-color-picker-content-shadow: var(--brick-shadow-floating);\n\n    display: grid;\n    min-inline-size: 0;\n    gap: var(--brick-space-2);\n    color: var(--brick-color-text-primary);\n  }\n\n  .brick-color-picker[data-size=\"sm\"] { --brick-color-picker-control-size: 2rem; }\n  .brick-color-picker[data-size=\"lg\"] { --brick-color-picker-control-size: 3rem; }\n  .brick-color-picker[data-variant=\"soft\"] { --brick-color-picker-background: var(--brick-color-surface-subtle); }\n\n  .brick-color-picker__label {\n    inline-size: fit-content;\n    color: var(--brick-color-text-primary);\n    font-family: var(--brick-typography-label-md-font-family);\n    font-size: var(--brick-typography-label-md-font-size);\n    font-weight: var(--brick-typography-label-md-font-weight);\n    letter-spacing: var(--brick-typography-label-md-letter-spacing);\n    line-height: var(--brick-typography-label-md-line-height);\n  }\n\n  .brick-color-picker__control {\n    display: flex;\n    min-inline-size: 0;\n    align-items: stretch;\n    gap: var(--brick-color-picker-gap);\n  }\n\n  .brick-color-picker__input,\n  .brick-color-picker__native-input,\n  .brick-color-picker__trigger,\n  .brick-color-picker__swatch-trigger {\n    box-sizing: border-box;\n    min-block-size: var(--brick-color-picker-control-size);\n    border: var(--brick-border-width) solid var(--brick-color-picker-border-color);\n    border-radius: var(--brick-radius-control);\n    background: var(--brick-color-picker-background);\n    color: var(--brick-color-text-primary);\n    transition:\n      border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n  }\n\n  .brick-color-picker__input {\n    inline-size: 9rem;\n    min-inline-size: 0;\n    padding-inline: var(--brick-space-3);\n    font: inherit;\n    font-variant-numeric: tabular-nums;\n  }\n\n  .brick-color-picker__native-input {\n    inline-size: var(--brick-color-picker-control-size);\n    flex: none;\n    padding: var(--brick-space-1);\n    cursor: pointer;\n  }\n\n  .brick-color-picker__trigger {\n    display: inline-flex;\n    min-inline-size: var(--brick-color-picker-control-size);\n    align-items: center;\n    justify-content: center;\n    gap: var(--brick-space-2);\n    padding-inline: var(--brick-space-2);\n    cursor: pointer;\n    font: inherit;\n  }\n\n  .brick-color-picker__swatch-trigger {\n    display: inline-flex;\n    min-inline-size: var(--brick-color-picker-control-size);\n    align-items: center;\n    justify-content: flex-start;\n    gap: var(--brick-space-2);\n    padding: var(--brick-space-2);\n    cursor: pointer;\n    font: inherit;\n  }\n\n  .brick-color-picker__input:hover,\n  .brick-color-picker__native-input:hover,\n  .brick-color-picker__trigger:hover,\n  .brick-color-picker__swatch-trigger:hover {\n    border-color: var(--brick-color-border-strong);\n    background-color: var(--brick-color-surface-hover, var(--brick-color-surface-subtle));\n  }\n\n  .brick-color-picker__input:focus-visible,\n  .brick-color-picker__native-input:focus-visible,\n  .brick-color-picker__trigger:focus-visible,\n  .brick-color-picker__swatch-trigger:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-color-picker-focus-ring);\n    outline-offset: var(--brick-border-focus-offset);\n  }\n\n  .brick-color-picker[data-invalid] {\n    --brick-color-picker-border-color: var(--brick-color-danger-border);\n    --brick-color-picker-focus-ring: var(--brick-color-danger-text);\n  }\n\n  .brick-color-picker[data-disabled] :where(.brick-color-picker__input, .brick-color-picker__native-input, .brick-color-picker__trigger, .brick-color-picker__swatch-trigger) {\n    cursor: not-allowed;\n    color: var(--brick-color-text-disabled);\n    opacity: 0.72;\n  }\n\n  .brick-color-picker[data-readonly] :where(.brick-color-picker__input, .brick-color-picker__native-input, .brick-color-picker__swatch-trigger) {\n    cursor: not-allowed;\n    background: var(--brick-color-surface-subtle);\n  }\n\n  .brick-color-picker__swatch-trigger[aria-pressed=\"true\"] {\n    border-color: var(--brick-color-accent-border);\n    box-shadow: inset 0 0 0 var(--brick-border-width) var(--brick-color-accent-border);\n  }\n\n  .brick-color-picker__content {\n    z-index: calc(var(--brick-layer-overlay) - 1);\n    box-sizing: border-box;\n    inline-size: max-content;\n    max-inline-size: min(22rem, calc(100dvi - 2rem - env(safe-area-inset-left) - env(safe-area-inset-right)));\n    color: var(--brick-color-text-primary);\n  }\n\n  .brick-color-picker__content > [data-slot=\"popover-viewport\"] {\n    display: grid;\n    min-inline-size: min(18rem, calc(100dvi - 2rem));\n    max-block-size: min(28rem, calc(100dvb - 2rem));\n    gap: var(--brick-space-3);\n    padding: var(--brick-space-3);\n    overflow: auto;\n    border: var(--brick-border-width) solid var(--brick-color-picker-content-border-color);\n    border-radius: var(--brick-color-picker-content-radius);\n    background: var(--brick-color-picker-content-background);\n    box-shadow: var(--brick-color-picker-content-shadow);\n    overscroll-behavior: contain;\n  }\n\n  @supports not (height: 100dvb) {\n    .brick-color-picker__content > [data-slot=\"popover-viewport\"] { max-block-size: min(28rem, calc(100vh - 2rem)); }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .brick-color-picker :where(.brick-color-picker__input, .brick-color-picker__native-input, .brick-color-picker__trigger, .brick-color-picker__swatch-trigger) { transition-duration: 1ms; }\n  }\n\n  @media (forced-colors: active) {\n    .brick-color-picker {\n      --brick-color-picker-background: Canvas;\n      --brick-color-picker-border-color: CanvasText;\n      --brick-color-picker-content-background: Canvas;\n      --brick-color-picker-content-border-color: CanvasText;\n      --brick-color-picker-content-shadow: none;\n    }\n\n    .brick-color-picker__swatch-trigger[aria-pressed=\"true\"] { border-width: 2px; box-shadow: none; }\n  }\n}\n"],"names":[]}
+{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,uvBAyBA,0GAOA,iEACA,iEACA,oEACA,4FAEA,8BACE,sECtCF,ilCA2BA,iMAOA,oMAOA,yGAIA,kaAWA,kHAOA,oyBAsBA,oNAQA,gKAQA,2IAOA,6TAeA,sFAKA,6XAaA,weAgBA,oJAMA,0oBAmBA,6RAWA,yEAOA,+UAWA,uMAUA,oQASA,uFAMA,6EAIA,4kBAkBA,6EAIA,8EAKA,uGAMA,2ZAeA,sKAKA,6JAKA,mQAWA,wOAOA,oKAKA,qIAMA,4JAKA,8BACE,qEAGF,sBACE,4CACA,4DACA,kEACA,oFAGF,uCACE,yEAGF,8BACE,uVAUA,2LAOA,kIF9WJ","sources":["home/runner/work/brick/brick/.brick-cache/production/color-picker.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-swatch/color-swatch.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-picker/color-picker.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/color-swatch/color-swatch.css\";\n@import \"../../src/components/color-picker/color-picker.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  .brick-color-swatch {\n    --brick-color-swatch-size: 1.5rem;\n    --brick-color-swatch-value: transparent;\n    --brick-color-swatch-border-color: var(--brick-color-border-default);\n    --brick-color-swatch-radius: var(--brick-radius-subtle);\n\n    position: relative;\n    display: inline-block;\n    box-sizing: border-box;\n    inline-size: var(--brick-color-swatch-size);\n    block-size: var(--brick-color-swatch-size);\n    flex: none;\n    overflow: hidden;\n    border: var(--brick-border-width) solid var(--brick-color-swatch-border-color);\n    border-radius: var(--brick-color-swatch-radius);\n    background-color: var(--brick-color-surface-base);\n    background-image: repeating-conic-gradient(\n      var(--brick-color-surface-subtle) 0 25%,\n      var(--brick-color-surface-raised) 0 50%\n    );\n    background-position: 0 0;\n    background-size: 0.5rem 0.5rem;\n    vertical-align: middle;\n  }\n\n  .brick-color-swatch::after {\n    position: absolute;\n    inset: 0;\n    background: var(--brick-color-swatch-value);\n    content: \"\";\n  }\n\n  .brick-color-swatch[data-size=\"sm\"] { --brick-color-swatch-size: 1rem; }\n  .brick-color-swatch[data-size=\"lg\"] { --brick-color-swatch-size: 2rem; }\n  .brick-color-swatch[data-shape=\"sharp\"] { --brick-color-swatch-radius: 0; }\n  .brick-color-swatch[data-shape=\"circle\"] { --brick-color-swatch-radius: var(--brick-radius-full); }\n\n  @media (forced-colors: active) {\n    .brick-color-swatch {\n      border-color: CanvasText;\n      forced-color-adjust: none;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-color-picker {\n    --brick-color-picker-control-size: 2.5rem;\n    --brick-color-picker-gap: var(--brick-space-2);\n    --brick-color-picker-input-width: 9rem;\n    --brick-color-picker-area-block-size: 11rem;\n    --brick-color-picker-slider-block-size: 0.75rem;\n    --brick-color-picker-thumb-size: 1.125rem;\n    --brick-color-picker-swatch-size: 2rem;\n    --brick-color-picker-swatch-gap: var(--brick-space-2);\n    --brick-color-picker-swatch-radius: var(--brick-radius-full);\n    --brick-color-picker-checker-size: 0.5rem;\n    --brick-color-picker-background: transparent;\n    --brick-color-picker-border-color: var(--brick-color-border-default);\n    --brick-color-picker-focus-ring: var(--brick-color-focus-ring);\n    --brick-color-picker-content-background: var(--brick-color-surface-overlay);\n    --brick-color-picker-content-border-color: var(--brick-color-border-default);\n    --brick-color-picker-content-radius: var(--brick-radius-overlay);\n    --brick-color-picker-content-shadow: var(--brick-shadow-floating);\n    --brick-color-picker-indicator-color: white;\n    --brick-color-picker-indicator-shadow: rgb(0 0 0 / 70%);\n\n    display: grid;\n    min-inline-size: 0;\n    gap: var(--brick-space-2);\n    color: var(--brick-color-text-primary);\n  }\n\n  .brick-color-picker[data-size=\"sm\"] {\n    --brick-color-picker-control-size: 2rem;\n    --brick-color-picker-area-block-size: 8rem;\n    --brick-color-picker-thumb-size: 1rem;\n    --brick-color-picker-swatch-size: 1.75rem;\n  }\n\n  .brick-color-picker[data-size=\"lg\"] {\n    --brick-color-picker-control-size: 3rem;\n    --brick-color-picker-area-block-size: 14rem;\n    --brick-color-picker-thumb-size: 1.25rem;\n    --brick-color-picker-swatch-size: 2.5rem;\n  }\n\n  .brick-color-picker[data-variant=\"soft\"] {\n    --brick-color-picker-background: var(--brick-color-surface-subtle);\n  }\n\n  .brick-color-picker__label,\n  .brick-color-picker__channel-slider-label {\n    inline-size: fit-content;\n    color: var(--brick-color-text-primary);\n    font-family: var(--brick-typography-label-md-font-family);\n    font-size: var(--brick-typography-label-md-font-size);\n    font-weight: var(--brick-typography-label-md-font-weight);\n    letter-spacing: var(--brick-typography-label-md-letter-spacing);\n    line-height: var(--brick-typography-label-md-line-height);\n  }\n\n  .brick-color-picker__control {\n    display: flex;\n    min-inline-size: 0;\n    align-items: stretch;\n    gap: var(--brick-color-picker-gap);\n  }\n\n  :where(\n    .brick-color-picker__input,\n    .brick-color-picker__channel-input,\n    .brick-color-picker__native-input,\n    .brick-color-picker__trigger,\n    .brick-color-picker__eye-dropper-trigger,\n    .brick-color-picker__format-trigger,\n    .brick-color-picker__format-select\n  ) {\n    box-sizing: border-box;\n    min-block-size: var(--brick-color-picker-control-size);\n    border: var(--brick-border-width) solid var(--brick-color-picker-border-color);\n    border-radius: var(--brick-radius-control);\n    background: var(--brick-color-picker-background);\n    color: var(--brick-color-text-primary);\n    font: inherit;\n    transition:\n      border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      box-shadow var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n  }\n\n  .brick-color-picker__input {\n    inline-size: var(--brick-color-picker-input-width);\n    min-inline-size: 0;\n    flex: 1 1 var(--brick-color-picker-input-width);\n    padding-inline: var(--brick-space-3);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .brick-color-picker__channel-input {\n    inline-size: 4.5rem;\n    min-inline-size: 0;\n    padding-inline: var(--brick-space-2);\n    text-align: center;\n    font-variant-numeric: tabular-nums;\n  }\n\n  .brick-color-picker__native-input {\n    inline-size: var(--brick-color-picker-control-size);\n    flex: none;\n    padding: var(--brick-space-1);\n    cursor: pointer;\n  }\n\n  :where(\n    .brick-color-picker__trigger,\n    .brick-color-picker__eye-dropper-trigger,\n    .brick-color-picker__format-trigger\n  ) {\n    display: inline-flex;\n    min-inline-size: var(--brick-color-picker-control-size);\n    flex: none;\n    align-items: center;\n    justify-content: center;\n    gap: var(--brick-space-2);\n    padding-inline: var(--brick-space-2);\n    cursor: pointer;\n  }\n\n  .brick-color-picker__format-select {\n    padding-inline: var(--brick-space-2);\n    cursor: pointer;\n  }\n\n  :where(\n    .brick-color-picker__input,\n    .brick-color-picker__channel-input,\n    .brick-color-picker__native-input,\n    .brick-color-picker__trigger,\n    .brick-color-picker__eye-dropper-trigger,\n    .brick-color-picker__format-trigger,\n    .brick-color-picker__format-select\n  ):hover {\n    border-color: var(--brick-color-border-strong);\n    background-color: var(--brick-color-surface-hover, var(--brick-color-surface-subtle));\n  }\n\n  :where(\n    .brick-color-picker__input,\n    .brick-color-picker__channel-input,\n    .brick-color-picker__native-input,\n    .brick-color-picker__trigger,\n    .brick-color-picker__eye-dropper-trigger,\n    .brick-color-picker__format-trigger,\n    .brick-color-picker__format-select,\n    .brick-color-picker__swatch-trigger,\n    .brick-color-picker__area,\n    .brick-color-picker__channel-slider\n  ):focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-color-picker-focus-ring);\n    outline-offset: var(--brick-border-focus-offset);\n  }\n\n  .brick-color-picker__value-text,\n  .brick-color-picker__channel-slider-value {\n    color: var(--brick-color-text-secondary);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .brick-color-picker__value-swatch,\n  .brick-color-picker__swatch {\n    position: relative;\n    display: inline-grid;\n    box-sizing: border-box;\n    inline-size: var(--brick-color-picker-swatch-size);\n    block-size: var(--brick-color-picker-swatch-size);\n    place-items: center;\n    overflow: hidden;\n    border: var(--brick-border-width) solid var(--brick-color-border-default);\n    border-radius: var(--brick-color-picker-swatch-radius);\n    background-color: var(--brick-color-surface-base);\n    background-image: repeating-conic-gradient(\n      var(--brick-color-surface-subtle) 0 25%,\n      var(--brick-color-surface-raised) 0 50%\n    );\n    background-size: var(--brick-color-picker-checker-size) var(--brick-color-picker-checker-size);\n  }\n\n  .brick-color-picker__area {\n    position: relative;\n    box-sizing: border-box;\n    inline-size: 100%;\n    block-size: var(--brick-color-picker-area-block-size);\n    overflow: hidden;\n    border: var(--brick-border-width) solid var(--brick-color-border-default);\n    border-radius: var(--brick-radius-surface);\n    touch-action: none;\n  }\n\n  .brick-color-picker__area-background {\n    /* Atom's behavioral primitive emits a neutral relative position inline;\n       the finished Brick anatomy makes that gradient fill the bounded area. */\n    position: absolute !important;\n    inset: 0;\n  }\n\n  .brick-color-picker__area-thumb,\n  .brick-color-picker__channel-slider-thumb {\n    box-sizing: border-box;\n    inline-size: var(--brick-color-picker-thumb-size);\n    block-size: var(--brick-color-picker-thumb-size);\n    border: 2px solid white;\n    border-radius: var(--brick-radius-full);\n    background: currentColor;\n    box-shadow: 0 0 0 1px rgb(0 0 0 / 40%), var(--brick-shadow-floating);\n  }\n\n  .brick-color-picker__channel-slider {\n    position: relative;\n    display: grid;\n    grid-template-columns: 1fr auto;\n    min-inline-size: 0;\n    align-items: center;\n    gap: var(--brick-space-1) var(--brick-space-2);\n    touch-action: none;\n  }\n\n  .brick-color-picker__channel-slider-track {\n    position: relative;\n    grid-column: 1 / -1;\n    block-size: var(--brick-color-picker-slider-block-size);\n    overflow: hidden;\n    border: var(--brick-border-width) solid var(--brick-color-border-default);\n    border-radius: var(--brick-radius-full);\n  }\n\n  .brick-color-picker__transparency-grid {\n    position: absolute;\n    inset: 0;\n    border-radius: inherit;\n  }\n\n  .brick-color-picker__positioner {\n    z-index: calc(var(--brick-layer-overlay) - 1);\n  }\n\n  .brick-color-picker__content {\n    box-sizing: border-box;\n    display: grid;\n    inline-size: min(21rem, calc(100dvi - 2rem - env(safe-area-inset-left) - env(safe-area-inset-right)));\n    max-block-size: min(32rem, calc(100dvb - 2rem));\n    gap: var(--brick-space-3);\n    padding: var(--brick-space-3);\n    overflow: auto;\n    border: var(--brick-border-width) solid var(--brick-color-picker-content-border-color);\n    border-radius: var(--brick-color-picker-content-radius);\n    background: var(--brick-color-picker-content-background);\n    box-shadow: var(--brick-color-picker-content-shadow);\n    color: var(--brick-color-text-primary);\n    overscroll-behavior: contain;\n  }\n\n  /* Inline Content participates in its authored container instead of the\n     viewport-owned Positioner used by popup compositions. */\n  .brick-color-picker > .brick-color-picker__content {\n    inline-size: min(21rem, 100%);\n  }\n\n  .brick-color-picker__view:not([hidden]) {\n    display: grid;\n    gap: var(--brick-space-2);\n  }\n\n  .brick-color-picker__swatch-group {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--brick-color-picker-swatch-gap);\n  }\n\n  .brick-color-picker__swatch-trigger {\n    position: relative;\n    display: inline-grid;\n    box-sizing: border-box;\n    min-inline-size: var(--brick-color-picker-control-size);\n    min-block-size: var(--brick-color-picker-control-size);\n    place-items: center;\n    padding: var(--brick-space-1);\n    border: var(--brick-border-width) solid transparent;\n    border-radius: var(--brick-radius-full);\n    background: transparent;\n    color: var(--brick-color-text-primary);\n    cursor: pointer;\n  }\n\n  .brick-color-picker__swatch-trigger:hover {\n    border-color: var(--brick-color-border-strong);\n    background: var(--brick-color-surface-hover, var(--brick-color-surface-subtle));\n  }\n\n  .brick-color-picker__swatch-trigger[data-state=\"checked\"],\n  .brick-color-picker__swatch-trigger[aria-pressed=\"true\"] {\n    border-color: var(--brick-color-accent-border);\n  }\n\n  .brick-color-picker__swatch-indicator {\n    position: relative;\n    z-index: 1;\n    display: inline-grid;\n    inline-size: 1rem;\n    block-size: 1rem;\n    place-items: center;\n    color: var(--brick-color-picker-indicator-color);\n    filter: drop-shadow(0 1px 1px var(--brick-color-picker-indicator-shadow));\n  }\n\n  .brick-color-picker__swatch-indicator::before {\n    font-size: var(--brick-typography-control-sm-font-size);\n    font-weight: var(--brick-typography-control-sm-font-weight);\n    line-height: var(--brick-typography-control-sm-line-height);\n    content: \"✓\";\n  }\n\n  .brick-color-picker[data-invalid] {\n    --brick-color-picker-border-color: var(--brick-color-danger-border);\n    --brick-color-picker-focus-ring: var(--brick-color-danger-text);\n  }\n\n  .brick-color-picker[data-disabled] :where(input, button, select) {\n    cursor: not-allowed;\n    color: var(--brick-color-text-disabled);\n    opacity: 0.72;\n  }\n\n  .brick-color-picker[data-readonly] :where(input, select, .brick-color-picker__swatch-trigger) {\n    cursor: not-allowed;\n    background: var(--brick-color-surface-subtle);\n  }\n\n  @supports not (height: 100dvb) {\n    .brick-color-picker__content { max-block-size: min(32rem, calc(100vh - 2rem)); }\n  }\n\n  @media (max-width: 30rem) {\n    .brick-color-picker__control { flex-wrap: wrap; }\n    .brick-color-picker__input { inline-size: 100%; flex-basis: 100%; }\n    .brick-color-picker__content { inline-size: min(21rem, calc(100dvi - 1rem)); }\n    .brick-color-picker__swatch-trigger { min-inline-size: 2.75rem; min-block-size: 2.75rem; }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .brick-color-picker :where(input, button, select) { transition-duration: 1ms; }\n  }\n\n  @media (forced-colors: active) {\n    .brick-color-picker {\n      --brick-color-picker-background: Canvas;\n      --brick-color-picker-border-color: CanvasText;\n      --brick-color-picker-content-background: Canvas;\n      --brick-color-picker-content-border-color: CanvasText;\n      --brick-color-picker-content-shadow: none;\n      --brick-color-picker-indicator-color: CanvasText;\n      --brick-color-picker-indicator-shadow: transparent;\n    }\n\n    :where(\n      .brick-color-picker__area,\n      .brick-color-picker__channel-slider-track,\n      .brick-color-picker__value-swatch,\n      .brick-color-picker__swatch\n    ) { border-color: CanvasText; forced-color-adjust: none; }\n\n    .brick-color-picker__swatch-trigger[data-state=\"checked\"],\n    .brick-color-picker__swatch-trigger[aria-pressed=\"true\"] { border-width: 2px; }\n  }\n}\n"],"names":[]}

package/dist/styles/color-swatch.css

@@ -1,2 +1,2 @@
-@layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-color-swatch{--brick-color-swatch-size:1.5rem;--brick-color-swatch-value:transparent;--brick-color-swatch-border-color:var(--brick-color-border-default);--brick-color-swatch-radius:var(--brick-radius-subtle);box-sizing:border-box;inline-size:var(--brick-color-swatch-size);block-size:var(--brick-color-swatch-size);border:var(--brick-border-width) solid var(--brick-color-swatch-border-color);border-radius:var(--brick-color-swatch-radius);background-color:var(--brick-color-surface-base);background-image:repeating-conic-gradient(var(--brick-color-surface-subtle) 0 25%, var(--brick-color-surface-raised) 0 50%);vertical-align:middle;background-position:0 0;background-size:.5rem .5rem;flex:none;display:inline-block;position:relative;overflow:hidden}.brick-color-swatch:after{background:var(--brick-color-swatch-value);content:"";position:absolute;inset:0}.brick-color-swatch[data-size=sm]{--brick-color-swatch-size:1rem}.brick-color-swatch[data-size=lg]{--brick-color-swatch-size:2rem}@media (forced-colors:active){.brick-color-swatch{forced-color-adjust:none;border-color:canvastext}}}@layer brick.utilities,brick.effects;
+@layer brick.tokens,flowstack.theme,brick.foundations;@layer brick.components{.brick-color-swatch{--brick-color-swatch-size:1.5rem;--brick-color-swatch-value:transparent;--brick-color-swatch-border-color:var(--brick-color-border-default);--brick-color-swatch-radius:var(--brick-radius-subtle);box-sizing:border-box;inline-size:var(--brick-color-swatch-size);block-size:var(--brick-color-swatch-size);border:var(--brick-border-width) solid var(--brick-color-swatch-border-color);border-radius:var(--brick-color-swatch-radius);background-color:var(--brick-color-surface-base);background-image:repeating-conic-gradient(var(--brick-color-surface-subtle) 0 25%, var(--brick-color-surface-raised) 0 50%);vertical-align:middle;background-position:0 0;background-size:.5rem .5rem;flex:none;display:inline-block;position:relative;overflow:hidden}.brick-color-swatch:after{background:var(--brick-color-swatch-value);content:"";position:absolute;inset:0}.brick-color-swatch[data-size=sm]{--brick-color-swatch-size:1rem}.brick-color-swatch[data-size=lg]{--brick-color-swatch-size:2rem}.brick-color-swatch[data-shape=sharp]{--brick-color-swatch-radius:0}.brick-color-swatch[data-shape=circle]{--brick-color-swatch-radius:var(--brick-radius-full)}@media (forced-colors:active){.brick-color-swatch{forced-color-adjust:none;border-color:canvastext}}}@layer brick.utilities,brick.effects;
 /*# sourceMappingURL=color-swatch.css.map */

package/dist/styles/color-swatch.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,uvBAyBA,0GAOA,iEACA,iEAEA,8BACE,uEDrCJ","sources":["home/runner/work/brick/brick/.brick-cache/production/color-swatch.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-swatch/color-swatch.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/color-swatch/color-swatch.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  .brick-color-swatch {\n    --brick-color-swatch-size: 1.5rem;\n    --brick-color-swatch-value: transparent;\n    --brick-color-swatch-border-color: var(--brick-color-border-default);\n    --brick-color-swatch-radius: var(--brick-radius-subtle);\n\n    position: relative;\n    display: inline-block;\n    box-sizing: border-box;\n    inline-size: var(--brick-color-swatch-size);\n    block-size: var(--brick-color-swatch-size);\n    flex: none;\n    overflow: hidden;\n    border: var(--brick-border-width) solid var(--brick-color-swatch-border-color);\n    border-radius: var(--brick-color-swatch-radius);\n    background-color: var(--brick-color-surface-base);\n    background-image: repeating-conic-gradient(\n      var(--brick-color-surface-subtle) 0 25%,\n      var(--brick-color-surface-raised) 0 50%\n    );\n    background-position: 0 0;\n    background-size: 0.5rem 0.5rem;\n    vertical-align: middle;\n  }\n\n  .brick-color-swatch::after {\n    position: absolute;\n    inset: 0;\n    background: var(--brick-color-swatch-value);\n    content: \"\";\n  }\n\n  .brick-color-swatch[data-size=\"sm\"] { --brick-color-swatch-size: 1rem; }\n  .brick-color-swatch[data-size=\"lg\"] { --brick-color-swatch-size: 2rem; }\n\n  @media (forced-colors: active) {\n    .brick-color-swatch {\n      border-color: CanvasText;\n      forced-color-adjust: none;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,uvBAyBA,0GAOA,iEACA,iEACA,oEACA,4FAEA,8BACE,uEDvCJ","sources":["home/runner/work/brick/brick/.brick-cache/production/color-swatch.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/color-swatch/color-swatch.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/color-swatch/color-swatch.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  .brick-color-swatch {\n    --brick-color-swatch-size: 1.5rem;\n    --brick-color-swatch-value: transparent;\n    --brick-color-swatch-border-color: var(--brick-color-border-default);\n    --brick-color-swatch-radius: var(--brick-radius-subtle);\n\n    position: relative;\n    display: inline-block;\n    box-sizing: border-box;\n    inline-size: var(--brick-color-swatch-size);\n    block-size: var(--brick-color-swatch-size);\n    flex: none;\n    overflow: hidden;\n    border: var(--brick-border-width) solid var(--brick-color-swatch-border-color);\n    border-radius: var(--brick-color-swatch-radius);\n    background-color: var(--brick-color-surface-base);\n    background-image: repeating-conic-gradient(\n      var(--brick-color-surface-subtle) 0 25%,\n      var(--brick-color-surface-raised) 0 50%\n    );\n    background-position: 0 0;\n    background-size: 0.5rem 0.5rem;\n    vertical-align: middle;\n  }\n\n  .brick-color-swatch::after {\n    position: absolute;\n    inset: 0;\n    background: var(--brick-color-swatch-value);\n    content: \"\";\n  }\n\n  .brick-color-swatch[data-size=\"sm\"] { --brick-color-swatch-size: 1rem; }\n  .brick-color-swatch[data-size=\"lg\"] { --brick-color-swatch-size: 2rem; }\n  .brick-color-swatch[data-shape=\"sharp\"] { --brick-color-swatch-radius: 0; }\n  .brick-color-swatch[data-shape=\"circle\"] { --brick-color-swatch-radius: var(--brick-radius-full); }\n\n  @media (forced-colors: active) {\n    .brick-color-swatch {\n      border-color: CanvasText;\n      forced-color-adjust: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/styles/dropdown-menu.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,2nCA8BA,0OAWA,uPAWA,wPAWA,2OAWA,iOAYA,yhBAgBA,uiBAgBA,kNAYA,8fAcA,6jCAwCA,keAkBA,gIAQA,mLAUA,klBAmBA,qbAiBA,6fAkBA,gcAkBA,oWAeA,6QAgBA,0JAUA,+SAeA,2JAUA,2cAeA,0VAaA,8HAQA,wMASA,qKAQA,wTAgBA,8RAWA,kQAUA,qRAUA,6BACE,8PAYF,uCACE,2NAaF,8BACE,qQAcA,+iBAqBA,iZCzgBF,2yHAuDA,yDFxDF","sources":["home/runner/work/brick/brick/.brick-cache/production/dropdown-menu.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/dropdown-menu/dropdown-menu.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-menu/action-menu.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-menu/action-menu.css\";\n@import \"../../src/components/dropdown-menu/dropdown-menu.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  :where(.brick-dropdown-menu__content, .brick-dropdown-menu__sub-content) {\n    --brick-dropdown-menu-content-background: var(--brick-color-surface-overlay);\n    --brick-dropdown-menu-content-foreground: var(--brick-color-text-primary);\n    --brick-dropdown-menu-content-border: var(--brick-color-border-subtle);\n    --brick-dropdown-menu-content-radius: var(--brick-radius-overlay);\n    --brick-dropdown-menu-content-shadow: var(--brick-shadow-floating);\n    --brick-dropdown-menu-content-padding: var(--brick-space-1);\n    --brick-dropdown-menu-content-max-block-size: 20rem;\n    --brick-dropdown-menu-row-min-block-size: var(--brick-control-target-min);\n    --brick-dropdown-menu-row-padding-inline: var(--brick-space-3);\n    --brick-dropdown-menu-row-gap: var(--brick-space-2);\n    --brick-dropdown-menu-row-radius: var(--brick-radius-control);\n    --brick-dropdown-menu-row-foreground: var(--brick-color-text-primary);\n    --brick-dropdown-menu-row-highlighted-background: var(--brick-color-accent-soft);\n    --brick-dropdown-menu-row-highlighted-foreground: var(--brick-color-accent-text);\n    --brick-dropdown-menu-description-foreground: var(--brick-color-text-secondary);\n    --brick-dropdown-menu-shortcut-foreground: var(--brick-color-text-muted);\n    --brick-dropdown-menu-label-foreground: var(--brick-color-text-secondary);\n    --brick-dropdown-menu-disabled-foreground: var(--brick-color-text-muted);\n    --brick-dropdown-menu-danger-foreground: var(--brick-color-danger-text);\n    --brick-dropdown-menu-danger-background: var(--brick-color-danger-soft);\n    --brick-dropdown-menu-separator-color: var(--brick-color-border-subtle);\n    --brick-dropdown-menu-indicator-size: 1rem;\n    --brick-dropdown-menu-focus-ring: var(--brick-color-focus-ring);\n    --brick-dropdown-menu-motion-duration: var(--brick-motion-duration-fast);\n\n    --brick-action-menu-content-background: var(--brick-dropdown-menu-content-background);\n    --brick-action-menu-content-foreground: var(--brick-dropdown-menu-content-foreground);\n    --brick-action-menu-content-border: var(--brick-dropdown-menu-content-border);\n    --brick-action-menu-content-radius: var(--brick-dropdown-menu-content-radius);\n    --brick-action-menu-content-shadow: var(--brick-dropdown-menu-content-shadow);\n    --brick-action-menu-content-padding: var(--brick-dropdown-menu-content-padding);\n    --brick-action-menu-content-max-block-size: var(--brick-dropdown-menu-content-max-block-size);\n    --brick-action-menu-content-z-index: var(--brick-layer-overlay);\n    --brick-action-menu-row-min-block-size: var(--brick-dropdown-menu-row-min-block-size);\n    --brick-action-menu-row-padding-inline: var(--brick-dropdown-menu-row-padding-inline);\n    --brick-action-menu-row-gap: var(--brick-dropdown-menu-row-gap);\n    --brick-action-menu-row-radius: var(--brick-dropdown-menu-row-radius);\n    --brick-action-menu-row-foreground: var(--brick-dropdown-menu-row-foreground);\n    --brick-action-menu-row-highlighted-background: var(--brick-dropdown-menu-row-highlighted-background);\n    --brick-action-menu-row-highlighted-foreground: var(--brick-dropdown-menu-row-highlighted-foreground);\n    --brick-action-menu-description-foreground: var(--brick-dropdown-menu-description-foreground);\n    --brick-action-menu-shortcut-foreground: var(--brick-dropdown-menu-shortcut-foreground);\n    --brick-action-menu-label-foreground: var(--brick-dropdown-menu-label-foreground);\n    --brick-action-menu-disabled-foreground: var(--brick-dropdown-menu-disabled-foreground);\n    --brick-action-menu-danger-foreground: var(--brick-dropdown-menu-danger-foreground);\n    --brick-action-menu-danger-background: var(--brick-dropdown-menu-danger-background);\n    --brick-action-menu-separator-color: var(--brick-dropdown-menu-separator-color);\n    --brick-action-menu-indicator-size: var(--brick-dropdown-menu-indicator-size);\n    --brick-action-menu-focus-ring: var(--brick-dropdown-menu-focus-ring);\n    --brick-action-menu-motion-duration: var(--brick-dropdown-menu-motion-duration);\n    --brick-action-menu-font-size: var(--brick-typography-control-md-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-md-line-height);\n  }\n\n  .brick-dropdown-menu__trigger {\n    touch-action: manipulation;\n  }\n}\n","@layer brick.components {\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  ) {\n    box-sizing: border-box;\n    min-inline-size: max(12rem, var(--atom-menu-anchor-width, 0rem));\n    max-inline-size: min(24rem, calc(100dvi - 2 * var(--brick-space-3)));\n    max-block-size: min(var(--brick-action-menu-content-max-block-size), var(--atom-menu-available-height, var(--brick-action-menu-content-max-block-size)));\n    padding: var(--brick-action-menu-content-padding);\n    overflow-x: hidden;\n    overflow-y: auto;\n    overscroll-behavior: contain;\n    border: var(--brick-border-width) solid var(--brick-action-menu-content-border);\n    border-radius: var(--brick-action-menu-content-radius);\n    background: var(--brick-action-menu-content-background);\n    box-shadow: var(--brick-action-menu-content-shadow);\n    color: var(--brick-action-menu-content-foreground);\n    opacity: 0;\n    translate: 0 0;\n    scrollbar-width: thin;\n    transition:\n      opacity var(--brick-action-menu-motion-duration) var(--brick-motion-easing-enter),\n      translate var(--brick-action-menu-motion-duration) var(--brick-motion-easing-enter);\n    z-index: var(--brick-action-menu-content-z-index);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"top\"] {\n    translate: 0 var(--brick-space-1);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"right\"] {\n    translate: calc(var(--brick-space-1) * -1) 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"bottom\"] {\n    translate: 0 calc(var(--brick-space-1) * -1);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"left\"] {\n    translate: var(--brick-space-1) 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-positioned] {\n    opacity: 1;\n    translate: 0 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-size=\"sm\"] {\n    --brick-action-menu-row-min-block-size: 2rem;\n    --brick-action-menu-row-padding-inline: var(--brick-space-2);\n    --brick-action-menu-row-gap: 0.375rem;\n    --brick-action-menu-indicator-size: 0.875rem;\n    --brick-action-menu-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-sm-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-size=\"lg\"] {\n    --brick-action-menu-row-min-block-size: 3rem;\n    --brick-action-menu-row-padding-inline: var(--brick-space-4);\n    --brick-action-menu-row-gap: var(--brick-space-3);\n    --brick-action-menu-indicator-size: 1.125rem;\n    --brick-action-menu-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-lg-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__group,\n    .brick-context-menu__group,\n    .brick-menubar__group\n  ) + :where(\n    .brick-dropdown-menu__group,\n    .brick-context-menu__group,\n    .brick-menubar__group\n  ) {\n    margin-block-start: var(--brick-space-1);\n  }\n\n  :where(\n    .brick-dropdown-menu__label,\n    .brick-context-menu__label,\n    .brick-menubar__label\n  ) {\n    padding: var(--brick-space-2) var(--brick-action-menu-row-padding-inline) var(--brick-space-1);\n    color: var(--brick-action-menu-label-foreground);\n    font-family: var(--brick-typography-caption-font-family);\n    font-size: var(--brick-typography-caption-font-size);\n    font-weight: var(--brick-typography-label-md-font-weight);\n    letter-spacing: var(--brick-typography-caption-letter-spacing);\n    line-height: var(--brick-typography-caption-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  ) {\n    display: grid;\n    box-sizing: border-box;\n    min-inline-size: 0;\n    min-block-size: var(--brick-action-menu-row-min-block-size);\n    grid-template-columns: var(--brick-action-menu-indicator-size) minmax(0, 1fr) auto;\n    align-items: center;\n    gap: var(--brick-action-menu-row-gap);\n    padding: var(--brick-space-1) var(--brick-action-menu-row-padding-inline);\n    border-radius: var(--brick-action-menu-row-radius);\n    outline: 0;\n    color: var(--brick-action-menu-row-foreground);\n    font-family: var(--brick-typography-control-md-font-family);\n    font-size: var(--brick-action-menu-font-size);\n    font-weight: var(--brick-typography-control-md-font-weight);\n    line-height: var(--brick-action-menu-line-height);\n    text-align: start;\n    cursor: default;\n    user-select: none;\n  }\n\n  /*\n   * Destination rows may compose a Brick Link through the menu item's\n   * `asChild` contract. Restore the menu-row recipe above Link's inline\n   * presentation and flatten Link's content wrapper so Leading, ItemLabel,\n   * Description, and Shortcut continue to participate in the row grid.\n   */\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ) {\n    display: grid;\n    inline-size: 100%;\n    align-items: center;\n    gap: var(--brick-action-menu-row-gap);\n    color: var(--brick-action-menu-row-foreground);\n    font-family: var(--brick-typography-control-md-font-family);\n    font-size: var(--brick-action-menu-font-size);\n    font-weight: var(--brick-typography-control-md-font-weight);\n    line-height: var(--brick-action-menu-line-height);\n    text-decoration-line: none;\n    vertical-align: middle;\n  }\n\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ) > .brick-link__content {\n    display: contents;\n  }\n\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ):is(:hover, :focus-visible, :active) {\n    outline: 0;\n    color: currentColor;\n    text-decoration-line: none;\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-highlighted] {\n    background: var(--brick-action-menu-row-highlighted-background);\n    color: var(--brick-action-menu-row-highlighted-foreground);\n    box-shadow: inset 0 0 0 var(--brick-border-width) var(--brick-action-menu-focus-ring);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-tone=\"danger\"] {\n    color: var(--brick-action-menu-danger-foreground);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-tone=\"danger\"][data-highlighted] {\n    background: var(--brick-action-menu-danger-background);\n    color: var(--brick-action-menu-danger-foreground);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-disabled] {\n    color: var(--brick-action-menu-disabled-foreground);\n    opacity: 0.65;\n  }\n\n  :where(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading,\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ) {\n    display: inline-grid;\n    inline-size: var(--brick-action-menu-indicator-size);\n    block-size: var(--brick-action-menu-indicator-size);\n    place-items: center;\n    color: currentColor;\n  }\n\n  :is(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > .brick-icon {\n    --brick-icon-size: var(--brick-action-menu-indicator-size);\n  }\n\n  :is(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > .brick-icon[data-size] {\n    --brick-icon-size: var(--brick-action-menu-indicator-size);\n  }\n\n  :where(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > :where(svg, img) {\n    display: block;\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__sub-trigger\n  ) > :where(\n    .brick-dropdown-menu__item-label,\n    .brick-context-menu__item-label,\n    .brick-menubar__item-label\n  ):first-child {\n    grid-column: 2;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-label,\n    .brick-context-menu__item-label,\n    .brick-menubar__item-label\n  ) {\n    min-inline-size: 0;\n    grid-column: 2;\n    overflow-wrap: anywhere;\n  }\n\n  :where(\n    .brick-dropdown-menu__description,\n    .brick-context-menu__description,\n    .brick-menubar__description\n  ) {\n    min-inline-size: 0;\n    grid-column: 2 / -1;\n    color: var(--brick-action-menu-description-foreground);\n    font-family: var(--brick-typography-supporting-sm-font-family);\n    font-size: var(--brick-typography-supporting-sm-font-size);\n    font-weight: var(--brick-typography-supporting-sm-font-weight);\n    line-height: var(--brick-typography-supporting-sm-line-height);\n    overflow-wrap: anywhere;\n  }\n\n  :where(\n    .brick-dropdown-menu__shortcut,\n    .brick-context-menu__shortcut,\n    .brick-menubar__shortcut\n  ) {\n    grid-column: 3;\n    color: var(--brick-action-menu-shortcut-foreground);\n    font-family: var(--brick-typography-code-inline-font-family);\n    font-size: var(--brick-typography-caption-font-size);\n    line-height: var(--brick-typography-caption-line-height);\n    white-space: nowrap;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ) {\n    grid-column: 1;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ):empty::before {\n    content: \"✓\";\n    font-weight: var(--brick-typography-label-strong-font-weight);\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  )[data-state=\"indeterminate\"]:empty::before {\n    content: \"−\";\n  }\n\n  :where(\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__sub-trigger\n  )::after {\n    content: \"\";\n    grid-column: 3;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-right: 0.125rem solid currentColor;\n    border-bottom: 0.125rem solid currentColor;\n    color: var(--brick-action-menu-shortcut-foreground);\n    direction: ltr;\n    transform: rotate(-45deg);\n  }\n\n  :where(\n    [dir=\"rtl\"] .brick-dropdown-menu__sub-trigger,\n    [dir=\"rtl\"] .brick-context-menu__sub-trigger,\n    [dir=\"rtl\"] .brick-menubar__sub-trigger,\n    .brick-dropdown-menu__sub-trigger[dir=\"rtl\"],\n    .brick-context-menu__sub-trigger[dir=\"rtl\"],\n    .brick-menubar__sub-trigger[dir=\"rtl\"]\n  )::after {\n    transform: rotate(135deg);\n  }\n\n  :where(\n    .brick-dropdown-menu__separator,\n    .brick-context-menu__separator,\n    .brick-menubar__separator\n  ) {\n    block-size: var(--brick-border-width);\n    margin: var(--brick-space-1) var(--brick-action-menu-row-padding-inline);\n    background: var(--brick-action-menu-separator-color);\n  }\n\n  :where(\n    .brick-dropdown-menu__arrow,\n    .brick-context-menu__arrow,\n    .brick-menubar__arrow\n  ) {\n    --brick-floating-arrow-fill: var(--brick-action-menu-content-background);\n    --brick-floating-arrow-stroke: var(--brick-action-menu-content-border);\n    color: var(--brick-action-menu-content-background);\n  }\n\n  @supports not (width: 100dvi) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      max-inline-size: min(24rem, calc(100vw - 2 * var(--brick-space-3)));\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      scale: 1;\n      transition-duration: 1ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      border-color: CanvasText;\n      background: Canvas;\n      box-shadow: none;\n      color: CanvasText;\n    }\n\n    :where(\n      .brick-dropdown-menu__item,\n      .brick-dropdown-menu__checkbox-item,\n      .brick-dropdown-menu__radio-item,\n      .brick-dropdown-menu__sub-trigger,\n      .brick-context-menu__item,\n      .brick-context-menu__checkbox-item,\n      .brick-context-menu__radio-item,\n      .brick-context-menu__sub-trigger,\n      .brick-menubar__item,\n      .brick-menubar__checkbox-item,\n      .brick-menubar__radio-item,\n      .brick-menubar__sub-trigger\n    )[data-highlighted] {\n      outline: var(--brick-border-focus-width) solid Highlight;\n      outline-offset: calc(var(--brick-border-focus-width) * -1);\n      background: Highlight;\n      box-shadow: none;\n      color: HighlightText;\n    }\n\n    :where(\n      .brick-dropdown-menu__item,\n      .brick-dropdown-menu__checkbox-item,\n      .brick-dropdown-menu__radio-item,\n      .brick-dropdown-menu__sub-trigger,\n      .brick-context-menu__item,\n      .brick-context-menu__checkbox-item,\n      .brick-context-menu__radio-item,\n      .brick-context-menu__sub-trigger,\n      .brick-menubar__item,\n      .brick-menubar__checkbox-item,\n      .brick-menubar__radio-item,\n      .brick-menubar__sub-trigger\n    )[data-disabled] {\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,2nCA8BA,0OAWA,uPAWA,wPAWA,2OAWA,iOAYA,yhBAgBA,uiBAgBA,kNAYA,8fAcA,6jCAwCA,keAkBA,gIAQA,mLAUA,klBAmBA,qbAiBA,6fAkBA,gcAkBA,oWAeA,6QAgBA,0JAUA,+SAeA,2JAUA,2cAeA,0VAaA,8HAQA,wMASA,qKAQA,wTAgBA,8RAWA,kQAUA,qRAUA,6BACE,8PAYF,uCACE,2NAaF,8BACE,qQAcA,+iBAqBA,iZCzgBF,2yHAuDA,yDFxDF","sources":["home/runner/work/brick/brick/.brick-cache/production/dropdown-menu.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-menu/action-menu.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/dropdown-menu/dropdown-menu.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-menu/action-menu.css\";\n@import \"../../src/components/dropdown-menu/dropdown-menu.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  ) {\n    box-sizing: border-box;\n    min-inline-size: max(12rem, var(--atom-menu-anchor-width, 0rem));\n    max-inline-size: min(24rem, calc(100dvi - 2 * var(--brick-space-3)));\n    max-block-size: min(var(--brick-action-menu-content-max-block-size), var(--atom-menu-available-height, var(--brick-action-menu-content-max-block-size)));\n    padding: var(--brick-action-menu-content-padding);\n    overflow-x: hidden;\n    overflow-y: auto;\n    overscroll-behavior: contain;\n    border: var(--brick-border-width) solid var(--brick-action-menu-content-border);\n    border-radius: var(--brick-action-menu-content-radius);\n    background: var(--brick-action-menu-content-background);\n    box-shadow: var(--brick-action-menu-content-shadow);\n    color: var(--brick-action-menu-content-foreground);\n    opacity: 0;\n    translate: 0 0;\n    scrollbar-width: thin;\n    transition:\n      opacity var(--brick-action-menu-motion-duration) var(--brick-motion-easing-enter),\n      translate var(--brick-action-menu-motion-duration) var(--brick-motion-easing-enter);\n    z-index: var(--brick-action-menu-content-z-index);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"top\"] {\n    translate: 0 var(--brick-space-1);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"right\"] {\n    translate: calc(var(--brick-space-1) * -1) 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"bottom\"] {\n    translate: 0 calc(var(--brick-space-1) * -1);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"left\"] {\n    translate: var(--brick-space-1) 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-positioned] {\n    opacity: 1;\n    translate: 0 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-size=\"sm\"] {\n    --brick-action-menu-row-min-block-size: 2rem;\n    --brick-action-menu-row-padding-inline: var(--brick-space-2);\n    --brick-action-menu-row-gap: 0.375rem;\n    --brick-action-menu-indicator-size: 0.875rem;\n    --brick-action-menu-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-sm-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-size=\"lg\"] {\n    --brick-action-menu-row-min-block-size: 3rem;\n    --brick-action-menu-row-padding-inline: var(--brick-space-4);\n    --brick-action-menu-row-gap: var(--brick-space-3);\n    --brick-action-menu-indicator-size: 1.125rem;\n    --brick-action-menu-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-lg-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__group,\n    .brick-context-menu__group,\n    .brick-menubar__group\n  ) + :where(\n    .brick-dropdown-menu__group,\n    .brick-context-menu__group,\n    .brick-menubar__group\n  ) {\n    margin-block-start: var(--brick-space-1);\n  }\n\n  :where(\n    .brick-dropdown-menu__label,\n    .brick-context-menu__label,\n    .brick-menubar__label\n  ) {\n    padding: var(--brick-space-2) var(--brick-action-menu-row-padding-inline) var(--brick-space-1);\n    color: var(--brick-action-menu-label-foreground);\n    font-family: var(--brick-typography-caption-font-family);\n    font-size: var(--brick-typography-caption-font-size);\n    font-weight: var(--brick-typography-label-md-font-weight);\n    letter-spacing: var(--brick-typography-caption-letter-spacing);\n    line-height: var(--brick-typography-caption-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  ) {\n    display: grid;\n    box-sizing: border-box;\n    min-inline-size: 0;\n    min-block-size: var(--brick-action-menu-row-min-block-size);\n    grid-template-columns: var(--brick-action-menu-indicator-size) minmax(0, 1fr) auto;\n    align-items: center;\n    gap: var(--brick-action-menu-row-gap);\n    padding: var(--brick-space-1) var(--brick-action-menu-row-padding-inline);\n    border-radius: var(--brick-action-menu-row-radius);\n    outline: 0;\n    color: var(--brick-action-menu-row-foreground);\n    font-family: var(--brick-typography-control-md-font-family);\n    font-size: var(--brick-action-menu-font-size);\n    font-weight: var(--brick-typography-control-md-font-weight);\n    line-height: var(--brick-action-menu-line-height);\n    text-align: start;\n    cursor: default;\n    user-select: none;\n  }\n\n  /*\n   * Destination rows may compose a Brick Link through the menu item's\n   * `asChild` contract. Restore the menu-row recipe above Link's inline\n   * presentation and flatten Link's content wrapper so Leading, ItemLabel,\n   * Description, and Shortcut continue to participate in the row grid.\n   */\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ) {\n    display: grid;\n    inline-size: 100%;\n    align-items: center;\n    gap: var(--brick-action-menu-row-gap);\n    color: var(--brick-action-menu-row-foreground);\n    font-family: var(--brick-typography-control-md-font-family);\n    font-size: var(--brick-action-menu-font-size);\n    font-weight: var(--brick-typography-control-md-font-weight);\n    line-height: var(--brick-action-menu-line-height);\n    text-decoration-line: none;\n    vertical-align: middle;\n  }\n\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ) > .brick-link__content {\n    display: contents;\n  }\n\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ):is(:hover, :focus-visible, :active) {\n    outline: 0;\n    color: currentColor;\n    text-decoration-line: none;\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-highlighted] {\n    background: var(--brick-action-menu-row-highlighted-background);\n    color: var(--brick-action-menu-row-highlighted-foreground);\n    box-shadow: inset 0 0 0 var(--brick-border-width) var(--brick-action-menu-focus-ring);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-tone=\"danger\"] {\n    color: var(--brick-action-menu-danger-foreground);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-tone=\"danger\"][data-highlighted] {\n    background: var(--brick-action-menu-danger-background);\n    color: var(--brick-action-menu-danger-foreground);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-disabled] {\n    color: var(--brick-action-menu-disabled-foreground);\n    opacity: 0.65;\n  }\n\n  :where(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading,\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ) {\n    display: inline-grid;\n    inline-size: var(--brick-action-menu-indicator-size);\n    block-size: var(--brick-action-menu-indicator-size);\n    place-items: center;\n    color: currentColor;\n  }\n\n  :is(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > .brick-icon {\n    --brick-icon-size: var(--brick-action-menu-indicator-size);\n  }\n\n  :is(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > .brick-icon[data-size] {\n    --brick-icon-size: var(--brick-action-menu-indicator-size);\n  }\n\n  :where(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > :where(svg, img) {\n    display: block;\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__sub-trigger\n  ) > :where(\n    .brick-dropdown-menu__item-label,\n    .brick-context-menu__item-label,\n    .brick-menubar__item-label\n  ):first-child {\n    grid-column: 2;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-label,\n    .brick-context-menu__item-label,\n    .brick-menubar__item-label\n  ) {\n    min-inline-size: 0;\n    grid-column: 2;\n    overflow-wrap: anywhere;\n  }\n\n  :where(\n    .brick-dropdown-menu__description,\n    .brick-context-menu__description,\n    .brick-menubar__description\n  ) {\n    min-inline-size: 0;\n    grid-column: 2 / -1;\n    color: var(--brick-action-menu-description-foreground);\n    font-family: var(--brick-typography-supporting-sm-font-family);\n    font-size: var(--brick-typography-supporting-sm-font-size);\n    font-weight: var(--brick-typography-supporting-sm-font-weight);\n    line-height: var(--brick-typography-supporting-sm-line-height);\n    overflow-wrap: anywhere;\n  }\n\n  :where(\n    .brick-dropdown-menu__shortcut,\n    .brick-context-menu__shortcut,\n    .brick-menubar__shortcut\n  ) {\n    grid-column: 3;\n    color: var(--brick-action-menu-shortcut-foreground);\n    font-family: var(--brick-typography-code-inline-font-family);\n    font-size: var(--brick-typography-caption-font-size);\n    line-height: var(--brick-typography-caption-line-height);\n    white-space: nowrap;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ) {\n    grid-column: 1;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ):empty::before {\n    content: \"✓\";\n    font-weight: var(--brick-typography-label-strong-font-weight);\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  )[data-state=\"indeterminate\"]:empty::before {\n    content: \"−\";\n  }\n\n  :where(\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__sub-trigger\n  )::after {\n    content: \"\";\n    grid-column: 3;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-right: 0.125rem solid currentColor;\n    border-bottom: 0.125rem solid currentColor;\n    color: var(--brick-action-menu-shortcut-foreground);\n    direction: ltr;\n    transform: rotate(-45deg);\n  }\n\n  :where(\n    [dir=\"rtl\"] .brick-dropdown-menu__sub-trigger,\n    [dir=\"rtl\"] .brick-context-menu__sub-trigger,\n    [dir=\"rtl\"] .brick-menubar__sub-trigger,\n    .brick-dropdown-menu__sub-trigger[dir=\"rtl\"],\n    .brick-context-menu__sub-trigger[dir=\"rtl\"],\n    .brick-menubar__sub-trigger[dir=\"rtl\"]\n  )::after {\n    transform: rotate(135deg);\n  }\n\n  :where(\n    .brick-dropdown-menu__separator,\n    .brick-context-menu__separator,\n    .brick-menubar__separator\n  ) {\n    block-size: var(--brick-border-width);\n    margin: var(--brick-space-1) var(--brick-action-menu-row-padding-inline);\n    background: var(--brick-action-menu-separator-color);\n  }\n\n  :where(\n    .brick-dropdown-menu__arrow,\n    .brick-context-menu__arrow,\n    .brick-menubar__arrow\n  ) {\n    --brick-floating-arrow-fill: var(--brick-action-menu-content-background);\n    --brick-floating-arrow-stroke: var(--brick-action-menu-content-border);\n    color: var(--brick-action-menu-content-background);\n  }\n\n  @supports not (width: 100dvi) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      max-inline-size: min(24rem, calc(100vw - 2 * var(--brick-space-3)));\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      scale: 1;\n      transition-duration: 1ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      border-color: CanvasText;\n      background: Canvas;\n      box-shadow: none;\n      color: CanvasText;\n    }\n\n    :where(\n      .brick-dropdown-menu__item,\n      .brick-dropdown-menu__checkbox-item,\n      .brick-dropdown-menu__radio-item,\n      .brick-dropdown-menu__sub-trigger,\n      .brick-context-menu__item,\n      .brick-context-menu__checkbox-item,\n      .brick-context-menu__radio-item,\n      .brick-context-menu__sub-trigger,\n      .brick-menubar__item,\n      .brick-menubar__checkbox-item,\n      .brick-menubar__radio-item,\n      .brick-menubar__sub-trigger\n    )[data-highlighted] {\n      outline: var(--brick-border-focus-width) solid Highlight;\n      outline-offset: calc(var(--brick-border-focus-width) * -1);\n      background: Highlight;\n      box-shadow: none;\n      color: HighlightText;\n    }\n\n    :where(\n      .brick-dropdown-menu__item,\n      .brick-dropdown-menu__checkbox-item,\n      .brick-dropdown-menu__radio-item,\n      .brick-dropdown-menu__sub-trigger,\n      .brick-context-menu__item,\n      .brick-context-menu__checkbox-item,\n      .brick-context-menu__radio-item,\n      .brick-context-menu__sub-trigger,\n      .brick-menubar__item,\n      .brick-menubar__checkbox-item,\n      .brick-menubar__radio-item,\n      .brick-menubar__sub-trigger\n    )[data-disabled] {\n      color: GrayText;\n    }\n  }\n}\n","@layer brick.components {\n  :where(.brick-dropdown-menu__content, .brick-dropdown-menu__sub-content) {\n    --brick-dropdown-menu-content-background: var(--brick-color-surface-overlay);\n    --brick-dropdown-menu-content-foreground: var(--brick-color-text-primary);\n    --brick-dropdown-menu-content-border: var(--brick-color-border-subtle);\n    --brick-dropdown-menu-content-radius: var(--brick-radius-overlay);\n    --brick-dropdown-menu-content-shadow: var(--brick-shadow-floating);\n    --brick-dropdown-menu-content-padding: var(--brick-space-1);\n    --brick-dropdown-menu-content-max-block-size: 20rem;\n    --brick-dropdown-menu-row-min-block-size: var(--brick-control-target-min);\n    --brick-dropdown-menu-row-padding-inline: var(--brick-space-3);\n    --brick-dropdown-menu-row-gap: var(--brick-space-2);\n    --brick-dropdown-menu-row-radius: var(--brick-radius-control);\n    --brick-dropdown-menu-row-foreground: var(--brick-color-text-primary);\n    --brick-dropdown-menu-row-highlighted-background: var(--brick-color-accent-soft);\n    --brick-dropdown-menu-row-highlighted-foreground: var(--brick-color-accent-text);\n    --brick-dropdown-menu-description-foreground: var(--brick-color-text-secondary);\n    --brick-dropdown-menu-shortcut-foreground: var(--brick-color-text-muted);\n    --brick-dropdown-menu-label-foreground: var(--brick-color-text-secondary);\n    --brick-dropdown-menu-disabled-foreground: var(--brick-color-text-muted);\n    --brick-dropdown-menu-danger-foreground: var(--brick-color-danger-text);\n    --brick-dropdown-menu-danger-background: var(--brick-color-danger-soft);\n    --brick-dropdown-menu-separator-color: var(--brick-color-border-subtle);\n    --brick-dropdown-menu-indicator-size: 1rem;\n    --brick-dropdown-menu-focus-ring: var(--brick-color-focus-ring);\n    --brick-dropdown-menu-motion-duration: var(--brick-motion-duration-fast);\n\n    --brick-action-menu-content-background: var(--brick-dropdown-menu-content-background);\n    --brick-action-menu-content-foreground: var(--brick-dropdown-menu-content-foreground);\n    --brick-action-menu-content-border: var(--brick-dropdown-menu-content-border);\n    --brick-action-menu-content-radius: var(--brick-dropdown-menu-content-radius);\n    --brick-action-menu-content-shadow: var(--brick-dropdown-menu-content-shadow);\n    --brick-action-menu-content-padding: var(--brick-dropdown-menu-content-padding);\n    --brick-action-menu-content-max-block-size: var(--brick-dropdown-menu-content-max-block-size);\n    --brick-action-menu-content-z-index: var(--brick-layer-overlay);\n    --brick-action-menu-row-min-block-size: var(--brick-dropdown-menu-row-min-block-size);\n    --brick-action-menu-row-padding-inline: var(--brick-dropdown-menu-row-padding-inline);\n    --brick-action-menu-row-gap: var(--brick-dropdown-menu-row-gap);\n    --brick-action-menu-row-radius: var(--brick-dropdown-menu-row-radius);\n    --brick-action-menu-row-foreground: var(--brick-dropdown-menu-row-foreground);\n    --brick-action-menu-row-highlighted-background: var(--brick-dropdown-menu-row-highlighted-background);\n    --brick-action-menu-row-highlighted-foreground: var(--brick-dropdown-menu-row-highlighted-foreground);\n    --brick-action-menu-description-foreground: var(--brick-dropdown-menu-description-foreground);\n    --brick-action-menu-shortcut-foreground: var(--brick-dropdown-menu-shortcut-foreground);\n    --brick-action-menu-label-foreground: var(--brick-dropdown-menu-label-foreground);\n    --brick-action-menu-disabled-foreground: var(--brick-dropdown-menu-disabled-foreground);\n    --brick-action-menu-danger-foreground: var(--brick-dropdown-menu-danger-foreground);\n    --brick-action-menu-danger-background: var(--brick-dropdown-menu-danger-background);\n    --brick-action-menu-separator-color: var(--brick-dropdown-menu-separator-color);\n    --brick-action-menu-indicator-size: var(--brick-dropdown-menu-indicator-size);\n    --brick-action-menu-focus-ring: var(--brick-dropdown-menu-focus-ring);\n    --brick-action-menu-motion-duration: var(--brick-dropdown-menu-motion-duration);\n    --brick-action-menu-font-size: var(--brick-typography-control-md-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-md-line-height);\n  }\n\n  .brick-dropdown-menu__trigger {\n    touch-action: manipulation;\n  }\n}\n"],"names":[]}

package/dist/styles/menubar.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,2nCA8BA,0OAWA,uPAWA,wPAWA,2OAWA,iOAYA,yhBAgBA,uiBAgBA,kNAYA,8fAcA,6jCAwCA,keAkBA,gIAQA,mLAUA,klBAmBA,qbAiBA,6fAkBA,gcAkBA,oWAeA,6QAgBA,0JAUA,+SAeA,2JAUA,2cAeA,0VAaA,8HAQA,wMASA,qKAQA,wTAgBA,8RAWA,kQAUA,qRAUA,6BACE,8PAYF,uCACE,2NAaF,8BACE,qQAcA,+iBAqBA,iZCzgBF,6nCA0BA,wFACA,qIACA,qIAEA,yYAeA,iHACA,4KACA,oJACA,uFAEA,6EAKA,ytFA8BA,8BACE,0EACA,gEFxFJ","sources":["home/runner/work/brick/brick/.brick-cache/production/menubar.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-menu/action-menu.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/menubar/menubar.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-menu/action-menu.css\";\n@import \"../../src/components/menubar/menubar.css\";","@layer brick.components {\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  ) {\n    box-sizing: border-box;\n    min-inline-size: max(12rem, var(--atom-menu-anchor-width, 0rem));\n    max-inline-size: min(24rem, calc(100dvi - 2 * var(--brick-space-3)));\n    max-block-size: min(var(--brick-action-menu-content-max-block-size), var(--atom-menu-available-height, var(--brick-action-menu-content-max-block-size)));\n    padding: var(--brick-action-menu-content-padding);\n    overflow-x: hidden;\n    overflow-y: auto;\n    overscroll-behavior: contain;\n    border: var(--brick-border-width) solid var(--brick-action-menu-content-border);\n    border-radius: var(--brick-action-menu-content-radius);\n    background: var(--brick-action-menu-content-background);\n    box-shadow: var(--brick-action-menu-content-shadow);\n    color: var(--brick-action-menu-content-foreground);\n    opacity: 0;\n    translate: 0 0;\n    scrollbar-width: thin;\n    transition:\n      opacity var(--brick-action-menu-motion-duration) var(--brick-motion-easing-enter),\n      translate var(--brick-action-menu-motion-duration) var(--brick-motion-easing-enter);\n    z-index: var(--brick-action-menu-content-z-index);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"top\"] {\n    translate: 0 var(--brick-space-1);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"right\"] {\n    translate: calc(var(--brick-space-1) * -1) 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"bottom\"] {\n    translate: 0 calc(var(--brick-space-1) * -1);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"left\"] {\n    translate: var(--brick-space-1) 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-positioned] {\n    opacity: 1;\n    translate: 0 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-size=\"sm\"] {\n    --brick-action-menu-row-min-block-size: 2rem;\n    --brick-action-menu-row-padding-inline: var(--brick-space-2);\n    --brick-action-menu-row-gap: 0.375rem;\n    --brick-action-menu-indicator-size: 0.875rem;\n    --brick-action-menu-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-sm-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-size=\"lg\"] {\n    --brick-action-menu-row-min-block-size: 3rem;\n    --brick-action-menu-row-padding-inline: var(--brick-space-4);\n    --brick-action-menu-row-gap: var(--brick-space-3);\n    --brick-action-menu-indicator-size: 1.125rem;\n    --brick-action-menu-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-lg-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__group,\n    .brick-context-menu__group,\n    .brick-menubar__group\n  ) + :where(\n    .brick-dropdown-menu__group,\n    .brick-context-menu__group,\n    .brick-menubar__group\n  ) {\n    margin-block-start: var(--brick-space-1);\n  }\n\n  :where(\n    .brick-dropdown-menu__label,\n    .brick-context-menu__label,\n    .brick-menubar__label\n  ) {\n    padding: var(--brick-space-2) var(--brick-action-menu-row-padding-inline) var(--brick-space-1);\n    color: var(--brick-action-menu-label-foreground);\n    font-family: var(--brick-typography-caption-font-family);\n    font-size: var(--brick-typography-caption-font-size);\n    font-weight: var(--brick-typography-label-md-font-weight);\n    letter-spacing: var(--brick-typography-caption-letter-spacing);\n    line-height: var(--brick-typography-caption-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  ) {\n    display: grid;\n    box-sizing: border-box;\n    min-inline-size: 0;\n    min-block-size: var(--brick-action-menu-row-min-block-size);\n    grid-template-columns: var(--brick-action-menu-indicator-size) minmax(0, 1fr) auto;\n    align-items: center;\n    gap: var(--brick-action-menu-row-gap);\n    padding: var(--brick-space-1) var(--brick-action-menu-row-padding-inline);\n    border-radius: var(--brick-action-menu-row-radius);\n    outline: 0;\n    color: var(--brick-action-menu-row-foreground);\n    font-family: var(--brick-typography-control-md-font-family);\n    font-size: var(--brick-action-menu-font-size);\n    font-weight: var(--brick-typography-control-md-font-weight);\n    line-height: var(--brick-action-menu-line-height);\n    text-align: start;\n    cursor: default;\n    user-select: none;\n  }\n\n  /*\n   * Destination rows may compose a Brick Link through the menu item's\n   * `asChild` contract. Restore the menu-row recipe above Link's inline\n   * presentation and flatten Link's content wrapper so Leading, ItemLabel,\n   * Description, and Shortcut continue to participate in the row grid.\n   */\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ) {\n    display: grid;\n    inline-size: 100%;\n    align-items: center;\n    gap: var(--brick-action-menu-row-gap);\n    color: var(--brick-action-menu-row-foreground);\n    font-family: var(--brick-typography-control-md-font-family);\n    font-size: var(--brick-action-menu-font-size);\n    font-weight: var(--brick-typography-control-md-font-weight);\n    line-height: var(--brick-action-menu-line-height);\n    text-decoration-line: none;\n    vertical-align: middle;\n  }\n\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ) > .brick-link__content {\n    display: contents;\n  }\n\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ):is(:hover, :focus-visible, :active) {\n    outline: 0;\n    color: currentColor;\n    text-decoration-line: none;\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-highlighted] {\n    background: var(--brick-action-menu-row-highlighted-background);\n    color: var(--brick-action-menu-row-highlighted-foreground);\n    box-shadow: inset 0 0 0 var(--brick-border-width) var(--brick-action-menu-focus-ring);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-tone=\"danger\"] {\n    color: var(--brick-action-menu-danger-foreground);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-tone=\"danger\"][data-highlighted] {\n    background: var(--brick-action-menu-danger-background);\n    color: var(--brick-action-menu-danger-foreground);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-disabled] {\n    color: var(--brick-action-menu-disabled-foreground);\n    opacity: 0.65;\n  }\n\n  :where(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading,\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ) {\n    display: inline-grid;\n    inline-size: var(--brick-action-menu-indicator-size);\n    block-size: var(--brick-action-menu-indicator-size);\n    place-items: center;\n    color: currentColor;\n  }\n\n  :is(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > .brick-icon {\n    --brick-icon-size: var(--brick-action-menu-indicator-size);\n  }\n\n  :is(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > .brick-icon[data-size] {\n    --brick-icon-size: var(--brick-action-menu-indicator-size);\n  }\n\n  :where(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > :where(svg, img) {\n    display: block;\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__sub-trigger\n  ) > :where(\n    .brick-dropdown-menu__item-label,\n    .brick-context-menu__item-label,\n    .brick-menubar__item-label\n  ):first-child {\n    grid-column: 2;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-label,\n    .brick-context-menu__item-label,\n    .brick-menubar__item-label\n  ) {\n    min-inline-size: 0;\n    grid-column: 2;\n    overflow-wrap: anywhere;\n  }\n\n  :where(\n    .brick-dropdown-menu__description,\n    .brick-context-menu__description,\n    .brick-menubar__description\n  ) {\n    min-inline-size: 0;\n    grid-column: 2 / -1;\n    color: var(--brick-action-menu-description-foreground);\n    font-family: var(--brick-typography-supporting-sm-font-family);\n    font-size: var(--brick-typography-supporting-sm-font-size);\n    font-weight: var(--brick-typography-supporting-sm-font-weight);\n    line-height: var(--brick-typography-supporting-sm-line-height);\n    overflow-wrap: anywhere;\n  }\n\n  :where(\n    .brick-dropdown-menu__shortcut,\n    .brick-context-menu__shortcut,\n    .brick-menubar__shortcut\n  ) {\n    grid-column: 3;\n    color: var(--brick-action-menu-shortcut-foreground);\n    font-family: var(--brick-typography-code-inline-font-family);\n    font-size: var(--brick-typography-caption-font-size);\n    line-height: var(--brick-typography-caption-line-height);\n    white-space: nowrap;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ) {\n    grid-column: 1;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ):empty::before {\n    content: \"✓\";\n    font-weight: var(--brick-typography-label-strong-font-weight);\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  )[data-state=\"indeterminate\"]:empty::before {\n    content: \"−\";\n  }\n\n  :where(\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__sub-trigger\n  )::after {\n    content: \"\";\n    grid-column: 3;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-right: 0.125rem solid currentColor;\n    border-bottom: 0.125rem solid currentColor;\n    color: var(--brick-action-menu-shortcut-foreground);\n    direction: ltr;\n    transform: rotate(-45deg);\n  }\n\n  :where(\n    [dir=\"rtl\"] .brick-dropdown-menu__sub-trigger,\n    [dir=\"rtl\"] .brick-context-menu__sub-trigger,\n    [dir=\"rtl\"] .brick-menubar__sub-trigger,\n    .brick-dropdown-menu__sub-trigger[dir=\"rtl\"],\n    .brick-context-menu__sub-trigger[dir=\"rtl\"],\n    .brick-menubar__sub-trigger[dir=\"rtl\"]\n  )::after {\n    transform: rotate(135deg);\n  }\n\n  :where(\n    .brick-dropdown-menu__separator,\n    .brick-context-menu__separator,\n    .brick-menubar__separator\n  ) {\n    block-size: var(--brick-border-width);\n    margin: var(--brick-space-1) var(--brick-action-menu-row-padding-inline);\n    background: var(--brick-action-menu-separator-color);\n  }\n\n  :where(\n    .brick-dropdown-menu__arrow,\n    .brick-context-menu__arrow,\n    .brick-menubar__arrow\n  ) {\n    --brick-floating-arrow-fill: var(--brick-action-menu-content-background);\n    --brick-floating-arrow-stroke: var(--brick-action-menu-content-border);\n    color: var(--brick-action-menu-content-background);\n  }\n\n  @supports not (width: 100dvi) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      max-inline-size: min(24rem, calc(100vw - 2 * var(--brick-space-3)));\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      scale: 1;\n      transition-duration: 1ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      border-color: CanvasText;\n      background: Canvas;\n      box-shadow: none;\n      color: CanvasText;\n    }\n\n    :where(\n      .brick-dropdown-menu__item,\n      .brick-dropdown-menu__checkbox-item,\n      .brick-dropdown-menu__radio-item,\n      .brick-dropdown-menu__sub-trigger,\n      .brick-context-menu__item,\n      .brick-context-menu__checkbox-item,\n      .brick-context-menu__radio-item,\n      .brick-context-menu__sub-trigger,\n      .brick-menubar__item,\n      .brick-menubar__checkbox-item,\n      .brick-menubar__radio-item,\n      .brick-menubar__sub-trigger\n    )[data-highlighted] {\n      outline: var(--brick-border-focus-width) solid Highlight;\n      outline-offset: calc(var(--brick-border-focus-width) * -1);\n      background: Highlight;\n      box-shadow: none;\n      color: HighlightText;\n    }\n\n    :where(\n      .brick-dropdown-menu__item,\n      .brick-dropdown-menu__checkbox-item,\n      .brick-dropdown-menu__radio-item,\n      .brick-dropdown-menu__sub-trigger,\n      .brick-context-menu__item,\n      .brick-context-menu__checkbox-item,\n      .brick-context-menu__radio-item,\n      .brick-context-menu__sub-trigger,\n      .brick-menubar__item,\n      .brick-menubar__checkbox-item,\n      .brick-menubar__radio-item,\n      .brick-menubar__sub-trigger\n    )[data-disabled] {\n      color: GrayText;\n    }\n  }\n}\n","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  .brick-menubar {\n    --brick-menubar-background: var(--brick-color-surface-subtle);\n    --brick-menubar-border: var(--brick-color-border-subtle);\n    --brick-menubar-radius: var(--brick-radius-control);\n    --brick-menubar-padding: var(--brick-space-1);\n    --brick-menubar-gap: var(--brick-space-1);\n    --brick-menubar-trigger-min-block-size: var(--brick-control-target-min);\n    --brick-menubar-trigger-padding-inline: var(--brick-space-3);\n    --brick-menubar-trigger-radius: calc(var(--brick-radius-control) - var(--brick-border-width));\n    --brick-menubar-trigger-foreground: var(--brick-color-text-primary);\n    --brick-menubar-trigger-interaction-background: var(--brick-color-surface-raised);\n    --brick-menubar-trigger-open-background: var(--brick-color-accent-soft);\n    --brick-menubar-trigger-open-foreground: var(--brick-color-accent-text);\n    --brick-menubar-trigger-focus-ring: var(--brick-color-focus-ring);\n\n    display: inline-flex;\n    box-sizing: border-box;\n    max-inline-size: 100%;\n    align-items: stretch;\n    gap: var(--brick-menubar-gap);\n    padding: var(--brick-menubar-padding);\n    border: var(--brick-border-width) solid var(--brick-menubar-border);\n    border-radius: var(--brick-menubar-radius);\n    background: var(--brick-menubar-background);\n  }\n\n  .brick-menubar[data-orientation=\"vertical\"] { flex-direction: column; inline-size: fit-content; }\n  .brick-menubar[data-size=\"sm\"] { --brick-menubar-trigger-min-block-size: 2rem; --brick-menubar-trigger-padding-inline: var(--brick-space-2); }\n  .brick-menubar[data-size=\"lg\"] { --brick-menubar-trigger-min-block-size: 3rem; --brick-menubar-trigger-padding-inline: var(--brick-space-4); }\n\n  .brick-menubar__trigger {\n    display: inline-flex;\n    box-sizing: border-box;\n    min-block-size: var(--brick-menubar-trigger-min-block-size);\n    align-items: center;\n    justify-content: center;\n    padding-inline: var(--brick-menubar-trigger-padding-inline);\n    border: 0;\n    border-radius: var(--brick-menubar-trigger-radius);\n    background: transparent;\n    color: var(--brick-menubar-trigger-foreground);\n    font: inherit;\n    white-space: nowrap;\n    cursor: default;\n  }\n  .brick-menubar__trigger:is(:hover, :focus-visible) { background: var(--brick-menubar-trigger-interaction-background); }\n  .brick-menubar__trigger:focus-visible { outline: var(--brick-border-focus-width) solid var(--brick-menubar-trigger-focus-ring); outline-offset: var(--brick-border-focus-offset); }\n  .brick-menubar__trigger[data-state=\"open\"] { background: var(--brick-menubar-trigger-open-background); color: var(--brick-menubar-trigger-open-foreground); }\n  .brick-menubar__trigger[data-disabled] { color: var(--brick-color-text-muted); opacity: 0.65; }\n\n  .brick-menubar__content[data-state=\"closed\"] {\n    visibility: hidden;\n    transition: none;\n  }\n\n  :where(.brick-menubar__content, .brick-menubar__sub-content) {\n    --brick-action-menu-content-background: var(--brick-menubar-content-background, var(--brick-color-surface-overlay));\n    --brick-action-menu-content-foreground: var(--brick-menubar-content-foreground, var(--brick-color-text-primary));\n    --brick-action-menu-content-border: var(--brick-menubar-content-border, var(--brick-color-border-subtle));\n    --brick-action-menu-content-radius: var(--brick-menubar-content-radius, var(--brick-radius-overlay));\n    --brick-action-menu-content-shadow: var(--brick-menubar-content-shadow, var(--brick-shadow-floating));\n    --brick-action-menu-content-padding: var(--brick-menubar-content-padding, var(--brick-space-1));\n    --brick-action-menu-content-max-block-size: var(--brick-menubar-content-max-block-size, 20rem);\n    --brick-action-menu-content-z-index: var(--brick-layer-overlay);\n    --brick-action-menu-row-min-block-size: var(--brick-menubar-row-min-block-size, var(--brick-control-target-min));\n    --brick-action-menu-row-padding-inline: var(--brick-menubar-row-padding-inline, var(--brick-space-3));\n    --brick-action-menu-row-gap: var(--brick-menubar-row-gap, var(--brick-space-2));\n    --brick-action-menu-row-radius: var(--brick-menubar-row-radius, var(--brick-radius-control));\n    --brick-action-menu-row-foreground: var(--brick-menubar-row-foreground, var(--brick-color-text-primary));\n    --brick-action-menu-row-highlighted-background: var(--brick-menubar-row-highlighted-background, var(--brick-color-accent-soft));\n    --brick-action-menu-row-highlighted-foreground: var(--brick-menubar-row-highlighted-foreground, var(--brick-color-accent-text));\n    --brick-action-menu-description-foreground: var(--brick-menubar-description-foreground, var(--brick-color-text-secondary));\n    --brick-action-menu-shortcut-foreground: var(--brick-menubar-shortcut-foreground, var(--brick-color-text-muted));\n    --brick-action-menu-label-foreground: var(--brick-menubar-label-foreground, var(--brick-color-text-secondary));\n    --brick-action-menu-disabled-foreground: var(--brick-menubar-disabled-foreground, var(--brick-color-text-muted));\n    --brick-action-menu-danger-foreground: var(--brick-menubar-danger-foreground, var(--brick-color-danger-text));\n    --brick-action-menu-danger-background: var(--brick-menubar-danger-background, var(--brick-color-danger-soft));\n    --brick-action-menu-separator-color: var(--brick-menubar-separator-color, var(--brick-color-border-subtle));\n    --brick-action-menu-indicator-size: var(--brick-menubar-indicator-size, 1rem);\n    --brick-action-menu-focus-ring: var(--brick-menubar-focus-ring, var(--brick-color-focus-ring));\n    --brick-action-menu-motion-duration: var(--brick-menubar-motion-duration, var(--brick-motion-duration-fast));\n    --brick-action-menu-font-size: var(--brick-typography-control-md-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-md-line-height);\n  }\n\n  @media (forced-colors: active) {\n    .brick-menubar { border-color: CanvasText; background: Canvas; color: CanvasText; }\n    .brick-menubar__trigger:focus-visible { outline-color: Highlight; }\n  }\n}\n"],"names":[]}
+{"version":3,"sourceRoot":null,"mappings":"ACAA,sDAAA,wBCCE,2nCA8BA,0OAWA,uPAWA,wPAWA,2OAWA,iOAYA,yhBAgBA,uiBAgBA,kNAYA,8fAcA,6jCAwCA,keAkBA,gIAQA,mLAUA,klBAmBA,qbAiBA,6fAkBA,gcAkBA,oWAeA,6QAgBA,0JAUA,+SAeA,2JAUA,2cAeA,0VAaA,8HAQA,wMASA,qKAQA,wTAgBA,8RAWA,kQAUA,qRAUA,6BACE,8PAYF,uCACE,2NAaF,8BACE,qQAcA,+iBAqBA,iZCzgBF,6nCA0BA,wFACA,qIACA,qIAEA,yYAeA,iHACA,4KACA,oJACA,uFAEA,6EAKA,ytFA8BA,8BACE,0EACA,gEFxFJ","sources":["home/runner/work/brick/brick/.brick-cache/production/menubar.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-menu/action-menu.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/menubar/menubar.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-menu/action-menu.css\";\n@import \"../../src/components/menubar/menubar.css\";","@layer brick.tokens, flowstack.theme, brick.foundations, brick.components, brick.utilities, brick.effects;\n","@layer brick.components {\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  ) {\n    box-sizing: border-box;\n    min-inline-size: max(12rem, var(--atom-menu-anchor-width, 0rem));\n    max-inline-size: min(24rem, calc(100dvi - 2 * var(--brick-space-3)));\n    max-block-size: min(var(--brick-action-menu-content-max-block-size), var(--atom-menu-available-height, var(--brick-action-menu-content-max-block-size)));\n    padding: var(--brick-action-menu-content-padding);\n    overflow-x: hidden;\n    overflow-y: auto;\n    overscroll-behavior: contain;\n    border: var(--brick-border-width) solid var(--brick-action-menu-content-border);\n    border-radius: var(--brick-action-menu-content-radius);\n    background: var(--brick-action-menu-content-background);\n    box-shadow: var(--brick-action-menu-content-shadow);\n    color: var(--brick-action-menu-content-foreground);\n    opacity: 0;\n    translate: 0 0;\n    scrollbar-width: thin;\n    transition:\n      opacity var(--brick-action-menu-motion-duration) var(--brick-motion-easing-enter),\n      translate var(--brick-action-menu-motion-duration) var(--brick-motion-easing-enter);\n    z-index: var(--brick-action-menu-content-z-index);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"top\"] {\n    translate: 0 var(--brick-space-1);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"right\"] {\n    translate: calc(var(--brick-space-1) * -1) 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"bottom\"] {\n    translate: 0 calc(var(--brick-space-1) * -1);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-side=\"left\"] {\n    translate: var(--brick-space-1) 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-positioned] {\n    opacity: 1;\n    translate: 0 0;\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-size=\"sm\"] {\n    --brick-action-menu-row-min-block-size: 2rem;\n    --brick-action-menu-row-padding-inline: var(--brick-space-2);\n    --brick-action-menu-row-gap: 0.375rem;\n    --brick-action-menu-indicator-size: 0.875rem;\n    --brick-action-menu-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-sm-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__content,\n    .brick-dropdown-menu__sub-content,\n    .brick-context-menu__content,\n    .brick-context-menu__sub-content,\n    .brick-menubar__content,\n    .brick-menubar__sub-content\n  )[data-size=\"lg\"] {\n    --brick-action-menu-row-min-block-size: 3rem;\n    --brick-action-menu-row-padding-inline: var(--brick-space-4);\n    --brick-action-menu-row-gap: var(--brick-space-3);\n    --brick-action-menu-indicator-size: 1.125rem;\n    --brick-action-menu-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-lg-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__group,\n    .brick-context-menu__group,\n    .brick-menubar__group\n  ) + :where(\n    .brick-dropdown-menu__group,\n    .brick-context-menu__group,\n    .brick-menubar__group\n  ) {\n    margin-block-start: var(--brick-space-1);\n  }\n\n  :where(\n    .brick-dropdown-menu__label,\n    .brick-context-menu__label,\n    .brick-menubar__label\n  ) {\n    padding: var(--brick-space-2) var(--brick-action-menu-row-padding-inline) var(--brick-space-1);\n    color: var(--brick-action-menu-label-foreground);\n    font-family: var(--brick-typography-caption-font-family);\n    font-size: var(--brick-typography-caption-font-size);\n    font-weight: var(--brick-typography-label-md-font-weight);\n    letter-spacing: var(--brick-typography-caption-letter-spacing);\n    line-height: var(--brick-typography-caption-line-height);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  ) {\n    display: grid;\n    box-sizing: border-box;\n    min-inline-size: 0;\n    min-block-size: var(--brick-action-menu-row-min-block-size);\n    grid-template-columns: var(--brick-action-menu-indicator-size) minmax(0, 1fr) auto;\n    align-items: center;\n    gap: var(--brick-action-menu-row-gap);\n    padding: var(--brick-space-1) var(--brick-action-menu-row-padding-inline);\n    border-radius: var(--brick-action-menu-row-radius);\n    outline: 0;\n    color: var(--brick-action-menu-row-foreground);\n    font-family: var(--brick-typography-control-md-font-family);\n    font-size: var(--brick-action-menu-font-size);\n    font-weight: var(--brick-typography-control-md-font-weight);\n    line-height: var(--brick-action-menu-line-height);\n    text-align: start;\n    cursor: default;\n    user-select: none;\n  }\n\n  /*\n   * Destination rows may compose a Brick Link through the menu item's\n   * `asChild` contract. Restore the menu-row recipe above Link's inline\n   * presentation and flatten Link's content wrapper so Leading, ItemLabel,\n   * Description, and Shortcut continue to participate in the row grid.\n   */\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ) {\n    display: grid;\n    inline-size: 100%;\n    align-items: center;\n    gap: var(--brick-action-menu-row-gap);\n    color: var(--brick-action-menu-row-foreground);\n    font-family: var(--brick-typography-control-md-font-family);\n    font-size: var(--brick-action-menu-font-size);\n    font-weight: var(--brick-typography-control-md-font-weight);\n    line-height: var(--brick-action-menu-line-height);\n    text-decoration-line: none;\n    vertical-align: middle;\n  }\n\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ) > .brick-link__content {\n    display: contents;\n  }\n\n  .brick-link:is(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item\n  ):is(:hover, :focus-visible, :active) {\n    outline: 0;\n    color: currentColor;\n    text-decoration-line: none;\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-highlighted] {\n    background: var(--brick-action-menu-row-highlighted-background);\n    color: var(--brick-action-menu-row-highlighted-foreground);\n    box-shadow: inset 0 0 0 var(--brick-border-width) var(--brick-action-menu-focus-ring);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-tone=\"danger\"] {\n    color: var(--brick-action-menu-danger-foreground);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-tone=\"danger\"][data-highlighted] {\n    background: var(--brick-action-menu-danger-background);\n    color: var(--brick-action-menu-danger-foreground);\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-dropdown-menu__checkbox-item,\n    .brick-dropdown-menu__radio-item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__item,\n    .brick-context-menu__checkbox-item,\n    .brick-context-menu__radio-item,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__item,\n    .brick-menubar__checkbox-item,\n    .brick-menubar__radio-item,\n    .brick-menubar__sub-trigger\n  )[data-disabled] {\n    color: var(--brick-action-menu-disabled-foreground);\n    opacity: 0.65;\n  }\n\n  :where(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading,\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ) {\n    display: inline-grid;\n    inline-size: var(--brick-action-menu-indicator-size);\n    block-size: var(--brick-action-menu-indicator-size);\n    place-items: center;\n    color: currentColor;\n  }\n\n  :is(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > .brick-icon {\n    --brick-icon-size: var(--brick-action-menu-indicator-size);\n  }\n\n  :is(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > .brick-icon[data-size] {\n    --brick-icon-size: var(--brick-action-menu-indicator-size);\n  }\n\n  :where(\n    .brick-dropdown-menu__leading,\n    .brick-context-menu__leading,\n    .brick-menubar__leading\n  ) > :where(svg, img) {\n    display: block;\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  :where(\n    .brick-dropdown-menu__item,\n    .brick-context-menu__item,\n    .brick-menubar__item,\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__sub-trigger\n  ) > :where(\n    .brick-dropdown-menu__item-label,\n    .brick-context-menu__item-label,\n    .brick-menubar__item-label\n  ):first-child {\n    grid-column: 2;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-label,\n    .brick-context-menu__item-label,\n    .brick-menubar__item-label\n  ) {\n    min-inline-size: 0;\n    grid-column: 2;\n    overflow-wrap: anywhere;\n  }\n\n  :where(\n    .brick-dropdown-menu__description,\n    .brick-context-menu__description,\n    .brick-menubar__description\n  ) {\n    min-inline-size: 0;\n    grid-column: 2 / -1;\n    color: var(--brick-action-menu-description-foreground);\n    font-family: var(--brick-typography-supporting-sm-font-family);\n    font-size: var(--brick-typography-supporting-sm-font-size);\n    font-weight: var(--brick-typography-supporting-sm-font-weight);\n    line-height: var(--brick-typography-supporting-sm-line-height);\n    overflow-wrap: anywhere;\n  }\n\n  :where(\n    .brick-dropdown-menu__shortcut,\n    .brick-context-menu__shortcut,\n    .brick-menubar__shortcut\n  ) {\n    grid-column: 3;\n    color: var(--brick-action-menu-shortcut-foreground);\n    font-family: var(--brick-typography-code-inline-font-family);\n    font-size: var(--brick-typography-caption-font-size);\n    line-height: var(--brick-typography-caption-line-height);\n    white-space: nowrap;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ) {\n    grid-column: 1;\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  ):empty::before {\n    content: \"✓\";\n    font-weight: var(--brick-typography-label-strong-font-weight);\n  }\n\n  :where(\n    .brick-dropdown-menu__item-indicator,\n    .brick-context-menu__item-indicator,\n    .brick-menubar__item-indicator\n  )[data-state=\"indeterminate\"]:empty::before {\n    content: \"−\";\n  }\n\n  :where(\n    .brick-dropdown-menu__sub-trigger,\n    .brick-context-menu__sub-trigger,\n    .brick-menubar__sub-trigger\n  )::after {\n    content: \"\";\n    grid-column: 3;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-right: 0.125rem solid currentColor;\n    border-bottom: 0.125rem solid currentColor;\n    color: var(--brick-action-menu-shortcut-foreground);\n    direction: ltr;\n    transform: rotate(-45deg);\n  }\n\n  :where(\n    [dir=\"rtl\"] .brick-dropdown-menu__sub-trigger,\n    [dir=\"rtl\"] .brick-context-menu__sub-trigger,\n    [dir=\"rtl\"] .brick-menubar__sub-trigger,\n    .brick-dropdown-menu__sub-trigger[dir=\"rtl\"],\n    .brick-context-menu__sub-trigger[dir=\"rtl\"],\n    .brick-menubar__sub-trigger[dir=\"rtl\"]\n  )::after {\n    transform: rotate(135deg);\n  }\n\n  :where(\n    .brick-dropdown-menu__separator,\n    .brick-context-menu__separator,\n    .brick-menubar__separator\n  ) {\n    block-size: var(--brick-border-width);\n    margin: var(--brick-space-1) var(--brick-action-menu-row-padding-inline);\n    background: var(--brick-action-menu-separator-color);\n  }\n\n  :where(\n    .brick-dropdown-menu__arrow,\n    .brick-context-menu__arrow,\n    .brick-menubar__arrow\n  ) {\n    --brick-floating-arrow-fill: var(--brick-action-menu-content-background);\n    --brick-floating-arrow-stroke: var(--brick-action-menu-content-border);\n    color: var(--brick-action-menu-content-background);\n  }\n\n  @supports not (width: 100dvi) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      max-inline-size: min(24rem, calc(100vw - 2 * var(--brick-space-3)));\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      scale: 1;\n      transition-duration: 1ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    :where(\n      .brick-dropdown-menu__content,\n      .brick-dropdown-menu__sub-content,\n      .brick-context-menu__content,\n      .brick-context-menu__sub-content,\n      .brick-menubar__content,\n      .brick-menubar__sub-content\n    ) {\n      border-color: CanvasText;\n      background: Canvas;\n      box-shadow: none;\n      color: CanvasText;\n    }\n\n    :where(\n      .brick-dropdown-menu__item,\n      .brick-dropdown-menu__checkbox-item,\n      .brick-dropdown-menu__radio-item,\n      .brick-dropdown-menu__sub-trigger,\n      .brick-context-menu__item,\n      .brick-context-menu__checkbox-item,\n      .brick-context-menu__radio-item,\n      .brick-context-menu__sub-trigger,\n      .brick-menubar__item,\n      .brick-menubar__checkbox-item,\n      .brick-menubar__radio-item,\n      .brick-menubar__sub-trigger\n    )[data-highlighted] {\n      outline: var(--brick-border-focus-width) solid Highlight;\n      outline-offset: calc(var(--brick-border-focus-width) * -1);\n      background: Highlight;\n      box-shadow: none;\n      color: HighlightText;\n    }\n\n    :where(\n      .brick-dropdown-menu__item,\n      .brick-dropdown-menu__checkbox-item,\n      .brick-dropdown-menu__radio-item,\n      .brick-dropdown-menu__sub-trigger,\n      .brick-context-menu__item,\n      .brick-context-menu__checkbox-item,\n      .brick-context-menu__radio-item,\n      .brick-context-menu__sub-trigger,\n      .brick-menubar__item,\n      .brick-menubar__checkbox-item,\n      .brick-menubar__radio-item,\n      .brick-menubar__sub-trigger\n    )[data-disabled] {\n      color: GrayText;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-menubar {\n    --brick-menubar-background: var(--brick-color-surface-subtle);\n    --brick-menubar-border: var(--brick-color-border-subtle);\n    --brick-menubar-radius: var(--brick-radius-control);\n    --brick-menubar-padding: var(--brick-space-1);\n    --brick-menubar-gap: var(--brick-space-1);\n    --brick-menubar-trigger-min-block-size: var(--brick-control-target-min);\n    --brick-menubar-trigger-padding-inline: var(--brick-space-3);\n    --brick-menubar-trigger-radius: calc(var(--brick-radius-control) - var(--brick-border-width));\n    --brick-menubar-trigger-foreground: var(--brick-color-text-primary);\n    --brick-menubar-trigger-interaction-background: var(--brick-color-surface-raised);\n    --brick-menubar-trigger-open-background: var(--brick-color-accent-soft);\n    --brick-menubar-trigger-open-foreground: var(--brick-color-accent-text);\n    --brick-menubar-trigger-focus-ring: var(--brick-color-focus-ring);\n\n    display: inline-flex;\n    box-sizing: border-box;\n    max-inline-size: 100%;\n    align-items: stretch;\n    gap: var(--brick-menubar-gap);\n    padding: var(--brick-menubar-padding);\n    border: var(--brick-border-width) solid var(--brick-menubar-border);\n    border-radius: var(--brick-menubar-radius);\n    background: var(--brick-menubar-background);\n  }\n\n  .brick-menubar[data-orientation=\"vertical\"] { flex-direction: column; inline-size: fit-content; }\n  .brick-menubar[data-size=\"sm\"] { --brick-menubar-trigger-min-block-size: 2rem; --brick-menubar-trigger-padding-inline: var(--brick-space-2); }\n  .brick-menubar[data-size=\"lg\"] { --brick-menubar-trigger-min-block-size: 3rem; --brick-menubar-trigger-padding-inline: var(--brick-space-4); }\n\n  .brick-menubar__trigger {\n    display: inline-flex;\n    box-sizing: border-box;\n    min-block-size: var(--brick-menubar-trigger-min-block-size);\n    align-items: center;\n    justify-content: center;\n    padding-inline: var(--brick-menubar-trigger-padding-inline);\n    border: 0;\n    border-radius: var(--brick-menubar-trigger-radius);\n    background: transparent;\n    color: var(--brick-menubar-trigger-foreground);\n    font: inherit;\n    white-space: nowrap;\n    cursor: default;\n  }\n  .brick-menubar__trigger:is(:hover, :focus-visible) { background: var(--brick-menubar-trigger-interaction-background); }\n  .brick-menubar__trigger:focus-visible { outline: var(--brick-border-focus-width) solid var(--brick-menubar-trigger-focus-ring); outline-offset: var(--brick-border-focus-offset); }\n  .brick-menubar__trigger[data-state=\"open\"] { background: var(--brick-menubar-trigger-open-background); color: var(--brick-menubar-trigger-open-foreground); }\n  .brick-menubar__trigger[data-disabled] { color: var(--brick-color-text-muted); opacity: 0.65; }\n\n  .brick-menubar__content[data-state=\"closed\"] {\n    visibility: hidden;\n    transition: none;\n  }\n\n  :where(.brick-menubar__content, .brick-menubar__sub-content) {\n    --brick-action-menu-content-background: var(--brick-menubar-content-background, var(--brick-color-surface-overlay));\n    --brick-action-menu-content-foreground: var(--brick-menubar-content-foreground, var(--brick-color-text-primary));\n    --brick-action-menu-content-border: var(--brick-menubar-content-border, var(--brick-color-border-subtle));\n    --brick-action-menu-content-radius: var(--brick-menubar-content-radius, var(--brick-radius-overlay));\n    --brick-action-menu-content-shadow: var(--brick-menubar-content-shadow, var(--brick-shadow-floating));\n    --brick-action-menu-content-padding: var(--brick-menubar-content-padding, var(--brick-space-1));\n    --brick-action-menu-content-max-block-size: var(--brick-menubar-content-max-block-size, 20rem);\n    --brick-action-menu-content-z-index: var(--brick-layer-overlay);\n    --brick-action-menu-row-min-block-size: var(--brick-menubar-row-min-block-size, var(--brick-control-target-min));\n    --brick-action-menu-row-padding-inline: var(--brick-menubar-row-padding-inline, var(--brick-space-3));\n    --brick-action-menu-row-gap: var(--brick-menubar-row-gap, var(--brick-space-2));\n    --brick-action-menu-row-radius: var(--brick-menubar-row-radius, var(--brick-radius-control));\n    --brick-action-menu-row-foreground: var(--brick-menubar-row-foreground, var(--brick-color-text-primary));\n    --brick-action-menu-row-highlighted-background: var(--brick-menubar-row-highlighted-background, var(--brick-color-accent-soft));\n    --brick-action-menu-row-highlighted-foreground: var(--brick-menubar-row-highlighted-foreground, var(--brick-color-accent-text));\n    --brick-action-menu-description-foreground: var(--brick-menubar-description-foreground, var(--brick-color-text-secondary));\n    --brick-action-menu-shortcut-foreground: var(--brick-menubar-shortcut-foreground, var(--brick-color-text-muted));\n    --brick-action-menu-label-foreground: var(--brick-menubar-label-foreground, var(--brick-color-text-secondary));\n    --brick-action-menu-disabled-foreground: var(--brick-menubar-disabled-foreground, var(--brick-color-text-muted));\n    --brick-action-menu-danger-foreground: var(--brick-menubar-danger-foreground, var(--brick-color-danger-text));\n    --brick-action-menu-danger-background: var(--brick-menubar-danger-background, var(--brick-color-danger-soft));\n    --brick-action-menu-separator-color: var(--brick-menubar-separator-color, var(--brick-color-border-subtle));\n    --brick-action-menu-indicator-size: var(--brick-menubar-indicator-size, 1rem);\n    --brick-action-menu-focus-ring: var(--brick-menubar-focus-ring, var(--brick-color-focus-ring));\n    --brick-action-menu-motion-duration: var(--brick-menubar-motion-duration, var(--brick-motion-duration-fast));\n    --brick-action-menu-font-size: var(--brick-typography-control-md-font-size);\n    --brick-action-menu-line-height: var(--brick-typography-control-md-line-height);\n  }\n\n  @media (forced-colors: active) {\n    .brick-menubar { border-color: CanvasText; background: Canvas; color: CanvasText; }\n    .brick-menubar__trigger:focus-visible { outline-color: Highlight; }\n  }\n}\n"],"names":[]}