[data-ds-shape=square],:host([data-ds-shape="square"]){--ds-corner-size: 0px;--ds-corner-shape: round;--ds-button-inset: .5px}[data-ds-shape=rounded],:host([data-ds-shape="rounded"]){--ds-corner-size: 4px;--ds-corner-shape: round;--ds-button-inset: 2.5px}[data-ds-shape=circular],:host([data-ds-shape="circular"]){--ds-corner-size: 999px;--ds-corner-shape: round;--ds-button-inset: 5px}@supports (corner-shape: squircle){[data-ds-shape=rounded],:host([data-ds-shape="rounded"]){--ds-corner-size: 8px;--ds-corner-shape: squircle}}:root,:host,:where([data-ds-surface]){--ds-unit: calc(var(--ds-1, 20px) * var(--ds-sf, 1));--ds-control-height: calc(var(--ds-control-size, var(--ds-08, 16px)) * var(--ds-sf, 1));--ds-row-height: calc(var(--ds-row-size, var(--ds-1, 20px)) * var(--ds-sf, 1));--ds-type-size-default: calc(var(--ds-text-size, 14px) * var(--ds-sf, 1));--ds-type-size-small: calc(var(--ds-small-text-size, 10px) * var(--ds-sf, 1));--ds-type-size-heading: calc(var(--ds-heading-text-size, 13px) * var(--ds-sf, 1));--ds-type-size-display: calc(var(--ds-display-text-size, 20px) * var(--ds-sf, 1));--ds-type-lineheight-default: calc(var(--ds-text-leading, 16px) * var(--ds-sf, 1));--ds-type-letterspacing-default: calc(var(--ds-text-tracking, -.3px) * var(--ds-sf, 1));--ds-radius: calc(var(--ds-corner-size, 4px) * var(--ds-sf, 1));--ds-radius-card: calc(var(--ds-card-corner-size, 4px) * var(--ds-sf, 1))}.ds-stat{box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;min-width:0;margin:0;color:var(--ds-text-color);font-family:var(--ds-typeface-regular);font-feature-settings:var(--ds-font-features);font-size:var(--ds-type-size-default);font-weight:var(--ds-type-weight-default);line-height:var(--ds-unit);letter-spacing:var(--ds-type-letterspacing-default);text-transform:none}.ds-stat__label,.ds-stat__figure,.ds-stat__caption{box-sizing:border-box;max-width:100%;margin:0;font:inherit;letter-spacing:inherit}.ds-stat__label,.ds-stat__caption{display:flex;align-items:flex-start;min-height:var(--ds-unit);color:var(--ds-text-color-muted);overflow-wrap:anywhere}.ds-stat__icon{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--ds-unit);height:var(--ds-unit)}.ds-stat__figure{display:block;overflow:hidden;font-family:var(--ds-stat-typeface, var(--ds-typeface-medium));font-size:calc(var(--ds-stat-size, var(--ds-display-text-size, 20px)) * var(--ds-sf, 1));font-weight:var(--ds-type-weight-bold);font-variant-numeric:tabular-nums;line-height:calc(var(--ds-stat-lines, 2) * var(--ds-unit));min-height:calc(var(--ds-stat-lines, 2) * var(--ds-unit));letter-spacing:calc(var(--ds-display-text-tracking, -.4px) * var(--ds-sf, 1));white-space:nowrap;text-overflow:ellipsis}.ds-stat__digit{display:inline-block;width:var(--ds-stat-digit, 1ch);text-align:center}.ds-stat--danger .ds-stat__figure{color:var(--ds-danger-color)}.ds-stat--warning .ds-stat__figure{color:var(--ds-warning-color)}.ds-stat__change{display:inline-flex;flex:none;align-items:center;height:var(--ds-unit);margin-inline-end:calc(4px * var(--ds-sf, 1));color:var(--ds-stat-change-color, var(--ds-text-color));font-variant-numeric:tabular-nums;white-space:nowrap}.ds-stat__change--danger{--ds-stat-change-color: var(--ds-danger-color)}.ds-stat__change--warning{--ds-stat-change-color: var(--ds-warning-color)}.ds-stats{box-sizing:border-box;display:grid;grid-template-columns:repeat(auto-fill,min(100%,calc(var(--ds-stats-width, 8) * var(--ds-unit))));gap:var(--ds-unit);margin:0;padding:0;list-style:none}.ds-stats>li{min-width:0;margin:0}:root{color-scheme:light;--sf: 1;--ds-sf: var(--sf)}html,body{margin:0;background:var(--background);color:var(--text-color);font-family:var(--typeface-regular);font-size:var(--ds-type-size-default);line-height:var(--ds-unit)}body{padding:calc(2 * var(--ds-unit)) var(--ds-unit) var(--ds-unit)}#sample{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-unit)}#sample>:is(ds-input,ds-bento,ds-card,ds-accordion,ds-table,ds-form,ds-list,ds-container,ds-page,ds-notice,ds-empty,ds-meter,ds-steps,.ds-stats){flex-basis:100%}#sample>ds-carousel{flex-basis:100%;min-width:0}body[data-example-id=gap] #sample{display:block}.grid-controls{display:flex;flex-wrap:wrap;gap:calc(10px * var(--ds-sf, 1));width:100%}.grid-controls label{display:flex;flex-direction:column;gap:calc(4px * var(--ds-sf, 1));font-size:var(--ds-type-size-small)}.grid-controls ds-select{width:calc(5 * var(--ds-unit))}#event-output{display:block;margin-top:var(--ds-unit);color:var(--text-color);font-size:var(--ds-type-size-small);overflow-wrap:anywhere}button:not([data-library-reference]){font:inherit;line-height:var(--ds-unit);border:0;border-radius:var(--ds-radius);color:var(--black);background:var(--accent-color);padding:0 calc(4px * var(--ds-sf));cursor:pointer}