@24vlh/vds 0.3.0 → 0.3.2

package/dist/components/content-blocks.css

@@ -644,6 +644,115 @@
     color: var(--semantic-danger-text);
 }
 
+/* ---------------------------------------------------------
+   11b. CHIP GROUPS (LABEL + ACTIONS)
+--------------------------------------------------------- */
+
+.chip-group {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--component-gap-xs);
+    padding: var(--component-gap-sm) var(--component-gap-md);
+    height: var(--content-block-tag-size-md);
+    font-size: var(--text-xs);
+    border-radius: 9999px;
+    border: var(--content-block-component-border-sm) solid var(--color-border-subtle);
+    background-color: var(--color-surface);
+    color: var(--color-text);
+}
+
+.chip-group--sm {
+    height: var(--content-block-tag-size-sm);
+}
+
+.chip-group--lg {
+    height: var(--content-block-tag-size-lg);
+}
+
+.chip-group--soft {
+    background-color: var(--color-surface-subtle);
+}
+
+.chip-group--outline {
+    background-color: transparent;
+    border-color: var(--color-border-strong);
+}
+
+.chip-group--interactive {
+    cursor: pointer;
+    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
+}
+
+.chip-group--interactive:hover {
+    background-color: var(--color-surface-hover);
+    border-color: var(--color-border-strong);
+}
+
+.chip-group--interactive:focus-visible {
+    outline: var(--focus-ring-width) solid var(--focus-ring-color);
+    outline-offset: var(--focus-ring-offset);
+}
+
+.chip-group--disabled {
+    opacity: 0.5;
+    opacity: var(--content-block-component-disabled--opacity, 0.5);
+    cursor: not-allowed;
+    pointer-events: none;
+}
+
+.chip-group.semantic-info {
+    background-color: var(--semantic-info-bg);
+    color: var(--semantic-info-text);
+}
+
+.chip-group.semantic-warning {
+    background-color: var(--semantic-warning-bg);
+    color: var(--semantic-warning-text);
+}
+
+.chip-group.semantic-success {
+    background-color: var(--semantic-success-bg);
+    color: var(--semantic-success-text);
+}
+
+.chip-group.semantic-danger {
+    background-color: var(--semantic-danger-bg);
+    color: var(--semantic-danger-text);
+}
+
+.chip-group__label,
+.chip-group__action {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--component-gap-xs);
+    padding: 0;
+    border: 0;
+    background: transparent;
+    color: inherit;
+    font: inherit;
+    line-height: 1;
+}
+
+.chip-group__label {
+    cursor: default;
+}
+
+.chip-group__action {
+    cursor: pointer;
+    padding: 0 var(--space-2);
+    border-left: var(--content-block-component-border-sm) solid var(--color-border-subtle);
+}
+
+.chip-group__action:hover {
+    background-color: var(--color-surface-hover);
+}
+
+.chip-group__label:focus-visible,
+.chip-group__action:focus-visible {
+    outline: var(--focus-ring-width) solid var(--focus-ring-color);
+    outline-offset: var(--focus-ring-offset);
+}
+
 /* ---------------------------------------------------------
    12. AVATAR + STATUS
 --------------------------------------------------------- */

package/dist/components/content-blocks.min.css

@@ -1 +1 @@
-.vds-content-block,[data-vds-content-block]{--content-block-tag-size-sm:var(--space-4);--content-block-tag-size-md:var(--space-5);--content-block-tag-size-lg:var(--space-6);--content-block-component-disabled--opacity:0.3;--content-block-component-pad-sm:var(--space-3);--content-block-component-pad-md:var(--space-6);--content-block-component-pad-lg:var(--space-8);--content-block-component-border-sm:var(--border-width);--content-block-card-min-width:16.25rem;--content-block-card-gap:var(--space-4);--content-block-card-pad:var(--space-8);--content-block-card-pad-mobile:var(--space-6);--content-block-fact-pad:var(--space-10);--content-block-process-gap:var(--space-10);--content-block-process-step-min-width:15rem;--content-block-media-gap:var(--space-6);--content-block-empty-pad-vertical:var(--space-14);--content-block-empty-pad-horizontal:var(--space-6);--content-block-empty-gap:var(--space-4);--content-block-highlight-border-width:var(--border-width-strong);--content-block-highlight-pad:var(--space-6);--content-block-rail-width:var(--border-width-strong);--content-block-hero-pad:var(--space-12);--content-block-hero-title-size:var(--text-xl);--content-block-hero-subtitle-size:var(--text-md);--content-block-split-gap:var(--space-10);--content-block-split-main:minmax(0,1.2fr);--content-block-split-aside:minmax(0,0.8fr);--content-block-grid-min:14rem;--content-block-grid-gap:var(--space-6);--content-block-list-gap:var(--space-3);--content-block-row-gap:var(--space-3);--content-block-row-pad:var(--space-3);--content-block-title-size-base:var(--text-lg);--content-block-subtitle-size-base:var(--text-sm);--content-block-meta-size:var(--text-xs);--content-block-eyebrow-size:var(--text-xxs);--content-block-kpi-gap:var(--space-4);--content-block-kpi-value-size:var(--text-lg);--content-block-kpi-label-size:var(--text-xs)}.interactive{cursor:pointer;transition:background-color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal),color var(--transition-normal)}.interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong)}.interactive:active{background-color:var(--color-surface-subtle)}.interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.is-disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.card{background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-1);display:flex;flex-direction:column;gap:var(--content-block-card-gap);padding:var(--content-block-card-pad);transition:background-color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal)}.card--soft{background-color:var(--color-surface-subtle)}.card--muted{background-color:var(--color-muted-bg)}.card--tone-accent{background-color:var(--color-accent-soft)}@media (max-width:640px){.card{padding:var(--content-block-card-pad-mobile)}}.card--flat{box-shadow:none}.card--raised{box-shadow:var(--shadow-2)}.card--interactive{cursor:pointer}.card--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:var(--shadow-2)}.card--interactive:active{background-color:var(--color-surface-subtle)}.card--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.card--selected{border-color:var(--color-accent);box-shadow:var(--shadow-2)}.card--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.card__body,.card__header{width:100%}.card__footer{display:flex;gap:var(--component-gap-md);justify-content:flex-end;margin-top:var(--component-gap-lg)}.card__body-stack,.card__header-stack,.card__section-stack{display:flex;flex-direction:column;gap:var(--component-gap-md)}.card__body-inline,.card__footer-inline,.card__section-inline{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--component-gap-md)}.card-grid{grid-gap:var(--component-gap-lg);display:grid;gap:var(--component-gap-lg);grid-template-columns:repeat(auto-fit,minmax(var(--content-block-card-min-width),1fr))}.card-grid--compact{gap:var(--component-gap-md)}.card-grid--tight{gap:var(--component-gap-xs)}.card-grid--wide{gap:var(--component-gap-xl)}.media{align-items:center;display:flex;gap:var(--content-block-media-gap)}.media--stack{align-items:flex-start;flex-direction:column}.media--horizontal{align-items:center;flex-direction:row}.media--interactive{cursor:pointer;transition:background-color var(--transition-normal)}.media--interactive:hover{background-color:var(--color-surface-hover)}@media (max-width:768px){.media{align-items:flex-start;flex-direction:column}}.media__icon,.media__img{align-items:center;display:flex;flex-shrink:0;height:var(--icon-container-lg);justify-content:center;width:var(--icon-container-lg)}.media__icon svg,.media__img img{border-radius:var(--radius-sm);height:100%;-o-object-fit:contain;object-fit:contain;width:100%}.media__icon .icon{display:block;height:100%;width:100%}.media__body{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.media__meta{color:var(--color-text-muted);font-size:var(--text-xs)}.list-group{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.list-group__item{border-bottom:var(--content-block-component-border-sm) solid var(--color-border-subtle);display:flex;gap:var(--component-gap-md);padding:var(--component-gap-md) 0}.list-group--borderless .list-group__item,.list-group__item:last-child{border-bottom:none}.list-group--tight .list-group__item{padding:var(--component-gap-xs) 0}.list-group__item--interactive{cursor:pointer;transition:background-color var(--transition-normal)}.list-group__item--interactive:hover{background-color:var(--color-surface-hover)}.list-group__item--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.list-group__item--selected{background-color:var(--accent-soft-surface,var(--color-accent-soft));border-left-color:var(--accent-soft-border,var(--color-accent));box-shadow:0 0 0 1px transparent;box-shadow:0 0 0 1px var(--accent-soft-shadow,transparent);color:var(--accent-soft-on,var(--color-on-accent))}.list-group__item--disabled{cursor:not-allowed;opacity:var(--content-block-component-disabled--opacity);pointer-events:none}.callout{background-color:var(--color-muted-bg);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);padding:var(--content-block-component-pad-md)}.callout--compact{padding:var(--content-block-component-pad-sm)}.callout--outline{background-color:var(--color-surface);border-color:var(--color-border-strong)}.callout--minimal{background-color:transparent;border-color:transparent}.callout__title{font-size:var(--text-sm);font-weight:600}.callout__body{margin-top:var(--component-gap-xs)}.callout__icon{margin-bottom:var(--component-gap-xs)}.callout--interactive{cursor:pointer;transition:background-color var(--transition-normal),border-color var(--transition-normal)}.callout--interactive:hover{background:color-mix(in srgb,currentColor 10%,transparent)}.callout--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.semantic-info{background-color:var(--semantic-info-bg);border-color:var(--semantic-info-border);color:var(--semantic-info-text)}.semantic-success{background-color:var(--semantic-success-bg);border-color:var(--semantic-success-border);color:var(--semantic-success-text)}.semantic-warning{background-color:var(--semantic-warning-bg);border-color:var(--semantic-warning-border);color:var(--semantic-warning-text)}.semantic-danger{background-color:var(--semantic-danger-bg);border-color:var(--semantic-danger-border);color:var(--semantic-danger-text)}.empty{background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);padding:var(--content-block-empty-pad-vertical) var(--content-block-empty-pad-horizontal);text-align:center}.empty--compact{padding:var(--content-block-component-pad-md)}.empty--inline{align-items:center;display:inline-flex;text-align:left}.empty__icon{stroke:var(--color-text-muted);align-items:center;display:flex;height:var(--space-16);justify-content:center;margin:0 auto var(--content-block-empty-gap);width:var(--space-16)}.empty--inline .empty__icon{margin:0 var(--component-gap-md) 0 0}.empty__icon .icon{display:block;height:100%;width:100%}.empty__actions{display:flex;gap:var(--component-gap-md);justify-content:center;margin-top:var(--component-gap-lg)}.stats{display:flex;flex-wrap:wrap;gap:var(--component-gap-xl)}@media (max-width:768px){.stats{gap:var(--component-gap-lg)}}.stats__item{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.stats--center .stats__item{align-items:center}.stats__value{color:var(--color-text);font-size:var(--text-lg);font-weight:600}.metric-title,.stats__label{color:var(--color-text-muted);font-size:var(--text-xs)}.metric-title{font-weight:600;letter-spacing:.04em;text-transform:uppercase}.badge,.chip,.tag{align-items:center;background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:9999px;color:var(--color-text);display:inline-flex;font-size:var(--text-xs);gap:var(--component-gap-xs);height:var(--content-block-tag-size-md);padding:var(--component-gap-sm) var(--component-gap-md)}.badge--sm,.chip--sm,.tag--sm{height:var(--content-block-tag-size-sm)}.badge--lg,.chip--lg,.tag--lg{height:var(--content-block-tag-size-lg)}.badge--soft,.chip--soft,.tag--soft{background-color:var(--color-surface-subtle)}.badge--outline,.chip--outline,.tag--outline{background-color:transparent;border-color:var(--color-border-strong)}.badge--interactive,.chip--interactive,.tag--interactive{cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}.badge--interactive:hover,.chip--interactive:hover,.tag--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong)}.badge--interactive:focus-visible,.chip--interactive:focus-visible,.tag--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.badge--disabled,.chip--disabled,.tag--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.badge.semantic-info,.chip.semantic-info,.tag.semantic-info{background-color:var(--semantic-info-bg);color:var(--semantic-info-text)}.badge.semantic-warning,.chip.semantic-warning,.tag.semantic-warning{background-color:var(--semantic-warning-bg);color:var(--semantic-warning-text)}.badge.semantic-success,.chip.semantic-success,.tag.semantic-success{background-color:var(--semantic-success-bg);color:var(--semantic-success-text)}.badge.semantic-danger,.chip.semantic-danger,.tag.semantic-danger{background-color:var(--semantic-danger-bg);color:var(--semantic-danger-text)}.avatar{align-items:center;background-color:var(--color-muted-bg);border-radius:50%;display:inline-flex;height:var(--avatar-size-md);justify-content:center;overflow:hidden;position:relative;width:var(--avatar-size-md)}.avatar--sm{height:var(--avatar-size-sm);width:var(--avatar-size-sm)}.avatar--lg{height:var(--avatar-size-lg);width:var(--avatar-size-lg)}.avatar--status:after{background-color:var(--color-success);border:var(--border-width) solid var(--color-surface);border-radius:50%;bottom:0;content:"";height:var(--avatar-status-size);position:absolute;right:0;width:var(--avatar-status-size)}.feature{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.feature--horizontal{align-items:center;flex-direction:row}.feature__icon{align-items:center;display:flex;flex-shrink:0;height:var(--icon-container-lg);justify-content:center;width:var(--icon-container-lg)}.feature__icon .icon{display:block;height:100%;width:100%}.feature--interactive{cursor:pointer;transition:background-color var(--transition-normal)}.feature--interactive:hover{background-color:var(--color-surface-hover)}.feature--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}@media (max-width:640px){.feature--horizontal{align-items:flex-start;flex-direction:column}}.process{grid-gap:var(--content-block-process-gap);display:grid;gap:var(--content-block-process-gap);grid-template-columns:repeat(auto-fit,minmax(var(--content-block-process-step-min-width),1fr))}@media (max-width:768px){.process{gap:var(--component-gap-lg)}}.process__step{background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);color:var(--color-text);display:flex;flex-direction:column;gap:var(--component-gap-md);padding:var(--content-block-component-pad-md)}.process__step--active{background-color:var(--accent-soft-surface);border-color:var(--accent-soft-border);color:var(--accent-soft-on)}.process__step--complete{background-color:var(--success-soft-surface);border-color:var(--success-soft-border);color:var(--success-soft-on)}.process__step--disabled{cursor:not-allowed;opacity:var(--content-block-component-disabled--opacity);pointer-events:none}.highlight{background-color:var(--color-surface-subtle);border-left:var(--content-block-highlight-border-width) solid var(--color-accent);border-radius:var(--radius-sm);padding:var(--content-block-highlight-pad)}.highlight--compact{padding:var(--content-block-component-pad-sm)}.highlight--info{background-color:var(--semantic-info-bg);border-color:var(--semantic-info-border)}.highlight--success{background-color:var(--semantic-success-bg);border-color:var(--semantic-success-border)}.highlight--warning{background-color:var(--semantic-warning-bg);border-color:var(--semantic-warning-border)}.highlight--danger{background-color:var(--semantic-danger-bg);border-color:var(--semantic-danger-border)}.fact{background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);padding:var(--content-block-fact-pad);text-align:center}.fact--horizontal{align-items:center;display:flex;gap:var(--component-gap-lg);justify-content:center;text-align:left}.fact--compact{padding:var(--content-block-component-pad-md)}.fact--interactive{cursor:pointer;transition:background-color var(--transition-normal),border-color var(--transition-normal)}.fact--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong)}.fact--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.fact--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.content-block{--content-block-pad:0;--content-block-title-size:var(--content-block-title-size-base);--content-block-subtitle-size:var(--content-block-subtitle-size-base);--content-block-variant-rail:var(--color-border-strong);--content-block-variant-tint:var(--color-surface-subtle);--content-block-variant-text:var(--color-text);--content-block-variant-muted:var(--color-text-muted);--content-block-variant-border:var(--color-border-subtle);color:var(--content-block-variant-text);display:flex;flex-direction:column;gap:var(--component-gap-md);width:100%}.content-block--surface{--content-block-pad:var(--content-block-component-pad-lg);background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-1);padding:var(--content-block-pad)}.content-block--inset{--content-block-pad:var(--content-block-component-pad-md);background-color:var(--color-surface-subtle);border-radius:var(--radius-md);padding:var(--content-block-pad)}.content-block--compact{gap:var(--component-gap-xs)}.content-block--surface.content-block--compact{--content-block-pad:var(--content-block-component-pad-md)}.content-block--inset.content-block--compact{--content-block-pad:var(--content-block-component-pad-sm)}.content-block--bordered{border:var(--content-block-component-border-sm) solid var(--color-border-strong)}.content-block[data-variant=info]{--content-block-variant-rail:var(--semantic-info-border,var(--color-info));--content-block-variant-tint:var(--semantic-info-bg,var(--color-info-soft));--content-block-variant-text:var(--semantic-info-text,var(--color-text));--content-block-variant-muted:var(--semantic-info-text,var(--color-text-muted));--content-block-variant-border:var(--semantic-info-border,var(--color-border-subtle))}.content-block[data-variant=success]{--content-block-variant-rail:var(--semantic-success-border,var(--color-success));--content-block-variant-tint:var(--semantic-success-bg,var(--color-success-soft));--content-block-variant-text:var(--semantic-success-text,var(--color-text));--content-block-variant-muted:var(--semantic-success-text,var(--color-text-muted));--content-block-variant-border:var(--semantic-success-border,var(--color-border-subtle))}.content-block[data-variant=warning]{--content-block-variant-rail:var(--semantic-warning-border,var(--color-warning));--content-block-variant-tint:var(--semantic-warning-bg,var(--color-warning-soft));--content-block-variant-text:var(--semantic-warning-text,var(--color-text));--content-block-variant-muted:var(--semantic-warning-text,var(--color-text-muted));--content-block-variant-border:var(--semantic-warning-border,var(--color-border-subtle))}.content-block[data-variant=danger]{--content-block-variant-rail:var(--semantic-danger-border,var(--color-danger));--content-block-variant-tint:var(--semantic-danger-bg,var(--color-danger-soft));--content-block-variant-text:var(--semantic-danger-text,var(--color-text));--content-block-variant-muted:var(--semantic-danger-text,var(--color-text-muted));--content-block-variant-border:var(--semantic-danger-border,var(--color-border-subtle))}.content-block[data-variant=accent]{--content-block-variant-rail:var(--accent-soft-border,var(--color-accent));--content-block-variant-tint:var(--accent-soft-surface,var(--color-accent-soft));--content-block-variant-text:var(--accent-soft-on,var(--color-on-accent));--content-block-variant-muted:var(--accent-soft-on,var(--color-on-accent));--content-block-variant-border:var(--accent-soft-border,var(--color-border-subtle))}.content-block[data-variant=neutral]{--content-block-variant-rail:var(--color-border-strong);--content-block-variant-tint:var(--color-surface-subtle);--content-block-variant-text:var(--color-text);--content-block-variant-muted:var(--color-text-muted);--content-block-variant-border:var(--color-border-subtle)}.content-block--tint{background-color:var(--content-block-variant-tint);border-color:var(--content-block-variant-rail)}.content-block--outline{border:var(--content-block-component-border-sm) solid var(--content-block-variant-rail)}.content-block--rail{border-left:var(--content-block-rail-width) solid var(--content-block-variant-rail)}.content-block--hero{--content-block-title-size:var(--content-block-hero-title-size);--content-block-subtitle-size:var(--content-block-hero-subtitle-size);--content-block-pad:var(--content-block-hero-pad);gap:var(--component-gap-lg)}.content-block--center{align-items:center;text-align:center}.content-block--center .content-block__actions,.content-block--center .content-block__footer,.content-block--center .content-block__meta{justify-content:center}.content-block--elevated{box-shadow:var(--shadow-2)}.content-block--flat{box-shadow:none}.content-block--split{grid-gap:var(--content-block-split-gap);align-items:start;display:grid;gap:var(--content-block-split-gap);grid-template-areas:"main aside";grid-template-columns:var(--content-block-split-main) var(--content-block-split-aside)}.content-block--split-reverse{grid-template-areas:"aside main"}.content-block__main{grid-area:main}.content-block__aside,.content-block__main{display:flex;flex-direction:column;gap:var(--component-gap-md)}.content-block__aside{grid-area:aside}@media (max-width:900px){.content-block--split,.content-block--split-reverse{grid-template-areas:"main" "aside";grid-template-columns:minmax(0,1fr)}}.content-block__header{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.content-block__header--inline{align-items:center;flex-direction:row;gap:var(--component-gap-md);justify-content:space-between}.content-block__eyebrow{color:var(--content-block-variant-muted);font-size:var(--content-block-eyebrow-size);letter-spacing:.08em;text-transform:uppercase}.content-block__title{font-size:var(--content-block-title-size);font-weight:600}.content-block__subtitle{color:var(--content-block-variant-muted);font-size:var(--content-block-subtitle-size)}.content-block__meta{color:var(--content-block-variant-muted);font-size:var(--content-block-meta-size)}.content-block__actions,.content-block__meta{display:flex;flex-wrap:wrap;gap:var(--component-gap-sm)}.content-block__actions{align-items:center}.content-block__body{display:flex;flex-direction:column;gap:var(--component-gap-md)}.content-block__media{align-items:center;display:flex;justify-content:center;width:100%}.content-block__media img,.content-block__media picture,.content-block__media svg{border-radius:var(--radius-sm);height:auto;max-width:100%}.content-block__media--bleed{border-radius:var(--radius-md);margin:calc(var(--content-block-pad)*-1);overflow:hidden}.content-block__media--bleed img,.content-block__media--bleed picture,.content-block__media--bleed svg{border-radius:0}.content-block__footer{display:flex;gap:var(--component-gap-md);justify-content:flex-end;margin-top:var(--component-gap-lg)}.content-block__grid{grid-gap:var(--content-block-grid-gap);display:grid;gap:var(--content-block-grid-gap);grid-template-columns:repeat(auto-fit,minmax(var(--content-block-grid-min),1fr))}.content-block__grid--tight{gap:var(--component-gap-sm)}.content-block__grid--loose{gap:var(--component-gap-xl)}.content-block__list{display:flex;flex-direction:column;gap:var(--content-block-list-gap)}.content-block__list-item{align-items:center;border-bottom:var(--content-block-component-border-sm) solid var(--content-block-variant-border);display:flex;gap:var(--component-gap-md);justify-content:space-between;padding:var(--content-block-row-pad) 0}.content-block__list-item:last-child{border-bottom:none;padding-bottom:0}.content-block__rows{display:flex;flex-direction:column;gap:var(--content-block-row-gap)}.content-block__row{align-items:center;border-bottom:var(--content-block-component-border-sm) solid var(--content-block-variant-border);display:flex;gap:var(--component-gap-md);justify-content:space-between;padding:var(--content-block-row-pad) 0}.content-block__row:last-child{border-bottom:none;padding-bottom:0}.content-block__kv{grid-gap:var(--component-gap-sm) var(--component-gap-lg);display:grid;gap:var(--component-gap-sm) var(--component-gap-lg);grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.content-block__kv-label{color:var(--content-block-variant-muted);font-size:var(--text-xs);letter-spacing:.04em;text-transform:uppercase}.content-block__kv-value{color:var(--content-block-variant-text);font-size:var(--text-sm)}.content-block__kpis{grid-gap:var(--content-block-kpi-gap);display:grid;gap:var(--content-block-kpi-gap);grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}.content-block__kpi{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.content-block__kpi-value{font-size:var(--content-block-kpi-value-size);font-weight:600}.content-block__kpi-label{color:var(--content-block-variant-muted);font-size:var(--content-block-kpi-label-size)}@media (max-width:720px){.content-block__kv{grid-template-columns:minmax(0,1fr)}}.content-block--interactive{cursor:pointer;transition:background-color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal)}.content-block--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:var(--shadow-2)}.content-block--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.content-block--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}
+.vds-content-block,[data-vds-content-block]{--content-block-tag-size-sm:var(--space-4);--content-block-tag-size-md:var(--space-5);--content-block-tag-size-lg:var(--space-6);--content-block-component-disabled--opacity:0.3;--content-block-component-pad-sm:var(--space-3);--content-block-component-pad-md:var(--space-6);--content-block-component-pad-lg:var(--space-8);--content-block-component-border-sm:var(--border-width);--content-block-card-min-width:16.25rem;--content-block-card-gap:var(--space-4);--content-block-card-pad:var(--space-8);--content-block-card-pad-mobile:var(--space-6);--content-block-fact-pad:var(--space-10);--content-block-process-gap:var(--space-10);--content-block-process-step-min-width:15rem;--content-block-media-gap:var(--space-6);--content-block-empty-pad-vertical:var(--space-14);--content-block-empty-pad-horizontal:var(--space-6);--content-block-empty-gap:var(--space-4);--content-block-highlight-border-width:var(--border-width-strong);--content-block-highlight-pad:var(--space-6);--content-block-rail-width:var(--border-width-strong);--content-block-hero-pad:var(--space-12);--content-block-hero-title-size:var(--text-xl);--content-block-hero-subtitle-size:var(--text-md);--content-block-split-gap:var(--space-10);--content-block-split-main:minmax(0,1.2fr);--content-block-split-aside:minmax(0,0.8fr);--content-block-grid-min:14rem;--content-block-grid-gap:var(--space-6);--content-block-list-gap:var(--space-3);--content-block-row-gap:var(--space-3);--content-block-row-pad:var(--space-3);--content-block-title-size-base:var(--text-lg);--content-block-subtitle-size-base:var(--text-sm);--content-block-meta-size:var(--text-xs);--content-block-eyebrow-size:var(--text-xxs);--content-block-kpi-gap:var(--space-4);--content-block-kpi-value-size:var(--text-lg);--content-block-kpi-label-size:var(--text-xs)}.interactive{cursor:pointer;transition:background-color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal),color var(--transition-normal)}.interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong)}.interactive:active{background-color:var(--color-surface-subtle)}.interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.is-disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.card{background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-1);display:flex;flex-direction:column;gap:var(--content-block-card-gap);padding:var(--content-block-card-pad);transition:background-color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal)}.card--soft{background-color:var(--color-surface-subtle)}.card--muted{background-color:var(--color-muted-bg)}.card--tone-accent{background-color:var(--color-accent-soft)}@media (max-width:640px){.card{padding:var(--content-block-card-pad-mobile)}}.card--flat{box-shadow:none}.card--raised{box-shadow:var(--shadow-2)}.card--interactive{cursor:pointer}.card--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:var(--shadow-2)}.card--interactive:active{background-color:var(--color-surface-subtle)}.card--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.card--selected{border-color:var(--color-accent);box-shadow:var(--shadow-2)}.card--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.card__body,.card__header{width:100%}.card__footer{display:flex;gap:var(--component-gap-md);justify-content:flex-end;margin-top:var(--component-gap-lg)}.card__body-stack,.card__header-stack,.card__section-stack{display:flex;flex-direction:column;gap:var(--component-gap-md)}.card__body-inline,.card__footer-inline,.card__section-inline{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--component-gap-md)}.card-grid{grid-gap:var(--component-gap-lg);display:grid;gap:var(--component-gap-lg);grid-template-columns:repeat(auto-fit,minmax(var(--content-block-card-min-width),1fr))}.card-grid--compact{gap:var(--component-gap-md)}.card-grid--tight{gap:var(--component-gap-xs)}.card-grid--wide{gap:var(--component-gap-xl)}.media{align-items:center;display:flex;gap:var(--content-block-media-gap)}.media--stack{align-items:flex-start;flex-direction:column}.media--horizontal{align-items:center;flex-direction:row}.media--interactive{cursor:pointer;transition:background-color var(--transition-normal)}.media--interactive:hover{background-color:var(--color-surface-hover)}@media (max-width:768px){.media{align-items:flex-start;flex-direction:column}}.media__icon,.media__img{align-items:center;display:flex;flex-shrink:0;height:var(--icon-container-lg);justify-content:center;width:var(--icon-container-lg)}.media__icon svg,.media__img img{border-radius:var(--radius-sm);height:100%;-o-object-fit:contain;object-fit:contain;width:100%}.media__icon .icon{display:block;height:100%;width:100%}.media__body{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.media__meta{color:var(--color-text-muted);font-size:var(--text-xs)}.list-group{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.list-group__item{border-bottom:var(--content-block-component-border-sm) solid var(--color-border-subtle);display:flex;gap:var(--component-gap-md);padding:var(--component-gap-md) 0}.list-group--borderless .list-group__item,.list-group__item:last-child{border-bottom:none}.list-group--tight .list-group__item{padding:var(--component-gap-xs) 0}.list-group__item--interactive{cursor:pointer;transition:background-color var(--transition-normal)}.list-group__item--interactive:hover{background-color:var(--color-surface-hover)}.list-group__item--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.list-group__item--selected{background-color:var(--accent-soft-surface,var(--color-accent-soft));border-left-color:var(--accent-soft-border,var(--color-accent));box-shadow:0 0 0 1px transparent;box-shadow:0 0 0 1px var(--accent-soft-shadow,transparent);color:var(--accent-soft-on,var(--color-on-accent))}.list-group__item--disabled{cursor:not-allowed;opacity:var(--content-block-component-disabled--opacity);pointer-events:none}.callout{background-color:var(--color-muted-bg);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);padding:var(--content-block-component-pad-md)}.callout--compact{padding:var(--content-block-component-pad-sm)}.callout--outline{background-color:var(--color-surface);border-color:var(--color-border-strong)}.callout--minimal{background-color:transparent;border-color:transparent}.callout__title{font-size:var(--text-sm);font-weight:600}.callout__body{margin-top:var(--component-gap-xs)}.callout__icon{margin-bottom:var(--component-gap-xs)}.callout--interactive{cursor:pointer;transition:background-color var(--transition-normal),border-color var(--transition-normal)}.callout--interactive:hover{background:color-mix(in srgb,currentColor 10%,transparent)}.callout--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.semantic-info{background-color:var(--semantic-info-bg);border-color:var(--semantic-info-border);color:var(--semantic-info-text)}.semantic-success{background-color:var(--semantic-success-bg);border-color:var(--semantic-success-border);color:var(--semantic-success-text)}.semantic-warning{background-color:var(--semantic-warning-bg);border-color:var(--semantic-warning-border);color:var(--semantic-warning-text)}.semantic-danger{background-color:var(--semantic-danger-bg);border-color:var(--semantic-danger-border);color:var(--semantic-danger-text)}.empty{background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);padding:var(--content-block-empty-pad-vertical) var(--content-block-empty-pad-horizontal);text-align:center}.empty--compact{padding:var(--content-block-component-pad-md)}.empty--inline{align-items:center;display:inline-flex;text-align:left}.empty__icon{stroke:var(--color-text-muted);align-items:center;display:flex;height:var(--space-16);justify-content:center;margin:0 auto var(--content-block-empty-gap);width:var(--space-16)}.empty--inline .empty__icon{margin:0 var(--component-gap-md) 0 0}.empty__icon .icon{display:block;height:100%;width:100%}.empty__actions{display:flex;gap:var(--component-gap-md);justify-content:center;margin-top:var(--component-gap-lg)}.stats{display:flex;flex-wrap:wrap;gap:var(--component-gap-xl)}@media (max-width:768px){.stats{gap:var(--component-gap-lg)}}.stats__item{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.stats--center .stats__item{align-items:center}.stats__value{color:var(--color-text);font-size:var(--text-lg);font-weight:600}.metric-title,.stats__label{color:var(--color-text-muted);font-size:var(--text-xs)}.metric-title{font-weight:600;letter-spacing:.04em;text-transform:uppercase}.badge,.chip,.tag{align-items:center;background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:9999px;color:var(--color-text);display:inline-flex;font-size:var(--text-xs);gap:var(--component-gap-xs);height:var(--content-block-tag-size-md);padding:var(--component-gap-sm) var(--component-gap-md)}.badge--sm,.chip--sm,.tag--sm{height:var(--content-block-tag-size-sm)}.badge--lg,.chip--lg,.tag--lg{height:var(--content-block-tag-size-lg)}.badge--soft,.chip--soft,.tag--soft{background-color:var(--color-surface-subtle)}.badge--outline,.chip--outline,.tag--outline{background-color:transparent;border-color:var(--color-border-strong)}.badge--interactive,.chip--interactive,.tag--interactive{cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}.badge--interactive:hover,.chip--interactive:hover,.tag--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong)}.badge--interactive:focus-visible,.chip--interactive:focus-visible,.tag--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.badge--disabled,.chip--disabled,.tag--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.badge.semantic-info,.chip.semantic-info,.tag.semantic-info{background-color:var(--semantic-info-bg);color:var(--semantic-info-text)}.badge.semantic-warning,.chip.semantic-warning,.tag.semantic-warning{background-color:var(--semantic-warning-bg);color:var(--semantic-warning-text)}.badge.semantic-success,.chip.semantic-success,.tag.semantic-success{background-color:var(--semantic-success-bg);color:var(--semantic-success-text)}.badge.semantic-danger,.chip.semantic-danger,.tag.semantic-danger{background-color:var(--semantic-danger-bg);color:var(--semantic-danger-text)}.chip-group{align-items:center;background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:9999px;color:var(--color-text);display:inline-flex;font-size:var(--text-xs);gap:var(--component-gap-xs);height:var(--content-block-tag-size-md);padding:var(--component-gap-sm) var(--component-gap-md)}.chip-group--sm{height:var(--content-block-tag-size-sm)}.chip-group--lg{height:var(--content-block-tag-size-lg)}.chip-group--soft{background-color:var(--color-surface-subtle)}.chip-group--outline{background-color:transparent;border-color:var(--color-border-strong)}.chip-group--interactive{cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}.chip-group--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong)}.chip-group--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.chip-group--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.chip-group.semantic-info{background-color:var(--semantic-info-bg);color:var(--semantic-info-text)}.chip-group.semantic-warning{background-color:var(--semantic-warning-bg);color:var(--semantic-warning-text)}.chip-group.semantic-success{background-color:var(--semantic-success-bg);color:var(--semantic-success-text)}.chip-group.semantic-danger{background-color:var(--semantic-danger-bg);color:var(--semantic-danger-text)}.chip-group__action,.chip-group__label{align-items:center;background:transparent;border:0;color:inherit;display:inline-flex;font:inherit;gap:var(--component-gap-xs);line-height:1;padding:0}.chip-group__label{cursor:default}.chip-group__action{border-left:var(--content-block-component-border-sm) solid var(--color-border-subtle);cursor:pointer;padding:0 var(--space-2)}.chip-group__action:hover{background-color:var(--color-surface-hover)}.chip-group__action:focus-visible,.chip-group__label:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.avatar{align-items:center;background-color:var(--color-muted-bg);border-radius:50%;display:inline-flex;height:var(--avatar-size-md);justify-content:center;overflow:hidden;position:relative;width:var(--avatar-size-md)}.avatar--sm{height:var(--avatar-size-sm);width:var(--avatar-size-sm)}.avatar--lg{height:var(--avatar-size-lg);width:var(--avatar-size-lg)}.avatar--status:after{background-color:var(--color-success);border:var(--border-width) solid var(--color-surface);border-radius:50%;bottom:0;content:"";height:var(--avatar-status-size);position:absolute;right:0;width:var(--avatar-status-size)}.feature{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.feature--horizontal{align-items:center;flex-direction:row}.feature__icon{align-items:center;display:flex;flex-shrink:0;height:var(--icon-container-lg);justify-content:center;width:var(--icon-container-lg)}.feature__icon .icon{display:block;height:100%;width:100%}.feature--interactive{cursor:pointer;transition:background-color var(--transition-normal)}.feature--interactive:hover{background-color:var(--color-surface-hover)}.feature--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}@media (max-width:640px){.feature--horizontal{align-items:flex-start;flex-direction:column}}.process{grid-gap:var(--content-block-process-gap);display:grid;gap:var(--content-block-process-gap);grid-template-columns:repeat(auto-fit,minmax(var(--content-block-process-step-min-width),1fr))}@media (max-width:768px){.process{gap:var(--component-gap-lg)}}.process__step{background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);color:var(--color-text);display:flex;flex-direction:column;gap:var(--component-gap-md);padding:var(--content-block-component-pad-md)}.process__step--active{background-color:var(--accent-soft-surface);border-color:var(--accent-soft-border);color:var(--accent-soft-on)}.process__step--complete{background-color:var(--success-soft-surface);border-color:var(--success-soft-border);color:var(--success-soft-on)}.process__step--disabled{cursor:not-allowed;opacity:var(--content-block-component-disabled--opacity);pointer-events:none}.highlight{background-color:var(--color-surface-subtle);border-left:var(--content-block-highlight-border-width) solid var(--color-accent);border-radius:var(--radius-sm);padding:var(--content-block-highlight-pad)}.highlight--compact{padding:var(--content-block-component-pad-sm)}.highlight--info{background-color:var(--semantic-info-bg);border-color:var(--semantic-info-border)}.highlight--success{background-color:var(--semantic-success-bg);border-color:var(--semantic-success-border)}.highlight--warning{background-color:var(--semantic-warning-bg);border-color:var(--semantic-warning-border)}.highlight--danger{background-color:var(--semantic-danger-bg);border-color:var(--semantic-danger-border)}.fact{background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);padding:var(--content-block-fact-pad);text-align:center}.fact--horizontal{align-items:center;display:flex;gap:var(--component-gap-lg);justify-content:center;text-align:left}.fact--compact{padding:var(--content-block-component-pad-md)}.fact--interactive{cursor:pointer;transition:background-color var(--transition-normal),border-color var(--transition-normal)}.fact--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong)}.fact--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.fact--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}.content-block{--content-block-pad:0;--content-block-title-size:var(--content-block-title-size-base);--content-block-subtitle-size:var(--content-block-subtitle-size-base);--content-block-variant-rail:var(--color-border-strong);--content-block-variant-tint:var(--color-surface-subtle);--content-block-variant-text:var(--color-text);--content-block-variant-muted:var(--color-text-muted);--content-block-variant-border:var(--color-border-subtle);color:var(--content-block-variant-text);display:flex;flex-direction:column;gap:var(--component-gap-md);width:100%}.content-block--surface{--content-block-pad:var(--content-block-component-pad-lg);background-color:var(--color-surface);border:var(--content-block-component-border-sm) solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-1);padding:var(--content-block-pad)}.content-block--inset{--content-block-pad:var(--content-block-component-pad-md);background-color:var(--color-surface-subtle);border-radius:var(--radius-md);padding:var(--content-block-pad)}.content-block--compact{gap:var(--component-gap-xs)}.content-block--surface.content-block--compact{--content-block-pad:var(--content-block-component-pad-md)}.content-block--inset.content-block--compact{--content-block-pad:var(--content-block-component-pad-sm)}.content-block--bordered{border:var(--content-block-component-border-sm) solid var(--color-border-strong)}.content-block[data-variant=info]{--content-block-variant-rail:var(--semantic-info-border,var(--color-info));--content-block-variant-tint:var(--semantic-info-bg,var(--color-info-soft));--content-block-variant-text:var(--semantic-info-text,var(--color-text));--content-block-variant-muted:var(--semantic-info-text,var(--color-text-muted));--content-block-variant-border:var(--semantic-info-border,var(--color-border-subtle))}.content-block[data-variant=success]{--content-block-variant-rail:var(--semantic-success-border,var(--color-success));--content-block-variant-tint:var(--semantic-success-bg,var(--color-success-soft));--content-block-variant-text:var(--semantic-success-text,var(--color-text));--content-block-variant-muted:var(--semantic-success-text,var(--color-text-muted));--content-block-variant-border:var(--semantic-success-border,var(--color-border-subtle))}.content-block[data-variant=warning]{--content-block-variant-rail:var(--semantic-warning-border,var(--color-warning));--content-block-variant-tint:var(--semantic-warning-bg,var(--color-warning-soft));--content-block-variant-text:var(--semantic-warning-text,var(--color-text));--content-block-variant-muted:var(--semantic-warning-text,var(--color-text-muted));--content-block-variant-border:var(--semantic-warning-border,var(--color-border-subtle))}.content-block[data-variant=danger]{--content-block-variant-rail:var(--semantic-danger-border,var(--color-danger));--content-block-variant-tint:var(--semantic-danger-bg,var(--color-danger-soft));--content-block-variant-text:var(--semantic-danger-text,var(--color-text));--content-block-variant-muted:var(--semantic-danger-text,var(--color-text-muted));--content-block-variant-border:var(--semantic-danger-border,var(--color-border-subtle))}.content-block[data-variant=accent]{--content-block-variant-rail:var(--accent-soft-border,var(--color-accent));--content-block-variant-tint:var(--accent-soft-surface,var(--color-accent-soft));--content-block-variant-text:var(--accent-soft-on,var(--color-on-accent));--content-block-variant-muted:var(--accent-soft-on,var(--color-on-accent));--content-block-variant-border:var(--accent-soft-border,var(--color-border-subtle))}.content-block[data-variant=neutral]{--content-block-variant-rail:var(--color-border-strong);--content-block-variant-tint:var(--color-surface-subtle);--content-block-variant-text:var(--color-text);--content-block-variant-muted:var(--color-text-muted);--content-block-variant-border:var(--color-border-subtle)}.content-block--tint{background-color:var(--content-block-variant-tint);border-color:var(--content-block-variant-rail)}.content-block--outline{border:var(--content-block-component-border-sm) solid var(--content-block-variant-rail)}.content-block--rail{border-left:var(--content-block-rail-width) solid var(--content-block-variant-rail)}.content-block--hero{--content-block-title-size:var(--content-block-hero-title-size);--content-block-subtitle-size:var(--content-block-hero-subtitle-size);--content-block-pad:var(--content-block-hero-pad);gap:var(--component-gap-lg)}.content-block--center{align-items:center;text-align:center}.content-block--center .content-block__actions,.content-block--center .content-block__footer,.content-block--center .content-block__meta{justify-content:center}.content-block--elevated{box-shadow:var(--shadow-2)}.content-block--flat{box-shadow:none}.content-block--split{grid-gap:var(--content-block-split-gap);align-items:start;display:grid;gap:var(--content-block-split-gap);grid-template-areas:"main aside";grid-template-columns:var(--content-block-split-main) var(--content-block-split-aside)}.content-block--split-reverse{grid-template-areas:"aside main"}.content-block__main{grid-area:main}.content-block__aside,.content-block__main{display:flex;flex-direction:column;gap:var(--component-gap-md)}.content-block__aside{grid-area:aside}@media (max-width:900px){.content-block--split,.content-block--split-reverse{grid-template-areas:"main" "aside";grid-template-columns:minmax(0,1fr)}}.content-block__header{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.content-block__header--inline{align-items:center;flex-direction:row;gap:var(--component-gap-md);justify-content:space-between}.content-block__eyebrow{color:var(--content-block-variant-muted);font-size:var(--content-block-eyebrow-size);letter-spacing:.08em;text-transform:uppercase}.content-block__title{font-size:var(--content-block-title-size);font-weight:600}.content-block__subtitle{color:var(--content-block-variant-muted);font-size:var(--content-block-subtitle-size)}.content-block__meta{color:var(--content-block-variant-muted);font-size:var(--content-block-meta-size)}.content-block__actions,.content-block__meta{display:flex;flex-wrap:wrap;gap:var(--component-gap-sm)}.content-block__actions{align-items:center}.content-block__body{display:flex;flex-direction:column;gap:var(--component-gap-md)}.content-block__media{align-items:center;display:flex;justify-content:center;width:100%}.content-block__media img,.content-block__media picture,.content-block__media svg{border-radius:var(--radius-sm);height:auto;max-width:100%}.content-block__media--bleed{border-radius:var(--radius-md);margin:calc(var(--content-block-pad)*-1);overflow:hidden}.content-block__media--bleed img,.content-block__media--bleed picture,.content-block__media--bleed svg{border-radius:0}.content-block__footer{display:flex;gap:var(--component-gap-md);justify-content:flex-end;margin-top:var(--component-gap-lg)}.content-block__grid{grid-gap:var(--content-block-grid-gap);display:grid;gap:var(--content-block-grid-gap);grid-template-columns:repeat(auto-fit,minmax(var(--content-block-grid-min),1fr))}.content-block__grid--tight{gap:var(--component-gap-sm)}.content-block__grid--loose{gap:var(--component-gap-xl)}.content-block__list{display:flex;flex-direction:column;gap:var(--content-block-list-gap)}.content-block__list-item{align-items:center;border-bottom:var(--content-block-component-border-sm) solid var(--content-block-variant-border);display:flex;gap:var(--component-gap-md);justify-content:space-between;padding:var(--content-block-row-pad) 0}.content-block__list-item:last-child{border-bottom:none;padding-bottom:0}.content-block__rows{display:flex;flex-direction:column;gap:var(--content-block-row-gap)}.content-block__row{align-items:center;border-bottom:var(--content-block-component-border-sm) solid var(--content-block-variant-border);display:flex;gap:var(--component-gap-md);justify-content:space-between;padding:var(--content-block-row-pad) 0}.content-block__row:last-child{border-bottom:none;padding-bottom:0}.content-block__kv{grid-gap:var(--component-gap-sm) var(--component-gap-lg);display:grid;gap:var(--component-gap-sm) var(--component-gap-lg);grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.content-block__kv-label{color:var(--content-block-variant-muted);font-size:var(--text-xs);letter-spacing:.04em;text-transform:uppercase}.content-block__kv-value{color:var(--content-block-variant-text);font-size:var(--text-sm)}.content-block__kpis{grid-gap:var(--content-block-kpi-gap);display:grid;gap:var(--content-block-kpi-gap);grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}.content-block__kpi{display:flex;flex-direction:column;gap:var(--component-gap-xs)}.content-block__kpi-value{font-size:var(--content-block-kpi-value-size);font-weight:600}.content-block__kpi-label{color:var(--content-block-variant-muted);font-size:var(--content-block-kpi-label-size)}@media (max-width:720px){.content-block__kv{grid-template-columns:minmax(0,1fr)}}.content-block--interactive{cursor:pointer;transition:background-color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal)}.content-block--interactive:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong);box-shadow:var(--shadow-2)}.content-block--interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.content-block--disabled{cursor:not-allowed;opacity:.5;opacity:var(--content-block-component-disabled--opacity,.5);pointer-events:none}

package/dist/components/flows.css

@@ -369,8 +369,7 @@
             transparent 75%,
             transparent
     );
-    background-size: calc(var(--flow-progress-stripe-size) * 2)
-        calc(var(--flow-progress-stripe-size) * 2);
+    background-size: calc(var(--flow-progress-stripe-size) * 2) calc(var(--flow-progress-stripe-size) * 2);
     animation: flow-progress-stripes var(--flow-progress-stripe-speed) linear infinite;
 }
 

package/dist/components/forms.css

@@ -181,6 +181,19 @@ select.form-control:not([multiple]):not([size]) {
     color: var(--color-text-muted);
 }
 
+.form-help-row {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--space-2);
+}
+
+.form-help-row__counter {
+    margin-left: auto;
+    text-align: right;
+}
+
 .form-help--error {
     color: var(--color-danger);
 }
@@ -868,4 +881,3 @@ select.form-control:not([multiple]):not([size]) {
 .form-section--info:not(:last-child) {
     margin-bottom: var(--space-4);
 }
-

package/dist/components/forms.min.css

@@ -1 +1 @@
-.vds-form,[data-vds-form]{--form-flow-textarea-min-height:5rem;--size-10:3.00rem;--control-min-height:var(--size-10);--choice-size:var(--space-4);--choice-gap:var(--space-2)}@keyframes input-loading-shimmer{0%{background-position:-150% 0}to{background-position:150% 0}}.form-control{background-color:var(--color-surface);border:var(--border-width) solid var(--color-border-subtle);border-radius:var(--radius-md);box-sizing:border-box;color:var(--color-text);display:block;margin:0;min-height:var(--control-min-height);padding:var(--space-3);position:relative;transition:border-color .2s,background-color .2s,box-shadow .2s;width:100%;z-index:0}input.form-control,select.form-control,textarea.form-control{background-clip:padding-box;font:inherit;line-height:inherit}textarea.form-control{min-height:var(--form-flow-textarea-min-height);resize:vertical}select.form-control{-webkit-appearance:none;-moz-appearance:none;appearance:none}select.form-control:not([multiple]):not([size]){background-image:linear-gradient(45deg,transparent 50%,var(--color-text-muted) 50%),linear-gradient(135deg,var(--color-text-muted) 50%,transparent 50%);background-position:calc(100% - var(--space-3)) 50%,calc(100% - var(--space-2)) 50%;background-repeat:no-repeat;background-size:.4rem .4rem;padding-right:calc(var(--space-7) + var(--space-2))}.form-control::-moz-placeholder{color:var(--color-placeholder);opacity:1}.form-control::placeholder{color:var(--color-placeholder);opacity:1}.form-control:hover{border-color:var(--color-border-strong)}.form-control:focus{border-color:var(--color-accent);outline:none}.form-control:focus-visible{border-color:var(--focus-ring-color);box-shadow:0 0 0 var(--border-width-strong) var(--focus-ring-color);outline:none}.form-control[aria-invalid=true]{border-color:var(--color-danger)}.form-control[aria-invalid=true]:focus-visible{box-shadow:0 0 0 var(--border-width-strong) var(--color-danger-soft)}.form-field{display:flex;flex-direction:column;gap:var(--space-2)}.form-field--inline{grid-gap:var(--space-4);align-items:start;display:grid;gap:var(--space-4);grid-template-columns:minmax(10rem,14rem) 1fr}.form-field--inline .form-label-row{justify-content:flex-start}.form-field--inline .form-help{grid-column:2}.form-label-row{align-items:center;display:flex;gap:var(--space-2);justify-content:space-between}.form-label{color:var(--color-text);font-size:var(--text-sm);font-weight:var(--font-weight-semibold)}.form-label-meta{color:var(--color-text-muted);font-size:var(--text-xs)}.form-label-meta--required{color:var(--color-danger);font-weight:var(--font-weight-semibold)}.form-help{color:var(--color-text-muted);font-size:var(--text-xs)}.form-help--error{color:var(--color-danger)}.form-help--warning{color:var(--color-warning)}.form-help--success{color:var(--color-success)}.form-help--info{color:var(--color-info)}.choice-group{display:flex;flex-direction:column;gap:var(--space-2)}.choice-group--inline{align-items:center;flex-direction:row;flex-wrap:wrap;gap:var(--space-4)}.choice-group--grid{grid-gap:var(--space-3);display:grid;gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(14rem,1fr))}.choice{--choice-accent:var(--color-accent);--choice-on-accent:var(--color-on-accent);align-items:flex-start;color:var(--color-text);cursor:pointer;display:flex;font-size:var(--text-sm);gap:var(--choice-gap);position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.choice--success{--choice-accent:var(--color-success);--choice-on-accent:var(--color-on-success)}.choice--warning{--choice-accent:var(--color-warning);--choice-on-accent:var(--color-on-warning)}.choice--error{--choice-accent:var(--color-danger);--choice-on-accent:var(--color-on-danger)}.choice--info{--choice-accent:var(--color-info);--choice-on-accent:var(--color-on-accent)}.choice__input{margin:0;opacity:0;pointer-events:none;position:absolute}.choice__indicator,.choice__input{height:var(--choice-size);width:var(--choice-size)}.choice__indicator{align-items:center;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border-subtle);border-radius:var(--radius-sm);display:inline-flex;flex-shrink:0;justify-content:center;margin-top:var(--space-0_5);position:relative;transition:border-color .2s,background-color .2s,box-shadow .2s}.choice__indicator:after{border-bottom:2.5px solid var(--choice-on-accent);border-right:2.5px solid var(--choice-on-accent);content:"";height:.75rem;left:50%;opacity:0;position:absolute;top:30%;transform:translate(-50%,-40%) rotate(45deg);transition:opacity .2s;width:.45rem}.choice__input:focus-visible+.choice__indicator{border-color:var(--focus-ring-color);box-shadow:0 0 0 var(--border-width-strong) var(--focus-ring-color)}.choice__input:checked+.choice__indicator{background-color:var(--choice-accent);border-color:var(--choice-accent)}.choice__input:checked+.choice__indicator:after{opacity:1}.choice--checkbox .choice__indicator{border-radius:var(--radius-sm)}.choice--radio .choice__indicator{border-radius:var(--radius-full)}.choice--radio .choice__indicator:after{background-color:var(--choice-accent);border:none;border-radius:var(--radius-full);height:.5rem;left:50%;top:50%;transform:translate(-50%,-50%);width:.5rem}.choice--radio .choice__input:checked+.choice__indicator{background-color:var(--color-surface)}.choice:hover .choice__indicator{border-color:var(--color-border-strong)}.choice--disabled .choice__indicator,.choice__input:disabled+.choice__indicator{background-color:var(--color-muted-bg);border-color:var(--color-border-subtle);box-shadow:none;opacity:.7}.choice--disabled .choice__indicator:after,.choice__input:disabled+.choice__indicator:after{background-color:var(--color-text-muted);border-color:var(--color-text-muted)}.choice__label{display:flex;flex-direction:column;gap:var(--space-1)}.choice__label-text{color:var(--color-text);font-size:var(--text-sm)}.choice__hint{color:var(--color-text-muted);font-size:var(--text-xs)}.form-control-wrapper{align-items:center;display:flex;position:relative;width:100%}.form-control-wrapper>.form-control{flex:1 1 auto;width:auto}.form-control--loading{cursor:progress;opacity:.55;pointer-events:none}.form-control--disabled{opacity:.45;pointer-events:none}.form-control--readonly{cursor:default;opacity:.75}.form-control--error{box-shadow:0 0 0 var(--border-width-strong) var(--color-danger)}.form-control--warning{box-shadow:0 0 0 var(--border-width-strong) var(--color-warning)}.form-control--success{box-shadow:0 0 0 var(--border-width-strong) var(--color-success)}.form-control--info{box-shadow:0 0 0 var(--border-width-strong) var(--color-info)}.form-control:disabled,.form-control[disabled]{background-color:var(--color-muted-bg);color:var(--color-text-muted);cursor:not-allowed}.form-control[readonly]{background-color:var(--color-surface-subtle);border-style:dashed;color:var(--color-text-muted)}.form-control--error:focus-visible{box-shadow:0 0 0 var(--border-width-strong) var(--semantic-error-border-strong,var(--color-danger))}.form-control-wrapper[data-icon=left] .form-control{padding-left:calc(var(--space-7) + var(--space-2))}.form-control-wrapper[data-icon=right] .form-control{padding-right:calc(var(--space-7) + var(--space-2))}.form-control-wrapper[data-icon=left] .form-control-icon,.form-control-wrapper[data-icon=right] .form-control-icon{align-items:center;display:flex;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.form-control-wrapper[data-icon=left] .form-control-icon{left:var(--space-2)}.form-control-wrapper[data-icon=right] .form-control-icon{right:var(--space-2)}.form-control-icon{color:var(--color-text-muted);font-size:var(--text-md)}.form-control-icon,.form-control-prefix,.form-control-suffix{position:absolute;z-index:1}.form-control-prefix,.form-control-suffix{align-items:center;color:var(--color-text-muted);display:inline-flex;font-size:var(--text-sm);pointer-events:none;position:static;white-space:nowrap}.form-control-prefix{margin-left:var(--space-3);margin-right:var(--space-2)}.form-control-suffix{margin-left:var(--space-2);margin-right:var(--space-3)}.form-control-group{align-items:stretch;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border-subtle);border-radius:var(--radius-md);display:flex;position:relative;width:100%}.form-control-group>*{background:transparent;border-radius:0;position:relative}.form-control-group>.form-control,.form-control-group>.form-control-wrapper{flex:1 1 auto}.form-control-group>.button{flex:0 0 auto}.form-control-group>:first-child{border-bottom-left-radius:var(--radius-md);border-top-left-radius:var(--radius-md)}.form-control-group>:last-child{border-bottom-right-radius:var(--radius-md);border-top-right-radius:var(--radius-md)}.form-control-group>*+*{box-shadow:inset var(--border-width) 0 0 var(--color-border-subtle)}.form-control-group .form-control:focus-visible{border-color:var(--focus-ring-color);box-shadow:inset var(--border-width) 0 0 var(--color-border-subtle),0 0 0 var(--border-width-strong) var(--focus-ring-color)}.form-control-group>.button,.form-control-group>.form-control,.form-control-group>.form-control-wrapper>.form-control{background:transparent;border:none}.form-control-group>.button{align-items:center;box-sizing:border-box;color:var(--color-text);display:inline-flex;height:var(--control-min-height);justify-content:center;line-height:1;padding:0 var(--space-3)}.form-control--loading:after{animation:formControlLoading 1.5s ease-in-out infinite;background:var(--color-surface-subtle);border-radius:inherit;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}@keyframes formControlLoading{0%{opacity:.35}50%{opacity:.6}to{opacity:.35}}.form-control--file{background-color:var(--color-surface);border:var(--border-width) dashed var(--color-border-subtle);border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;padding:var(--space-3);position:relative}.form-control--file[type=file]{background:none;border:none;padding:0;position:static}.form-control-file-surface{align-items:center;background-color:var(--color-surface);border:var(--border-width) dashed var(--color-border-subtle);border-radius:var(--radius-md);cursor:pointer;display:flex;flex-direction:column;gap:var(--space-2);justify-content:center;padding:var(--space-6);position:relative}.form-control-file-surface input[type=file]{bottom:0;cursor:pointer;left:0;opacity:0;position:absolute;right:0;top:0}.form-control-file-surface:hover{background-color:var(--color-surface-subtle);border-color:var(--color-border-strong)}.form-control-file-surface:focus-within{border-color:var(--focus-ring-color);box-shadow:0 0 0 var(--border-width-strong) var(--focus-ring-color)}.form-control-file-surface--disabled{cursor:not-allowed;opacity:.65;pointer-events:none}.form-control-file-surface--error{background-color:var(--color-danger-soft);border-color:var(--color-danger)}.form-control-file-surface--warning{background-color:var(--color-warning-soft);border-color:var(--color-warning)}.form-control-file-surface--success{background-color:var(--color-success-soft);border-color:var(--color-success)}.form-control-file-surface--info{background-color:var(--color-info-soft);border-color:var(--color-info)}.file-upload-inline{align-items:center;display:inline-flex;gap:var(--space-2)}.file-upload-inline__input{clip:rect(0,0,0,0);height:1px;overflow:hidden;position:absolute;width:1px}.file-upload-inline__label{cursor:pointer}.form-control-file-surface.form-control--loading:after{animation:input-loading-shimmer 1.5s infinite;background-image:linear-gradient(90deg,var(--color-muted-bg),var(--color-surface),var(--color-muted-bg));background-size:200% 100%;border-radius:inherit;bottom:0;content:"";left:0;position:absolute;right:0;top:0}.form-row{display:flex;flex-wrap:wrap;gap:var(--space-4)}.form-grid{grid-gap:var(--space-4);display:grid;gap:var(--space-4)}.form-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}@media (max-width:768px){.form-grid--four,.form-grid--three,.form-grid--two{grid-template-columns:1fr}}.form-message{align-items:flex-start;background-color:var(--color-surface-subtle);border:var(--border-width) solid var(--color-border-subtle);border-radius:var(--radius-md);display:flex;font-size:var(--text-sm);gap:var(--space-3);padding:var(--space-4) var(--space-6);width:100%}.form-message__icon{flex-shrink:0;height:1.25rem;width:1.25rem}.form-message__content{display:flex;flex-direction:column;gap:var(--space-1)}.form-message--neutral{color:var(--color-text-muted)}.form-message--error{background-color:var(--color-danger-soft);border-color:var(--color-danger)}.form-message--warning{background-color:var(--color-warning-soft);border-color:var(--color-warning)}.form-message--success{background-color:var(--color-success-soft);border-color:var(--color-success)}.form-message--info{background-color:var(--color-info-soft);border-color:var(--color-info)}.form-section--error,.form-section--info,.form-section--success,.form-section--warning{border-left:var(--border-width-strong) solid;padding:var(--space-3)}.form-section--error{border-color:var(--color-danger)}.form-section--warning{border-color:var(--color-warning)}.form-section--success{border-color:var(--color-success)}.form-section--info{border-color:var(--color-info)}.form-section--error:not(:last-child),.form-section--info:not(:last-child),.form-section--success:not(:last-child),.form-section--warning:not(:last-child){margin-bottom:var(--space-4)}
+.vds-form,[data-vds-form]{--form-flow-textarea-min-height:5rem;--size-10:3.00rem;--control-min-height:var(--size-10);--choice-size:var(--space-4);--choice-gap:var(--space-2)}@keyframes input-loading-shimmer{0%{background-position:-150% 0}to{background-position:150% 0}}.form-control{background-color:var(--color-surface);border:var(--border-width) solid var(--color-border-subtle);border-radius:var(--radius-md);box-sizing:border-box;color:var(--color-text);display:block;margin:0;min-height:var(--control-min-height);padding:var(--space-3);position:relative;transition:border-color .2s,background-color .2s,box-shadow .2s;width:100%;z-index:0}input.form-control,select.form-control,textarea.form-control{background-clip:padding-box;font:inherit;line-height:inherit}textarea.form-control{min-height:var(--form-flow-textarea-min-height);resize:vertical}select.form-control{-webkit-appearance:none;-moz-appearance:none;appearance:none}select.form-control:not([multiple]):not([size]){background-image:linear-gradient(45deg,transparent 50%,var(--color-text-muted) 50%),linear-gradient(135deg,var(--color-text-muted) 50%,transparent 50%);background-position:calc(100% - var(--space-3)) 50%,calc(100% - var(--space-2)) 50%;background-repeat:no-repeat;background-size:.4rem .4rem;padding-right:calc(var(--space-7) + var(--space-2))}.form-control::-moz-placeholder{color:var(--color-placeholder);opacity:1}.form-control::placeholder{color:var(--color-placeholder);opacity:1}.form-control:hover{border-color:var(--color-border-strong)}.form-control:focus{border-color:var(--color-accent);outline:none}.form-control:focus-visible{border-color:var(--focus-ring-color);box-shadow:0 0 0 var(--border-width-strong) var(--focus-ring-color);outline:none}.form-control[aria-invalid=true]{border-color:var(--color-danger)}.form-control[aria-invalid=true]:focus-visible{box-shadow:0 0 0 var(--border-width-strong) var(--color-danger-soft)}.form-field{display:flex;flex-direction:column;gap:var(--space-2)}.form-field--inline{grid-gap:var(--space-4);align-items:start;display:grid;gap:var(--space-4);grid-template-columns:minmax(10rem,14rem) 1fr}.form-field--inline .form-label-row{justify-content:flex-start}.form-field--inline .form-help{grid-column:2}.form-label-row{align-items:center;display:flex;gap:var(--space-2);justify-content:space-between}.form-label{color:var(--color-text);font-size:var(--text-sm);font-weight:var(--font-weight-semibold)}.form-label-meta{color:var(--color-text-muted);font-size:var(--text-xs)}.form-label-meta--required{color:var(--color-danger);font-weight:var(--font-weight-semibold)}.form-help{color:var(--color-text-muted);font-size:var(--text-xs)}.form-help-row{align-items:center;display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:space-between}.form-help-row__counter{margin-left:auto;text-align:right}.form-help--error{color:var(--color-danger)}.form-help--warning{color:var(--color-warning)}.form-help--success{color:var(--color-success)}.form-help--info{color:var(--color-info)}.choice-group{display:flex;flex-direction:column;gap:var(--space-2)}.choice-group--inline{align-items:center;flex-direction:row;flex-wrap:wrap;gap:var(--space-4)}.choice-group--grid{grid-gap:var(--space-3);display:grid;gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(14rem,1fr))}.choice{--choice-accent:var(--color-accent);--choice-on-accent:var(--color-on-accent);align-items:flex-start;color:var(--color-text);cursor:pointer;display:flex;font-size:var(--text-sm);gap:var(--choice-gap);position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.choice--success{--choice-accent:var(--color-success);--choice-on-accent:var(--color-on-success)}.choice--warning{--choice-accent:var(--color-warning);--choice-on-accent:var(--color-on-warning)}.choice--error{--choice-accent:var(--color-danger);--choice-on-accent:var(--color-on-danger)}.choice--info{--choice-accent:var(--color-info);--choice-on-accent:var(--color-on-accent)}.choice__input{margin:0;opacity:0;pointer-events:none;position:absolute}.choice__indicator,.choice__input{height:var(--choice-size);width:var(--choice-size)}.choice__indicator{align-items:center;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border-subtle);border-radius:var(--radius-sm);display:inline-flex;flex-shrink:0;justify-content:center;margin-top:var(--space-0_5);position:relative;transition:border-color .2s,background-color .2s,box-shadow .2s}.choice__indicator:after{border-bottom:2.5px solid var(--choice-on-accent);border-right:2.5px solid var(--choice-on-accent);content:"";height:.75rem;left:50%;opacity:0;position:absolute;top:30%;transform:translate(-50%,-40%) rotate(45deg);transition:opacity .2s;width:.45rem}.choice__input:focus-visible+.choice__indicator{border-color:var(--focus-ring-color);box-shadow:0 0 0 var(--border-width-strong) var(--focus-ring-color)}.choice__input:checked+.choice__indicator{background-color:var(--choice-accent);border-color:var(--choice-accent)}.choice__input:checked+.choice__indicator:after{opacity:1}.choice--checkbox .choice__indicator{border-radius:var(--radius-sm)}.choice--radio .choice__indicator{border-radius:var(--radius-full)}.choice--radio .choice__indicator:after{background-color:var(--choice-accent);border:none;border-radius:var(--radius-full);height:.5rem;left:50%;top:50%;transform:translate(-50%,-50%);width:.5rem}.choice--radio .choice__input:checked+.choice__indicator{background-color:var(--color-surface)}.choice:hover .choice__indicator{border-color:var(--color-border-strong)}.choice--disabled .choice__indicator,.choice__input:disabled+.choice__indicator{background-color:var(--color-muted-bg);border-color:var(--color-border-subtle);box-shadow:none;opacity:.7}.choice--disabled .choice__indicator:after,.choice__input:disabled+.choice__indicator:after{background-color:var(--color-text-muted);border-color:var(--color-text-muted)}.choice__label{display:flex;flex-direction:column;gap:var(--space-1)}.choice__label-text{color:var(--color-text);font-size:var(--text-sm)}.choice__hint{color:var(--color-text-muted);font-size:var(--text-xs)}.form-control-wrapper{align-items:center;display:flex;position:relative;width:100%}.form-control-wrapper>.form-control{flex:1 1 auto;width:auto}.form-control--loading{cursor:progress;opacity:.55;pointer-events:none}.form-control--disabled{opacity:.45;pointer-events:none}.form-control--readonly{cursor:default;opacity:.75}.form-control--error{box-shadow:0 0 0 var(--border-width-strong) var(--color-danger)}.form-control--warning{box-shadow:0 0 0 var(--border-width-strong) var(--color-warning)}.form-control--success{box-shadow:0 0 0 var(--border-width-strong) var(--color-success)}.form-control--info{box-shadow:0 0 0 var(--border-width-strong) var(--color-info)}.form-control:disabled,.form-control[disabled]{background-color:var(--color-muted-bg);color:var(--color-text-muted);cursor:not-allowed}.form-control[readonly]{background-color:var(--color-surface-subtle);border-style:dashed;color:var(--color-text-muted)}.form-control--error:focus-visible{box-shadow:0 0 0 var(--border-width-strong) var(--semantic-error-border-strong,var(--color-danger))}.form-control-wrapper[data-icon=left] .form-control{padding-left:calc(var(--space-7) + var(--space-2))}.form-control-wrapper[data-icon=right] .form-control{padding-right:calc(var(--space-7) + var(--space-2))}.form-control-wrapper[data-icon=left] .form-control-icon,.form-control-wrapper[data-icon=right] .form-control-icon{align-items:center;display:flex;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.form-control-wrapper[data-icon=left] .form-control-icon{left:var(--space-2)}.form-control-wrapper[data-icon=right] .form-control-icon{right:var(--space-2)}.form-control-icon{color:var(--color-text-muted);font-size:var(--text-md)}.form-control-icon,.form-control-prefix,.form-control-suffix{position:absolute;z-index:1}.form-control-prefix,.form-control-suffix{align-items:center;color:var(--color-text-muted);display:inline-flex;font-size:var(--text-sm);pointer-events:none;position:static;white-space:nowrap}.form-control-prefix{margin-left:var(--space-3);margin-right:var(--space-2)}.form-control-suffix{margin-left:var(--space-2);margin-right:var(--space-3)}.form-control-group{align-items:stretch;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border-subtle);border-radius:var(--radius-md);display:flex;position:relative;width:100%}.form-control-group>*{background:transparent;border-radius:0;position:relative}.form-control-group>.form-control,.form-control-group>.form-control-wrapper{flex:1 1 auto}.form-control-group>.button{flex:0 0 auto}.form-control-group>:first-child{border-bottom-left-radius:var(--radius-md);border-top-left-radius:var(--radius-md)}.form-control-group>:last-child{border-bottom-right-radius:var(--radius-md);border-top-right-radius:var(--radius-md)}.form-control-group>*+*{box-shadow:inset var(--border-width) 0 0 var(--color-border-subtle)}.form-control-group .form-control:focus-visible{border-color:var(--focus-ring-color);box-shadow:inset var(--border-width) 0 0 var(--color-border-subtle),0 0 0 var(--border-width-strong) var(--focus-ring-color)}.form-control-group>.button,.form-control-group>.form-control,.form-control-group>.form-control-wrapper>.form-control{background:transparent;border:none}.form-control-group>.button{align-items:center;box-sizing:border-box;color:var(--color-text);display:inline-flex;height:var(--control-min-height);justify-content:center;line-height:1;padding:0 var(--space-3)}.form-control--loading:after{animation:formControlLoading 1.5s ease-in-out infinite;background:var(--color-surface-subtle);border-radius:inherit;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}@keyframes formControlLoading{0%{opacity:.35}50%{opacity:.6}to{opacity:.35}}.form-control--file{background-color:var(--color-surface);border:var(--border-width) dashed var(--color-border-subtle);border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;padding:var(--space-3);position:relative}.form-control--file[type=file]{background:none;border:none;padding:0;position:static}.form-control-file-surface{align-items:center;background-color:var(--color-surface);border:var(--border-width) dashed var(--color-border-subtle);border-radius:var(--radius-md);cursor:pointer;display:flex;flex-direction:column;gap:var(--space-2);justify-content:center;padding:var(--space-6);position:relative}.form-control-file-surface input[type=file]{bottom:0;cursor:pointer;left:0;opacity:0;position:absolute;right:0;top:0}.form-control-file-surface:hover{background-color:var(--color-surface-subtle);border-color:var(--color-border-strong)}.form-control-file-surface:focus-within{border-color:var(--focus-ring-color);box-shadow:0 0 0 var(--border-width-strong) var(--focus-ring-color)}.form-control-file-surface--disabled{cursor:not-allowed;opacity:.65;pointer-events:none}.form-control-file-surface--error{background-color:var(--color-danger-soft);border-color:var(--color-danger)}.form-control-file-surface--warning{background-color:var(--color-warning-soft);border-color:var(--color-warning)}.form-control-file-surface--success{background-color:var(--color-success-soft);border-color:var(--color-success)}.form-control-file-surface--info{background-color:var(--color-info-soft);border-color:var(--color-info)}.file-upload-inline{align-items:center;display:inline-flex;gap:var(--space-2)}.file-upload-inline__input{clip:rect(0,0,0,0);height:1px;overflow:hidden;position:absolute;width:1px}.file-upload-inline__label{cursor:pointer}.form-control-file-surface.form-control--loading:after{animation:input-loading-shimmer 1.5s infinite;background-image:linear-gradient(90deg,var(--color-muted-bg),var(--color-surface),var(--color-muted-bg));background-size:200% 100%;border-radius:inherit;bottom:0;content:"";left:0;position:absolute;right:0;top:0}.form-row{display:flex;flex-wrap:wrap;gap:var(--space-4)}.form-grid{grid-gap:var(--space-4);display:grid;gap:var(--space-4)}.form-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}@media (max-width:768px){.form-grid--four,.form-grid--three,.form-grid--two{grid-template-columns:1fr}}.form-message{align-items:flex-start;background-color:var(--color-surface-subtle);border:var(--border-width) solid var(--color-border-subtle);border-radius:var(--radius-md);display:flex;font-size:var(--text-sm);gap:var(--space-3);padding:var(--space-4) var(--space-6);width:100%}.form-message__icon{flex-shrink:0;height:1.25rem;width:1.25rem}.form-message__content{display:flex;flex-direction:column;gap:var(--space-1)}.form-message--neutral{color:var(--color-text-muted)}.form-message--error{background-color:var(--color-danger-soft);border-color:var(--color-danger)}.form-message--warning{background-color:var(--color-warning-soft);border-color:var(--color-warning)}.form-message--success{background-color:var(--color-success-soft);border-color:var(--color-success)}.form-message--info{background-color:var(--color-info-soft);border-color:var(--color-info)}.form-section--error,.form-section--info,.form-section--success,.form-section--warning{border-left:var(--border-width-strong) solid;padding:var(--space-3)}.form-section--error{border-color:var(--color-danger)}.form-section--warning{border-color:var(--color-warning)}.form-section--success{border-color:var(--color-success)}.form-section--info{border-color:var(--color-info)}.form-section--error:not(:last-child),.form-section--info:not(:last-child),.form-section--success:not(:last-child),.form-section--warning:not(:last-child){margin-bottom:var(--space-4)}

package/dist/components/hero.css

@@ -55,7 +55,7 @@
     --hero-border-color: var(--color-border-subtle);
     --hero-soft-bg: var(--color-surface-subtle);
 
-    --hero-full-overlay: linear-gradient(to bottom, rgba(0,0,0,0.4), rgba(0,0,0,0.0));
+    --hero-full-overlay: linear-gradient(to bottom, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.0));
 }
 
 /* ---------------------------------------------------------

package/dist/components/icons.css

@@ -230,6 +230,11 @@
     mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='4' y='3' width='8' height='2' fill='white'/%3E%3Crect x='7.375' y='5' width='1.25' height='5.5' fill='white'/%3E%3Cpath d='M5.5 9 L8 12.2 L10.5 9 Z' fill='white'/%3E%3C/svg%3E");
 }
 
+.icon--transfer {
+    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.5 2 L7.5 5 H6 V10 H3 V5 H1.5 Z' fill='white'/%3E%3Cpath d='M11.5 11 L8.5 8 H10 V3 H13 V8 H14.5 Z' fill='white'/%3E%3Crect x='2' y='12' width='12' height='2' fill='white'/%3E%3C/svg%3E");
+    mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.5 2 L7.5 5 H6 V10 H3 V5 H1.5 Z' fill='white'/%3E%3Cpath d='M11.5 11 L8.5 8 H10 V3 H13 V8 H14.5 Z' fill='white'/%3E%3Crect x='2' y='12' width='12' height='2' fill='white'/%3E%3C/svg%3E");
+}
+
 .icon--user {
     -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='5' r='3'/%3E%3Cpath d='M3 13c1.2-2 2.9-3 5-3s3.8 1 5 3'/%3E%3C/svg%3E");
     mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='5' r='3'/%3E%3Cpath d='M3 13c1.2-2 2.9-3 5-3s3.8 1 5 3'/%3E%3C/svg%3E");
@@ -390,6 +395,11 @@
     mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' xmlns='http://www.w3.org/2000/svg' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' fill='none'%3E%3Cpath d='M8 2l1.2 2.8L12 6l-2.8 1.2L8 10l-1.2-2.8L4 6l2.8-1.2L8 2z'/%3E%3Cpath d='M3 11l.6 1.4L5 13l-1.4.6L3 15l-.6-1.4L1 13l1.4-.6L3 11z'/%3E%3Cpath d='M13 9l.6 1.4L15 11l-1.4.6L13 13l-.6-1.4L11 11l1.4-.6L13 9z'/%3E%3C/svg%3E");
 }
 
+.icon--ai-text {
+    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' xmlns='http://www.w3.org/2000/svg'%3E%3Ctext x='2' y='12' font-family='Arial,%20sans-serif' font-size='9' font-weight='700' fill='white'%3EAI%3C/text%3E%3C/svg%3E");
+    mask-image: url("data:image/svg+xml,%3Csvg width='16' height='16' xmlns='http://www.w3.org/2000/svg'%3E%3Ctext x='2' y='12' font-family='Arial,%20sans-serif' font-size='9' font-weight='700' fill='white'%3EAI%3C/text%3E%3C/svg%3E");
+}
+
 /* ---------------------------------------------------------
    5. LOADER ICONS (GLYPHS ONLY)
 --------------------------------------------------------- */
@@ -958,7 +968,7 @@
 }
 
 .icon-container--muted {
-    background-color: var(--color-bg-subtle);
+    background-color: var(--color-bg-soft);
     color: var(--color-text-muted);
 }