/* Canvas interaction overrides: frame-style clipping + Figma-like selection chrome. */
.bm-canvas.editable{overflow:hidden!important}
/* During a direct pointer drag/resize, temporarily reveal overflow so the user can see
   the part being moved beyond the artboard, matching frame-editor interaction patterns. */
.bm-canvas.editable:has(.bm-object:active){overflow:visible!important}

/* Selection chrome: one device-pixel line and compact square handles. */
.bm-object.selected{outline:1px solid #0d99ff!important;outline-offset:-1px!important}
.bm-object>.bm-handle{
  width:5px!important;
  height:5px!important;
  min-width:5px!important;
  min-height:5px!important;
  max-width:5px!important;
  max-height:5px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid #0d99ff!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
  line-height:0!important;
}
.bm-object>.bm-handle.nw{left:-2px!important;top:-2px!important}
.bm-object>.bm-handle.n{left:50%!important;top:-2px!important}
.bm-object>.bm-handle.ne{right:-2px!important;top:-2px!important}
.bm-object>.bm-handle.e{right:-2px!important;top:50%!important}
.bm-object>.bm-handle.se{right:-2px!important;bottom:-2px!important}
.bm-object>.bm-handle.s{left:50%!important;bottom:-2px!important}
.bm-object>.bm-handle.sw{left:-2px!important;bottom:-2px!important}
.bm-object>.bm-handle.w{left:-2px!important;top:50%!important}

/* Keep guides hairline-thin as well. */
.bm-guide.vertical{width:1px!important}
.bm-guide.horizontal{height:1px!important}