/* CUIDim - mirrors cui_dim.dart. AnimatedOpacity: 1.0 <-> dimOpacity (0.5), 200ms, Curves.easeOut. Opacity only; hit testing untouched.
   Props as custom props: --_opacity (dim level), --_dur (ms). Entrance replay: .cui-dim--anim runs a one-shot fade from --_from to --_to. */
.cui-dim {
  --_opacity: 0.5; --_dur: 200; --_from: 1; --_to: 1;
  opacity: 1; transition: opacity calc(var(--_dur) * 1ms / var(--cui-speed, 1)) cubic-bezier(0, 0, 0.58, 1);
}
.cui-dim.is-dimmed { opacity: var(--_opacity); }
.cui-dim--anim { animation: cui-dim-fade calc(var(--_dur) * 1ms / var(--cui-speed, 1)) cubic-bezier(0, 0, 0.58, 1) both; }
@keyframes cui-dim-fade { from { opacity: var(--_from); } to { opacity: var(--_to); } }
/* demo tiles (story only) */
.cui-dim-demo { display: flex; gap: var(--cui-space-sm); align-items: flex-start; }
.cui-dim-demo__tile { box-sizing: border-box; width: 140px; padding: var(--cui-space-sm); display: flex; flex-direction: column; gap: 2px;
  background: var(--cui-color-surface-bg-default); border: var(--cui-border-default) solid var(--cui-color-border-default);
  border-radius: var(--cui-radius-lg); color: var(--cui-color-text-default); }
.cui-dim-demo__name { font: var(--cui-type-body-md-semi-weight) var(--cui-type-body-md-semi-size)/round(up, var(--cui-type-body-md-semi-line), 1px) var(--cui-type-body-md-semi-family); }
.cui-dim-demo__qty { font: var(--cui-type-body-sm-weight) var(--cui-type-body-sm-size)/round(up, var(--cui-type-body-sm-line), 1px) var(--cui-type-body-sm-family); color: var(--cui-color-text-muted); }