/******** radius *******/
/******** 间隙 *******/
/******** fontSize *******/
/******** 组件尺寸 *******/
/******** z-index *******/
/******** borderSize *******/
/******** borderStyle *******/
/******** shadow distance *******/
/******** size *******/
/******** spacing *******/
/******** shadow *******/
/******** opacity *******/
/******** fontWeight ********/
/******** Animation *******/
/******** color *******/
/******** diff *******/
/******** icon hover *******/
/******** media *******/
.react-resizable.react-grid-placeholder {
  z-index: 0;
  background-color: var(--color-mask-bg);
}
.react-grid-item {
  background-color: var(--color-bg-3);
}
.react-grid-item:hover {
  z-index: 1;
}
.react-grid-item.edit {
  cursor: move;
}
.react-grid-item .react-resizable-handle {
  position: absolute;
  width: 20px;
  height: 20px;
  bottom: 0;
  right: 0;
  background: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEyIiB2aWV3Qm94PSIwIDAgMTIgMTIiIHdpZHRoPSIxMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtNC45ODA2NDE3NiA2LjUyNTg5OTgzdi0yLjUyNTg5OTgzYzAtLjU1MjI4NDc1LS40NDc3MTUyNS0xLTEtMS0uNTUyMjg0NzUgMC0xIC40NDc3MTUyNS0xIDF2NS45OTMyMTYwOWguMDAwOTkyNDZsLjAwMDAwMTAyLjAwMjAzNzU4IDYuMDE4MzY0OTkuMDA0MDcwMDZjLjAwMDIyNTI3LjAwMDAwMDE1LjAwMDQ1MDU0LjAwMDAwMDIzLjAwMDY3NTgxLjAwMDAwMDIzLjU1MTkxMTM4IDAgLjk5OTMyMzk2LS40NDc0MTI1OC45OTkzMjM5Ni0uOTk5MzIzOTYgMC0uNTUyMjg0NzUtLjQ0NzcxNTI1LTEtMS0xaC0yLjU0Mzk2N2wzLjUyNDYwODc2LTMuNTI2NDc5ODctMS40NzU5NzA5OC0xLjQ3MzUyMDEzeiIgZmlsbD0iIzYwNjA2MCIgZmlsbC1ydWxlPSJldmVub2RkIiBvcGFjaXR5PSIuNSIgdHJhbnNmb3JtPSJtYXRyaXgoLTEgMCAwIDEgMTIuOTgwNjQyIDApIi8+PC9zdmc+);
  background-position: bottom right;
  padding: 0 3px 3px 0;
  background-repeat: no-repeat;
  background-origin: content-box;
  box-sizing: border-box;
  cursor: se-resize;
  z-index: 1;
}
.react-grid-item .react-resizable-handle::after {
  display: none;
}
.react-grid-item .react-resizable-handle:hover {
  background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjEyIiB2aWV3Qm94PSIwIDAgMTIgMTIiIHdpZHRoPSIxMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtNC45ODA2NDE3NiA2LjUyNTg5OTgzdi0yLjUyNTg5OTgzYzAtLjU1MjI4NDc1LS40NDc3MTUyNS0xLTEtMS0uNTUyMjg0NzUgMC0xIC40NDc3MTUyNS0xIDF2NS45OTMyMTYwOWguMDAwOTkyNDZsLjAwMDAwMTAyLjAwMjAzNzU4IDYuMDE4MzY0OTkuMDA0MDcwMDZjLjAwMDIyNTI3LjAwMDAwMDE1LjAwMDQ1MDU0LjAwMDAwMDIzLjAwMDY3NTgxLjAwMDAwMDIzLjU1MTkxMTM4IDAgLjk5OTMyMzk2LS40NDc0MTI1OC45OTkzMjM5Ni0uOTk5MzIzOTYgMC0uNTUyMjg0NzUtLjQ0NzcxNTI1LTEtMS0xaC0yLjU0Mzk2N2wzLjUyNDYwODc2LTMuNTI2NDc5ODctMS40NzU5NzA5OC0xLjQ3MzUyMDEzeiIgZmlsbD0iIzAwNjRmZiIgZmlsbC1ydWxlPSJldmVub2RkIiB0cmFuc2Zvcm09Im1hdHJpeCgtMSAwIDAgMSAxMi45ODA2NDIgMCkiLz48L3N2Zz4K);
}
.pd-GridLayout {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.pd-GridLayout-content {
  align-self: stretch;
  height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
}
.pd-GridLayout-content.isEdit {
  background-color: var(--color-fill-3);
  background-attachment: local, scroll;
  overflow-y: scroll;
}
.pd-GridLayout-content.isOnlyScreen {
  overflow: hidden;
}