.bui-picker-panel {
  --bui-picker-option-disabled-opacity: 0.38;
  flex: 1;
  flex-shrink: 0;
  position: relative;
  font-family: var(--bui-font-family);
}
.bui-picker-panel-roller {
  transform: rotate3d(1, 0, 0, 60deg);
  transform-style: preserve-3d;
  position: absolute;
  top: var(--indicator-top);
  width: 100%;
  height: var(--option-height);
}
.bui-picker-panel-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image:
    linear-gradient(
      180deg,
      var(--bui-color-bg-alpha-light-9),
      var(--bui-color-bg-alpha-light-3)),
    linear-gradient(
      0deg,
      var(--bui-color-bg-alpha-light-9),
      var(--bui-color-bg-alpha-light-3));
  background-position: top, bottom;
  background-size: 100% var(--indicator-top);
  background-repeat: no-repeat;
  transform: translateZ(0);
}
.bui-picker-panel-indicator {
  position: absolute;
  top: var(--indicator-top);
  height: var(--option-height);
  width: 100%;
  border-top: 1px solid var(--bui-color-border-default);
  border-bottom: 1px solid var(--bui-color-border-default);
}
.bui-picker-panel-option {
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  height: var(--option-height);
  line-height: var(--option-height);
  color: var(--bui-color-fg-default);
  font-size: var(--option-font-size);
  backface-visibility: hidden;
  width: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}
.bui-picker-panel-option-disabled {
  opacity: var(--bui-picker-option-disabled-opacity);
}
.bui-picker-panel-option-hidden {
  visibility: hidden;
  opacity: 0;
}
