@dev-dga/css 0.10.1 → 0.12.0

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,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.5;\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":[]}
+{"version":3,"mappings":"AAAA,uBACE,4GASA,qFAMA,uFAIA,sMAUA,wDAIA,+JASA,yUAiBA,8KAWA,oGAOA,iHAKA,mGAIA,2FAIA,+OAMA,sIAKA,gHAMA,gGAIA,yGAKA,yKAKA,kFAMA,6IASA,wJAQA,+JAcA,sHASA,iMASA,kEAIA,iHAOA,iJASA,4EAIA,gFAKA,0HAKA,iIAKA,2HAKA,iIAMA,mPAYA,mRAgBA,uHAKA,yGAKA,2GAKA,8JAUA,8BACE","sources":["src/components/file-upload.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-file-upload {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-4);\n    color: var(--ddga-text-primary);\n  }\n\n  /* ─── Label + description ─── */\n\n  .ddga-file-upload__header {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n  }\n\n  .ddga-file-upload[data-variant='button'] > .ddga-file-upload__browse {\n    align-self: flex-start;\n  }\n\n  .ddga-file-upload__label {\n    display: flex;\n    align-items: flex-end;\n    gap: 0.25rem;\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-base);\n    font-weight: var(--ddga-font-weight-regular);\n    line-height: 1.5;\n  }\n\n  .ddga-file-upload__required {\n    color: var(--ddga-error-700);\n  }\n\n  .ddga-file-upload__description {\n    color: var(--ddga-text-secondary);\n    font-size: var(--ddga-font-size-xs);\n    font-weight: var(--ddga-font-weight-regular);\n    line-height: 1.5;\n  }\n\n  /* ─── Drop zone ─── */\n\n  .ddga-file-upload__dropzone {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-6);\n    padding: var(--ddga-space-6);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-muted);\n    text-align: center;\n    cursor: pointer;\n    transition:\n      background-color 150ms ease,\n      color 150ms ease;\n  }\n\n  .ddga-file-upload__border {\n    position: absolute;\n    inset: 0;\n    inline-size: 100%;\n    block-size: 100%;\n    overflow: visible;\n    color: var(--ddga-color-input);\n    pointer-events: none;\n    transition: color 150ms ease;\n  }\n\n  .ddga-file-upload__border rect {\n    fill: none;\n    stroke: currentColor;\n    stroke-width: 1;\n    stroke-dasharray: 10 5;\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] {\n    background-color: var(--ddga-success-25);\n    color: var(--ddga-success-700);\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__border {\n    color: var(--ddga-success-700);\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__border rect {\n    stroke-width: 2;\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__icon,\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__title,\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__description {\n    color: var(--ddga-success-700);\n  }\n\n  .ddga-file-upload__dropzone[data-dragging] .ddga-file-upload__browse {\n    background-color: var(--ddga-gray-200);\n    color: var(--ddga-gray-400);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] {\n    cursor: not-allowed;\n    background-color: transparent;\n    color: var(--ddga-gray-400);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__border {\n    color: var(--ddga-gray-400);\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__icon {\n    color: var(--ddga-gray-400);\n    opacity: 0.7;\n  }\n\n  .ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__title,\n  .ddga-file-upload__dropzone[data-disabled] .ddga-file-upload__description {\n    color: var(--ddga-gray-400);\n  }\n\n  .ddga-file-upload__icon {\n    flex: none;\n    font-size: 1.5rem;\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-file-upload__copy {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    word-break: break-word;\n  }\n\n  .ddga-file-upload__title {\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-base);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1.5;\n  }\n\n  /* Visually-hidden real file input (the Browse button is the keyboard trigger). */\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__file {\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-file-upload__file--error {\n    border-color: var(--ddga-error-700);\n  }\n\n  .ddga-file-upload__file-main {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-2);\n  }\n\n  .ddga-file-upload__file-indicator {\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n  }\n\n  .ddga-file-upload__file-indicator--loading {\n    color: var(--ddga-text-secondary);\n  }\n\n  .ddga-file-upload__file-indicator--loading svg {\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  .ddga-file-upload__file-indicator--success,\n  .ddga-file-upload__file-indicator--error {\n    border-radius: var(--ddga-radius-full);\n  }\n\n  .ddga-file-upload__file-indicator--success {\n    background-color: var(--ddga-color-success);\n    color: var(--ddga-color-success-foreground);\n  }\n\n  .ddga-file-upload__file-indicator--error {\n    background-color: var(--ddga-color-error);\n    color: var(--ddga-color-error-foreground);\n  }\n\n  .ddga-file-upload__file-indicator--success svg,\n  .ddga-file-upload__file-indicator--error svg {\n    inline-size: 0.75rem;\n    block-size: 0.75rem;\n  }\n\n  .ddga-file-upload__file-name {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1.4286;\n  }\n\n  .ddga-file-upload__file-remove {\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n    padding: 0;\n    border: 0;\n    border-radius: var(--ddga-radius-sm);\n    background: transparent;\n    color: var(--ddga-text-secondary);\n    font-size: 1rem;\n    cursor: pointer;\n  }\n\n  .ddga-file-upload__file-remove:hover {\n    background-color: var(--ddga-color-secondary-hover);\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-file-upload__file-remove:focus-visible {\n    outline: 2px solid var(--ddga-color-ring);\n    outline-offset: 1px;\n  }\n\n  .ddga-file-upload__file-error-row {\n    padding: var(--ddga-space-2);\n    border-top: 1px solid var(--ddga-color-input);\n  }\n\n  .ddga-file-upload__file-error {\n    color: var(--ddga-color-error);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-regular);\n    line-height: 1.4286;\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  /* color/bg are neutralized in forced-colors — keep the active target visible. */\n  @media (forced-colors: active) {\n    .ddga-file-upload__dropzone[data-dragging] {\n      outline: 2px solid Highlight;\n      outline-offset: -2px;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/filtration.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-filtration__trigger .ddga-button__icon:last-child{transition:transform .15s}.ddga-filtration__trigger[data-state=open] .ddga-button__icon:last-child{transform:rotate(180deg)}.ddga-filtration-panel{gap:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);flex-direction:column;inline-size:20rem;max-inline-size:20rem;padding:0;display:flex;overflow:clip}.ddga-popover.ddga-filtration-panel{max-block-size:var(--radix-popover-content-available-height);overflow-y:auto}.ddga-filtration-panel--inline{background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border)}.ddga-filtration__divider{block-size:1px;margin-inline:var(--ddga-space-2);background-color:var(--ddga-color-input)}.ddga-filtration-section{gap:var(--ddga-space-5);padding-block:var(--ddga-space-4);padding-inline:var(--ddga-space-2);flex-direction:column;display:flex}.ddga-filtration-section__label{font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-primary);margin:0;line-height:1.4286}.ddga-filtration-section__count{font-weight:var(--ddga-font-weight-regular);color:var(--ddga-text-tertiary)}.ddga-filtration-checkbox-filter,.ddga-filtration-checkbox-filter__list{gap:var(--ddga-space-3);flex-direction:column;display:flex}.ddga-filtration-checkbox-filter__count{color:var(--ddga-text-tertiary)}.ddga-filtration-checkbox-filter__more{align-items:center;gap:var(--ddga-space-1);padding-block:var(--ddga-space-1);font:inherit;font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-primary);cursor:pointer;background:0 0;border:0;align-self:flex-start;padding-inline:0;display:inline-flex}.ddga-filtration-checkbox-filter__more:focus-visible{outline:2px solid var(--ddga-color-ring);outline-offset:2px;border-radius:var(--ddga-radius-sm)}.ddga-filtration-checkbox-filter__more-icon{block-size:1rem;inline-size:1rem;transition:transform .15s}.ddga-filtration-checkbox-filter__more-icon.is-open{transform:rotate(180deg)}.ddga-filtration-option-list{gap:var(--ddga-space-3);flex-direction:column;display:flex}.ddga-filtration-option{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding:var(--ddga-space-2);font:inherit;font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);text-align:start;cursor:pointer;border-radius:var(--ddga-radius-sm);background:0 0;border:0;line-height:1.4286;display:flex}.ddga-filtration-option:hover{background-color:var(--ddga-color-muted)}.ddga-filtration-option:focus-visible{outline:2px solid var(--ddga-color-ring);outline-offset:-2px}.ddga-filtration-option__indicator{color:var(--ddga-color-primary);display:inline-flex}.ddga-filtration-option__check{block-size:1.25rem;inline-size:1.25rem}.ddga-filtration-results{gap:var(--ddga-space-2);flex-wrap:wrap;margin-block-start:var(--ddga-space-2);display:flex}.ddga-filtration-footer{gap:var(--ddga-space-2);padding:var(--ddga-space-2);display:flex}.ddga-filtration-footer__apply{flex:1}@media (prefers-reduced-motion:reduce){.ddga-filtration__trigger .ddga-button__icon:last-child,.ddga-filtration-checkbox-filter__more-icon{transition-duration:0s}}@media (forced-colors:active){.ddga-filtration-panel--inline{border:1px solid canvastext}.ddga-filtration__divider{background-color:canvastext}.ddga-filtration-checkbox-filter__more:focus-visible,.ddga-filtration-option:focus-visible{outline:2px solid canvastext}}}
+/*# sourceMappingURL=filtration.css.map */

package/dist/components/filtration.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAEE,kFAGA,kGAOA,sLAWA,iHAKA,0JAQA,oHAOA,yJAQA,2KAQA,4GAMA,mIAYA,wEAIA,gVAgBA,qJAMA,uGAKA,6EAKA,wFAMA,yVAkBA,uEAIA,mGAKA,uFAKA,sEAMA,oHAQA,yFAMA,sCAIA,uCACE,4HASF,8BACE,2DAGA,sDAGA","sources":["src/components/filtration.css"],"sourcesContent":["@layer ddga-components {\n  /* Trigger — the black \"Filter\" button; chevron flips when the panel is open. */\n  .ddga-filtration__trigger .ddga-button__icon:last-child {\n    transition: transform 150ms ease;\n  }\n  .ddga-filtration__trigger[data-state='open'] .ddga-button__icon:last-child {\n    transform: rotate(180deg);\n  }\n\n  /* Panel — 320px stack, SDGA `radius-sm`. Sections own their insets; an 8px gap\n     plus explicit inset hairlines separate every child. Overlay reuses\n     .ddga-popover's surface (border/shadow/bg); inline draws its own. */\n  .ddga-filtration-panel {\n    inline-size: 20rem;\n    max-inline-size: 20rem;\n    padding: 0;\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n    border-radius: var(--ddga-radius-sm);\n    overflow: clip;\n  }\n\n  .ddga-popover.ddga-filtration-panel {\n    max-block-size: var(--radix-popover-content-available-height);\n    overflow-y: auto;\n  }\n\n  .ddga-filtration-panel--inline {\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-color-foreground);\n    border: 1px solid var(--ddga-color-border);\n  }\n\n  /* Hairline between panel children — 304px (inset 8px each side), floating in\n     the 8px inter-child gap. */\n  .ddga-filtration__divider {\n    block-size: 1px;\n    margin-inline: var(--ddga-space-2);\n    background-color: var(--ddga-color-input);\n  }\n\n  /* Section — labelled filter group: 16/8 padding, 20px label↔body gap. */\n  .ddga-filtration-section {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-5);\n    padding-block: var(--ddga-space-4);\n    padding-inline: var(--ddga-space-2);\n  }\n\n  .ddga-filtration-section__label {\n    margin: 0;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.4286;\n    color: var(--ddga-text-primary);\n  }\n\n  .ddga-filtration-section__count {\n    font-weight: var(--ddga-font-weight-regular);\n    color: var(--ddga-text-tertiary);\n  }\n\n  /* Checkbox filter — searchable, collapsible multi-select group. */\n  .ddga-filtration-checkbox-filter {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-filtration-checkbox-filter__list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-filtration-checkbox-filter__count {\n    color: var(--ddga-text-tertiary);\n  }\n\n  .ddga-filtration-checkbox-filter__more {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    align-self: flex-start;\n    padding-block: var(--ddga-space-1);\n    padding-inline: 0;\n    border: 0;\n    background: none;\n    font: inherit;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n  }\n\n  .ddga-filtration-checkbox-filter__more:focus-visible {\n    outline: 2px solid var(--ddga-color-ring);\n    outline-offset: 2px;\n    border-radius: var(--ddga-radius-sm);\n  }\n\n  .ddga-filtration-checkbox-filter__more-icon {\n    inline-size: 1rem;\n    block-size: 1rem;\n    transition: transform 150ms ease;\n  }\n  .ddga-filtration-checkbox-filter__more-icon.is-open {\n    transform: rotate(180deg);\n  }\n\n  /* Option list — single-select rows with a trailing check (Radix RadioGroup). */\n  .ddga-filtration-option-list {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-filtration-option {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding: var(--ddga-space-2);\n    border: 0;\n    background: none;\n    font: inherit;\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n    color: var(--ddga-text-primary);\n    text-align: start;\n    cursor: pointer;\n    border-radius: var(--ddga-radius-sm);\n  }\n\n  .ddga-filtration-option:hover {\n    background-color: var(--ddga-color-muted);\n  }\n\n  .ddga-filtration-option:focus-visible {\n    outline: 2px solid var(--ddga-color-ring);\n    outline-offset: -2px;\n  }\n\n  .ddga-filtration-option__indicator {\n    display: inline-flex;\n    color: var(--ddga-color-primary);\n  }\n\n  .ddga-filtration-option__check {\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n  }\n\n  /* Results — row of dismissible filter chips under the trigger. */\n  .ddga-filtration-results {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--ddga-space-2);\n    margin-block-start: var(--ddga-space-2);\n  }\n\n  /* Footer — Apply (green, grows) + Clear. 56px (40px buttons + 8px inset). */\n  .ddga-filtration-footer {\n    display: flex;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-2);\n  }\n\n  .ddga-filtration-footer__apply {\n    flex: 1;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-filtration__trigger .ddga-button__icon:last-child,\n    .ddga-filtration-checkbox-filter__more-icon {\n      transition-duration: 0ms;\n    }\n  }\n\n  /* Dark mode: the inline surface uses semantic --ddga-color-* tokens, which\n     remap in dark.css — no override needed. */\n\n  @media (forced-colors: active) {\n    .ddga-filtration-panel--inline {\n      border: 1px solid CanvasText;\n    }\n    .ddga-filtration__divider {\n      background-color: CanvasText;\n    }\n    .ddga-filtration-checkbox-filter__more:focus-visible,\n    .ddga-filtration-option:focus-visible {\n      outline: 2px solid CanvasText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/floating-button.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-floating-button{justify-content:center;align-items:center;gap:var(--ddga-space-2);border-radius:var(--ddga-radius-full);font-family:inherit;font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-base);cursor:pointer;border:none;line-height:1.5rem;text-decoration:none;transition:background-color .15s,color .15s;display:inline-flex;position:relative}@media (prefers-reduced-motion:reduce){.ddga-floating-button{transition:none}}.ddga-floating-button--sm{padding:var(--ddga-space-4)}.ddga-floating-button--lg{padding:var(--ddga-space-5)}.ddga-floating-button__icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-floating-button__icon svg{width:24px;height:24px}.ddga-floating-button__text{white-space:nowrap}.ddga-floating-button--primary{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground)}.ddga-floating-button--primary:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-primary-hover)}.ddga-floating-button--primary:active:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-primary-active)}.ddga-floating-button--primary[aria-pressed=true]{background-color:var(--ddga-sa-800)}.ddga-floating-button--black{background-color:var(--ddga-gray-950);color:#fff}.ddga-floating-button--black:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-gray-800)}.ddga-floating-button--black:active:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-gray-600)}.ddga-floating-button--black[aria-pressed=true]{background-color:var(--ddga-gray-700)}.ddga-floating-button--secondary{background-color:var(--ddga-color-secondary);color:var(--ddga-text-primary)}.ddga-floating-button--secondary:hover:not(:disabled):not([aria-disabled=true]),.ddga-floating-button--secondary:active:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-color-secondary-hover)}.ddga-floating-button--secondary[aria-pressed=true]{background-color:var(--ddga-gray-200)}.ddga-floating-button:focus-visible{outline:none}.ddga-floating-button:focus-visible:after{content:"";border:3px solid var(--ddga-text-primary);border-radius:var(--ddga-radius-full);pointer-events:none;position:absolute;inset:-5px}.ddga-floating-button--on-color:focus-visible:after{border-color:#fff}.ddga-floating-button:disabled,.ddga-floating-button[aria-disabled=true]{cursor:not-allowed;background-color:var(--ddga-gray-200);color:var(--ddga-gray-400)}[data-theme=dark] .ddga-floating-button:not(.ddga-floating-button--on-color):disabled,[data-theme=dark] .ddga-floating-button:not(.ddga-floating-button--on-color)[aria-disabled=true]{background-color:var(--ddga-gray-800);color:var(--ddga-gray-500)}.ddga-floating-button--on-color.ddga-floating-button--black{color:var(--ddga-text-primary);background-color:#fff}.ddga-floating-button--on-color.ddga-floating-button--black:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-alpha-white-80)}.ddga-floating-button--on-color.ddga-floating-button--black:active:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-alpha-white-60)}.ddga-floating-button--on-color.ddga-floating-button--black[aria-pressed=true]{background-color:var(--ddga-alpha-white-70)}.ddga-floating-button--on-color.ddga-floating-button--secondary{color:#fff;background-color:#0000}.ddga-floating-button--on-color.ddga-floating-button--secondary:hover:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-alpha-white-20)}.ddga-floating-button--on-color.ddga-floating-button--secondary:active:not(:disabled):not([aria-disabled=true]){background-color:var(--ddga-alpha-white-40)}.ddga-floating-button--on-color.ddga-floating-button--secondary[aria-pressed=true]{background-color:var(--ddga-alpha-white-30)}.ddga-floating-button--on-color:disabled,.ddga-floating-button--on-color[aria-disabled=true]{background-color:var(--ddga-alpha-white-20);color:var(--ddga-alpha-white-40)}@media (forced-colors:active){.ddga-floating-button{border:1px solid buttontext}.ddga-floating-button:focus-visible{outline-offset:2px;outline:2px solid highlight}.ddga-floating-button:disabled,.ddga-floating-button[aria-disabled=true]{color:graytext}}}
+/*# sourceMappingURL=floating-button.css.map */

package/dist/components/floating-button.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAIE,uXAmBA,uCACE,uCAMF,sDAGA,sDAKA,wGAMA,uDAIA,+CAKA,qHAIA,+HAGA,iIAGA,sFAKA,8EAIA,kHAGA,mHAGA,sFAKA,6GAIA,oNAMA,0FAKA,iDAGA,sLAQA,sEAKA,6JAOA,wPAYA,iHAIA,uJAKA,wJAKA,2HAIA,kGAIA,2JAKA,4JAKA,+HAKA,0KAMA,8BAEE,kDAGA,mFAIA","sources":["src/components/floating-button.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Base ─── */\n  /* SDGA Floating Button is a flat circle/pill — NO drop-shadow (the Figma\n     component renders exactly 56/64 square; positioning is the consumer's job). */\n  .ddga-floating-button {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-2);\n    border: none;\n    border-radius: var(--ddga-radius-full);\n    font-family: inherit;\n    font-weight: var(--ddga-font-weight-medium);\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5rem;\n    text-decoration: none;\n    cursor: pointer;\n    transition:\n      background-color 150ms ease,\n      color 150ms ease;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-floating-button {\n      transition: none;\n    }\n  }\n\n  /* ─── Sizes (icon fixed 24px , padding drives the 56/64 circle) ─── */\n  .ddga-floating-button--sm {\n    padding: var(--ddga-space-4);\n  }\n  .ddga-floating-button--lg {\n    padding: var(--ddga-space-5);\n  }\n\n  /* ─── Icon + label ─── */\n  .ddga-floating-button__icon {\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n  }\n  .ddga-floating-button__icon svg {\n    width: 24px;\n    height: 24px;\n  }\n  .ddga-floating-button__text {\n    white-space: nowrap;\n  }\n\n  /* ─── Variant: Primary (Primary-Brand — green) ─── */\n  .ddga-floating-button--primary {\n    background-color: var(--ddga-color-primary);\n    color: var(--ddga-color-primary-foreground);\n  }\n  .ddga-floating-button--primary:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-primary-hover);\n  }\n  .ddga-floating-button--primary:active:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-primary-active);\n  }\n  .ddga-floating-button--primary[aria-pressed='true'] {\n    background-color: var(--ddga-sa-800);\n  }\n\n  /* ─── Variant: Black (Primary-Neutral — dark) ─── */\n  .ddga-floating-button--black {\n    background-color: var(--ddga-gray-950);\n    color: #ffffff;\n  }\n  .ddga-floating-button--black:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-gray-800);\n  }\n  .ddga-floating-button--black:active:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-gray-600);\n  }\n  .ddga-floating-button--black[aria-pressed='true'] {\n    background-color: var(--ddga-gray-700);\n  }\n\n  /* ─── Variant: Secondary (Secondary-Solid — gray; ink = #161616) ─── */\n  .ddga-floating-button--secondary {\n    background-color: var(--ddga-color-secondary);\n    color: var(--ddga-text-primary);\n  }\n  .ddga-floating-button--secondary:hover:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-secondary-hover);\n  }\n  .ddga-floating-button--secondary:active:not(:disabled):not([aria-disabled='true']) {\n    background-color: var(--ddga-color-secondary-hover);\n  }\n  .ddga-floating-button--secondary[aria-pressed='true'] {\n    background-color: var(--ddga-gray-200);\n  }\n\n  /* ─── Focus ring (single 3px ink ring, ~2px gap , SDGA \"Focus outline\" inset -5) ─── */\n  .ddga-floating-button:focus-visible {\n    outline: none;\n  }\n  .ddga-floating-button:focus-visible::after {\n    content: '';\n    position: absolute;\n    inset: -5px;\n    border: 3px solid var(--ddga-text-primary);\n    border-radius: var(--ddga-radius-full);\n    pointer-events: none;\n  }\n  .ddga-floating-button--on-color:focus-visible::after {\n    border-color: #ffffff;\n  }\n\n  /* ─── Disabled (all styles → gray-200 fill / gray-400 ink, no opacity) ─── */\n  .ddga-floating-button:disabled,\n  .ddga-floating-button[aria-disabled='true'] {\n    cursor: not-allowed;\n    background-color: var(--ddga-gray-200);\n    color: var(--ddga-gray-400);\n  }\n  /* Dark: raw gray-200/400 don't flip → light-gray circle on dark. Remap (on-color keeps its own). */\n  [data-theme='dark'] .ddga-floating-button:not(.ddga-floating-button--on-color):disabled,\n  [data-theme='dark']\n    .ddga-floating-button:not(.ddga-floating-button--on-color)[aria-disabled='true'] {\n    background-color: var(--ddga-gray-800);\n    color: var(--ddga-gray-500);\n  }\n\n  /* ─── On color (colored / dark surface) ─── */\n  /* `primary` stays brand-green (only the focus ring flips white, above). `black`\n     → white solid + dark icon; `secondary` → white-on-transparent. Both ramp on the\n     alpha-white scale (= SDGA `button-background-oncolor-*` / `-transparent-*`;\n     black-pressed = `alpha-white-60`, normalizing a one-cell Figma slip to gray-200). */\n  .ddga-floating-button--on-color.ddga-floating-button--black {\n    background-color: #ffffff;\n    color: var(--ddga-text-primary);\n  }\n  .ddga-floating-button--on-color.ddga-floating-button--black:hover:not(:disabled):not(\n      [aria-disabled='true']\n    ) {\n    background-color: var(--ddga-alpha-white-80);\n  }\n  .ddga-floating-button--on-color.ddga-floating-button--black:active:not(:disabled):not(\n      [aria-disabled='true']\n    ) {\n    background-color: var(--ddga-alpha-white-60);\n  }\n  .ddga-floating-button--on-color.ddga-floating-button--black[aria-pressed='true'] {\n    background-color: var(--ddga-alpha-white-70);\n  }\n\n  .ddga-floating-button--on-color.ddga-floating-button--secondary {\n    background-color: transparent;\n    color: #ffffff;\n  }\n  .ddga-floating-button--on-color.ddga-floating-button--secondary:hover:not(:disabled):not(\n      [aria-disabled='true']\n    ) {\n    background-color: var(--ddga-alpha-white-20);\n  }\n  .ddga-floating-button--on-color.ddga-floating-button--secondary:active:not(:disabled):not(\n      [aria-disabled='true']\n    ) {\n    background-color: var(--ddga-alpha-white-40);\n  }\n  .ddga-floating-button--on-color.ddga-floating-button--secondary[aria-pressed='true'] {\n    background-color: var(--ddga-alpha-white-30);\n  }\n\n  /* On-color disabled (all styles): translucent-white fill + icon (overrides base). */\n  .ddga-floating-button--on-color:disabled,\n  .ddga-floating-button--on-color[aria-disabled='true'] {\n    background-color: var(--ddga-alpha-white-20);\n    color: var(--ddga-alpha-white-40);\n  }\n\n  @media (forced-colors: active) {\n    /* Flat, borderless, shadowless → needs a system border to be distinguishable in HCM. */\n    .ddga-floating-button {\n      border: 1px solid ButtonText;\n    }\n    .ddga-floating-button:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n    .ddga-floating-button:disabled,\n    .ddga-floating-button[aria-disabled='true'] {\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/inline-alert.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-inline-alert{--ddga-inline-alert-stripe:var(--ddga-gray-200);--ddga-inline-alert-icon-bg:var(--ddga-gray-50);--ddga-inline-alert-icon-fg:var(--ddga-text-primary);--ddga-inline-alert-tint-bg:var(--ddga-gray-25);--ddga-inline-alert-tint-border:var(--ddga-gray-300);--ddga-inline-alert-tint-title:var(--ddga-gray-800);gap:var(--ddga-space-4);padding-block:var(--ddga-space-4);padding-inline:var(--ddga-space-6);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:#fff;flex-direction:column;font-family:inherit;display:flex;position:relative;overflow:hidden;container-type:inline-size}.ddga-inline-alert--color{background-color:var(--ddga-inline-alert-tint-bg);border-color:var(--ddga-inline-alert-tint-border)}.ddga-inline-alert--neutral{--ddga-inline-alert-stripe:var(--ddga-gray-200);--ddga-inline-alert-icon-bg:var(--ddga-gray-50);--ddga-inline-alert-icon-fg:var(--ddga-text-primary);--ddga-inline-alert-tint-bg:var(--ddga-gray-25);--ddga-inline-alert-tint-border:var(--ddga-gray-300);--ddga-inline-alert-tint-title:var(--ddga-gray-800)}.ddga-inline-alert--info{--ddga-inline-alert-stripe:var(--ddga-info-600);--ddga-inline-alert-icon-bg:var(--ddga-info-50);--ddga-inline-alert-icon-fg:var(--ddga-info-700);--ddga-inline-alert-tint-bg:var(--ddga-info-25);--ddga-inline-alert-tint-border:var(--ddga-info-200);--ddga-inline-alert-tint-title:var(--ddga-info-700)}.ddga-inline-alert--destructive{--ddga-inline-alert-stripe:var(--ddga-error-600);--ddga-inline-alert-icon-bg:var(--ddga-error-50);--ddga-inline-alert-icon-fg:var(--ddga-error-700);--ddga-inline-alert-tint-bg:var(--ddga-error-25);--ddga-inline-alert-tint-border:var(--ddga-error-200);--ddga-inline-alert-tint-title:var(--ddga-error-700)}.ddga-inline-alert--warning{--ddga-inline-alert-stripe:var(--ddga-warning-600);--ddga-inline-alert-icon-bg:var(--ddga-warning-50);--ddga-inline-alert-icon-fg:var(--ddga-warning-700);--ddga-inline-alert-tint-bg:var(--ddga-warning-25);--ddga-inline-alert-tint-border:var(--ddga-warning-200);--ddga-inline-alert-tint-title:var(--ddga-warning-700)}.ddga-inline-alert--success{--ddga-inline-alert-stripe:var(--ddga-success-600);--ddga-inline-alert-icon-bg:var(--ddga-success-50);--ddga-inline-alert-icon-fg:var(--ddga-success-700);--ddga-inline-alert-tint-bg:var(--ddga-success-25);--ddga-inline-alert-tint-border:var(--ddga-success-200);--ddga-inline-alert-tint-title:var(--ddga-success-700)}.ddga-inline-alert__stripe{background-color:var(--ddga-inline-alert-stripe);opacity:.7;inline-size:8px;position:absolute;inset-block:-1px;inset-inline-start:-1px}.ddga-inline-alert__header{align-items:start;column-gap:var(--ddga-space-3);grid-template-columns:auto 1fr auto;grid-template-areas:"icon text close";inline-size:100%;display:grid}.ddga-inline-alert__icon{border-radius:var(--ddga-radius-full);background-color:var(--ddga-inline-alert-icon-bg);block-size:40px;inline-size:40px;color:var(--ddga-inline-alert-icon-fg);flex-shrink:0;grid-area:icon;justify-content:center;align-items:center;display:inline-flex}.ddga-inline-alert__icon>svg{block-size:20px;inline-size:20px}.ddga-inline-alert__text{justify-content:center;gap:var(--ddga-space-2);word-break:break-word;flex-direction:column;grid-area:text;min-block-size:40px;min-inline-size:0;display:flex}.ddga-inline-alert__title{font-size:var(--ddga-font-size-base);line-height:1.5rem;font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-gray-800);margin:0}.ddga-inline-alert--color .ddga-inline-alert__title{color:var(--ddga-inline-alert-tint-title)}.ddga-inline-alert__description{font-size:var(--ddga-font-size-sm);color:var(--ddga-gray-700);margin:0;line-height:1.25rem}.ddga-inline-alert__close{block-size:32px;inline-size:32px;color:var(--ddga-text-primary);border-radius:var(--ddga-radius-sm);cursor:pointer;background:0 0;border:0;flex-shrink:0;grid-area:close;justify-content:center;align-items:center;padding:0;transition:background-color .15s;display:inline-flex}.ddga-inline-alert__close>svg{block-size:20px;inline-size:20px}.ddga-inline-alert__close:hover{background-color:var(--ddga-gray-100)}.ddga-inline-alert__close:focus-visible{box-shadow:0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-inline-alert__actions{gap:var(--ddga-space-2);inline-size:100%;padding-inline:var(--ddga-space-10);display:flex}.ddga-inline-alert__action{justify-content:center;align-items:center;gap:var(--ddga-space-1);block-size:32px;padding-inline:var(--ddga-space-3);border-radius:var(--ddga-radius-sm);font-family:inherit;font-size:var(--ddga-font-size-sm);line-height:1.25rem;font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-primary);white-space:nowrap;cursor:pointer;background:0 0;border:0;text-decoration:none;transition:background-color .15s;display:inline-flex}.ddga-inline-alert__action:hover{background-color:var(--ddga-gray-100)}.ddga-inline-alert__action:focus-visible{box-shadow:0 0 0 2px var(--ddga-text-primary);outline:none}@container (width<=480px){.ddga-inline-alert{padding-inline:var(--ddga-space-4)}.ddga-inline-alert__stripe{block-size:8px;inline-size:auto;inset-block:-1px auto;inset-inline:-1px}.ddga-inline-alert__header{row-gap:var(--ddga-space-4);grid-template-areas:"icon.close""text text text"}.ddga-inline-alert__text{gap:var(--ddga-space-1);min-block-size:0}.ddga-inline-alert__actions{flex-direction:column;align-items:stretch;padding-inline:0}.ddga-inline-alert__action{inline-size:100%}.ddga-inline-alert__action:first-child{block-size:40px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base);background-color:var(--ddga-gray-100);line-height:1.5rem}.ddga-inline-alert__action:first-child:hover{background-color:var(--ddga-gray-200)}}[data-theme=dark] .ddga-inline-alert--white{background-color:var(--ddga-gray-900,#111927);border-color:var(--ddga-gray-700)}[data-theme=dark] .ddga-inline-alert__title{color:var(--ddga-gray-50)}[data-theme=dark] .ddga-inline-alert--color{--ddga-inline-alert-tint-bg:color-mix(in srgb, var(--ddga-inline-alert-stripe) 16%, transparent);--ddga-inline-alert-tint-border:color-mix(in srgb, var(--ddga-inline-alert-stripe) 45%, transparent)}[data-theme=dark] .ddga-inline-alert__description{color:var(--ddga-gray-300)}[data-theme=dark] .ddga-inline-alert__close,[data-theme=dark] .ddga-inline-alert__action{color:var(--ddga-gray-50)}[data-theme=dark] .ddga-inline-alert__close:hover,[data-theme=dark] .ddga-inline-alert__action:hover{background-color:var(--ddga-gray-800)}[data-theme=dark] .ddga-inline-alert__close:focus-visible,[data-theme=dark] .ddga-inline-alert__action:focus-visible{box-shadow:0 0 0 2px var(--ddga-gray-50)}[data-theme=dark] .ddga-inline-alert__action:first-child{background-color:var(--ddga-gray-800)}@media (forced-colors:active){.ddga-inline-alert{border-color:canvastext}.ddga-inline-alert__close:focus-visible,.ddga-inline-alert__action:focus-visible{box-shadow:none;outline:2px solid highlight}}}
+/*# sourceMappingURL=inline-alert.css.map */

package/dist/components/inline-alert.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBACE,qnBAsBA,8HAKA,0UAQA,mUAQA,gVAQA,wVAQA,wVASA,kKASA,oLASA,oRAYA,8DAKA,sLAWA,mKAOA,8FAIA,2HAOA,4SAgBA,+DAIA,sEAGA,mGAKA,sHAOA,6cAoBA,uEAGA,oGAKA,0BACE,sDAGA,mGAMA,wGAMA,kEAIA,uFAKA,4CAGA,wLAOA,oFAKF,4HAIA,sEAMA,kPAYA,6EAGA,mHAIA,2IAIA,8JAIA,+FAIA,8BACE,2CAGA","sources":["src/components/inline-alert.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-inline-alert {\n    --ddga-inline-alert-stripe: var(--ddga-gray-200);\n    --ddga-inline-alert-icon-bg: var(--ddga-gray-50);\n    --ddga-inline-alert-icon-fg: var(--ddga-text-primary);\n    --ddga-inline-alert-tint-bg: var(--ddga-gray-25);\n    --ddga-inline-alert-tint-border: var(--ddga-gray-300);\n    --ddga-inline-alert-tint-title: var(--ddga-gray-800);\n\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-4);\n    padding-block: var(--ddga-space-4);\n    padding-inline: var(--ddga-space-6);\n    border: 1px solid var(--ddga-color-input);\n    border-radius: var(--ddga-radius-md);\n    background-color: #fff;\n    overflow: hidden;\n    container-type: inline-size;\n    font-family: inherit;\n  }\n\n  .ddga-inline-alert--color {\n    background-color: var(--ddga-inline-alert-tint-bg);\n    border-color: var(--ddga-inline-alert-tint-border);\n  }\n\n  .ddga-inline-alert--neutral {\n    --ddga-inline-alert-stripe: var(--ddga-gray-200);\n    --ddga-inline-alert-icon-bg: var(--ddga-gray-50);\n    --ddga-inline-alert-icon-fg: var(--ddga-text-primary);\n    --ddga-inline-alert-tint-bg: var(--ddga-gray-25);\n    --ddga-inline-alert-tint-border: var(--ddga-gray-300);\n    --ddga-inline-alert-tint-title: var(--ddga-gray-800);\n  }\n  .ddga-inline-alert--info {\n    --ddga-inline-alert-stripe: var(--ddga-info-600);\n    --ddga-inline-alert-icon-bg: var(--ddga-info-50);\n    --ddga-inline-alert-icon-fg: var(--ddga-info-700);\n    --ddga-inline-alert-tint-bg: var(--ddga-info-25);\n    --ddga-inline-alert-tint-border: var(--ddga-info-200);\n    --ddga-inline-alert-tint-title: var(--ddga-info-700);\n  }\n  .ddga-inline-alert--destructive {\n    --ddga-inline-alert-stripe: var(--ddga-error-600);\n    --ddga-inline-alert-icon-bg: var(--ddga-error-50);\n    --ddga-inline-alert-icon-fg: var(--ddga-error-700);\n    --ddga-inline-alert-tint-bg: var(--ddga-error-25);\n    --ddga-inline-alert-tint-border: var(--ddga-error-200);\n    --ddga-inline-alert-tint-title: var(--ddga-error-700);\n  }\n  .ddga-inline-alert--warning {\n    --ddga-inline-alert-stripe: var(--ddga-warning-600);\n    --ddga-inline-alert-icon-bg: var(--ddga-warning-50);\n    --ddga-inline-alert-icon-fg: var(--ddga-warning-700);\n    --ddga-inline-alert-tint-bg: var(--ddga-warning-25);\n    --ddga-inline-alert-tint-border: var(--ddga-warning-200);\n    --ddga-inline-alert-tint-title: var(--ddga-warning-700);\n  }\n  .ddga-inline-alert--success {\n    --ddga-inline-alert-stripe: var(--ddga-success-600);\n    --ddga-inline-alert-icon-bg: var(--ddga-success-50);\n    --ddga-inline-alert-icon-fg: var(--ddga-success-700);\n    --ddga-inline-alert-tint-bg: var(--ddga-success-25);\n    --ddga-inline-alert-tint-border: var(--ddga-success-200);\n    --ddga-inline-alert-tint-title: var(--ddga-success-700);\n  }\n\n  .ddga-inline-alert__stripe {\n    position: absolute;\n    inset-block: -1px;\n    inset-inline-start: -1px;\n    inline-size: 8px;\n    background-color: var(--ddga-inline-alert-stripe);\n    opacity: 0.7;\n  }\n\n  .ddga-inline-alert__header {\n    display: grid;\n    grid-template-columns: auto 1fr auto;\n    grid-template-areas: 'icon text close';\n    align-items: start;\n    column-gap: var(--ddga-space-3);\n    inline-size: 100%;\n  }\n\n  .ddga-inline-alert__icon {\n    grid-area: icon;\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 40px;\n    block-size: 40px;\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-inline-alert-icon-bg);\n    color: var(--ddga-inline-alert-icon-fg);\n  }\n  .ddga-inline-alert__icon > svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n\n  .ddga-inline-alert__text {\n    grid-area: text;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    gap: var(--ddga-space-2);\n    min-block-size: 40px;\n    min-inline-size: 0;\n    word-break: break-word;\n  }\n\n  .ddga-inline-alert__title {\n    margin: 0;\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5rem;\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-gray-800);\n  }\n  .ddga-inline-alert--color .ddga-inline-alert__title {\n    color: var(--ddga-inline-alert-tint-title);\n  }\n\n  .ddga-inline-alert__description {\n    margin: 0;\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.25rem;\n    color: var(--ddga-gray-700);\n  }\n\n  .ddga-inline-alert__close {\n    grid-area: close;\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 32px;\n    block-size: 32px;\n    padding: 0;\n    border: 0;\n    background: transparent;\n    color: var(--ddga-text-primary);\n    border-radius: var(--ddga-radius-sm);\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-inline-alert__close > svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n  .ddga-inline-alert__close:hover {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-inline-alert__close:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-text-primary);\n  }\n\n  .ddga-inline-alert__actions {\n    display: flex;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-10);\n  }\n\n  .ddga-inline-alert__action {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    border: 0;\n    background: transparent;\n    border-radius: var(--ddga-radius-sm);\n    font-family: inherit;\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.25rem;\n    font-weight: var(--ddga-font-weight-medium);\n    color: var(--ddga-text-primary);\n    white-space: nowrap;\n    text-decoration: none;\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-inline-alert__action:hover {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-inline-alert__action:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-text-primary);\n  }\n\n  @container (max-width: 480px) {\n    .ddga-inline-alert {\n      padding-inline: var(--ddga-space-4);\n    }\n    .ddga-inline-alert__stripe {\n      inset-block: -1px auto;\n      inset-inline: -1px;\n      inline-size: auto;\n      block-size: 8px;\n    }\n    .ddga-inline-alert__header {\n      grid-template-areas:\n        'icon . close'\n        'text text text';\n      row-gap: var(--ddga-space-4);\n    }\n    .ddga-inline-alert__text {\n      min-block-size: 0;\n      gap: var(--ddga-space-1);\n    }\n    .ddga-inline-alert__actions {\n      flex-direction: column;\n      align-items: stretch;\n      padding-inline: 0;\n    }\n    .ddga-inline-alert__action {\n      inline-size: 100%;\n    }\n    .ddga-inline-alert__action:first-child {\n      block-size: 40px;\n      padding-inline: var(--ddga-space-4);\n      font-size: var(--ddga-font-size-base);\n      line-height: 1.5rem;\n      background-color: var(--ddga-gray-100);\n    }\n    .ddga-inline-alert__action:first-child:hover {\n      background-color: var(--ddga-gray-200);\n    }\n  }\n\n  [data-theme='dark'] .ddga-inline-alert--white {\n    background-color: var(--ddga-gray-900, #111927);\n    border-color: var(--ddga-gray-700);\n  }\n  [data-theme='dark'] .ddga-inline-alert__title {\n    color: var(--ddga-gray-50);\n  }\n  /* Dark: the light −25/−200 tints render a near-white box and the old title override\n     painted light-on-light. Remap to a translucent type tint (off the −600 stripe); the\n     title inherits gray-50 from the rule above. */\n  [data-theme='dark'] .ddga-inline-alert--color {\n    --ddga-inline-alert-tint-bg: color-mix(\n      in srgb,\n      var(--ddga-inline-alert-stripe) 16%,\n      transparent\n    );\n    --ddga-inline-alert-tint-border: color-mix(\n      in srgb,\n      var(--ddga-inline-alert-stripe) 45%,\n      transparent\n    );\n  }\n  [data-theme='dark'] .ddga-inline-alert__description {\n    color: var(--ddga-gray-300);\n  }\n  [data-theme='dark'] .ddga-inline-alert__close,\n  [data-theme='dark'] .ddga-inline-alert__action {\n    color: var(--ddga-gray-50);\n  }\n  [data-theme='dark'] .ddga-inline-alert__close:hover,\n  [data-theme='dark'] .ddga-inline-alert__action:hover {\n    background-color: var(--ddga-gray-800);\n  }\n  [data-theme='dark'] .ddga-inline-alert__close:focus-visible,\n  [data-theme='dark'] .ddga-inline-alert__action:focus-visible {\n    box-shadow: 0 0 0 2px var(--ddga-gray-50);\n  }\n  [data-theme='dark'] .ddga-inline-alert__action:first-child {\n    background-color: var(--ddga-gray-800);\n  }\n\n  @media (forced-colors: active) {\n    .ddga-inline-alert {\n      border-color: CanvasText;\n    }\n    .ddga-inline-alert__close:focus-visible,\n    .ddga-inline-alert__action:focus-visible {\n      outline: 2px solid Highlight;\n      box-shadow: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/link.css

@@ -1,2 +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}}}
+@layer ddga-components{.ddga-link{--ddga-link-color:var(--ddga-color-primary);--ddga-link-color-hover:var(--ddga-sa-400);--ddga-link-color-pressed:var(--ddga-sa-300);--ddga-link-color-visited:var(--ddga-sa-800);--ddga-link-color-disabled:var(--ddga-text-placeholder);--ddga-link-focus-ring:var(--ddga-text-primary);color:var(--ddga-link-color);cursor:pointer;text-underline-position:from-font;text-decoration-skip-ink:none;font-family:inherit;transition:color .15s,text-decoration-color .15s}.ddga-link--neutral{--ddga-link-color:var(--ddga-gray-700);--ddga-link-color-hover:var(--ddga-gray-500);--ddga-link-color-pressed:var(--ddga-gray-400);--ddga-link-color-visited:var(--ddga-sa-800);--ddga-link-color-disabled:var(--ddga-text-placeholder)}.ddga-link--on-color{--ddga-link-color:#fff;--ddga-link-color-hover:var(--ddga-alpha-white-80);--ddga-link-color-pressed:var(--ddga-alpha-white-60);--ddga-link-color-visited:var(--ddga-alpha-white-90);--ddga-link-color-disabled:var(--ddga-alpha-white-30);--ddga-link-focus-ring:#fff}.ddga-link:visited{color:var(--ddga-link-color-visited)}.ddga-link:hover{color:var(--ddga-link-color-hover)}.ddga-link:active{color:var(--ddga-link-color-pressed)}.ddga-link:focus-visible{outline:2px solid var(--ddga-link-focus-ring);outline-offset:0}.ddga-link[aria-disabled=true]{color:var(--ddga-link-color-disabled);pointer-events:none;cursor:default}.ddga-link.ddga-link--hovered{color:var(--ddga-link-color-hover);text-decoration:underline}.ddga-link.ddga-link--pressed{color:var(--ddga-link-color-pressed);text-decoration:underline}.ddga-link.ddga-link--visited{color:var(--ddga-link-color-visited)}.ddga-link.ddga-link--focused{outline:2px solid var(--ddga-link-focus-ring);outline-offset:0}.ddga-link--inline{text-decoration:underline;display:inline}.ddga-link--standalone{align-items:center;text-decoration:none;display:inline-flex}.ddga-link--standalone:hover,.ddga-link--standalone:active{text-decoration:underline}.ddga-link--md{font-size:var(--ddga-font-size-base);line-height:1.5}.ddga-link--sm{font-size:var(--ddga-font-size-sm);line-height:1.42857}.ddga-link--standalone.ddga-link--md{gap:var(--ddga-space-2)}.ddga-link--standalone.ddga-link--sm{gap:var(--ddga-space-1)}.ddga-link__icon{flex-shrink:0;align-items:center;display:inline-flex}.ddga-link--md .ddga-link__icon>svg{block-size:20px;inline-size:20px}.ddga-link--sm .ddga-link__icon>svg{block-size:16px;inline-size:16px}.ddga-link--inline .ddga-link__icon{vertical-align:middle}.ddga-link--inline.ddga-link--md [data-slot=link-start-icon]{margin-inline-end:var(--ddga-space-2)}.ddga-link--inline.ddga-link--sm [data-slot=link-start-icon]{margin-inline-end:var(--ddga-space-1)}.ddga-link--inline.ddga-link--md [data-slot=link-end-icon],.ddga-link--inline.ddga-link--md [data-slot=link-external-icon]{margin-inline-start:var(--ddga-space-2)}.ddga-link--inline.ddga-link--sm [data-slot=link-end-icon],.ddga-link--inline.ddga-link--sm [data-slot=link-external-icon]{margin-inline-start:var(--ddga-space-1)}[data-theme=dark] .ddga-link--primary{--ddga-link-color-hover:var(--ddga-sa-300);--ddga-link-color-pressed:var(--ddga-sa-200);--ddga-link-color-visited:var(--ddga-sa-600);--ddga-link-focus-ring:#fff}[data-theme=dark] .ddga-link--neutral{--ddga-link-color:var(--ddga-gray-300);--ddga-link-color-hover:var(--ddga-gray-200);--ddga-link-color-pressed:var(--ddga-gray-100);--ddga-link-color-visited:var(--ddga-sa-400);--ddga-link-focus-ring:#fff}@media (prefers-reduced-motion:reduce){.ddga-link{transition:none}}@media (forced-colors:active){.ddga-link,.ddga-link--primary,.ddga-link--neutral,.ddga-link--on-color{color:linktext}.ddga-link:visited{color:visitedtext}.ddga-link[aria-disabled=true]{color:graytext}.ddga-link:focus-visible{outline-offset:0;outline:2px solid highlight}}}
 /*# sourceMappingURL=link.css.map */

package/dist/components/link.css.map

@@ -1 +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":[]}
+{"version":3,"mappings":"AAAA,uBAME,qdAoBA,4PAQA,2RAWA,wDAGA,oDAGA,uDAIA,wFAKA,wGAQA,2FAIA,6FAIA,mEAGA,6FAQA,4DAMA,mFAKA,qFAOA,oEAIA,sEAKA,6DAGA,6DAMA,sEAMA,qEAIA,qEAMA,0DAGA,mGAGA,mGAGA,mKAIA,mKAQA,uMAMA,kPAQA,uCACE,4BAKF,8BACE,uFAMA,qCAGA,8CAGA","sources":["src/components/link.css"],"sourcesContent":["@layer ddga-components {\n  /* SDGA Link: text-link primitive. Three orthogonal axes — tone (Primary/Neutral/\n     On-color) sets the color ramp via the hooks below; size (sm/md) sets type + icon +\n     gap; inline (true/false) sets the underline rule. Hover/Pressed go LIGHTER (SDGA),\n     Visited via :visited, focus = sharp 2px ink box. Base = Primary defaults. */\n\n  .ddga-link {\n    --ddga-link-color: var(--ddga-color-primary);\n    --ddga-link-color-hover: var(--ddga-sa-400);\n    --ddga-link-color-pressed: var(--ddga-sa-300);\n    --ddga-link-color-visited: var(--ddga-sa-800);\n    --ddga-link-color-disabled: var(--ddga-text-placeholder);\n    --ddga-link-focus-ring: var(--ddga-text-primary); /* #161616 */\n\n    color: var(--ddga-link-color);\n    font-family: inherit;\n    cursor: pointer;\n    text-underline-position: from-font;\n    text-decoration-skip-ink: none;\n    transition:\n      color 150ms ease,\n      text-decoration-color 150ms ease;\n  }\n\n  /* ─── Tone (color ramp) — base is Primary; override Neutral + On-color ─── */\n\n  .ddga-link--neutral {\n    --ddga-link-color: var(--ddga-gray-700);\n    --ddga-link-color-hover: var(--ddga-gray-500);\n    --ddga-link-color-pressed: var(--ddga-gray-400);\n    --ddga-link-color-visited: var(--ddga-sa-800); /* SDGA reuses link-primary-visited */\n    --ddga-link-color-disabled: var(--ddga-text-placeholder);\n  }\n\n  .ddga-link--on-color {\n    --ddga-link-color: #ffffff;\n    --ddga-link-color-hover: var(--ddga-alpha-white-80);\n    --ddga-link-color-pressed: var(--ddga-alpha-white-60);\n    --ddga-link-color-visited: var(--ddga-alpha-white-90);\n    --ddga-link-color-disabled: var(--ddga-alpha-white-30);\n    --ddga-link-focus-ring: #ffffff;\n  }\n\n  /* ─── State ramp (LVHA order; :visited is color-only by browser design) ─── */\n\n  .ddga-link:visited {\n    color: var(--ddga-link-color-visited);\n  }\n  .ddga-link:hover {\n    color: var(--ddga-link-color-hover);\n  }\n  .ddga-link:active {\n    color: var(--ddga-link-color-pressed);\n  }\n\n  .ddga-link:focus-visible {\n    outline: 2px solid var(--ddga-link-focus-ring);\n    outline-offset: 0;\n  }\n\n  .ddga-link[aria-disabled='true'] {\n    color: var(--ddga-link-color-disabled);\n    pointer-events: none;\n    cursor: default;\n  }\n\n  /* Static demo hooks for the Storybook state matrix (real states use the pseudo-classes).\n     Doubled class = specificity over `.ddga-link--standalone { text-decoration: none }`. */\n  .ddga-link.ddga-link--hovered {\n    color: var(--ddga-link-color-hover);\n    text-decoration: underline;\n  }\n  .ddga-link.ddga-link--pressed {\n    color: var(--ddga-link-color-pressed);\n    text-decoration: underline;\n  }\n  .ddga-link.ddga-link--visited {\n    color: var(--ddga-link-color-visited);\n  }\n  .ddga-link.ddga-link--focused {\n    outline: 2px solid var(--ddga-link-focus-ring);\n    outline-offset: 0;\n  }\n\n  /* ─── Inline axis (underline rule) ─── */\n\n  /* Inline=True: flows in prose, underlined in every state. */\n  .ddga-link--inline {\n    display: inline;\n    text-decoration: underline;\n  }\n\n  /* Inline=False: standalone / chrome — inline-flex, underline on hover/pressed only. */\n  .ddga-link--standalone {\n    display: inline-flex;\n    align-items: center;\n    text-decoration: none;\n  }\n  .ddga-link--standalone:hover,\n  .ddga-link--standalone:active {\n    text-decoration: underline;\n  }\n\n  /* ─── Size (type / icon / gap) ─── */\n\n  .ddga-link--md {\n    font-size: var(--ddga-font-size-base); /* 16 */\n    line-height: 1.5; /* 24 */\n  }\n  .ddga-link--sm {\n    font-size: var(--ddga-font-size-sm); /* 14 */\n    line-height: 1.42857; /* 20 */\n  }\n\n  .ddga-link--standalone.ddga-link--md {\n    gap: var(--ddga-space-2); /* 8 */\n  }\n  .ddga-link--standalone.ddga-link--sm {\n    gap: var(--ddga-space-1); /* 4 */\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--md .ddga-link__icon > svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n  .ddga-link--sm .ddga-link__icon > svg {\n    inline-size: 16px;\n    block-size: 16px;\n  }\n\n  /* Inline links have no flex gap → space icons with logical margins (RTL-safe). */\n  .ddga-link--inline .ddga-link__icon {\n    vertical-align: middle;\n  }\n  .ddga-link--inline.ddga-link--md [data-slot='link-start-icon'] {\n    margin-inline-end: var(--ddga-space-2);\n  }\n  .ddga-link--inline.ddga-link--sm [data-slot='link-start-icon'] {\n    margin-inline-end: var(--ddga-space-1);\n  }\n  .ddga-link--inline.ddga-link--md [data-slot='link-end-icon'],\n  .ddga-link--inline.ddga-link--md [data-slot='link-external-icon'] {\n    margin-inline-start: var(--ddga-space-2);\n  }\n  .ddga-link--inline.ddga-link--sm [data-slot='link-end-icon'],\n  .ddga-link--inline.ddga-link--sm [data-slot='link-external-icon'] {\n    margin-inline-start: var(--ddga-space-1);\n  }\n\n  /* ─── Dark — exact DGA dark palette deferred; remap so links stay readable.\n     color-primary already flips to SA-400 in dark.css; remap the raw-token states. ─── */\n\n  [data-theme='dark'] .ddga-link--primary {\n    --ddga-link-color-hover: var(--ddga-sa-300);\n    --ddga-link-color-pressed: var(--ddga-sa-200);\n    --ddga-link-color-visited: var(--ddga-sa-600);\n    --ddga-link-focus-ring: #ffffff;\n  }\n  [data-theme='dark'] .ddga-link--neutral {\n    --ddga-link-color: var(--ddga-gray-300);\n    --ddga-link-color-hover: var(--ddga-gray-200);\n    --ddga-link-color-pressed: var(--ddga-gray-100);\n    --ddga-link-color-visited: var(--ddga-sa-400);\n    --ddga-link-focus-ring: #ffffff;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-link {\n      transition: none;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .ddga-link,\n    .ddga-link--primary,\n    .ddga-link--neutral,\n    .ddga-link--on-color {\n      color: LinkText;\n    }\n    .ddga-link:visited {\n      color: VisitedText;\n    }\n    .ddga-link[aria-disabled='true'] {\n      color: GrayText;\n    }\n    .ddga-link:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 0;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/list.css

@@ -1,2 +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}}
+@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);line-height:1.5;font-weight:var(--ddga-font-weight-regular);flex-direction:column;align-items:start;gap:0;margin:0;padding:0;list-style:none;display:flex}.ddga-list--primary{color:var(--ddga-color-primary)}.ddga-list--neutral{color:var(--ddga-text-primary)}.ddga-list--on-color{color:#fff}.ddga-list__item{align-items:flex-start;gap:var(--ddga-space-2);color:inherit;display:flex}.ddga-list--ordered>.ddga-list__item,.ddga-list--with-icon>.ddga-list__item{align-items:center}.ddga-list__item[data-level="2"]{padding-inline-start:var(--ddga-space-6)}.ddga-list--ordered>.ddga-list__item:before,.ddga-list--unordered>.ddga-list__item:before{flex-shrink:0}.ddga-list--ordered{counter-reset:ddga-l1 ddga-l2}.ddga-list--ordered>.ddga-list__item:not([data-level="2"]){counter-increment:ddga-l1;counter-reset:ddga-l2}.ddga-list--ordered>.ddga-list__item:not([data-level="2"]):before{content:counter(ddga-l1, decimal) "-"}.ddga-list--ordered>.ddga-list__item[data-level="2"]{counter-increment:ddga-l2}.ddga-list--ordered>.ddga-list__item[data-level="2"]:before{content:counter(ddga-l2, lower-alpha) "-"}[dir=rtl] .ddga-list--ordered>.ddga-list__item[data-level="2"]:before{content:counter(ddga-l2, ddga-arabic-abjad) "-"}.ddga-list--unordered>.ddga-list__item:not([data-level="2"]):before{content:"-"}.ddga-list--unordered>.ddga-list__item[data-level="2"]:before{content:"•"}.ddga-list__icon{block-size:1.5em;inline-size:16px;color:inherit;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-list__icon svg{block-size:16px;inline-size:16px}}
 /*# sourceMappingURL=list.css.map */

package/dist/components/list.css.map

@@ -1 +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":[]}
+{"version":3,"mappings":"AAIA,+MAQA,uBAKE,yOAcA,oDAGA,mDAIA,gCAIA,2FAOA,+FAKA,0EAIA,wGAQA,kDAGA,2GAIA,wGAGA,+EAGA,sGAGA,sHAKA,gFAGA,4EAKA,6IASA","sources":["src/components/list.css"],"sourcesContent":["/* Arabic abjad alphabetic counter — أ ب ج … in classical abjad order, for the\n   RTL ordered Level-Two marker. `arabic-indic` is native; abjad is not. Symbols\n   are the W3C \"Ready-made Counter Styles\" sequence (`\\647\\200D` = HEH + ZWJ so it\n   joins). Counter-style names are global, so this lives outside the cascade layer. */\n@counter-style ddga-arabic-abjad {\n  system: fixed;\n  symbols: '\\623' '\\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  /* SDGA content list: Type (ordered/unordered/with-icon) × tone × Level. Each item is\n     a flex row [marker · 8px gap · text]; tone colours marker + text together via\n     currentColor; line-height 24 carries the vertical rhythm (container gap 0). */\n\n  .ddga-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    align-items: start;\n    gap: 0;\n    color: var(--ddga-text-primary);\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5;\n    font-weight: var(--ddga-font-weight-regular);\n  }\n\n  .ddga-list--primary {\n    color: var(--ddga-color-primary);\n  }\n  .ddga-list--neutral {\n    color: var(--ddga-text-primary);\n  }\n  /* For dark / brand surfaces — consumer supplies the background. */\n  .ddga-list--on-color {\n    color: #fff;\n  }\n\n  .ddga-list__item {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--ddga-space-2);\n    color: inherit;\n  }\n  /* SDGA: ordered + with-icon rows center marker↔text; unordered L1 stays start (multi-line wrap). */\n  .ddga-list--ordered > .ddga-list__item,\n  .ddga-list--with-icon > .ddga-list__item {\n    align-items: center;\n  }\n\n  .ddga-list__item[data-level='2'] {\n    padding-inline-start: var(--ddga-space-6);\n  }\n\n  .ddga-list--ordered > .ddga-list__item::before,\n  .ddga-list--unordered > .ddga-list__item::before {\n    flex-shrink: 0;\n  }\n\n  /* Ordered: decimal+\"-\" at L1, lower-alpha+\"-\" at L2 (Arabic abjad in RTL). Digits\n     stay Latin in RTL per SDGA; letters localize. counter() drops the style suffix,\n     so the \"-\" is appended explicitly. */\n  .ddga-list--ordered {\n    counter-reset: ddga-l1 ddga-l2;\n  }\n  .ddga-list--ordered > .ddga-list__item:not([data-level='2']) {\n    counter-increment: ddga-l1;\n    counter-reset: ddga-l2;\n  }\n  .ddga-list--ordered > .ddga-list__item:not([data-level='2'])::before {\n    content: counter(ddga-l1, decimal) '-';\n  }\n  .ddga-list--ordered > .ddga-list__item[data-level='2'] {\n    counter-increment: ddga-l2;\n  }\n  .ddga-list--ordered > .ddga-list__item[data-level='2']::before {\n    content: counter(ddga-l2, lower-alpha) '-';\n  }\n  [dir='rtl'] .ddga-list--ordered > .ddga-list__item[data-level='2']::before {\n    content: counter(ddga-l2, ddga-arabic-abjad) '-';\n  }\n\n  /* Unordered: hyphen bullet at L1, dot at L2. */\n  .ddga-list--unordered > .ddga-list__item:not([data-level='2'])::before {\n    content: '-';\n  }\n  .ddga-list--unordered > .ddga-list__item[data-level='2']::before {\n    content: '\\2022';\n  }\n\n  /* With Icon: 16px glyph centred on the first 24px line; tone via currentColor. */\n  .ddga-list__icon {\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    inline-size: 16px;\n    block-size: 1.5em;\n    color: inherit;\n  }\n  .ddga-list__icon svg {\n    inline-size: 16px;\n    block-size: 16px;\n  }\n}\n"],"names":[]}

package/dist/components/metric.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-metric{--ddga-metric-ink:var(--ddga-gray-800);gap:var(--ddga-space-6);max-inline-size:22.5rem;padding:var(--ddga-space-4);background-color:var(--ddga-color-card);border-radius:var(--ddga-radius-xl);box-shadow:var(--ddga-shadow-md);color:var(--ddga-color-card-foreground);flex-direction:column;display:flex}.ddga-metric__header{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-metric__heading{align-items:center;gap:var(--ddga-space-2);min-inline-size:0;display:flex}.ddga-metric__icon{border-radius:var(--ddga-radius-full);background-color:var(--ddga-sa-50);block-size:2rem;inline-size:2rem;color:var(--ddga-success-700);flex:none;justify-content:center;align-items:center;display:inline-flex}.ddga-metric__icon>svg{block-size:1rem;inline-size:1rem}.ddga-metric__action{flex:none}.ddga-metric__label{color:var(--ddga-metric-ink);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);line-height:1.4286}.ddga-metric__body{gap:var(--ddga-space-6);display:flex}.ddga-metric--large .ddga-metric__body{flex-direction:column}.ddga-metric--small .ddga-metric__body{align-items:flex-end;gap:var(--ddga-space-6);flex-direction:row}.ddga-metric__figures{flex:1 1 0;min-inline-size:0;display:flex}.ddga-metric--large .ddga-metric__figures{align-items:center;gap:var(--ddga-space-6);flex-direction:row}.ddga-metric--small .ddga-metric__figures{gap:var(--ddga-space-3);flex-direction:column}.ddga-metric__value{color:var(--ddga-metric-ink);font-size:2.25rem;font-weight:var(--ddga-font-weight-bold);letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:2.75rem}[dir=rtl] .ddga-metric__value{letter-spacing:normal}.ddga-metric__info{align-items:flex-end;gap:var(--ddga-space-2);display:flex}.ddga-metric--large .ddga-metric__info{flex:1 1 0;justify-content:flex-end}[dir=rtl] .ddga-metric--large .ddga-metric__figures{flex-direction:row-reverse}[dir=rtl] .ddga-metric--large .ddga-metric__info{justify-content:flex-start}.ddga-metric__change{--ddga-metric-change-color:var(--ddga-text-secondary);color:var(--ddga-metric-change-color);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);font-variant-numeric:tabular-nums;align-items:center;gap:.125rem;display:inline-flex}.ddga-metric__change[data-type="02"]{gap:var(--ddga-space-1)}.ddga-metric__change--up{--ddga-metric-change-color:var(--ddga-success-700)}.ddga-metric__change--down{--ddga-metric-change-color:var(--ddga-error-700)}.ddga-metric__change-icon{justify-content:center;align-items:center;display:inline-flex}.ddga-metric__change-icon>svg{block-size:1.25rem;inline-size:1.25rem}.ddga-metric__change-label{color:var(--ddga-text-tertiary);font-size:var(--ddga-font-size-sm)}.ddga-metric__chart{--ddga-metric-chart-line:var(--ddga-success-700);--ddga-metric-chart-area:var(--ddga-success-600);block-size:4rem;position:relative}.ddga-metric__chart[data-trend=down]{--ddga-metric-chart-line:var(--ddga-error-700);--ddga-metric-chart-area:var(--ddga-error-600)}.ddga-metric--large .ddga-metric__chart{inline-size:100%}.ddga-metric--small .ddga-metric__chart{flex:none;inline-size:8rem}.ddga-metric__chart-svg{block-size:100%;inline-size:100%;display:block}.ddga-metric__chart-line{fill:none;stroke:var(--ddga-metric-chart-line);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.ddga-metric__chart-marker{block-size:22px;inline-size:22px;position:absolute;transform:translate(-50%,-50%)}.ddga-metric__chart-marker:before{content:"";border-radius:var(--ddga-radius-full);border:2px solid var(--ddga-metric-chart-line);opacity:.2;position:absolute;inset:0}.ddga-metric__chart-marker:after{content:"";border-radius:var(--ddga-radius-full);background-color:var(--ddga-color-card);border:2px solid var(--ddga-metric-chart-line);position:absolute;inset:5px}.ddga-metric__footer{gap:var(--ddga-space-4);flex-direction:column;display:flex}.ddga-metric__divider{margin-inline:calc(-1 * var(--ddga-space-4));background-color:var(--ddga-color-input);block-size:1px}.ddga-metric__actions{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);display:flex}[data-theme=dark] .ddga-metric{--ddga-metric-ink:var(--ddga-gray-100)}[data-theme=dark] .ddga-metric__icon{color:var(--ddga-success-400);background-color:#25935f2e}[data-theme=dark] .ddga-metric__change--up{--ddga-metric-change-color:var(--ddga-success-400)}[data-theme=dark] .ddga-metric__change--down{--ddga-metric-change-color:var(--ddga-error-400)}[data-theme=dark] .ddga-metric__chart{--ddga-metric-chart-line:var(--ddga-success-400)}[data-theme=dark] .ddga-metric__chart[data-trend=down]{--ddga-metric-chart-line:var(--ddga-error-400)}@media (forced-colors:active){.ddga-metric__icon{border:1px solid canvastext}.ddga-metric__divider{background-color:canvastext}}.ddga-metric-group{--ddga-metric-group-gap:var(--ddga-space-4)}.ddga-metric-group--gap-sm{--ddga-metric-group-gap:var(--ddga-space-3)}.ddga-metric-group--gap-md{--ddga-metric-group-gap:var(--ddga-space-4)}.ddga-metric-group--gap-lg{--ddga-metric-group-gap:var(--ddga-space-6)}.ddga-metric-group--horizontal{gap:var(--ddga-metric-group-gap);grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));display:grid}.ddga-metric-group--horizontal.ddga-metric-group--cols{grid-template-columns:repeat(auto-fit, minmax(max(15rem, calc((100% - (var(--ddga-metric-group-columns) - 1) * var(--ddga-metric-group-gap)) / var(--ddga-metric-group-columns))), 1fr))}.ddga-metric-group--vertical{gap:var(--ddga-metric-group-gap);flex-direction:column;display:flex}.ddga-metric-group .ddga-metric{max-inline-size:none}}
+/*# sourceMappingURL=metric.css.map */

package/dist/components/metric.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAIE,wTAeA,2GAMA,gGAMA,mOAWA,wDAIA,+BAGA,kJASA,wDAIA,6DAGA,uGAMA,gEAKA,wGAKA,wFAKA,wLASA,oDAIA,6EAKA,2EAKA,+EAGA,4EAIA,oRAUA,6DAGA,4EAGA,4EAGA,wFAKA,qEAIA,8FAMA,wJAMA,mIAIA,yDAGA,mEAIA,uEAKA,oIAQA,6GAMA,uKAQA,qMAYA,gFAKA,2HAKA,4GAQA,sEAGA,8FAIA,8FAGA,8FAGA,uFAGA,sGAKA,8BACE,+CAGA,mDAOF,+DAGA,uEAGA,uEAGA,uEAIA,sIAKA,gPAkBA,iGAOA","sources":["src/components/metric.css"],"sourcesContent":["@layer ddga-components {\n  /* DGA Platforms Code Metric card. `large` = chart below the figures, `small` =\n     chart beside. Exact SDGA color steps; the raw -700/-800 steps get dark overrides. */\n\n  .ddga-metric {\n    --ddga-metric-ink: var(--ddga-gray-800);\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-6);\n    max-inline-size: 22.5rem;\n    padding: var(--ddga-space-4);\n    background-color: var(--ddga-color-card);\n    border-radius: var(--ddga-radius-xl);\n    box-shadow: var(--ddga-shadow-md);\n    color: var(--ddga-color-card-foreground);\n  }\n\n  /* ─── Header (featured icon + label · action) ─── */\n\n  .ddga-metric__header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n  }\n  .ddga-metric__heading {\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n    min-inline-size: 0;\n  }\n  .ddga-metric__icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: none;\n    inline-size: 2rem;\n    block-size: 2rem;\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-sa-50);\n    color: var(--ddga-success-700);\n  }\n  .ddga-metric__icon > svg {\n    inline-size: 1rem;\n    block-size: 1rem;\n  }\n  .ddga-metric__action {\n    flex: none;\n  }\n  .ddga-metric__label {\n    color: var(--ddga-metric-ink);\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-medium);\n    line-height: 1.4286; /* 20/14 */\n  }\n\n  /* ─── Body (figures + chart; layout swaps per Style) ─── */\n\n  .ddga-metric__body {\n    display: flex;\n    gap: var(--ddga-space-6);\n  }\n  .ddga-metric--large .ddga-metric__body {\n    flex-direction: column;\n  }\n  .ddga-metric--small .ddga-metric__body {\n    flex-direction: row;\n    align-items: flex-end;\n    gap: var(--ddga-space-6); /* SDGA body row gap 24 */\n  }\n\n  .ddga-metric__figures {\n    display: flex;\n    flex: 1 1 0;\n    min-inline-size: 0;\n  }\n  .ddga-metric--large .ddga-metric__figures {\n    flex-direction: row;\n    align-items: center;\n    gap: var(--ddga-space-6); /* SDGA value↔info gap 24 (spacing-3xl) */\n  }\n  .ddga-metric--small .ddga-metric__figures {\n    flex-direction: column;\n    gap: var(--ddga-space-3);\n  }\n\n  .ddga-metric__value {\n    color: var(--ddga-metric-ink);\n    font-size: 2.25rem; /* SDGA Display md 36 — no Display token yet */\n    font-weight: var(--ddga-font-weight-bold);\n    line-height: 2.75rem;\n    letter-spacing: -0.02em;\n    font-variant-numeric: tabular-nums;\n  }\n  /* letter-spacing breaks Arabic cursive joining */\n  [dir='rtl'] .ddga-metric__value {\n    letter-spacing: normal;\n  }\n\n  .ddga-metric__info {\n    display: flex;\n    align-items: flex-end; /* SDGA: Info items-end */\n    gap: var(--ddga-space-2);\n  }\n  .ddga-metric--large .ddga-metric__info {\n    flex: 1 1 0;\n    justify-content: flex-end;\n  }\n  /* SDGA keeps the big value on the left in RTL — only the comparison/change mirror. */\n  [dir='rtl'] .ddga-metric--large .ddga-metric__figures {\n    flex-direction: row-reverse;\n  }\n  [dir='rtl'] .ddga-metric--large .ddga-metric__info {\n    justify-content: flex-start;\n  }\n\n  .ddga-metric__change {\n    --ddga-metric-change-color: var(--ddga-text-secondary);\n    display: inline-flex;\n    align-items: center;\n    gap: 0.125rem; /* 2px, no token */\n    color: var(--ddga-metric-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-metric__change[data-type='02'] {\n    gap: var(--ddga-space-1);\n  }\n  .ddga-metric__change--up {\n    --ddga-metric-change-color: var(--ddga-success-700);\n  }\n  .ddga-metric__change--down {\n    --ddga-metric-change-color: var(--ddga-error-700);\n  }\n  .ddga-metric__change-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .ddga-metric__change-icon > svg {\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n  }\n  .ddga-metric__change-label {\n    color: var(--ddga-text-tertiary);\n    font-size: var(--ddga-font-size-sm);\n  }\n\n  /* ─── Trend chart (line + faded area + marker; colored by trend) ─── */\n  .ddga-metric__chart {\n    position: relative;\n    block-size: 4rem;\n    --ddga-metric-chart-line: var(--ddga-success-700);\n    --ddga-metric-chart-area: var(--ddga-success-600);\n  }\n  .ddga-metric__chart[data-trend='down'] {\n    --ddga-metric-chart-line: var(--ddga-error-700);\n    --ddga-metric-chart-area: var(--ddga-error-600);\n  }\n  .ddga-metric--large .ddga-metric__chart {\n    inline-size: 100%;\n  }\n  .ddga-metric--small .ddga-metric__chart {\n    flex: none;\n    inline-size: 8rem;\n  }\n  .ddga-metric__chart-svg {\n    display: block;\n    inline-size: 100%;\n    block-size: 100%;\n  }\n  .ddga-metric__chart-line {\n    fill: none;\n    stroke: var(--ddga-metric-chart-line);\n    stroke-width: 2px;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n  }\n  /* Marker: faint ring (::before) + solid white dot (::after). */\n  .ddga-metric__chart-marker {\n    position: absolute;\n    inline-size: 22px;\n    block-size: 22px;\n    transform: translate(-50%, -50%);\n  }\n  .ddga-metric__chart-marker::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    border-radius: var(--ddga-radius-full);\n    border: 2px solid var(--ddga-metric-chart-line);\n    opacity: 0.2;\n  }\n  .ddga-metric__chart-marker::after {\n    content: '';\n    position: absolute;\n    inset: 5px; /* 12px dot in the 22px ring */\n    border-radius: var(--ddga-radius-full);\n    background-color: var(\n      --ddga-color-card\n    ); /* erase against the card, not the page (differs in dark) */\n    border: 2px solid var(--ddga-metric-chart-line);\n  }\n\n  /* ─── Footer (full-bleed divider + actions row) ─── */\n  .ddga-metric__footer {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-4);\n  }\n  .ddga-metric__divider {\n    margin-inline: calc(-1 * var(--ddga-space-4)); /* bleed past the card padding */\n    block-size: 1px;\n    background-color: var(--ddga-color-input);\n  }\n  .ddga-metric__actions {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--ddga-space-2);\n  }\n\n  /* ─── Dark mode (lighten the raw -700/-800 steps) ─── */\n  [data-theme='dark'] .ddga-metric {\n    --ddga-metric-ink: var(--ddga-gray-100);\n  }\n  [data-theme='dark'] .ddga-metric__icon {\n    background-color: rgb(37 147 95 / 0.18);\n    color: var(--ddga-success-400);\n  }\n  [data-theme='dark'] .ddga-metric__change--up {\n    --ddga-metric-change-color: var(--ddga-success-400);\n  }\n  [data-theme='dark'] .ddga-metric__change--down {\n    --ddga-metric-change-color: var(--ddga-error-400);\n  }\n  [data-theme='dark'] .ddga-metric__chart {\n    --ddga-metric-chart-line: var(--ddga-success-400);\n  }\n  [data-theme='dark'] .ddga-metric__chart[data-trend='down'] {\n    --ddga-metric-chart-line: var(--ddga-error-400);\n  }\n\n  /* ─── Forced colors ─── */\n  @media (forced-colors: active) {\n    .ddga-metric__icon {\n      border: 1px solid CanvasText;\n    }\n    .ddga-metric__divider {\n      background-color: CanvasText;\n    }\n  }\n\n  /* ─── MetricGroup (layout parent for Metric cards) ─── */\n\n  .ddga-metric-group {\n    --ddga-metric-group-gap: var(--ddga-space-4);\n  }\n  .ddga-metric-group--gap-sm {\n    --ddga-metric-group-gap: var(--ddga-space-3);\n  }\n  .ddga-metric-group--gap-md {\n    --ddga-metric-group-gap: var(--ddga-space-4);\n  }\n  .ddga-metric-group--gap-lg {\n    --ddga-metric-group-gap: var(--ddga-space-6);\n  }\n\n  .ddga-metric-group--horizontal {\n    display: grid;\n    gap: var(--ddga-metric-group-gap);\n    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));\n  }\n  .ddga-metric-group--horizontal.ddga-metric-group--cols {\n    /* `columns` is a responsive MAX: up to N per row, wrapping down as the GROUP\n       (not the viewport) narrows — so it's container-aware, no media query. */\n    grid-template-columns: repeat(\n      auto-fit,\n      minmax(\n        max(\n          15rem,\n          calc(\n            (100% - (var(--ddga-metric-group-columns) - 1) * var(--ddga-metric-group-gap)) /\n              var(--ddga-metric-group-columns)\n          )\n        ),\n        1fr\n      )\n    );\n  }\n\n  .ddga-metric-group--vertical {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-metric-group-gap);\n  }\n\n  /* Inside a group, release the standalone width cap. */\n  .ddga-metric-group .ddga-metric {\n    max-inline-size: none;\n  }\n}\n"],"names":[]}

package/dist/components/modal.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-modal__overlay{z-index:60;background-color:#00000080;animation-duration:.15s;animation-timing-function:ease;position:fixed;inset:0}.ddga-modal{z-index:61;background-color:var(--ddga-color-card);color:var(--ddga-color-card-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-lg);box-shadow:var(--ddga-shadow-lg);flex-direction:column;max-block-size:calc(100vh - 2rem);inline-size:calc(100vw - 2rem);animation-duration:.18s;animation-timing-function:ease;display:flex;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.ddga-modal--sm{max-inline-size:360px}.ddga-modal--md{max-inline-size:480px}.ddga-modal--lg{max-inline-size:640px}.ddga-modal--xl{max-inline-size:800px}.ddga-modal--full{block-size:calc(100vh - 2rem);max-block-size:calc(100vh - 2rem);inline-size:calc(100vw - 2rem);max-inline-size:calc(100vw - 2rem)}.ddga-modal__header{gap:var(--ddga-space-1);padding:var(--ddga-space-5);flex-direction:column;padding-block-end:var(--ddga-space-3);display:flex}.ddga-modal__title{font-size:var(--ddga-font-size-lg);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-primary);margin:0;padding-inline-end:var(--ddga-space-8);line-height:1.4}.ddga-modal__description{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary);margin:0;line-height:1.5}.ddga-modal__body{min-block-size:0;padding-inline:var(--ddga-space-5);flex:auto;overflow-y:auto}.ddga-modal__header~*{padding-inline:var(--ddga-space-5)}.ddga-modal__footer{justify-content:flex-end;align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-5);border-block-start:1px solid var(--ddga-color-border);margin-block-start:auto;padding-block-start:var(--ddga-space-4);display:flex}.ddga-modal__close{block-size:2rem;inline-size:2rem;color:var(--ddga-text-secondary);cursor:pointer;border-radius:var(--ddga-radius-sm);background:0 0;border:0;justify-content:center;align-items:center;padding:0;transition:background-color .15s,color .15s;display:inline-flex;position:absolute;inset-block-start:var(--ddga-space-3);inset-inline-end:var(--ddga-space-3)}.ddga-modal__close>svg{block-size:1rem;inline-size:1rem}.ddga-modal__close:hover{background-color:var(--ddga-color-muted);color:var(--ddga-text-primary)}.ddga-modal__close:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-modal__overlay[data-state=open]{animation-name:ddga-modal-overlay-in}.ddga-modal__overlay[data-state=closed]{animation-name:ddga-modal-overlay-out}.ddga-modal[data-state=open]{animation-name:ddga-modal-in}.ddga-modal[data-state=closed]{animation-name:ddga-modal-out}@keyframes ddga-modal-overlay-in{0%{opacity:0}to{opacity:1}}@keyframes ddga-modal-overlay-out{0%{opacity:1}to{opacity:0}}@keyframes ddga-modal-in{0%{opacity:0;transform:translate(-50%,-50%)scale(.96)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@keyframes ddga-modal-out{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}to{opacity:0;transform:translate(-50%,-50%)scale(.96)}}@media (prefers-reduced-motion:reduce){.ddga-modal,.ddga-modal__overlay{animation-duration:0s}}@media (forced-colors:active){.ddga-modal{border-color:canvastext}.ddga-modal__close:focus-visible{box-shadow:none;outline:2px solid highlight}}}
+@layer ddga-components{.ddga-modal__overlay{z-index:60;background-color:#00000080;animation-duration:.15s;animation-timing-function:ease;position:fixed;inset:0}.ddga-modal{z-index:61;gap:var(--ddga-space-2);padding:var(--ddga-space-6);background-color:var(--ddga-color-card);color:var(--ddga-color-card-foreground);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-3xl);flex-direction:column;max-block-size:calc(100vh - 2rem);inline-size:calc(100vw - 2rem);animation-duration:.18s;animation-timing-function:ease;display:flex;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.ddga-modal--default{max-inline-size:600px}.ddga-modal--full{block-size:calc(100vh - 2rem);max-block-size:calc(100vh - 2rem);inline-size:calc(100vw - 2rem);max-inline-size:calc(100vw - 2rem)}.ddga-modal__header{gap:var(--ddga-space-2);flex-direction:column;padding-inline-end:var(--ddga-space-8);display:flex}.ddga-modal__header:has(.ddga-modal__featured-icon){padding-inline-end:0}.ddga-modal--centered .ddga-modal__header{text-align:center;align-items:center;padding-inline-end:0}.ddga-modal--centered .ddga-modal__body{text-align:center}.ddga-modal--centered .ddga-modal__footer{justify-content:center}.ddga-modal__featured-icon{border-radius:var(--ddga-radius-full);background-color:var(--ddga-gray-50);block-size:2.5rem;inline-size:2.5rem;color:var(--ddga-text-primary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-modal__featured-icon>svg{block-size:1.25rem;inline-size:1.25rem}.ddga-modal__title{font-size:var(--ddga-font-size-lg);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-gray-800);margin:0;line-height:1.75rem}.ddga-modal__description{font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-regular);color:var(--ddga-gray-700);margin:0;line-height:1.25rem}.ddga-modal__body{min-block-size:0;font-size:var(--ddga-font-size-sm);color:var(--ddga-gray-700);flex:auto;padding-block-end:var(--ddga-space-4);line-height:1.25rem;overflow-y:auto}.ddga-modal__footer{justify-content:flex-end;align-items:center;gap:var(--ddga-space-2);display:flex}@media (max-width:480px){.ddga-modal__footer{flex-direction:column-reverse;align-items:stretch}}.ddga-modal__close{block-size:2rem;inline-size:2rem;color:var(--ddga-text-primary);cursor:pointer;border-radius:var(--ddga-radius-sm);background:0 0;border:0;justify-content:center;align-items:center;padding:0;transition:background-color .15s,color .15s;display:inline-flex;position:absolute;inset-block-start:.875rem;inset-inline-end:.875rem}.ddga-modal__close>svg{block-size:1.25rem;inline-size:1.25rem}.ddga-modal__close:hover{background-color:var(--ddga-color-muted)}.ddga-modal__close:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-modal__overlay[data-state=open]{animation-name:ddga-modal-overlay-in}.ddga-modal__overlay[data-state=closed]{animation-name:ddga-modal-overlay-out}.ddga-modal[data-state=open]{animation-name:ddga-modal-in}.ddga-modal[data-state=closed]{animation-name:ddga-modal-out}@keyframes ddga-modal-overlay-in{0%{opacity:0}to{opacity:1}}@keyframes ddga-modal-overlay-out{0%{opacity:1}to{opacity:0}}@keyframes ddga-modal-in{0%{opacity:0;transform:translate(-50%,-50%)scale(.96)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@keyframes ddga-modal-out{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}to{opacity:0;transform:translate(-50%,-50%)scale(.96)}}[data-theme=dark] .ddga-modal__title{color:var(--ddga-text-primary)}[data-theme=dark] .ddga-modal__description,[data-theme=dark] .ddga-modal__body{color:var(--ddga-text-secondary)}[data-theme=dark] .ddga-modal__featured-icon{background-color:var(--ddga-alpha-white-10)}@media (prefers-reduced-motion:reduce){.ddga-modal,.ddga-modal__overlay{animation-duration:0s}}@media (forced-colors:active){.ddga-modal{border:1px solid canvastext}.ddga-modal__close:focus-visible{box-shadow:none;outline:2px solid highlight}}}
 /*# sourceMappingURL=modal.css.map */

package/dist/components/modal.css.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAGE,yIAaA,gcAgCA,sCAGA,sCAGA,sCAGA,sCAGA,oJAUA,iJAQA,kMAUA,sHAYA,gGAWA,yDAIA,uPAaA,iXAmBA,wDAIA,iGAIA,0FAOA,2EAGA,8EAGA,0DAGA,6DAIA,4DAQA,6DAQA,oIAUA,qIAWA,uCACE,wDAQF,8BACE,oCAGA","sources":["src/components/modal.css"],"sourcesContent":["@layer ddga-components {\n  /* ─── Overlay (backdrop) ─── */\n\n  .ddga-modal__overlay {\n    position: fixed;\n    inset: 0;\n    background-color: rgb(0 0 0 / 0.5);\n    /* Above tooltips (50) but allow Toast (future) to sit higher if it uses\n       60+. Modal lives at 60 by convention. */\n    z-index: 60;\n    animation-duration: 150ms;\n    animation-timing-function: ease;\n  }\n\n  /* ─── Content (the modal box) ─── */\n\n  .ddga-modal {\n    position: fixed;\n    /* Use physical `top`/`left` (NOT inset-block/inline-start) for centering.\n       Centering is symmetric across writing directions, but `inset-inline-start`\n       flips to `right` in RTL while `transform: translateX(-50%)` stays\n       physical — pairing them shifts the modal off-screen in RTL. The\n       physical pair is the established centered-overlay pattern and is\n       direction-correct because viewport-center doesn't care about `dir`. */\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 61;\n    display: flex;\n    flex-direction: column;\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-color-card-foreground);\n    border: 1px solid var(--ddga-color-border);\n    border-radius: var(--ddga-radius-lg);\n    box-shadow: var(--ddga-shadow-lg);\n    /* Keep the modal from spilling off small viewports. */\n    max-block-size: calc(100vh - 2rem);\n    inline-size: calc(100vw - 2rem);\n    overflow: hidden;\n    animation-duration: 180ms;\n    animation-timing-function: ease;\n  }\n\n  /* RTL: in RTL the inline axis flips. `translate(-50%, -50%)` still centers\n     correctly because translate is direction-agnostic. No override needed. */\n\n  /* ─── Sizes (max-inline-size caps; `full` is the takeover) ─── */\n\n  .ddga-modal--sm {\n    max-inline-size: 360px;\n  }\n  .ddga-modal--md {\n    max-inline-size: 480px;\n  }\n  .ddga-modal--lg {\n    max-inline-size: 640px;\n  }\n  .ddga-modal--xl {\n    max-inline-size: 800px;\n  }\n  .ddga-modal--full {\n    /* Edge-to-edge with a small breathing margin. */\n    max-inline-size: calc(100vw - 2rem);\n    max-block-size: calc(100vh - 2rem);\n    inline-size: calc(100vw - 2rem);\n    block-size: calc(100vh - 2rem);\n  }\n\n  /* ─── Sections ─── */\n\n  .ddga-modal__header {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-1);\n    padding: var(--ddga-space-5);\n    padding-block-end: var(--ddga-space-3);\n  }\n\n  .ddga-modal__title {\n    font-size: var(--ddga-font-size-lg);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.4;\n    margin: 0;\n    color: var(--ddga-text-primary);\n    /* Reserve room so the corner X never overlaps the title text. */\n    padding-inline-end: var(--ddga-space-8);\n  }\n\n  .ddga-modal__description {\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.5;\n    margin: 0;\n    color: var(--ddga-text-secondary);\n  }\n\n  /* Body — the opt-in scrollable middle region (mirrors DrawerBody): it grows\n     to fill the space between a pinned header and footer and scrolls internally\n     when content overflows, so a tall body never clips and the footer stays\n     visible with zero consumer config. `min-block-size:0` lets it shrink below\n     its content so the overflow engages. */\n  .ddga-modal__body {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    overflow-y: auto;\n    padding-inline: var(--ddga-space-5);\n  }\n\n  /* Unwrapped content: consumers may still drop raw paragraphs/forms directly\n     under ModalContent for short, non-scrolling bodies — this gives them the\n     same inline padding without requiring ModalBody. (ModalFooter owns its own\n     full padding, so it's unaffected by this inline-padding rule.) */\n  .ddga-modal__header ~ * {\n    padding-inline: var(--ddga-space-5);\n  }\n\n  .ddga-modal__footer {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-5);\n    padding-block-start: var(--ddga-space-4);\n    border-block-start: 1px solid var(--ddga-color-border);\n    margin-block-start: auto;\n  }\n\n  /* ─── Corner close (X) ─── */\n\n  .ddga-modal__close {\n    position: absolute;\n    inset-block-start: var(--ddga-space-3);\n    inset-inline-end: var(--ddga-space-3);\n    inline-size: 2rem;\n    block-size: 2rem;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0;\n    border: 0;\n    background: transparent;\n    color: var(--ddga-text-secondary);\n    cursor: pointer;\n    border-radius: var(--ddga-radius-sm);\n    transition:\n      background-color 150ms ease,\n      color 150ms ease;\n  }\n  .ddga-modal__close > svg {\n    inline-size: 1rem;\n    block-size: 1rem;\n  }\n  .ddga-modal__close:hover {\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-text-primary);\n  }\n  .ddga-modal__close:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  /* ─── Animations (Radix data-state) ─── */\n\n  .ddga-modal__overlay[data-state='open'] {\n    animation-name: ddga-modal-overlay-in;\n  }\n  .ddga-modal__overlay[data-state='closed'] {\n    animation-name: ddga-modal-overlay-out;\n  }\n  .ddga-modal[data-state='open'] {\n    animation-name: ddga-modal-in;\n  }\n  .ddga-modal[data-state='closed'] {\n    animation-name: ddga-modal-out;\n  }\n\n  @keyframes ddga-modal-overlay-in {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n  @keyframes ddga-modal-overlay-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n  @keyframes ddga-modal-in {\n    from {\n      opacity: 0;\n      transform: translate(-50%, -50%) scale(0.96);\n    }\n    to {\n      opacity: 1;\n      transform: translate(-50%, -50%) scale(1);\n    }\n  }\n  @keyframes ddga-modal-out {\n    from {\n      opacity: 1;\n      transform: translate(-50%, -50%) scale(1);\n    }\n    to {\n      opacity: 0;\n      transform: translate(-50%, -50%) scale(0.96);\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-modal,\n    .ddga-modal__overlay {\n      animation-duration: 0ms;\n    }\n  }\n\n  /* ─── Forced colors ─── */\n\n  @media (forced-colors: active) {\n    .ddga-modal {\n      border-color: CanvasText;\n    }\n    .ddga-modal__close:focus-visible {\n      outline: 2px solid Highlight;\n      box-shadow: none;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBACE,yIAWA,2cAuBA,2CAGA,oJAOA,sHAOA,yEAKA,oGAKA,0DAGA,iEAIA,sPAWA,sEAMA,2JASA,gKAUA,qLAUA,qGAQA,yBACE,uEAQF,uVAmBA,8DAIA,kEAGA,0FAKA,2EAGA,8EAGA,0DAGA,6DAIA,4DAQA,6DAQA,oIAUA,qIAYA,oEAGA,gHAIA,yFAIA,uCACE,wDAMF,8BACE,wCAGA","sources":["src/components/modal.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-modal__overlay {\n    position: fixed;\n    inset: 0;\n    background-color: rgb(0 0 0 / 0.5);\n    z-index: 60;\n    animation-duration: 150ms;\n    animation-timing-function: ease;\n  }\n\n  /* SDGA: white card, uniform 24 padding, 8 gap between regions, radius-md,\n     navy shadow-3xl, NO border. */\n  .ddga-modal {\n    position: fixed;\n    /* Physical top/left + translate keeps centering direction-agnostic (RTL-safe). */\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    z-index: 61;\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-6);\n    background-color: var(--ddga-color-card);\n    color: var(--ddga-color-card-foreground);\n    border-radius: var(--ddga-radius-md);\n    box-shadow: var(--ddga-shadow-3xl);\n    max-block-size: calc(100vh - 2rem);\n    inline-size: calc(100vw - 2rem);\n    overflow: hidden;\n    animation-duration: 180ms;\n    animation-timing-function: ease;\n  }\n\n  /* SDGA desktop width 600 / mobile narrows to viewport. */\n  .ddga-modal--default {\n    max-inline-size: 600px;\n  }\n  .ddga-modal--full {\n    max-inline-size: calc(100vw - 2rem);\n    max-block-size: calc(100vh - 2rem);\n    inline-size: calc(100vw - 2rem);\n    block-size: calc(100vh - 2rem);\n  }\n\n  .ddga-modal__header {\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n    /* No featured-icon row to clear the corner close → reserve end space. */\n    padding-inline-end: var(--ddga-space-8);\n  }\n  .ddga-modal__header:has(.ddga-modal__featured-icon) {\n    padding-inline-end: 0;\n  }\n\n  /* SDGA Center Align: centre the icon/title/body/actions; close stays cornered. */\n  .ddga-modal--centered .ddga-modal__header {\n    align-items: center;\n    text-align: center;\n    padding-inline-end: 0;\n  }\n  .ddga-modal--centered .ddga-modal__body {\n    text-align: center;\n  }\n  .ddga-modal--centered .ddga-modal__footer {\n    justify-content: center;\n  }\n\n  .ddga-modal__featured-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    inline-size: 2.5rem;\n    block-size: 2.5rem;\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-gray-50);\n    color: var(--ddga-text-primary);\n  }\n  .ddga-modal__featured-icon > svg {\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n  }\n\n  /* SDGA Text lg/Semibold 18/28, text-display. */\n  .ddga-modal__title {\n    margin: 0;\n    font-size: var(--ddga-font-size-lg);\n    font-weight: var(--ddga-font-weight-semibold);\n    line-height: 1.75rem;\n    color: var(--ddga-gray-800);\n  }\n\n  /* SDGA Text sm/Regular 14/20, text-primary-paragraph. */\n  .ddga-modal__description {\n    margin: 0;\n    font-size: var(--ddga-font-size-sm);\n    font-weight: var(--ddga-font-weight-regular);\n    line-height: 1.25rem;\n    color: var(--ddga-gray-700);\n  }\n\n  /* Body region: SDGA supporting copy (pb-16) + the scroll region for long\n     content (grows between header and footer, scrolls internally). */\n  .ddga-modal__body {\n    flex: 1 1 auto;\n    min-block-size: 0;\n    overflow-y: auto;\n    padding-block-end: var(--ddga-space-4);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.25rem;\n    color: var(--ddga-gray-700);\n  }\n\n  .ddga-modal__footer {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    gap: var(--ddga-space-2);\n  }\n\n  /* SDGA mobile: actions stack full-width, primary on top (DOM-last → reverse). */\n  @media (max-width: 480px) {\n    .ddga-modal__footer {\n      flex-direction: column-reverse;\n      align-items: stretch;\n    }\n  }\n\n  /* Corner close (X) — SDGA: 32 box pinned to the title's top-end corner,\n     20px glyph, radius-sm. */\n  .ddga-modal__close {\n    position: absolute;\n    inset-block-start: 0.875rem;\n    inset-inline-end: 0.875rem;\n    inline-size: 2rem;\n    block-size: 2rem;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0;\n    border: 0;\n    background: transparent;\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n    border-radius: var(--ddga-radius-sm);\n    transition:\n      background-color 150ms ease,\n      color 150ms ease;\n  }\n  .ddga-modal__close > svg {\n    inline-size: 1.25rem;\n    block-size: 1.25rem;\n  }\n  .ddga-modal__close:hover {\n    background-color: var(--ddga-color-muted);\n  }\n  .ddga-modal__close:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-color-ring);\n  }\n\n  .ddga-modal__overlay[data-state='open'] {\n    animation-name: ddga-modal-overlay-in;\n  }\n  .ddga-modal__overlay[data-state='closed'] {\n    animation-name: ddga-modal-overlay-out;\n  }\n  .ddga-modal[data-state='open'] {\n    animation-name: ddga-modal-in;\n  }\n  .ddga-modal[data-state='closed'] {\n    animation-name: ddga-modal-out;\n  }\n\n  @keyframes ddga-modal-overlay-in {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n  @keyframes ddga-modal-overlay-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n  @keyframes ddga-modal-in {\n    from {\n      opacity: 0;\n      transform: translate(-50%, -50%) scale(0.96);\n    }\n    to {\n      opacity: 1;\n      transform: translate(-50%, -50%) scale(1);\n    }\n  }\n  @keyframes ddga-modal-out {\n    from {\n      opacity: 1;\n      transform: translate(-50%, -50%) scale(1);\n    }\n    to {\n      opacity: 0;\n      transform: translate(-50%, -50%) scale(0.96);\n    }\n  }\n\n  /* Dark: raw ramp colours don't flip on their own — map to flipping semantics. */\n  [data-theme='dark'] .ddga-modal__title {\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-modal__description,\n  [data-theme='dark'] .ddga-modal__body {\n    color: var(--ddga-text-secondary);\n  }\n  [data-theme='dark'] .ddga-modal__featured-icon {\n    background-color: var(--ddga-alpha-white-10);\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-modal,\n    .ddga-modal__overlay {\n      animation-duration: 0ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .ddga-modal {\n      border: 1px solid CanvasText;\n    }\n    .ddga-modal__close:focus-visible {\n      outline: 2px solid Highlight;\n      box-shadow: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/notification-toast.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-notification-toast-viewport{z-index:70;gap:var(--ddga-space-2);padding:var(--ddga-space-4);pointer-events:none;flex-direction:column;inline-size:min(484px,100% - 2rem);margin:0;list-style:none;display:flex;position:fixed}.ddga-notification-toast-viewport>*{pointer-events:auto}.ddga-notification-toast-viewport--containerized{position:absolute}.ddga-notification-toast-viewport--top-start{inset-block-start:0;inset-inline-start:0}.ddga-notification-toast-viewport--top-center{top:0;left:50%;transform:translate(-50%)}.ddga-notification-toast-viewport--top-end{inset-block-start:0;inset-inline-end:0}.ddga-notification-toast-viewport--bottom-start{flex-direction:column-reverse;inset-block-end:0;inset-inline-start:0}.ddga-notification-toast-viewport--bottom-center{flex-direction:column-reverse;bottom:0;left:50%;transform:translate(-50%)}.ddga-notification-toast-viewport--bottom-end{flex-direction:column-reverse;inset-block-end:0;inset-inline-end:0}.ddga-notification-toast{--ddga-notification-toast-stripe:var(--ddga-gray-200);--ddga-notification-toast-icon-bg:var(--ddga-gray-50);--ddga-notification-toast-icon-fg:var(--ddga-text-primary);pointer-events:auto;gap:var(--ddga-space-4);inline-size:100%;min-inline-size:0;padding-block:var(--ddga-space-4);padding-inline:var(--ddga-space-6);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-3xl);background-color:#fff;flex-direction:column;font-family:inherit;display:flex;position:relative;overflow:hidden;container-type:inline-size}.ddga-notification-toast--default{--ddga-notification-toast-stripe:var(--ddga-gray-200);--ddga-notification-toast-icon-bg:var(--ddga-gray-50);--ddga-notification-toast-icon-fg:var(--ddga-text-primary)}.ddga-notification-toast--info{--ddga-notification-toast-stripe:var(--ddga-info-600);--ddga-notification-toast-icon-bg:var(--ddga-info-50);--ddga-notification-toast-icon-fg:var(--ddga-info-700)}.ddga-notification-toast--success{--ddga-notification-toast-stripe:var(--ddga-success-600);--ddga-notification-toast-icon-bg:var(--ddga-success-50);--ddga-notification-toast-icon-fg:var(--ddga-success-700)}.ddga-notification-toast--warning{--ddga-notification-toast-stripe:var(--ddga-warning-600);--ddga-notification-toast-icon-bg:var(--ddga-warning-50);--ddga-notification-toast-icon-fg:var(--ddga-warning-700)}.ddga-notification-toast--destructive{--ddga-notification-toast-stripe:var(--ddga-error-600);--ddga-notification-toast-icon-bg:var(--ddga-error-50);--ddga-notification-toast-icon-fg:var(--ddga-error-700)}.ddga-notification-toast__stripe{background-color:var(--ddga-notification-toast-stripe);opacity:.7;inline-size:8px;position:absolute;inset-block:0;inset-inline-start:0}.ddga-notification-toast__header{align-items:start;column-gap:var(--ddga-space-3);grid-template-columns:auto 1fr auto;grid-template-areas:"icon text close";inline-size:100%;display:grid}.ddga-notification-toast__icon{border-radius:var(--ddga-radius-full);background-color:var(--ddga-notification-toast-icon-bg);block-size:40px;inline-size:40px;color:var(--ddga-notification-toast-icon-fg);flex-shrink:0;grid-area:icon;justify-content:center;align-items:center;display:inline-flex}.ddga-notification-toast__icon>svg{block-size:20px;inline-size:20px}.ddga-notification-toast__text{justify-content:center;gap:var(--ddga-space-2);word-break:break-word;flex-direction:column;grid-area:text;min-block-size:40px;min-inline-size:0;display:flex}.ddga-notification-toast__title{font-size:var(--ddga-font-size-base);line-height:1.5rem;font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-gray-800);margin:0}.ddga-notification-toast__description{font-size:var(--ddga-font-size-sm);color:var(--ddga-gray-700);margin:0;line-height:1.25rem}.ddga-notification-toast__close{block-size:32px;inline-size:32px;color:var(--ddga-text-primary);border-radius:var(--ddga-radius-sm);cursor:pointer;background:0 0;border:0;flex-shrink:0;grid-area:close;justify-content:center;align-items:center;padding:0;transition:background-color .15s;display:inline-flex}.ddga-notification-toast__close>svg{block-size:20px;inline-size:20px}.ddga-notification-toast__close:hover{background-color:var(--ddga-gray-100)}.ddga-notification-toast__close:focus-visible{box-shadow:0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-notification-toast__actions{gap:var(--ddga-space-2);inline-size:100%;padding-inline:var(--ddga-space-10);display:flex}.ddga-notification-toast__action{justify-content:center;align-items:center;gap:var(--ddga-space-1);block-size:32px;padding-inline:var(--ddga-space-3);border-radius:var(--ddga-radius-sm);font-family:inherit;font-size:var(--ddga-font-size-sm);line-height:1.25rem;font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-primary);white-space:nowrap;cursor:pointer;background:0 0;border:0;transition:background-color .15s;display:inline-flex}.ddga-notification-toast__action:hover{background-color:var(--ddga-gray-100)}.ddga-notification-toast__action:focus-visible{box-shadow:0 0 0 2px var(--ddga-text-primary);outline:none}@container (width<=400px){.ddga-notification-toast{padding-inline:var(--ddga-space-4)}.ddga-notification-toast__stripe{block-size:8px;inline-size:auto;inset-block:0 auto;inset-inline:0}.ddga-notification-toast__header{row-gap:var(--ddga-space-4);grid-template-areas:"icon.close""text text text"}.ddga-notification-toast__text{gap:var(--ddga-space-1);min-block-size:0}.ddga-notification-toast__actions{flex-direction:column;align-items:stretch;padding-inline:0}.ddga-notification-toast__action{inline-size:100%}.ddga-notification-toast__action:first-child{block-size:40px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base);background-color:var(--ddga-gray-100);line-height:1.5rem}.ddga-notification-toast__action:first-child:hover{background-color:var(--ddga-gray-200)}[data-theme=dark] .ddga-notification-toast__action:first-child{background-color:var(--ddga-gray-800)}[data-theme=dark] .ddga-notification-toast__action:first-child:hover{background-color:var(--ddga-gray-700)}}.ddga-notification-toast[data-state=open]{animation:.22s cubic-bezier(.16,1,.3,1) ddga-notification-toast-in}.ddga-notification-toast[data-state=closed]{animation:.18s forwards ddga-notification-toast-out}.ddga-notification-toast-viewport[data-position^=bottom-] .ddga-notification-toast[data-state=open]{animation-name:ddga-notification-toast-slide-up}.ddga-notification-toast-viewport[data-position^=top-] .ddga-notification-toast[data-state=open]{animation-name:ddga-notification-toast-slide-down}.ddga-notification-toast[data-swipe=move]{transform:translate3d(var(--radix-toast-swipe-move-x,0), var(--radix-toast-swipe-move-y,0), 0)}.ddga-notification-toast[data-swipe=cancel]{transition:transform .2s ease-out;transform:translate(0,0)}.ddga-notification-toast[data-swipe=end]{animation:.18s forwards ddga-notification-toast-out}@keyframes ddga-notification-toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes ddga-notification-toast-slide-up{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes ddga-notification-toast-slide-down{0%{opacity:0;transform:translateY(-24px)}to{opacity:1;transform:translateY(0)}}@keyframes ddga-notification-toast-out{0%{opacity:1}to{opacity:0;transform:scale(.95)}}@media (prefers-reduced-motion:reduce){.ddga-notification-toast,.ddga-notification-toast[data-state=open],.ddga-notification-toast[data-state=closed]{animation-duration:1ms}}[data-theme=dark] .ddga-notification-toast{background-color:var(--ddga-gray-900,#111927)}[data-theme=dark] .ddga-notification-toast__title{color:var(--ddga-gray-50)}[data-theme=dark] .ddga-notification-toast__description{color:var(--ddga-gray-300)}[data-theme=dark] .ddga-notification-toast__close,[data-theme=dark] .ddga-notification-toast__action{color:var(--ddga-gray-50)}[data-theme=dark] .ddga-notification-toast__close:hover,[data-theme=dark] .ddga-notification-toast__action:hover{background-color:var(--ddga-gray-800)}[data-theme=dark] .ddga-notification-toast__close:focus-visible,[data-theme=dark] .ddga-notification-toast__action:focus-visible{box-shadow:0 0 0 2px var(--ddga-gray-50)}@media (forced-colors:active){.ddga-notification-toast{border:1px solid canvastext}.ddga-notification-toast__close:focus-visible,.ddga-notification-toast__action:focus-visible{box-shadow:none;outline:2px solid highlight}}}
+/*# sourceMappingURL=notification-toast.css.map */

package/dist/components/notification-toast.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBACE,mOAcA,wDAIA,mEAMA,sFAIA,uFAKA,kFAIA,qHAKA,2HAMA,iHAQA,oiBAuBA,yMAKA,kMAKA,8MAKA,8MAKA,4MAQA,wKAWA,0LASA,sSAYA,oEAKA,4LAWA,yKAOA,iIASA,kTAgBA,qEAIA,4EAGA,yGAOA,4HAOA,8bAmBA,6EAGA,0GAOA,0BACE,4DAGA,mGAMA,8GAMA,wEAIA,6FAMA,kDAIA,8LAOA,yFAGA,qGAGA,4GAMF,6GAGA,gGAGA,oJAIA,mJAKA,yIAOA,uGAIA,6FAIA,mHAUA,0HAUA,6HAUA,uFAUA,uCACE,uIASF,yFAGA,4EAGA,mFAGA,+HAIA,uJAIA,0KAOA,8BACE,qDAGA","sources":["src/components/notification-toast.css"],"sourcesContent":["@layer ddga-components {\n  .ddga-notification-toast-viewport {\n    position: fixed;\n    z-index: 70;\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-2);\n    padding: var(--ddga-space-4);\n    /* min() caps at the SDGA desktop width (484) and fills narrow screens minus\n       side breathing room — single rule, no vw media query. */\n    inline-size: min(484px, calc(100% - 2rem));\n    pointer-events: none;\n    list-style: none;\n    margin: 0;\n  }\n  .ddga-notification-toast-viewport > * {\n    pointer-events: auto;\n  }\n\n  .ddga-notification-toast-viewport--containerized {\n    position: absolute;\n  }\n\n  /* ─── Position anchors ─── */\n\n  .ddga-notification-toast-viewport--top-start {\n    inset-block-start: 0;\n    inset-inline-start: 0;\n  }\n  .ddga-notification-toast-viewport--top-center {\n    top: 0;\n    left: 50%;\n    transform: translateX(-50%);\n  }\n  .ddga-notification-toast-viewport--top-end {\n    inset-block-start: 0;\n    inset-inline-end: 0;\n  }\n  .ddga-notification-toast-viewport--bottom-start {\n    inset-block-end: 0;\n    inset-inline-start: 0;\n    flex-direction: column-reverse;\n  }\n  .ddga-notification-toast-viewport--bottom-center {\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    flex-direction: column-reverse;\n  }\n  .ddga-notification-toast-viewport--bottom-end {\n    inset-block-end: 0;\n    inset-inline-end: 0;\n    flex-direction: column-reverse;\n  }\n\n  /* ─── Toast (one notification) ─── */\n\n  .ddga-notification-toast {\n    --ddga-notification-toast-stripe: var(--ddga-gray-200);\n    --ddga-notification-toast-icon-bg: var(--ddga-gray-50);\n    --ddga-notification-toast-icon-fg: var(--ddga-text-primary);\n\n    position: relative;\n    inline-size: 100%;\n    min-inline-size: 0;\n    pointer-events: auto;\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-4);\n    padding-block: var(--ddga-space-4);\n    padding-inline: var(--ddga-space-6);\n    background-color: #fff;\n    border-radius: var(--ddga-radius-md);\n    /* Toast shell: no border (InlineAlert has one), navy drop shadow instead. */\n    box-shadow: var(--ddga-shadow-3xl);\n    overflow: hidden;\n    container-type: inline-size;\n    font-family: inherit;\n  }\n\n  .ddga-notification-toast--default {\n    --ddga-notification-toast-stripe: var(--ddga-gray-200);\n    --ddga-notification-toast-icon-bg: var(--ddga-gray-50);\n    --ddga-notification-toast-icon-fg: var(--ddga-text-primary);\n  }\n  .ddga-notification-toast--info {\n    --ddga-notification-toast-stripe: var(--ddga-info-600);\n    --ddga-notification-toast-icon-bg: var(--ddga-info-50);\n    --ddga-notification-toast-icon-fg: var(--ddga-info-700);\n  }\n  .ddga-notification-toast--success {\n    --ddga-notification-toast-stripe: var(--ddga-success-600);\n    --ddga-notification-toast-icon-bg: var(--ddga-success-50);\n    --ddga-notification-toast-icon-fg: var(--ddga-success-700);\n  }\n  .ddga-notification-toast--warning {\n    --ddga-notification-toast-stripe: var(--ddga-warning-600);\n    --ddga-notification-toast-icon-bg: var(--ddga-warning-50);\n    --ddga-notification-toast-icon-fg: var(--ddga-warning-700);\n  }\n  .ddga-notification-toast--destructive {\n    --ddga-notification-toast-stripe: var(--ddga-error-600);\n    --ddga-notification-toast-icon-bg: var(--ddga-error-50);\n    --ddga-notification-toast-icon-fg: var(--ddga-error-700);\n  }\n\n  /* ─── Accent stripe (leading edge → top edge on mobile) ─── */\n\n  .ddga-notification-toast__stripe {\n    position: absolute;\n    inset-block: 0;\n    inset-inline-start: 0;\n    inline-size: 8px;\n    background-color: var(--ddga-notification-toast-stripe);\n    opacity: 0.7;\n  }\n\n  /* ─── Header (featured icon · text · close) ─── */\n\n  .ddga-notification-toast__header {\n    display: grid;\n    grid-template-columns: auto 1fr auto;\n    grid-template-areas: 'icon text close';\n    align-items: start;\n    column-gap: var(--ddga-space-3);\n    inline-size: 100%;\n  }\n\n  .ddga-notification-toast__icon {\n    grid-area: icon;\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 40px;\n    block-size: 40px;\n    border-radius: var(--ddga-radius-full);\n    background-color: var(--ddga-notification-toast-icon-bg);\n    color: var(--ddga-notification-toast-icon-fg);\n  }\n  .ddga-notification-toast__icon > svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n\n  .ddga-notification-toast__text {\n    grid-area: text;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    gap: var(--ddga-space-2);\n    min-block-size: 40px;\n    min-inline-size: 0;\n    word-break: break-word;\n  }\n\n  .ddga-notification-toast__title {\n    margin: 0;\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5rem;\n    font-weight: var(--ddga-font-weight-semibold);\n    color: var(--ddga-gray-800);\n  }\n  .ddga-notification-toast__description {\n    margin: 0;\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.25rem;\n    color: var(--ddga-gray-700);\n  }\n\n  /* ─── Close button ─── */\n\n  .ddga-notification-toast__close {\n    grid-area: close;\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 32px;\n    block-size: 32px;\n    padding: 0;\n    border: 0;\n    background: transparent;\n    color: var(--ddga-text-primary);\n    border-radius: var(--ddga-radius-sm);\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-notification-toast__close > svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n  .ddga-notification-toast__close:hover {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-notification-toast__close:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-text-primary);\n  }\n\n  /* ─── Actions row (md ghost text buttons, indented under the text) ─── */\n\n  .ddga-notification-toast__actions {\n    display: flex;\n    gap: var(--ddga-space-2);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-10);\n  }\n\n  .ddga-notification-toast__action {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--ddga-space-1);\n    block-size: 32px;\n    padding-inline: var(--ddga-space-3);\n    border: 0;\n    background: transparent;\n    border-radius: var(--ddga-radius-sm);\n    font-family: inherit;\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.25rem;\n    font-weight: var(--ddga-font-weight-medium);\n    color: var(--ddga-text-primary);\n    white-space: nowrap;\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-notification-toast__action:hover {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-notification-toast__action:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-text-primary);\n  }\n\n  /* ─── Mobile restack (narrow toast) ─── */\n\n  @container (max-width: 400px) {\n    .ddga-notification-toast {\n      padding-inline: var(--ddga-space-4);\n    }\n    .ddga-notification-toast__stripe {\n      inset-block: 0 auto;\n      inset-inline: 0;\n      inline-size: auto;\n      block-size: 8px;\n    }\n    .ddga-notification-toast__header {\n      grid-template-areas:\n        'icon . close'\n        'text text text';\n      row-gap: var(--ddga-space-4);\n    }\n    .ddga-notification-toast__text {\n      min-block-size: 0;\n      gap: var(--ddga-space-1);\n    }\n    .ddga-notification-toast__actions {\n      flex-direction: column;\n      align-items: stretch;\n      padding-inline: 0;\n    }\n\n    .ddga-notification-toast__action {\n      inline-size: 100%;\n    }\n    /* Only the primary (first) action fills; a secondary action stays ghost (SDGA). */\n    .ddga-notification-toast__action:first-child {\n      block-size: 40px;\n      padding-inline: var(--ddga-space-4);\n      font-size: var(--ddga-font-size-base);\n      line-height: 1.5rem;\n      background-color: var(--ddga-gray-100);\n    }\n    .ddga-notification-toast__action:first-child:hover {\n      background-color: var(--ddga-gray-200);\n    }\n    [data-theme='dark'] .ddga-notification-toast__action:first-child {\n      background-color: var(--ddga-gray-800);\n    }\n    [data-theme='dark'] .ddga-notification-toast__action:first-child:hover {\n      background-color: var(--ddga-gray-700);\n    }\n  }\n\n  /* ─── Animations (Radix data-state + swipe) ─── */\n  .ddga-notification-toast[data-state='open'] {\n    animation: ddga-notification-toast-in 220ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n  .ddga-notification-toast[data-state='closed'] {\n    animation: ddga-notification-toast-out 180ms ease forwards;\n  }\n  .ddga-notification-toast-viewport[data-position^='bottom-']\n    .ddga-notification-toast[data-state='open'] {\n    animation-name: ddga-notification-toast-slide-up;\n  }\n  .ddga-notification-toast-viewport[data-position^='top-']\n    .ddga-notification-toast[data-state='open'] {\n    animation-name: ddga-notification-toast-slide-down;\n  }\n\n  .ddga-notification-toast[data-swipe='move'] {\n    transform: translate3d(\n      var(--radix-toast-swipe-move-x, 0),\n      var(--radix-toast-swipe-move-y, 0),\n      0\n    );\n  }\n  .ddga-notification-toast[data-swipe='cancel'] {\n    transform: translate3d(0, 0, 0);\n    transition: transform 200ms ease-out;\n  }\n  .ddga-notification-toast[data-swipe='end'] {\n    animation: ddga-notification-toast-out 180ms ease forwards;\n  }\n\n  @keyframes ddga-notification-toast-in {\n    from {\n      opacity: 0;\n      transform: translateY(8px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n  @keyframes ddga-notification-toast-slide-up {\n    from {\n      opacity: 0;\n      transform: translateY(24px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n  @keyframes ddga-notification-toast-slide-down {\n    from {\n      opacity: 0;\n      transform: translateY(-24px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n  @keyframes ddga-notification-toast-out {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n      transform: scale(0.95);\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-notification-toast,\n    .ddga-notification-toast[data-state='open'],\n    .ddga-notification-toast[data-state='closed'] {\n      animation-duration: 1ms;\n    }\n  }\n\n  /* ─── Dark ─── */\n\n  [data-theme='dark'] .ddga-notification-toast {\n    background-color: var(--ddga-gray-900, #111927);\n  }\n  [data-theme='dark'] .ddga-notification-toast__title {\n    color: var(--ddga-gray-50);\n  }\n  [data-theme='dark'] .ddga-notification-toast__description {\n    color: var(--ddga-gray-300);\n  }\n  [data-theme='dark'] .ddga-notification-toast__close,\n  [data-theme='dark'] .ddga-notification-toast__action {\n    color: var(--ddga-gray-50);\n  }\n  [data-theme='dark'] .ddga-notification-toast__close:hover,\n  [data-theme='dark'] .ddga-notification-toast__action:hover {\n    background-color: var(--ddga-gray-800);\n  }\n  [data-theme='dark'] .ddga-notification-toast__close:focus-visible,\n  [data-theme='dark'] .ddga-notification-toast__action:focus-visible {\n    box-shadow: 0 0 0 2px var(--ddga-gray-50);\n  }\n\n  /* ─── Forced colors (no border + shadow vanish → add a visible edge) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-notification-toast {\n      border: 1px solid CanvasText;\n    }\n    .ddga-notification-toast__close:focus-visible,\n    .ddga-notification-toast__action:focus-visible {\n      outline: 2px solid Highlight;\n      box-shadow: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/notification.css

@@ -0,0 +1,2 @@
+@layer ddga-components{.ddga-notification{--ddga-notification-fill:var(--ddga-gray-50);--ddga-notification-text:var(--ddga-gray-700);--ddga-notification-accent:var(--ddga-text-primary);--ddga-notification-line-opacity:.6;gap:var(--ddga-space-4);padding-block:var(--ddga-space-2);padding-inline:var(--ddga-space-6);border-radius:var(--ddga-radius-xs);background-color:var(--ddga-notification-fill);flex-direction:column;font-family:inherit;display:flex;position:relative;overflow:clip}.ddga-notification--info{--ddga-notification-fill:var(--ddga-info-50);--ddga-notification-text:var(--ddga-info-700);--ddga-notification-accent:var(--ddga-info-600);--ddga-notification-line-opacity:.7}.ddga-notification--success{--ddga-notification-fill:var(--ddga-success-50);--ddga-notification-text:var(--ddga-success-700);--ddga-notification-accent:var(--ddga-success-600);--ddga-notification-line-opacity:.7}.ddga-notification--warning{--ddga-notification-fill:var(--ddga-warning-50);--ddga-notification-text:var(--ddga-warning-700);--ddga-notification-accent:var(--ddga-warning-600);--ddga-notification-line-opacity:.7}.ddga-notification--critical{--ddga-notification-fill:var(--ddga-error-50);--ddga-notification-text:var(--ddga-error-700);--ddga-notification-accent:var(--ddga-error-600);--ddga-notification-line-opacity:.7}.ddga-notification__title{align-items:center;gap:var(--ddga-space-3);inline-size:100%;padding-inline:var(--ddga-space-6);display:flex;position:relative}.ddga-notification__content{align-content:center;align-items:center;gap:var(--ddga-space-2);flex-wrap:wrap;flex:1 0 0;min-block-size:40px;min-inline-size:0;display:flex}.ddga-notification__icon{block-size:24px;inline-size:24px;color:var(--ddga-notification-accent);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-notification__icon>svg{block-size:24px;inline-size:24px}.ddga-notification__lead{font-size:var(--ddga-font-size-base);line-height:1.5rem;font-weight:var(--ddga-font-weight-bold);color:var(--ddga-notification-text);white-space:nowrap}.ddga-notification__message{min-inline-size:0;font-size:var(--ddga-font-size-base);color:var(--ddga-notification-text);word-break:break-word;flex:1 0 0;margin:0;line-height:1.5rem}.ddga-notification__actions{align-items:center;gap:var(--ddga-space-2);flex-shrink:0;display:flex}.ddga-notification__close{block-size:32px;inline-size:32px;color:var(--ddga-text-primary);border-radius:var(--ddga-radius-sm);cursor:pointer;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background-color .15s;display:inline-flex;position:absolute;inset-block-start:4px;inset-inline-end:-8px}.ddga-notification__close>svg{block-size:20px;inline-size:20px}.ddga-notification__close:hover{background-color:var(--ddga-gray-100)}.ddga-notification__close:focus-visible{box-shadow:0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-notification__line{background-color:var(--ddga-notification-accent);block-size:2px;opacity:var(--ddga-notification-line-opacity);position:absolute;inset-block-end:0;inset-inline:0}[data-theme=dark] .ddga-notification{--ddga-notification-fill:var(--ddga-gray-900,#111927);--ddga-notification-text:var(--ddga-gray-100);--ddga-notification-accent:var(--ddga-gray-400)}[data-theme=dark] .ddga-notification--info{--ddga-notification-text:var(--ddga-info-300);--ddga-notification-accent:var(--ddga-info-400)}[data-theme=dark] .ddga-notification--success{--ddga-notification-text:var(--ddga-success-300);--ddga-notification-accent:var(--ddga-success-400)}[data-theme=dark] .ddga-notification--warning{--ddga-notification-text:var(--ddga-warning-300);--ddga-notification-accent:var(--ddga-warning-400)}[data-theme=dark] .ddga-notification--critical{--ddga-notification-text:var(--ddga-error-300);--ddga-notification-accent:var(--ddga-error-400)}[data-theme=dark] .ddga-notification__close{color:var(--ddga-gray-50)}[data-theme=dark] .ddga-notification__close:hover{background-color:var(--ddga-gray-800)}[data-theme=dark] .ddga-notification__close:focus-visible{box-shadow:0 0 0 2px var(--ddga-gray-50)}@media (forced-colors:active){.ddga-notification{border:1px solid canvastext}.ddga-notification__close:focus-visible{box-shadow:none;outline:2px solid highlight}}}
+/*# sourceMappingURL=notification.css.map */

package/dist/components/notification.css.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,uBAEE,6cAkBA,wMAMA,oNAMA,oNAMA,+MAOA,wJASA,yKAWA,4KASA,8DAKA,iLAQA,oLAUA,kGAQA,0VAkBA,+DAIA,sEAGA,mGAMA,0LAUA,yLAKA,yIAIA,kJAIA,kJAIA,+IAIA,sEAGA,wFAGA,mGAIA,8BACE,+CAGA","sources":["src/components/notification.css"],"sourcesContent":["@layer ddga-components {\n  /* SDGA Notification — full-width actionable system banner (56px tonal bar). */\n  .ddga-notification {\n    --ddga-notification-fill: var(--ddga-gray-50);\n    --ddga-notification-text: var(--ddga-gray-700);\n    --ddga-notification-accent: var(--ddga-text-primary);\n    --ddga-notification-line-opacity: 0.6;\n\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    gap: var(--ddga-space-4);\n    padding-block: var(--ddga-space-2);\n    padding-inline: var(--ddga-space-6);\n    border-radius: var(--ddga-radius-xs);\n    background-color: var(--ddga-notification-fill);\n    overflow: clip;\n    font-family: inherit;\n  }\n\n  .ddga-notification--info {\n    --ddga-notification-fill: var(--ddga-info-50);\n    --ddga-notification-text: var(--ddga-info-700);\n    --ddga-notification-accent: var(--ddga-info-600);\n    --ddga-notification-line-opacity: 0.7;\n  }\n  .ddga-notification--success {\n    --ddga-notification-fill: var(--ddga-success-50);\n    --ddga-notification-text: var(--ddga-success-700);\n    --ddga-notification-accent: var(--ddga-success-600);\n    --ddga-notification-line-opacity: 0.7;\n  }\n  .ddga-notification--warning {\n    --ddga-notification-fill: var(--ddga-warning-50);\n    --ddga-notification-text: var(--ddga-warning-700);\n    --ddga-notification-accent: var(--ddga-warning-600);\n    --ddga-notification-line-opacity: 0.7;\n  }\n  .ddga-notification--critical {\n    --ddga-notification-fill: var(--ddga-error-50);\n    --ddga-notification-text: var(--ddga-error-700);\n    --ddga-notification-accent: var(--ddga-error-600);\n    --ddga-notification-line-opacity: 0.7;\n  }\n\n  .ddga-notification__title {\n    position: relative;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-3);\n    inline-size: 100%;\n    padding-inline: var(--ddga-space-6);\n  }\n\n  .ddga-notification__content {\n    display: flex;\n    flex: 1 0 0;\n    flex-wrap: wrap;\n    align-items: center;\n    align-content: center;\n    gap: var(--ddga-space-2);\n    min-block-size: 40px;\n    min-inline-size: 0;\n  }\n\n  .ddga-notification__icon {\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 24px;\n    block-size: 24px;\n    color: var(--ddga-notification-accent);\n  }\n  .ddga-notification__icon > svg {\n    inline-size: 24px;\n    block-size: 24px;\n  }\n\n  .ddga-notification__lead {\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5rem;\n    font-weight: var(--ddga-font-weight-bold);\n    color: var(--ddga-notification-text);\n    white-space: nowrap;\n  }\n\n  .ddga-notification__message {\n    flex: 1 0 0;\n    min-inline-size: 0;\n    margin: 0;\n    font-size: var(--ddga-font-size-base);\n    line-height: 1.5rem;\n    color: var(--ddga-notification-text);\n    word-break: break-word;\n  }\n\n  .ddga-notification__actions {\n    flex-shrink: 0;\n    display: flex;\n    align-items: center;\n    gap: var(--ddga-space-2);\n  }\n\n  /* Absolute close: top-trailing, optically inset past the title row's padding (SDGA right:-8 / top:4). */\n  .ddga-notification__close {\n    position: absolute;\n    inset-block-start: 4px;\n    inset-inline-end: -8px;\n    flex-shrink: 0;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: 32px;\n    block-size: 32px;\n    padding: 0;\n    border: 0;\n    background: transparent;\n    color: var(--ddga-text-primary);\n    border-radius: var(--ddga-radius-sm);\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-notification__close > svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n  .ddga-notification__close:hover {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-notification__close:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 2px var(--ddga-text-primary);\n  }\n\n  /* Full-bleed 2px bottom accent line (clipped to radius by the container's overflow). */\n  .ddga-notification__line {\n    position: absolute;\n    inset-inline: 0;\n    inset-block-end: 0;\n    block-size: 2px;\n    background-color: var(--ddga-notification-accent);\n    opacity: var(--ddga-notification-line-opacity);\n  }\n\n  /* SDGA is light-only — adapt to a dark surface, keeping the type accent legible. */\n  [data-theme='dark'] .ddga-notification {\n    --ddga-notification-fill: var(--ddga-gray-900, #111927);\n    --ddga-notification-text: var(--ddga-gray-100);\n    --ddga-notification-accent: var(--ddga-gray-400);\n  }\n  [data-theme='dark'] .ddga-notification--info {\n    --ddga-notification-text: var(--ddga-info-300);\n    --ddga-notification-accent: var(--ddga-info-400);\n  }\n  [data-theme='dark'] .ddga-notification--success {\n    --ddga-notification-text: var(--ddga-success-300);\n    --ddga-notification-accent: var(--ddga-success-400);\n  }\n  [data-theme='dark'] .ddga-notification--warning {\n    --ddga-notification-text: var(--ddga-warning-300);\n    --ddga-notification-accent: var(--ddga-warning-400);\n  }\n  [data-theme='dark'] .ddga-notification--critical {\n    --ddga-notification-text: var(--ddga-error-300);\n    --ddga-notification-accent: var(--ddga-error-400);\n  }\n  [data-theme='dark'] .ddga-notification__close {\n    color: var(--ddga-gray-50);\n  }\n  [data-theme='dark'] .ddga-notification__close:hover {\n    background-color: var(--ddga-gray-800);\n  }\n  [data-theme='dark'] .ddga-notification__close:focus-visible {\n    box-shadow: 0 0 0 2px var(--ddga-gray-50);\n  }\n\n  @media (forced-colors: active) {\n    .ddga-notification {\n      border: 1px solid CanvasText;\n    }\n    .ddga-notification__close:focus-visible {\n      outline: 2px solid Highlight;\n      box-shadow: none;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/number-input.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-number-input__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-number-input__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-number-input{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);align-items:stretch;transition:border-color .15s,box-shadow .15s;display:flex;overflow:hidden}.ddga-number-input--sm{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-number-input--md{block-size:36px;font-size:var(--ddga-font-size-base)}.ddga-number-input--lg{block-size:40px;font-size:var(--ddga-font-size-lg)}.ddga-number-input__field{block-size:100%;min-inline-size:0;color:inherit;font:inherit;text-align:center;direction:ltr;unicode-bidi:plaintext;background:0 0;border:0;outline:none;flex:auto;padding:0}.ddga-number-input__field::placeholder{color:var(--ddga-text-placeholder)}.ddga-number-input__step{background-color:var(--ddga-color-muted);inline-size:2.25rem;color:var(--ddga-text-primary);cursor:pointer;border:0;flex:none;justify-content:center;align-items:center;padding:0;font-size:1rem;transition:background-color .15s,opacity .15s;display:inline-flex}.ddga-number-input__step--decrement{border-inline-end:1px solid var(--ddga-color-input)}.ddga-number-input__step--increment{border-inline-start:1px solid var(--ddga-color-input)}.ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-color-secondary-hover)}.ddga-number-input__step:disabled{opacity:.45;cursor:not-allowed}.ddga-number-input:focus-within{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-number-input--error{border-color:var(--ddga-color-error)}.ddga-number-input--error:focus-within{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-number-input:has(.ddga-number-input__field:disabled){background-color:var(--ddga-color-muted);opacity:.5}@media (prefers-reduced-motion:reduce){.ddga-number-input,.ddga-number-input__step{transition:none}}@media (forced-colors:active){.ddga-number-input{border:1px solid canvastext}.ddga-number-input__step{color:buttontext;background-color:buttonface}.ddga-number-input:focus-within{outline-offset:1px;outline:2px solid highlight}}}
+@layer ddga-components{.ddga-field[data-slot=number-input-field]{gap:var(--ddga-space-2)}.ddga-number-input__label{align-items:center;gap:var(--ddga-space-1);color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-regular);font-size:var(--ddga-font-size-sm);line-height:1.4286;display:inline-flex}.ddga-number-input__required{color:var(--ddga-error-700)}.ddga-number-input{border:1px solid var(--ddga-gray-400);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-gray-700);align-items:stretch;transition:border-color .15s,box-shadow .15s,background-color .15s;display:flex;position:relative}.ddga-number-input--md{block-size:32px;font-size:var(--ddga-font-size-sm)}.ddga-number-input--lg{block-size:40px;font-size:var(--ddga-font-size-base)}.ddga-number-input--filled-lighter{background-color:var(--ddga-gray-25);border-color:#0000}.ddga-number-input--filled-darker{background-color:var(--ddga-gray-100);border-color:#0000}.ddga-number-input__field{block-size:100%;min-inline-size:0;padding-inline:var(--ddga-space-2);color:inherit;font:inherit;text-align:start;caret-color:var(--ddga-gray-950);direction:ltr;unicode-bidi:plaintext;background:0 0;border:0;outline:none;flex:auto;padding-block:0}.ddga-number-input__field::placeholder{color:var(--ddga-gray-500)}.ddga-number-input__field:-webkit-autofill{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__field:-webkit-autofill:hover{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__field:-webkit-autofill:focus{-webkit-text-fill-color:var(--ddga-gray-700);-webkit-box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;box-shadow:0 0 0 100vmax var(--ddga-color-background) inset;caret-color:var(--ddga-gray-950)}.ddga-number-input__step{padding-inline:var(--ddga-space-4);background-color:var(--ddga-gray-100);color:var(--ddga-text-primary);cursor:pointer;border:0;flex:none;justify-content:center;align-self:stretch;align-items:center;padding-block:0;transition:background-color .15s;display:inline-flex}.ddga-number-input--md .ddga-number-input__step{padding-inline:var(--ddga-space-3)}.ddga-number-input__step svg{block-size:24px;inline-size:24px}.ddga-number-input--md .ddga-number-input__step svg{block-size:20px;inline-size:20px}.ddga-number-input__step--increment{border-start-start-radius:var(--ddga-radius-sm);border-end-start-radius:var(--ddga-radius-sm)}.ddga-number-input__step--decrement{border-start-end-radius:var(--ddga-radius-sm);border-end-end-radius:var(--ddga-radius-sm)}.ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-gray-200)}.ddga-number-input__step:active:not(:disabled){background-color:var(--ddga-gray-300)}.ddga-number-input__step:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-number-input__step:disabled{background-color:var(--ddga-gray-200);color:var(--ddga-gray-400);cursor:not-allowed}.ddga-number-input--steppers-subtle .ddga-number-input__step{background-color:#0000}.ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-gray-100)}.ddga-number-input--steppers-subtle .ddga-number-input__step:active:not(:disabled){background-color:var(--ddga-gray-200)}.ddga-number-input--steppers-subtle .ddga-number-input__step:disabled{background-color:#0000}.ddga-number-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-700)}.ddga-number-input:focus-within{box-shadow:var(--ddga-shadow-md)}.ddga-number-input--default:focus-within{border-color:var(--ddga-gray-400)}.ddga-number-input:focus-within:after{content:"";inset-inline:0;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}:is(.ddga-number-input:has(.ddga-number-input__field:active):not(:has(.ddga-number-input__field:disabled)),.ddga-number-input--pressed){background-color:var(--ddga-gray-100)}.ddga-number-input--pressed:after{content:"";inset-inline:25%;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}.ddga-number-input:has(.ddga-number-input__field:active):after{content:"";inset-inline:25%;background-color:var(--ddga-gray-950);block-size:2px;position:absolute;bottom:-1px}.ddga-number-input--error,.ddga-number-input--error:hover:not(:focus-within),.ddga-number-input--error:focus-within{border-color:var(--ddga-error-700)}.ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)){border-color:var(--ddga-gray-300);background-color:#0000}.ddga-number-input:has(.ddga-number-input__field:disabled){border-color:var(--ddga-gray-300);background-color:#0000}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:var(--ddga-gray-400);cursor:not-allowed}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field::placeholder{color:var(--ddga-gray-400)}:is(.ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__label,.ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__required){color:var(--ddga-gray-400)}.ddga-field[data-slot=number-input-field] .ddga-field__message{padding-block:var(--ddga-space-1)}.ddga-field[data-slot=number-input-field] .ddga-field__message--helper{color:var(--ddga-gray-700)}.ddga-field[data-slot=number-input-field] .ddga-field__message--error{color:var(--ddga-error-700)}[data-theme=dark] .ddga-number-input{border-color:var(--ddga-color-input);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__field{caret-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__field::placeholder{color:var(--ddga-text-placeholder)}[data-theme=dark] .ddga-number-input--filled-lighter,[data-theme=dark] .ddga-number-input--filled-darker{background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-number-input__step{background-color:var(--ddga-color-muted);color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-number-input--steppers-subtle .ddga-number-input__step{background-color:#0000}[data-theme=dark] .ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled){background-color:var(--ddga-color-muted)}[data-theme=dark] .ddga-number-input__step:disabled{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-number-input--default:hover:not(:focus-within){border-color:var(--ddga-gray-500)}[data-theme=dark] .ddga-number-input:focus-within:after,[data-theme=dark] .ddga-number-input--pressed:after{background-color:var(--ddga-text-primary)}[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:active):after{background-color:var(--ddga-text-primary)}:is([data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:active):not(:has(.ddga-number-input__field:disabled)),[data-theme=dark] .ddga-number-input--pressed){background-color:var(--ddga-color-muted)}:is([data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)),[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled)){border-color:var(--ddga-color-border)}[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field::placeholder{color:var(--ddga-text-tertiary)}:is([data-theme=dark] .ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__label,[data-theme=dark] .ddga-field[data-slot=number-input-field]:has(.ddga-number-input__field:disabled) .ddga-number-input__required){color:var(--ddga-text-tertiary)}[data-theme=dark] .ddga-field[data-slot=number-input-field] .ddga-field__message--helper{color:var(--ddga-text-secondary)}@media (prefers-reduced-motion:reduce){.ddga-number-input,.ddga-number-input__step{transition:none}}@media (forced-colors:active){.ddga-number-input{border:1px solid canvastext}.ddga-number-input__step{color:buttontext;background-color:buttonface}.ddga-number-input:focus-within{outline-offset:1px;outline:2px solid highlight}.ddga-number-input:has(.ddga-number-input__field:disabled){border-color:graytext}.ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field{color:graytext}}}
 /*# sourceMappingURL=number-input.css.map */

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

@@ -1 +1 @@
-{"version":3,"mappings":"AAAA,uBAQE,uJAOA,uFAOA,4RAgBA,0EAIA,4EAIA,0EAOA,uMAgBA,0EAMA,4RAkBA,wFAGA,0FAIA,iGAIA,iEAOA,gHAOA,+DAGA,yHAOA,+GAOA,uCACE,6DAQF,8BACE,+CAGA,sEAIA","sources":["src/components/number-input.css"],"sourcesContent":["@layer ddga-components {\n  /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n     , see field.css. Only NumberInput-specific styles live here. Structure\n     mirrors Input: a bordered control box owns border/focus/size/state; the\n     − button, the field, and the + button sit inside it. */\n\n  /* ─── Label ─── */\n\n  .ddga-number-input__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-number-input__required {\n    color: var(--ddga-color-error);\n    margin-inline-start: 0.125rem;\n  }\n\n  /* ─── Control (the bordered box) ─── */\n\n  .ddga-number-input {\n    display: flex;\n    align-items: stretch;\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    overflow: hidden;\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease;\n  }\n\n  /* ─── Sizes (heights match Input) ─── */\n\n  .ddga-number-input--sm {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-number-input--md {\n    block-size: 36px;\n    font-size: var(--ddga-font-size-base);\n  }\n  .ddga-number-input--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-lg);\n  }\n\n  /* ─── Field (the actual <input>) ─── */\n\n  .ddga-number-input__field {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    block-size: 100%;\n    padding: 0;\n    border: 0;\n    background: transparent;\n    color: inherit;\n    font: inherit;\n    text-align: center;\n    outline: none;\n    /* Keep digits Latin + LTR even inside an RTL form (DGA convention). */\n    direction: ltr;\n    unicode-bidi: plaintext;\n  }\n\n  .ddga-number-input__field::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n\n  /* ─── Stepper buttons (− / +) ─── */\n\n  .ddga-number-input__step {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: none;\n    inline-size: 2.25rem;\n    padding: 0;\n    border: 0;\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-text-primary);\n    font-size: 1rem;\n    cursor: pointer;\n    transition:\n      background-color 150ms ease,\n      opacity 150ms ease;\n  }\n\n  /* Logical dividers between the buttons and the field (RTL-safe). */\n  .ddga-number-input__step--decrement {\n    border-inline-end: 1px solid var(--ddga-color-input);\n  }\n  .ddga-number-input__step--increment {\n    border-inline-start: 1px solid var(--ddga-color-input);\n  }\n\n  .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-color-secondary-hover);\n  }\n\n  .ddga-number-input__step:disabled {\n    opacity: 0.45;\n    cursor: not-allowed;\n  }\n\n  /* ─── Focus (ring on the control via :focus-within) ─── */\n\n  .ddga-number-input:focus-within {\n    border-color: var(--ddga-color-ring);\n    box-shadow: 0 0 0 1px var(--ddga-color-ring);\n  }\n\n  /* ─── Error ─── */\n\n  .ddga-number-input--error {\n    border-color: var(--ddga-color-error);\n  }\n  .ddga-number-input--error:focus-within {\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-number-input:has(.ddga-number-input__field:disabled) {\n    background-color: var(--ddga-color-muted);\n    opacity: 0.5;\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-number-input,\n    .ddga-number-input__step {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .ddga-number-input {\n      border: 1px solid CanvasText;\n    }\n    .ddga-number-input__step {\n      background-color: ButtonFace;\n      color: ButtonText;\n    }\n    .ddga-number-input:focus-within {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n  }\n}\n"],"names":[]}
+{"version":3,"mappings":"AAAA,uBAKE,kEAMA,0NAUA,yDAMA,6SAiBA,0EAIA,4EAOA,2FAIA,2FAOA,gRAkBA,kEAIA,yPAAA,+PAAA,+PAYA,qSAcA,mFAKA,8DAIA,qFAMA,kIAIA,8HAOA,oFAGA,qFAGA,wGAIA,sHAOA,oFAGA,wHAGA,yHAGA,6FAMA,uFAOA,iEAGA,2EAGA,mJAaA,8KAMA,iJAAA,8KAYA,uJAQA,oIAQA,oHAIA,mIAIA,6HAIA,2PAUA,iGAGA,kGAGA,kGASA,yGAIA,iFAGA,4FAGA,kJAIA,mHAIA,0GAGA,sGAGA,6IAKA,oFAGA,yGAGA,sJAAA,2HAKA,qNAOA,qNAIA,uIAAA,oJAQA,oSAQA,0HAMA,uCACE,6DASF,8BACE,+CAGA,sEAIA,+EAIA,iFAGA","sources":["src/components/number-input.css"],"sourcesContent":["@layer ddga-components {\n  /* Field wrapper + helper/error line are shared (field.css). The field model\n     mirrors TextInput (SDGA \"Number Input\" = the Text input field + flanking ±\n     steppers, the SDGA \"Input Prefix-Suffix\" sub-component). */\n\n  .ddga-field[data-slot='number-input-field'] {\n    gap: var(--ddga-space-2);\n  }\n\n  /* ─── Label (SDGA: Text sm Regular, ink #161616, leading required *) ─── */\n\n  .ddga-number-input__label {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--ddga-space-1);\n    color: var(--ddga-text-primary);\n    font-weight: var(--ddga-font-weight-regular);\n    font-size: var(--ddga-font-size-sm);\n    line-height: 1.4286;\n  }\n\n  .ddga-number-input__required {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Control (the bordered box; owns border/focus/size/state/style) ─── */\n\n  .ddga-number-input {\n    position: relative;\n    display: flex;\n    align-items: stretch;\n    inline-size: 100%;\n    border: 1px solid var(--ddga-gray-400);\n    border-radius: var(--ddga-radius-sm);\n    background-color: var(--ddga-color-background);\n    color: var(--ddga-gray-700);\n    transition:\n      border-color 150ms ease,\n      box-shadow 150ms ease,\n      background-color 150ms ease;\n  }\n\n  /* ─── Sizes (SDGA Medium 32 / Large 40; type scales with size) ─── */\n\n  .ddga-number-input--md {\n    block-size: 32px;\n    font-size: var(--ddga-font-size-sm);\n  }\n  .ddga-number-input--lg {\n    block-size: 40px;\n    font-size: var(--ddga-font-size-base);\n  }\n\n  /* ─── Fill styles (SDGA Style axis) ─── */\n\n  .ddga-number-input--filled-lighter {\n    border-color: transparent;\n    background-color: var(--ddga-gray-25);\n  }\n  .ddga-number-input--filled-darker {\n    border-color: transparent;\n    background-color: var(--ddga-gray-100);\n  }\n\n  /* ─── Field (the actual <input>: transparent, start-aligned, Latin+LTR) ─── */\n\n  .ddga-number-input__field {\n    flex: 1 1 auto;\n    min-inline-size: 0;\n    block-size: 100%;\n    padding-inline: var(--ddga-space-2);\n    padding-block: 0;\n    border: 0;\n    background: transparent;\n    color: inherit;\n    font: inherit;\n    text-align: start;\n    caret-color: var(--ddga-gray-950);\n    outline: none;\n    /* Keep digits Latin + LTR even inside an RTL form (DGA convention). */\n    direction: ltr;\n    unicode-bidi: plaintext;\n  }\n\n  .ddga-number-input__field::placeholder {\n    color: var(--ddga-gray-500);\n  }\n\n  .ddga-number-input__field:-webkit-autofill,\n  .ddga-number-input__field:-webkit-autofill:hover,\n  .ddga-number-input__field:-webkit-autofill:focus {\n    -webkit-text-fill-color: var(--ddga-gray-700);\n    -webkit-box-shadow: 0 0 0 100vmax var(--ddga-color-background) inset;\n    box-shadow: 0 0 0 100vmax var(--ddga-color-background) inset;\n    caret-color: var(--ddga-gray-950);\n  }\n\n  /* ─── Stepper buttons (SDGA \"Input Prefix-Suffix\": Solid neutral chip, flush,\n         full height; icon #161616; ＋ leads / − trails) ─── */\n\n  .ddga-number-input__step {\n    align-self: stretch;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: none;\n    padding-inline: var(--ddga-space-4);\n    padding-block: 0;\n    border: 0;\n    background-color: var(--ddga-gray-100);\n    color: var(--ddga-text-primary);\n    cursor: pointer;\n    transition: background-color 150ms ease;\n  }\n  .ddga-number-input--md .ddga-number-input__step {\n    padding-inline: var(--ddga-space-3);\n  }\n\n  /* Icon: Large 24 / Medium 20. */\n  .ddga-number-input__step svg {\n    inline-size: 24px;\n    block-size: 24px;\n  }\n  .ddga-number-input--md .ddga-number-input__step svg {\n    inline-size: 20px;\n    block-size: 20px;\n  }\n\n  /* Hug the field's rounded outer corners (＋ = inline-start, − = inline-end). */\n  .ddga-number-input__step--increment {\n    border-start-start-radius: var(--ddga-radius-sm);\n    border-end-start-radius: var(--ddga-radius-sm);\n  }\n  .ddga-number-input__step--decrement {\n    border-start-end-radius: var(--ddga-radius-sm);\n    border-end-end-radius: var(--ddga-radius-sm);\n  }\n\n  /* Solid state ramp (SDGA neutral-button: rest gray-100 → hover 200 → pressed\n     300, matching TextInputDropdown; SDGA's flattened hover token is a Figma quirk). */\n  .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-number-input__step:active:not(:disabled) {\n    background-color: var(--ddga-gray-300);\n  }\n  .ddga-number-input__step:focus-visible {\n    outline: none;\n    box-shadow: inset 0 0 0 2px var(--ddga-text-primary);\n  }\n  .ddga-number-input__step:disabled {\n    background-color: var(--ddga-gray-200);\n    color: var(--ddga-gray-400);\n    cursor: not-allowed;\n  }\n\n  /* Subtle stepper style (SDGA Style=Subtle: transparent → gray-100 → gray-200). */\n  .ddga-number-input--steppers-subtle .ddga-number-input__step {\n    background-color: transparent;\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:active:not(:disabled) {\n    background-color: var(--ddga-gray-200);\n  }\n  .ddga-number-input--steppers-subtle .ddga-number-input__step:disabled {\n    background-color: transparent;\n  }\n\n  /* ─── Hover (SDGA: outlined style darkens its border to gray-700) ─── */\n\n  .ddga-number-input--default:hover:not(:focus-within) {\n    border-color: var(--ddga-gray-700);\n  }\n\n  /* ─── Focus (SDGA: shadow-md + full-width 2px dark bottom underline, NOT a\n         ring; outlined border stays gray-400, filled stays borderless) ─── */\n\n  .ddga-number-input:focus-within {\n    box-shadow: var(--ddga-shadow-md);\n  }\n  .ddga-number-input--default:focus-within {\n    border-color: var(--ddga-gray-400);\n  }\n  .ddga-number-input:focus-within::after {\n    content: '';\n    position: absolute;\n    inset-inline: 0;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n  }\n\n  /* ─── Pressed (SDGA: gray-100 fill + a short, CENTERED ~50% 2px underline).\n         Scoped to the field itself so pressing a stepper shows the stepper's\n         own pressed state, not the field's. `--pressed` is a static demo hook. */\n\n  .ddga-number-input:has(.ddga-number-input__field:active):not(\n      :has(.ddga-number-input__field:disabled)\n    ),\n  .ddga-number-input--pressed {\n    background-color: var(--ddga-gray-100);\n  }\n  .ddga-number-input:has(.ddga-number-input__field:active)::after,\n  .ddga-number-input--pressed::after {\n    content: '';\n    position: absolute;\n    inset-inline: 25%;\n    bottom: -1px;\n    block-size: 2px;\n    background-color: var(--ddga-gray-950);\n  }\n\n  /* ─── Error (SDGA: error-700 border; bg/text unchanged) ─── */\n\n  .ddga-number-input--error,\n  .ddga-number-input--error:hover:not(:focus-within),\n  .ddga-number-input--error:focus-within {\n    border-color: var(--ddga-error-700);\n  }\n\n  /* ─── Read-only (SDGA: gray-300 border, transparent fill) ─── */\n\n  .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)) {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n\n  /* ─── Disabled (SDGA: gray-300 border, transparent fill, gray-400 text,\n         no opacity dimming) ─── */\n\n  .ddga-number-input:has(.ddga-number-input__field:disabled) {\n    border-color: var(--ddga-gray-300);\n    background-color: transparent;\n  }\n  .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field {\n    color: var(--ddga-gray-400);\n    cursor: not-allowed;\n  }\n  .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field::placeholder {\n    color: var(--ddga-gray-400);\n  }\n  .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__label,\n  .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__required {\n    color: var(--ddga-gray-400);\n  }\n\n  /* ─── Helper / error line (SDGA: 16px feedback icon + text gray-700,\n         error error-700, 4px block padding) ─── */\n\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message {\n    padding-block: var(--ddga-space-1);\n  }\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message--helper {\n    color: var(--ddga-gray-700);\n  }\n  .ddga-field[data-slot='number-input-field'] .ddga-field__message--error {\n    color: var(--ddga-error-700);\n  }\n\n  /* ─── Dark mode ─── */\n  /* SDGA light values are fixed gray-ramp steps that don't flip; remap to the\n     flipping semantic tokens so text/affordances stay readable. Exact DGA dark\n     palette is deferred (matches TextInput). */\n\n  [data-theme='dark'] .ddga-number-input {\n    border-color: var(--ddga-color-input);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__field {\n    caret-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__field::placeholder {\n    color: var(--ddga-text-placeholder);\n  }\n  [data-theme='dark'] .ddga-number-input--filled-lighter,\n  [data-theme='dark'] .ddga-number-input--filled-darker {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input__step {\n    background-color: var(--ddga-color-muted);\n    color: var(--ddga-text-primary);\n  }\n  [data-theme='dark'] .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-color-border);\n  }\n  [data-theme='dark'] .ddga-number-input--steppers-subtle .ddga-number-input__step {\n    background-color: transparent;\n  }\n  [data-theme='dark']\n    .ddga-number-input--steppers-subtle\n    .ddga-number-input__step:hover:not(:disabled) {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input__step:disabled {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark'] .ddga-number-input--default:hover:not(:focus-within) {\n    border-color: var(--ddga-gray-500);\n  }\n  [data-theme='dark'] .ddga-number-input:focus-within::after,\n  [data-theme='dark'] .ddga-number-input:has(.ddga-number-input__field:active)::after,\n  [data-theme='dark'] .ddga-number-input--pressed::after {\n    background-color: var(--ddga-text-primary);\n  }\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:active):not(\n      :has(.ddga-number-input__field:disabled)\n    ),\n  [data-theme='dark'] .ddga-number-input--pressed {\n    background-color: var(--ddga-color-muted);\n  }\n  [data-theme='dark'] .ddga-number-input:has(.ddga-number-input__field:read-only:not(:disabled)),\n  [data-theme='dark'] .ddga-number-input:has(.ddga-number-input__field:disabled) {\n    border-color: var(--ddga-color-border);\n  }\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field,\n  [data-theme='dark']\n    .ddga-number-input:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__field::placeholder {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark']\n    .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__label,\n  [data-theme='dark']\n    .ddga-field[data-slot='number-input-field']:has(.ddga-number-input__field:disabled)\n    .ddga-number-input__required {\n    color: var(--ddga-text-tertiary);\n  }\n  [data-theme='dark'] .ddga-field[data-slot='number-input-field'] .ddga-field__message--helper {\n    color: var(--ddga-text-secondary);\n  }\n\n  /* ─── Reduced motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .ddga-number-input,\n    .ddga-number-input__step {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced colors (Windows High Contrast): the focus underline is invisible,\n         restore a visible outline ─── */\n\n  @media (forced-colors: active) {\n    .ddga-number-input {\n      border: 1px solid CanvasText;\n    }\n    .ddga-number-input__step {\n      background-color: ButtonFace;\n      color: ButtonText;\n    }\n    .ddga-number-input:focus-within {\n      outline: 2px solid Highlight;\n      outline-offset: 1px;\n    }\n    .ddga-number-input:has(.ddga-number-input__field:disabled) {\n      border-color: GrayText;\n    }\n    .ddga-number-input:has(.ddga-number-input__field:disabled) .ddga-number-input__field {\n      color: GrayText;\n    }\n  }\n}\n"],"names":[]}

package/dist/components/pagination.css

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-pagination{color:var(--ddga-text-primary);font-family:inherit;line-height:1.4}.ddga-pagination__content{align-items:center;gap:var(--ddga-space-1);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.ddga-pagination__item{display:inline-flex}.ddga-pagination__link{block-size:2rem;min-inline-size:2rem;padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:var(--ddga-text-secondary);cursor:pointer;background-color:#0000;border:1px solid #0000;justify-content:center;align-items:center;font-family:inherit;text-decoration:none;transition:background-color .15s,color .15s,border-color .15s;display:inline-flex}.ddga-pagination__link:hover{background-color:var(--ddga-color-muted);color:var(--ddga-text-primary)}.ddga-pagination__link:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-pagination__link--active{background-color:var(--ddga-color-primary);color:var(--ddga-color-primary-foreground);border-color:var(--ddga-color-primary)}.ddga-pagination__link--active:hover{background-color:var(--ddga-color-primary-hover);color:var(--ddga-color-primary-foreground)}.ddga-pagination__nav{gap:var(--ddga-space-1);padding-inline:var(--ddga-space-3)}.ddga-pagination__nav-icon{block-size:1em;inline-size:1em}.ddga-pagination__nav-icon--previous{transform:scaleX(-1)}[dir=rtl] .ddga-pagination__nav-icon--previous{transform:scaleX(1)}[dir=rtl] .ddga-pagination__nav-icon--next{transform:scaleX(-1)}.ddga-pagination__ellipsis{block-size:2rem;min-inline-size:2rem;color:var(--ddga-text-tertiary);justify-content:center;align-items:center;display:inline-flex}.ddga-pagination__ellipsis>svg{block-size:1em;inline-size:1em}.ddga-pagination--sm .ddga-pagination__link,.ddga-pagination--sm .ddga-pagination__ellipsis{block-size:1.75rem;min-inline-size:1.75rem;font-size:var(--ddga-font-size-xs)}.ddga-pagination--md .ddga-pagination__link,.ddga-pagination--md .ddga-pagination__ellipsis{block-size:2rem;min-inline-size:2rem;font-size:var(--ddga-font-size-sm)}@media (prefers-reduced-motion:reduce){.ddga-pagination__link{transition:none}}@media (forced-colors:active){.ddga-pagination__link{color:linktext;border:1px solid canvastext}.ddga-pagination__link--active{color:highlighttext;background-color:highlight;border-color:highlight}.ddga-pagination__link:focus-visible{outline-offset:2px;outline:2px solid highlight}}}
+@layer ddga-components{.ddga-pagination{color:var(--ddga-text-primary);font-family:inherit;line-height:1.4}.ddga-pagination__content{align-items:center;gap:var(--ddga-space-2);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.ddga-pagination__item{display:inline-flex}.ddga-pagination__link{box-sizing:border-box;min-inline-size:var(--_ddga-pg-box);block-size:var(--_ddga-pg-box);padding-inline:var(--_ddga-pg-pad);border-radius:var(--ddga-radius-sm);color:var(--ddga-text-primary);cursor:pointer;background-color:#0000;border:none;justify-content:center;align-items:center;font-family:inherit;text-decoration:none;transition:background-color .15s,border-color .15s;display:inline-flex;position:relative}.ddga-pagination__link:hover{background-color:var(--ddga-color-muted)}.ddga-pagination__link:focus-visible{box-shadow:inset 0 0 0 2px var(--ddga-text-primary);outline:none}.ddga-pagination__link[aria-disabled=true]{color:var(--ddga-gray-400);pointer-events:none}.ddga-pagination__link--active:after{content:"";inline-size:var(--_ddga-pg-underline-w);border-radius:var(--ddga-radius-full);background-color:var(--ddga-color-primary);block-size:3px;position:absolute;inset-block-end:var(--_ddga-pg-underline-bottom);inset-inline-start:50%;transform:translate(-50%)}[dir=rtl] .ddga-pagination__link--active:after{transform:translate(50%)}.ddga-pagination__nav{padding-inline:0}.ddga-pagination__nav-icon{block-size:1.25em;inline-size:1.25em}[dir=rtl] .ddga-pagination__nav-icon{transform:scaleX(-1)}.ddga-pagination__ellipsis,.ddga-pagination__overflow{box-sizing:border-box;border:1px solid var(--ddga-text-primary);border-radius:var(--ddga-radius-sm)}.ddga-pagination__ellipsis{min-inline-size:var(--_ddga-pg-box);block-size:var(--_ddga-pg-box);color:var(--ddga-text-primary);justify-content:center;align-items:center;display:inline-flex}.ddga-pagination__overflow[data-state=open],.ddga-pagination__overflow:focus-visible{background-color:var(--ddga-color-muted);border-width:2px}.ddga-pagination__overflow:focus-visible{box-shadow:none}.ddga-pagination__ellipsis-icon{block-size:1em;inline-size:1em}.ddga-pagination__menu{box-sizing:border-box;padding:var(--ddga-space-1);background-color:var(--ddga-color-background);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-sm);box-shadow:var(--ddga-shadow-xl);z-index:50;outline:none;font-family:inherit}.ddga-pagination__menu-item{align-items:center;gap:var(--ddga-space-2);box-sizing:border-box;inline-size:3.75rem;padding:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:var(--ddga-text-primary);font-size:var(--ddga-font-size-sm);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;line-height:1.4;display:flex}.ddga-pagination__menu-item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-pagination__menu-label{flex:auto;min-inline-size:0}.ddga-pagination__menu-check{block-size:1.25rem;inline-size:1.25rem;color:var(--ddga-text-primary);flex-shrink:0}@media (forced-colors:active){.ddga-pagination__menu{border:1px solid canvastext}.ddga-pagination__menu-item[data-highlighted]{color:highlighttext;background-color:highlight}}.ddga-pagination--sm{--_ddga-pg-box:1.5rem;--_ddga-pg-pad:var(--ddga-space-1);--_ddga-pg-underline-w:1rem;--_ddga-pg-underline-bottom:1px}.ddga-pagination--md{--_ddga-pg-box:2rem;--_ddga-pg-pad:.375rem;--_ddga-pg-underline-w:1.5rem;--_ddga-pg-underline-bottom:2px}.ddga-pagination--lg{--_ddga-pg-box:2.5rem;--_ddga-pg-pad:var(--ddga-space-2);--_ddga-pg-underline-w:1.5rem;--_ddga-pg-underline-bottom:3px}.ddga-pagination--sm .ddga-pagination__link,.ddga-pagination--sm .ddga-pagination__ellipsis{font-size:var(--ddga-font-size-sm)}.ddga-pagination--md .ddga-pagination__link,.ddga-pagination--md .ddga-pagination__ellipsis,.ddga-pagination--lg .ddga-pagination__link,.ddga-pagination--lg .ddga-pagination__ellipsis{font-size:var(--ddga-font-size-base)}@media (prefers-reduced-motion:reduce){.ddga-pagination__link{transition:none}}@media (forced-colors:active){.ddga-pagination__link{color:linktext}.ddga-pagination__link:focus-visible{outline-offset:2px;outline:2px solid highlight}.ddga-pagination__link--active:after{background-color:highlight}.ddga-pagination__ellipsis,.ddga-pagination__overflow{border-color:canvastext}}}
 /*# sourceMappingURL=pagination.css.map */