@dev-dga/css 0.7.0 → 0.8.1

package/dist/components/dropdown-menu.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-dropdown-menu{min-inline-size:192px;max-inline-size:320px;padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);z-index:50;outline:none;font-family:inherit}.ddga-dropdown-menu[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-dropdown-menu-in}.ddga-dropdown-menu[data-state=closed]{animation:80ms ease-in ddga-dropdown-menu-out}@keyframes ddga-dropdown-menu-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-dropdown-menu-out{0%{opacity:1}to{opacity:0}}.ddga-dropdown-menu--sm{font-size:var(--ddga-font-size-sm)}.ddga-dropdown-menu--md{font-size:var(--ddga-font-size-md)}.ddga-dropdown-menu__item{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-dropdown-menu__item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-dropdown-menu__item[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-dropdown-menu__item[data-destructive]{color:var(--ddga-color-destructive)}.ddga-dropdown-menu__item[data-destructive][data-highlighted]{background-color:var(--ddga-error-50)}.ddga-dropdown-menu__label{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;overflow:hidden}.ddga-dropdown-menu__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-dropdown-menu__icon>svg{block-size:1em;inline-size:1em}.ddga-dropdown-menu__shortcut{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-tertiary);letter-spacing:.04em;margin-inline-start:auto}.ddga-dropdown-menu__item--checkable{padding-inline-start:calc(var(--ddga-space-2) + 1.25em);position:relative}.ddga-dropdown-menu__indicator{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:50%;inset-inline-start:var(--ddga-space-2);transform:translateY(-50%)}.ddga-dropdown-menu__indicator-icon{block-size:.875em;inline-size:.875em}.ddga-dropdown-menu__radio-dot{border-radius:var(--ddga-radius-full);background-color:currentColor;block-size:.5em;inline-size:.5em;display:inline-block}.ddga-dropdown-menu__item--sub[data-state=open]{background-color:var(--ddga-color-muted)}.ddga-dropdown-menu__sub-chevron{block-size:1em;inline-size:1em;color:var(--ddga-text-tertiary);margin-inline-start:auto}[dir=rtl] .ddga-dropdown-menu__sub-chevron{transform:scaleX(-1)}.ddga-dropdown-menu__group-label{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-tertiary);text-transform:uppercase;letter-spacing:.04em}.ddga-dropdown-menu__separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}@media (forced-colors:active){.ddga-dropdown-menu{border:1px solid canvastext}.ddga-dropdown-menu__item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-dropdown-menu__separator{background-color:canvastext}}@media (prefers-reduced-motion:reduce){.ddga-dropdown-menu[data-state=open],.ddga-dropdown-menu[data-state=closed]{animation:none}}}
+@layer ddga-components{.ddga-dropdown-menu{min-inline-size:192px;max-inline-size:320px;padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);z-index:50;outline:none;font-family:inherit}.ddga-dropdown-menu[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-dropdown-menu-in}.ddga-dropdown-menu[data-state=closed]{animation:80ms ease-in ddga-dropdown-menu-out}@keyframes ddga-dropdown-menu-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-dropdown-menu-out{0%{opacity:1}to{opacity:0}}.ddga-dropdown-menu--sm{font-size:var(--ddga-font-size-sm)}.ddga-dropdown-menu--md{font-size:var(--ddga-font-size-base)}.ddga-dropdown-menu__item{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-dropdown-menu__item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-dropdown-menu__item[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-dropdown-menu__item[data-destructive]{color:var(--ddga-color-destructive)}.ddga-dropdown-menu__item[data-destructive][data-highlighted]{background-color:var(--ddga-error-50)}.ddga-dropdown-menu__label{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;overflow:hidden}.ddga-dropdown-menu__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-dropdown-menu__icon>svg{block-size:1em;inline-size:1em}.ddga-dropdown-menu__shortcut{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-tertiary);letter-spacing:.04em;margin-inline-start:auto}.ddga-dropdown-menu__item--checkable{padding-inline-start:calc(var(--ddga-space-2) + 1.25em);position:relative}.ddga-dropdown-menu__indicator{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:50%;inset-inline-start:var(--ddga-space-2);transform:translateY(-50%)}.ddga-dropdown-menu__indicator-icon{block-size:.875em;inline-size:.875em}.ddga-dropdown-menu__radio-dot{border-radius:var(--ddga-radius-full);background-color:currentColor;block-size:.5em;inline-size:.5em;display:inline-block}.ddga-dropdown-menu__item--sub[data-state=open]{background-color:var(--ddga-color-muted)}.ddga-dropdown-menu__sub-chevron{block-size:1em;inline-size:1em;color:var(--ddga-text-tertiary);margin-inline-start:auto}[dir=rtl] .ddga-dropdown-menu__sub-chevron{transform:scaleX(-1)}.ddga-dropdown-menu__group-label{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-tertiary);text-transform:uppercase;letter-spacing:.04em}[dir=rtl] .ddga-dropdown-menu__group-label{letter-spacing:normal;text-transform:none}[dir=rtl] .ddga-dropdown-menu__shortcut{letter-spacing:normal}.ddga-dropdown-menu__separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-dropdown-menu__item[data-destructive][data-highlighted]{color:var(--ddga-error-200,#fecdca);background-color:#d92d203d}@media (forced-colors:active){.ddga-dropdown-menu{border:1px solid canvastext}.ddga-dropdown-menu__item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-dropdown-menu__separator{background-color:canvastext}}@media (prefers-reduced-motion:reduce){.ddga-dropdown-menu[data-state=open],.ddga-dropdown-menu[data-state=closed]{animation:none}}}
 /*# sourceMappingURL=dropdown-menu.css.map */

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

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,wUAgBA,mGAGA,qFAIA,iIAUA,6DAWA,2DAGA,2DAMA,wUAiBA,qFAIA,6FAOA,gFAGA,oGAKA,iHAQA,sKASA,6DAKA,+IASA,+GAMA,sQAYA,yEAIA,yJAYA,yFAIA,yHAQA,gEAMA,oQAUA,sKASA,8BACE,gDAGA,2FAIA,4DAOF,uCACE","sources":["src/components/dropdown-menu.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Panel (Content / SubContent) ─── */\n\n  .ddga-dropdown-menu {\n    min-inline-size: 192px;\n    max-inline-size: 320px;\n    padding: var(--ddga-space-1);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-md);\n    font-family: inherit;\n    z-index: 50;\n    outline: none;\n  }\n\n  /* Enter/exit animations follow Radix data-state. Keep them subtle so menu\n     surfaces feel instantaneous (this isn't a Modal). */\n  .ddga-dropdown-menu[data-state='open'] {\n    animation: ddga-dropdown-menu-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-dropdown-menu[data-state='closed'] {\n    animation: ddga-dropdown-menu-out 80ms ease-in;\n  }\n\n  @keyframes ddga-dropdown-menu-in {\n    from {\n      opacity: 0;\n      transform: translateY(-2px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0) scale(1);\n    }\n  }\n  @keyframes ddga-dropdown-menu-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-dropdown-menu--sm {\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-dropdown-menu--md {\n    font-size: var(--ddga-font-size-md);\n  }\n\n  /* ─── Item (and CheckboxItem/RadioItem/SubTrigger share the base) ─── */\n\n  .ddga-dropdown-menu__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* Radix sets data-highlighted on the actively focused/hovered item — that's\n     our only \"focus ring\" since the menu manages focus internally. */\n  .ddga-dropdown-menu__item[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-dropdown-menu__item[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  /* Destructive: red text and a red-tinted hover. Tracks the destructive\n     family the rest of the system uses. */\n  .ddga-dropdown-menu__item[data-destructive] {\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-dropdown-menu__item[data-destructive][data-highlighted] {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* Inline pieces inside the row. */\n  .ddga-dropdown-menu__label {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .ddga-dropdown-menu__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    flex-shrink: 0;\n    color: var(--ddga-text-secondary);\n  }\n  .ddga-dropdown-menu__icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-dropdown-menu__shortcut {\n    margin-inline-start: auto;\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-text-tertiary);\n    letter-spacing: 0.04em;\n  }\n\n  /* ─── Indicator slot (Checkbox/Radio) ─── */\n\n  .ddga-dropdown-menu__item--checkable {\n    /* Reserve the indicator column even when unchecked so labels align. */\n    padding-inline-start: calc(var(--ddga-space-2) + 1.25em);\n    position: relative;\n  }\n\n  .ddga-dropdown-menu__indicator {\n    position: absolute;\n    inset-inline-start: var(--ddga-space-2);\n    inset-block-start: 50%;\n    transform: translateY(-50%);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-color-primary);\n  }\n  .ddga-dropdown-menu__indicator-icon {\n    inline-size: 0.875em;\n    block-size: 0.875em;\n  }\n  .ddga-dropdown-menu__radio-dot {\n    /* span is inline by default → inline-size/block-size are ignored. Force a\n       sized inline-block so the filled circle actually renders. */\n    display: inline-block;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: var(--ddga-radius-full);\n    background-color: currentColor;\n  }\n\n  /* ─── Submenu ─── */\n\n  .ddga-dropdown-menu__item--sub[data-state='open'] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-dropdown-menu__sub-chevron {\n    margin-inline-start: auto;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* Flip the sub-menu chevron in RTL — it should always point inline-end-ward. */\n  [dir='rtl'] .ddga-dropdown-menu__sub-chevron {\n    transform: scaleX(-1);\n  }\n\n  /* ─── Label + Separator ─── */\n\n  .ddga-dropdown-menu__group-label {\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-text-tertiary);\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n  }\n\n  .ddga-dropdown-menu__separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-1);\n    margin-inline: calc(var(--ddga-space-1) * -1);\n    background-color: var(--ddga-color-border);\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-dropdown-menu {\n      border: 1px solid CanvasText;\n    }\n    .ddga-dropdown-menu__item[data-highlighted] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-dropdown-menu__separator {\n      background-color: CanvasText;\n    }\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-dropdown-menu[data-state='open'],\n    .ddga-dropdown-menu[data-state='closed'] {\n      animation: none;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,wUAgBA,mGAGA,qFAIA,iIAUA,6DAWA,2DAGA,6DAMA,wUAiBA,qFAIA,6FAOA,gFAGA,oGAKA,iHAQA,sKASA,6DAKA,+IASA,+GAMA,sQAYA,yEAIA,yJAYA,yFAIA,yHAQA,gEAMA,oQAYA,qFAIA,8DAIA,sKAYA,+IAOA,8BACE,gDAGA,2FAIA,4DAOF,uCACE","sources":["src/components/dropdown-menu.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Panel (Content / SubContent) ─── */\n\n  .ddga-dropdown-menu {\n    min-inline-size: 192px;\n    max-inline-size: 320px;\n    padding: var(--ddga-space-1);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-md);\n    font-family: inherit;\n    z-index: 50;\n    outline: none;\n  }\n\n  /* Enter/exit animations follow Radix data-state. Keep them subtle so menu\n     surfaces feel instantaneous (this isn't a Modal). */\n  .ddga-dropdown-menu[data-state='open'] {\n    animation: ddga-dropdown-menu-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-dropdown-menu[data-state='closed'] {\n    animation: ddga-dropdown-menu-out 80ms ease-in;\n  }\n\n  @keyframes ddga-dropdown-menu-in {\n    from {\n      opacity: 0;\n      transform: translateY(-2px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0) scale(1);\n    }\n  }\n  @keyframes ddga-dropdown-menu-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-dropdown-menu--sm {\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-dropdown-menu--md {\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* ─── Item (and CheckboxItem/RadioItem/SubTrigger share the base) ─── */\n\n  .ddga-dropdown-menu__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* Radix sets data-highlighted on the actively focused/hovered item — that's\n     our only \"focus ring\" since the menu manages focus internally. */\n  .ddga-dropdown-menu__item[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-dropdown-menu__item[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  /* Destructive: red text and a red-tinted hover. Tracks the destructive\n     family the rest of the system uses. */\n  .ddga-dropdown-menu__item[data-destructive] {\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-dropdown-menu__item[data-destructive][data-highlighted] {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* Inline pieces inside the row. */\n  .ddga-dropdown-menu__label {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .ddga-dropdown-menu__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    flex-shrink: 0;\n    color: var(--ddga-text-secondary);\n  }\n  .ddga-dropdown-menu__icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-dropdown-menu__shortcut {\n    margin-inline-start: auto;\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-text-tertiary);\n    letter-spacing: 0.04em;\n  }\n\n  /* ─── Indicator slot (Checkbox/Radio) ─── */\n\n  .ddga-dropdown-menu__item--checkable {\n    /* Reserve the indicator column even when unchecked so labels align. */\n    padding-inline-start: calc(var(--ddga-space-2) + 1.25em);\n    position: relative;\n  }\n\n  .ddga-dropdown-menu__indicator {\n    position: absolute;\n    inset-inline-start: var(--ddga-space-2);\n    inset-block-start: 50%;\n    transform: translateY(-50%);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-color-primary);\n  }\n  .ddga-dropdown-menu__indicator-icon {\n    inline-size: 0.875em;\n    block-size: 0.875em;\n  }\n  .ddga-dropdown-menu__radio-dot {\n    /* span is inline by default → inline-size/block-size are ignored. Force a\n       sized inline-block so the filled circle actually renders. */\n    display: inline-block;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: var(--ddga-radius-full);\n    background-color: currentColor;\n  }\n\n  /* ─── Submenu ─── */\n\n  .ddga-dropdown-menu__item--sub[data-state='open'] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-dropdown-menu__sub-chevron {\n    margin-inline-start: auto;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* Flip the sub-menu chevron in RTL — it should always point inline-end-ward. */\n  [dir='rtl'] .ddga-dropdown-menu__sub-chevron {\n    transform: scaleX(-1);\n  }\n\n  /* ─── Label + Separator ─── */\n\n  .ddga-dropdown-menu__group-label {\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-text-tertiary);\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n  }\n  /* Protect Arabic cursive joining — drop the tracking + casing when RTL\n     (mirrors command.css). The shortcut hint is usually Latin but reset it\n     too for parity. */\n  [dir='rtl'] .ddga-dropdown-menu__group-label {\n    letter-spacing: normal;\n    text-transform: none;\n  }\n  [dir='rtl'] .ddga-dropdown-menu__shortcut {\n    letter-spacing: normal;\n  }\n\n  .ddga-dropdown-menu__separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-1);\n    margin-inline: calc(var(--ddga-space-1) * -1);\n    background-color: var(--ddga-color-border);\n  }\n\n  /* ─── Dark mode ─── */\n\n  /* The destructive-hover background uses the raw --ddga-error-50 tint\n     (near-white), which doesn't adapt in dark mode. Override with a translucent\n     red + a light-red foreground for contrast (mirrors alert.css / button.css). */\n  [data-theme='dark'] .ddga-dropdown-menu__item[data-destructive][data-highlighted] {\n    background-color: rgb(217 45 32 / 0.24);\n    color: var(--ddga-error-200, #fecdca);\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-dropdown-menu {\n      border: 1px solid CanvasText;\n    }\n    .ddga-dropdown-menu__item[data-highlighted] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-dropdown-menu__separator {\n      background-color: CanvasText;\n    }\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-dropdown-menu[data-state='open'],\n    .ddga-dropdown-menu[data-state='closed'] {\n      animation: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/file-upload.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-file-upload{color:var(--ddga-text-primary)}.ddga-file-upload__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-file-upload__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-file-upload__dropzone{justify-content:center;align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-6) var(--ddga-space-4);border:1px dashed var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:var(--ddga-color-background);text-align:center;cursor:pointer;flex-direction:column;transition:border-color .15s,background-color .15s,box-shadow .15s;display:flex}.ddga-file-upload__dropzone:hover{border-color:var(--ddga-color-ring);background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone:focus-within{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-file-upload__dropzone[data-dragging]{border-color:var(--ddga-color-primary);background-color:var(--ddga-color-muted);box-shadow:0 0 0 1px var(--ddga-color-primary);border-style:solid}.ddga-file-upload__dropzone--error{border-color:var(--ddga-color-error)}.ddga-file-upload__dropzone--error:focus-within{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-file-upload__dropzone[data-disabled]{cursor:not-allowed;opacity:.6;background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone[data-disabled]:hover{border-color:var(--ddga-color-input);border-style:dashed}.ddga-file-upload__icon{color:var(--ddga-color-muted-foreground);font-size:1.5rem}.ddga-file-upload__hint{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary)}.ddga-file-upload__input{clip:rect(0 0 0 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.ddga-file-upload__list{gap:var(--ddga-space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.ddga-file-upload__item{align-items:center;gap:var(--ddga-space-3);padding:var(--ddga-space-2) var(--ddga-space-3);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);display:flex}.ddga-file-upload__item-icon{color:var(--ddga-color-muted-foreground);flex:none;font-size:1.125rem;display:inline-flex}.ddga-file-upload__item[data-status=success] .ddga-file-upload__item-icon{color:var(--ddga-color-success)}.ddga-file-upload__item[data-status=error] .ddga-file-upload__item-icon{color:var(--ddga-color-error)}.ddga-file-upload__item-main{gap:var(--ddga-space-1);flex-direction:column;flex:auto;min-inline-size:0;display:flex}.ddga-file-upload__item-head{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-file-upload__item-name{text-overflow:ellipsis;white-space:nowrap;font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);overflow:hidden}.ddga-file-upload__item-meta{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-secondary);font-variant-numeric:tabular-nums;flex:none}.ddga-file-upload__item-error{font-size:var(--ddga-font-size-xs);color:var(--ddga-color-error)}.ddga-file-upload__item-remove{flex:none}}
+@layer ddga-components{.ddga-file-upload{color:var(--ddga-text-primary)}.ddga-file-upload__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-file-upload__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-file-upload__dropzone{justify-content:center;align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-6) var(--ddga-space-4);border:1px dashed var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:var(--ddga-color-background);text-align:center;cursor:pointer;flex-direction:column;transition:border-color .15s,background-color .15s,box-shadow .15s;display:flex}.ddga-file-upload__dropzone:hover{border-color:var(--ddga-color-ring);background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone:focus-within{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-file-upload__dropzone[data-dragging]{border-color:var(--ddga-color-primary);background-color:var(--ddga-color-muted);box-shadow:0 0 0 1px var(--ddga-color-primary);border-style:solid}.ddga-file-upload__dropzone--error{border-color:var(--ddga-color-error)}.ddga-file-upload__dropzone--error:focus-within{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-file-upload__dropzone[data-disabled]{cursor:not-allowed;opacity:.6;background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone[data-disabled]:hover{border-color:var(--ddga-color-input);border-style:dashed}.ddga-file-upload__icon{color:var(--ddga-color-muted-foreground);font-size:1.5rem}.ddga-file-upload__hint{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary)}.ddga-file-upload__input{clip:rect(0 0 0 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.ddga-file-upload__list{gap:var(--ddga-space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.ddga-file-upload__item{align-items:center;gap:var(--ddga-space-3);padding:var(--ddga-space-2) var(--ddga-space-3);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);display:flex}.ddga-file-upload__item-icon{color:var(--ddga-color-muted-foreground);flex:none;font-size:1.125rem;display:inline-flex}.ddga-file-upload__item[data-status=success] .ddga-file-upload__item-icon{color:var(--ddga-color-success)}.ddga-file-upload__item[data-status=error] .ddga-file-upload__item-icon{color:var(--ddga-color-error)}.ddga-file-upload__item-main{gap:var(--ddga-space-1);flex-direction:column;flex:auto;min-inline-size:0;display:flex}.ddga-file-upload__item-head{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-file-upload__item-name{text-overflow:ellipsis;white-space:nowrap;font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);overflow:hidden}.ddga-file-upload__item-meta{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-secondary);font-variant-numeric:tabular-nums;flex:none}.ddga-file-upload__item-error{font-size:var(--ddga-font-size-xs);color:var(--ddga-color-error)}.ddga-file-upload__item-remove{flex:none}@media (forced-colors:active){.ddga-file-upload__dropzone:focus-within,.ddga-file-upload__dropzone[data-dragging]{outline-offset:2px;outline:2px solid highlight}}}
 /*# sourceMappingURL=file-upload.css.map */

package/dist/components/file-upload.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAIE,iDAMA,sJAOA,sFAOA,iZAkBA,+GAMA,yHAMA,6LAOA,wEAIA,kIAKA,kHAMA,0GAKA,kFAKA,4FAOA,+JAcA,sHASA,4PAUA,uHAOA,0GAIA,sGAIA,oHAQA,qHAOA,yJAQA,6IAOA,+FAKA","sources":["src/components/file-upload.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only FileUpload-specific styles live here. */\n\n  .ddga-file-upload {\n    color: var(--ddga-text-primary);\n  }\n\n  /* ─── Label ─── */\n\n  .ddga-file-upload__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-file-upload__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Drop zone ─── */\n\n  .ddga-file-upload__dropzone {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-6) var(--ddga-space-4);\n    border: 1px dashed var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    background-color: var(--ddga-color-background);\n    text-align: center;\n    cursor: pointer;\n    transition:\n      border-color 150ms ease,\n      background-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  .ddga-file-upload__dropzone:hover {\n    border-color: var(--ddga-color-ring);\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* Focus ring driven by the (visually hidden) input inside the zone. */\n  .ddga-file-upload__dropzone:focus-within {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  /* Active drag-over state. */\n  .ddga-file-upload__dropzone[data-dragging] {\n    border-color: var(--ddga-color-primary);\n    border-style: solid;\n    background-color: var(--ddga-color-muted);\n    box-shadow: 0 0 0 1px var(--ddga-color-primary);\n  }\n\n  .ddga-file-upload__dropzone--error {\n    border-color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__dropzone--error:focus-within {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] {\n    cursor: not-allowed;\n    opacity: 0.6;\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled]:hover {\n    border-color: var(--ddga-color-input);\n    border-style: dashed;\n  }\n\n  .ddga-file-upload__icon {\n    font-size: 1.5rem;\n    color: var(--ddga-color-muted-foreground);\n  }\n\n  .ddga-file-upload__hint {\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-secondary);\n  }\n\n  /* Visually hidden, but kept focusable so keyboard users can tab to it and\n     press Space/Enter to open the picker. (Not display:none / tabindex=-1.) */\n  .ddga-file-upload__input {\n    position: absolute;\n    inline-size: 1px;\n    block-size: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0 0 0 0);\n    white-space: nowrap;\n    border: 0;\n  }\n\n  /* ─── File list ─── */\n\n  .ddga-file-upload__list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .ddga-file-upload__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    padding: var(--ddga-space-2) var(--ddga-space-3);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n  }\n\n  .ddga-file-upload__item-icon {\n    display: inline-flex;\n    flex: none;\n    font-size: 1.125rem;\n    color: var(--ddga-color-muted-foreground);\n  }\n\n  .ddga-file-upload__item[data-status='success'] .ddga-file-upload__item-icon {\n    color: var(--ddga-color-success);\n  }\n\n  .ddga-file-upload__item[data-status='error'] .ddga-file-upload__item-icon {\n    color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__item-main {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    flex: 1 1 auto;\n    min-inline-size: 0;\n  }\n\n  .ddga-file-upload__item-head {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-file-upload__item-name {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-file-upload__item-meta {\n    flex: none;\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-text-secondary);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .ddga-file-upload__item-error {\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__item-remove {\n    flex: none;\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAIE,iDAMA,sJAOA,sFAOA,iZAkBA,+GAMA,yHAMA,6LAOA,wEAIA,kIAKA,kHAMA,0GAKA,kFAKA,4FAOA,+JAcA,sHASA,4PAUA,uHAOA,0GAIA,sGAIA,oHAQA,qHAOA,yJAQA,6IAOA,+FAKA,yCASA,8BACE","sources":["src/components/file-upload.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only FileUpload-specific styles live here. */\n\n  .ddga-file-upload {\n    color: var(--ddga-text-primary);\n  }\n\n  /* ─── Label ─── */\n\n  .ddga-file-upload__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-file-upload__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Drop zone ─── */\n\n  .ddga-file-upload__dropzone {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-6) var(--ddga-space-4);\n    border: 1px dashed var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    background-color: var(--ddga-color-background);\n    text-align: center;\n    cursor: pointer;\n    transition:\n      border-color 150ms ease,\n      background-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  .ddga-file-upload__dropzone:hover {\n    border-color: var(--ddga-color-ring);\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* Focus ring driven by the (visually hidden) input inside the zone. */\n  .ddga-file-upload__dropzone:focus-within {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  /* Active drag-over state. */\n  .ddga-file-upload__dropzone[data-dragging] {\n    border-color: var(--ddga-color-primary);\n    border-style: solid;\n    background-color: var(--ddga-color-muted);\n    box-shadow: 0 0 0 1px var(--ddga-color-primary);\n  }\n\n  .ddga-file-upload__dropzone--error {\n    border-color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__dropzone--error:focus-within {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] {\n    cursor: not-allowed;\n    opacity: 0.6;\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled]:hover {\n    border-color: var(--ddga-color-input);\n    border-style: dashed;\n  }\n\n  .ddga-file-upload__icon {\n    font-size: 1.5rem;\n    color: var(--ddga-color-muted-foreground);\n  }\n\n  .ddga-file-upload__hint {\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-secondary);\n  }\n\n  /* Visually hidden, but kept focusable so keyboard users can tab to it and\n     press Space/Enter to open the picker. (Not display:none / tabindex=-1.) */\n  .ddga-file-upload__input {\n    position: absolute;\n    inline-size: 1px;\n    block-size: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0 0 0 0);\n    white-space: nowrap;\n    border: 0;\n  }\n\n  /* ─── File list ─── */\n\n  .ddga-file-upload__list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .ddga-file-upload__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    padding: var(--ddga-space-2) var(--ddga-space-3);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n  }\n\n  .ddga-file-upload__item-icon {\n    display: inline-flex;\n    flex: none;\n    font-size: 1.125rem;\n    color: var(--ddga-color-muted-foreground);\n  }\n\n  .ddga-file-upload__item[data-status='success'] .ddga-file-upload__item-icon {\n    color: var(--ddga-color-success);\n  }\n\n  .ddga-file-upload__item[data-status='error'] .ddga-file-upload__item-icon {\n    color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__item-main {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    flex: 1 1 auto;\n    min-inline-size: 0;\n  }\n\n  .ddga-file-upload__item-head {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-file-upload__item-name {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    font-size: var(--ddga-font-size-sm);\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-file-upload__item-meta {\n    flex: none;\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-text-secondary);\n    font-variant-numeric: tabular-nums;\n  }\n\n  .ddga-file-upload__item-error {\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-color-error);\n  }\n\n  .ddga-file-upload__item-remove {\n    flex: none;\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  /* The focus + drag-active indicators are box-shadow rings, which forced-colors\n     neutralizes — restore them as a system-colored outline so keyboard focus and\n     the active drop target stay visible. */\n  @media (forced-colors: active) {\n    .ddga-file-upload__dropzone:focus-within,\n    .ddga-file-upload__dropzone[data-dragging] {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/input-otp.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-input-otp__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-input-otp__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-input-otp{color:var(--ddga-text-primary);display:inline-flex;position:relative}.ddga-input-otp__input{color:#0000;caret-color:#0000;cursor:text;-webkit-user-select:none;user-select:none;z-index:1;background:0 0;border:0;block-size:100%;inline-size:100%;margin:0;padding:0;position:absolute;inset:0}.ddga-input-otp__input:focus{outline:none}.ddga-input-otp__input:disabled{cursor:not-allowed}.ddga-input-otp__row,.ddga-input-otp__group{align-items:center;gap:.5rem;display:flex}.ddga-input-otp__slot{border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:var(--ddga-color-background);color:var(--ddga-text-primary);font-variant-numeric:tabular-nums;justify-content:center;align-items:center;transition:border-color .15s,box-shadow .15s;display:flex;position:relative}.ddga-input-otp__slot[data-active]{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);z-index:1}.ddga-input-otp--sm .ddga-input-otp__slot{block-size:2rem;inline-size:2rem;font-size:var(--ddga-font-size-base)}.ddga-input-otp--md .ddga-input-otp__slot{block-size:2.75rem;inline-size:2.75rem;font-size:var(--ddga-font-size-lg)}.ddga-input-otp--lg .ddga-input-otp__slot{block-size:3.25rem;inline-size:3.25rem;font-size:var(--ddga-font-size-xl)}.ddga-input-otp__caret{background-color:var(--ddga-text-primary);block-size:1.125em;inline-size:1px;animation:1s step-end infinite ddga-input-otp-caret;position:absolute}@keyframes ddga-input-otp-caret{0%,to{opacity:1}50%{opacity:0}}.ddga-input-otp__separator{color:var(--ddga-text-tertiary);align-items:center;display:flex}.ddga-input-otp__separator-dash{background-color:var(--ddga-color-border);border-radius:9999px;block-size:2px;inline-size:.75rem}.ddga-input-otp--error .ddga-input-otp__slot{border-color:var(--ddga-color-error)}.ddga-input-otp--error .ddga-input-otp__slot[data-active]{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-input-otp:has(input:disabled){cursor:not-allowed;opacity:.6}.ddga-input-otp:has(input:disabled) .ddga-input-otp__slot{background-color:var(--ddga-color-muted)}@media (prefers-reduced-motion:reduce){.ddga-input-otp__slot{transition:none}.ddga-input-otp__caret{animation:none}}@media (forced-colors:active){.ddga-input-otp__slot{border:1px solid canvastext}.ddga-input-otp__slot[data-active]{outline-offset:1px;outline:2px solid highlight}.ddga-input-otp__caret{background-color:canvastext}}}
+/*# sourceMappingURL=input-otp.css.map */

package/dist/components/input-otp.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAQE,oJAOA,oFAOA,qFAQA,2NAsBA,0CAIA,mDAMA,sFAcA,wUAgBA,6HAQA,gHAKA,oHAKA,oHAQA,0KAQA,+DAYA,2FAMA,iIASA,kFAGA,4IAOA,kEAIA,mGAMA,uCACE,sCAGA,uCAOF,8BACE,kDAGA,kFAIA","sources":["src/components/input-otp.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Structure: a single real <input> (.ddga-input-otp__input)\n     overlays the container transparently and owns focus/typing/paste/autofill;\n     the slot row (.ddga-input-otp__row) is the decorative, aria-hidden display. */\n\n  /* ─── Label ─── */\n\n  .ddga-input-otp__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-input-otp__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Container (sizes to the slot row; anchors the overlay input) ─── */\n\n  .ddga-input-otp {\n    position: relative;\n    display: inline-flex;\n    color: var(--ddga-text-primary);\n  }\n\n  /* ─── Overlay input (the real, transparent control) ─── */\n\n  .ddga-input-otp__input {\n    position: absolute;\n    inset: 0;\n    inline-size: 100%;\n    block-size: 100%;\n    margin: 0;\n    padding: 0;\n    border: 0;\n    /* Transparent text + caret: the slots render the value, not the input. */\n    color: transparent;\n    background: transparent;\n    caret-color: transparent;\n    cursor: text;\n    /* Suppress native selection UI — on iOS/Android the selection highlight +\n       handles render over the transparent text and break the slot illusion.\n       Typing and programmatic caret moves are unaffected. */\n    -webkit-user-select: none;\n    user-select: none;\n    /* On top of the slots so a click anywhere focuses it. */\n    z-index: 1;\n  }\n\n  .ddga-input-otp__input:focus {\n    outline: none;\n  }\n\n  .ddga-input-otp__input:disabled {\n    cursor: not-allowed;\n  }\n\n  /* ─── Slot row + groups (forced LTR in the markup) ─── */\n\n  .ddga-input-otp__row {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n  }\n\n  .ddga-input-otp__group {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n  }\n\n  /* ─── Slot ─── */\n\n  .ddga-input-otp__slot {\n    position: relative;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-text-primary);\n    font-variant-numeric: tabular-nums;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  /* The active slot (focused caret position) gets the ring. */\n  .ddga-input-otp__slot[data-active] {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n    z-index: 1;\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-input-otp--sm .ddga-input-otp__slot {\n    inline-size: 2rem;\n    block-size: 2rem;\n    font-size: var(--ddga-font-size-base);\n  }\n  .ddga-input-otp--md .ddga-input-otp__slot {\n    inline-size: 2.75rem;\n    block-size: 2.75rem;\n    font-size: var(--ddga-font-size-lg);\n  }\n  .ddga-input-otp--lg .ddga-input-otp__slot {\n    inline-size: 3.25rem;\n    block-size: 3.25rem;\n    font-size: var(--ddga-font-size-xl);\n  }\n\n  /* ─── Fake caret (active, empty slot) ─── */\n\n  .ddga-input-otp__caret {\n    position: absolute;\n    inline-size: 1px;\n    block-size: 1.125em;\n    background-color: var(--ddga-text-primary);\n    animation: ddga-input-otp-caret 1s step-end infinite;\n  }\n\n  @keyframes ddga-input-otp-caret {\n    0%,\n    100% {\n      opacity: 1;\n    }\n    50% {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Separator (between groups) ─── */\n\n  .ddga-input-otp__separator {\n    display: flex;\n    align-items: center;\n    color: var(--ddga-text-tertiary);\n  }\n\n  .ddga-input-otp__separator-dash {\n    inline-size: 0.75rem;\n    block-size: 2px;\n    background-color: var(--ddga-color-border);\n    border-radius: 9999px;\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-input-otp--error .ddga-input-otp__slot {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-input-otp--error .ddga-input-otp__slot[data-active] {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  /* ─── Disabled ─── */\n\n  .ddga-input-otp:has(input:disabled) {\n    cursor: not-allowed;\n    opacity: 0.6;\n  }\n  .ddga-input-otp:has(input:disabled) .ddga-input-otp__slot {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-input-otp__slot {\n      transition: none;\n    }\n    .ddga-input-otp__caret {\n      animation: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-input-otp__slot {\n      border: 1px solid CanvasText;\n    }\n    .ddga-input-otp__slot[data-active] {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-input-otp__caret {\n      background-color: CanvasText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/link.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-link{color:var(--ddga-color-primary);font-family:inherit;font-size:inherit;border-radius:var(--ddga-radius-sm);text-underline-offset:2px;cursor:pointer;transition:color .15s,text-decoration-color .15s}.ddga-link:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-link--default{text-decoration:underline}.ddga-link--default:hover{color:var(--ddga-color-primary-hover)}.ddga-link--default:active{color:var(--ddga-color-primary-active)}.ddga-link--subtle{color:var(--ddga-text-secondary);text-decoration:none}.ddga-link--subtle:hover{color:var(--ddga-color-primary);text-decoration:underline}.ddga-link--subtle:active{color:var(--ddga-color-primary-active)}.ddga-link--standalone{align-items:center;gap:var(--ddga-space-1);font-weight:500;text-decoration:none;display:inline-flex}.ddga-link--standalone:hover{color:var(--ddga-color-primary-hover);text-decoration:underline}.ddga-link--standalone:active{color:var(--ddga-color-primary-active)}.ddga-link__icon{flex-shrink:0;align-items:center;display:inline-flex}.ddga-link__icon>svg{block-size:1em;inline-size:1em}.ddga-link--default [data-slot=link-start-icon],.ddga-link--subtle [data-slot=link-start-icon]{vertical-align:middle;margin-inline-end:.2em}.ddga-link--default [data-slot=link-end-icon],.ddga-link--default [data-slot=link-external-icon],.ddga-link--subtle [data-slot=link-end-icon],.ddga-link--subtle [data-slot=link-external-icon]{vertical-align:middle;margin-inline-start:.2em}@media (prefers-reduced-motion:reduce){.ddga-link{transition:none}}@media (forced-colors:active){.ddga-link,.ddga-link--default,.ddga-link--subtle,.ddga-link--standalone,.ddga-link--default:hover,.ddga-link--subtle:hover,.ddga-link--standalone:hover{color:linktext}.ddga-link:focus-visible{outline-offset:2px;outline:2px solid highlight}}}
+/*# sourceMappingURL=link.css.map */

package/dist/components/link.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAOE,+MAYA,kFASA,8CAIA,gEAIA,kEAMA,yEAKA,mFAKA,iEAMA,2HAQA,6FAKA,qEAMA,sEAMA,oDAQA,4IAMA,+OAUA,uCACE,4BAOF,8BACE,wKAWA","sources":["src/components/link.css"],"sourcesContent":["@layer ddga-components {\n  /* Styled <a> text-link primitive. Three visual variants on one axis\n     (default / subtle / standalone); the `external` affordance is orthogonal\n     (handled in the React layer + the __icon--external element). Size is NOT\n     a variant   links inherit font-size from surrounding text and scale their\n     icons in `em`. Dark mode needs no overrides (semantic tokens adapt). */\n\n  .ddga-link {\n    color: var(--ddga-color-primary);\n    font-family: inherit;\n    font-size: inherit;\n    border-radius: var(--ddga-radius-sm);\n    text-underline-offset: 2px;\n    cursor: pointer;\n    transition:\n      color 150ms ease,\n      text-decoration-color 150ms ease;\n  }\n\n  .ddga-link:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  /* ─── default   inline prose link, always underlined ─── */\n  /* Underline is permanent: color alone fails WCAG 1.4.1 for a link sitting\n     inside a block of text. */\n\n  .ddga-link--default {\n    text-decoration: underline;\n  }\n\n  .ddga-link--default:hover {\n    color: var(--ddga-color-primary-hover);\n  }\n\n  .ddga-link--default:active {\n    color: var(--ddga-color-primary-active);\n  }\n\n  /* ─── subtle   chrome link (footers, meta rows), underline on hover ─── */\n\n  .ddga-link--subtle {\n    color: var(--ddga-text-secondary);\n    text-decoration: none;\n  }\n\n  .ddga-link--subtle:hover {\n    color: var(--ddga-color-primary);\n    text-decoration: underline;\n  }\n\n  .ddga-link--subtle:active {\n    color: var(--ddga-color-primary-active);\n  }\n\n  /* ─── standalone   block CTA, icon-friendly ─── */\n\n  .ddga-link--standalone {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    font-weight: 500;\n    text-decoration: none;\n  }\n\n  .ddga-link--standalone:hover {\n    color: var(--ddga-color-primary-hover);\n    text-decoration: underline;\n  }\n\n  .ddga-link--standalone:active {\n    color: var(--ddga-color-primary-active);\n  }\n\n  /* ─── Icons ─── */\n\n  .ddga-link__icon {\n    display: inline-flex;\n    align-items: center;\n    flex-shrink: 0;\n  }\n\n  .ddga-link__icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  /* Inline variants (default/subtle) don't establish a flex gap, so give icons\n     breathing room from the text via logical margins (RTL-safe). standalone\n     uses `gap` and needs none. */\n  .ddga-link--default [data-slot='link-start-icon'],\n  .ddga-link--subtle [data-slot='link-start-icon'] {\n    margin-inline-end: 0.2em;\n    vertical-align: middle;\n  }\n\n  .ddga-link--default [data-slot='link-end-icon'],\n  .ddga-link--default [data-slot='link-external-icon'],\n  .ddga-link--subtle [data-slot='link-end-icon'],\n  .ddga-link--subtle [data-slot='link-external-icon'] {\n    margin-inline-start: 0.2em;\n    vertical-align: middle;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-link {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-link,\n    .ddga-link--default,\n    .ddga-link--subtle,\n    .ddga-link--standalone {\n      color: LinkText;\n    }\n    .ddga-link--default:hover,\n    .ddga-link--subtle:hover,\n    .ddga-link--standalone:hover {\n      color: LinkText;\n    }\n    .ddga-link:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/list.css

@@ -0,0 +1,2 @@
+@counter-style ddga-arabic-abjad{system:fixed;symbols:"ا" "ب" "ج" "د" "ه‍" "و" "ز" "ح" "ط" "ي" "ك" "ل" "م" "ن" "س" "ع" "ف" "ص" "ق" "ر" "ش" "ت" "ث" "خ" "ذ" "ض" "ظ" "غ";suffix:". "}@layer ddga-components{.ddga-list{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);margin:0;padding:0}.ddga-list__item{color:inherit}.ddga-list--plain{list-style:none}.ddga-list--plain .ddga-list__item{align-items:center;gap:var(--ddga-space-3);padding-block:var(--ddga-space-2);display:flex}.ddga-list--bulleted,.ddga-list--numbered,.ddga-list--lettered{padding-inline-start:var(--ddga-space-5)}.ddga-list--bulleted{list-style:outside}.ddga-list--numbered{list-style:decimal}.ddga-list--lettered{list-style:lower-alpha}.ddga-list--bulleted .ddga-list__item,.ddga-list--numbered .ddga-list__item,.ddga-list--lettered .ddga-list__item{padding-block:var(--ddga-space-1);line-height:1.5;display:list-item}.ddga-list--bulleted .ddga-list__item::marker{color:var(--ddga-text-tertiary)}.ddga-list--numbered .ddga-list__item::marker{color:var(--ddga-text-tertiary)}.ddga-list--lettered .ddga-list__item::marker{color:var(--ddga-text-tertiary)}[dir=rtl] .ddga-list--numbered{list-style-type:arabic-indic}[dir=rtl] .ddga-list--lettered{list-style-type:ddga-arabic-abjad}.ddga-list__icon{color:var(--ddga-text-tertiary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-list__icon svg{flex-shrink:0}.ddga-list__content{gap:var(--ddga-space-1);flex-direction:column;flex:auto;min-inline-size:0;display:flex}.ddga-list__primary{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);line-height:1.4}.ddga-list__secondary{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-list__action{align-items:center;gap:var(--ddga-space-2);color:var(--ddga-text-secondary);flex-shrink:0;margin-inline-start:auto;display:inline-flex}.ddga-list--divided .ddga-list__item{border-block-end:1px solid var(--ddga-color-border)}.ddga-list--divided .ddga-list__item:last-child{border-block-end:0}}
+/*# sourceMappingURL=list.css.map */

package/dist/components/list.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAKA,iNAQA,uBAOE,kGAOA,+BAMA,kCAIA,6HASA,wGAOA,wCAMA,wCAIA,4CAIA,sLAQA,8EAAA,8EAAA,8EASA,4DAIA,iEAMA,6HASA,mCAIA,2GAUA,8GAMA,0GAMA,0JAaA,yFAGA","sources":["src/components/list.css"],"sourcesContent":["/* Arabic abjad alphabetic counter — أ ب ج … in the classical abjad order.\n   Defined explicitly because, unlike `arabic-indic`, it is NOT natively\n   supported across browsers. Symbols are the exact W3C \"Ready-made Counter\n   Styles\" sequence (note `\\647\\200D` = HEH + ZWJ so it joins correctly).\n   Counter-style names are global, so this lives outside the cascade layer. */\n@counter-style ddga-arabic-abjad {\n  system: fixed;\n  symbols: '\\627' '\\628' '\\62C' '\\62F' '\\647\\200D' '\\648' '\\632' '\\62D' '\\637' '\\64A' '\\643' '\\644'\n    '\\645' '\\646' '\\633' '\\639' '\\641' '\\635' '\\642' '\\631' '\\634' '\\62A' '\\62B' '\\62E' '\\630'\n    '\\636' '\\638' '\\63A';\n  suffix: '. ';\n}\n\n@layer ddga-components {\n  /* Presentational content list. Layout cascades from the root variant to the\n     items via descendant selectors (DescriptionList / Timeline technique).\n     Logical properties keep markers, padding and the trailing action on the\n     correct side in RTL. Colours use semantic tokens, so dark mode adapts on\n     its own; no coloured backgrounds → no forced-colors block needed. */\n\n  .ddga-list {\n    margin: 0;\n    padding: 0;\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-base);\n  }\n\n  .ddga-list__item {\n    color: inherit;\n  }\n\n  /* ─── plain: no markers, flex rows (icon / content / action) ─── */\n\n  .ddga-list--plain {\n    list-style: none;\n  }\n\n  .ddga-list--plain .ddga-list__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    padding-block: var(--ddga-space-2);\n  }\n\n  /* ─── bulleted / numbered / lettered: native ::marker on a list-item box ─── */\n\n  .ddga-list--bulleted,\n  .ddga-list--numbered,\n  .ddga-list--lettered {\n    /* Room for the marker on the inline-start side. */\n    padding-inline-start: var(--ddga-space-5);\n  }\n\n  .ddga-list--bulleted {\n    list-style: disc;\n  }\n\n  /* Ordered markers are direction-localized: Latin in LTR, Arabic in RTL —\n     the [dir='rtl'] overrides below swap the counter style. */\n  .ddga-list--numbered {\n    list-style: decimal;\n  }\n\n  .ddga-list--lettered {\n    list-style: lower-alpha;\n  }\n\n  .ddga-list--bulleted .ddga-list__item,\n  .ddga-list--numbered .ddga-list__item,\n  .ddga-list--lettered .ddga-list__item {\n    display: list-item;\n    padding-block: var(--ddga-space-1);\n    line-height: 1.5;\n  }\n\n  .ddga-list--bulleted .ddga-list__item::marker,\n  .ddga-list--numbered .ddga-list__item::marker,\n  .ddga-list--lettered .ddga-list__item::marker {\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* ─── RTL: localize ordered markers to Arabic counter styles ───\n     arabic-indic (١ ٢ ٣) is natively supported; arabic-abjad (أ ب ج) uses the\n     @counter-style defined above. Logical padding already flips the side. */\n  [dir='rtl'] .ddga-list--numbered {\n    list-style-type: arabic-indic;\n  }\n\n  [dir='rtl'] .ddga-list--lettered {\n    list-style-type: ddga-arabic-abjad;\n  }\n\n  /* ─── Slots ─── */\n\n  .ddga-list__icon {\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* Block-level SVGs (see reset) must not flex-stretch into a tall icon. */\n  .ddga-list__icon svg {\n    flex-shrink: 0;\n  }\n\n  .ddga-list__content {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    /* Let the content column shrink so long text truncates rather than\n       shoving the action slot off the row. */\n    min-inline-size: 0;\n    flex: 1 1 auto;\n  }\n\n  .ddga-list__primary {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1.4;\n  }\n\n  .ddga-list__secondary {\n    color: var(--ddga-text-secondary);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-list__action {\n    /* Push to the inline-end edge; stays correct under RTL via the logical\n       margin. */\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    flex-shrink: 0;\n    margin-inline-start: auto;\n    color: var(--ddga-text-secondary);\n  }\n\n  /* ─── Dividers between items ─── */\n\n  .ddga-list--divided .ddga-list__item {\n    border-block-end: 1px solid var(--ddga-color-border);\n  }\n  .ddga-list--divided .ddga-list__item:last-child {\n    border-block-end: 0;\n  }\n}\n"],"names":[]}

package/dist/components/menubar.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-menubar{align-items:center;gap:var(--ddga-space-1);padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);font-family:inherit;display:flex}.ddga-menubar__trigger{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-md);font-weight:var(--ddga-font-weight-medium);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border:1px solid #0000;outline:none;align-items:center;transition:background-color .12s,border-color .12s,color .12s;display:inline-flex;position:relative}.ddga-menubar__trigger:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-menubar__trigger[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-menubar__trigger--default:after{content:"";inset-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-full);background-color:#0000;block-size:2px;transition:background-color .12s;position:absolute;inset-block-end:2px}.ddga-menubar__trigger--default[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar__trigger--default[data-state=open]{background-color:var(--ddga-color-muted);color:var(--ddga-color-primary)}.ddga-menubar__trigger--default[data-state=open]:after{background-color:var(--ddga-color-primary)}.ddga-menubar__trigger--outline{border-color:var(--ddga-color-border)}.ddga-menubar__trigger--outline[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar__trigger--outline[data-state=open]{border-color:var(--ddga-color-primary);color:var(--ddga-color-primary)}.ddga-menubar-menu{min-inline-size:192px;max-inline-size:320px;padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);z-index:50;outline:none;font-family:inherit}.ddga-menubar-menu[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-menubar-menu-in}.ddga-menubar-menu[data-state=closed]{animation:80ms ease-in ddga-menubar-menu-out}@keyframes ddga-menubar-menu-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-menubar-menu-out{0%{opacity:1}to{opacity:0}}.ddga-menubar-menu--sm{font-size:var(--ddga-font-size-sm)}.ddga-menubar-menu--md{font-size:var(--ddga-font-size-md)}.ddga-menubar-menu__item{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-menubar-menu__item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar-menu__item[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-menubar-menu__item[data-destructive]{color:var(--ddga-color-destructive)}.ddga-menubar-menu__item[data-destructive][data-highlighted]{background-color:var(--ddga-error-50)}.ddga-menubar-menu__label{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;overflow:hidden}.ddga-menubar-menu__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-menubar-menu__icon>svg{block-size:1em;inline-size:1em}.ddga-menubar-menu__shortcut{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-tertiary);letter-spacing:.04em;margin-inline-start:auto}.ddga-menubar-menu__item--checkable{padding-inline-start:calc(var(--ddga-space-2) + 1.25em);position:relative}.ddga-menubar-menu__indicator{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:50%;inset-inline-start:var(--ddga-space-2);transform:translateY(-50%)}.ddga-menubar-menu__indicator-icon{block-size:.875em;inline-size:.875em}.ddga-menubar-menu__radio-dot{border-radius:var(--ddga-radius-full);background-color:currentColor;block-size:.5em;inline-size:.5em;display:inline-block}.ddga-menubar-menu__item--sub[data-state=open]{background-color:var(--ddga-color-muted)}.ddga-menubar-menu__sub-chevron{block-size:1em;inline-size:1em;color:var(--ddga-text-tertiary);margin-inline-start:auto}[dir=rtl] .ddga-menubar-menu__sub-chevron{transform:scaleX(-1)}.ddga-menubar-menu__group-label{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-tertiary);text-transform:uppercase;letter-spacing:.04em}.ddga-menubar-menu__separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}@media (forced-colors:active){.ddga-menubar{border:1px solid canvastext}.ddga-menubar__trigger[data-highlighted],.ddga-menubar__trigger[data-state=open]{color:highlighttext;background-color:highlight}.ddga-menubar__trigger:focus-visible{outline-offset:2px;outline:2px solid highlight}.ddga-menubar-menu{border:1px solid canvastext}.ddga-menubar-menu__item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-menubar-menu__separator{background-color:canvastext}}@media (prefers-reduced-motion:reduce){.ddga-menubar__trigger,.ddga-menubar__trigger--default:after{transition:none}.ddga-menubar-menu[data-state=open],.ddga-menubar-menu[data-state=closed]{animation:none}}}
+@layer ddga-components{.ddga-menubar{align-items:center;gap:var(--ddga-space-1);padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);font-family:inherit;display:flex}.ddga-menubar__trigger{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-base);font-weight:var(--ddga-font-weight-medium);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border:1px solid #0000;outline:none;align-items:center;transition:background-color .12s,border-color .12s,color .12s;display:inline-flex;position:relative}.ddga-menubar__trigger:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-menubar__trigger[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-menubar__trigger--default:after{content:"";inset-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-full);background-color:#0000;block-size:2px;transition:background-color .12s;position:absolute;inset-block-end:2px}.ddga-menubar__trigger--default[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar__trigger--default[data-state=open]{background-color:var(--ddga-color-muted);color:var(--ddga-color-primary)}.ddga-menubar__trigger--default[data-state=open]:after{background-color:var(--ddga-color-primary)}.ddga-menubar__trigger--outline{border-color:var(--ddga-color-border)}.ddga-menubar__trigger--outline[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar__trigger--outline[data-state=open]{border-color:var(--ddga-color-primary);color:var(--ddga-color-primary)}.ddga-menubar-menu{min-inline-size:192px;max-inline-size:320px;padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);z-index:50;outline:none;font-family:inherit}.ddga-menubar-menu[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-menubar-menu-in}.ddga-menubar-menu[data-state=closed]{animation:80ms ease-in ddga-menubar-menu-out}@keyframes ddga-menubar-menu-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-menubar-menu-out{0%{opacity:1}to{opacity:0}}.ddga-menubar-menu--sm{font-size:var(--ddga-font-size-sm)}.ddga-menubar-menu--md{font-size:var(--ddga-font-size-base)}.ddga-menubar-menu__item{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-menubar-menu__item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar-menu__item[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-menubar-menu__item[data-destructive]{color:var(--ddga-color-destructive)}.ddga-menubar-menu__item[data-destructive][data-highlighted]{background-color:var(--ddga-error-50)}.ddga-menubar-menu__label{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;overflow:hidden}.ddga-menubar-menu__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-menubar-menu__icon>svg{block-size:1em;inline-size:1em}.ddga-menubar-menu__shortcut{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-tertiary);letter-spacing:.04em;margin-inline-start:auto}.ddga-menubar-menu__item--checkable{padding-inline-start:calc(var(--ddga-space-2) + 1.25em);position:relative}.ddga-menubar-menu__indicator{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:50%;inset-inline-start:var(--ddga-space-2);transform:translateY(-50%)}.ddga-menubar-menu__indicator-icon{block-size:.875em;inline-size:.875em}.ddga-menubar-menu__radio-dot{border-radius:var(--ddga-radius-full);background-color:currentColor;block-size:.5em;inline-size:.5em;display:inline-block}.ddga-menubar-menu__item--sub[data-state=open]{background-color:var(--ddga-color-muted)}.ddga-menubar-menu__sub-chevron{block-size:1em;inline-size:1em;color:var(--ddga-text-tertiary);margin-inline-start:auto}[dir=rtl] .ddga-menubar-menu__sub-chevron{transform:scaleX(-1)}.ddga-menubar-menu__group-label{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-tertiary);text-transform:uppercase;letter-spacing:.04em}[dir=rtl] .ddga-menubar-menu__group-label{letter-spacing:normal;text-transform:none}[dir=rtl] .ddga-menubar-menu__shortcut{letter-spacing:normal}.ddga-menubar-menu__separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-menubar-menu__item[data-destructive][data-highlighted]{color:var(--ddga-error-200,#fecdca);background-color:#d92d203d}@media (forced-colors:active){.ddga-menubar{border:1px solid canvastext}.ddga-menubar__trigger[data-highlighted],.ddga-menubar__trigger[data-state=open]{color:highlighttext;background-color:highlight}.ddga-menubar__trigger:focus-visible{outline-offset:2px;outline:2px solid highlight}.ddga-menubar-menu{border:1px solid canvastext}.ddga-menubar-menu__item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-menubar-menu__separator{background-color:canvastext}}@media (prefers-reduced-motion:reduce){.ddga-menubar__trigger,.ddga-menubar__trigger--default:after{transition:none}.ddga-menubar-menu[data-state=open],.ddga-menubar-menu[data-state=closed]{animation:none}}}
 /*# sourceMappingURL=menubar.css.map */

package/dist/components/menubar.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,qRAiBA,wdAqBA,iFAIA,0FAUA,qOAYA,2FAMA,0HAIA,kGAMA,sEAKA,2FAMA,wHAOA,uUAgBA,iGAGA,mFAIA,gIAUA,4DAWA,0DAGA,0DAMA,uUAiBA,oFAIA,4FAOA,+EAGA,mGAKA,gHAQA,qKASA,4DAKA,8IASA,8GAMA,qQAYA,wEAIA,wJAYA,wFAIA,wHAQA,+DAMA,mQAUA,qKASA,8BACE,0CAGA,gIAKA,oFAIA,+CAGA,0FAIA,2DAOF,uCACE,6EAIA","sources":["src/components/menubar.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Bar (Menubar.Root) ─── */\n\n  .ddga-menubar {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    padding: var(--ddga-space-1);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    font-family: inherit;\n  }\n\n  /* ─── Bar trigger (File / Edit / View…) ─── */\n\n  /* Shared base across variants. A transparent 1px border is reserved so the\n     `outline` variant only flips border-color (no layout shift), and `default`\n     stays visually borderless. */\n  .ddga-menubar__trigger {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-md);\n    font-weight: var(--ddga-font-weight-medium);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n    transition:\n      background-color 120ms ease,\n      border-color 120ms ease,\n      color 120ms ease;\n  }\n\n  .ddga-menubar__trigger:focus-visible {\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  .ddga-menubar__trigger[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  /* ── Variant: default (flat menu-bar idiom) ── */\n\n  /* SA-green underline indicator for the open menu — reserved (transparent) at\n     rest so nothing shifts, animated in on open. Mirrors the Tabs active-tab\n     treatment (same --ddga-color-primary accent). */\n  .ddga-menubar__trigger--default::after {\n    content: '';\n    position: absolute;\n    inset-inline: var(--ddga-space-2);\n    inset-block-end: 2px;\n    block-size: 2px;\n    border-radius: var(--ddga-radius-full);\n    background-color: transparent;\n    transition: background-color 120ms ease;\n  }\n\n  /* Radix sets data-highlighted on hover / keyboard focus → soft surface. */\n  .ddga-menubar__trigger--default[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* data-state=open: this trigger's menu is showing → on-brand accent (green\n     label + underline), kept on the muted surface so the row reads active. */\n  .ddga-menubar__trigger--default[data-state='open'] {\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-color-primary);\n  }\n  .ddga-menubar__trigger--default[data-state='open']::after {\n    background-color: var(--ddga-color-primary);\n  }\n\n  /* ── Variant: outline (bordered button-style chip) ── */\n\n  .ddga-menubar__trigger--outline {\n    border-color: var(--ddga-color-border);\n  }\n\n  /* Hover / keyboard focus → soft surface fill (border stays neutral). */\n  .ddga-menubar__trigger--outline[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* Open menu → SA-green border + green label (the border is the accent here,\n     so no underline for this variant). */\n  .ddga-menubar__trigger--outline[data-state='open'] {\n    border-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary);\n  }\n\n  /* ─── Panel (Content / SubContent) ─── */\n\n  .ddga-menubar-menu {\n    min-inline-size: 192px;\n    max-inline-size: 320px;\n    padding: var(--ddga-space-1);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-md);\n    font-family: inherit;\n    z-index: 50;\n    outline: none;\n  }\n\n  /* Enter/exit animations follow Radix data-state. Keep them subtle so menu\n     surfaces feel instantaneous (this isn't a Modal). */\n  .ddga-menubar-menu[data-state='open'] {\n    animation: ddga-menubar-menu-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-menubar-menu[data-state='closed'] {\n    animation: ddga-menubar-menu-out 80ms ease-in;\n  }\n\n  @keyframes ddga-menubar-menu-in {\n    from {\n      opacity: 0;\n      transform: translateY(-2px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0) scale(1);\n    }\n  }\n  @keyframes ddga-menubar-menu-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-menubar-menu--sm {\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-menubar-menu--md {\n    font-size: var(--ddga-font-size-md);\n  }\n\n  /* ─── Item (and CheckboxItem/RadioItem/SubTrigger share the base) ─── */\n\n  .ddga-menubar-menu__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* Radix sets data-highlighted on the actively focused/hovered item — that's\n     our only \"focus ring\" since the menu manages focus internally. */\n  .ddga-menubar-menu__item[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-menubar-menu__item[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  /* Destructive: red text and a red-tinted hover. Tracks the destructive\n     family the rest of the system uses. */\n  .ddga-menubar-menu__item[data-destructive] {\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-menubar-menu__item[data-destructive][data-highlighted] {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* Inline pieces inside the row. */\n  .ddga-menubar-menu__label {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .ddga-menubar-menu__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    flex-shrink: 0;\n    color: var(--ddga-text-secondary);\n  }\n  .ddga-menubar-menu__icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-menubar-menu__shortcut {\n    margin-inline-start: auto;\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-text-tertiary);\n    letter-spacing: 0.04em;\n  }\n\n  /* ─── Indicator slot (Checkbox/Radio) ─── */\n\n  .ddga-menubar-menu__item--checkable {\n    /* Reserve the indicator column even when unchecked so labels align. */\n    padding-inline-start: calc(var(--ddga-space-2) + 1.25em);\n    position: relative;\n  }\n\n  .ddga-menubar-menu__indicator {\n    position: absolute;\n    inset-inline-start: var(--ddga-space-2);\n    inset-block-start: 50%;\n    transform: translateY(-50%);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-color-primary);\n  }\n  .ddga-menubar-menu__indicator-icon {\n    inline-size: 0.875em;\n    block-size: 0.875em;\n  }\n  .ddga-menubar-menu__radio-dot {\n    /* span is inline by default → inline-size/block-size are ignored. Force a\n       sized inline-block so the filled circle actually renders. */\n    display: inline-block;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: var(--ddga-radius-full);\n    background-color: currentColor;\n  }\n\n  /* ─── Submenu ─── */\n\n  .ddga-menubar-menu__item--sub[data-state='open'] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-menubar-menu__sub-chevron {\n    margin-inline-start: auto;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* Flip the sub-menu chevron in RTL — it should always point inline-end-ward. */\n  [dir='rtl'] .ddga-menubar-menu__sub-chevron {\n    transform: scaleX(-1);\n  }\n\n  /* ─── Label + Separator ─── */\n\n  .ddga-menubar-menu__group-label {\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-text-tertiary);\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n  }\n\n  .ddga-menubar-menu__separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-1);\n    margin-inline: calc(var(--ddga-space-1) * -1);\n    background-color: var(--ddga-color-border);\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-menubar {\n      border: 1px solid CanvasText;\n    }\n    .ddga-menubar__trigger[data-highlighted],\n    .ddga-menubar__trigger[data-state='open'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-menubar__trigger:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n    .ddga-menubar-menu {\n      border: 1px solid CanvasText;\n    }\n    .ddga-menubar-menu__item[data-highlighted] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-menubar-menu__separator {\n      background-color: CanvasText;\n    }\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-menubar__trigger,\n    .ddga-menubar__trigger--default::after {\n      transition: none;\n    }\n    .ddga-menubar-menu[data-state='open'],\n    .ddga-menubar-menu[data-state='closed'] {\n      animation: none;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,qRAiBA,0dAqBA,iFAIA,0FAUA,qOAYA,2FAMA,0HAIA,kGAMA,sEAKA,2FAMA,wHAOA,uUAgBA,iGAGA,mFAIA,gIAUA,4DAWA,0DAGA,4DAMA,uUAiBA,oFAIA,4FAOA,+EAGA,mGAKA,gHAQA,qKASA,4DAKA,8IASA,8GAMA,qQAYA,wEAIA,wJAYA,wFAIA,wHAQA,+DAMA,mQAYA,oFAIA,6DAIA,qKAYA,8IAOA,8BACE,0CAGA,gIAKA,oFAIA,+CAGA,0FAIA,2DAOF,uCACE,6EAIA","sources":["src/components/menubar.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Bar (Menubar.Root) ─── */\n\n  .ddga-menubar {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    padding: var(--ddga-space-1);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    font-family: inherit;\n  }\n\n  /* ─── Bar trigger (File / Edit / View…) ─── */\n\n  /* Shared base across variants. A transparent 1px border is reserved so the\n     `outline` variant only flips border-color (no layout shift), and `default`\n     stays visually borderless. */\n  .ddga-menubar__trigger {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-base);\n    font-weight: var(--ddga-font-weight-medium);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n    transition:\n      background-color 120ms ease,\n      border-color 120ms ease,\n      color 120ms ease;\n  }\n\n  .ddga-menubar__trigger:focus-visible {\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  .ddga-menubar__trigger[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  /* ── Variant: default (flat menu-bar idiom) ── */\n\n  /* SA-green underline indicator for the open menu — reserved (transparent) at\n     rest so nothing shifts, animated in on open. Mirrors the Tabs active-tab\n     treatment (same --ddga-color-primary accent). */\n  .ddga-menubar__trigger--default::after {\n    content: '';\n    position: absolute;\n    inset-inline: var(--ddga-space-2);\n    inset-block-end: 2px;\n    block-size: 2px;\n    border-radius: var(--ddga-radius-full);\n    background-color: transparent;\n    transition: background-color 120ms ease;\n  }\n\n  /* Radix sets data-highlighted on hover / keyboard focus → soft surface. */\n  .ddga-menubar__trigger--default[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* data-state=open: this trigger's menu is showing → on-brand accent (green\n     label + underline), kept on the muted surface so the row reads active. */\n  .ddga-menubar__trigger--default[data-state='open'] {\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-color-primary);\n  }\n  .ddga-menubar__trigger--default[data-state='open']::after {\n    background-color: var(--ddga-color-primary);\n  }\n\n  /* ── Variant: outline (bordered button-style chip) ── */\n\n  .ddga-menubar__trigger--outline {\n    border-color: var(--ddga-color-border);\n  }\n\n  /* Hover / keyboard focus → soft surface fill (border stays neutral). */\n  .ddga-menubar__trigger--outline[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* Open menu → SA-green border + green label (the border is the accent here,\n     so no underline for this variant). */\n  .ddga-menubar__trigger--outline[data-state='open'] {\n    border-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary);\n  }\n\n  /* ─── Panel (Content / SubContent) ─── */\n\n  .ddga-menubar-menu {\n    min-inline-size: 192px;\n    max-inline-size: 320px;\n    padding: var(--ddga-space-1);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-md);\n    font-family: inherit;\n    z-index: 50;\n    outline: none;\n  }\n\n  /* Enter/exit animations follow Radix data-state. Keep them subtle so menu\n     surfaces feel instantaneous (this isn't a Modal). */\n  .ddga-menubar-menu[data-state='open'] {\n    animation: ddga-menubar-menu-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-menubar-menu[data-state='closed'] {\n    animation: ddga-menubar-menu-out 80ms ease-in;\n  }\n\n  @keyframes ddga-menubar-menu-in {\n    from {\n      opacity: 0;\n      transform: translateY(-2px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0) scale(1);\n    }\n  }\n  @keyframes ddga-menubar-menu-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  /* ─── Sizes ─── */\n\n  .ddga-menubar-menu--sm {\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-menubar-menu--md {\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* ─── Item (and CheckboxItem/RadioItem/SubTrigger share the base) ─── */\n\n  .ddga-menubar-menu__item {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    color: inherit;\n    cursor: default;\n    user-select: none;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  /* Radix sets data-highlighted on the actively focused/hovered item — that's\n     our only \"focus ring\" since the menu manages focus internally. */\n  .ddga-menubar-menu__item[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-menubar-menu__item[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    pointer-events: none;\n  }\n\n  /* Destructive: red text and a red-tinted hover. Tracks the destructive\n     family the rest of the system uses. */\n  .ddga-menubar-menu__item[data-destructive] {\n    color: var(--ddga-color-destructive);\n  }\n  .ddga-menubar-menu__item[data-destructive][data-highlighted] {\n    background-color: var(--ddga-error-50);\n  }\n\n  /* Inline pieces inside the row. */\n  .ddga-menubar-menu__label {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .ddga-menubar-menu__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    flex-shrink: 0;\n    color: var(--ddga-text-secondary);\n  }\n  .ddga-menubar-menu__icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-menubar-menu__shortcut {\n    margin-inline-start: auto;\n    font-size: var(--ddga-font-size-xs);\n    color: var(--ddga-text-tertiary);\n    letter-spacing: 0.04em;\n  }\n\n  /* ─── Indicator slot (Checkbox/Radio) ─── */\n\n  .ddga-menubar-menu__item--checkable {\n    /* Reserve the indicator column even when unchecked so labels align. */\n    padding-inline-start: calc(var(--ddga-space-2) + 1.25em);\n    position: relative;\n  }\n\n  .ddga-menubar-menu__indicator {\n    position: absolute;\n    inset-inline-start: var(--ddga-space-2);\n    inset-block-start: 50%;\n    transform: translateY(-50%);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-color-primary);\n  }\n  .ddga-menubar-menu__indicator-icon {\n    inline-size: 0.875em;\n    block-size: 0.875em;\n  }\n  .ddga-menubar-menu__radio-dot {\n    /* span is inline by default → inline-size/block-size are ignored. Force a\n       sized inline-block so the filled circle actually renders. */\n    display: inline-block;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: var(--ddga-radius-full);\n    background-color: currentColor;\n  }\n\n  /* ─── Submenu ─── */\n\n  .ddga-menubar-menu__item--sub[data-state='open'] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-menubar-menu__sub-chevron {\n    margin-inline-start: auto;\n    inline-size: 1em;\n    block-size: 1em;\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* Flip the sub-menu chevron in RTL — it should always point inline-end-ward. */\n  [dir='rtl'] .ddga-menubar-menu__sub-chevron {\n    transform: scaleX(-1);\n  }\n\n  /* ─── Label + Separator ─── */\n\n  .ddga-menubar-menu__group-label {\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-text-tertiary);\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n  }\n  /* Protect Arabic cursive joining — drop the tracking + casing when RTL\n     (mirrors dropdown-menu.css / command.css). The shortcut hint is usually\n     Latin but reset it too for parity. */\n  [dir='rtl'] .ddga-menubar-menu__group-label {\n    letter-spacing: normal;\n    text-transform: none;\n  }\n  [dir='rtl'] .ddga-menubar-menu__shortcut {\n    letter-spacing: normal;\n  }\n\n  .ddga-menubar-menu__separator {\n    block-size: 1px;\n    margin-block: var(--ddga-space-1);\n    margin-inline: calc(var(--ddga-space-1) * -1);\n    background-color: var(--ddga-color-border);\n  }\n\n  /* ─── Dark mode ─── */\n\n  /* The destructive-hover background uses the raw --ddga-error-50 tint\n     (near-white), which doesn't adapt in dark mode. Override with a translucent\n     red + a light-red foreground for contrast (mirrors dropdown-menu.css). */\n  [data-theme='dark'] .ddga-menubar-menu__item[data-destructive][data-highlighted] {\n    background-color: rgb(217 45 32 / 0.24);\n    color: var(--ddga-error-200, #fecdca);\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-menubar {\n      border: 1px solid CanvasText;\n    }\n    .ddga-menubar__trigger[data-highlighted],\n    .ddga-menubar__trigger[data-state='open'] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-menubar__trigger:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n    .ddga-menubar-menu {\n      border: 1px solid CanvasText;\n    }\n    .ddga-menubar-menu__item[data-highlighted] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-menubar-menu__separator {\n      background-color: CanvasText;\n    }\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-menubar__trigger,\n    .ddga-menubar__trigger--default::after {\n      transition: none;\n    }\n    .ddga-menubar-menu[data-state='open'],\n    .ddga-menubar-menu[data-state='closed'] {\n      animation: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/progress.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-progress{background-color:var(--ddga-gray-200);border-radius:var(--ddga-radius-full);inline-size:100%;position:relative;overflow:hidden}.ddga-progress--sm{block-size:4px}.ddga-progress--md{block-size:8px}.ddga-progress--lg{block-size:12px}.ddga-progress--primary{--ddga-progress-color:var(--ddga-color-primary)}.ddga-progress--success{--ddga-progress-color:var(--ddga-color-success)}.ddga-progress--warning{--ddga-progress-color:var(--ddga-color-warning)}.ddga-progress--destructive{--ddga-progress-color:var(--ddga-color-destructive)}.ddga-progress__indicator{background-color:var(--ddga-progress-color,var(--ddga-color-primary));border-radius:inherit;block-size:100%;inline-size:100%;transition:transform .2s ease-out}.ddga-progress[data-state=indeterminate] .ddga-progress__indicator{inline-size:40%;transition:none;animation:1.4s cubic-bezier(.65,.05,.36,1) infinite ddga-progress-slide;transform:translate(-100%)}@keyframes ddga-progress-slide{0%{transform:translate(-100%)}to{transform:translate(350%)}}[dir=rtl] .ddga-progress[data-state=indeterminate] .ddga-progress__indicator{animation-name:ddga-progress-slide-rtl}@keyframes ddga-progress-slide-rtl{0%{transform:translate(100%)}to{transform:translate(-350%)}}.ddga-circular-progress{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative}.ddga-circular-progress--primary{--ddga-progress-color:var(--ddga-color-primary)}.ddga-circular-progress--success{--ddga-progress-color:var(--ddga-color-success)}.ddga-circular-progress--warning{--ddga-progress-color:var(--ddga-color-warning)}.ddga-circular-progress--destructive{--ddga-progress-color:var(--ddga-color-destructive)}.ddga-circular-progress__svg{display:block}.ddga-circular-progress__track{stroke:var(--ddga-gray-200)}.ddga-circular-progress__indicator{stroke:var(--ddga-progress-color,var(--ddga-color-primary));transition:stroke-dashoffset .2s ease-out}.ddga-circular-progress[data-state=indeterminate] .ddga-circular-progress__svg{transition:none;animation:1.4s linear infinite ddga-circular-progress-spin}@keyframes ddga-circular-progress-spin{to{transform:rotate(360deg)}}.ddga-circular-progress__label{font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-secondary);justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;inset:0}.ddga-circular-progress--sm .ddga-circular-progress__label{font-size:.625rem}.ddga-circular-progress--lg .ddga-circular-progress__label{font-size:var(--ddga-font-size-sm)}@media (prefers-reduced-motion:reduce){.ddga-progress[data-state=indeterminate] .ddga-progress__indicator,.ddga-circular-progress[data-state=indeterminate] .ddga-circular-progress__svg{animation:none}.ddga-progress__indicator,.ddga-circular-progress__indicator{transition:none}}}
+@layer ddga-components{.ddga-progress{background-color:var(--ddga-gray-200);border-radius:var(--ddga-radius-full);inline-size:100%;position:relative;overflow:hidden}.ddga-progress--sm{block-size:4px}.ddga-progress--md{block-size:8px}.ddga-progress--lg{block-size:12px}.ddga-progress--primary{--ddga-progress-color:var(--ddga-color-primary)}.ddga-progress--success{--ddga-progress-color:var(--ddga-color-success)}.ddga-progress--warning{--ddga-progress-color:var(--ddga-color-warning)}.ddga-progress--destructive{--ddga-progress-color:var(--ddga-color-destructive)}.ddga-progress__indicator{background-color:var(--ddga-progress-color,var(--ddga-color-primary));border-radius:inherit;block-size:100%;inline-size:100%;transition:transform .2s ease-out}.ddga-progress[data-state=indeterminate] .ddga-progress__indicator{inline-size:40%;transition:none;animation:1.4s cubic-bezier(.65,.05,.36,1) infinite ddga-progress-slide;transform:translate(-100%)}@keyframes ddga-progress-slide{0%{transform:translate(-100%)}to{transform:translate(350%)}}[dir=rtl] .ddga-progress[data-state=indeterminate] .ddga-progress__indicator{animation-name:ddga-progress-slide-rtl}@keyframes ddga-progress-slide-rtl{0%{transform:translate(100%)}to{transform:translate(-350%)}}.ddga-circular-progress{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative}.ddga-circular-progress--primary{--ddga-progress-color:var(--ddga-color-primary)}.ddga-circular-progress--success{--ddga-progress-color:var(--ddga-color-success)}.ddga-circular-progress--warning{--ddga-progress-color:var(--ddga-color-warning)}.ddga-circular-progress--destructive{--ddga-progress-color:var(--ddga-color-destructive)}.ddga-circular-progress__svg{display:block}.ddga-circular-progress__track{stroke:var(--ddga-gray-200)}.ddga-circular-progress__indicator{stroke:var(--ddga-progress-color,var(--ddga-color-primary));transition:stroke-dashoffset .2s ease-out}.ddga-circular-progress__segment{stroke:var(--ddga-gray-200);transition:stroke .2s}.ddga-circular-progress__segment--filled{stroke:var(--ddga-progress-color,var(--ddga-color-primary))}.ddga-circular-progress[data-state=indeterminate]:not([data-segmented]) .ddga-circular-progress__svg{transition:none;animation:1.4s linear infinite ddga-circular-progress-spin}@keyframes ddga-circular-progress-spin{to{transform:rotate(360deg)}}.ddga-circular-progress__label{font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-secondary);justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;inset:0}.ddga-circular-progress--sm .ddga-circular-progress__label{font-size:.625rem}.ddga-circular-progress--lg .ddga-circular-progress__label{font-size:var(--ddga-font-size-sm)}[data-theme=dark] .ddga-progress{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-circular-progress__track,[data-theme=dark] .ddga-circular-progress__segment{stroke:var(--ddga-color-border)}@media (prefers-reduced-motion:reduce){.ddga-progress[data-state=indeterminate] .ddga-progress__indicator,.ddga-circular-progress[data-state=indeterminate] .ddga-circular-progress__svg{animation:none}.ddga-progress__indicator,.ddga-circular-progress__indicator,.ddga-circular-progress__segment{transition:none}}@media (forced-colors:active){.ddga-progress{border:1px solid canvastext}.ddga-progress__indicator{background-color:highlight}.ddga-circular-progress__track,.ddga-circular-progress__segment{stroke:graytext}.ddga-circular-progress__indicator,.ddga-circular-progress__segment--filled{stroke:highlight}}}
 /*# sourceMappingURL=progress.css.map */

package/dist/components/progress.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,8IAQA,kCAGA,kCAGA,mCAIA,wEAGA,wEAGA,wEAGA,gFAIA,yLAUA,sMAOA,2FAUA,oHAIA,+FAWA,sHAQA,iFAGA,iFAGA,iFAGA,yFAIA,2CAIA,2DAIA,yIAKA,0JAKA,oEAMA,6OAYA,6EAGA,8FAKA,uCACE,iKAIA","sources":["src/components/progress.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Linear (Radix Progress) ─── */\n\n  .ddga-progress {\n    position: relative;\n    overflow: hidden;\n    inline-size: 100%;\n    background-color: var(--ddga-gray-200);\n    border-radius: var(--ddga-radius-full);\n  }\n\n  .ddga-progress--sm {\n    block-size: 4px;\n  }\n  .ddga-progress--md {\n    block-size: 8px;\n  }\n  .ddga-progress--lg {\n    block-size: 12px;\n  }\n\n  .ddga-progress--primary {\n    --ddga-progress-color: var(--ddga-color-primary);\n  }\n  .ddga-progress--success {\n    --ddga-progress-color: var(--ddga-color-success);\n  }\n  .ddga-progress--warning {\n    --ddga-progress-color: var(--ddga-color-warning);\n  }\n  .ddga-progress--destructive {\n    --ddga-progress-color: var(--ddga-color-destructive);\n  }\n\n  .ddga-progress__indicator {\n    block-size: 100%;\n    inline-size: 100%;\n    background-color: var(--ddga-progress-color, var(--ddga-color-primary));\n    transition: transform 200ms ease-out;\n    border-radius: inherit;\n  }\n\n  /* Indeterminate: slide a 40%-wide pill across the track. The track has\n     overflow:hidden so the off-track portions get clipped. */\n  .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator {\n    inline-size: 40%;\n    transform: translateX(-100%);\n    animation: ddga-progress-slide 1.4s cubic-bezier(0.65, 0.05, 0.36, 1) infinite;\n    transition: none;\n  }\n\n  @keyframes ddga-progress-slide {\n    0% {\n      transform: translateX(-100%);\n    }\n    100% {\n      transform: translateX(350%);\n    }\n  }\n\n  /* RTL: reverse the slide so motion still tracks reading direction. */\n  [dir='rtl'] .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator {\n    animation-name: ddga-progress-slide-rtl;\n  }\n\n  @keyframes ddga-progress-slide-rtl {\n    0% {\n      transform: translateX(100%);\n    }\n    100% {\n      transform: translateX(-350%);\n    }\n  }\n\n  /* ─── Circular (custom SVG) ─── */\n\n  .ddga-circular-progress {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n  }\n\n  .ddga-circular-progress--primary {\n    --ddga-progress-color: var(--ddga-color-primary);\n  }\n  .ddga-circular-progress--success {\n    --ddga-progress-color: var(--ddga-color-success);\n  }\n  .ddga-circular-progress--warning {\n    --ddga-progress-color: var(--ddga-color-warning);\n  }\n  .ddga-circular-progress--destructive {\n    --ddga-progress-color: var(--ddga-color-destructive);\n  }\n\n  .ddga-circular-progress__svg {\n    display: block;\n  }\n\n  .ddga-circular-progress__track {\n    stroke: var(--ddga-gray-200);\n  }\n\n  .ddga-circular-progress__indicator {\n    stroke: var(--ddga-progress-color, var(--ddga-color-primary));\n    transition: stroke-dashoffset 200ms ease-out;\n  }\n\n  .ddga-circular-progress[data-state='indeterminate'] .ddga-circular-progress__svg {\n    animation: ddga-circular-progress-spin 1.4s linear infinite;\n    transition: none;\n  }\n\n  @keyframes ddga-circular-progress-spin {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n\n  .ddga-circular-progress__label {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-medium);\n    color: var(--ddga-text-secondary);\n    line-height: 1;\n  }\n\n  .ddga-circular-progress--sm .ddga-circular-progress__label {\n    font-size: 0.625rem;\n  }\n  .ddga-circular-progress--lg .ddga-circular-progress__label {\n    font-size: var(--ddga-font-size-sm);\n  }\n\n  /* Reduced motion: drop indeterminate animations, keep static state visible. */\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator,\n    .ddga-circular-progress[data-state='indeterminate'] .ddga-circular-progress__svg {\n      animation: none;\n    }\n    .ddga-progress__indicator,\n    .ddga-circular-progress__indicator {\n      transition: none;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAGE,8IAQA,kCAGA,kCAGA,mCAIA,wEAGA,wEAGA,wEAGA,gFAIA,yLAUA,sMAOA,2FAUA,oHAIA,+FAWA,sHAQA,iFAGA,iFAGA,iFAGA,yFAIA,2CAIA,2DAIA,yIAMA,mFAIA,qGAMA,gLAMA,oEAMA,6OAYA,6EAGA,8FAUA,2EAGA,oIAMA,uCACE,iKAIA,+GAWF,8BACE,2CAGA,qDAGA,gFAIA","sources":["src/components/progress.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Linear (Radix Progress) ─── */\n\n  .ddga-progress {\n    position: relative;\n    overflow: hidden;\n    inline-size: 100%;\n    background-color: var(--ddga-gray-200);\n    border-radius: var(--ddga-radius-full);\n  }\n\n  .ddga-progress--sm {\n    block-size: 4px;\n  }\n  .ddga-progress--md {\n    block-size: 8px;\n  }\n  .ddga-progress--lg {\n    block-size: 12px;\n  }\n\n  .ddga-progress--primary {\n    --ddga-progress-color: var(--ddga-color-primary);\n  }\n  .ddga-progress--success {\n    --ddga-progress-color: var(--ddga-color-success);\n  }\n  .ddga-progress--warning {\n    --ddga-progress-color: var(--ddga-color-warning);\n  }\n  .ddga-progress--destructive {\n    --ddga-progress-color: var(--ddga-color-destructive);\n  }\n\n  .ddga-progress__indicator {\n    block-size: 100%;\n    inline-size: 100%;\n    background-color: var(--ddga-progress-color, var(--ddga-color-primary));\n    transition: transform 200ms ease-out;\n    border-radius: inherit;\n  }\n\n  /* Indeterminate: slide a 40%-wide pill across the track. The track has\n     overflow:hidden so the off-track portions get clipped. */\n  .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator {\n    inline-size: 40%;\n    transform: translateX(-100%);\n    animation: ddga-progress-slide 1.4s cubic-bezier(0.65, 0.05, 0.36, 1) infinite;\n    transition: none;\n  }\n\n  @keyframes ddga-progress-slide {\n    0% {\n      transform: translateX(-100%);\n    }\n    100% {\n      transform: translateX(350%);\n    }\n  }\n\n  /* RTL: reverse the slide so motion still tracks reading direction. */\n  [dir='rtl'] .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator {\n    animation-name: ddga-progress-slide-rtl;\n  }\n\n  @keyframes ddga-progress-slide-rtl {\n    0% {\n      transform: translateX(100%);\n    }\n    100% {\n      transform: translateX(-350%);\n    }\n  }\n\n  /* ─── Circular (custom SVG) ─── */\n\n  .ddga-circular-progress {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n  }\n\n  .ddga-circular-progress--primary {\n    --ddga-progress-color: var(--ddga-color-primary);\n  }\n  .ddga-circular-progress--success {\n    --ddga-progress-color: var(--ddga-color-success);\n  }\n  .ddga-circular-progress--warning {\n    --ddga-progress-color: var(--ddga-color-warning);\n  }\n  .ddga-circular-progress--destructive {\n    --ddga-progress-color: var(--ddga-color-destructive);\n  }\n\n  .ddga-circular-progress__svg {\n    display: block;\n  }\n\n  .ddga-circular-progress__track {\n    stroke: var(--ddga-gray-200);\n  }\n\n  .ddga-circular-progress__indicator {\n    stroke: var(--ddga-progress-color, var(--ddga-color-primary));\n    transition: stroke-dashoffset 200ms ease-out;\n  }\n\n  /* Segmented (radial stepper): each arc is track-colored until filled. */\n  .ddga-circular-progress__segment {\n    stroke: var(--ddga-gray-200);\n    transition: stroke 200ms ease;\n  }\n  .ddga-circular-progress__segment--filled {\n    stroke: var(--ddga-progress-color, var(--ddga-color-primary));\n  }\n\n  /* Only the continuous (non-segmented) ring spins when indeterminate — a\n     segmented ring is determinate, so don't rotate its empty arcs. */\n  .ddga-circular-progress[data-state='indeterminate']:not([data-segmented])\n    .ddga-circular-progress__svg {\n    animation: ddga-circular-progress-spin 1.4s linear infinite;\n    transition: none;\n  }\n\n  @keyframes ddga-circular-progress-spin {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n\n  .ddga-circular-progress__label {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-medium);\n    color: var(--ddga-text-secondary);\n    line-height: 1;\n  }\n\n  .ddga-circular-progress--sm .ddga-circular-progress__label {\n    font-size: 0.625rem;\n  }\n  .ddga-circular-progress--lg .ddga-circular-progress__label {\n    font-size: var(--ddga-font-size-sm);\n  }\n\n  /* ─── Dark mode ─── */\n  /* The unfilled track is built from the raw `--ddga-gray-200` tint, which the\n     dark theme does NOT remap (only semantic `--ddga-color-*` tokens adapt).\n     Left alone it renders as a bright light band on dark surfaces, so map the\n     track to the semantic border gray. The indicator stays `--ddga-color-*`\n     (already dark-aware). */\n  [data-theme='dark'] .ddga-progress {\n    background-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-circular-progress__track,\n  [data-theme='dark'] .ddga-circular-progress__segment {\n    stroke: var(--ddga-color-border);\n  }\n\n  /* Reduced motion: drop indeterminate animations, keep static state visible. */\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator,\n    .ddga-circular-progress[data-state='indeterminate'] .ddga-circular-progress__svg {\n      animation: none;\n    }\n    .ddga-progress__indicator,\n    .ddga-circular-progress__indicator,\n    .ddga-circular-progress__segment {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n  /* background/stroke colors are overridden by the system, which would make the\n     fill indistinguishable from the track. Pin the fill to Highlight and the\n     track to a dim system color so progress stays readable. */\n  @media (forced-colors: active) {\n    .ddga-progress {\n      border: 1px solid CanvasText;\n    }\n    .ddga-progress__indicator {\n      background-color: Highlight;\n    }\n    .ddga-circular-progress__track,\n    .ddga-circular-progress__segment {\n      stroke: GrayText;\n    }\n    .ddga-circular-progress__indicator,\n    .ddga-circular-progress__segment--filled {\n      stroke: Highlight;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/quote.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-quote{--ddga-quote-accent:var(--ddga-color-primary);color:var(--ddga-text-primary);margin:0;font-family:inherit;line-height:1.6;display:block}.ddga-quote__blockquote{margin:0}.ddga-quote__content{color:inherit}.ddga-quote__content p{margin-block:0}.ddga-quote__content p+p{margin-block-start:var(--ddga-space-3)}.ddga-quote__mark{block-size:2em;inline-size:2em;color:var(--ddga-quote-accent);opacity:.35;margin-block-end:var(--ddga-space-1);display:block}[dir=rtl] .ddga-quote__mark{transform:scaleX(-1)}.ddga-quote__caption{align-items:center;gap:var(--ddga-space-3);margin-block-start:var(--ddga-space-3);display:flex}.ddga-quote__avatar{flex:none;display:inline-flex}.ddga-quote__attribution{flex-direction:column;min-inline-size:0;display:flex}.ddga-quote__author{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-semibold);font-style:normal}.ddga-quote__byline{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-sm)}.ddga-quote__source{color:var(--ddga-text-tertiary);font-size:var(--ddga-font-size-sm);font-style:italic}.ddga-quote--default{border-inline-start:3px solid var(--ddga-quote-accent);padding-inline-start:var(--ddga-space-4);padding-block:var(--ddga-space-1)}.ddga-quote--pullquote{max-inline-size:42rem;padding-block:var(--ddga-space-4);text-align:center;font-size:var(--ddga-font-size-2xl);font-weight:var(--ddga-font-weight-medium);margin-inline:auto;line-height:1.4}.ddga-quote--pullquote .ddga-quote__mark{block-size:2.5em;inline-size:2.5em;margin-inline:auto}.ddga-quote--pullquote .ddga-quote__caption{justify-content:center;margin-block-start:var(--ddga-space-4)}.ddga-quote--pullquote .ddga-quote__attribution{align-items:center}.ddga-quote--testimonial{border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-lg);background-color:var(--ddga-color-background);box-shadow:var(--ddga-shadow-sm);padding:var(--ddga-space-6)}@media (forced-colors:active){.ddga-quote--default{border-inline-start-color:canvastext}.ddga-quote--testimonial{border-color:canvastext}.ddga-quote__mark{opacity:1}}}
+/*# sourceMappingURL=quote.css.map */

package/dist/components/quote.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAME,oJAWA,iCAIA,mCAKA,sCAGA,gEAMA,+IAUA,iDAMA,oHAOA,kDAKA,8EAMA,kHAMA,wFAKA,yGAQA,uJAQA,mNASA,+FAKA,0GAIA,mEAMA,kNAaA,8BACE,0DAGA,iDAGA","sources":["src/components/quote.css"],"sourcesContent":["@layer ddga-components {\n  /* Visual-only quote. Root is a <figure> when attribution is present, else a\n     bare <blockquote> — both carry .ddga-quote. Accent + surfaces flow through\n     semantic tokens, so dark mode adapts with no [data-theme] overrides.\n     Logical properties keep the accent border + mark RTL-correct. */\n\n  .ddga-quote {\n    --ddga-quote-accent: var(--ddga-color-primary);\n\n    display: block;\n    margin: 0;\n    color: var(--ddga-text-primary);\n    font-family: inherit;\n    line-height: 1.6;\n  }\n\n  /* When the root is a <figure>, the inner <blockquote> resets its UA margin. */\n  .ddga-quote__blockquote {\n    margin: 0;\n  }\n\n  .ddga-quote__content {\n    /* Quote text. Inherits font-size from the variant / surrounding context. */\n    color: inherit;\n  }\n\n  .ddga-quote__content p {\n    margin-block: 0;\n  }\n  .ddga-quote__content p + p {\n    margin-block-start: var(--ddga-space-3);\n  }\n\n  /* ─── Decorative quote mark ─── */\n\n  .ddga-quote__mark {\n    display: block;\n    inline-size: 2em;\n    block-size: 2em;\n    margin-block-end: var(--ddga-space-1);\n    color: var(--ddga-quote-accent);\n    opacity: 0.35;\n  }\n\n  /* Opening mark mirrors so the curl faces the (right-aligned) text in RTL. */\n  [dir='rtl'] .ddga-quote__mark {\n    transform: scaleX(-1);\n  }\n\n  /* ─── Caption (attribution) ─── */\n\n  .ddga-quote__caption {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    margin-block-start: var(--ddga-space-3);\n  }\n\n  .ddga-quote__avatar {\n    flex: none;\n    display: inline-flex;\n  }\n\n  .ddga-quote__attribution {\n    display: flex;\n    flex-direction: column;\n    min-inline-size: 0;\n  }\n\n  .ddga-quote__author {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-semibold);\n    font-style: normal;\n  }\n\n  .ddga-quote__byline {\n    color: var(--ddga-text-secondary);\n    font-size: var(--ddga-font-size-sm);\n  }\n\n  .ddga-quote__source {\n    color: var(--ddga-text-tertiary);\n    font-size: var(--ddga-font-size-sm);\n    font-style: italic;\n  }\n\n  /* ─── Variant: default (inline-start accent border) ─── */\n\n  .ddga-quote--default {\n    border-inline-start: 3px solid var(--ddga-quote-accent);\n    padding-inline-start: var(--ddga-space-4);\n    padding-block: var(--ddga-space-1);\n  }\n\n  /* ─── Variant: pullquote (large, editorial, centered) ─── */\n\n  .ddga-quote--pullquote {\n    max-inline-size: 42rem;\n    margin-inline: auto;\n    padding-block: var(--ddga-space-4);\n    text-align: center;\n    font-size: var(--ddga-font-size-2xl);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1.4;\n  }\n  .ddga-quote--pullquote .ddga-quote__mark {\n    margin-inline: auto;\n    inline-size: 2.5em;\n    block-size: 2.5em;\n  }\n  .ddga-quote--pullquote .ddga-quote__caption {\n    justify-content: center;\n    margin-block-start: var(--ddga-space-4);\n  }\n  .ddga-quote--pullquote .ddga-quote__attribution {\n    align-items: center;\n  }\n\n  /* ─── Variant: testimonial (card surface) ─── */\n\n  .ddga-quote--testimonial {\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-lg);\n    background-color: var(--ddga-color-background);\n    box-shadow: var(--ddga-shadow-sm);\n    padding: var(--ddga-space-6);\n  }\n\n  /* ─── Variant: plain (bare) ───\n     No border, no surface — relies on content + caption only. */\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-quote--default {\n      border-inline-start-color: CanvasText;\n    }\n    .ddga-quote--testimonial {\n      border-color: CanvasText;\n    }\n    .ddga-quote__mark {\n      opacity: 1;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/search-box.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-search-box .ddga-input__field::-webkit-search-cancel-button{appearance:none;display:none}.ddga-search-box .ddga-input__field::-webkit-search-decoration{appearance:none;display:none}.ddga-search-box .ddga-input__field::-webkit-search-results-button{appearance:none;display:none}.ddga-search-box .ddga-input__field::-webkit-search-results-decoration{appearance:none;display:none}}
+/*# sourceMappingURL=search-box.css.map */

package/dist/components/search-box.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBASE,+FAAA,4FAAA,gGAAA","sources":["src/components/search-box.css"],"sourcesContent":["@layer ddga-components {\n  /* SearchBox is the Input control with `type=\"search\"`; it reuses input.css\n     for the box, sizing, focus ring, adornments and the clear button. The\n     `.ddga-search-box` class lands on the Input control element, so the inner\n     field is a descendant. Only the search-specific overrides live here. */\n\n  /* Suppress the browser's native search affordances — we render our own\n     magnifier (leading) and clear button (trailing). Without this, WebKit\n     paints a second × inside the field. */\n  .ddga-search-box .ddga-input__field::-webkit-search-cancel-button,\n  .ddga-search-box .ddga-input__field::-webkit-search-decoration,\n  .ddga-search-box .ddga-input__field::-webkit-search-results-button,\n  .ddga-search-box .ddga-input__field::-webkit-search-results-decoration {\n    appearance: none;\n    display: none;\n  }\n}\n"],"names":[]}

package/dist/components/select.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-select__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-select__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-select-trigger{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-text-primary);text-align:start;cursor:pointer;transition:border-color .15s,box-shadow .15s;display:inline-flex}.ddga-select-trigger--sm{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-select-trigger--md{block-size:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-select-trigger:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);outline:none}.ddga-select-trigger[data-placeholder]{color:var(--ddga-text-placeholder)}.ddga-select-trigger:disabled{opacity:.5;cursor:not-allowed;background-color:var(--ddga-color-muted)}.ddga-select-trigger--error{border-color:var(--ddga-color-error)}.ddga-select-trigger--error:focus-visible{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-select__icon{color:var(--ddga-text-tertiary);flex-shrink:0;transition:rotate .15s}.ddga-select-trigger[data-state=open] .ddga-select__icon{rotate:180deg}.ddga-select-content{min-inline-size:var(--radix-select-trigger-width);max-block-size:var(--radix-select-content-available-height);z-index:50;background-color:var(--ddga-color-background);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);color:var(--ddga-text-primary);overflow:hidden}.ddga-select-viewport{padding:var(--ddga-space-1)}.ddga-select-item{block-size:32px;padding-block:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-base);color:var(--ddga-text-primary);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;align-items:center;padding-inline-start:var(--ddga-space-3);padding-inline-end:var(--ddga-space-7);line-height:1.4;display:flex;position:relative}.ddga-select-item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-select-item[data-disabled]{color:var(--ddga-text-tertiary);cursor:not-allowed;pointer-events:none}.ddga-select-item__indicator{color:var(--ddga-color-primary);align-items:center;display:inline-flex;position:absolute;inset-inline-end:var(--ddga-space-2)}.ddga-select-item__check{block-size:1em;inline-size:1em}@media (prefers-reduced-motion:reduce){.ddga-select-trigger,.ddga-select__icon{transition:none}}@media (forced-colors:active){.ddga-select-trigger{border:1px solid canvastext}.ddga-select-trigger:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-select-trigger:disabled{color:graytext;border-color:graytext}.ddga-select-content{border:1px solid canvastext}.ddga-select-item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-select-item__indicator{color:highlighttext}}}
+@layer ddga-components{.ddga-select__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-select__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-select-trigger{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-text-primary);text-align:start;cursor:pointer;transition:border-color .15s,box-shadow .15s;display:inline-flex}.ddga-select-trigger--sm{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-select-trigger--md{block-size:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-select-trigger:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);outline:none}.ddga-select-trigger[data-placeholder]{color:var(--ddga-text-placeholder)}.ddga-select-trigger:disabled{opacity:.5;cursor:not-allowed;background-color:var(--ddga-color-muted)}.ddga-select-trigger--error{border-color:var(--ddga-color-error)}.ddga-select-trigger--error:focus-visible{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-select__icon{color:var(--ddga-text-tertiary);flex-shrink:0;transition:rotate .15s}.ddga-select-trigger[data-state=open] .ddga-select__icon{rotate:180deg}.ddga-select-content{min-inline-size:var(--radix-select-trigger-width);max-block-size:var(--radix-select-content-available-height);z-index:50;background-color:var(--ddga-color-background);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);color:var(--ddga-text-primary);overflow:hidden}.ddga-select-viewport{padding:var(--ddga-space-1)}.ddga-select-item{block-size:32px;padding-block:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-base);color:var(--ddga-text-primary);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;align-items:center;padding-inline-start:var(--ddga-space-3);padding-inline-end:var(--ddga-space-8);line-height:1.4;display:flex;position:relative}.ddga-select-item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-select-item[data-disabled]{color:var(--ddga-text-tertiary);cursor:not-allowed;pointer-events:none}.ddga-select-item__indicator{color:var(--ddga-color-primary);align-items:center;display:inline-flex;position:absolute;inset-inline-end:var(--ddga-space-2)}.ddga-select-item__check{block-size:1em;inline-size:1em}@media (prefers-reduced-motion:reduce){.ddga-select-trigger,.ddga-select__icon{transition:none}}@media (forced-colors:active){.ddga-select-trigger{border:1px solid canvastext}.ddga-select-trigger:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-select-trigger:disabled{color:graytext;border-color:graytext}.ddga-select-content{border:1px solid canvastext}.ddga-select-item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-select-item__indicator{color:highlighttext}}}
 /*# sourceMappingURL=select.css.map */

package/dist/components/select.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAME,iJAOA,iFAOA,0WAmBA,+GAKA,iHAQA,gIAOA,0EAIA,qGAQA,iEAGA,4HAOA,wFAKA,uEAMA,0VAgBA,kDAMA,oYAoBA,6EAIA,wGAQA,2JAOA,wDAOA,uCACE,yDAQF,8BACE,iDAGA,kFAIA,mEAIA,iDAGA,mFAIA","sources":["src/components/select.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only Select-specific styles live here. */\n\n  /* ─── Label (above the trigger, matches Input) ─── */\n\n  .ddga-select__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-select__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Trigger (Radix Trigger , the focusable button) ─── */\n\n  .ddga-select-trigger {\n    display: inline-flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-text-primary);\n    text-align: start;\n    cursor: pointer;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  /* ─── Sizes (heights match Input) ─── */\n\n  .ddga-select-trigger--sm {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-select-trigger--md {\n    block-size: 36px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* ─── Trigger states ─── */\n\n  .ddga-select-trigger:focus-visible {\n    outline: none;\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  /* Radix sets `data-placeholder` on the trigger when no value is selected. */\n  .ddga-select-trigger[data-placeholder] {\n    color: var(--ddga-text-placeholder);\n  }\n\n  .ddga-select-trigger:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-select-trigger--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-select-trigger--error:focus-visible {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  /* ─── Chevron (Radix Icon) ─── */\n\n  .ddga-select__icon {\n    flex-shrink: 0;\n    color: var(--ddga-text-tertiary);\n    transition: rotate 150ms ease;\n  }\n  .ddga-select-trigger[data-state='open'] .ddga-select__icon {\n    rotate: 180deg;\n  }\n\n  /* ─── Content (the dropdown panel, rendered in a portal) ─── */\n\n  .ddga-select-content {\n    /* Match trigger width so the panel doesn't visually float wider/narrower\n       than the field. `--radix-select-trigger-width` is exposed by Radix\n       when `position=\"popper\"`. */\n    min-inline-size: var(--radix-select-trigger-width);\n    /* Cap height to viewport so long lists scroll instead of overflowing. */\n    max-block-size: var(--radix-select-content-available-height);\n    z-index: 50;\n    overflow: hidden;\n    background-color: var(--ddga-color-background);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-md);\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-select-viewport {\n    padding: var(--ddga-space-1);\n  }\n\n  /* ─── Item ─── */\n\n  .ddga-select-item {\n    position: relative;\n    display: flex;\n    align-items: center;\n    block-size: 32px;\n    padding-block: var(--ddga-space-2);\n    padding-inline-start: var(--ddga-space-3);\n    /* Reserve room for the trailing checkmark indicator so item text never\n       collides with it when the row is selected. */\n    padding-inline-end: var(--ddga-space-7);\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.4;\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n    user-select: none;\n    outline: none;\n  }\n\n  /* Radix sets `data-highlighted` on the keyboard- or pointer-focused item. */\n  .ddga-select-item[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-select-item[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n\n  /* ─── Item indicator (checkmark on the selected item) ─── */\n\n  .ddga-select-item__indicator {\n    position: absolute;\n    inset-inline-end: var(--ddga-space-2);\n    display: inline-flex;\n    align-items: center;\n    color: var(--ddga-color-primary);\n  }\n  .ddga-select-item__check {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-select-trigger,\n    .ddga-select__icon {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-select-trigger {\n      border: 1px solid CanvasText;\n    }\n    .ddga-select-trigger:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-select-trigger:disabled {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    .ddga-select-content {\n      border: 1px solid CanvasText;\n    }\n    .ddga-select-item[data-highlighted] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-select-item__indicator {\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAME,iJAOA,iFAOA,0WAmBA,+GAKA,iHAQA,gIAOA,0EAIA,qGAQA,iEAGA,4HAOA,wFAKA,uEAMA,0VAgBA,kDAMA,oYAoBA,6EAIA,wGAQA,2JAOA,wDAOA,uCACE,yDAQF,8BACE,iDAGA,kFAIA,mEAIA,iDAGA,mFAIA","sources":["src/components/select.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only Select-specific styles live here. */\n\n  /* ─── Label (above the trigger, matches Input) ─── */\n\n  .ddga-select__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-select__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Trigger (Radix Trigger , the focusable button) ─── */\n\n  .ddga-select-trigger {\n    display: inline-flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-text-primary);\n    text-align: start;\n    cursor: pointer;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  /* ─── Sizes (heights match Input) ─── */\n\n  .ddga-select-trigger--sm {\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-select-trigger--md {\n    block-size: 36px;\n    padding-inline: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* ─── Trigger states ─── */\n\n  .ddga-select-trigger:focus-visible {\n    outline: none;\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  /* Radix sets `data-placeholder` on the trigger when no value is selected. */\n  .ddga-select-trigger[data-placeholder] {\n    color: var(--ddga-text-placeholder);\n  }\n\n  .ddga-select-trigger:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    background-color: var(--ddga-color-muted);\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-select-trigger--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-select-trigger--error:focus-visible {\n    border-color: var(--ddga-color-error);\n    box-shadow: 0 0 0 1px var(--ddga-color-error);\n  }\n\n  /* ─── Chevron (Radix Icon) ─── */\n\n  .ddga-select__icon {\n    flex-shrink: 0;\n    color: var(--ddga-text-tertiary);\n    transition: rotate 150ms ease;\n  }\n  .ddga-select-trigger[data-state='open'] .ddga-select__icon {\n    rotate: 180deg;\n  }\n\n  /* ─── Content (the dropdown panel, rendered in a portal) ─── */\n\n  .ddga-select-content {\n    /* Match trigger width so the panel doesn't visually float wider/narrower\n       than the field. `--radix-select-trigger-width` is exposed by Radix\n       when `position=\"popper\"`. */\n    min-inline-size: var(--radix-select-trigger-width);\n    /* Cap height to viewport so long lists scroll instead of overflowing. */\n    max-block-size: var(--radix-select-content-available-height);\n    z-index: 50;\n    overflow: hidden;\n    background-color: var(--ddga-color-background);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-md);\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-select-viewport {\n    padding: var(--ddga-space-1);\n  }\n\n  /* ─── Item ─── */\n\n  .ddga-select-item {\n    position: relative;\n    display: flex;\n    align-items: center;\n    block-size: 32px;\n    padding-block: var(--ddga-space-2);\n    padding-inline-start: var(--ddga-space-3);\n    /* Reserve room for the trailing checkmark indicator so item text never\n       collides with it when the row is selected. */\n    padding-inline-end: var(--ddga-space-8);\n    border-radius: var(--ddga-radius-sm);\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.4;\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n    user-select: none;\n    outline: none;\n  }\n\n  /* Radix sets `data-highlighted` on the keyboard- or pointer-focused item. */\n  .ddga-select-item[data-highlighted] {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-select-item[data-disabled] {\n    color: var(--ddga-text-tertiary);\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n\n  /* ─── Item indicator (checkmark on the selected item) ─── */\n\n  .ddga-select-item__indicator {\n    position: absolute;\n    inset-inline-end: var(--ddga-space-2);\n    display: inline-flex;\n    align-items: center;\n    color: var(--ddga-color-primary);\n  }\n  .ddga-select-item__check {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-select-trigger,\n    .ddga-select__icon {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-select-trigger {\n      border: 1px solid CanvasText;\n    }\n    .ddga-select-trigger:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-select-trigger:disabled {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    .ddga-select-content {\n      border: 1px solid CanvasText;\n    }\n    .ddga-select-item[data-highlighted] {\n      background-color: Highlight;\n      color: HighlightText;\n    }\n    .ddga-select-item__indicator {\n      color: HighlightText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/skeleton.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-skeleton{background-color:var(--ddga-gray-200);border-radius:var(--ddga-radius-md);display:block;position:relative;overflow:hidden}.ddga-skeleton--text{border-radius:var(--ddga-radius-sm);width:100%;height:1em}.ddga-skeleton--rectangle{width:100%;height:40px}.ddga-skeleton--circle{border-radius:var(--ddga-radius-full);width:40px;height:40px}.ddga-skeleton--pulse{animation:1.5s ease-in-out infinite ddga-skeleton-pulse}@keyframes ddga-skeleton-pulse{0%,to{opacity:1}50%{opacity:.55}}.ddga-skeleton--wave:after{content:"";background-image:linear-gradient(90deg, transparent, color-mix(in srgb, var(--ddga-color-background) 60%, transparent), transparent);animation:1.6s linear infinite ddga-skeleton-wave;position:absolute;inset:0;transform:translate(-100%)}@keyframes ddga-skeleton-wave{to{transform:translate(100%)}}[dir=rtl] .ddga-skeleton--wave:after{animation-name:ddga-skeleton-wave-rtl;transform:translate(100%)}@keyframes ddga-skeleton-wave-rtl{to{transform:translate(-100%)}}.ddga-skeleton--none{animation:none}.ddga-skeleton--none:after{display:none}@media (prefers-reduced-motion:reduce){.ddga-skeleton--pulse,.ddga-skeleton--wave:after{animation:none}}}
+@layer ddga-components{.ddga-skeleton{background-color:var(--ddga-gray-200);border-radius:var(--ddga-radius-md);display:block;position:relative;overflow:hidden}.ddga-skeleton--text{border-radius:var(--ddga-radius-sm);width:100%;height:1em}.ddga-skeleton--rectangle{width:100%;height:40px}.ddga-skeleton--circle{border-radius:var(--ddga-radius-full);width:40px;height:40px}.ddga-skeleton--pulse{animation:1.5s ease-in-out infinite ddga-skeleton-pulse}@keyframes ddga-skeleton-pulse{0%,to{opacity:1}50%{opacity:.55}}.ddga-skeleton--wave:after{content:"";background-image:linear-gradient(90deg, transparent, color-mix(in srgb, var(--ddga-color-background) 60%, transparent), transparent);animation:1.6s linear infinite ddga-skeleton-wave;position:absolute;inset:0;transform:translate(-100%)}@keyframes ddga-skeleton-wave{to{transform:translate(100%)}}[dir=rtl] .ddga-skeleton--wave:after{animation-name:ddga-skeleton-wave-rtl;transform:translate(100%)}@keyframes ddga-skeleton-wave-rtl{to{transform:translate(-100%)}}.ddga-skeleton--none{animation:none}.ddga-skeleton--none:after{display:none}[data-theme=dark] .ddga-skeleton{background-color:var(--ddga-color-border)}@media (prefers-reduced-motion:reduce){.ddga-skeleton--pulse,.ddga-skeleton--wave:after{animation:none}}@media (forced-colors:active){.ddga-skeleton{border:1px solid graytext}}}
 /*# sourceMappingURL=skeleton.css.map */

package/dist/components/skeleton.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBACE,yIAUA,+EAMA,iDAKA,oFAQA,8EAIA,gEAYA,kRAcA,4DAOA,qGAKA,iEAMA,oCAIA,wCAIA,uCACE","sources":["src/components/skeleton.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-skeleton {\n    display: block;\n    background-color: var(--ddga-gray-200);\n    border-radius: var(--ddga-radius-md);\n    position: relative;\n    overflow: hidden;\n  }\n\n  /* ─── Shapes ─── */\n\n  .ddga-skeleton--text {\n    width: 100%;\n    height: 1em;\n    border-radius: var(--ddga-radius-sm);\n  }\n\n  .ddga-skeleton--rectangle {\n    width: 100%;\n    height: 40px;\n  }\n\n  .ddga-skeleton--circle {\n    width: 40px;\n    height: 40px;\n    border-radius: var(--ddga-radius-full);\n  }\n\n  /* ─── Animations ─── */\n\n  .ddga-skeleton--pulse {\n    animation: ddga-skeleton-pulse 1.5s ease-in-out infinite;\n  }\n\n  @keyframes ddga-skeleton-pulse {\n    0%,\n    100% {\n      opacity: 1;\n    }\n    50% {\n      opacity: 0.55;\n    }\n  }\n\n  /* Wave: a translucent gradient sweeps across the surface using a\n     pseudo-element so it doesn't interfere with the consumer's content. */\n  .ddga-skeleton--wave::after {\n    content: '';\n    position: absolute;\n    inset: 0;\n    transform: translateX(-100%);\n    background-image: linear-gradient(\n      90deg,\n      transparent,\n      color-mix(in srgb, var(--ddga-color-background) 60%, transparent),\n      transparent\n    );\n    animation: ddga-skeleton-wave 1.6s linear infinite;\n  }\n\n  @keyframes ddga-skeleton-wave {\n    100% {\n      transform: translateX(100%);\n    }\n  }\n\n  /* RTL: sweep direction follows reading direction so the shimmer feels native. */\n  [dir='rtl'] .ddga-skeleton--wave::after {\n    transform: translateX(100%);\n    animation-name: ddga-skeleton-wave-rtl;\n  }\n\n  @keyframes ddga-skeleton-wave-rtl {\n    100% {\n      transform: translateX(-100%);\n    }\n  }\n\n  .ddga-skeleton--none {\n    animation: none;\n  }\n\n  .ddga-skeleton--none::after {\n    display: none;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-skeleton--pulse,\n    .ddga-skeleton--wave::after {\n      animation: none;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBACE,yIAUA,+EAMA,iDAKA,oFAQA,8EAIA,gEAYA,kRAcA,4DAOA,qGAKA,iEAMA,oCAIA,wCASA,2EAIA,uCACE,iEASF,8BACE","sources":["src/components/skeleton.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-skeleton {\n    display: block;\n    background-color: var(--ddga-gray-200);\n    border-radius: var(--ddga-radius-md);\n    position: relative;\n    overflow: hidden;\n  }\n\n  /* ─── Shapes ─── */\n\n  .ddga-skeleton--text {\n    width: 100%;\n    height: 1em;\n    border-radius: var(--ddga-radius-sm);\n  }\n\n  .ddga-skeleton--rectangle {\n    width: 100%;\n    height: 40px;\n  }\n\n  .ddga-skeleton--circle {\n    width: 40px;\n    height: 40px;\n    border-radius: var(--ddga-radius-full);\n  }\n\n  /* ─── Animations ─── */\n\n  .ddga-skeleton--pulse {\n    animation: ddga-skeleton-pulse 1.5s ease-in-out infinite;\n  }\n\n  @keyframes ddga-skeleton-pulse {\n    0%,\n    100% {\n      opacity: 1;\n    }\n    50% {\n      opacity: 0.55;\n    }\n  }\n\n  /* Wave: a translucent gradient sweeps across the surface using a\n     pseudo-element so it doesn't interfere with the consumer's content. */\n  .ddga-skeleton--wave::after {\n    content: '';\n    position: absolute;\n    inset: 0;\n    transform: translateX(-100%);\n    background-image: linear-gradient(\n      90deg,\n      transparent,\n      color-mix(in srgb, var(--ddga-color-background) 60%, transparent),\n      transparent\n    );\n    animation: ddga-skeleton-wave 1.6s linear infinite;\n  }\n\n  @keyframes ddga-skeleton-wave {\n    100% {\n      transform: translateX(100%);\n    }\n  }\n\n  /* RTL: sweep direction follows reading direction so the shimmer feels native. */\n  [dir='rtl'] .ddga-skeleton--wave::after {\n    transform: translateX(100%);\n    animation-name: ddga-skeleton-wave-rtl;\n  }\n\n  @keyframes ddga-skeleton-wave-rtl {\n    100% {\n      transform: translateX(-100%);\n    }\n  }\n\n  .ddga-skeleton--none {\n    animation: none;\n  }\n\n  .ddga-skeleton--none::after {\n    display: none;\n  }\n\n  /* ─── Dark mode ─── */\n  /* The fill is the raw `--ddga-gray-200` tint, which the dark theme does NOT\n     remap (only semantic `--ddga-color-*` adapt). Left alone it renders as a\n     bright light box on dark surfaces, so map it to the semantic border gray.\n     The wave shimmer already uses `--ddga-color-background` and is fine. */\n  [data-theme='dark'] .ddga-skeleton {\n    background-color: var(--ddga-color-border);\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-skeleton--pulse,\n    .ddga-skeleton--wave::after {\n      animation: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n  /* The fill conveys \"content loading here\", but `background-color` is forced\n     away in HC. Outline the placeholder so it stays perceivable. */\n  @media (forced-colors: active) {\n    .ddga-skeleton {\n      border: 1px solid GrayText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/slider.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-slider__header{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-slider__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-slider__value{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-sm);font-variant-numeric:tabular-nums}.ddga-slider{touch-action:none;-webkit-user-select:none;user-select:none;align-items:center;inline-size:100%;display:flex;position:relative}.ddga-slider--md{--ddga-slider-rail:6px;--ddga-slider-thumb:18px;block-size:var(--ddga-slider-thumb)}.ddga-slider--sm{--ddga-slider-rail:4px;--ddga-slider-thumb:14px;block-size:var(--ddga-slider-thumb)}.ddga-slider__track{block-size:var(--ddga-slider-rail);background-color:var(--ddga-color-input);border-radius:999px;flex-grow:1;position:relative}.ddga-slider__range{background-color:var(--ddga-color-primary);border-radius:999px;block-size:100%;position:absolute}.ddga-slider__thumb{inline-size:var(--ddga-slider-thumb);block-size:var(--ddga-slider-thumb);border:2px solid var(--ddga-color-primary);background-color:var(--ddga-color-background);cursor:grab;border-radius:999px;transition:border-color .15s,box-shadow .15s;display:block;box-shadow:0 1px 2px #00000026}.ddga-slider__thumb:active{cursor:grabbing}.ddga-slider__thumb:focus-visible{box-shadow:0 0 0 3px var(--ddga-color-ring);outline:none}.ddga-slider--error .ddga-slider__thumb{border-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__range{background-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__thumb:focus-visible{box-shadow:0 0 0 3px var(--ddga-color-error)}.ddga-slider[data-disabled]{opacity:.5}.ddga-slider[data-disabled] .ddga-slider__thumb{cursor:not-allowed}[data-theme=dark] .ddga-slider__thumb{background-color:#f3f4f6;box-shadow:0 1px 2px #0006}@media (prefers-reduced-motion:reduce){.ddga-slider__thumb{transition:none}}@media (forced-colors:active){.ddga-slider__track{background-color:canvas;border:1px solid canvastext}.ddga-slider__range{background-color:highlight}.ddga-slider__thumb{background-color:buttonface;border-color:canvastext}.ddga-slider__thumb:focus-visible{outline-offset:1px;outline:2px solid highlight}}}
+@layer ddga-components{.ddga-slider__header{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-slider__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-slider__value{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-sm);font-variant-numeric:tabular-nums}.ddga-slider{touch-action:none;-webkit-user-select:none;user-select:none;align-items:center;inline-size:100%;display:flex;position:relative}.ddga-slider--md{--ddga-slider-rail:6px;--ddga-slider-thumb:18px;block-size:var(--ddga-slider-thumb)}.ddga-slider--sm{--ddga-slider-rail:4px;--ddga-slider-thumb:14px;block-size:var(--ddga-slider-thumb)}.ddga-slider__track{block-size:var(--ddga-slider-rail);background-color:var(--ddga-color-input);border-radius:999px;flex-grow:1;position:relative}.ddga-slider__range{background-color:var(--ddga-color-primary);border-radius:999px;block-size:100%;position:absolute}.ddga-slider__thumb{inline-size:var(--ddga-slider-thumb);block-size:var(--ddga-slider-thumb);border:2px solid var(--ddga-color-primary);background-color:var(--ddga-color-background);cursor:grab;border-radius:999px;transition:border-color .15s,box-shadow .15s;display:block;box-shadow:0 1px 2px #00000026}.ddga-slider__thumb:active{cursor:grabbing}.ddga-slider__thumb:focus-visible{box-shadow:0 0 0 3px var(--ddga-color-ring);outline:none}.ddga-slider--error .ddga-slider__thumb{border-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__range{background-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__thumb:focus-visible{box-shadow:0 0 0 3px var(--ddga-color-error)}.ddga-slider[data-disabled]{opacity:.5}.ddga-slider[data-disabled] .ddga-slider__thumb{cursor:not-allowed}[data-theme=dark] .ddga-slider__thumb{background-color:var(--ddga-gray-100);box-shadow:0 1px 2px #0006}@media (prefers-reduced-motion:reduce){.ddga-slider__thumb{transition:none}}@media (forced-colors:active){.ddga-slider__track{background-color:canvas;border:1px solid canvastext}.ddga-slider__range{background-color:highlight}.ddga-slider__thumb{background-color:buttonface;border-color:canvastext}.ddga-slider__thumb:focus-visible{outline-offset:1px;outline:2px solid highlight}}}
 /*# sourceMappingURL=slider.css.map */

package/dist/components/slider.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAQE,6GAOA,iJAOA,0HAQA,4IAWA,qGAKA,qGAQA,kJAQA,qHASA,gTAcA,2CAIA,2FAOA,6EAGA,iFAGA,mGAMA,uCAGA,mEAMA,0FAOA,uCACE,qCAOF,8BACE,wEAIA,+CAGA,wEAIA","sources":["src/components/slider.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only Slider-specific styles live here. Radix Slider\n     handles RTL positioning natively via the inherited `dir` (DgaProvider\n     wraps Direction.Provider), so no manual flipping is needed here. */\n\n  /* ─── Header (label + value readout) ─── */\n\n  .ddga-slider__header {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-slider__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-slider__value {\n    color: var(--ddga-text-secondary);\n    font-size: var(--ddga-font-size-sm);\n    font-variant-numeric: tabular-nums;\n  }\n\n  /* ─── Root ─── */\n\n  .ddga-slider {\n    position: relative;\n    display: flex;\n    align-items: center;\n    inline-size: 100%;\n    touch-action: none;\n    user-select: none;\n  }\n\n  /* Per-size rail thickness + thumb diameter, encoded as custom properties so\n     the track/thumb rules below stay size-agnostic. */\n  .ddga-slider--md {\n    --ddga-slider-rail: 6px;\n    --ddga-slider-thumb: 18px;\n    block-size: var(--ddga-slider-thumb);\n  }\n  .ddga-slider--sm {\n    --ddga-slider-rail: 4px;\n    --ddga-slider-thumb: 14px;\n    block-size: var(--ddga-slider-thumb);\n  }\n\n  /* ─── Track + filled range ─── */\n\n  .ddga-slider__track {\n    position: relative;\n    flex-grow: 1;\n    block-size: var(--ddga-slider-rail);\n    border-radius: 999px;\n    background-color: var(--ddga-color-input);\n  }\n\n  .ddga-slider__range {\n    position: absolute;\n    block-size: 100%;\n    border-radius: 999px;\n    background-color: var(--ddga-color-primary);\n  }\n\n  /* ─── Thumb ─── */\n\n  .ddga-slider__thumb {\n    display: block;\n    inline-size: var(--ddga-slider-thumb);\n    block-size: var(--ddga-slider-thumb);\n    border: 2px solid var(--ddga-color-primary);\n    border-radius: 999px;\n    background-color: var(--ddga-color-background);\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);\n    cursor: grab;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  .ddga-slider__thumb:active {\n    cursor: grabbing;\n  }\n\n  .ddga-slider__thumb:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 3px var(--ddga-color-ring);\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-slider--error .ddga-slider__thumb {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-slider--error .ddga-slider__range {\n    background-color: var(--ddga-color-error);\n  }\n  .ddga-slider--error .ddga-slider__thumb:focus-visible {\n    box-shadow: 0 0 0 3px var(--ddga-color-error);\n  }\n\n  /* ─── Disabled (Radix sets data-disabled on the Root) ─── */\n\n  .ddga-slider[data-disabled] {\n    opacity: 0.5;\n  }\n  .ddga-slider[data-disabled] .ddga-slider__thumb {\n    cursor: not-allowed;\n  }\n\n  /* ─── Dark mode: keep the thumb a raised light surface ─── */\n\n  [data-theme='dark'] .ddga-slider__thumb {\n    background-color: #f3f4f6;\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-slider__thumb {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-slider__track {\n      background-color: Canvas;\n      border: 1px solid CanvasText;\n    }\n    .ddga-slider__range {\n      background-color: Highlight;\n    }\n    .ddga-slider__thumb {\n      background-color: ButtonFace;\n      border-color: CanvasText;\n    }\n    .ddga-slider__thumb:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAQE,6GAOA,iJAOA,0HAQA,4IAWA,qGAKA,qGAQA,kJAQA,qHASA,gTAcA,2CAIA,2FAOA,6EAGA,iFAGA,mGAMA,uCAGA,mEAMA,uGAOA,uCACE,qCAOF,8BACE,wEAIA,+CAGA,wEAIA","sources":["src/components/slider.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only Slider-specific styles live here. Radix Slider\n     handles RTL positioning natively via the inherited `dir` (DgaProvider\n     wraps Direction.Provider), so no manual flipping is needed here. */\n\n  /* ─── Header (label + value readout) ─── */\n\n  .ddga-slider__header {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-slider__label {\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4;\n  }\n\n  .ddga-slider__value {\n    color: var(--ddga-text-secondary);\n    font-size: var(--ddga-font-size-sm);\n    font-variant-numeric: tabular-nums;\n  }\n\n  /* ─── Root ─── */\n\n  .ddga-slider {\n    position: relative;\n    display: flex;\n    align-items: center;\n    inline-size: 100%;\n    touch-action: none;\n    user-select: none;\n  }\n\n  /* Per-size rail thickness + thumb diameter, encoded as custom properties so\n     the track/thumb rules below stay size-agnostic. */\n  .ddga-slider--md {\n    --ddga-slider-rail: 6px;\n    --ddga-slider-thumb: 18px;\n    block-size: var(--ddga-slider-thumb);\n  }\n  .ddga-slider--sm {\n    --ddga-slider-rail: 4px;\n    --ddga-slider-thumb: 14px;\n    block-size: var(--ddga-slider-thumb);\n  }\n\n  /* ─── Track + filled range ─── */\n\n  .ddga-slider__track {\n    position: relative;\n    flex-grow: 1;\n    block-size: var(--ddga-slider-rail);\n    border-radius: 999px;\n    background-color: var(--ddga-color-input);\n  }\n\n  .ddga-slider__range {\n    position: absolute;\n    block-size: 100%;\n    border-radius: 999px;\n    background-color: var(--ddga-color-primary);\n  }\n\n  /* ─── Thumb ─── */\n\n  .ddga-slider__thumb {\n    display: block;\n    inline-size: var(--ddga-slider-thumb);\n    block-size: var(--ddga-slider-thumb);\n    border: 2px solid var(--ddga-color-primary);\n    border-radius: 999px;\n    background-color: var(--ddga-color-background);\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);\n    cursor: grab;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  .ddga-slider__thumb:active {\n    cursor: grabbing;\n  }\n\n  .ddga-slider__thumb:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 3px var(--ddga-color-ring);\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-slider--error .ddga-slider__thumb {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-slider--error .ddga-slider__range {\n    background-color: var(--ddga-color-error);\n  }\n  .ddga-slider--error .ddga-slider__thumb:focus-visible {\n    box-shadow: 0 0 0 3px var(--ddga-color-error);\n  }\n\n  /* ─── Disabled (Radix sets data-disabled on the Root) ─── */\n\n  .ddga-slider[data-disabled] {\n    opacity: 0.5;\n  }\n  .ddga-slider[data-disabled] .ddga-slider__thumb {\n    cursor: not-allowed;\n  }\n\n  /* ─── Dark mode: keep the thumb a raised light surface ─── */\n\n  [data-theme='dark'] .ddga-slider__thumb {\n    background-color: var(--ddga-gray-100);\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-slider__thumb {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-slider__track {\n      background-color: Canvas;\n      border: 1px solid CanvasText;\n    }\n    .ddga-slider__range {\n      background-color: Highlight;\n    }\n    .ddga-slider__thumb {\n      background-color: ButtonFace;\n      border-color: CanvasText;\n    }\n    .ddga-slider__thumb:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/stat.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-stat{gap:var(--ddga-space-1);max-inline-size:20rem;padding:var(--ddga-space-5);background-color:var(--ddga-color-card);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);color:var(--ddga-color-card-foreground);flex-direction:column;display:flex}.ddga-stat--elevated{box-shadow:var(--ddga-shadow-md);border-color:#0000}.ddga-stat--elevated .ddga-stat__icon{border-radius:var(--ddga-radius-full);background-color:var(--ddga-sa-600);block-size:2.5rem;inline-size:2.5rem;color:var(--ddga-color-primary-foreground)}.ddga-stat--accent{--ddga-stat-accent-fg:var(--ddga-sa-600);--ddga-stat-accent-bg:var(--ddga-sa-50);border-inline-start:3px solid var(--ddga-stat-accent-fg)}.ddga-stat--accent[data-sentiment=positive]{--ddga-stat-accent-fg:var(--ddga-success-600);--ddga-stat-accent-bg:var(--ddga-success-50)}.ddga-stat--accent[data-sentiment=negative]{--ddga-stat-accent-fg:var(--ddga-error-600);--ddga-stat-accent-bg:var(--ddga-error-50)}.ddga-stat--accent[data-sentiment=neutral]{--ddga-stat-accent-fg:var(--ddga-gray-600);--ddga-stat-accent-bg:var(--ddga-gray-100)}.ddga-stat--accent .ddga-stat__icon{background-color:var(--ddga-stat-accent-bg);color:var(--ddga-stat-accent-fg)}[data-theme=dark] .ddga-stat--flat .ddga-stat__icon{color:var(--ddga-gray-300,#d2d6db);background-color:#ffffff14}[data-theme=dark] .ddga-stat--accent{--ddga-stat-accent-fg:var(--ddga-sa-300,#7ed3a8);--ddga-stat-accent-bg:#25935f2e}[data-theme=dark] .ddga-stat--accent[data-sentiment=positive]{--ddga-stat-accent-fg:var(--ddga-success-200,#abefc6);--ddga-stat-accent-bg:#0794552e}[data-theme=dark] .ddga-stat--accent[data-sentiment=negative]{--ddga-stat-accent-fg:var(--ddga-error-200,#fecdca);--ddga-stat-accent-bg:#d92d202e}[data-theme=dark] .ddga-stat--accent[data-sentiment=neutral]{--ddga-stat-accent-fg:var(--ddga-gray-300,#d2d6db);--ddga-stat-accent-bg:#ffffff14}.ddga-stat__label-row{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-stat__label{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);text-transform:uppercase;letter-spacing:.06em;line-height:1.4}[dir=rtl] .ddga-stat__label{letter-spacing:normal}.ddga-stat__icon{border-radius:var(--ddga-radius-md);background-color:var(--ddga-gray-100);block-size:2.25rem;inline-size:2.25rem;color:var(--ddga-gray-600);font-size:var(--ddga-font-size-lg);flex:none;justify-content:center;align-items:center;display:inline-flex}.ddga-stat__icon>svg{block-size:1em;inline-size:1em}.ddga-stat__value{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-2xl);font-weight:var(--ddga-font-weight-semibold);letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1.2}.ddga-stat__change-row{align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-stat__change{--ddga-stat-change-color:var(--ddga-text-secondary);align-items:center;gap:var(--ddga-space-1);color:var(--ddga-stat-change-color);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);font-variant-numeric:tabular-nums;display:inline-flex}.ddga-stat__change--positive{--ddga-stat-change-color:var(--ddga-color-success)}.ddga-stat__change--negative{--ddga-stat-change-color:var(--ddga-color-error)}.ddga-stat__change--neutral{--ddga-stat-change-color:var(--ddga-text-secondary)}.ddga-stat__change-icon{justify-content:center;align-items:center;font-size:.85em;display:inline-flex}.ddga-stat__change-icon>svg{block-size:1em;inline-size:1em}.ddga-stat__change-label{color:var(--ddga-text-tertiary);font-size:var(--ddga-font-size-sm)}.ddga-stat--sm{padding:var(--ddga-space-4)}.ddga-stat--sm .ddga-stat__value{font-size:var(--ddga-font-size-xl)}.ddga-stat--lg{gap:var(--ddga-space-2);padding:var(--ddga-space-6)}.ddga-stat--lg .ddga-stat__value{font-size:var(--ddga-font-size-3xl)}.ddga-stat-group{--ddga-stat-group-gap:var(--ddga-space-4)}.ddga-stat-group--gap-sm{--ddga-stat-group-gap:var(--ddga-space-3)}.ddga-stat-group--gap-md{--ddga-stat-group-gap:var(--ddga-space-4)}.ddga-stat-group--gap-lg{--ddga-stat-group-gap:var(--ddga-space-6)}.ddga-stat-group--horizontal{gap:var(--ddga-stat-group-gap);grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));display:grid}.ddga-stat-group--horizontal.ddga-stat-group--cols{grid-template-columns:repeat(var(--ddga-stat-group-columns), minmax(0, 1fr))}@media (max-width:40rem){.ddga-stat-group--horizontal.ddga-stat-group--cols{grid-template-columns:1fr}}.ddga-stat-group--vertical{gap:var(--ddga-stat-group-gap);flex-direction:column;display:flex}.ddga-stat-group .ddga-stat{max-inline-size:none}@media (forced-colors:active){.ddga-stat__icon{border:1px solid canvastext}.ddga-stat--accent{border-inline-start-color:highlight}}}
+@layer ddga-components{.ddga-stat{gap:var(--ddga-space-1);max-inline-size:20rem;padding:var(--ddga-space-5);background-color:var(--ddga-color-card);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);color:var(--ddga-color-card-foreground);flex-direction:column;display:flex}.ddga-stat--elevated{box-shadow:var(--ddga-shadow-md);border-color:#0000}.ddga-stat--elevated .ddga-stat__icon{border-radius:var(--ddga-radius-full);background-color:var(--ddga-sa-600);block-size:2.5rem;inline-size:2.5rem;color:var(--ddga-color-primary-foreground)}:is(.ddga-stat--accent,.ddga-stat--gradient){--ddga-stat-accent-fg:var(--ddga-sa-600);--ddga-stat-accent-bg:var(--ddga-sa-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=positive]{--ddga-stat-accent-fg:var(--ddga-success-600);--ddga-stat-accent-bg:var(--ddga-success-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=negative]{--ddga-stat-accent-fg:var(--ddga-error-600);--ddga-stat-accent-bg:var(--ddga-error-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=neutral]{--ddga-stat-accent-fg:var(--ddga-gray-600);--ddga-stat-accent-bg:var(--ddga-gray-100)}:is(.ddga-stat--accent,.ddga-stat--gradient) .ddga-stat__icon{background-color:var(--ddga-stat-accent-bg);color:var(--ddga-stat-accent-fg)}.ddga-stat--accent{border-inline-start:3px solid var(--ddga-stat-accent-fg)}.ddga-stat--gradient{box-shadow:var(--ddga-shadow-sm);background-image:linear-gradient(135deg, var(--ddga-stat-accent-bg), transparent 65%);border-color:#0000}[dir=rtl] .ddga-stat--gradient{background-image:linear-gradient(225deg, var(--ddga-stat-accent-bg), transparent 65%)}[data-theme=dark] .ddga-stat--flat .ddga-stat__icon{color:var(--ddga-gray-300,#d2d6db);background-color:#ffffff14}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient){--ddga-stat-accent-fg:var(--ddga-sa-300,#7ed3a8);--ddga-stat-accent-bg:#25935f2e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=positive]{--ddga-stat-accent-fg:var(--ddga-success-200,#abefc6);--ddga-stat-accent-bg:#0794552e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=negative]{--ddga-stat-accent-fg:var(--ddga-error-200,#fecdca);--ddga-stat-accent-bg:#d92d202e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=neutral]{--ddga-stat-accent-fg:var(--ddga-gray-300,#d2d6db);--ddga-stat-accent-bg:#ffffff14}.ddga-stat__label-row{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-stat__label{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);text-transform:uppercase;letter-spacing:.06em;line-height:1.4}[dir=rtl] .ddga-stat__label{letter-spacing:normal}.ddga-stat__icon{border-radius:var(--ddga-radius-md);background-color:var(--ddga-gray-100);block-size:2.25rem;inline-size:2.25rem;color:var(--ddga-gray-600);font-size:var(--ddga-font-size-lg);flex:none;justify-content:center;align-items:center;display:inline-flex}.ddga-stat__icon>svg{block-size:1em;inline-size:1em}.ddga-stat__value{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-2xl);font-weight:var(--ddga-font-weight-semibold);letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1.2}[dir=rtl] .ddga-stat__value{letter-spacing:normal}.ddga-stat__change-row{align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-stat__change{--ddga-stat-change-color:var(--ddga-text-secondary);align-items:center;gap:var(--ddga-space-1);color:var(--ddga-stat-change-color);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);font-variant-numeric:tabular-nums;display:inline-flex}.ddga-stat__change--positive{--ddga-stat-change-color:var(--ddga-color-success)}.ddga-stat__change--negative{--ddga-stat-change-color:var(--ddga-color-error)}.ddga-stat__change--neutral{--ddga-stat-change-color:var(--ddga-text-secondary)}.ddga-stat__change--chip{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-full);background-color:var(--ddga-gray-100)}.ddga-stat__change--chip.ddga-stat__change--positive{background-color:var(--ddga-success-50)}.ddga-stat__change--chip.ddga-stat__change--negative{background-color:var(--ddga-error-50)}[data-theme=dark] .ddga-stat__change--chip{background-color:#ffffff14}[data-theme=dark] .ddga-stat__change--chip.ddga-stat__change--positive{background-color:#0794552e}[data-theme=dark] .ddga-stat__change--chip.ddga-stat__change--negative{background-color:#d92d202e}.ddga-stat__change-icon{justify-content:center;align-items:center;font-size:.85em;display:inline-flex}.ddga-stat__change-icon>svg{block-size:1em;inline-size:1em}.ddga-stat__change-label{color:var(--ddga-text-tertiary);font-size:var(--ddga-font-size-sm)}.ddga-stat__chart{block-size:2.5rem;margin-block-start:var(--ddga-space-2)}.ddga-stat__chart>svg{block-size:100%;inline-size:100%;display:block}.ddga-stat--sm{padding:var(--ddga-space-4)}.ddga-stat--sm .ddga-stat__value{font-size:var(--ddga-font-size-xl)}.ddga-stat--lg{gap:var(--ddga-space-2);padding:var(--ddga-space-6)}.ddga-stat--lg .ddga-stat__value{font-size:var(--ddga-font-size-3xl)}.ddga-stat--xl{gap:var(--ddga-space-2);padding:var(--ddga-space-8)}.ddga-stat--xl .ddga-stat__value{font-size:2.5rem;line-height:1.1}.ddga-stat--xl .ddga-stat__chart{block-size:3.25rem}.ddga-stat-group{--ddga-stat-group-gap:var(--ddga-space-4)}.ddga-stat-group--gap-sm{--ddga-stat-group-gap:var(--ddga-space-3)}.ddga-stat-group--gap-md{--ddga-stat-group-gap:var(--ddga-space-4)}.ddga-stat-group--gap-lg{--ddga-stat-group-gap:var(--ddga-space-6)}.ddga-stat-group--horizontal{gap:var(--ddga-stat-group-gap);grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));display:grid}.ddga-stat-group--horizontal.ddga-stat-group--cols{grid-template-columns:repeat(var(--ddga-stat-group-columns), minmax(0, 1fr))}@media (max-width:40rem){.ddga-stat-group--horizontal.ddga-stat-group--cols{grid-template-columns:1fr}}.ddga-stat-group--vertical{gap:var(--ddga-stat-group-gap);flex-direction:column;display:flex}.ddga-stat-group .ddga-stat{max-inline-size:none}@media (forced-colors:active){.ddga-stat__icon,.ddga-stat__change--chip{border:1px solid canvastext}.ddga-stat--accent{border-inline-start-color:highlight}.ddga-stat--gradient{border:1px solid canvastext}}}
 /*# sourceMappingURL=stat.css.map */

package/dist/components/stat.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAWE,sRAeA,yEAIA,gMAQA,6JAOA,uIAIA,mIAIA,iIAIA,iHAYA,kHAIA,sHAIA,oJAIA,kJAIA,gJAKA,4GAOA,iMAUA,kDAIA,wQAYA,oDAKA,0MAWA,+EAMA,0RAUA,gFAGA,8EAKA,gFAIA,sGAOA,2DAKA,4FAMA,2CAGA,oEAGA,mEAIA,qEAMA,2DAGA,mEAGA,mEAGA,mEAIA,kIAKA,gIAIA,yBACE,8EAKF,6FAOA,iDAKA,8BAEE,6CAGA","sources":["src/components/stat.css"],"sourcesContent":["@layer ddga-components {\n  /* Self-contained KPI tile: owns its surface (padding/border/bg/radius) so\n     `<Stat>` renders a complete tile with no Card wrapper. `max-inline-size`\n     keeps a single tile from stretching full-width; inside a grid/flex the\n     container controls sizing. Logical properties keep it RTL-safe; numbers\n     stay LTR via Latin digits. Sentiment color flows through\n     --ddga-stat-change-color. The --ddga-color-card/-border/-success/-error\n     tokens (surface + change row) adapt automatically in dark mode, but the\n     -50/-100 badge tints are raw palette tokens that don't, so they get\n     explicit [data-theme='dark'] overrides (below). */\n\n  .ddga-stat {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    max-inline-size: 20rem;\n    padding: var(--ddga-space-5);\n    background-color: var(--ddga-color-card);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    color: var(--ddga-color-card-foreground);\n  }\n\n  /* ─── Variants ─── */\n  /* flat = the base surface (border + neutral badge). elevated/accent below. */\n\n  .ddga-stat--elevated {\n    border-color: transparent;\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-stat--elevated .ddga-stat__icon {\n    inline-size: 2.5rem;\n    block-size: 2.5rem;\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-sa-600);\n    color: var(--ddga-color-primary-foreground);\n  }\n\n  .ddga-stat--accent {\n    /* Edge bar + tinted badge color, keyed off the resolved sentiment\n       (data-sentiment on the root). Defaults to brand when no sentiment. */\n    --ddga-stat-accent-fg: var(--ddga-sa-600);\n    --ddga-stat-accent-bg: var(--ddga-sa-50);\n    border-inline-start: 3px solid var(--ddga-stat-accent-fg);\n  }\n  .ddga-stat--accent[data-sentiment='positive'] {\n    --ddga-stat-accent-fg: var(--ddga-success-600);\n    --ddga-stat-accent-bg: var(--ddga-success-50);\n  }\n  .ddga-stat--accent[data-sentiment='negative'] {\n    --ddga-stat-accent-fg: var(--ddga-error-600);\n    --ddga-stat-accent-bg: var(--ddga-error-50);\n  }\n  .ddga-stat--accent[data-sentiment='neutral'] {\n    --ddga-stat-accent-fg: var(--ddga-gray-600);\n    --ddga-stat-accent-bg: var(--ddga-gray-100);\n  }\n  .ddga-stat--accent .ddga-stat__icon {\n    background-color: var(--ddga-stat-accent-bg);\n    color: var(--ddga-stat-accent-fg);\n  }\n\n  /* ─── Dark mode ─── */\n  /* The -50/-100 badge tints are raw palette tokens (identical in dark) and read\n     near-white on a dark card. Use translucent fills + lighter foregrounds\n     (mirrors alert.css / empty-state.css). The change-row colors already adapt\n     via the semantic --ddga-color-* tokens, and the elevated brand badge\n     (--ddga-sa-600) stays legible in dark, so neither needs an override. */\n\n  [data-theme='dark'] .ddga-stat--flat .ddga-stat__icon {\n    background-color: rgb(255 255 255 / 0.08);\n    color: var(--ddga-gray-300, #d2d6db);\n  }\n  [data-theme='dark'] .ddga-stat--accent {\n    --ddga-stat-accent-fg: var(--ddga-sa-300, #7ed3a8);\n    --ddga-stat-accent-bg: rgb(37 147 95 / 0.18);\n  }\n  [data-theme='dark'] .ddga-stat--accent[data-sentiment='positive'] {\n    --ddga-stat-accent-fg: var(--ddga-success-200, #abefc6);\n    --ddga-stat-accent-bg: rgb(7 148 85 / 0.18);\n  }\n  [data-theme='dark'] .ddga-stat--accent[data-sentiment='negative'] {\n    --ddga-stat-accent-fg: var(--ddga-error-200, #fecdca);\n    --ddga-stat-accent-bg: rgb(217 45 32 / 0.18);\n  }\n  [data-theme='dark'] .ddga-stat--accent[data-sentiment='neutral'] {\n    --ddga-stat-accent-fg: var(--ddga-gray-300, #d2d6db);\n    --ddga-stat-accent-bg: rgb(255 255 255 / 0.08);\n  }\n\n  .ddga-stat__label-row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-stat__label {\n    color: var(--ddga-text-secondary);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.4;\n    text-transform: uppercase;\n    /* Tracked caps read as \"professional\" in LTR. Reset in RTL — letter-spacing\n       breaks Arabic cursive joining; uppercase is a harmless no-op on Arabic. */\n    letter-spacing: 0.06em;\n  }\n  [dir='rtl'] .ddga-stat__label {\n    letter-spacing: normal;\n  }\n\n  .ddga-stat__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: none;\n    inline-size: 2.25rem;\n    block-size: 2.25rem;\n    border-radius: var(--ddga-radius-md);\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-gray-600);\n    font-size: var(--ddga-font-size-lg);\n  }\n  .ddga-stat__icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-stat__value {\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-2xl);\n    font-weight: var(--ddga-font-weight-semibold);\n    /* tight leading for the large single-line numeric */\n    line-height: 1.2;\n    letter-spacing: -0.01em;\n    /* Align digits across a grid of tiles. */\n    font-variant-numeric: tabular-nums;\n  }\n\n  .ddga-stat__change-row {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-stat__change {\n    --ddga-stat-change-color: var(--ddga-text-secondary);\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-stat-change-color);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    font-variant-numeric: tabular-nums;\n  }\n  .ddga-stat__change--positive {\n    --ddga-stat-change-color: var(--ddga-color-success);\n  }\n  .ddga-stat__change--negative {\n    --ddga-stat-change-color: var(--ddga-color-error);\n  }\n  /* Same as the default — kept explicit so the three sentiment modifiers are\n     symmetric and `--neutral` is a stable override hook. */\n  .ddga-stat__change--neutral {\n    --ddga-stat-change-color: var(--ddga-text-secondary);\n  }\n\n  .ddga-stat__change-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    /* caret slightly smaller than the change text for hierarchy */\n    font-size: 0.85em;\n  }\n  .ddga-stat__change-icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-stat__change-label {\n    color: var(--ddga-text-tertiary);\n    font-size: var(--ddga-font-size-sm);\n  }\n\n  /* ─── Sizes (scale padding + value; lg also opens the root gap) ─── */\n  .ddga-stat--sm {\n    padding: var(--ddga-space-4);\n  }\n  .ddga-stat--sm .ddga-stat__value {\n    font-size: var(--ddga-font-size-xl);\n  }\n  .ddga-stat--lg {\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-6);\n  }\n  .ddga-stat--lg .ddga-stat__value {\n    font-size: var(--ddga-font-size-3xl);\n  }\n\n  /* ─── StatGroup (layout parent for Stat tiles) ─── */\n\n  .ddga-stat-group {\n    --ddga-stat-group-gap: var(--ddga-space-4);\n  }\n  .ddga-stat-group--gap-sm {\n    --ddga-stat-group-gap: var(--ddga-space-3);\n  }\n  .ddga-stat-group--gap-md {\n    --ddga-stat-group-gap: var(--ddga-space-4);\n  }\n  .ddga-stat-group--gap-lg {\n    --ddga-stat-group-gap: var(--ddga-space-6);\n  }\n\n  .ddga-stat-group--horizontal {\n    display: grid;\n    gap: var(--ddga-stat-group-gap);\n    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));\n  }\n  .ddga-stat-group--horizontal.ddga-stat-group--cols {\n    grid-template-columns: repeat(var(--ddga-stat-group-columns), minmax(0, 1fr));\n  }\n  /* Fixed columns collapse on narrow screens so content isn't crushed. */\n  @media (max-width: 40rem) {\n    .ddga-stat-group--horizontal.ddga-stat-group--cols {\n      grid-template-columns: 1fr;\n    }\n  }\n\n  .ddga-stat-group--vertical {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-stat-group-gap);\n  }\n\n  /* Inside a group, tiles fill their slot — release the standalone cap. */\n  .ddga-stat-group .ddga-stat {\n    max-inline-size: none;\n  }\n\n  /* ─── Forced colors ─── */\n  @media (forced-colors: active) {\n    /* Badge backgrounds flatten to Canvas; a border keeps the badge visible. */\n    .ddga-stat__icon {\n      border: 1px solid CanvasText;\n    }\n    .ddga-stat--accent {\n      border-inline-start-color: Highlight;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAWE,sRAeA,yEAIA,gMAUA,8HAIA,iKAIA,6JAIA,2JAIA,2IAMA,4EAMA,+JAKA,qHAWA,kHAIA,gJAIA,8KAIA,4KAIA,0KAKA,4GAOA,iMAUA,kDAIA,wQAYA,oDAKA,0MAYA,kDAIA,+EAMA,0RAUA,gFAGA,8EAKA,gFAMA,0KAMA,6FAGA,2FAGA,sEAGA,kGAGA,kGAIA,sGAOA,2DAKA,4FAQA,2EAIA,qEAOA,2CAGA,oEAGA,mEAIA,qEAKA,mEAIA,kEAIA,oDAMA,2DAGA,mEAGA,mEAGA,mEAIA,kIAKA,gIAIA,yBACE,8EAKF,6FAOA,iDAKA,8BAEE,sEAIA,uDAKA","sources":["src/components/stat.css"],"sourcesContent":["@layer ddga-components {\n  /* Self-contained KPI tile: owns its surface (padding/border/bg/radius) so\n     `<Stat>` renders a complete tile with no Card wrapper. `max-inline-size`\n     keeps a single tile from stretching full-width; inside a grid/flex the\n     container controls sizing. Logical properties keep it RTL-safe; numbers\n     stay LTR via Latin digits. Sentiment color flows through\n     --ddga-stat-change-color. The --ddga-color-card/-border/-success/-error\n     tokens (surface + change row) adapt automatically in dark mode, but the\n     -50/-100 badge tints are raw palette tokens that don't, so they get\n     explicit [data-theme='dark'] overrides (below). */\n\n  .ddga-stat {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    max-inline-size: 20rem;\n    padding: var(--ddga-space-5);\n    background-color: var(--ddga-color-card);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-md);\n    color: var(--ddga-color-card-foreground);\n  }\n\n  /* ─── Variants ─── */\n  /* flat = the base surface (border + neutral badge). elevated/accent below. */\n\n  .ddga-stat--elevated {\n    border-color: transparent;\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-stat--elevated .ddga-stat__icon {\n    inline-size: 2.5rem;\n    block-size: 2.5rem;\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-sa-600);\n    color: var(--ddga-color-primary-foreground);\n  }\n\n  /* accent + gradient share the sentiment-keyed tint vars (data-sentiment on\n     the root). Defaults to brand when no sentiment. */\n  :is(.ddga-stat--accent, .ddga-stat--gradient) {\n    --ddga-stat-accent-fg: var(--ddga-sa-600);\n    --ddga-stat-accent-bg: var(--ddga-sa-50);\n  }\n  :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='positive'] {\n    --ddga-stat-accent-fg: var(--ddga-success-600);\n    --ddga-stat-accent-bg: var(--ddga-success-50);\n  }\n  :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='negative'] {\n    --ddga-stat-accent-fg: var(--ddga-error-600);\n    --ddga-stat-accent-bg: var(--ddga-error-50);\n  }\n  :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='neutral'] {\n    --ddga-stat-accent-fg: var(--ddga-gray-600);\n    --ddga-stat-accent-bg: var(--ddga-gray-100);\n  }\n  :is(.ddga-stat--accent, .ddga-stat--gradient) .ddga-stat__icon {\n    background-color: var(--ddga-stat-accent-bg);\n    color: var(--ddga-stat-accent-fg);\n  }\n\n  /* accent: inline-start edge bar. */\n  .ddga-stat--accent {\n    border-inline-start: 3px solid var(--ddga-stat-accent-fg);\n  }\n\n  /* gradient: soft sentiment-tinted surface (elevated, borderless). The tint\n     fades from the inline-start corner; flip the angle in RTL. */\n  .ddga-stat--gradient {\n    border-color: transparent;\n    box-shadow: var(--ddga-shadow-sm);\n    background-image: linear-gradient(135deg, var(--ddga-stat-accent-bg), transparent 65%);\n  }\n  [dir='rtl'] .ddga-stat--gradient {\n    background-image: linear-gradient(225deg, var(--ddga-stat-accent-bg), transparent 65%);\n  }\n\n  /* ─── Dark mode ─── */\n  /* The -50/-100 badge tints are raw palette tokens (identical in dark) and read\n     near-white on a dark card. Use translucent fills + lighter foregrounds\n     (mirrors alert.css / empty-state.css). The change-row colors already adapt\n     via the semantic --ddga-color-* tokens, and the elevated brand badge\n     (--ddga-sa-600) stays legible in dark, so neither needs an override. */\n\n  [data-theme='dark'] .ddga-stat--flat .ddga-stat__icon {\n    background-color: rgb(255 255 255 / 0.08);\n    color: var(--ddga-gray-300, #d2d6db);\n  }\n  [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient) {\n    --ddga-stat-accent-fg: var(--ddga-sa-300, #7ed3a8);\n    --ddga-stat-accent-bg: rgb(37 147 95 / 0.18);\n  }\n  [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='positive'] {\n    --ddga-stat-accent-fg: var(--ddga-success-200, #abefc6);\n    --ddga-stat-accent-bg: rgb(7 148 85 / 0.18);\n  }\n  [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='negative'] {\n    --ddga-stat-accent-fg: var(--ddga-error-200, #fecdca);\n    --ddga-stat-accent-bg: rgb(217 45 32 / 0.18);\n  }\n  [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='neutral'] {\n    --ddga-stat-accent-fg: var(--ddga-gray-300, #d2d6db);\n    --ddga-stat-accent-bg: rgb(255 255 255 / 0.08);\n  }\n\n  .ddga-stat__label-row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-stat__label {\n    color: var(--ddga-text-secondary);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.4;\n    text-transform: uppercase;\n    /* Tracked caps read as \"professional\" in LTR. Reset in RTL — letter-spacing\n       breaks Arabic cursive joining; uppercase is a harmless no-op on Arabic. */\n    letter-spacing: 0.06em;\n  }\n  [dir='rtl'] .ddga-stat__label {\n    letter-spacing: normal;\n  }\n\n  .ddga-stat__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: none;\n    inline-size: 2.25rem;\n    block-size: 2.25rem;\n    border-radius: var(--ddga-radius-md);\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-gray-600);\n    font-size: var(--ddga-font-size-lg);\n  }\n  .ddga-stat__icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-stat__value {\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-2xl);\n    font-weight: var(--ddga-font-weight-semibold);\n    /* tight leading for the large single-line numeric */\n    line-height: 1.2;\n    letter-spacing: -0.01em;\n    /* Align digits across a grid of tiles. */\n    font-variant-numeric: tabular-nums;\n  }\n  /* Reset the tracking in RTL — values can carry Arabic text (e.g. \"مليون ريال\"),\n     and letter-spacing breaks Arabic cursive joining (mirrors __label above). */\n  [dir='rtl'] .ddga-stat__value {\n    letter-spacing: normal;\n  }\n\n  .ddga-stat__change-row {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-stat__change {\n    --ddga-stat-change-color: var(--ddga-text-secondary);\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-stat-change-color);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    font-variant-numeric: tabular-nums;\n  }\n  .ddga-stat__change--positive {\n    --ddga-stat-change-color: var(--ddga-color-success);\n  }\n  .ddga-stat__change--negative {\n    --ddga-stat-change-color: var(--ddga-color-error);\n  }\n  /* Same as the default — kept explicit so the three sentiment modifiers are\n     symmetric and `--neutral` is a stable override hook. */\n  .ddga-stat__change--neutral {\n    --ddga-stat-change-color: var(--ddga-text-secondary);\n  }\n\n  /* Chip: same text color, wrapped in a sentiment-tinted pill. The raw -50\n     tints get dark overrides below (mirrors the accent badge). */\n  .ddga-stat__change--chip {\n    padding-block: var(--ddga-space-1);\n    padding-inline: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-stat__change--chip.ddga-stat__change--positive {\n    background-color: var(--ddga-success-50);\n  }\n  .ddga-stat__change--chip.ddga-stat__change--negative {\n    background-color: var(--ddga-error-50);\n  }\n  [data-theme='dark'] .ddga-stat__change--chip {\n    background-color: rgb(255 255 255 / 0.08);\n  }\n  [data-theme='dark'] .ddga-stat__change--chip.ddga-stat__change--positive {\n    background-color: rgb(7 148 85 / 0.18);\n  }\n  [data-theme='dark'] .ddga-stat__change--chip.ddga-stat__change--negative {\n    background-color: rgb(217 45 32 / 0.18);\n  }\n\n  .ddga-stat__change-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    /* caret slightly smaller than the change text for hierarchy */\n    font-size: 0.85em;\n  }\n  .ddga-stat__change-icon > svg {\n    inline-size: 1em;\n    block-size: 1em;\n  }\n\n  .ddga-stat__change-label {\n    color: var(--ddga-text-tertiary);\n    font-size: var(--ddga-font-size-sm);\n  }\n\n  /* ─── Chart slot (consumer-supplied sparkline) ─── */\n  /* A styled slot with a consistent height; the dropped-in chart stretches to\n     fill. The library ships no charting dependency. */\n  .ddga-stat__chart {\n    margin-block-start: var(--ddga-space-2);\n    block-size: 2.5rem;\n  }\n  .ddga-stat__chart > svg {\n    display: block;\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  /* ─── Sizes (scale padding + value; lg/xl also open the root gap) ─── */\n  .ddga-stat--sm {\n    padding: var(--ddga-space-4);\n  }\n  .ddga-stat--sm .ddga-stat__value {\n    font-size: var(--ddga-font-size-xl);\n  }\n  .ddga-stat--lg {\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-6);\n  }\n  .ddga-stat--lg .ddga-stat__value {\n    font-size: var(--ddga-font-size-3xl);\n  }\n  /* Hero/display: no font-size token sits above 3xl, so the display value uses\n     a component-local rem (precedent: the .625rem label size). */\n  .ddga-stat--xl {\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-8);\n  }\n  .ddga-stat--xl .ddga-stat__value {\n    font-size: 2.5rem;\n    line-height: 1.1;\n  }\n  .ddga-stat--xl .ddga-stat__chart {\n    block-size: 3.25rem;\n  }\n\n  /* ─── StatGroup (layout parent for Stat tiles) ─── */\n\n  .ddga-stat-group {\n    --ddga-stat-group-gap: var(--ddga-space-4);\n  }\n  .ddga-stat-group--gap-sm {\n    --ddga-stat-group-gap: var(--ddga-space-3);\n  }\n  .ddga-stat-group--gap-md {\n    --ddga-stat-group-gap: var(--ddga-space-4);\n  }\n  .ddga-stat-group--gap-lg {\n    --ddga-stat-group-gap: var(--ddga-space-6);\n  }\n\n  .ddga-stat-group--horizontal {\n    display: grid;\n    gap: var(--ddga-stat-group-gap);\n    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));\n  }\n  .ddga-stat-group--horizontal.ddga-stat-group--cols {\n    grid-template-columns: repeat(var(--ddga-stat-group-columns), minmax(0, 1fr));\n  }\n  /* Fixed columns collapse on narrow screens so content isn't crushed. */\n  @media (max-width: 40rem) {\n    .ddga-stat-group--horizontal.ddga-stat-group--cols {\n      grid-template-columns: 1fr;\n    }\n  }\n\n  .ddga-stat-group--vertical {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-stat-group-gap);\n  }\n\n  /* Inside a group, tiles fill their slot — release the standalone cap. */\n  .ddga-stat-group .ddga-stat {\n    max-inline-size: none;\n  }\n\n  /* ─── Forced colors ─── */\n  @media (forced-colors: active) {\n    /* Badge + chip backgrounds flatten to Canvas; a border keeps them visible. */\n    .ddga-stat__icon,\n    .ddga-stat__change--chip {\n      border: 1px solid CanvasText;\n    }\n    .ddga-stat--accent {\n      border-inline-start-color: Highlight;\n    }\n    /* gradient flattens its tinted surface + has a transparent border, so it\n       would lose its boundary — restore one. */\n    .ddga-stat--gradient {\n      border: 1px solid CanvasText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/switch.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-switch-row{align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-switch{background-color:var(--ddga-color-input);cursor:pointer;border:1px solid #0000;border-radius:999px;flex-shrink:0;align-items:center;padding:0;transition:background-color .15s,border-color .15s,box-shadow .15s;display:inline-flex;position:relative}.ddga-switch--md{--ddga-switch-thumb-travel:16px;block-size:22px;inline-size:38px}.ddga-switch--sm{--ddga-switch-thumb-travel:12px;block-size:18px;inline-size:30px}.ddga-switch[data-state=checked]{background-color:var(--ddga-color-primary)}.ddga-switch:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-switch--error{background-color:var(--ddga-color-background);border-color:var(--ddga-color-error)}.ddga-switch--error[data-state=checked]{background-color:var(--ddga-color-error);border-color:var(--ddga-color-error)}.ddga-switch--error:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-error)}.ddga-switch:disabled{opacity:.5;cursor:not-allowed}.ddga-switch-row:has(.ddga-switch:disabled) .ddga-switch__label{cursor:not-allowed;color:var(--ddga-text-tertiary)}.ddga-switch__thumb{aspect-ratio:1;background-color:var(--ddga-color-background);will-change:translate;border-radius:999px;block-size:calc(100% - 4px);margin-inline-start:2px;transition:translate .15s;display:block;translate:0;box-shadow:0 1px 2px #00000026}.ddga-switch[data-state=checked] .ddga-switch__thumb{translate:var(--ddga-switch-thumb-travel) 0}[dir=rtl] .ddga-switch[data-state=checked] .ddga-switch__thumb{translate:calc(var(--ddga-switch-thumb-travel) * -1) 0}[data-theme=dark] .ddga-switch__thumb{background-color:#f3f4f6;box-shadow:0 1px 2px #0006}.ddga-switch__label{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);cursor:pointer;line-height:1.4}.ddga-switch__required{color:var(--ddga-color-error);margin-inline-start:.125rem}@media (prefers-reduced-motion:reduce){.ddga-switch,.ddga-switch__thumb{transition:none}}@media (forced-colors:active){.ddga-switch{background-color:canvas;border:1px solid canvastext}.ddga-switch[data-state=checked]{background-color:highlight}.ddga-switch__thumb{box-shadow:none;background-color:canvastext}.ddga-switch[data-state=checked] .ddga-switch__thumb{background-color:highlighttext}.ddga-switch:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-switch:disabled{border-color:graytext}}}
+@layer ddga-components{.ddga-switch-row{align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-switch{background-color:var(--ddga-color-input);cursor:pointer;border:1px solid #0000;border-radius:999px;flex-shrink:0;align-items:center;padding:0;transition:background-color .15s,border-color .15s,box-shadow .15s;display:inline-flex;position:relative}.ddga-switch--md{--ddga-switch-thumb-travel:16px;block-size:22px;inline-size:38px}.ddga-switch--sm{--ddga-switch-thumb-travel:12px;block-size:18px;inline-size:30px}.ddga-switch[data-state=checked]{background-color:var(--ddga-color-primary)}.ddga-switch:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-switch--error{background-color:var(--ddga-color-background);border-color:var(--ddga-color-error)}.ddga-switch--error[data-state=checked]{background-color:var(--ddga-color-error);border-color:var(--ddga-color-error)}.ddga-switch--error:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-error)}.ddga-switch:disabled{opacity:.5;cursor:not-allowed}.ddga-switch-row:has(.ddga-switch:disabled) .ddga-switch__label{cursor:not-allowed;color:var(--ddga-text-tertiary)}.ddga-switch__thumb{aspect-ratio:1;background-color:var(--ddga-color-background);will-change:translate;border-radius:999px;block-size:calc(100% - 4px);margin-inline-start:2px;transition:translate .15s;display:block;translate:0;box-shadow:0 1px 2px #00000026}.ddga-switch[data-state=checked] .ddga-switch__thumb{translate:var(--ddga-switch-thumb-travel) 0}[dir=rtl] .ddga-switch[data-state=checked] .ddga-switch__thumb{translate:calc(var(--ddga-switch-thumb-travel) * -1) 0}[data-theme=dark] .ddga-switch__thumb{background-color:var(--ddga-gray-100);box-shadow:0 1px 2px #0006}.ddga-switch__label{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);cursor:pointer;line-height:1.4}.ddga-switch__required{color:var(--ddga-color-error);margin-inline-start:.125rem}@media (prefers-reduced-motion:reduce){.ddga-switch,.ddga-switch__thumb{transition:none}}@media (forced-colors:active){.ddga-switch{background-color:canvas;border:1px solid canvastext}.ddga-switch[data-state=checked]{background-color:highlight}.ddga-switch__thumb{box-shadow:none;background-color:canvastext}.ddga-switch[data-state=checked] .ddga-switch__thumb{background-color:highlighttext}.ddga-switch:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-switch:disabled{border-color:graytext}}}
 /*# sourceMappingURL=switch.css.map */